Lisa: Saubere Struktur - gleich zu Beginn

Hey,
ich muss für im Rahmen eines Seminares einer sehr sauber erstellte Internet-Seite entwerfen. An den Inhalt bestehen keine großen Ansprüche, es geht rein um die "Sauberkeit" des Quelltextes (XHTML und CSS).
Das Layout soll so aussehen:
Struktur der Seite
Oben ein Logo, darunter 5 Topics (Links)
In der Navigation tauchen, je nachdem in welchem Topic man sich befindet, andere Links auf.
Rechts daneben das Content-Fenster.
Der Text im content Bereich wird kurz sein, es soll also nicht gescrollt werden.
Meine Idee für die Grundarchitektur ist bislang
3 Div-container wie folgt anzuordnen:
Container-Struktur

  • Das Logo als großes Bild
  • Die Topics (Links) darunter als horizontale Liste
  • In den Navigationscontainer eine Liste
  • Container für den Content-Bereich

Handelt es sich dabei um eine "saubere" Struktur?

Vielen Dank für Eure Unterstützung!

  1. Hi,

    Meine Idee für die Grundarchitektur ist bislang
    3 Div-container wie folgt anzuordnen:

    DIV willst du so sparsam wie möglich einsetzen.

    • Das Logo als großes Bild

    Das könnte man gleich als H1 auszeichnen. (Darüber gehen die Meinungen aber auseinander.)

    • Die Topics (Links) darunter als horizontale Liste
    • In den Navigationscontainer eine Liste

    Nein, die Liste *als* Container. Kein Grund, noch ein DIV drumherum zu legen.

    • Container für den Content-Bereich

    Handelt es sich dabei um eine "saubere" Struktur?

    Kommt stark darauf an, wie es dann innerhalb des Content-Bereiches aussieht.
    Die dortigen Inhalte sind das wesentliche, also will auf deren Strukturierung auch entsprechend viel Sorgfalt gelegt werden.

    MfG ChrisB

    --
    “Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]
    1. Danke für die schnelle Antwort.
      Ich bekomme also (die Grafik nicht als H1) grob gesagt folgenden Aufbau:

      <div id="seitenkopf">  
      <img alt="logo"></img>  
      <li>Horizontale Liste für Topics</li></div>  
        
      <li>Navigation</li>  
      <div id="content"></div>
      

      Viele Grüße!
      PS: Der Inhalt des Content-Bereichs, wird immer gleich aufgebaut sein. Ich will daher ein Design anlegen und den content aus einer XML Datei laden.

      1. Moin

        <div id="seitenkopf">

        <img alt="logo"></img>

        hier mal den </img> Tag weglassen. Wenn du XHTML verwendest dann kannst du den Tag mit einem <img ... /> schliessen

        <li>Horizontale Liste für Topics</li></div>

        <li>Navigation</li>
        <div id="content"></div>

          
        ansonsten solltes es passen  
          
        Gruß Bobby  
        
        -- 
        -> Für jedes Problem gibt es eine Lösung, die einfach, sauber und falsch ist! <-  
        ### Henry L. Mencken ###  
        -> Nicht das Problem macht die Schwierigkeiten, sondern unsere Sichtweise! <-  
        ## Viktor Frankl ###  
          
        ie:{ br:> fl:{ va:} ls:< fo:) rl:( n4:( de:> ss:) ch:? js:( mo:} sh:) zu:)
        
      2. Hi,

        <img alt="logo"></img>

        siehe Bobbys Antwort, nebst ChrisBs Einwand, dass dies als Überschrift angesehen werden kann.

        <li>Horizontale Liste für Topics</li></div>

        Zunächst mal <ul>, darin dann die <li>. Ferner sehe ich im gezielten Einsatz von <div>-Elementen noch keine galoppierende Divitis - <div>-Elemente sind ebenso wenig Selbstzweck, wie es der forcierte Verzicht darauf ist.

        Cheatah

        --
        X-Self-Code: sh:( fo:} ch:~ rl:| br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
        X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
    2. Hi,

      • Das Logo als großes Bild
        Das könnte man gleich als H1 auszeichnen. (Darüber gehen die Meinungen aber auseinander.)

      das tun sie, ich teile allerdings eben diese. Das Logo ist der ersetzte Inhalt der Hauptüberschrift, deren textueller Inhalt der Firmenname (oder Name der Organisation, was auch immer) ist.

      Nein, die Liste *als* Container. Kein Grund, noch ein DIV drumherum zu legen.

      Ich sehe einen: Die Topic-Links sind für mich ebenfalls eine Navigation, die Teil eines Navigations-Containers sind. Darüber hinaus sehe ich es absolut als legitim an, die wesentlichen Seitenbereiche durch ein Bereichs-Element (also <div>) zu strukturieren - selbst wenn dieses nur ein Kindelement hat.

      Cheatah

      --
      X-Self-Code: sh:( fo:} ch:~ rl:| br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
      X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
      X-Will-Answer-Email: No
      X-Please-Search-Archive-First: Absolutely Yes
      1. Hallo.

        Darüber hinaus sehe ich es absolut als legitim an, die wesentlichen Seitenbereiche durch ein Bereichs-Element (also <div>) zu strukturieren - selbst wenn dieses nur ein Kindelement hat.

        Die Frage war aber nicht die nach der Legitimität, sondern nach der Sauberkeit. Daher ist davon abzuraten.
        MfG, at

  2. Hallo,

    Ich würde, im Gegenteil zu allen anderen Kommentatoren sagen dass das nicht passt so wie du es haben willst. Ich verweise dabei auch auf Preview of HTML5 - A List Apart

    Auszeichnung

    So würde das viel besser aussehen was du vorhast.

    Jeena

    1. Hallo,

      bei den Vorgaben ('Seminar [...] "Sauberkeit" des Quelltextes (XHTML und CSS)') müßte das Ergebnis idealerweise heute schon den Validator des w3c ohne Fehler oder Warnungen überstehen, mit 'xhtml5' wohl schwierig.

      Grüsse

      Cyx23

      --

      html5
      1. bei den Vorgaben ('Seminar [...] "Sauberkeit" des Quelltextes (XHTML und CSS)') müßte das Ergebnis idealerweise heute schon den Validator des w3c ohne Fehler oder Warnungen überstehen, mit 'xhtml5' wohl schwierig.

        Der W3C-Validator wirft eine Warnung, wenn der HTML5-Validierungsmodus angeworfen wird und die ist nun nicht relevant, weil sie darauf hinweist, dass nach HTML5-Regeln validiert wird.

        1. Hallo,

          bei den Vorgaben ('Seminar [...] "Sauberkeit" des Quelltextes (XHTML und CSS)') müßte das Ergebnis idealerweise heute schon den Validator des w3c ohne Fehler oder Warnungen überstehen, mit 'xhtml5' wohl schwierig.

          Der W3C-Validator wirft eine Warnung, wenn der HTML5-Validierungsmodus angeworfen wird und die ist nun nicht relevant, weil sie darauf hinweist, dass nach HTML5-Regeln validiert wird.

          Zunächst mal vermute ich, dass Du Dich auf HTML5 beziehst und nicht auf gefordertes XHMTL.

          Aber auch die mir bekannte Warnung bei HTML5 ist aus zwei Gründen problematisch. Zunächst mag bei einem solchen Projekt eine unnötige Warnung womöglich erklärungsbedürftig sein und schon daher riskant. Dann sagt die Warnung etwas von "experimental feature" und verweist weiterhin wohl darauf, dass die Entwicklung der betr. "cutting-edge technologies" nicht abgeschlossen sei. Sauberkeit d. Quelltextes schaut anders aus, selbst wenn sich beim W3C die Anmerkungen "last call for comments" zu HTML5 häufen.

          Grüsse

          Cyx23