W3C home > Mailing lists > Public > public-html-diffs@w3.org > August 2009

annevk: add links for the new elements; move ruby up

From: poot <cvsmail@w3.org>
Date: Tue, 25 Aug 2009 18:09:06 +0900 (JST)
To: public-html-diffs@w3.org
Message-Id: <20090825090906.CB0EA2BBE7@toro.w3.mag.keio.ac.jp>
annevk: add links for the new elements; move ruby up

http://dev.w3.org/cvsweb/html5/html4-differences/Overview.html?r1=1.78&r2=1.79&f=h

===================================================================
RCS file: /sources/public/html5/html4-differences/Overview.html,v
retrieving revision 1.78
retrieving revision 1.79
diff -u -d -r1.78 -r1.79
--- Overview.html	25 Aug 2009 08:23:27 -0000	1.78
+++ Overview.html	25 Aug 2009 09:08:40 -0000	1.79
@@ -6,6 +6,8 @@
 
   <style type="text/css">
       div.example { border-left:double }
+      .note { margin-left:2em; font-weight:bold; font-style:italic; color:green }
+      p.note::before { content:"Note: " }
       dfn { font-style:normal; font-weight:bold }
       code { color:orangered }
       code :link, code :visited { color:inherit }
@@ -478,40 +480,60 @@
 
   <h3 id=new-elements><span class=secno>3.1 </span>New Elements</h3>
 
+  <p class=note>The links in this section may stop working if elements are
+   renamed and/or removed. They should function in the latest version of this
+   draft.
+
   <p>The following elements have been introduced for better structure:
 
   <ul>
    <li>
-    <p><code>section</code> represents a generic document or application
-     section. It can be used together with the <code>h1</code>,
-     <code>h2</code>, <code>h3</code>, <code>h4</code>, <code>h5</code>, and
-     <code>h6</code> elements to indicate the document structure.
+    <p><a
+     href="http://www.w3.org/TR/html5/semantics.html#the-section-element"><code>section</code></a>
+     represents a generic document or application section. It can be <a
+     href="http://www.w3.org/TR/html5/semantics.html#headings-and-sections"
+     title="Headings and sections">used together</a> with the
+     <code>h1</code>, <code>h2</code>, <code>h3</code>, <code>h4</code>,
+     <code>h5</code>, and <code>h6</code> elements to indicate the document
+     structure.
 
    <li>
-    <p><code>article</code> represents an independent piece of content of a
-     document, such as a blog entry or newspaper article.
+    <p><a
+     href="http://www.w3.org/TR/html5/semantics.html#the-article-element"><code>article</code></a>
+     represents an independent piece of content of a document, such as a blog
+     entry or newspaper article.
 
    <li>
-    <p><code>aside</code> represents a piece of content that is only slightly
-     related to the rest of the page.
+    <p><a
+     href="http://www.w3.org/TR/html5/semantics.html#the-aside-element"><code>aside</code></a>
+     represents a piece of content that is only slightly related to the rest
+     of the page.
 
    <li>
-    <p><code>hgroup</code> represents the header of a section.
+    <p><a
+     href="http://www.w3.org/TR/html5/semantics.html#the-hgroup-element"><code>hgroup</code></a>
+     represents the header of a section.
 
    <li>
-    <p><code>header</code> represents a group of introductory or navigational
-     aids.
+    <p><a
+     href="http://www.w3.org/TR/html5/semantics.html#the-header-element"><code>header</code></a>
+     represents a group of introductory or navigational aids.
 
    <li>
-    <p><code>footer</code> represents a footer for a section and can contain
-     information about the author, copyright information, et cetera.
+    <p><a
+     href="http://www.w3.org/TR/html5/semantics.html#the-footer-element"><code>footer</code></a>
+     represents a footer for a section and can contain information about the
+     author, copyright information, et cetera.
 
    <li>
-    <p><code>nav</code> represents a section of the document intended for
-     navigation.
+    <p><a
+     href="http://www.w3.org/TR/html5/semantics.html#the-nav-element"><code>nav</code></a>
+     represents a section of the document intended for navigation.
 
    <li>
-    <p><code>dialog</code> can be used to mark up a conversation like this:</p>
+    <p><a
+     href="http://www.w3.org/TR/html5/semantics.html#the-dialog-element"><code>dialog</code></a>
+     can be used to mark up a conversation like this:</p>
 
     <pre><code>&lt;dialog>
  &lt;dt> Costello
@@ -529,8 +551,10 @@
 &lt;/dialog></code></pre>
 
    <li>
