This presentation was given to the desingers team at MercadoLibre. The outline is working different between HTML4 & HTML5. Understanding the different ways of giving semantics to the content is the goal.
Content• What is markup?• What is semantic?• Kinds of contents• What is outline?• HTML Elements• WAI-ARIA• Microdata• Designers• Tools
What is markup? A markup language is a modern system for annotating a document in a way that is syntactically distinguishable from the text.http://en.wikipedia.org/wiki/Markup_language
HTML LanguageSome markup languages, such as HTML, havepre-deﬁned presentation semantics, meaning that their speciﬁcation prescribes how the structured data are to be presented; others, such as XML, do not.
What is semantics? Elements, attributes, and attribute values are deﬁned to have certain meanings.http://dev.w3.org/html5/spec/single-page.html#semantics-0
The <aside> usagehttp://dev.w3.org/html5/spec/single-page.html#usage-summary-0
Microdata Microdata is a speciﬁcation used to nest semantics within existing content on web pages. Search engines, web crawlers, and browsers can extract and process it to provide a richer browsing experience for users.http://en.wikipedia.org/wiki/Microdata_(HTML)
Designers must • design with accessibility in mind. • design without content is decoration. • know the context and cultural background. • label clear and unambiguous. • bring all the information needed.http://www.ixdstudio.com/blog/8-things-every-ui-designer-should-know/