. 4. Where other HTML elements such as p, em, and so on, accurately represent the semantics of the content, the additional use of span and div tags leads to better accessibility for readers and easier maintainability for authors. For example, instead of using div id="header" you can use a header tag. The content of the element has its meaning, and it is easily differentiated from the rest of the webpage content. The easier it is to read and understand that code, the easier it makes your job. We will see some examples using span tag with user attractive requirements like color shedding etc. When it comes to describing what ‘semantic HTML’ means, we can go straight to the definition of the word ‘semantics’ to help us. From reading up on the section vs div issues it really seems that it is up to personal preference and traditional thinking. Learn to code for free. The HTML markup consists of two kinds of elements: semantic and non-semantic ones. You should use
when there is no other more semantically appropriate element that suits your purpose. Notice that the design (the orange blocks) are not being used to define the semantic areas of the page. They would often give these elements a class or id attribute to describe their purpose. They are the design of the page — for humans. HTML 5 will come with tags that have structural semantic meaning and a table-based layout for CSS. Semantic elements are essentially
tags, except they provide additional semantic information to the browser (and to developers). The
element often appears within a