-    <p><code>figure</code> can be used to associate a caption together with
-     some embedded content, such as a graphic or video:</p>
+    <p><a
+     href="http://www.w3.org/TR/html5/embedded-content-0.html#the-figure-element"><code>figure</code></a>
+     can be used to associate a caption together with some embedded content,
+     such as a graphic or video:</p>
 
     <pre><code>&lt;figure>
  &lt;video src="ogg">&lt;/video>
@@ -542,43 +566,74 @@
 
   <ul>
    <li>
-    <p><code>audio</code> and <code>video</code> for multimedia content. Both
-     provide an API so application authors can script their own user
-     interface, but there is also a way to trigger a user interface provided
-     by the user agent. <code>source</code> elements are used together with
-     these elements if there are multiple streams available of different
-     types.
+    <p><a
+     href="http://www.w3.org/TR/html5/video.html#video"><code>video</code></a>
+     and <a
+     href="http://www.w3.org/TR/html5/video.html#audio"><code>audio</code></a>
+     for multimedia content. Both provide an API so application authors can
+     script their own user interface, but there is also a way to trigger a
+     user interface provided by the user agent. <a
+     href="http://www.w3.org/TR/html5/video.html#the-source-element"><code>source</code></a>
+     elements are used together with these elements if there are multiple
+     streams available of different types.
 
    <li>
-    <p><code>embed</code> is used for plugin content.
+    <p><a
+     href="http://www.w3.org/TR/html5/embedded-content-0.html#the-embed-element"><code>embed</code></a>
+     is used for plugin content.
 
    <li>
-    <p><code>mark</code> represents a run of marked text.
+    <p><a
+     href="http://www.w3.org/TR/html5/text-level-semantics.html#the-mark-element"><code>mark</code></a>
+     represents a run of marked text.
 
    <li>
-    <p><code>meter</code> represents a measurement, such as disk usage.
+    <p><a
+     href="http://www.w3.org/TR/html5/text-level-semantics.html#the-progress-element"><code>progress</code></a>
+     represents a completion of a task, such as downloading or when
+     performing a series of expensive operations.
 
    <li>
-    <p><code>progress</code> represents a completion of a task, such as
-     downloading or when performing a series of expensive operations.
+    <p><a
+     href="http://www.w3.org/TR/html5/text-level-semantics.html#the-meter-element"><code>meter</code></a>
+     represents a measurement, such as disk usage.
 
    <li>
-    <p><code>time</code> represents a date and/or time.
+    <p><a
+     href="http://www.w3.org/TR/html5/text-level-semantics.html#the-time-element"><code>time</code></a>
+     represents a date and/or time.
 
    <li>
-    <p><code>canvas</code> is used for rendering dynamic bitmap graphics on
-     the fly, such as graphs or games.
+    <p><a
+     href="http://dev.w3.org/html5/spec/text-level-semantics.html#the-ruby-element"><code>ruby</code></a>,
+     <a
+     href="http://dev.w3.org/html5/spec/text-level-semantics.html#the-rt-element"><code>rt</code></a>
+     and <a
+     href="http://dev.w3.org/html5/spec/text-level-semantics.html#the-rp-element"><code>rp</code></a>
+     allow for marking up ruby annotations.
 
    <li>
-    <p><code>command</code> represents a command the user can invoke.
+    <p><a
+     href="http://www.w3.org/TR/html5/the-canvas-element.html#the-canvas-element"><code>canvas</code></a>
+     is used for rendering dynamic bitmap graphics on the fly, such as graphs
+     or games.
 
    <li>
-    <p><code>details</code> represents additional information or controls
-     which the user can obtain on demand.
+    <p><a
+     href="http://www.w3.org/TR/html5/interactive-elements.html#the-command"><code>command</code></a>
+     represents a command the user can invoke.
 
    <li>
-    <p><code>datalist</code> together with the a new <code>list</code>
-     attribute for <code>input</code> is used to make comboboxes:</p>
+    <p><a
+     href="http://www.w3.org/TR/html5/interactive-elements.html#the-details-element"><code>details</code></a>
+     represents additional information or controls which the user can obtain
+     on demand.
+
+   <li>
+    <p><a
+     href="http://dev.w3.org/html5/spec/forms.html#the-datalist-element"><code>datalist</code></a>
+     together with the a new <code>list</code> attribute for
+     <code>input</code> can be used to make comboboxes:</p>
 
     <pre><code>&lt;input list="browsers">
 &lt;datalist id="browsers">
@@ -589,15 +644,15 @@
 &lt;/datalist></code></pre>
 
    <li>
-    <p><code>keygen</code> represents control for key pair generation.
-
-   <li>
-    <p><code>output</code> represents some type of output, such as from a
-     calculation done through scripting.
+    <p><a
+     href="http://dev.w3.org/html5/spec/forms.html#the-keygen-element"><code>keygen</code></a>
+     represents control for key pair generation.
 
    <li>
