In this exercise, most generic div tags were replaced with appropriate semantic tags to illustrate the concept of semanatic tags. Good coding practices were employed by applying the DRY method. Various classes that served a similar purpose were consolidated into one class to ensure the neatness and readability of the code. Finally, the code was improved to be more SEO-friendly by adding alt texts to images, including a meta description, optimzing images files for performance and etc.
- Semantic tags
- Proper HTML and CSS structure
- A SEO descriptive title
- A SEO descriptive meta tag
- SEO optimized images
- SEO descriptive alt text
- Git clone the repository.
- Open
index.htmlin a browser of your choice.
- HTML
- CSS
- https://huirayj.github.io/horiseon-seo-project/
- https://github.com/huirayj/horiseon-seo-project#horiseon-seo-project
- https://developer.mozilla.org/en-US/docs/Glossary/Semantics
- https://www.semrush.com/blog/semantic-html5-guide/
- https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Organizing
- https://www.searchenginewatch.com/2016/01/21/seo-basics-22-essentials-you-need-for-optimizing-your-site/
Some changes in index.html
Some changes in style.css