Authoring

2009-11-09T20:08:49Z

Marc Engelhardt: Section added; Link added

Please add tips here on using HTML-5-specific features, and making them compatible with older browsers.

== Externel tutorial sites ==
* [http://www.html5-knowledge-base.com/ HTML5 Knowledge Base]

== Getting Internet Explorer to recognize the new elements ==

Internet Explorer will not style elements it doesn't recognize. You can get around this with a script. For example:
<pre>
<script>
document.createElement("section")
</script>
</pre>

([http://blog.whatwg.org/supporting-new-elements-in-ie More details].)

== Authoring examples ==

[work in progress - Rikkert Koppes]

This section is intended to give examples of frequently used markup. For a start, the examples given in the specification should be present and elaborated, next, it can be amended with real world examples. The goal is to concoct a non normative example document for authors accompanying the specification.

* Authoring scientific documents
* Authoring article based pages (news, blogs)

=== Authoring scientific documents ===

Since the origins of HTML lie in the markup of scientific documents [REF NEEDED], let us start with markup examples for such a document. This will allow us to discuss HTML examples in a layered way, starting relatively simple.

Consider the first page of the document "The Semantic Web Revisited" by Nigel Shadbolt, Wendy Hall and Tim Berners-Lee [http://geospatialsemanticweb.com/wp-content/uploads/2006/07/01637364.pdf], for clarity [http://www.rikkertkoppes.com/whatwg/examples/semantic_web_revisited_page_01.PNG pictured here]. We skip the orangish editor info at the top and start with the document header.

The document contains one article, hence the [http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-article-element article] element is a suitable choice here, starting with a [http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-header-element header] element.

Notice the nested [http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-address-element address] element representing the document authors. The address element represents the contact information for the sectioning content it applies to, which is, in this case, the article element.

The following elements <em title="16:22, 6 March 2009 (UTC)">currently</em> fall in the sectioning content category:
* [http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-section-element section]
* [http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-nav-element nav]
* [http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-article-element article]
* [http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-aside-element aside]

<pre>
<article>
<header>
<h1>The Semantic Web Revisited</h1>
<address>
<p>Nigel Shadbolt and Wendy Hall, University of Southampton</p>
<p>Tim Berners-Lee, Massachusetts Institute of Technology</p>
</address>
</header>

</article>
</pre>

Next, the article contains a series of sections, hence the [http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-section-element section] element. Note the capital "I" is not explicitely marked.

<pre>
<article>

<section>
<p>In the 50 years [...] instantaneously.</p>
<p>Fifty years ago [...] research.</p>
</section>

</article>
</pre>

<pre>
<article>

<section>
<h2>From documents to data and information</h2>
<p>The original [...] unrealized.</p>
<p>A Web of data [...] Web.</p>
<p>The article included [...] Web.</p>
</section>

</article>
</pre>

[about sectioning content and headers counting]

Figures are not only images, but also for example code listings [http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-figure-element], in general, anything which can be moved away from the main flow of the document without affecting the document's meaning. One [http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-legend-element legend] element in the figure (if present as first or last child) represents the figure caption.

<pre>
<figure>
<img src="ericmiller_rdf.png" alt="A graphic representation of
the RDF/XML document as given in the next figure.">
<legend>An RDF graph representing Eric Miller.</legend>
</figure>
...
<figure>
<pre><code class="language-rdf/xml">

</code></pre>
<legend>A chunk of RDF in RDF/XML describing Eric Miller and
corresponding to the graph in Figure A.</legend>
</figure>
</pre>

Note that the phrase "Figure A" is not part of the legend. This is typically handled through CSS [REF NEEDED].

In the documents, some quotes from the text are extracted as an eye-catcher. These quotes, marked with a [http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-q-element q] element, are additionally marked with an [http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-aside-element aside] element.

<pre>
<aside>
<q>URIs have global scope [...] of it.</q>
</aside>
</pre>

Main Page

2009-11-08T12:13:54Z

Marc Engelhardt: HTML5 Knowledge Base link added

Welcome to the WHATWG Wiki!

You can be a part of our community, making proposals for the next version of HTML5. This wiki is made available for you for drafting proposals, for writing essays, for keeping track of HTML-related issues, and so forth. Anyone can create an account and contribute content.

Before you begin, you may wish to read our [[WHATWG Wiki:Contribution Guidelines|contribution guidelines]].

==Purpose==
The purpose of the WHATWG Wiki is to create a place for WHATWG contributors to post and compile their own proposals and ideas regarding WHATWG specifications. The specifications themselves will not be available for editing via this wiki. However, ideas you post here may find their way into current and future WHATWG specifications.

== Main sections and Quick links ==
* [[FAQ]]
* [[Implementations]]
* [[What you can do]] — '''[[Reviewing HTML5|Help us review HTML5!]]
* [[Authoring|Using HTML 5 in your Web site]]
* [[Presentational elements and attributes]]
* [[HTML vs. XHTML]]
* [[HTML5 Presentations]]
* [[Issue Discussion]]
* [[Feature Proposals]]
* [[Spec coordination]]
* [[IDE]]
* [[Testsuite]]

==WHATWG Specifications==
* [[HTML 5]]
** [[HTML5 References]]
* [[Web Workers]]

==Communicating with the community==
The WHATWG community has several channels of communication:
* [http://www.whatwg.org/mailing-list Mailing lists]
* [http://hixietracker.blogspot.com/ Hixie Tracker]; A blog that only tracks e-mails to the WHATWG list that are written by the editor
* [http://blog.whatwg.org/ The blog], including [http://blog.whatwg.org/category/weekly-review Mark Pilgrim's column "This week in HTML5"]
* [http://www.w3.org/html/planet/ W3C's "HTML5 planet"]
* [http://forums.whatwg.org/ The forum]
* [[IRC]]
* [http://lastweekinhtml5.blogspot.com/ Jean-Baptiste's "Last week in HTML5"]; A blog that highlights controversial comments on the IRC channel
* [http://wiki.whatwg.org/ This wiki]
* [http://www.html5-knowledge-base.com/ HTML5 Knowledge Base]

== Research and data ==
Research pertaining to and data on publishing behavior for various bits of markup, used to help drive decisions made in/for HTML5 for specific elements and attributes.

Elements: (perhaps abstract to an [[elements]] page if many more are added)
* [[cite]]
* [[time]]
Attributes: (perhaps abstract to an [[attributes]] page if many more are added)
* [[charset]]
* [[summary]]

WHATWG Wiki - User contributions [en]

Authoring

Main Page