“You cannot step twice into the same
river; for fresh waters are flowing in
upon you.”
– Heraclitus
Slide 11
Slide 11 text
CSS and the purification of HTML
Slide 12
Slide 12 text
…
Slide 13
Slide 13 text
“To increase the granularity of control
over elements, a new attribute has been
added to HTML: 'CLASS'.”
- CSS1 spec
Slide 14
Slide 14 text
No content
Slide 15
Slide 15 text
Don’t use “unsemantic” class names?
Slide 16
Slide 16 text
“Your HTML, like diamonds, should be
forever.”
- camendesign.com
Slide 17
Slide 17 text
“…authors are encouraged to use [class
attribute] values that describe the
nature of the content, rather than
values that describe the desired
presentation of the content.”
- HTML5 spec
Slide 18
Slide 18 text
“A structure based on CLASS is only
useful within a restricted domain, where
the meaning of a class has been
mutually agreed upon.”
- CSS1 spec
“Web Components…let web application
authors define widgets with a level of
visual richness not possible with CSS
alone”
- W3C Introduction to Web Components
Slide 37
Slide 37 text
“…specify the extra presentation using
markup…”
- W3C Introduction to Web Components
Slide 38
Slide 38 text
No content
Slide 39
Slide 39 text
Encapsulation, interoperability, reuse
Slide 40
Slide 40 text
Shadow DOM
Encapsulation and DOM boundaries
Custom elements; extend native elements
Clonable, inert DOM fragments
Slide 41
Slide 41 text
@host { /* css to unstyle button */ }
.visHidden { /* css to hide text */ }