The focus of this post was to include new information from Colt Steele Web Developer Bootcamp Updated Version.

HTML: Next Steps and Semantics

          -What Exactly is HTML5?
           -Block vs. Inline Elements - Divs and Spans
           -Odd Elements: HR, BR
           -Entity Codes
           -Intro to Semantic Markup 
           -Playing with Semantic Elements-
 

What Exactly is HTML5?

HTML5 is the standard that defines HTML. HTML is basically a set of instructions for how HTML should work.

Block vs. Inline Elements – divs and Spans

Inline elements fit in alongside other elements
Block level elements take up a whole “block” of space.

divs are block level elements that function like a container
spans are inline elements that do not take up their own block of content

Odd Elements: HR, BR

hr – is a horizontal ruler it functions like a divider
br – is a line break in the content

Entity Codes

HTML Entities start with ampersand and end with a semicolon &code;
The entities are used to display reserved characters, that normally would be invalid.
They are also used in place of difficulty to type characters.
The browser interprets them and renders the correct character instead.

Intro to Semantic Markup

Semantic Markup makes your code more tolerable, friendly to other applications such as screen readers. Semantics help explain what the code is and what it is suppose to be used for.

Playing with Semantic Elements

Instead of always using divs to organize the content on a web page it is important to replace the divs with semantic markup.

-section -represents standalone which doesn't have a more specific semantic element to represent it contained with an HTML document. Typically, but not always sections have a heading.

-article represents a self-contained composition in a document, pages or sites which is intended t-o be independently distributed or reusable. An example would be a form post, magazine or newspaper article and blog entry.

-nav -represents a section of a page whose purpose is to provide navigation links, either within the current document or to other documents. Common uses of nav is menus, tables, and indexes

-main -used for dominant content of the

of a document. Main content are consist of content that is directly related to or expands upon the central topic of a document or the central functionality of an application.
Content that is repeated across a set of documents sections such as sidebars, navigation links, copyright information, site logos, and search forms.

-aside -represents a portion of a document whose content is only indirectly related to the documents main content. Asides are frequently presented as sidebars or call-out boxes.