zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > Site- und Layoutcheck
Seite neu laden Testseite - HTML 5 lernen

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 24.11.2012, 22:24
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 26.08.2008
Ort: Köln
Beiträge: 63
overflow befindet sich auf einem aufstrebenden Ast
Standard Testseite - HTML 5 lernen

Hallo,

unter title - link könnt ihr meine "Testseite" finden.
Lerne gerade das HTML5 - Schreiben.

Ist zwar nicht viel vorhanden, aber einige Fachleute unter uns haben bestimmt bereits einige Ratschläge für mich. Wichtig ist mir vor allem die HTML 5 Struktur & Semantik.

Alle Verbesserungsvorschläge sind willkommen.

Bedanke mich im voraus!

Geändert von overflow (26.11.2012 um 19:12 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 25.11.2012, 13:46
Standardkatze
XHTMLforum-Kenner
 
Registriert seit: 06.02.2007
Beiträge: 1.826
gato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nett
Standard

Zitat:
Zitat von overflow Beitrag anzeigen
Lerne gerade das HTML5 - Schreiben.
Ein lobenswertes Ziel.

Zitat:
Zitat von overflow Beitrag anzeigen
Ist zwar nicht viel vorhanden, aber einige Fachleute unter uns haben bestimmt bereits einige Ratschläge für mich. Wichtig ist mir vor allem die HTML 5 Struktur & Semantik.
  • Das html-Element sollte noch ein dir-Attribut (Wert ltr) erhalten. Beispielsweise arabsiche Besucher, deren Browser auf Rechts-Nach-Links eingestellt ist, sehen die Seite dadurch ebenfalls korrekt dargestellt.
  • Für die Angabe der Kodierung reicht (und das ist auch rückwärtskompatibel)
    HTML-Code:
    <meta charset="utf-8"/>
    Der abschließende Slash ist nicht erforderlich, (aber auch nicht falsch). Er wäre nur bei Polyglott-Dokumenten erforderlich (gleichzeitig HTML und XML). Der Aufwand dafür ist aber bei den meisten Seiten nicht nötig.
  • Nach der Angabe der verwendeten Kodierung sollte das title-Element folgen und darauf das meta-Element description. Anschließend sollte nur ein Stylesheet eingebunden werden (HTTP-Requests sparen).
    • In diesem kannst du dann allgemeine und spezialisierte Regeln (mit @media screen {} usw.) definieren.
    • Du solltest dir auch überlegen, ob ein so ausführlicher Reset überhaupt notwendig ist.
    • Vor allem solltest du :focus {outline: 0;} löschen. Das beinträchtigt die Benutzbarkeit der Seite für sehr viele Benutzer und ist damit tödlich.
    • Um Rückwärtskompatibel zu sein (insbesondere für IE8 und andere ältere Browser) ist es zudem notwendig, die Standardformate für die neuen HTML5-Elemente vorzugeben (ein display: block; ist dafür ausreichend - sofern, ich sehe es gerade - das HTML5 shiv das nicht mit übernimmt).
  • Zur Abwärtskompatibilität: Du hast zwar ein HTML5-shiv eingebunden, sei dir aber bewusst, dass nicht alle IE8-Nutzer JavaScript aktiviert haben (z.B. weil das die Vorgabe der IT-Abteilung ist).
    Wenn du IE8 berücksichtigen willst/musst, darf das Design nicht von den neuen HTML5-Elementen abhängig sein (du musst als Übergangslösung zusätzlich div-Elemente verwenden, auch wenn das unschön ist).
  • Slogans und ähnliches werden zusammen mit der Überschrift im hgroup-Element zusammengefasst.
  • Die Struktur selbst musst du selber überprüfen.
  • title-Attribute bei Links sind nicht sehr nützlich, überlege dir ihren Einsatz sehr gut.
  • Wenn du den Deppenlink entfernst, benötigst du keine Klasse .active, du kannst dann einfach ein a ohne href-Attriut verwenden und mit a:not([href]) oder einer einfacheren rückwärskompatiblen) Methode die Verweise unterschiedlich gestalten.
  • Wenn ich mich richtig erinnere, ist das nav-Element ncht für verweise im footer geeignet, aber das kannst du selber nochmal genauer nachlesen
  • Vermeide auch, mit Selektoren dein HTML nachzubauen. header li bedeutet das selbe wie header nav ul li (zumindest bei der aktuellen Struktur).

