Site name: CSS Ocean Garden: The Beauty of CSS Design
Site purpose: to demonstrate how a designer can create powerful designs using CSS.
- The website's URL is: https://www.csszengarden.com/210/. I chose this website because I loved the feeling of it. I immediately felt peace as I scrolled deeper and deeper into the ocean. I thought scrolling down the picture while scrolling through the website was brilliant. I felt drawn to keep scrolling in an immersive environment. I also like the use of space to create very defined sections. The colors are consistent, matching the fish, and are used to give flavor to the different headings.
- The website does not validate and has four warnings. All of the warnings are for unnecessary code.
- I chose the “send us a link” page where someone can submit their own created page. The validator shows one warning that the article lacks a heading.
- There are four warnings on the home page, and one warning on the page I chose in #3.
- I give this website’s design a rating of 7. The color choices, to me, are soothing and consistent. The design is simplistic and easy to follow. I thought the shadowing under each section provided a nice 3D feel. As mentioned previously, I enjoyed how the background image brings visitors deeper and deeper into the ocean as they scroll down. The one fault I found in the background image is if I zoom in to make the text larger to read, at some point the picture began to cover up the words. Although the page used good contrast in colors between the background and text, I still find it a bit hard to read, hence me needing to size up my screen with “ctrl +”.
- I give this website’s usability a rating of 9. I found the website very easy to use. However, if I needed to make the font bigger with “ctrl +” eventually the picture covers up the words so then it’s a bit harder to use the website. There was a broken link on the bottom of the home page. I also find it easier when a link opens a new tab, since I mainly do my homework and other online activities on a desktop versus mobile device. Though, personally I prefer a new tab on my mobile device as well so I can go click on a website I was on five clicks ago without needing to hit the back button.
- I believe this website served it's purpose in showing another way a website can be made well using CSS. I think it's really inspiring that there's this website of all different kinds of designs using CSS!