HTML5-Handbuch - die neuen Features von HTML5

anderen Elementen (Phrasing-Context) bestehen. Die Aufgabe des Elementinhalts ist die sichtbare Visualisierung des Verhältnisses von
max
zu
value
.
    Um etwa einen Prozentwert zu realisieren, weisen Sie dem
max
-Attribut den Wert 100 zu und dem
value
-Attribut den jeweils aktuellen Prozentwert.
Weitere Hinweise
    Das
progress
-Element ist nicht dazu gedacht, anteilsmäßige Werte darzustellen, die aber zu keinem aktuellen Prozess gehören, also zum Beispiel der belegte und freie Speicher auf dem Server. Für solche Anzeigen ist das
meter
-Element, wie im folgenden Abschnitt beschrieben, gedacht.
    Das obige Beispiel kommt mit einer Reihe von
progress
-Elementen aus, die im HTML-Code mit Werten vorbelegt und von keinem Script geändert werden. Der typischere Anwendungsfall sind aber sicherlich Fortschrittsanzeigen, die von einem JavaScript laufend verändert werden. Dazu ist allerdings nicht nur ein Script erforderlich, dass die Anzeige laufend verändert, sondern auch ein dahinter stattfindender Prozess, der laufend Auskunft über seinen Fortschritt gibt.
Referenzinformationen
    Elementreferenz

:

8.5.3      Metrische Werte
HTML5 führt ein allgemeines Element zur Auszeichnung von Werten ein, die zu einer Skala gehören. Beispiele sind Ratings (»3 von 5 Sternen«), Sitzverteilungen im Parlament (»208 von 598 Sitzen«) oder einfach Prozentwerte (»0,34%«).
    Durch Attribute ist die Werteskala beschreibbar, und eine auslesende Software oder ein Script hat die Möglichkeit, den eigentlichen Wert mit Hilfe dieser Informationen einzuordnen.
Beispiel
    

    
• 
       Sieben von zehn Deutschen
      bezahlen zu hohe Kreditkartengebühren
      

    
• 
      Durchschnittliche Wertung:
      
      
      
      

    
• 
      Der aktuelle Pegelstand des Rheins beträgt
          high="6.00" optimum="4.15">4,25m.
      

    

Erläuterung
    Das Beispiel enthält keine formularbezogenen Daten, sondern eine unsortierte Liste mit einigen Aussagen. Darin kommen Werte vor, die sich auf einer Skala abbilden lassen. Zur »Bemaßung« wird das
meter
-Element verwendet. Der Name
meter
hat nichts mit der Maßeinheit Meter zu tun. Es sind beliebige Maßeinheiten und Skalierungen anwendbar.
    Das
meter
-Element wird durch

…

markiert. Der Elementinhalt kann aus Text und anderen HTML-Elementen (Phrasing-Content, mehr dazu unter 4.6.1 Content-Modelle) bestehen. Sinnvollerweise schließt das Element eine Wertangabe ein. Diese kann jedoch durchaus aus mehreren Wörtern oder auch aus nonverbalen Inhalten wie einer Grafik bestehen.
Zum Redaktionszeitpunkt stand noch nicht fest, wie genau das
meter
-Element von Browsern visualisiert werden soll. Die HTML5-Spezifikation schlägt eine schlichte Balkengrafik-Darstellung vor.
    Die Skala und der aktuelle Wert werden in den die Attribute einleitenden

-Tags definiert. Alle nachfolgend genannten Attribute erwarten als Wert eine gültige Ganzzahl oder Fließkommazahl. Bei Bruchzahlen ist der Punkt das Dezimalzeichen.
    Obligatorisch ist das
value
-Attribut. Es enthält den eigentlichen aktuellen Wert. Wenn Sie das
max
-Attribut weglassen, wird intern ein Maximalwert von 1 angenommen. Wenn dieser voreingestellte Maximalwert für einen konkreten Zusammenhang unbrauchbar ist, müssen Sie mit dem
max
-Attribut einen anderen, gewünschten Wert angeben.
    Das Gegenstück zum
max
-Attribut ist das
min
-Attribut. Wenn es auf der Skala des beschriebenen Werts einen Minimalwert gibt, können Sie ihn mit diesem Attribut angeben. Ansonsten wird intern der Wert 0 als Minimalwert angenommen.
    Ferner werden noch die Attribute
low
,
high
und
optimum
angeboten. Mit
min
und
low
im Zusammenspiel können Sie einen Minimalwert und einen Niedrigwert (eventuell kritischer Punkt) bestimmen, wobei der Niedrigwert über dem Minimalwert liegen muss. Analog dazu können Sie mit
max
und
high
einen Maximalwert und einen Wert für »hoch« (eventuell kritisch hoch) bestimmen. Das Attribut
optimum
erlaubt die Angabe eines Optimalwerts, sofern es einen solchen gibt.
    Bild 8.21: Darstellung des
meter
-Elements
Referenzinformationen
    Elementreferenz

:
    Attributreferenz
value
,
    Attributreferenz
high
,
    Attributreferenz
low
,
    Attributreferenz
max
,
    Attributreferenz
min
,
    Attributreferenz
optimum
:

8.6    Interaktive Elemente
    Die in diesem Abschnitt behandelten