Forum Moderators: buckworks

Message Too Old, No Replies

How can I check my site's semantic coding?

         

onlinesource

7:31 pm on Jul 31, 2015 (gmt 0)

10+ Year Member Top Contributors Of The Month



I been reading up about semantic coding with html, including <article>, <nav>, etc. My Magento shopping cart doesn't use html but was built using peer elements, I believe. Still, are there any tools online that will go through my site and try to see if it understands my coding and can make sense of it.

For instance, my source code says <div class="main container"> which I believe is the same as <main> but I would like to know that my site is properly structured and each part of it is formatted the right way to signify the navigation area, the header area, etc.

Looking for some suggestions.

bird

12:24 pm on Aug 1, 2015 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



What's the consequence of using
<main>
instead of
<div class="main container">
?
For now, the primary consequence is that it's shorter to write and easier to read for you when editing your HTML and CSS.

Years into the future, there may actually be tools out there (eg. search engine spiders) that will use such coding to determine where the content of your page is stored, as opposed to navigation, ads, etc.
Or did I miss any relevant tools already doing that out there?

And of course that also only applies to tag names defined in some public standard. Once you start defining your own tags, only you and your own tools will be able to make "semantic" sense of them.

lucy24

6:03 pm on Aug 1, 2015 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



my source code says <div class="main container"> which I believe is the same as <main>

Mmnn, not really. <div> is an element and <main> is an element, while .main and .container are style classes.

It may, coincidentally, happen that the styling your CSS has defined for the two classes ".main" and ".container" --with an outside option on ".main.container" in combination --is the same as the styling your browser applies, on its own initiative, to the element "main". But that doesn't make them "the same" in any meaningful way.

By itself the <div> element doesn't mean anything. It's just a matrix or armature that you can attach block-level styles to.

If you are using a major CMS-- you said Magento, right? --you can be certain the search engines already know the names of its more common style classes, and therefore "know" what a page looks like even before consulting the CSS.

onlinesource

2:55 pm on Aug 4, 2015 (gmt 0)

10+ Year Member Top Contributors Of The Month



I do use Magento, but still have concerns that my coding may not be functioning correctly. To be certain, I wanted to test things and was wondering if there was a way to do so?