-    <p><code>ruby</code>, <code>rt</code> and <code>rp</code> allow for
-     marking up ruby annotations.
+    <p><a
+     href="http://dev.w3.org/html5/spec/forms.html#the-output-element"><code>output</code></a>
+     represents some type of output, such as from a calculation done through
+     scripting.
   </ul>
 
   <p>The <code>input</code> element's <code>type</code> attribute now has the

Index: Overview.src.html
===================================================================
RCS file: /sources/public/html5/html4-differences/Overview.src.html,v
retrieving revision 1.56
retrieving revision 1.57
diff -u -d -r1.56 -r1.57
--- Overview.src.html	25 Aug 2009 08:23:27 -0000	1.56
+++ Overview.src.html	25 Aug 2009 09:08:40 -0000	1.57
@@ -4,6 +4,8 @@
     <title>HTML&nbsp;5 differences from HTML&nbsp;4</title>
     <style type="text/css">
       div.example { border-left:double }
+      .note { margin-left:2em; font-weight:bold; font-style:italic; color:green }
+      p.note::before { content:"Note: " }
       dfn { font-style:normal; font-weight:bold }
       code { color:orangered }
       code :link, code :visited { color:inherit }
@@ -393,38 +395,45 @@
 
 
     <h3 id="new-elements">New Elements</h3>
+    
+    <p class="note">The links in this section may stop working if elements
+    are renamed and/or removed. They should function in the latest version
+    of this draft.</p>
 
     <p>The following elements have been introduced for better structure:</p>
-
+    
     <ul>
-      <li><p><code>section</code> represents a generic document or
-      application section. It can be used together with the
-      <code>h1</code>, <code>h2</code>, <code>h3</code>, <code>h4</code>,
-      <code>h5</code>, and <code>h6</code> elements to indicate the document
-      structure.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/semantics.html#the-section-element"><code>section</code></a>
+      represents a generic document or application section. It can be
+      <a href="http://www.w3.org/TR/html5/semantics.html#headings-and-sections" title="Headings and sections">used together</a>
+      with the <code>h1</code>, <code>h2</code>, <code>h3</code>,
+      <code>h4</code>, <code>h5</code>, and <code>h6</code> elements to
+      indicate the document structure.</p></li>
 
-      <li><p><code>article</code> represents an independent piece of content
-      of a document, such as a blog entry or newspaper article.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/semantics.html#the-article-element"><code>article</code></a>
+      represents an independent piece of content of a document, such as a
+      blog entry or newspaper article.</p></li>
 
-      <li><p><code>aside</code> represents a piece of content that is only
-      slightly related to the rest of the page.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/semantics.html#the-aside-element"><code>aside</code></a>
+      represents a piece of content that is only slightly related to the
+      rest of the page.</p></li>
 
-      <li><p><code>hgroup</code> represents the header of a
-      section.</p></li>
-      
-      <li><p><code>header</code> represents a group of introductory or
-      navigational aids.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/semantics.html#the-hgroup-element"><code>hgroup</code></a>
+      represents the header of a section.</p></li>
 
-      <li><p><code>footer</code> represents a footer for a section and can
-      contain information about the author, copyright information, et
-      cetera.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/semantics.html#the-header-element"><code>header</code></a>
+      represents a group of introductory or navigational aids.</p></li>
 
-      <li><p><code>nav</code> represents a section of the document intended
-      for navigation.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/semantics.html#the-footer-element"><code>footer</code></a>
+      represents a footer for a section and can contain information about
+      the author, copyright information, et cetera.</p></li>
+
+      <li><p><a href="http://www.w3.org/TR/html5/semantics.html#the-nav-element"><code>nav</code></a>
+      represents a section of the document intended for navigation.</p></li>
 
       <li>
-        <p><code>dialog</code> can be used to mark up a conversation like
-        this:</p>
+        <p><a href="http://www.w3.org/TR/html5/semantics.html#the-dialog-element"><code>dialog</code></a>
+        can be used to mark up a conversation like this:</p>
         
         <pre><code>&lt;dialog>
  &lt;dt> Costello
@@ -443,8 +452,9 @@
       </li>
 
       <li>
-        <p><code>figure</code> can be used to associate a caption together
-        with some embedded content, such as a graphic or video:</p>
+        <p><a href="http://www.w3.org/TR/html5/embedded-content-0.html#the-figure-element"><code>figure</code></a>
+        can be used to associate a caption together with some embedded
+        content, such as a graphic or video:</p>
 
         <pre><code>&lt;figure>
  &lt;video src="ogg">&lt;/video>
