J.Z.: Korrektes Coden in XHTML

Hallo,

kurze Frage bezügl. XHTML 1.0:

Welcher der folgenden Schreibweisen ist aus Coder-Sicht besser:

<td>
<img... />
</td>

oder

<td><img... /></td> ?

lG,
Julian

  1. Hallo,

    Welcher der folgenden Schreibweisen ist aus Coder-Sicht besser:
    <td>
    <img... />
    </td>

    oder

    <td><img... /></td> ?

    Ersteres, weil du damit besser die baumartigen Strukturen innerhalb der einzelnen Elemente verfolgen kannst.

    Führ das Beispiel doch mal weiter:

    <table><tr><td></td><td></td></tr><tr><td><img.../></td><td></td></tr></table>

    Weißt du hier noch auf den ersten Blick in welcher Spalte und welcher Zeile dein Image sitzt?

    Grüße, Matze

    1. OK Danke für eure Hilfe :-)
      Natürlich achte ich auf Benutzerfreundlichkeit. Mir ging es nur darum, sauberes Programmieren zu lernen und ich glaube, ich bin jetzt auf einem guten Weg und weg von WYSIWYG.

      LG,

      Julian

      1. Ich grüsse den Cosmos,

        Mir ging es nur darum, sauberes Programmieren zu lernen

        Dann solltest du auch lernen, das XHTML keine Programmiersprache ist und du damit somit ncht programmieren kannst.

        Möge das "Self" mit euch sein

        --
        Fragt ein Atom das andere: Hast du mein Elektron gesehen? Ich bin heute so positiv.
        ie:{ br:> fl:| va:| ls:& fo:{ rl:( n4:{ de:] ss:) ch:? js:| mo:) sh:( zu:)
        1. Hallo,

          Dann solltest du auch lernen, das XHTML keine Programmiersprache ist und du damit somit ncht programmieren kannst.

          Das könnte man allerdings verallgemeinern. In z.B. C oder Perl und wahrscheinlich auch in so ziemlich jeder anderen verbreiteten Programmiersprache wird untereinander und eingerückt geschrieben.

          Der Grund bleibt der Selbe.

          Grüße, Matze

  2. Hi J.Z.!

    Welcher der folgenden Schreibweisen ist aus Coder-Sicht besser:

    In Hinsicht auf Validität vollkommen egal!

    Bedenke aber, dass eine valide Seite allein nicht ausreicht. Es werden mindestens noch Inhalt, semantische Struktur und benutzerfreundliche Bedienung erwartet.

    MfG H☼psel

    --
    "It's amazing I won. I was running against peace, prosperity, and incumbency."
    George W. Bush speaking to Swedish Prime Minister unaware a live television camera was still rolling, June 14, 2001
    Selfcode: ie:% fl:( br:> va:) ls:& fo:) rl:? n4:& ss:| de:] js:| ch:? sh:( mo:) zu:)
  3. Hallo Julian,

    <td>
    <img... />
    </td>

    oder

    <td><img... /></td> ?

    Das sind nicht nur unterschiedliche Schreibweisen der gleichen Dinge. Bei der ersten Variante hast du vor und nachdem IMG-Tag noch ein Leerzeichen, welches auch ausgegeben wird.

    Natürlich sollte man versuchen, seinen Quelltext möglich übersichtlich zu gestalt, manchmal muss man aber doch Rücksicht auf die Darstellung im Browser nehmen.

    Schöne Grüße,

    Johannes

    1. Hallo Johannes,

      Bei der ersten Variante hast du vor und nachdem IMG-Tag noch ein Leerzeichen, welches auch ausgegeben wird.

      Nein, Zeilenumbrüche direkt nach einem Start-Tag und direkt vor einem End-Tag müssen ignoriert werden. Es werden daher keine Leerzeichen ausgegeben (im Sinne von Darstellung eines Zeichens auf dem Bildschirm, selbst im IE nicht ;-)). Siehe http://www.w3.org/TR/html401/appendix/notes.html#notes-line-breaks.

      Allerdings hat der Internet Explorer einen Bug, weshalb die beiden Codes hier tatsächlich unterschiedlich interpretiert werden (zumindest bis IE 6, keine Ahnung, wie es im IE 7 aussieht).

      Natürlich sollte man versuchen, seinen Quelltext möglich übersichtlich zu gestalt, manchmal muss man aber doch Rücksicht auf die Darstellung im Browser nehmen.

      ... weshalb dieser Satz nun indirekt wieder wahr ist.

      <td>
      <img... />
      </td>

      Bei dieser Schreibweise liegt im IE das Bild auf der Basislinie für inline-Inhalte. Zwischen Basislinie und unterem Rand des Containers entsteht eine kleine Lücke, die für die Unterlängen von Buchstaben vorgesehen ist. Diese Darstellung wäre korrekt.

      <td><img... /></td>

      Bei dieser Schreibweise fällt im IE die erwähnte Lücke weg, es wäre aber nicht die korrekte Darstellung.

      Bei anderen Browsern ist es egal, welche Variante gewählt wird. Hier hängt es vom Darstellungsmodus ab, ob der Browser die falsche (im Quirks oder im Almost Standards Mode) oder die richtige Darstellung (im Full Standards Mode) nimmt.

      Viele Grüße
      Carsten

      1. Hi,

        Nein, Zeilenumbrüche direkt nach einem Start-Tag und direkt vor einem End-Tag müssen ignoriert werden.

        Außerdem wird oft ja nicht nur ein Zeilenumbruch gesetzt, sondern auch noch eingerückt:
        <td>
            <img .../>
        </td>

        Und spätestens dann gibt es einen Unterschied.

        cu,
        Andreas

        --
        Warum nennt sich Andreas hier MudGuard?
        O o ostern ...
        Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
        1. Hallo Andreas,

          Nein, Zeilenumbrüche direkt nach einem Start-Tag und direkt vor einem End-Tag müssen ignoriert werden.

          Außerdem wird oft ja nicht nur ein Zeilenumbruch gesetzt, sondern auch noch eingerückt:
          <td>
              <img .../>
          </td>

          Und spätestens dann gibt es einen Unterschied.

          Hm, ich habe mir das Ganze eben mal in Firefox 2.0, Opera 9.2 und Internet Explorer 6.0 angeschaut. Keiner dieser Browser macht einen Unterschied zwischen der Schreibweise mit bzw. ohne Einrückung. Bei obigen Code könnte ich es vielleicht noch verstehen. Man könnte argumentieren, daß mehrere aufeinanderfolgende whitespaces zu einem zusammengefaßt werden, so daß nur noch der Zeilenumbruch übrig bleibt. Aber selbst bei diesem Code werden in den Browsern keine Leerzeichen ausgegeben:

          <td> <img .../> </td>

          Ist das nun ein Bug in allen Browsern, die alle whitespaces gleich behandeln und eine notwendige Fallunterscheidung unterlassen, oder gibt es irgendwo eine Stelle in der HTML Recommendation, die das Ganze auf whitespaces allgemein ausdehnt?

          Viele Grüße
          Carsten

          1. Nachtrag:

            Ich habe jetzt noch ein wenig weiter gesucht und habe meine Tests auf Beispiele ohne Bilder ausgedehnt.

            Die folgenden beiden Code-Fragmente sollten dasselbe bewirken (siehe dazu ebenfalls http://www.w3.org/TR/html401/appendix/notes.html#notes-line-breaks):

            <p><a href="...">Linktext</a></p>  
              
            <p><a href="...">  
            Linktext  
            </a></p>
            

            In Firefox 2.0, Opera 9.2 und Internet Explorer 6.0 gibt es hier auch tatsächlich keine Unterschiede.

            Auch folgende Code-Fragmente sollten dann theoretisch wieder dasselbe bewirken:

            <p>Text Text <a href="#">Linktext</a> Text Text</p>  
              
            <p>Text Text <a href="#">  
            Linktext  
            </a> Text Text</p>
            

            In allen drei getesteten Browsern wird nun aber am Ende des Links ein zusätzliches Leerzeichen ausgegeben, eigenartiger Weise aber nicht vor dem Link.

            Sofern ich nicht eine wichtige Regel übersehen habe, so kann ich im Augenblick nur den Schluß ziehen, daß sämtliche von mir gerade getesteten Browser an dieser Stelle fehlerhaft sind.

            Viele Grüße
            Carsten

            1. Kleine Korrektur:

              <p>Text Text <a href="#">

              Linktext
              </a> Text Text</p>

              
              >   
              > In allen drei getesteten Browsern wird nun aber am Ende des Links ein zusätzliches Leerzeichen ausgegeben, eigenartiger Weise aber nicht vor dem Link.  
                
              Es wird \*kein\* zusätzliches Leerzeichen ausgegeben. Das Leerzeichen zwischen "Linktext" und "Text" wird nun zum Link dazugerechnet, während es vorher außerhalb des Links lag.  
                
              Viele Grüße  
              Carsten  
              
              -- 
              [Doctype-Switch? Quirks Mode? Standards Mode? Was is'n das?](http://carsten-protsch.de/zwischennetz/doctype/)