MMWCON

Semantic Dark Wizardry with Templates, Shadow DOM and Custom Elements

Title

Semantic Dark Wizardry with Templates, Shadow DOM and Custom Elements

Presenter

Abstract

HTML 5 provides a slew of new structural and interactive elements. The header, footer, nav, main, aside, section and article elements, among others, assign semantic meaning to page layout, while new input types, widgets like meter and progress, and a number of APIs, provide rich application components without custom markup and Javascript. Additionally, HTML Microdata allows us to assign machine-readable data to the markup. In the wild though, most markup still ends up cumbersome. Whether we're using our own stylesheet or that of some front-end framework, we commonly find ourselves copying large amounts of HTML and Javascript boilerplate. Would it not be more semantic if we simply defined our own tags to represent the UI elements we need within our application's context? Today, we can with Web Components, a exciting new piece of the modern web platform!

During this talk, learn how to extend HTML with Custom Elements and go further with Templates and the Shadow DOM.

Details

Type

Presentation

Technical Level

Introductory

Area
  • Modern Web
Topics
  • HTML 5
  • HTML.next
  • Javascript
  • Javascript Frameworks and Tools
  • Semantic Web