Simon P.: HTML5-Semantik

Beitrag lesen

Hallo Felix,

Glückwunsch! Mal den Validator drüberlaufen lassen... oh, 11 Fehler und 4 Warnungen. Warum? Nun, Du verwendest Schreibweisen von HTML5 und deklarierst den HTML-Code aber mit einem "HTML 4.01 Transitional"-Doctype. Wenn Du das zu einem HTML5-Doctype änderst, gehen einige dieser Fehler und Warnungen weg.

Ich habe es jetzt in <!DOCTYPE HTML> geändert, da ich nicht wusste, wie ich es in HTML ändern sollte. Jetzt zeigt er mir auch keine Fehler mehr an. Als ich bei dem, was ich vorher drin stehen hatte "HTML public ..." nur die 4.01 zu einer 5 geändert hatte gab es trotzdem ne Menge Fehler.
Ist dieser "Public ..." DOCTYPE wichtig?

An Inhalten fehlt es noch ein bisschen, aber aus Testgründen habe ich sie schon online gestellt.

Eine Website ist nie fertig. Von daher braucht es keine Entschuldigung.

Schauen wir einmal in den Aufbau und seine Semantik - unter der Annahme, dass das HTML5 sein soll:

<!DOCTYPE html>

<html>
    <head>
        <title>Simons no Japan</title>
        <meta charset="UTF-8">
[...]
    </head>
    <body>
        <header>
            [...]
        </header>
        <nav id="steuerungoben">
            <ul>
                [...]
            </ul>
        </nav>
        <div id="wrapper">
            <nav id="steuerunglinks">
                <ul>
                    [...]
               </ul>

</nav>
            <aside id="neuigkeiten">
                <h2>Neuigkeiten bei:</h2>
                <ul>
                    [...]
                </ul>
                <h2>Blogs</h2>
                <ul>
                    [...]
                </ul>
            </aside>
            <section>
                [...]
            </section>
        </div>
        <footer>
            [...]
        </footer>
    </body>
</html>


>   
> Du benutzt da `<div id="wrapper">`{:.language-html}. Meiner Ansicht nach wäre hier besser ein <main>-Element. Außerdem fällt auf, dass Deine Seite zwar Unterüberschriften (<h2>), aber keine Hauptüberschrift (<h1>) enthält. Warum ist das so? Speziell in HTML5 ist es gedacht, ein <section>-Element mit <h1> zu beginnen, sodass bei verschachtelten <section>-Elementen die <h1>-Elemente wie Unterüberschriften verstanden werden - ungeachtet der möglichen weiteren hx-Elemente.  
>  

Habe ich erst nicht gemacht, weil sublime bei mir das <main> Element in einer CSS nicht erkannt hat. Dann habe ich irgendwo gelesen das man es noch mit "display: block;" deklarieren muss. Habe es gemacht und funktioniert nun. Dennoch erkennt sublime das Element in einer CSS nicht an (es ist weiß und nicht rot). Überschriften habe ich soweit alle geändert. Bei Neuigkeiten und Blogs habe ich nur h2 genommen, weil ich ja nur eine h1 pro Seite benutzen darf (habe ich mal so gelesen).  
  

> Aus meiner Sicht sind HTML-Kommentare in der fertigen Seite eher störend, es sei denn, es stehen für verarbeitende Programme Hinweise drin, die der Seitenbesucher so nicht angezeigt bekommt. Auch füge ich bei meinen Projekten gerne noch einen HTML-Kommentar in den <head>-Bereich ein, in dem steht, wann dieses HTML-Dokument von welcher URL aus abgerufen wurde. Aber alle anderen HTML-Kommentare sollten meiner Meinung nach entfernt werden.  
  
Musste ich mit dem Kommentaren so machen wegen dem hier:  
~~~php
  
$line = "<!-- HEADaf"; //Die Startposition in der HTML  
$anf = strpos($head, $line); //Anfangsposition in dem jeweiligen String  
    $head = substr($head, $anf); //Vom Anfang wird nun ausgegben  
$end = strpos($head, "<!-- HEADe -->"); //Endposition wird angegebn  
    $head = substr($head, 0, $end); //Dort hört es auf, auszugeben  
  
