Benutzer-Werkzeuge

Webseiten-Werkzeuge


html-5-markup-semantik

Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen gezeigt.

Link zu dieser Vergleichsansicht

Beide Seiten der vorigen Revision Vorhergehende Überarbeitung
Nächste Überarbeitung
Vorhergehende Überarbeitung
html-5-markup-semantik [2014/12/14 22:15]
admin
html-5-markup-semantik [2014/12/14 22:38] (aktuell)
admin
Zeile 13: Zeile 13:
  
 ===== <​header>​ ===== ===== <​header>​ =====
-Gruppe von Einführungen ​oder Navigationshilfen. + 
-Aus der Perspektive des Textes / Inhalts+  * Gruppe von Einführungs-  
 +  * oder Navigationshilfen 
 +  * kann ein paar Kopfelemente beinhalten 
 +  * jedoch auch andere Elemente wie zum Beispiel ein Logo, ein Suchfeld, usw.
  
  
 +<code html5>
 +<​header>​
 +  hier ein Logo
 +</​header>​
 +</​code>​
 + 
 +===== <​aside>​ =====
 +repräsentiert eine Sektion einer Seite, welche aus Inhalt besteht der nur indirekt zum restlichen Inhalt gehört, also parallel zum Kontext betrachtet werden kann.
 +
 +  * glossar
 +  * seitenleiste
 +  * werbung
 +  * biographie eines autors
 +
 +<code html5>
 + <​p>​My family and I visited The Epcot center this summer.</​p>​
 +
 +<​aside>​
 +  <​h4>​Epcot Center</​h4>​
 +  <​p>​The Epcot Center is a theme park in Disney World, Florida.</​p>​
 +</​aside> ​
 +</​code>​
 +
 +===== <​footer>​ =====
 <code html5> <code html5>
 <​section>​ <​section>​
- <​header>​ +  ​<​header>​ 
-  <h1>Überschrift</​h1>​ +    <h1>Artikelname</​h1>​ 
- </​header>​ +  </​header>​ 
- <​p>​foo bar baz</​p>​ +  <p>Lorem ipsum dolor sit <a href="">​amet.</​a>​</​p>​ 
- <​p>​lorem ipsum</​p>​+  <p>Lorem ipsum.</p
 +  <​footer>​ 
 +    <​p>​Mario Janschitz</​p>​ 
 +  </footer>
 </​section>​ </​section>​
 </​code>​ </​code>​
- + 
 +===== <​article>​ ===== 
 +  * Es können mehrere article-Elemente in einer Section vorkommen und vice versa 
 +  * Hautptunterschied:​  
 +  * article = in sich geschlossenee inhaltliche Einheit 
 +  * section = container für generische Information 
 + 
 +Trick: Wenn der fragliche Inhalt auch als RSS-Feed-Artikel sinnvoll wäre, das article Element benutzen, da der Inhalt offensichtlich in sich geschlossen ist. 
 + 
 +===== Links ===== 
 + 
 +  * [1] http://​t3n.de/​news/​semantik-html5-528492/​ 
 +  * [2] https://​developer.mozilla.org/​de/​docs/​Web/​HTML/​Element/​
  
html-5-markup-semantik.1418591740.txt.gz · Zuletzt geändert: 2014/12/14 22:15 von admin