Thibaultβ’ 110
@Thibs13
Submitted
Carlos Al
@crsaele
All comments
- Carlos Alβ’ 160
@crsaele
Posted
Hey there, fellow developer!
When it comes to building websites, it's easy to get caught up in the excitement of creating something new and just use a bunch of <div> and <section> elements to get the job done. But, trust me, taking the extra step to write semantic HTML is totally worth it!
So, what's the big deal about semantic HTML? Well, let me break it down for you:
Search Engine Optimization (SEO)
Search engines like Google love semantic HTML because it helps them understand the structure and content of your website. By using specific elements like <header>, <nav>, <main>, and <footer>, you're giving search engines a clear picture of your website's layout and content. This can improve your website's visibility and ranking in search results!
Accessibility
Semantic HTML is a game-changer for accessibility. Screen readers and other assistive technologies can better interpret your website's content when you use specific elements like <button>, <label>, and <table>. This means that users with disabilities can more easily navigate and understand your website.
Code Readability and Maintenance
Let's face it, code can get messy quickly! Semantic HTML helps keep your code organized and easy to read. When you use specific elements, you can quickly identify the purpose of each section of code. This makes it easier to maintain and update your website over time.
Future-Proofing
As web development continues to evolve, new technologies and features are being added all the time. By using semantic HTML, you're future-proofing your website for upcoming advancements. For example, when new accessibility features are introduced, your website will be better equipped to take advantage of them.
In conclusion, writing semantic HTML is an important part of building a website that's not only functional but also accessible, search engine friendly, and easy to maintain. So, take the extra time to learn and use semantic HTML elements β your users (and search engines) will thank you!
Happy coding!
@crsaele
0 - Kiran Pillaiβ’ 80
@DetonatedSkull1722
Submitted
What are you most proud of, and what would you do differently next time?
The amount of effort i put into this was really too much, I got too bored even, but i kept going i am honestly just proud about that
What challenges did you encounter, and how did you overcome them?
The table thing in the bottom, it was really brain boggling because you can just use a normal table for that
What specific areas of your project would you like help with?
nothing at the moment
Carlos Alβ’ 160@crsaele
Posted
When displaying tabular data, using the <table> element and its related elements (<td>, <th>, <tr>, etc.) is better than using generic <div> elements for several reasons:
*Accessibility: Screen readers and other assistive technologies can identify and interpret table structures, making it easier for users with disabilities to understand and navigate the data.
*Semantic meaning: Table elements provide clear semantic meaning to the content, allowing search engines and other machines to understand the data's structure and relationships.
*Easier styling: Table elements have built-in styling and layout rules, making it easier to create visually appealing and consistent table designs with less CSS.
*Improved readability: Table elements help to create a clear and organized presentation of data, making it easier for users to scan and understand the information.
Using <div> elements to create a table-like structure can lead to confusing and inaccessible content, so it's best to use the right tool for the job β the <table> element and its friends!
0 - mahmoud17-cmykβ’ 300
@mahmoud17-cmyk
Submitted
What are you most proud of, and what would you do differently next time?
that I am quickly growing accustomed to writing code and becoming more adept at handling it
What challenges did you encounter, and how did you overcome them?
Once you get used to the challenges, they become less difficult.
What specific areas of your project would you like help with?
CSS properties that align items
Carlos Alβ’ 160@crsaele
Posted
You might want to use more semantic html tags to enhance your structure.
Using semantic HTML tags (like <header>, <nav>, and <main>) instead of generic <div> elements is a game-changer for accessibility and SEO.
It helps screen readers and search engines understand the structure and meaning of your content, making it easier for everyone to find and use your website.
0 - polinagusakovaβ’ 230
@polinagusakova
Submitted
What are you most proud of, and what would you do differently next time?
I used Javascript to solve the problem.
What challenges did you encounter, and how did you overcome them?
How to change color in element, when click on different item.
Carlos Alβ’ 160@crsaele
Posted
Great work it looks really good on different screen sizes π
0 - Divyam Sharmaβ’ 160
@Divyamsharma-18
Submitted
What are you most proud of, and what would you do differently next time?
I'm just proud of doing it so effortlessly, next time I'll do it with time boundation.
What challenges did you encounter, and how did you overcome them?
None
What specific areas of your project would you like help with?
None tbh.
Carlos Alβ’ 160@crsaele
Posted
I congratulate you for your efforts π
If anything i would say try to write more semantic html.
It is highly recommended to utilize semantic HTML elements, such as <main></main>, instead of generic <div></div> tags, to provide a clear structure and meaning to your content. This approach not only enhances code readability but also improves accessibility and search engine optimization (SEO).
Writing semantic HTML is important for accessibility, SEO, code readability and maintainability, cross-browser compatibility, and future-proofing.
By using appropriate HTML elements, you can create a clear and consistent structure for your content, making it easier for users, search engines, and other developers to understand and interact with your website.
Marked as helpful
1 - MartinCermanβ’ 70
@MartinCerman
Submitted
One of my first projects. I struggled with semantic tags and css classes so I'd appreciate a comment on that. Which tags are chosen correctly and which aren't? Thanks!
Carlos Alβ’ 160@crsaele
Posted
It looks good.
You should try putting your css styles in a different file so your code doesn't look as messy.
Fix your media query :)
Happy coding.
1
