Das Theme Asphalt

Asphalt ist ein farblich dezenteres Theme, das aus dem Theme Maroony entstanden ist.

Das Druck-Theme vermeidet Farben. Assistive Bereiche werden ausgeblendet. Die Beigaben werden ab einer neuen Seite gedruckt. Die allgemeinen Eigenschaften entnehmen sie der Seite über das Theme Maroony.

Besonderes

Das Theme Asphalt verwendet vermehrt CSS3 Eigenschaften: box-shadow, text-shadow und border-radius.

Fremdressourcen

Das Theme Asphalt verwendet Fragmente eines Bildes auf Wikimedia:

Quelle
From Wikimedia Commons, the free media repository
Dateiname
Detmolder Strasse.JPG
User
Andi1982
Licence
Creative Commons Attribution ShareAlike 3.0

Beispiel-Formate

Dieses ist eine Demo für Beispiel-Formate zum aktuellen Theme. Damit die Beispiele vollständig sind, wird ausnahmsweise auch mit im Kontext unerlaubten Elementen1 operiert. Der obige Titel ist ein h2 Element, das auf einer Seite im Content eigentlich nur einmalig vorkommen darf.
Der aktuelle Absatz hat die Klasse abstract. Die Klasse Abstract bezeichnet einen Abschnitt, der als Zusammenfassung einer Seite oder als Einleitungstext dient, dem weitere Blöcke von h3 Überschriften folgen.

Verschiedene Absätze

Obiges ist ein h3 Element.
Dieser Ansatz steckt in einem p Element ohne weitere Klasse oder ID.

Dieses p Element steckt in einem blockquote Element. Die Variante strict verlangt, dass ein blockquote Element nur Block-Elemente als children haben darf. Ein cite Element

In diesem Absatz steckt Ein q Element das spricht: Huch ein verschachteltes q!. Und das ganze nach der Sprachnorm de-CH.

Das folgende Zitat hat eine Klasse <blockquote class="poetry">
<h4>...</h4>
<p>...</p>
<cite>...</cite>
</blockquote>

Das Hexen-Einmaleins

Du musst verstehn!
Aus Eins mach Zehn,
Und Zwei lass gehn,
Und Drei mach gleich,
So bist du reich.
Verlier die Vier!
Aus Fünf und Sechs -
So sagt die Hex -
Mach Sieben und Acht,
So ists vollbracht:
Und Neun ist Eins,
Und Zehn ist keins.
Das ist das Hexen-Einmaleins! Johann Wolfgang von Goethe

Dieser Absatz mit der Klasse info hat ein Symbol vorangestellt, der den Absatz als Information visuell darstellt2.

Dieser Absatz mit der Klasse warning enthält einen warnenden Hinweis. Er wird vom CMS etwa für mangelhafte Formularangaben verwendet.

Listen

Definitionsliste mit <dl class="standard">

Definitionsliste Definition 1
Definitionsliste Wert 1
Etwas mehr Inhalt
Definitionsliste Definition 2
Definitionsliste Wert 2
Etwas mehr Inhalt

Definitionsliste mit <dl class="standard softback">

Definitionsliste Definition 1
Definitionsliste Wert 1
Etwas mehr Inhalt
Definitionsliste Definition 2
Definitionsliste Wert 2
Etwas mehr Inhalt

Fussnoten

Fussnoten werden von Autoren besser nicht via HTML verfasst. Dafür gibt es die Syntax [footnote:Fussnoteninhalt].
Als Demo sehen Sie hier eine Fussnote3.

Verschiedene Links

Ein Maillink wird am besten unter Einbezug eines schützenden JS Scriptes geschrieben. Der Code [mailtolink:example@example.org] führt zu diesem Ergebnis: example[at]example.org Das JS wird dann diesen Link wiederum benutzerfreundlich gestalten. Der CSS Selector lautet: a.mailto.

Navigationen

Es werden verschiedene Arten von zusätzlichen Navigationen bereitgestellt. Die Codes lesen dabei die innerhalb einer Gruppe aufgeführten Seiten ein. Dadurch lassen sich jenseits der Hauptnavigation im Head über Gruppen spezielle Navigationen bis hin zur Sitemap kreieren. 


Liste mit Linkbeschreibung
[navigation:[type:description][group:articles]]

Einfache Liste
[navigation:[type:simple][group:articles]]

Ein nummerierter horizontaler Navigationsbalken
[navigation:[type:serie][group:articles]]

Liste mit Linkbeschreibung

Design-Fragen
Design-Postulate kritisch hinterfragen: Image-Replacement, Blocksatz, Farb-Kontraste und Links unterstreichen.
Spam
Spam vermeiden. Welche Strategien verwendet eHome-Factory?
Perl
Perl Schnippsel für das Web
MSIE 6
Abdankung MSIE 6

Einfache Liste

Horizontaler Navigationsbalken

Fussnoten

1 Unerlaubt nicht in dem Sinne, dass der Validator einen Fehler meldet, sondern in dem Sinne, dass semantische Regeln, die der Validator nicht erfasst, verletzt werden. Sie sehen zum Beispiel Zitate ohne wirklichen Zitattext.

2 Leider ist die Unicode-Unterstützung bei den meisten Gäste-Browsern noch nicht soweit vorhanden, dass Themes hier das entsprechende Unicode Zeichen für Information verwenden können. Das Theme Maroony behilft sich mit dem Buchstaben i.

3 Fussnoten sind ein fester Bestandteil in der Druckbranche. Im Internet haben sie jedoch keine anerkannte Funktion, weshalb eine automatisierte Fussnoten-Logik meistens mit einem Script und einer einfachen API implementiert werden muss. Diese Art der Fussnoten sind aber eher Endnoten bezogen auf das Dokument. Das Druckstylesheet kann sie auf jeden Fall nicht anders, denn als Endnoten behandeln.