Ashley Burke https://a1-aburke921.glitch.me
This project shows ...
- Styled page with CSS:
- When the "Previous Courses" or the "Experience" button is hovered over, the button scales and increases in size.
- When the link inside the footer is hovered over, the text changes color to resemble the link is active and clickable.
- The icons and text inside of the circle buttons are centered and positioned to fit fully inside the circle button.
- Different sized font is used throughout the webpage to show areas of the webpage that are meant to catch your eye more.
- The footer of the webpage is bound to the bottom of the screen despite there being not enough content for it to just be placed after the other elements.
- JavaScript animation: When either the "Previous Courses" or the "Experience" button is clicked on, a popup will appear displaying the proper information. To exit out of the popup, anywhere on the webpage can be clicked on.
- Used other HTML tags: In my website I incorporated the use of following tags:
img(to add an image of myself)a(to create a link to my LinkedIn)span(to create circle elements)table(to organize how experience I am in various skills)footer(added a footer that is bound to the bottom of the page)ul/li(displayed the courses I have previously taken in list format)
- Created a color pallet using color.adobe.com: Used a color pallet by implementing a pallet of colors using CSS to bring my webpage together. The color pallet used was
- Used the Vast Shadow Font from Google Fonts: I used Vast Shadow as the font all text within my site.
- Used the school and engineering icon from Google Icons: I used the school and engineering icon to add visuals to the buttons on my site.
- Cropped image in circle and centered: Rather than displaying the entire picture of my self, I cropped around my face with a circle outline, centering it at the heading of the page. This was very difficult to be able to center on the page and be able to get my face visible rather than just the top left corner of the image.