Martin_Online: Nehme ich dazu eine Tabelle?

Hallo,

nehme ich für diese Darstellung eine Tabelle oder wie würdet ihr dieses machen? Hab gelesen Tabellen sind nicht so gut bzw. machen beim responsiven Webdesign ärger.

http://s1.directupload.net/images/140513/9v9d8odl.png

  1. nehme ich für diese Darstellung eine Tabelle oder wie würdet ihr dieses machen? Hab gelesen Tabellen sind nicht so gut bzw. machen beim responsiven Webdesign ärger.

    Ich mache meine Monatstabellen so klein, dass sie auch auf einen kleinen Bildschirm passen.

  2. Hallo,

    nehme ich für diese Darstellung eine Tabelle oder wie würdet ihr dieses machen? Hab gelesen Tabellen sind nicht so gut bzw. machen beim responsiven Webdesign ärger.

    Inhaltlich wäre eine Tabelle durchaus passend.

    Tabellen sind aus CSS-Sicht nicht besser oder schlechter, man kann sie für schmale Viewports komplett umformatieren. Tabellen bringen aber ein Standardlayout mit, dass sich nur durch das Überschreiben von vielen display-Eigenschaften ändern lässt.

    http://s1.directupload.net/images/140513/9v9d8odl.png

    Das sieht nach einem Anwendungsfall für CSS Multicolumn-Layout aus. Damit lässt sich bei breitem Viewport eine Mehrspaltigkeit erzeugen, bei der der Inhalt automatisch auf die Spalten verteilt wird. Bei schmalem Viewport gibt es keine Mehrspaltigkeit, so dass der Inhalt untereinander liegt.

    In dem Fall würde ich nicht mit einer Tabelle arbeiten, sondern mit einer einfachen Liste und zusätzlichen div- oder span-Elementen, sofern nötig.

    http://webkrauts.de/artikel/2011/css3-im-praxistest-multi-column-layout
    https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Using_multi-column_layouts
    http://forum.de.selfhtml.org/archiv/2009/10/t191245/#m1275378
    http://forum.de.selfhtml.org/archiv/2013/3/t213192/#m1457288

    Grüße
    Mathias

    1. @@molily:

      nuqneH

      In dem Fall würde ich nicht mit einer Tabelle arbeiten, sondern mit einer einfachen Liste und zusätzlichen div- oder span-Elementen, sofern nötig.

      Dann geht aber der Zusammenhang zwischen den Spalten verloren.

      Eine derartige Tabelle hatten wir im Thread Tabellen mehrspaltig gestalten. Meine Lösung war diese.

      Qapla'

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

        In dem Fall würde ich nicht mit einer Tabelle arbeiten, sondern mit einer einfachen Liste und zusätzlichen div- oder span-Elementen, sofern nötig.

        Dann geht aber der Zusammenhang zwischen den Spalten verloren.

        Wieso geht bei
        <li><span>Foo:</span> <span>Bar</span></li>
        der Zusammenhang verloren?

        Eine derartige Tabelle hatten wir im Thread Tabellen mehrspaltig gestalten. Meine Lösung war diese.

        Den Thread hatte ich gesucht, danke!

        Mathias

        1. @@molily:

          nuqneH

          Dann geht aber der Zusammenhang zwischen den Spalten verloren.

          Wieso geht bei
          <li><span>Foo:</span> <span>Bar</span></li>
          der Zusammenhang verloren?

          Hab mich missverständlich ausgedrückt. Bei

          <li><span>Foo:</span> <span>Bar</span></li>  
          <li><span>Baz:</span> <span>Quz</span></li>
          

          ist der Zusammenhang der Zellen innerhalb der Zeilen gegeben, nicht aber der Zusammenhang der Zellen innerhalb der Spalten, d.h. Foo–Baz und Bar–Quz.

          Und ich spreche nicht davon, dass ein sehender Nutzer diesen anhand der visuellen Darstellung selbst herstellt.

          Qapla'

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

        nuqneH

        In dem Fall würde ich nicht mit einer Tabelle arbeiten, sondern mit einer einfachen Liste und zusätzlichen div- oder span-Elementen, sofern nötig.

        Dann geht aber der Zusammenhang zwischen den Spalten verloren.

        Damit da überhaupt ein "Zusammenhang" (zwischen Spalten) bestünde, müsste es sich ja erstmal auch um tabellarische Daten handeln ...!

        Tut es aber imho nicht, denn dieselbe "Information" ließe sich ja bspw. auch durch:

        Mo. - Fr.  08:00 - 18:00  
        
        

        ausdrücken.

        Oder man könnte genausogut eine Definitionsliste (dl) verwenden.

        Also handelt es sich hier imho mehr um eine reine Darstellungsfrage, als um die Frage nach_der_semantisch korrekten Auszeichnung.

        Viel wichtiger wäre mir auch die entsprechende Auszeichnung nach schema.org. In diesem Fall also Opening Hours:

        <p itemprop="openingHoursSpecification" itemscope itemtype="http://schema.org/OpeningHoursSpecification">  
        	&Ouml;ffnungszeiten:<br />  
        	Montag - Freitag&nbsp;&nbsp;  
        	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Monday">  
        	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Tuesday">  
        	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Wednesday">  
        	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Thursday">  
        	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Friday">  
        	<meta itemprop="opens" content="08:00:00">08:00 -  
        	<meta itemprop="closes" content="18:00:00">18:00 Uhr<br />  
        	Samstag + Sonntag&nbsp;&nbsp;  
        	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Saturday">  
        	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Sunday">  
        	<meta itemprop="opens" content="00:00:00">  
        	<meta itemprop="closes" content="00:00:00">  
        	geschlossen  
        </p>  
        
        

        Gruß Gunther

        1. @@Gunther:

          nuqneH

          @@Gunther:

          nuqneH

          Damit da überhaupt ein "Zusammenhang" (zwischen Spalten) bestünde, müsste es sich ja erstmal auch um tabellarische Daten handeln ...!

          Tut es aber imho nicht

          YMMV.

          denn dieselbe "Information" ließe sich ja bspw. auch durch:
          Mo. - Fr.  08:00 - 18:00
          ausdrücken.

          Mo.–Fr.   08:00–18:00  
          Sa.–So.   geschlossen
          

          Da isse wieder, die Tabelle.

          Viel wichtiger wäre mir auch die entsprechende Auszeichnung nach schema.org.

          Da bin ich Fan von.

          <p itemprop="openingHoursSpecification" itemscope itemtype="http://schema.org/OpeningHoursSpecification">

          O je, microdata. Da bin ich nicht Fan von.

          &Ouml;ffnungszeiten:

          Welcher D&auml;mon hat dich denn hier geritten?

          <p itemprop="openingHoursSpecification" itemscope itemtype="http://schema.org/OpeningHoursSpecification">

          &Ouml;ffnungszeiten:<br />
          Montag - Freitag&nbsp;&nbsp;
          <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Monday">
          <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Tuesday">
          <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Wednesday">
          <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Thursday">
          <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Friday">
          <meta itemprop="opens" content="08:00:00">08:00 -
          <meta itemprop="closes" content="18:00:00">18:00 Uhr<br />
          Samstag + Sonntag&nbsp;&nbsp;
          <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Saturday">
          <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Sunday">
          <meta itemprop="opens" content="00:00:00">
          <meta itemprop="closes" content="00:00:00">
          geschlossen
          </p>

            
          Ich glaube nicht, dass das so funktioniert.  
            
          opens "00:00:00" und closes "00:00:00" ist vielleicht was anderes als öffnet gar nicht.  
            
          Und so geht auch die Zuordnung der Uhrzeiten zu den Wochentagen verloren. Hab jetzt auf die Schnelle auch kein Beispiel gefunden, wie verschiedene Öffnungszeiten an verschiedenen Wochentagen anzugeben sind. Vermutlich mit separaten openingHoursSpecification-Prädikaten.  
            
          Aber wenn sonnabends und sonntags zu ist, dann gar keine Angabe für diese Wochentage.  
            
          Qapla'
          
          -- 
          „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
          
          1. @@Gunnar:

            nuqneH

            Damit da überhaupt ein "Zusammenhang" (zwischen Spalten) bestünde, müsste es sich ja erstmal auch um tabellarische Daten handeln ...!

            Tut es aber imho nicht

            YMMV.

            denn dieselbe "Information" ließe sich ja bspw. auch durch:
            Mo. - Fr.  08:00 - 18:00
            ausdrücken.

            Mo.–Fr.   08:00–18:00

            Sa.–So.   geschlossen

            
            >   
            > Da isse wieder, die Tabelle.  
              
            Wie gesagt, imho gibt es hier diverse Auszeichnungsmöglichkeiten - auch eine Tabelle.  
            Wobei ich persönlich dann doch die Definitionsliste vorziehen würde.  
              
            
            > > Viel wichtiger wäre mir auch die entsprechende Auszeichnung nach schema.org.  
            >   
            > Da bin ich Fan von.  
            >   
            > > `<p itemprop="openingHoursSpecification" itemscope itemtype="http://schema.org/OpeningHoursSpecification">`{:.language-html}  
            >   
            > O je, microdata. Da bin ich nicht Fan von.  
              
            Warum nicht?  
            Wichtig ist doch, dass es von möglichst vielen SuMas, allen voran Google, auch "verstanden" wird.  
              
            
            > > `	&Ouml;ffnungszeiten:`{:.language-html}  
            >   
            > Welcher D&auml;mon hat dich denn hier geritten?  
              
            Jetzt sei nicht so pingelÖg ...! :-P  
              
            
            > > ~~~html
            
            <p itemprop="openingHoursSpecification" itemscope itemtype="http://schema.org/OpeningHoursSpecification">  
            
            > > 	&Ouml;ffnungszeiten:<br />  
            > > 	Montag - Freitag&nbsp;&nbsp;  
            > > 	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Monday">  
            > > 	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Tuesday">  
            > > 	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Wednesday">  
            > > 	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Thursday">  
            > > 	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Friday">  
            > > 	<meta itemprop="opens" content="08:00:00">08:00 -  
            > > 	<meta itemprop="closes" content="18:00:00">18:00 Uhr<br />  
            > > 	Samstag + Sonntag&nbsp;&nbsp;  
            > > 	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Saturday">  
            > > 	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Sunday">  
            > > 	<meta itemprop="opens" content="00:00:00">  
            > > 	<meta itemprop="closes" content="00:00:00">  
            > > 	geschlossen  
            > > </p>  
            > > 
            
            

            Ich glaube nicht, dass das so funktioniert.

            Also bei Google+ auf jeden Fall.
            Zeigt Sa. und So. ganztägig geschlossen an, während an den Wochentagen "Heute: <von>-<bis>" angezeigt wird.

            opens "00:00:00" und closes "00:00:00" ist vielleicht was anderes als öffnet gar nicht.

            Ich habe damals auch nichts dazu gefunden, wie man "geschlossen" angibt/ angeben soll.
            Keine Angabe ist vermutlich "die beste" Variante. Ich hatte es halt mal so ausprobiert, und scheint auch zu "funktionieren".

            Und so geht auch die Zuordnung der Uhrzeiten zu den Wochentagen verloren. Hab jetzt auf die Schnelle auch kein Beispiel gefunden, wie verschiedene Öffnungszeiten an verschiedenen Wochentagen anzugeben sind. Vermutlich mit separaten openingHoursSpecification-Prädikaten.

            Wieso sollte so die Zuordnung verloren gehen?
            Erst alle <link> und dann alle <meta>, wobei sich diese dann auf_alle_vorangegangenen <link> beziehen.

            Aber wenn sonnabends und sonntags zu ist, dann gar keine Angabe für diese Wochentage.

            s.o.

            Mir erscheint "Information" durch Weglassen/ Nichtvorhandensein immer eher "suspekt" ...! ;-)

            Gruß Gunther

            1. @@Gunther:

              nuqneH

              O je, microdata. Da bin ich nicht Fan von.

              Warum nicht?

              Weil Hixie hier unbedingt sein Zeugs in HTML5 abkippen musste, obwohl es mit RDFa schon einen Standard für genau diesen Zweck gab.

              Weil ich denn Sinn der Dopplung von itemscope und itemtype noch nie verstanden habe. RDFa kommt mit einem Attribut (typeof) aus.

              <p itemprop="openingHoursSpecification" itemscope itemtype="http://schema.org/OpeningHoursSpecification">

              &Ouml;ffnungszeiten:<br />  
              Montag - Freitag&nbsp;&nbsp;  
              <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Monday">  
              <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Tuesday">  
              <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Wednesday">  
              <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Thursday">  
              <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Friday">  
              <meta itemprop="opens" content="08:00:00">08:00 -  
              <meta itemprop="closes" content="18:00:00">18:00 Uhr<br />  
              Samstag + Sonntag&nbsp;&nbsp;  
              <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Saturday">  
              <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Sunday">  
              <meta itemprop="opens" content="00:00:00">  
              <meta itemprop="closes" content="00:00:00">  
              geschlossen  
              

              </p>

              
              > >   
              > > Ich glaube nicht, dass das so funktioniert.  
              > > …  
              > > Und so geht auch die Zuordnung der Uhrzeiten zu den Wochentagen verloren. Hab jetzt auf die Schnelle auch kein Beispiel gefunden, wie verschiedene Öffnungszeiten an verschiedenen Wochentagen anzugeben sind. Vermutlich mit separaten openingHoursSpecification-Prädikaten.  
              >   
              > Wieso sollte so die Zuordnung verloren gehen?  
              > Erst alle <link> und dann alle <meta>, wobei sich diese dann auf\_alle\_vorangegangenen <link> beziehen.  
                
              Die itemprops sollten sich alle auf das übergeordnete itemscope-Element beziehen (um mal in microdata-Sprech zu bleiben); die Reihenfolge sollte egal sein.  
                
              Was du ausdrückst, wäre also: an allen Wochentagen von 08:00–18:00 und von 00:00–00:00 geöffnet.  
                
              Willst du verschiedene Öffnungszeiten an verschiedenen Wochentagen ausdrücken, bräuchtest du mehrere itemprop="openingHoursSpecification".  
                
                
              
              > Also bei Google+ auf jeden Fall.  
              > Zeigt Sa. und So. ganztägig geschlossen an, während an den Wochentagen "Heute: <von>-<bis>" angezeigt wird.  
                
              Die Interpretaion halte ich für falsch.  
                
                
                
              
              > > opens "00:00:00" und closes "00:00:00" ist vielleicht was anderes als öffnet gar nicht.  
              >   
              > Ich habe damals auch nichts dazu gefunden, wie man "geschlossen" angibt/ angeben soll.  
              > Keine Angabe ist vermutlich "die beste" Variante.  
                
              Vermutlich die einzige. Du gibtst ja auch nicht an, dass Mo—Fr von 00:00–08:00 und von 18:00–24:00 geschlossen ist.  
                
              opens "00:00:00" und closes "00:00:00" könnte auch heißen, dass zwischen 00:00:00 und 00:00:01 für ein paar Millisekunden auf ist.  
                
              Sollte eine Abfrage, ob an einem bestimmet Wochentag geöffnet ist, prüfen müssen, ob der Wert von close größer ist als der von open? Oder sich einfach drauf verlassen können, dass bei einer Angabe von open tatsächlich geöffnet ist? Ich bin für letzteres.  
                
              Qapla'
              
              -- 
              „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
              
              1. @@Gunnar:

                nuqneH

                O je, microdata. Da bin ich nicht Fan von.

                Warum nicht?

                Weil Hixie hier unbedingt sein Zeugs in HTML5 abkippen musste, obwohl es mit RDFa schon einen Standard für genau diesen Zweck gab.

                Tja, im Endeffekt entscheidet Google, was sich durchsetzt und was nicht ...!

                Weil ich denn Sinn der Dopplung von itemscope und itemtype noch nie verstanden habe. RDFa kommt mit einem Attribut (typeof) aus.

                Bei manchen dieser Dinge habe ich es inzwischen auch aufgegeben, den Sinn dahinter verstehen zu wollen.

                <p itemprop="openingHoursSpecification" itemscope itemtype="http://schema.org/OpeningHoursSpecification">

                &Ouml;ffnungszeiten:<br />  
                Montag - Freitag&nbsp;&nbsp;  
                <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Monday">  
                <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Tuesday">  
                <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Wednesday">  
                <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Thursday">  
                <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Friday">  
                <meta itemprop="opens" content="08:00:00">08:00 -  
                <meta itemprop="closes" content="18:00:00">18:00 Uhr<br />  
                Samstag + Sonntag&nbsp;&nbsp;  
                <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Saturday">  
                <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Sunday">  
                <meta itemprop="opens" content="00:00:00">  
                <meta itemprop="closes" content="00:00:00">  
                geschlossen  
                

                </p>

                  
                
                > > > opens "00:00:00" und closes "00:00:00" ist vielleicht was anderes als öffnet gar nicht.  
                > >   
                > > Ich habe damals auch nichts dazu gefunden, wie man "geschlossen" angibt/ angeben soll.  
                > > Keine Angabe ist vermutlich "die beste" Variante.  
                >   
                > Vermutlich die einzige. Du gibtst ja auch nicht an, dass Mo—Fr von 00:00–08:00 und von 18:00–24:00 geschlossen ist.  
                  
                Richtig! Aber an diesen Tagen gibt es ja auch Zeiten, in denen geöffnet ist.  
                  
                
                > opens "00:00:00" und closes "00:00:00" könnte auch heißen, dass zwischen 00:00:00 und 00:00:01 für ein paar Millisekunden auf ist.  
                  
                Die Logik verstehe ich nicht ...!?  
                Die kleinste mögliche Zeiteinheit ist 1 Sekunde. Die Differenz zwischen opens und closes ist kleiner. Demnach müsste nach meiner Logik eine Öffnungszeitendauer von 0 Sekunden herauskommen, was wiederum mit "geschlossen" gleichzusetzen ist/ wäre.  
                  
                
                > Sollte eine Abfrage, ob an einem bestimmet Wochentag geöffnet ist, prüfen müssen, ob der Wert von close größer ist als der von open? Oder sich einfach drauf verlassen können, dass bei einer Angabe von open tatsächlich geöffnet ist? Ich bin für letzteres.  
                  
                Ja, das "System" scheint tatsächlich darauf zu beruhen, dass man die Öffnungszeiten angibt, und alles, was nicht davon abgedeckt wird, als "geschlossen" erachtet wird.  
                  
                Ist ja auch nicht unbedingt unlogisch, nur etwas gewöhnungsbedürftig.  
                  
                Für den vorliegenden Fall müsste es dann also korrekt heißen:  
                ~~~html
                <p itemprop="openingHoursSpecification" itemscope itemtype="http://schema.org/OpeningHoursSpecification">  
                	Öffnungszeiten:<br />  
                	Montag - Freitag&nbsp;&nbsp;  
                	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Monday">  
                	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Tuesday">  
                	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Wednesday">  
                	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Thursday">  
                	<link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Friday">  
                	<meta itemprop="opens" content="08:00:00">08:00 -  
                	<meta itemprop="closes" content="18:00:00">18:00 Uhr<br />  
                	Samstag + Sonntag&nbsp;&nbsp;geschlossen  
                </p>  
                
                

                Hier auch noch zwei Links (fürs Archiv):
                1. http://www.heppnetz.de/ontologies/goodrelations/v1#OpeningHoursSpecification
                2. http://schema.org/CivicStructure

                Gruß Gunther

                1. Nachtrag:

                  So sieht der nachfolgende Code im Google "Test-Tool für strukturierte Daten" aus:
                  http://www.google.de/webmasters/tools/richsnippets?q=uploaded:8004f95b4c3d3e7e268016ea6800c687

                  Für den vorliegenden Fall müsste es dann also korrekt heißen:

                  <p itemprop="openingHoursSpecification" itemscope itemtype="http://schema.org/OpeningHoursSpecification">

                  Öffnungszeiten:<br />
                  Montag - Freitag&nbsp;&nbsp;
                  <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Monday">
                  <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Tuesday">
                  <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Wednesday">
                  <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Thursday">
                  <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Friday">
                  <meta itemprop="opens" content="08:00:00">08:00 -
                  <meta itemprop="closes" content="18:00:00">18:00 Uhr<br />
                  Samstag + Sonntag&nbsp;&nbsp;geschlossen
                  </p>

                    
                    
                  Gruß Gunther
                  
                2. @@Gunther:

                  nuqneH

                  Tja, im Endeffekt entscheidet Google, was sich durchsetzt und was nicht ...!

                  Google u.a. sollten selbstverständlich microdata und RDFa verstehen. Zumindest solange, bis microdata in der Versenkung verschwindet.

                  Die kleinste mögliche Zeiteinheit ist 1 Sekunde.

                  Ist es?

                  Demnach müsste nach meiner Logik eine Öffnungszeitendauer von 0 Sekunden herauskommen, was wiederum mit "geschlossen" gleichzusetzen ist/ wäre.

                  Kann man so sehen. Muss man aber vielleicht nicht.

                  Für den vorliegenden Fall müsste es dann also korrekt heißen: …
                  Montag - Freitag&nbsp;&nbsp;

                  Dass der Bis-Strich nicht korrekt ist, erwähnte ich ja schon. Und zwei NBSP, um einen Abstand zu erzeugen, würde ich auch nicht korrekt nennen.

                  <meta itemprop="opens" content="08:00:00">08:00 -
                  <meta itemprop="closes" content="18:00:00">18:00 Uhr<br />

                  Warum kein time-Element? Warum die Zeit doppelt angeben? Die Sekunde ":00" sollte man weglassen dürfen.

                  <p itemprop="openingHoursSpecification" itemscope itemtype="http://schema.org/OpeningHoursSpecification">  
                      Öffnungszeiten:<br />  
                      Montag–Freitag  
                      <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Monday">  
                      <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Tuesday">  
                      <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Wednesday">  
                      <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Thursday">  
                      <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Friday">  
                      <time itemprop="opens">08:00</time><time itemprop="closes">18:00</time> Uhr<br />  
                      Samstag + Sonntag geschlossen  
                  </p>
                  

                  bzw.

                  <p property="openingHoursSpecification" typeof="http://schema.org/OpeningHoursSpecification">  
                      Öffnungszeiten:<br />  
                      Montag–Freitag  
                      <link property="dayOfWeek" href="http://purl.org/goodrelations/v1#Monday">  
                      <link property="dayOfWeek" href="http://purl.org/goodrelations/v1#Tuesday">  
                      <link property="dayOfWeek" href="http://purl.org/goodrelations/v1#Wednesday">  
                      <link property="dayOfWeek" href="http://purl.org/goodrelations/v1#Thursday">  
                      <link property="dayOfWeek" href="http://purl.org/goodrelations/v1#Friday">  
                      <time property="opens">08:00</time><time property="closes">18:00</time> Uhr<br />  
                      Samstag + Sonntag geschlossen  
                  </p>
                  

                  Qapla'

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

                    nuqneH

                    Tja, im Endeffekt entscheidet Google, was sich durchsetzt und was nicht ...!

                    Google u.a. sollten selbstverständlich microdata und RDFa verstehen. Zumindest solange, bis microdata in der Versenkung verschwindet.

                    Ich tippe eher darauf, dass es genau andersherum kommt, bzw. sich eben schema.org durchsetzen wird, was AFAIK eben auf microdata basiert/ aufbaut (oder wie auch immer).

                    Die kleinste mögliche Zeiteinheit ist 1 Sekunde.

                    Ist es?

                    Ja, bei dem Schema: hh:mm:ss ist es so.
                    Es sei denn, hh:mm:ss.sss wäre auch zulässig, wozu ich aber wieder nichts Genaues finden konnte.

                    Demnach müsste nach meiner Logik eine Öffnungszeitendauer von 0 Sekunden herauskommen, was wiederum mit "geschlossen" gleichzusetzen ist/ wäre.

                    Kann man so sehen. Muss man aber vielleicht nicht.

                    Klar, müssen muss man gar nichts ...! :-P

                    Für den vorliegenden Fall müsste es dann also korrekt heißen: …
                    Montag - Freitag&nbsp;&nbsp;

                    Dass der Bis-Strich nicht korrekt ist, erwähnte ich ja schon.

                    Echt!? Dann hab' ich das bisher erfolgreich "überlesen" ...! ;-)

                    Und zwei NBSP, um einen Abstand zu erzeugen, würde ich auch nicht korrekt nennen.

                    Klar, aber hier ging es zumindest bisher auch weniger um "eleganten" HTML Code, als vielmehr darum, wie man korrekt die Öffnungszeiten deklarieren kann (für SuMas & Co.).

                    <meta itemprop="opens" content="08:00:00">08:00 -  
                    <meta itemprop="closes" content="18:00:00">18:00 Uhr<br />  
                    

                    Warum kein time-Element?

                    Weil es hier nicht speziell um HTML5 geht/ ging ...! :-P

                    Warum die Zeit doppelt angeben?

                    Weil die Zeit im Content-Attribut stehen muss!?

                    Die Sekunde ":00" sollte man weglassen dürfen.

                    Sicher?
                    Alles was ich dazu gefunden habe ist: http://www.w3.org/TR/xmlschema-2/#time
                    Offensichtlich ist die OpeningHoursSpecification in Teilen an die XML Spezifikation angelehnt. Ob man gem. XML Spec die Sekunden weglassen darf, habe ich aber ebenfalls nicht gefunden.
                    Im Zweifelsfall würde ich dann doch die 3 Zeichen mehr noch gerade hinschreiben - schadet ja nicht.

                    <p itemprop="openingHoursSpecification" itemscope itemtype="http://schema.org/OpeningHoursSpecification">

                    Öffnungszeiten:<br />
                        Montag–Freitag
                        <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Monday">
                        <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Tuesday">
                        <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Wednesday">
                        <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Thursday">
                        <link itemprop="dayOfWeek" href="http://purl.org/goodrelations/v1#Friday">
                        <time itemprop="opens">08:00</time>–<time itemprop="closes">18:00</time> Uhr<br />
                        Samstag + Sonntag geschlossen
                    </p>

                      
                    Das scheint zu "funktionieren" - siehe: <http://www.google.de/webmasters/tools/richsnippets?q=uploaded:8004f95c77de7fdd2d2f16761807a664>  
                      
                    Wobei ich jetzt einfach mal behaupten würde, dass das auch nur aufgrund entsprechender "(Fehler)Toleranz" seitens Google funktioniert.  
                    Denn zumindest soweit ich das der "openingHoursSpecification" entnehme, muss die Zeit im Content-Attribut stehen (zumindest wenn man nach schema.org auszeichnet, und darum geht es ja).  
                      
                    
                    > bzw.  
                    >   
                    > ~~~html
                    
                    <p property="openingHoursSpecification" typeof="http://schema.org/OpeningHoursSpecification">  
                    
                    >     Öffnungszeiten:<br />  
                    >     Montag–Freitag  
                    >     <link property="dayOfWeek" href="http://purl.org/goodrelations/v1#Monday">  
                    >     <link property="dayOfWeek" href="http://purl.org/goodrelations/v1#Tuesday">  
                    >     <link property="dayOfWeek" href="http://purl.org/goodrelations/v1#Wednesday">  
                    >     <link property="dayOfWeek" href="http://purl.org/goodrelations/v1#Thursday">  
                    >     <link property="dayOfWeek" href="http://purl.org/goodrelations/v1#Friday">  
                    >     <time property="opens">08:00</time>–<time property="closes">18:00</time> Uhr<br />  
                    >     Samstag + Sonntag geschlossen  
                    > </p>
                    
                    

                    Das hingegen nicht - siehe: http://www.google.de/webmasters/tools/richsnippets?q=uploaded:8004f95c7573fde0cbf05ea37aab014d

                    Gruß Gunther

                    1. @@Gunther:

                      nuqneH

                      Google u.a. sollten selbstverständlich microdata und RDFa verstehen. Zumindest solange, bis microdata in der Versenkung verschwindet.

                      Ich tippe eher darauf, dass es genau andersherum kommt, bzw. sich eben schema.org durchsetzen wird, was AFAIK eben auf microdata basiert/ aufbaut (oder wie auch immer).

                      Nei-en! Du verwechselst zwei verschiedene Dinge: Syntax und Vokabular.

                      Syntaxen sind RDFa (Lite), Microdata, … Vokabulare sind Schema.org, Dublin Core, …

                      Schema.org lässt sich in HTML sowohl mit RDFa Lite als auch mit Microdata notieren, wie auch in den Beispielen angegeben.

                      (Microformats hingegen ist an die Syntax mit Klassen gebunden.)

                      Warum die Zeit doppelt angeben?

                      Weil die Zeit im Content-Attribut stehen muss!?

                      Nö, warum sollte sie das müssen? Der Wert darf auch im Elementinhalt stehen.

                      Die Sekunde ":00" sollte man weglassen dürfen.

                      Sicher?

                      Jetzt nicht mehr. ;-)

                      Laut Doku darf man die Sekunde nicht weglassen.

                      Dann also <time property="opens">08:00:00</time><time property="closes">18:00:00</time> Uhr ;-)

                      OK, möchte man nicht. Also:
                      <time property="opens" datetime="08:00:00">08:00</time><time property="closes" datetime="18:00:00">18:00</time> Uhr

                      Oder
                      <time property="opens" datetime="08:00:00">8</time><time property="closes" datetime="18:00:00">18</time> Uhr

                      Qapla'

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

                        nuqneH

                        Google u.a. sollten selbstverständlich microdata und RDFa verstehen. Zumindest solange, bis microdata in der Versenkung verschwindet.

                        Ich tippe eher darauf, dass es genau andersherum kommt, bzw. sich eben schema.org durchsetzen wird, was AFAIK eben auf microdata basiert/ aufbaut (oder wie auch immer).

                        Nei-en! Du verwechselst zwei verschiedene Dinge: Syntax und Vokabular.

                        Syntaxen sind RDFa (Lite), Microdata, … Vokabulare sind Schema.org, Dublin Core, …

                        Schema.org lässt sich in HTML sowohl mit RDFa Lite als auch mit Microdata notieren, wie auch in den Beispielen angegeben.

                        (Microformats hingegen ist an die Syntax mit Klassen gebunden.)

                        Stimmt, das war mir bis jetzt zumindest nicht so deutlich bewusst.

                        Manchmal müsste man ja nur nachlesen:"Schema.org ist eine Initiative, die eine einheitliche Ontologie für die Strukturierung von Daten auf Websites auf der Basis von ..." (Quelle: http://de.wikipedia.org/wiki/Schema.org)

                        Hätten wir das auch geklärt. :-)

                        Warum die Zeit doppelt angeben?

                        Weil die Zeit im Content-Attribut stehen muss!?

                        Nö, warum sollte sie das müssen? Der Wert darf auch im Elementinhalt stehen.

                        Ich glaub' dir das zwar jetzt, aber wo steht das?

                        Die Sekunde ":00" sollte man weglassen dürfen.

                        Sicher?

                        Jetzt nicht mehr. ;-)

                        Laut Doku darf man die Sekunde nicht weglassen.

                        Dann also <time property="opens">08:00:00</time><time property="closes">18:00:00</time> Uhr ;-)

                        OK, möchte man nicht. Also:
                        <time property="opens" datetime="08:00:00">08:00</time><time property="closes" datetime="18:00:00">18:00</time> Uhr

                        Oder
                        <time property="opens" datetime="08:00:00">8</time><time property="closes" datetime="18:00:00">18</time> Uhr

                        Womit wir dann am Ende ja jetzt wahnsinnig weit weg wären vom ursprünglichen:

                        <meta itemprop="opens" content="08:00:00">08:00 -  
                        <meta itemprop="closes" content="18:00:00">18:00 Uhr  
                        
                        

                        Natürlich ist die Verwendung des Time-Elements sicher "besser", keine Frage.
                        Und auch ansonsten hat mir die Diskussion wieder wertvolle neue Erkenntnisse geliefert! :-)

                        Nur der arme OP ist mit seiner Frage bisher etwas sehr kurz gekommen - sorry!

                        Gruß Gunther

                  2. @@Gunnar:

                    nuqneH

                    Dass der Bis-Strich nicht korrekt ist, erwähnte ich ja schon.

                    Das hat mir doch jetzt keine Ruhe gelassen, und ich bin fündig geworden:
                    http://zeilenvogel.de/blog/so-schreiben-sie-datum-und-uhrzeit-richtig/

                    Gemäß dem Duden hast du Recht.
                    Da ich mich aber an der DIN 5008 orientiere, hast du nicht Recht ...! :-P

                    Denn da wird der Mittestrich als sog. "Wortersatzzeichen" geführt, d.h. der '-' ersetzt das Wort 'bis'. Und du ahnst es bestimmt schon ..., dieser wird mit einem vorausgehenden und einem nachfolgenden Leerzeichen von Zahlenangaben oder Texten getrennt! (Quelle: http://www.luk-korbmacher.de/Schule/Text/din5008.htm#7)

                    Also nix "nicht korrekt" ...! ;-)

                    Gruß Gunther

  3. Hallo,

    es handelt sich semantisch um eine Liste, in der verschiedene Angaben zusammengehören (Wochentag und Zeitraum). Dafür ist semantisch in HTML das dl-Element zuständig.

    Es wird leider immer wieder eine Tabelle mit einer tabellarischen Darstellung verwechselt.

    Das hat zusätzlich den Vorteil, das ein Responsiv Design einfacher zu erstellen ist als mit der falschen Auszeichnung als Tabelle.

    Die meisten Listen lassen sich tabellarisch darstellen und werden dadurch häufig auch übersichtlicher. Aber dadurch werden es semantisch oder dem Sinn nach noch lange keine Tabellen.

    Grade im HTML-Bereich werfen leider viele Leute mit Nebelkerzen, um weiter ihre geliebten Tabellen anwenden zu können. Alles was sich einigermaßen sinnvoll tabellarisch darstellen lässt wird dann gleich zu einer Tabelle verklärt.

    Wenn man wirklich eine Tabelle hat ist natürlich auch eine Tabelle als Grundgerüst angebracht. Bloß sind leider über 97% aller Tabellen im Internet "nur" Listen. Wobei sich das nur in Anführungszeichen auf die "Tabellenliebhaber" beschränkt.

    Gruss

    MrMurphy

    1. Hi there,

      es handelt sich semantisch um eine Liste, in der verschiedene Angaben zusammengehören (Wochentag und Zeitraum). Dafür ist semantisch in HTML das dl-Element zuständig.

      Darüber könnte man trefflich streiten

      Es wird leider immer wieder eine Tabelle mit einer tabellarischen Darstellung verwechselt.

      Erzähl...

      Grade im HTML-Bereich werfen leider viele Leute mit Nebelkerzen, um weiter ihre geliebten Tabellen anwenden zu können.

      Die sind auch nicht schlimmer als die, die beim Wort "Tabelle" hysterisch aufjaulen und überall designpolitisch korrekte Semantikpusteln kriegen...

    2. @@MrMurphy:

      nuqneH

      es handelt sich semantisch um eine Liste, in der verschiedene Angaben zusammengehören (Wochentag und Zeitraum). Dafür ist semantisch in HTML das dl-Element zuständig.

      Nicht jede zweispaltige Tabelle ist eine Beschreibungsliste. Manchmal ist es einfach nur eine Tabelle.

      Das hat zusätzlich den Vorteil, das ein Responsiv Design einfacher zu erstellen ist als mit der falschen Auszeichnung als Tabelle.

      dl lässt sich mitunter eben gerade nicht wie gewünscht stylen, weil das dt/dd gruppierende di-Element (analog zu tr) in HTML immer noch fehlt.

      Bloß sind leider über 97% aller Tabellen im Internet "nur" Listen.

      Glaub ich nicht. Vermutlich sind 97% nur Gestelle, d.h. Layout-Tabellen.

      Qapla'

      --
      „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
  4. @@Martin_Online:

    nuqneH

    http://s1.directupload.net/images/140513/9v9d8odl.png

    Übrigens ist der richtige Bis-Strich der Halbgeviertstrich '–' (&ndash;) ohne Leerzeichen davor und danach.

    Qapla'

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