- From: Maciej Stachowiak via cvs-syncmail <cvsmail@w3.org>
- Date: Tue, 26 May 2009 10:37:02 +0000
- To: public-html-commits@w3.org
Update of /sources/public/html5/html-design-principles
In directory hutz:/tmp/cvs-serv2901
Modified Files:
Overview.html Overview.src.html
Log Message:
Use real content, not CSS, to add Example labels.
Index: Overview.html
===================================================================
RCS file: /sources/public/html5/html-design-principles/Overview.html,v
retrieving revision 1.25
retrieving revision 1.26
diff -u -d -r1.25 -r1.26
--- Overview.html 26 May 2009 07:45:49 -0000 1.25
+++ Overview.html 26 May 2009 10:37:00 -0000 1.26
@@ -6,7 +6,6 @@
<style type="text/css">
.example { padding-left: 1em; border-left: 3px solid green }
- .example:before { content: "Example: "; font-weight: bold; }
.note { font-style: italic; }
dfn { font-style:normal; font-weight:bold }
code { color:orangered }
@@ -296,14 +295,15 @@
that something is part of the supported language does not by itself mean
that relying on it is condoned or encouraged.
- <p class=example>Many sites use broken markup, such as badly nested
- elements (<code><b>a<i>b</b>c</i></code>), and both authors
- and users have expectations based on the error handling used by legacy
- user agents. We need to define processing requirements that remain
- compatible with the expected handling of such content.
+ <p class=example><b>Example:</b> Many sites use broken markup, such as
+ badly nested elements (<code><b>a<i>b</b>c</i></code>), and
+ both authors and users have expectations based on the error handling used
+ by legacy user agents. We need to define processing requirements that
+ remain compatible with the expected handling of such content.
- <p class=example>Some sites rely on the <code><u></code> element
- giving the presentational effect of an underline.
+ <p class=example><b>Example:</b> Some sites rely on the
+ <code><u></code> element giving the presentational effect of an
+ underline.
<h3 id=degrade-gracefully><span class=secno>2.2 </span>Degrade Gracefully</h3>
@@ -362,31 +362,32 @@
<p>This list is not exhaustive; in some cases slightly more complicated
approaches are more effective.</p>
<!--
- <p class="example">The default presentation of the
+ <p class="example"><b>Example:</b> The default presentation of the
proposed <code><section></code> element can be emulated
through the CSS rule <code>section { display: block; }</code>.</p>
-->
- <p class=example>The default presentation of the proposed
+ <p class=example><b>Example:</b> The default presentation of the proposed
<code>hidden</code> attribute can be emulated through the CSS rule
<code>[hidden] { display: none; }</code>.
- <p class=example>Proposed new multimedia elements like <code><canvas>
- fallback </canvas></code> or <code><video> fallback
- </video></code> allow fallback content. Older user agents will show
- "fallback" while user agents supporting <code>canvas</code> or
+ <p class=example><b>Example:</b> Proposed new multimedia elements like
+ <code><canvas> fallback </canvas></code> or <code><video>
+ fallback </video></code> allow fallback content. Older user agents will
+ show "fallback" while user agents supporting <code>canvas</code> or
<code>video</code> will show the multimedia content.
- <p class=example>The proposed <code>getElementsByClassName()</code> method
- can be made considerably faster than pure ECMAScript implementations found
- in existing libraries, but a script-based implementation can be used when
- the native version is not available.
+ <p class=example><b>Example:</b> The proposed
+ <code>getElementsByClassName()</code> method can be made considerably
+ faster than pure ECMAScript implementations found in existing libraries,
+ but a script-based implementation can be used when the native version is
+ not available.
- <p class=example>The <code><datalist></code> element can be associated
- with an <code><input></code> element and may contain a hidden
- <code><select></code> element. This way the fallback for the intended
- "combo box" control can be a text field or a text field with an associated
- pop-up menu in existing mainstream browsers
+ <p class=example><b>Example:</b> The <code><datalist></code> element can
+ be associated with an <code><input></code> element and may contain a
+ hidden <code><select></code> element. This way the fallback for the
+ intended "combo box" control can be a text field or a text field with an
+ associated pop-up menu in existing mainstream browsers
<h3 id=do-not-reinvent-the-wheel><span class=secno>2.3 </span>Do not
Reinvent the Wheel</h3>
@@ -397,17 +398,18 @@
cases may call for a new approach instead of more extensions on an old
approach.
- <p class=example><code>contenteditable=""</code> was already used and
- implemented by user agents. No need to invent a new feature.
+ <p class=example><b>Example:</b> <code>contenteditable=""</code> was
+ already used and implemented by user agents. No need to invent a new
+ feature.
<h3 id=pave-the-cowpaths><span class=secno>2.4 </span>Pave the Cowpaths</h3>
<p>When a practice is already widespread among authors, consider adopting
it rather than forbidding it or inventing something new.
- <p class=example>Authors already use the <code><br/></code> syntax as
- opposed to <code><br></code> in HTML and there is no harm done by
- allowing that to be used.
+ <p class=example><b>Example:</b> Authors already use the
+ <code><br/></code> syntax as opposed to <code><br></code> in HTML
+ and there is no harm done by allowing that to be used.
<h3 id=evolution-not-revolution><span class=secno>2.5 </span>Evolution Not
Revolution</h3>
@@ -421,8 +423,8 @@
add new features to existing code, rather than having to develop whole
separate modes.
- <p class=example>Switching to XML syntax requires a global change, so
- continue supporting classic HTML syntax as well.
+ <p class=example><b>Example:</b> Switching to XML syntax requires a global
+ change, so continue supporting classic HTML syntax as well.
<h2 id=utility><span class=secno>3 </span>Utility</h2>
@@ -453,10 +455,10 @@
<p>Ensure that features work with the security model of the web.
Preferrably address security considerations directly in the specification.
- <p class=example>Communicating between documents from different sites is
- useful, but an unrestricted version could put user data at risk.
- Cross-document messaging is designed to allow this without violating
- security constraints.
+ <p class=example><b>Example:</b> Communicating between documents from
+ different sites is useful, but an unrestricted version could put user data
+ at risk. Cross-document messaging is designed to allow this without
+ violating security constraints.
<h3 id=separation-of-concerns><span class=secno>3.4 </span>Separation of
Concerns</h3>
@@ -472,15 +474,16 @@
may be pragmatic (for brevity, history, simplicity) rather than completely
accurate.
- <p class=example>The <code><article></code> element defines an
- individual article, but not the details of how it is displayed. A journal
- article may be the only article on a page, formatted in multiple columns,
- while a blog post may share a page with multiple other articles and be
- presented in a box with a border.
+ <p class=example><b>Example:</b> The <code><article></code> element
+ defines an individual article, but not the details of how it is displayed.
+ A journal article may be the only article on a page, formatted in multiple
+ columns, while a blog post may share a page with multiple other articles
+ and be presented in a box with a border.
- <p class=example>The <code><b></code> and <code><i></code> elements
- are widely used — it may be better to give them good default
- rendering for various media including aural than to try to ban them.
+ <p class=example><b>Example:</b> The <code><b></code> and
+ <code><i></code> elements are widely used — it may be better to
+ give them good default rendering for various media including aural than to
+ try to ban them.
<h3 id=dom-consistency><span class=secno>3.5 </span>DOM Consistency</h3>
@@ -494,9 +497,9 @@
deployed content, gratuitous difference in syntactic appearance should be
avoided as well.
- <p class=example>The HTML (<code>text/html</code>) parser puts elements in
- the <code>http://www.w3.org/1999/xhtml</code> namespace in the DOM for
- compatibility with the XML syntax of HTML 5.
+ <p class=example><b>Example:</b> The HTML (<code>text/html</code>) parser
+ puts elements in the <code>http://www.w3.org/1999/xhtml</code> namespace
+ in the DOM for compatibility with the XML syntax of HTML 5.
<h2 id=interoperability><span class=secno>4 </span>Interoperability</h2>
@@ -539,12 +542,13 @@
example, interactive features should not be omitted merely because they
can not be represented in a printed document.
- <p class=example>The general reflowability of HTML text makes it more
- suitable to variable screen dimensions than a representation of exact
- glyph positions.
+ <p class=example><b>Example:</b> The general reflowability of HTML text
+ makes it more suitable to variable screen dimensions than a representation
+ of exact glyph positions.
- <p class=example>A hyperlink can not be actuated in a printed document, but
- that is no reason to omit the <code>a</code> element.
+ <p class=example><b>Example:</b> A hyperlink can not be actuated in a
+ printed document, but that is no reason to omit the <code>a</code>
+ element.
<h3 id=support-world-languages><span class=secno>5.2 </span>Support World
Languages</h3>
@@ -554,18 +558,20 @@
all of them. Features for packing multiple translations of a document in a
single file are out of scope.
- <p class=example>Supporting Unicode allows text in most of the world's
- languages, including mixing of text in different languages.
+ <p class=example><b>Example:</b> Supporting Unicode allows text in most of
+ the world's languages, including mixing of text in different languages.
- <p class=example>Italic text is useful because it applies to many bicameral
- scripts, even though some scripts have no such concept. Similarly, ruby is
- useful for many scripts, even though it has a CJK focus.
+ <p class=example><b>Example:</b> Italic text is useful because it applies
+ to many bicameral scripts, even though some scripts have no such concept.
+ Similarly, ruby is useful for many scripts, even though it has a CJK
+ focus.
- <p class=example>Text in element content has better language support than
- text in attribute content; in element content ruby annotations can be
- inserted, as well as <code><dir></code> attributes and
- <code><bdo></code> elements in case the Unicode bidirectional algorithm
- is insufficient to correctly order adjacent runs of mixed direction text.
+ <p class=example><b>Example:</b> Text in element content has better
+ language support than text in attribute content; in element content ruby
+ annotations can be inserted, as well as <code><dir></code> attributes
+ and <code><bdo></code> elements in case the Unicode bidirectional
+ algorithm is insufficient to correctly order adjacent runs of mixed
+ direction text.
<h3 id=accessibility><span class=secno>5.3 </span>Accessibility</h3>
@@ -574,13 +580,14 @@
features should be omitted entirely if not all users can make full use of
them, but alternate mechanisms should be provided.
- <p class=example>The image in an <code><img></code> may not be visible
- to blind users, but that is a reason to provide alternate text, not to
- leave out images.
+ <p class=example><b>Example:</b> The image in an <code><img></code> may
+ not be visible to blind users, but that is a reason to provide alternate
+ text, not to leave out images.
- <p class=example>The <code><progress></code> element is intrinsically
- accessible as it has unambiguous progress bar semantics which permits
- mapping to accessibility APIs that can represent progress indicators.
+ <p class=example><b>Example:</b> The <code><progress></code> element is
+ intrinsically accessible as it has unambiguous progress bar semantics
+ which permits mapping to accessibility APIs that can represent progress
+ indicators.
<h2 class=no-num id=acknowledgments>Acknowledgments</h2>
Index: Overview.src.html
===================================================================
RCS file: /sources/public/html5/html-design-principles/Overview.src.html,v
retrieving revision 1.25
retrieving revision 1.26
diff -u -d -r1.25 -r1.26
--- Overview.src.html 26 May 2009 07:45:49 -0000 1.25
+++ Overview.src.html 26 May 2009 10:37:00 -0000 1.26
@@ -4,7 +4,6 @@
<title>HTML Design Principles</title>
<style type="text/css">
.example { padding-left: 1em; border-left: 3px solid green }
- .example:before { content: "Example: "; font-weight: bold; }
.note { font-style: italic; }
dfn { font-style:normal; font-weight:bold }
code { color:orangered }
@@ -219,13 +218,13 @@
part of the supported language does not by itself mean that
relying on it is condoned or encouraged.</p>
- <p class="example">Many sites use broken markup, such as badly nested
+ <p class="example"><b>Example:</b> Many sites use broken markup, such as badly nested
elements (<code><b>a<i>b</b>c</i></code>), and both authors and
users have expectations based on the error handling used by legacy user
agents. We need to define processing requirements that remain compatible
with the expected handling of such content.</p>
- <p class="example">Some sites rely on the <code><u></code> element giving
+ <p class="example"><b>Example:</b> Some sites rely on the <code><u></code> element giving
the presentational effect of an underline.</p>
<h3 id="degrade-gracefully">Degrade Gracefully</h3>
@@ -284,29 +283,29 @@
complicated approaches are more effective.</p>
<!--
- <p class="example">The default presentation of the
+ <p class="example"><b>Example:</b> The default presentation of the
proposed <code><section></code> element can be emulated
through the CSS rule <code>section { display: block; }</code>.</p>
-->
- <p class="example">The default presentation of the
+ <p class="example"><b>Example:</b> The default presentation of the
proposed <code>hidden</code> attribute can be emulated
through the CSS rule <code>[hidden] { display: none; }</code>.</p>
- <p class="example">Proposed new multimedia elements
+ <p class="example"><b>Example:</b> Proposed new multimedia elements
like <code><canvas> fallback </canvas></code>
or <code><video> fallback </video></code> allow fallback
content. Older user agents will show "fallback" while user agents
supporting
<code>canvas</code> or <code>video</code> will show the multimedia content.</p>
- <p class="example">The
+ <p class="example"><b>Example:</b> The
proposed <code>getElementsByClassName()</code> method can be made
considerably faster than pure ECMAScript implementations found in
existing libraries, but a script-based implementation can be used
when the native version is not available.</p>
- <p class="example">The <code><datalist></code> element can be
+ <p class="example"><b>Example:</b> The <code><datalist></code> element can be
associated with an <code><input></code> element and may contain
a hidden <code><select></code> element. This way the fallback
for the intended "combo box" control can be a text field or a text
@@ -320,7 +319,7 @@
cases may call for a new approach instead of more extensions on an old
approach.</p>
- <p class="example"><code>contenteditable=""</code> was already used and
+ <p class="example"><b>Example:</b> <code>contenteditable=""</code> was already used and
implemented by user agents. No need to invent a new feature.</p>
<h3 id="pave-the-cowpaths">Pave the Cowpaths</h3>
@@ -328,7 +327,7 @@
<p>When a practice is already widespread among authors, consider adopting it
rather than forbidding it or inventing something new.</p>
- <p class="example">Authors already use the <code><br/></code> syntax as
+ <p class="example"><b>Example:</b> Authors already use the <code><br/></code> syntax as
opposed to <code><br></code> in HTML and there is no harm done by
allowing that to be used.</p>
@@ -343,7 +342,7 @@
features to existing code, rather than having to develop whole separate
modes.</p>
- <p class="example">Switching to XML syntax requires a global change, so
+ <p class="example"><b>Example:</b> Switching to XML syntax requires a global change, so
continue supporting classic HTML syntax as well.</p>
@@ -375,7 +374,7 @@
<p>Ensure that features work with the security model of the web. Preferrably
address security considerations directly in the specification.</p>
- <p class="example">Communicating between documents from different sites is
+ <p class="example"><b>Example:</b> Communicating between documents from different sites is
useful, but an unrestricted version could put user data at risk.
Cross-document messaging is designed to allow this without violating
security constraints.</p>
@@ -393,13 +392,13 @@
pragmatic (for brevity, history, simplicity) rather than completely
accurate.</p>
- <p class="example">The <code><article></code> element defines an individual
+ <p class="example"><b>Example:</b> The <code><article></code> element defines an individual
article, but not the details of how it is displayed. A journal article may
be the only article on a page, formatted in multiple columns, while a blog
post may share a page with multiple other articles and be presented in a box
with a border.</p>
- <p class="example">The <code><b></code> and <code><i></code> elements are widely
+ <p class="example"><b>Example:</b> The <code><b></code> and <code><i></code> elements are widely
used — it may be better to give them good default rendering for various
media including aural than to try to ban them.</p>
@@ -416,7 +415,7 @@
and deployed content, gratuitous difference in syntactic appearance
should be avoided as well.</p>
- <p class="example">The HTML (<code>text/html</code>) parser puts
+ <p class="example"><b>Example:</b> The HTML (<code>text/html</code>) parser puts
elements in the <code>http://www.w3.org/1999/xhtml</code> namespace in
the DOM for compatibility with the XML syntax of HTML 5.</p>
@@ -463,11 +462,11 @@
interactive features should not be omitted merely because they can not be
represented in a printed document.</p>
- <p class="example">The general reflowability of HTML text makes it more
+ <p class="example"><b>Example:</b> The general reflowability of HTML text makes it more
suitable to variable screen dimensions than a representation of exact glyph
positions.</p>
- <p class="example">A hyperlink can not be actuated in a printed document,
+ <p class="example"><b>Example:</b> A hyperlink can not be actuated in a printed document,
but that is no reason to omit the <code>a</code> element.</p>
@@ -478,14 +477,14 @@
apply to all of them. Features for packing multiple translations of a
document in a single file are out of scope.</p>
- <p class="example">Supporting Unicode allows text in most of the world's
+ <p class="example"><b>Example:</b> Supporting Unicode allows text in most of the world's
languages, including mixing of text in different languages.</p>
- <p class="example">Italic text is useful because it applies to many bicameral
+ <p class="example"><b>Example:</b> Italic text is useful because it applies to many bicameral
scripts, even though some scripts have no such concept. Similarly, ruby is
useful for many scripts, even though it has a CJK focus.</p>
- <p class="example">Text in element content has better language support than
+ <p class="example"><b>Example:</b> Text in element content has better language support than
text in attribute content; in element content ruby annotations can be
inserted, as well as <code><dir></code> attributes and <code><bdo></code>
elements in case the Unicode bidirectional algorithm is insufficient to
@@ -499,11 +498,11 @@
features should be omitted entirely if not all users can make full use
of them, but alternate mechanisms should be provided.</p>
- <p class="example">The image in an <code><img></code> may not be visible to
+ <p class="example"><b>Example:</b> The image in an <code><img></code> may not be visible to
blind users, but that is a reason to provide alternate text, not to leave
out images.</p>
- <p class="example">The <code><progress></code> element is intrinsically
+ <p class="example"><b>Example:</b> The <code><progress></code> element is intrinsically
accessible as it has unambiguous progress bar semantics which permits
mapping to accessibility APIs that can represent progress
indicators.</p>
Received on Tuesday, 26 May 2009 10:37:13 UTC