$line2 = "<!-- NAVaf";  
$anf2 = strpos($nav, $line2);  
    $nav = substr($nav, $anf2);  
$end2 = strpos($nav, "<!-- NAVe -->");  
    $nav = substr($nav, 0, $end2);  
  
$line3 = "<!-- MAINaf";  
$anf3 = strpos($contents, $line3);  
    $contents = substr($contents, $anf3);  
$end3 = strpos($contents, "<!-- MAINe -->");  
    $contents = substr($contents, 0, $end3);  

Liebe Grüße,

Simon P.

0 78

Innerhalb von php-while-schleife datensatz mit javascritp

Simon P.
  • datenbank
  1. 0
    Felix Riesterer
    1. 0
      Simon P.
      1. 0
        Simon P.
        1. 0
          Felix Riesterer
          1. 0
            Simon P.
            1. 0
              Felix Riesterer
              1. 0
                Simon P.
                1. 0
                  Felix Riesterer
                  1. 0
                    Simon P.
                    1. 0
                      Felix Riesterer
                      1. 0
                        Simon P.
                        1. 0
                          Felix Riesterer
                          1. 0
                            Simon P.
                            1. 0
                              Simon P.
                              1. 0
                                Felix Riesterer
                                1. 0
                                  Simon P.
                                  1. 0
                                    Felix Riesterer
                                    1. 0
                                      Simon P.
                                      1. 0
                                        Simon P.
                                        1. 0
                                          Auge
                                          1. 0
                                            Simon P.
                                            1. 0
                                              Felix Riesterer
                                              1. 0
                                                Simon P.
                                            2. 0
                                              Martin_Online
                                              1. 0
                                                Felix Riesterer
                                                1. 0
                                                  Martin_Online
                                                  1. 0
                                                    M.
                                                    1. 0
                                                      Simon P.
                                            3. 0
                                              M.
                                        2. 0
                                          Felix Riesterer
                                          1. 0
                                            Simon P.
                                            1. 0
                                              Felix Riesterer
                                              1. 0
                                                Simon P.
                                                1. 0
                                                  Felix Riesterer
                                                  1. 0
                                                    Simon P.
                                                    1. 0
                                                      Simon P.
                                                    2. 0
                                                      Felix Riesterer
                                                      1. 0
                                                        Simon P.
                                                        1. 0
                                                          Felix Riesterer
                                                          1. 0
                                                            Simon P.
                                                            1. 0
                                                              Felix Riesterer
                                                              1. 0
                                                                Simon P.
                                                                1. 0
                                                                  Simon P.
                                                                  1. 0
                                                                    Felix Riesterer
                                                                    1. 0
                                                                      Simon P.
                                                                      1. 0
                                                                        Simon P.
                                                                        1. 0

                                                                          HTML5-Semantik

                                                                          Felix Riesterer
                                                                          • html
                                                                          1. 0
                                                                            Simon P.
                                                                            1. 0
                                                                              Felix Riesterer
                                                                              1. 0
                                                                                Simon P.
                                                                                1. 0
                                                                                  Felix Riesterer
                                                                                  1. 0
                                                                                    Simon P.
                                                                                    1. 0
                                                                                      Felix Riesterer
                                                                                      1. 0
                                                                                        Simon P.
                                                                                        1. 0
                                                                                          Simon P.
                2. 0
                  Simon P.
                  1. 1
                    Felix Riesterer
                    1. 0
                      Simon P.
                      1. 0
                        M.
                        1. 0
                          Matthias Apsel
                          1. 0
                            M.
                            1. 0
                              molily
                              1. 0
                                M.
                      2. 0
                        Felix Riesterer
                        1. 0
                          Simon P.
                          1. 0

                            Begriff Webseite

                            Tabellenkalk
                            • projektverwaltung
                            1. 0
                              Simon P.
                              1. 0
                                Gunnar Bittersmann
                          2. 0
                            Auge
      2. 0
        Felix Riesterer
        1. 1
          Matthias Apsel
          1. 0
            Felix Riesterer
            1. 0

              Browserverlauf bei seiteninternen Verweisen löschen

              Matthias Apsel
              • selfhtml-wiki
              1. 0
                Felix Riesterer
                1. 0
                  molily
              2. 0
                molily
  2. 0
    ChrisB