What was the goal?
What did I learn?
Although I did not learn any new technologies, I solidified my knowledge of the bootstrap framework. I was able to add new snippets of useful code to my library and follow new ideas on how to handle certain design techniques. Since the focus was on reducing load time I was able to optimize the web page to load as fast as 575 milliseconds according to Pingdom. I learned the importance of minimizing file sizes when possible which includes removing comments for production, combining multiple .css files into one, and compressing lines of text into a single line. In general, the smaller the file size the less of a burden the server must carry.
What did I enjoy?
The content piece for this project was the coffee cup hero image. Having a strong, stunning hero image brings life to the webpage and adds a default color scheme to work off of. Choosing a color scheme that works has always been a struggle for me, but I learned that color schemes can play off of content.
What did I dislike?
I really dislike that this is a fictional web page. I feel like this is one of my strongest projects thus far and I would like to see this being used in a live environment. This project still seems very expandable. The design was meant to be a single page, but I could definitely work off this more had I chose to.
What could I do better next time?
- Time management is a definite area of potential improvement for me. I spent maybe a week’s time working on this page, and maybe 10 hours total. A good portion of the time working on it is remember where I left off or picking it up again. If I were to dedicate a longer segment of time to develop a project I believe my results and efficiency would be better.
- I would like to expand my font library. I feel comfortable with a few fonts and I mainly reuse them over and over. Becoming acquainted with different font faces could benefit me in the future.
Technologies and Tools used?
- Bootstrap framework – responsible for consistency and responsiveness of website
- Unsplash – free high-quality, open-source images
- Font Awesome 5 – high-quality .svg images for all my icons
- Pinterest – inspiration for coffee shop menus
- Pingdom – analytics and statistics on page speeds
- Frontend Checklist – a great tool for making sure every ‘i’ is dotted before releasing a web project
- Google Fonts – awesome library for fonts and easy integration on all projects
- Google Pagespeed Insights – another great too