This repo covers the refactoring of Horiseon's webpage using semantic html. The aim was to create a well-structured webpage which is optimized for search engines and has the functionality to support assistive technologies. HTML and CSS was used to complete this project.
Since, this was all new to me, I found it quite interesting to learn the importance of semantics and how it contributes to the site architecture. Particulary, how it separates presentation from content, making the site more readable to both humans and computers. Also, interesting is its contribution to improving accessibility, SEO, and maintenance.
To use this webpage, click on the following link: https://russkinori.github.io/refactoring-horiseon/.
A browser window will open and load the webpage. You can then navigate through the page by clicking on the Search Engine Optimization, Online Reputation Management and Social Media Marketing links within the header, at the top right of the page. Otherwise, feel free to scroll through the webpage using either your mouse or the arrow keys on your keyboard. A visual representation of the page can be seen in the screenshot below.
Please note that the webpage is only optimized for desktop clients so will change appearance based on the window size
Material used to facilitate the learning experience is listed below:
- https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax
- https://github.com/matiassingers/awesome-readme
- https://youtu.be/ZThq93Yuwd0
- https://developer.mozilla.org/en-US/docs/Web/CSS
- https://developer.mozilla.org/en-US/docs/Glossary/Semantics#semantics_in_css
- https://developer.mozilla.org/en-US/docs/Web/HTML
Licensed under the MIT