Webpage URL: https://zhuzhu930.github.io/Homework1-JD/
For my first homework, I've done the following steps:
- Check the "link" and "a" tags to see whether everything works. I found the link of "search-engine-optimization" is not working properly.
- Check the tags. I've found that the original html was marked with mainly "div" tags, not semantic tags.
In HTML, I've made the following changes:
- changing the "title" content into "Horiseon Website", though this part won't show on the page, it makes the computer know more about what this file is about.
- changing the "div" tags in the header part into "header" tag. Changing the nested "div" tags into "nav" tag to show the 3 links in the navigation bar. I've also made corresponding changes in the CSS file.
- changing the "div" with id="hero" into a more proper "img" tag with source link.
- According to the w3schools, the typical layout of a webpage is:
So I made the left part into a section, by using "section" tag. In the first "div", I need to add an "id" for "search-engine-optimization" so it links to the navigation menu.
- According to the layout I've shown above, I've made the right part into a side bar by using "aside" tag.
- According to the layout picture, I've changed the last "div" into "footer" since this part serves as a footer of the page.
- I've added some comments in the HTML to clarify my changes.
- I did my research on w3schools, MDN web docs to understand the functionalities of tags.
- I also found that by using "inspect" feature on a webpage can help me get what I want quicker.