Zitat:
Bedanke mich im voraus!
Gerne.
__________________
Über Internet Explorer 8:
Noch bis 8. April 2014 wird der Internet Explorer 6 mit Sicherheitsupdates versorgt.
Bereits jetzt kann dieser Browser aber vollständig durch den IE8 ersetzt werden. Ältere Betriebssysteme und Browserversionen werden von Microsoft nicht mehr unterstützt.
Auch Programme, die den IE7 benötigen, sind kein Argument gegen IE8, da dieser über entsprechende Kompatibilitätsschichten verfügt.
Ab sofort gilt daher der Internet Explorer 8 als vorausgesetzer Mindeststandard.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 25.11.2012, 17:03
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 26.08.2008
Ort: Köln
Beiträge: 63
overflow befindet sich auf einem aufstrebenden Ast
Standard

Bedanke mich herzlichst...

Du hast recht, nav darf komischerweise nicht im footer auftauchen!
Einige Dinge muss ich noch anpassen, das Grobe wurde aber angepasst.

Danke nochmals!

Geändert von overflow (25.11.2012 um 17:12 Uhr)
Mit Zitat antworten
  #4 (permalink)  
Alt 25.11.2012, 20:52
Benutzerbild von cebito
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 18.07.2009
Ort: Dresden
Beiträge: 688
cebito sorgt für eine eindrucksvolle Atmosphärecebito sorgt für eine eindrucksvolle Atmosphäre
Standard

Zitat:
Zitat von overflow Beitrag anzeigen
nav darf komischerweise nicht im footer auftauchen!
Und das steht wo? Die Spezifikation sagt folgendes aus:
Zitat:
The nav element represents a section of a page that links to other pages or to parts within the page: a section with navigation links. Not all groups of links on a page need to be in a nav element only sections that consist of major navigation blocks are appropriate for the nav element. In particular, it is common for footers to have a list of links to various key parts of a site, but the footer element is more appropriate in such cases, and no nav element is necessary for those links.
Leider hast du es schon geändert, so dass ich nicht nachvollziehen kann, ob ein nav passend wäre oder nicht. Im Übrigen benutzt du section und article genau falsch herum, es sei denn, das ganze wäre ein Artikel mit zwei Unterpunkten, dann kannst du section aber auch ganz weglassen.
Mit Zitat antworten
  #5 (permalink)  
Alt 25.11.2012, 21:14
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 26.08.2008
Ort: Köln
Beiträge: 63
overflow befindet sich auf einem aufstrebenden Ast
Standard

Hatte den footer wie folgt aufgebaut:

HTML-Code:
<footer>
  <nav>
         <ul>
                <li><a href="">Link</a></li>
                <li><a href="">Link</a></li>
                <li><a href="">Link</a></li>
         </ul>
  </nav>
</footer>
Okay, der Post in einem Blog war fehlerhaft.
Du hast natürlich recht:
4.4.9 The footer element &mdash; HTML5
4.4.4 The nav element &mdash; HTML5
Mit Zitat antworten
  #6 (permalink)  
Alt 25.11.2012, 21:18
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.784
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von overflow Beitrag anzeigen
Okay, der Post in einem Blog war fehlerhaft.
Eher veraltet. Die Spec wurde diesbezüglich irgendwann mal geändert.
Mit Zitat antworten
  #7 (permalink)  
Alt 16.12.2012, 00:36
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 26.08.2008
Ort: Köln
Beiträge: 63
overflow befindet sich auf einem aufstrebenden Ast
Standard

Unter title gibt es eine neue Version ))
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Einbindung großer, interaktiver Flash Elemente in HTML Varian S. Javascript & Ajax 1 12.08.2011 01:14
tabel Darstellungsunterschied zwischen html und xhtml SteveB (X)HTML 13 07.05.2011 11:13
[XHTML] HTML Kompatibilitätsrichtlinen 2.0a1 gato (X)HTML 9 18.11.2007 12:28
CSS in HTML - Hintergrundbild wird nicht angezeigt fossy CSS 7 11.10.2007 17:17
star html hack -feststehender footer chritian CSS 3 17.09.2007 10:07


Alle Zeitangaben in WEZ +2. Es ist jetzt 13:48 Uhr.