Urs: Trennung Inhalt und Darstellung immer möglich?

Hallo,
ich habe an den unterschiedlichsten Stellen mit den unterschiedlichsten Gründen
Texte, die zentriert dargestellt werden sollen.
Also für jeden Fall krampfhaft einen Klassennamen finden und in CSS

  
.Klasse1, .Klasse2, .......... {text-align: center}

oder doch lieber für alle eine Klasse "zentriert" und

  
.zentriert {text-align: center}

Grüße
Urs

  1. Hallo

    ich habe an den unterschiedlichsten Stellen mit den unterschiedlichsten Gründen
    Texte, die zentriert dargestellt werden sollen.
    Also für jeden Fall krampfhaft einen Klassennamen finden und in CSS

    .Klasse1, .Klasse2, .......... {text-align: center}

    
    > oder doch lieber für alle eine Klasse "zentriert" und  
    > ~~~css
      
    
    > .zentriert {text-align: center}
    
    

    Da es wohl keinen Browser mehr gibt, der nicht mit der Angabe mehrerer Klassen für ein Element klarkommt (der IE konnte das bis v6 nicht), spricht technisch nichts gegen eine Klasse für zentrierten Inhalt. … Aaaaber, du hast da wieder die Vermischung, da die Klasse nur der (momentan gewünschten) Darstellung wegen vergeben wird. Wenn du später ein anderes Design haben willst, in dem die Elemente nicht mehr zentriert werden sollen, passt entweder der Name nicht mehr oder du musst ihn in allen Ecken und Enden ändern.

    Der Weg 1 passt aber auch nur dann, wenn *alle* Elemente der Klasse1 und Klasse2 zentriert werden sollen. Was ist, wenn in einer der Klassen Elemente eben nicht zentriert werden sollen? Dann wird typischerweise der Quelltext zerpflückt und haufenweise zusätzlicher Klassen „erfunden“ um die Elemente zu unterscheiden. Auch nicht ideal, geschweige denn optimal.

    Im besten Fall findest du etwas anderes, was die zentrierten Inhalte eint als die Tatsache, dass sie zentriert werden und benennst die Klasse nach dieser gemeinsamen Eigenschaft. Das dürfen dann auch zwei oder drei Klassennamen sein. Vielleicht kannst du ja auch über das Elternelement gehen um die Elemente zu selektieren (z.B. alle hussel im footer: zentrieren).

    Tschö, Auge

    --
    Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war.
    Terry Pratchett, "Wachen! Wachen!"
    ie:{ fl:| br:> va:) ls:[ fo:) rl:( ss:| de:> js:| zu:}
    Veranstaltungsdatenbank Vdb 0.3
    1. Hallo,

      es ist eher ungeschickt, eine Klasse nach dem Ergebnis (hier zentriert) zu benennen.

      mit den unterschiedlichsten Gründen

      In diesem Fall wäre es besser die Klassen nach diesen Gründen zu benennen, die du nicht weiter erklärt hast.

      Gruss

      MrMurphy

      1. es ist eher ungeschickt, eine Klasse nach dem Ergebnis (hier zentriert) zu benennen.

        Das war mir klar, daher mein Posting.

        mit den unterschiedlichsten Gründen

        In diesem Fall wäre es besser die Klassen nach diesen Gründen zu benennen, die du nicht weiter erklärt hast.

        Die Gründe sind:
        "Schön wäre es, wenn dies zentriert wäre, dies möchte ich zentriert, das muss unbedingt zentriert und fett erscheinen, u.s.w.
        Gruß
        Urs

        1. @@Urs:

          nuqneH

          Die Gründe sind:
          "Schön wäre es, wenn dies zentriert wäre, dies möchte ich zentriert, das muss unbedingt zentriert und fett erscheinen, u.s.w.

          Nein.

          Mögliche Gründe sind: Dies ist eine Überschrift, dies ist ein Zitat, das ist ein hervorgehobener Absatz.

          _Später_ kannst du dir wünschen: Ich möchte Überschriften, Zitate und hervorgehobene Absätze zentriert darstellen.

          HTML sollte nicht die (gegenwärtig!) gewünschte Darstellung angeben.

          Und wenn du entgegen dieses Ratschlags präsentationsbezogenes Markup schreiben willst, verwende das center-Element. Das wäre dann wenigstens ehrlich.

          Qapla'

          --
          „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
        2. Hallo!

          Die beiden bisherigen Antworten spiegeln die Ansicht "der reinen Lehre" wieder ...! ;-)
          Persönlich bin ich der Ansicht, dass man es durchaus etwas "differenzierter" sehen darf.

          es ist eher ungeschickt, eine Klasse nach dem Ergebnis (hier zentriert) zu benennen.

          In diesem Fall wäre es besser die Klassen nach diesen Gründen zu benennen, die du nicht weiter erklärt hast.

          Wenn ich mehr als ein Element habe, also eine Gruppe von Elementen, die aufgrund ihrer "Bedeutung/ Semantik" im Dokument eine bestimmte Formatierung erhalten sollen, dann sollte man ihnen auch eine entsprechende Klasse geben, die eben genau die Bedeutung/ Semantik wiederspiegelt, und nicht etwa an der Art der Darstellung orientiert/ angelehnt ist.

          Wenn es aber bei diversen einzelnen Elementen (, die_nicht_unter die vorgenannte Gruppe fallen!) um einfache darstellungstechnische Eigenschaften geht, wie bspw. dass der Inhalt eines Elements zentriert angezeigt werden soll, dann halte ich es für "überflüssig", sich jetzt dutzende von Klassennamen "auszudenken und aufzulisten, nur um all diesen Klassen ein 'text-align: center' zu verpassen.

          Das "Totschlagargument" gegen diese Vorgehensweise ist: Und was, wenn die Klasse jetzt z.B. die Eigenschaft 'text-align: right' bekommt?

          Das Argument greift aber imho nicht, denn bei dieser Vorgehensweise ändert man ja gerade nicht die Eigenschaft der Klasse, sondern würde das Class-Attribut des jeweiligen HTML Elements ändern.

          Ob das "praktikabel" ist, hängt u.a. davon ab, wie die entsprechenden HTML Dokumente generiert werden (dynamisch/ statisch), ob es sich um "eine überschaubare Anzahl" handelt oder um hunderte von Dokumenten etc.

          Um diese Vorgehensweise zu verwenden, muss aber sichergestellt sein, dass die jeweilige Darstellung_immer_, also unter allen Umständen gegeben ist.
          Wenn also bspw. die betreffenden Elemente in einem "responsive layout" je nach Viewportgröße mal zentriert und mal links oder rechtsbündig ausgerichtet sind, dann muss man auf eine andere Variante zurückgreifen.

          Es kommt also wie immer beim Webdesign auf den konkreten Einzelfall an.
          Aber eine solche Vorgehensweise grundsätzlich auszuschließen, halte ich auch nicht für angebracht.

          Gruß Gunther

          1. Wenn es aber bei diversen einzelnen Elementen (, die_nicht_unter die vorgenannte Gruppe fallen!) um einfache darstellungstechnische Eigenschaften geht, wie bspw. dass der Inhalt eines Elements zentriert angezeigt werden soll, dann halte ich es für "überflüssig", sich jetzt dutzende von Klassennamen "auszudenken und aufzulisten, nur um all diesen Klassen ein 'text-align: center' zu verpassen.

            Das "Totschlagargument" gegen diese Vorgehensweise ist: Und was, wenn die Klasse jetzt z.B. die Eigenschaft 'text-align: right' bekommt?

            Das Argument greift aber imho nicht, denn bei dieser Vorgehensweise ändert man ja gerade nicht die Eigenschaft der Klasse, sondern würde das Class-Attribut des jeweiligen HTML Elements ändern.

            Da würde ich weder die Regeln für die Klasse noch die Semantik des Elements ändern, sondern eine Regel mit höherer Spezifität verwenden.

            Ob das "praktikabel" ist, hängt u.a. davon ab, wie die entsprechenden HTML Dokumente generiert werden (dynamisch/ statisch), ob es sich um "eine überschaubare Anzahl" handelt oder um hunderte von Dokumenten etc.

            Gerade bei den gängigen CMSen und deren Templates (die meisten rotzen einem ja immernoch eine div-Suppe hin) geht die Semantik ja komplett unter.

            Es kommt also wie immer beim Webdesign auf den konkreten Einzelfall an.
            Aber eine solche Vorgehensweise grundsätzlich auszuschließen, halte ich auch nicht für angebracht.

            ACK. Und trotzdem pauschalisieren wir >_<'

            MfG
            bubble

            --
            If "god" had intended us to drink beer, he would have given us stomachs. - David Daye
      2. Hallo

        es ist eher ungeschickt, eine Klasse nach dem Ergebnis (hier zentriert) zu benennen.

        Du musst mir nicht schreiben, was ich schrieb.

        mit den unterschiedlichsten Gründen

        In diesem Fall wäre es besser die Klassen nach diesen Gründen zu benennen, die du nicht weiter erklärt hast.

        Warum sollte ich? Es ist Aufgabe des OP seine mir nicht bekannte Struktur zu analysieren und die „Gründe“ zu ermitteln.

        Tschö, Auge

        --
        Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war.
        Terry Pratchett, "Wachen! Wachen!"
        ie:{ fl:| br:> va:) ls:[ fo:) rl:( ss:| de:> js:| zu:}
        Veranstaltungsdatenbank Vdb 0.3
        1. Hallo

          Es ist Aufgabe des OP seine mir nicht bekannte Struktur zu analysieren und die „Gründe“ zu ermitteln.

          Ich meine, dass hier zu viel Perfektionismus und Theorie gepflegt wird.
          Wenn der Auftraggeber Textvorlagen liefert und sagt, so muss es aussehen (eingerückt, linksbündig, zentriert u.a.), und dies für jedes neue Dokument anders,
          so kann ich keine Gründe ermitteln außer "dies muss so sein, das muss so sein, jenes muss so sein".
          Ein weiterer Punkt, der mir zu wenig beachtet wird:
          Ist die Webseite als langlebig konzipiert oder nur kurzlebig, z.B. Werbeseite für eine Veranstaltung im kommenden Monat.
          Wenn dann jedesmal analysiert werden soll, so ist der Aufwand nicht zu vertreten.
          Gruß
          Urs

          1. @@Urs:

            nuqneH

            z.B. Werbeseite für eine Veranstaltung im kommenden Monat.

            Auch dann ist es gut[tm], den Inhalt auszuzeichnen, nicht die Darstellung. Suchmaschinen interessieren sich nicht für
            <div class="zentriert">,
            wohl aber für
            <div vocab="http://[link:http://schema.org/@title=schema.org]/" typeof="[link:http://schema.org/Event@title=Event]">

            Qapla'

            --
            „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
            1. Hi

              z.B. Werbeseite für eine Veranstaltung im kommenden Monat.

              Auch dann ist es gut[tm], den Inhalt auszuzeichnen, nicht die Darstellung. Suchmaschinen interessieren sich nicht für
              <div class="zentriert">,
              wohl aber für
              <div vocab="http://[link:http://schema.org/@title=schema.org]/" typeof="[link:http://schema.org/Event@title=Event]">

              Und wo steckt hier:
              <div vocab="http://[link:http://schema.org/@title=schema.org]/" typeof="[link:http://schema.org/Event@title=Event]">
               die Angabe, dass zentriert darzustellen ist?
              Gruß
              Urs

              1. Om nah hoo pez nyeetz, Urs!

                Und wo steckt hier:
                <div vocab="http://[link:http://schema.org/@title=schema.org]/" typeof="[link:http://schema.org/Event@title=Event]">
                die Angabe, dass zentriert darzustellen ist?

                Darstellung gehört ins CSS.

                [typeof=event] {  
                  text-align: center;  
                }
                

                Matthias

                --
                Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Ohm und Ohmdenosaurus.

                1. Hallo Matthias,

                  Darstellung gehört ins CSS.

                  [typeof=event] {

                  text-align: center;
                  }

                  Wenn ich suche "css und typeof" finde ich nur Treffer mit Javascript, nicht aber mit CSS.  
                  Wo ist es in CSS beschrieben?  
                  Gruß  
                  Urs  
                  
                  
                  1. Om nah hoo pez nyeetz, Urs!

                    Wenn ich suche "css und typeof" finde ich nur Treffer mit Javascript, nicht aber mit CSS.
                    Wo ist es in CSS beschrieben?

                    es handelt sich um einen Attributselektor.

                    Matthias

                    --
                    Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Lauda und Laudatio.

                2. @@Matthias Apsel:

                  nuqneH

                  [typeof=event] {

                  text-align: center;
                  }

                    
                  Du könntest `tYpEoF` schreiben; Bezeichner von Attributen sind (ebenso wie Bezeichner von Elementtypen) nicht case-sensitiv.  
                    
                  `event` funktioniert aber nicht; Attributwerte sind case-sensitiv. Es muss wie im Markup `Event` heißen.  
                    
                  Qapla'
                  
                  -- 
                  „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
                  
                  1. Om nah hoo pez nyeetz, Gunnar Bittersmann!

                    event funktioniert aber nicht; Attributwerte sind case-sensitiv. Es muss wie im Markup Event heißen.

                    Ja, fiel mir gleich auf. Aber es gibt ja keine Editfunktion. ;-)

                    Matthias

                    --
                    Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Beton und betont.

              2. @@Urs:

                nuqneH

                Und wo steckt hier:
                <div vocab="http://[link:http://schema.org/@title=schema.org]/" typeof="[link:http://schema.org/Event@title=Event]">
                die Angabe, dass zentriert darzustellen ist?

                Na eben nirgends. Soll ja auch nicht.

                Darstellungsangaben sollten nicht im HTML stehen.

                Qapla'

                --
                „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
                1. Und wo steckt hier:
                  <div vocab="http://[link:http://schema.org/@title=schema.org]/" typeof="[link:http://schema.org/Event@title=Event]">
                  die Angabe, dass zentriert darzustellen ist?

                  Na eben nirgends. Soll ja auch nicht.

                  Darstellungsangaben sollten nicht im HTML stehen.

                  Nur wie wird es in CSS angegeben? Ich sehe oben weder class= noch id=.

                  1. Und wo steckt hier:
                    <div vocab="http://[link:http://schema.org/@title=schema.org]/" typeof="[link:http://schema.org/Event@title=Event]">
                    die Angabe, dass zentriert darzustellen ist?

                    Na eben nirgends. Soll ja auch nicht.

                    Darstellungsangaben sollten nicht im HTML stehen.
                    Nur wie wird es in CSS angegeben? Ich sehe oben weder class= noch id=.

                    Hat sich wohl erledigt ([typeof=Event]) mit großem E!

                  2. Om nah hoo pez nyeetz, Urs!

                    Nur wie wird es in CSS angegeben? Ich sehe oben weder class= noch id=.

                    So. class und id sind bei weitem nicht die einzigen Möglichkeiten, ein Element zu selektieren. Liest du auch die Antworten resp. die verlinkten Dokumente?

                    Matthias

                    --
                    Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Tür und Türkei.

                    1. Hi Matthias

                      Nur wie wird es in CSS angegeben? Ich sehe oben weder class= noch id=.

                      So. class und id sind bei weitem nicht die einzigen Möglichkeiten, ein Element zu selektieren. Liest du auch die Antworten resp. die verlinkten Dokumente?

                      Da haben sich unsere Beiträge überschnitten.
                      Ich hatte das typeof mit der vorgeschlagenen Schreibweise erfolglos getestet. Jetzt ist es klarer.
                      Gruß
                      Urs

            2. @@Gunnar Bittersmann:

              nuqneH

              Suchmaschinen interessieren sich […] für
              <div vocab="http://[link:http://schema.org/@title=schema.org]/" typeof="[link:http://schema.org/Event@title=Event]">

              Die semantische Auszeichnung mit Schema.org ist natürlich nur sinnvoll, wenn das Event auch Eigenschaften (name, description, startDate, …) hat.

              <p vocab="http://schema.org/" typeof="MusicEvent">  
                Das Konzert von  
                <span property="performer">Walk off the Earth</span>  
                in der  
                <span property="location">Passionskirche Berlin</span>  
                am  
                <time property="startDate" datetime="2014-04-21">21.04.2014</time>  
                ist  
                <span property="offers" typeof="Offer">  
                  <meta property="availability" content="http://schema.org/SoldOut"/>ausverkauft  
                </span>.  
              </p>
              

              (Datum und Verfügbarkeit sind maschinen- und menschenlesbar angegeben.)

              Qapla'

              --
              „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
          2. Hallo

            Es ist Aufgabe des OP seine mir nicht bekannte Struktur zu analysieren und die „Gründe“ zu ermitteln.

            Ich meine, dass hier zu viel Perfektionismus und Theorie gepflegt wird.

            Du darfst natürlich machen, was du willst. Dass die Vergabe einer Klasse für zu zentrierende Inhalte browserübergreifend machbar ist, habe ich dir geschrieben. Ich darf dich aber zitieren: „Trennung Inhalt und Darstellung immer möglich?“ und „Also für jeden Fall krampfhaft einen Klassennamen finden […] oder doch lieber für alle eine Klasse "zentriert" …“.

            Du hast, so interpretiere ich es zumindest, nach Meinungen zum „besseren Weg“™ gefragt. Dazu hast du Antworten bekommen. Mein „Es ist Aufgabe des OP“ galt übrigens nicht dir sondern MrMurphy.

            Wenn der Auftraggeber Textvorlagen liefert und sagt, so muss es aussehen (eingerückt, linksbündig, zentriert u.a.), und dies für jedes neue Dokument anders,
            so kann ich keine Gründe ermitteln außer "dies muss so sein, das muss so sein, jenes muss so sein".

            Ja, dann mach das doch.

            Ein weiterer Punkt, der mir zu wenig beachtet wird:
            Ist die Webseite als langlebig konzipiert oder nur kurzlebig, z.B. Werbeseite für eine Veranstaltung im kommenden Monat.

            Wo ist da der Unterschied? Wenn die Seite die Termine der Veranstaltungen des nächsten Monats ausgibt, wird die Seite für den übernächsten Monat doch vermutlich den gleichen Konventionen für die Formatierung folgen, oder nicht?

            Wenn dann jedesmal analysiert werden soll, so ist der Aufwand nicht zu vertreten.

            Das soll (im Idealfall) einmal analysiert werden, um ein Konzept auszuarbeiten, mit dem man dauerhaft arbeiten kann. Dass da später ab und zu nachgearbeitet werden wird, sei dahingestellt. Du willst mir doch nicht erzählen, dass jede Seite anders aussieht als jede andere Seite?

            Tschö, Auge

            --
            Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war.
            Terry Pratchett, "Wachen! Wachen!"
            ie:{ fl:| br:> va:) ls:[ fo:) rl:( ss:| de:> js:| zu:}
            Veranstaltungsdatenbank Vdb 0.3
            1. Hallo

              Ein weiterer Punkt, der mir zu wenig beachtet wird:
              Ist die Webseite als langlebig konzipiert oder nur kurzlebig, z.B. Werbeseite für eine Veranstaltung im kommenden Monat.

              Wo ist da der Unterschied? Wenn die Seite die Termine der Veranstaltungen des nächsten Monats ausgibt, wird die Seite für den übernächsten Monat doch vermutlich den gleichen Konventionen für die Formatierung folgen, oder nicht?

              Eben nicht. Es sind immer einmalige Events und falls es eine Veranstaltung im nächsten Jahr geben sollte, so sind die Anforderung wieder anders.

              Wenn dann jedesmal analysiert werden soll, so ist der Aufwand nicht zu vertreten.

              Du willst mir doch nicht erzählen, dass jede Seite anders aussieht als jede andere Seite?

              Doch, genau so ist es.
              Und dies ist der Grund, dass ich mich gegen diese strikten Forderungen richte.
              Grüße Urs

              1. Hallo

                Und dies ist der Grund, dass ich mich gegen diese strikten Forderungen richte.

                Meiner Ansicht nach suchst du eher zwanghaft Gründe um deine Meinung zu festigen.

                Wenn du unbedingt Lösungen suchst, zu denen bewährte und vorgesehene Vorgehensweisen nicht passen, hält dich niemand von anderen Lösungen ab.

                Bloß versuche dann bitte nicht, die Lösungen für dein spezielles Problem auf andere zu übertragen oder gar sinnvolle Lösungen als falsch darzustellen.

                Gruss

                MrMurphy

                1. Hallo

                  Und dies ist der Grund, dass ich mich gegen diese strikten Forderungen richte.

                  Meiner Ansicht nach suchst du eher zwanghaft Gründe um deine Meinung zu festigen.

                  Wenn du unbedingt Lösungen suchst, zu denen bewährte und vorgesehene Vorgehensweisen nicht passen, hält dich niemand von anderen Lösungen ab.

                  Nichts lag mir ferner.
                  Nur sehe ich umgekehrt, dass man sofort kritisiert wird, wenn man hier in einem Beispiel in HTML eine style-Angabe präsentiert. Und dies ohne zu wissen, ob dieses HTML-Dokument sehr kurzlebig ist und eine seiner Art nicht erneut vorkommen wird.
                  Also warum in diesem Falle den Aufwand für die strikte Trennung von Inhalt und Layout betreiben?
                  Gruß
                  Urs