@@ -456,37 +466,53 @@
     <p>Then there are several other new elements:</p>
     
     <ul>
-      <li><p><code>audio</code> and <code>video</code> for multimedia content.
-      Both provide an API so application authors can script their own user
-      interface, but there is also a way to trigger a user interface provided by
-      the user agent. <code>source</code> elements are used together with these
-      elements if there are multiple streams available of different
-      types.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/video.html#video"><code>video</code></a>
+      and
+      <a href="http://www.w3.org/TR/html5/video.html#audio"><code>audio</code></a>
+      for multimedia content. Both provide an API so application authors can
+      script their own user interface, but there is also a way to trigger a
+      user interface provided by the user agent.
+      <a href="http://www.w3.org/TR/html5/video.html#the-source-element"><code>source</code></a>
+      elements are used together with these elements if there are multiple
+      streams available of different types.</p></li>
 
-      <li><p><code>embed</code> is used for plugin content.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/embedded-content-0.html#the-embed-element"><code>embed</code></a>
+      is used for plugin content.</p></li>
 
-      <li><p><code>mark</code> represents a run of marked text.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/text-level-semantics.html#the-mark-element"><code>mark</code></a>
+      represents a run of marked text.</p></li>
       
-      <li><p><code>meter</code> represents a measurement, such as disk
-      usage.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/text-level-semantics.html#the-progress-element"><code>progress</code></a>
+      represents a completion of a task, such as downloading or when
+      performing a series of expensive operations.</p></li>
 
-      <li><p><code>progress</code> represents a completion of a task, such as
-      downloading or when performing a series of expensive operations.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/text-level-semantics.html#the-meter-element"><code>meter</code></a>
+      represents a measurement, such as disk usage.</p></li>
 
-      <li><p><code>time</code> represents a date and/or time.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/text-level-semantics.html#the-time-element"><code>time</code></a>
+      represents a date and/or time.</p></li>
+      
+      <li><p><a href="http://dev.w3.org/html5/spec/text-level-semantics.html#the-ruby-element"><code>ruby</code></a>,
+      <a href="http://dev.w3.org/html5/spec/text-level-semantics.html#the-rt-element"><code>rt</code></a>
+      and
+      <a href="http://dev.w3.org/html5/spec/text-level-semantics.html#the-rp-element"><code>rp</code></a>
+      allow for marking up ruby annotations.</p></li>
 
-      <li><p><code>canvas</code> is used for rendering dynamic bitmap graphics
-      on the fly, such as graphs or games.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/the-canvas-element.html#the-canvas-element"><code>canvas</code></a>
+      is used for rendering dynamic bitmap graphics on the fly, such as
+      graphs or games.</p></li>
 
-      <li><p><code>command</code> represents a command the user can
-      invoke.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/interactive-elements.html#the-command"><code>command</code></a>
+      represents a command the user can invoke.</p></li>
 
-      <li><p><code>details</code> represents additional information or controls
-      which the user can obtain on demand.</p></li>
+      <li><p><a href="http://www.w3.org/TR/html5/interactive-elements.html#the-details-element"><code>details</code></a>
+      represents additional information or controls which the user can
+      obtain on demand.</p></li>
       
       <li>
-        <p><code>datalist</code> together with the a new <code>list</code>
-        attribute for <code>input</code> is used to make comboboxes:</p>
+        <p><a href="http://dev.w3.org/html5/spec/forms.html#the-datalist-element"><code>datalist</code></a>
+        together with the a new <code>list</code> attribute for
+        <code>input</code> can be used to make comboboxes:</p>
 
         <pre><code>&lt;input list="browsers">
 &lt;datalist id="browsers">
@@ -497,14 +523,12 @@
 &lt;/datalist></code></pre>
       </li>
       
-      <li><p><code>keygen</code> represents control for key pair
-      generation.</p></li>
-
-      <li><p><code>output</code> represents some type of output, such as
-      from a calculation done through scripting.</p></li>
+      <li><p><a href="http://dev.w3.org/html5/spec/forms.html#the-keygen-element"><code>keygen</code></a>
+      represents control for key pair generation.</p></li>
 
-      <li><p><code>ruby</code>, <code>rt</code> and <code>rp</code> allow
-      for marking up ruby annotations.</p></li>
+      <li><p><a href="http://dev.w3.org/html5/spec/forms.html#the-output-element"><code>output</code></a>
+      represents some type of output, such as from a calculation done
+      through scripting.</p></li>
     </ul>
 
     <p>The <code>input</code> element's <code>type</code> attribute now has the
Received on Tuesday, 25 August 2009 09:09:45 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Saturday, 18 December 2010 06:14:11 GMT