Andrew Kerekon https://a1-akerekon.glitch.me/

This project shows a small, profile webpage about my interests, hobbies, classes taken, and programming experience programmed in HTML, CSS, and JavaScript.

Technical Achievements

• Styled page with CSS: Added rules for the a, h1, h2, table, th, td, ul, and button selectors, as well as rules for the center, iconImages, familyPhoto, colorWheel, colorButton, iconContainer, buttonContainer, and padRight classes for proper formatting, color scheme, and font usage. These were challenging as I needed to brush up on formatting, especially how to center images and text
• Added JavaScript animations: Added "fade-in" animation on the page body so that all text and images slowly appear over 3 seconds, as well as a background color selector script to change the background to one of four color-blind-safe colors. These were challenging as I needed to make sure to properly time the animation so users could see it occurring, but not have it take too long so users wouldn't get annoyed that the page was taking a while to load
• Experimented with HTML tags: Added img, table (and table header/table data), as well as ul (and li) elements to add images, structure the classes I've taken, and list my experience with several programming technologies. These were challenging as I needed to research how to create lists and tables within HTML and best structure the table so that it would be "wide" and better cover the page, rather than having the user scroll from top-to-bottom

Design Achievements

• Used the Arvo and Open Sans Fonts from Google Fonts: I used Arvo as the font for my headers as well as Open Sans for the body of my webpage, both of which are designed with legibility and accesibility in mind. This was somewhat challenging as I needed to research the best fonts for accessibility and make sure they fit the general "theme" I was hoping to design
• Created a color palette using color.adobe.com: Styled a neutral color palette using five color-blind-safe colors that are accessible to users with Deuteranopia, Protanopia, and Tritanopia, with one main color for the headers as well as four user-selectable background themes. This was challenging as I needed to make sure no colors were too close to one another and make it accessible to as many users as possible