Linuchs: Dürfen HTML-Tags (z.B. Tabulatoren) erfunden werden?

Moin,

schon lange nutze ich die Möglichkeit des Firefoxes, beliebige Tags, z.B. <l></l> zu erfinden und mit CSS zu formatieren. Das klappt wunderbar.

Kann ich das auch auf öffentliche Webseiten übertragen, von denen ich nicht weiß, mit welchem Browser sie angezeigt werden?

Hier habe ich innerhalb von <li>die Tags <c></c><d></d> eingesetzt im Sinne von Tabulatoren, die es meines Wissens immer noch nicht gibt.

Ist das standard-gerecht?

Gruß, Linuchs

  1. Hallo,

    Tabulatoren,

    mit denen du eine tabellarische Darstellung erzeugen willst? Die gibt's seit „immer“, heißen td und werden für Tabellen verwendet.

    Gruß
    Kalk

    1. Tabulatoren,

      mit denen du eine tabellarische Darstellung erzeugen willst? Die gibt's seit „immer“, heißen td und werden für Tabellen verwendet.

      Oh nein, Tabellen sind unsinnig aufgebläht, um Aufzählungen oder Absätze zu formatieren. Vergleiche:

      <table>
      <tr>
        <td>D-25541</td>
        <td>Brunsbüttel</td>
        <td><a class=external href="http://www.druminski.de/veranstaltungskalender.html">Familie Druminski</a></td>
      </tr>
      <tr>
        <td>D-26427</td>
        <td>Bensersiel</td>
        <td><a class=external href="http://bensersiel-nordseeblick.de/veranstaltungen">Anja Hilkenbach</a></td>
      </tr>
      <tr>
        <td>D-26553</td>
        <td>Dornumersiel</td>
        <td><a class=external href="http://www.nordsee-fewo-sielperle.de/veranstaltungen.html">Wohnung Nr.10 "Sielperle"</a></td>
      </tr>
      <tr>
        <td>D-26553</td>
        <td>Dornumersiel</td>
        <td><a class=external href="http://www.urlaub-in-dornumersiel.eu/index.php/veranstaltungen">Klaus Deyerer</a></td>
      </tr>
      <tr>
        <td>D-26553</td>
        <td>Neßmersiel</td>
        <td><a class=external href="http://www.wellness-huus.de/index.php/veranstaltungskalender.html">Wellness Huus</a></td>
      </tr>
      </table>
      

      mit

      <ul>
        <li><c>D-25541</c><d>Brunsbüttel</d><a class=external href="http://www.druminski.de/veranstaltungskalender.html">Familie Druminski</a></li>
        <li><c>D-26427</c><d>Bensersiel</d><a class=external href="http://bensersiel-nordseeblick.de/veranstaltungen">Anja Hilkenbach</a></li>
        <li><c>D-26553</c><d>Dornumersiel</d><a class=external href="http://www.nordsee-fewo-sielperle.de/veranstaltungen.html">Wohnung Nr.10 "Sielperle"</a></li>
        <li><c>D-26553</c><d>Dornumersiel</d><a class=external href="http://www.urlaub-in-dornumersiel.eu/index.php/veranstaltungen">Klaus Deyerer</a></li>
        <li><c>D-26553</c><d>Neßmersiel</d><a class=external href="http://www.wellness-huus.de/index.php/veranstaltungskalender.html">Wellness Huus</a></li>
      </ul>
      

      Inzwischen experimentiere ich mit CSV-Strings, die vom Server ausgeliefert und per Javascript im Browser aufbereitet werden. Vielleicht ein Luxus-Problem, aber ich leide unter zahlreichen (unsinnigen) Aufrufen von Suchmaschinen. 10 - 20 mal so oft wie Aufrufe von Menschen (Ajax-Rückmeldung nach 10 sec). Alles, was länger als 3 sec durchläuft, wird mir per Mail gemeldet. Das sind locker ein, zwei Dutzend am Tag, die normalerweise 0,1 bis 0,2 sec benötigen.

      Gruß, Linuchs

      1. @@Linuchs

        Oh nein, Tabellen sind unsinnig aufgebläht, um Aufzählungen oder Absätze zu formatieren. Vergleiche:

        ?? Na dann vergleichen wir doch mal:

        <table>
        	<tr>
        		<td>D-25541</td>
        		<td>Brunsbüttel</td>
        		<td><a class=external href="http://www.druminski.de/veranstaltungskalender.html">Familie Druminski</a></td>
        	</tr>
        </table>
        

        mit

        <ul>
        	<li>
        		<c>D-25541</c>
        		<d>Brunsbüttel</d>
        		<a class=external href="http://www.druminski.de/veranstaltungskalender.html">Familie Druminski</a>
        	</li>
        </ul>
        

        Was genau ist da „unsinnig aufgebläht“? Wenn „Familie Druminski“ nicht ein Link wäre, hättest du in beiden Fällen dieselbe Anzahl von Tags.

        Inzwischen experimentiere ich mit CSV-Strings, die vom Server ausgeliefert und per Javascript im Browser aufbereitet werden.

        Jeder leistungsschwache Client soll deinen Quellcode bearbeiten, um ihn vernünftig darzustellen? Kling ganz und gar nicht vernünftig. Und wie sieht’s aus, wenn JavaScript nicht ausgeführt wird?

        LLAP 🖖

        --
        „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
        1. Jeder leistungsschwache Client soll deinen Quellcode bearbeiten, um ihn vernünftig darzustellen? Kling ganz und gar nicht vernünftig. Und wie sieht’s aus, wenn JavaScript nicht ausgeführt wird?

          Die Idee, die Seite vor Ort aufzubauen, habe ich bei einem bekannten schwedischen Möbelhaus geklaut. Hat den Vorteil der handlichen Päckchen 😉

          Angefangen hat das CSV-Format für marker und polylines auf OSM-Landkarten, die bekommt man ohne Javascript ohnehin nicht angezeigt. Als ich noch mit Javascript AUS meine Seiten testete, funktionierten dann andere nicht wie z.B. Youtube.

          Ich kann mir kaum vorstellen, wer im Internet mit Javascript AUS unterwegs ist. Bitte mal die Hand heben. Ich sehe keinen.

          Gruß, Linuchs

          1. @@Linuchs

            Jeder leistungsschwache Client soll deinen Quellcode bearbeiten, um ihn vernünftig darzustellen? Kling ganz und gar nicht vernünftig.

            Die Idee, die Seite vor Ort aufzubauen, habe ich bei einem bekannten schwedischen Möbelhaus geklaut. Hat den Vorteil der handlichen Päckchen 😉

            Welche UX sollen deine Seitenbesucher haben: „Guten Tag! Ihr Schrank ist da. Wo dürfen wir ihn hinstellen?“ oder „Guten Tag! Ihre Schrankteile sind da. Viel Spaß beim Aufbauen!“?

            Wenn du Dateigrößen sparen willt: bei Bildern ist sicher viel Potential, auch bei unsinnig verwendeten Frameworks. Ein paar Byte an Markup einsparen zu wollen ist Quatsch.

            Und wie sieht’s aus, wenn JavaScript nicht ausgeführt wird? Ich kann mir kaum vorstellen, wer im Internet mit Javascript AUS unterwegs ist.

            Ich sprach nicht von „JavaScript aus“, sondern von „JavaScript nicht ausgeführt“. Wie in JavaScript nicht ausgeführt.

            LLAP 🖖

            --
            „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
  2. Tach!

    Kann ich das auch auf öffentliche Webseiten übertragen, von denen ich nicht weiß, mit welchem Browser sie angezeigt werden?

    Ja.

    Ist das standard-gerecht?

    Was nicht definiert ist, kann kein Standard sein. Aber es ist definiert, dass unbekannte Elemente nicht abgelehnt werden. Nur so kann man auch mal später neue Elemente in den Standard, ohne dass alle alten Browser kaputtgehen. Du kannst sie also verwenden, wie andere Elemente auch, inklusive CSS und Javascript.

    dedlfix.

    1. danke, den Trost habe ich gebraucht.

    2. @@dedlfix

      Du kannst sie also verwenden

      … solltest es aber nicht.

      LLAP 🖖

      --
      „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
      1. Tach!

        Du kannst sie also verwenden

        … solltest es aber nicht.

        Mach ich aber in Angular ohne Ende.

        dedlfix.

        1. @@dedlfix

          Mach ich aber in Angular ohne Ende.

          Nochmal nachgeschaut, was es mit diesem Angular auf sich hat. [Doku auf]

          Add a click event binding to the <li> like this:
          <li *ngFor="let hero of heroes" (click)="onSelect(hero)">

          [Doku zu]

          Angular-Entwickler haben offenbar keine blasse Ahnung von Frontend-Entwicklung. Was auch nicht schlimm wäre; niemand kann alles wissen.

          Sie halten es aber nicht für notwendig, wenigstens für ihre Tutorials jemanden zuratezuziehen, der Ahnung von Frontend-Entwicklung hat. Und das ist schlimm.

          Viele Leser glauben, was da geschrieben steht, und so macht dieser Mist die Runde. 😤

          LLAP 🖖

          --
          „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
          1. Tach!

            Wo genau war jetzt der Zusammenhang zu Elementnamen in deiner Antwort?

            dedlfix.

            1. @@dedlfix

              Wo genau war jetzt der Zusammenhang zu Elementnamen in deiner Antwort?

              Nirgendwo. Threaddrift.

              LLAP 🖖

              --
              „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
          2. Hallo Gunnar,

            ich habe mal versucht, mir das HTML eines Angular Live Sample anzuschauen. Diese kryptische Sternchen- und Klammernsyntax scheint nicht im Browser anzukommen (oder nur als Kommentar), da scheint es eine Zwischeninstanz zu geben, die Angular in DOM übersetzt. Ob das nun gut ist oder nicht bleibe dahingestellt; ich befürchte, die Zwischeninstanz heißt Angular Runtime und läuft im Browser live mit.

            Jedenfalls kommen im Browser auch custom attributes an (mit einem Minuszeichen drin), und sie verwenden die sogar im CSS für Attributselektoren.

            Rolf

            --
            sumpsi - posui - clusi
            1. Tach!

              ich habe mal versucht, mir das HTML eines Angular Live Sample anzuschauen. Diese kryptische Sternchen- und Klammernsyntax scheint nicht im Browser anzukommen (oder nur als Kommentar), da scheint es eine Zwischeninstanz zu geben, die Angular in DOM übersetzt.

              Natürlich, das sind Anweisungen, die erst verarbeitet werden müssen, bevor daraus etwas entsteht, das im DOM landet oder auch nicht.

              Ob das nun gut ist oder nicht bleibe dahingestellt;

              Weder noch, weil nicht relevant für den Browser.

              ich befürchte, die Zwischeninstanz heißt Angular Runtime und läuft im Browser live mit.

              Letztlich ist alles Javascript.

              Aber darum ging es Gunnar nicht, er wollte nur mal ranten und sich nicht mal konkret äußern, was das Problem sei.

              dedlfix.

              1. @@dedlfix

                Aber darum ging es Gunnar nicht, er wollte nur mal ranten

                Aha, bedienbare UIs einzufordern ist für dich ranten.

                LLAP 🖖

                --
                „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
                1. Tach!

                  Aber darum ging es Gunnar nicht, er wollte nur mal ranten

                  Aha, bedienbare UIs einzufordern ist für dich ranten.

                  Nein, aber für mich war das Ranten und keine konstruktive Kritik aus der der Leser etwas herauslesen hätte können, wie es besser geht.

                  dedlfix.

                  1. @@dedlfix

                    Nein, aber für mich war das Ranten und keine konstruktive Kritik aus der der Leser etwas herauslesen hätte können, wie es besser geht.

                    Wenn man hier immer wieder dasselbe erzählt, beschweren sich die Leute. Wenn man einmal nicht das wiederholt, was man hier schon gefühlte tausend Mal gesagt hat, beschweren sich die Leute …

                    LLAP 🖖

                    --
                    „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
                    1. Tach!

                      Nein, aber für mich war das Ranten und keine konstruktive Kritik aus der der Leser etwas herauslesen hätte können, wie es besser geht.

                      Wenn man hier immer wieder dasselbe erzählt, beschweren sich die Leute. Wenn man einmal nicht das wiederholt, was man hier schon gefühlte tausend Mal gesagt hat, beschweren sich die Leute …

                      Versuch einfach beim nächsten Mal kompetenter auszusehen beim Antworten. Sich einen Punkt aus der Doku herauszunehmen und aufgrund dessen die totale Ahnungslosigkeit aller Angular-Entwicker zu konstatieren zeugte jedenfalls nicht davon.

                      dedlfix.

                      1. @@dedlfix

                        die totale Ahnungslosigkeit aller Angular-Entwicker zu konstatieren

                        Ich hab nichts von totaler Ahnungslosigkeit gesagt, sondern von Ahnungslosigkeit bezüglich Frontend-Entwicklung gesprochen. Und dabei auch deutlich gesagt, dass nicht jeder alles wissen kann.

                        LLAP 🖖

                        --
                        „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
            2. @@Rolf B

              Diese kryptische Sternchen- und Klammernsyntax scheint nicht im Browser anzukommen (oder nur als Kommentar)

              Diese kryptische Sternchen- und Klammernsyntax war auch nicht mein Kritikpunkt, sondern: Add a click event binding to the <li>.

              Dass man™ <li>s nicht clicken kann, sollte bekannt sein.

              LLAP 🖖

              --
              „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
              1. Tach!

                Diese kryptische Sternchen- und Klammernsyntax war auch nicht mein Kritikpunkt, sondern: Add a click event binding to the <li>.

                Dass man™ <li>s nicht clicken kann, sollte bekannt sein.

                Was spräche denn gegen Event Bubbling? Wenn du wenigstens moniert hättest, dass im weiteren Verlauf nur ein Span im li steht und kein Button/Link ...

                dedlfix.

                1. @@dedlfix

                  Dass man™ <li>s nicht clicken kann, sollte bekannt sein.

                  Was spräche denn gegen Event Bubbling?

                  Nichts. Bei sinnvoller Event-Delegation würde man aber beim ul-Element (oder noch höher) auf die Events lauschen.

                  LLAP 🖖

                  --
                  „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
                  1. Tach!

                    Was spräche denn gegen Event Bubbling?

                    Nichts. Bei sinnvoller Event-Delegation würde man aber beim ul-Element (oder noch höher) auf die Events lauschen.

                    Ja, das wäre eine Möglichkeit. Aber was machst du mit der Variable hero, die jeweils im Scope der einzelnen li lebt. Wie bekommst du die an den Eventhandler übergeben? Und das möglichst Angular-like und nicht zu umständlich.

                    dedlfix.

  3. @@Linuchs

    Hier habe ich innerhalb von <li>die Tags <c></c><d></d> eingesetzt im Sinne von Tabulatoren, die es meines Wissens immer noch nicht gibt.

    Ist das standard-gerecht?

    Nein. Custom elements müssen einen - im Bezeichner haben.

    Außerdem sind Bezeichner wie c und d nichtssagend – verwende sprechende Namen!

    Möglich wäre sowas wie <x-postal-code> und <x-locality>. Allerdings sehe ich hier nicht den Vorteil gegenüber <span class="postal-code"> bzw. <span class="locality">.

    (Und wenn du den Kram semantisch mit RDFa auszeichnen würdest, bräuchtest du keine Klassen; dann hättest du sowas wie <span property="postalCode"> und <span property="addressLocality">.)

    Es gibt in HTML Tabellen.

    Aber auch Listen lassen sich wie Tabellen stylen.

    Die Ziffern sollten bei den PLZ gleichbreit sein (tabular figures "tnum"). Zur Verdeutlichung hab ich im Beispiel die Microsoft-Schriftart Candara gewählt. Ohne "tnum" in der font-feature-settings-Angabe wären die Ziffern unterschiedlich breit. (Und ohne "lnum" wären es Mediävalziffern.)

    LLAP 🖖

    --
    „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
    1. Hej Gunnar,

      Es gibt in HTML Tabellen.

      Nur die machen IMHO hier Sinn.

      Aber auch Listen lassen sich wie Tabellen stylen.

      Wenn man eine Spalte, PLZ, eine Spalte, Ort und eine Spalte Location will, sollte man IMHO auch Spalten (und die gehören in Tabellen) verwenden.

      Alles andere ist von hinten durch die Brust ins Auge — und die spans trennen die einzelnen Daten nicht sauber voneinander.

      Bei großen Firmen, die als Eventlocation nur den Namen der Stadt angeben, in der sie eine Filiale haben, kann man sonst beispielseise nciht unterscheiden, ob Düffeldorf nun der Name der Stadt oder Name der Location oder beides ist. Für Nutzer, die sich die Seite vorlesen lassen, wird es frelich nochmals deutlich schwieriger den Sinn zu verstehen.

      Marc

      --
      Ceterum censeo Google esse delendam