Final Project
Project Three
Project Two
Project One Reflection
Stepping into this project, I definitely felt very overwhelmed and lost when it came to building a webpage. While creating this project, I definitely found myself doing a lot of Google search to help smooth out coding and referencing the FreeCodeCamp lessons along with lecture and W3 Schools Resources to make Project One.
After completing this project, something that really stands out to be about each page design are how photographs are displayed using advanced CSS visual presentation techniques and the varied typography that are used. While completing the project, setting the varied fonts were pretty straight forward. But when it came to the photographs, I knew that I wanted to feature several photographs to help show off my hometown a little bit more. I was able to find a few different techniques through W3 Schools to help with the coding. (Side note: All of the photos used in this project are ones that I have taken.)
One of the issues that I ran into dealt with spacing for each page's title font, because the title of the page had a different type of font than the body it created extra white space on the page. To resolve it, I had to create a specific class to address the spacing that I was able to use to help minimize the white space.
Another issue that I ran into was trying to design the Project One Home page. I wanted to stack the type next to the photograph in two columns. Once I had the css written correctly for the page, I realized that if the webpage was being viewed on a smaller device the text got squished (shown in the picture). To fix this, I had to add a specific media query for a smaller screen to move the text below the image.
Honestly, for the first time building a website I am pretty proud of how this turned out. I think that this project shows off my hometown and love for the outdoors. In the future, I would love to learn more about how to create longer home pages that contain more than just a photograph and how to use photographs as active links to link to external websites.