GitHub Page Update

Goals

• Increase proficiency in HTML, CSS, and JavaScript by implementing more complex features.
• Scalable for future project additions and website changes.
• Simple, modern web interface that effectively communicates contents.
• Design for users both on and off GitHub.
• Capable of handling a moderate amount of web content related to project hosting.
• Accessible on both desktop and mobile devices.

Constraints

The project is hosted on GitHub Pages which have the following usage limits:

• Sites must be no larger than 1 GB in size.
• Soft Bandwidth limit of 100 GB per month.
• Soft Bandwidth limit of 10 builds per hour.

Technical Constraints:

• Not designed to handle large amounts of web traffic.
• Site data is stored in the GitHub repository. Data input will be added through commits in GitHub.

Challenges

• Changing the hover states for social media icons.
• Alternating icons for the change theme button.
• Reducing repetitive code.
• Maintaining site accessibility for every user.
• Adjusting site theme to maintain optimal color contrast. MDN Web Docs Color Contrast
• Alternating site images to correspond to the current theme.

Lessons Learned

• When feeling stressed about implementing a feature, take a break and focus on something else. Working under stress can lead to less efficient solutions.
• Look ahead when writing code. If you anticipate solving the same problem again, create a function.
• Don't be afraid to look something up; you may discover new language features and more efficient ways to solve a problem.
• Research the target audience before implementing features.
• It's more efficient to implement features using HTML and CSS; only use JavaScript when necessary.

Tags

• #Web Development
• #Web Design
• #HTML
• #CSS
• #JavaScript
• #Figma
• #GitHub Pages