recreating the google homepage
One of the first projects that is encountered in the Odin Project curriculum is to attempt to recreate the www.google.com homepage. This project is part of the Web Dev 101
course and is intended to be hands-on introduction to basic HTML
and CSS
syntax and structure.
The current version of my attempt to mimic the Google Search homepage can be found on this page of my website. I found myself restarting from scratch after my first two attempts. The struggles in each attempt helped me rethink how to structure the HTML
of the website to make styling via CSS
simpler by using class
for broad formatting of elements within a section and id
attributes for specific elements.
I have gotten my version to a good facsimile of the original. I think I will also attempt the suggested follow-up exercise of trying to reproduce the search results page.
Another thing I want to attempt is implementing a simple javascript button element that mimics the “I’m Feeling Lucky” hover feature of scrolling through a list of different variations of “I’m Feeling (…)” string. I have seen some examples of this implemented by using a ul
element that is randomly transformed a certain set distance from the initial li
to a later li
to mimic the scrolling effect.