Matthias Scharwies: ToDo: Browserunterstützung mit Vorlage:Iconset

Servus!

Die im Wiki verwendete Vorlage:Iconset ist lange nicht mehr so wichtig wie früher, da die Browserunterstützung selbst neuer Features oft schnell erfolgt.[1] Wichtiger ist dabei der Link zu caniuse, der in der Vorlage:Caniuse erfolgt.

Problem:

Ein großes png, das als Sprite viele Icons liefert, die heute gar nicht mehr benötigt werden. Der weiße Hintergrund stört im Dark Mode, ein Entfernen auf die Schnelle sorgt für Artefakte. [2]

Welche Icons außer Achtung, ES6 und den 5 Browsern würden denn überhaupt noch benötigt? Selbst HTML5, SVG (für Version 2 gibt's gar kein Logo) und CSS3 sind ja überholt.

Früher hatte ich an ein IE-Logo oder eben ein durchgestrichenes IE-Logo gedacht. Das hat sich ja wohl mittlerweile erledigt.

Das Markup mit Liste, Links und img scheint mir unnötig kompliziert. Das visualClear löst das float auf, kann man das evtl. anders lösen (=muss das Iconset rechts hängen?)

<ul class="siconset smetadaten">
  <li class="sicon sicon_css2">
  	<a href="/wiki/Datei:Iconset.png" class="image" title="CSS 2.0">
    	<img alt="CSS 2.0" src="/images/d/d8/Iconset.png" width="497" height="342" />
    </a>
  </li>
  <li class="sicon sicon_chr">
    <a href="/wiki/Datei:Iconset.png" class="image" title="Chrome">
    	<img alt="Chrome" src="/images/d/d8/Iconset.png" width="497" height="342" />
    </a>
  </li>
  <li class="sicon sicon_fx">
  	<a href="/wiki/Datei:Iconset.png" class="image" title="Firefox">
  		<img alt="Firefox" src="/images/d/d8/Iconset.png" width="497" height="342" />
    </a>
  </li>
</ul>
<div class="visualClear"></div>

Wer hat Interesse, dies zeitgemäß mit SVG oder SVG-Sprites zu realisieren?

Zeitplan wäre ca. 2 Wochen, da wir am Fr, 11. / Sa, 12.03. das neue Layout festgezurrt haben wollen.

Herzliche Grüße

Matthias Scharwies

--
Einfach mal was von der ToDo-Liste auf die Was-Solls-Liste setzen.“

  1. Eine Vorlage:Browserinconset mit Versionsnummern habe ich bereits gelöscht, da sie nicht mehr notwendig war. ↩︎

  2. Hier die vielen Icons. Welche brauchen wir denn überhaupt? ↩︎

  1. @@Matthias Scharwies

    Welche Icons außer Achtung, ES6 und den 5 Browsern würden denn überhaupt noch benötigt?

    Gar keins. Auch nicht die von dir als „außer“ erwähnten. (Außer vielleicht „Achtung“, aber dafür könnte man auch ⚠️ (U+26A0 U+FE0F) verwenden.

    Die Unterscheidung Chrome/Edge/Opera macht keinen Sinn, da sie alle dieselbe Rendering-Engine verwenden.

    Überhaupt macht die Angabe von Browsern, die ein Feature unterstützen, im Wiki keinen Sinn. Die Information ist schneller überholt als jemand „Browserunterstützung“ sagen kann. Wer soll das pflegen? (Oder kommt die Information automatisch tagesaktuell über ein API von Can I Use rein?)

    Die Unterscheidung von HTML-, CSS- oder JS-Versionen macht keinen Sinn, da alles living standards sind.

    😷 LLAP

    --
    „Dann ist ja auch schrecklich, dass wir in einem Land leben, in dem nicht nur Bildungswillige leben, sondern auch hinreichende Zahlen von Bekloppten. Das darf ich so locker formulieren, ich bin ja jetzt Rentner und muss nicht mehr auf jedes Wort achten.“
    — Joachim Gauck über Impfgegner
    1. Hallo Matthias, hallo Gunnar,

      ich würde auch auf die Browsericons verzichten, und nur noch auf caniuse verlinken. Die Unterstützung der Browser von irgendwelchen Neuerungen ändert sich schneller, als man das Wiki aktuell halten kann.

      Gruß
      Jürgen

    2. Hallo,

      Die Unterscheidung Chrome/Edge/Opera macht keinen Sinn, da sie alle dieselbe Rendering-Engine verwenden.

      aber der Opera-Chrome und der Microsoft-Chrome nicht unbedingt in der aktuellen Version. Daher hätte die Unterscheidung theoretisch doch einen Sinn.

      Aber ich sehe die Recherche über Browser-Features und (Un-)Fähigkeiten nicht als unsere Aufgabe - außer vielleicht in eklatanten Fällen, wo man mal warnen muss, dass Browser XY ein bestimmtes Feature so richtig überhaupt nicht beherrscht.

      Möge der Kaffee gut und der Montag kurz sein
       Martin

      --
      The taste of love: The more you get, the more you want
      (aus The Lightning Seeds: Sense)
      1. Servus!

        Aber ich sehe die Recherche über Browser-Features und (Un-)Fähigkeiten nicht als unsere Aufgabe - außer vielleicht in eklatanten Fällen, wo man mal warnen muss, dass Browser XY ein bestimmtes Feature so richtig überhaupt nicht beherrscht.

        Aber das war doch der entscheidene Vorteil der Doku (abgesehen davon dass es eben gar keine anderen gab 😀 ):

        center-Element aus der Doku4.0 (21.01.1996)

        center-Element aus der Doku4.0 (21.01.1996)

        Herzliche Grüße

        Matthias Scharwies

        --
        Einfach mal was von der ToDo-Liste auf die Was-Solls-Liste setzen.“
        1. @@Matthias Scharwies

          Aber ich sehe die Recherche über Browser-Features und (Un-)Fähigkeiten nicht als unsere Aufgabe - außer vielleicht in eklatanten Fällen, wo man mal warnen muss, dass Browser XY ein bestimmtes Feature so richtig überhaupt nicht beherrscht.

          Aber das war doch der entscheidene Vorteil der Doku

          Du hast die Betonung falsch gesetzt: Aber das war doch der entscheidene Vorteil der Doku. Damals.

          😷 LLAP

          --
          „Dann ist ja auch schrecklich, dass wir in einem Land leben, in dem nicht nur Bildungswillige leben, sondern auch hinreichende Zahlen von Bekloppten. Das darf ich so locker formulieren, ich bin ja jetzt Rentner und muss nicht mehr auf jedes Wort achten.“
          — Joachim Gauck über Impfgegner
          1. Servus!

            @@Matthias Scharwies

            Aber ich sehe die Recherche über Browser-Features und (Un-)Fähigkeiten nicht als unsere Aufgabe - außer vielleicht in eklatanten Fällen, wo man mal warnen muss, dass Browser XY ein bestimmtes Feature so richtig überhaupt nicht beherrscht.

            Aber das war doch der entscheidene Vorteil der Doku

            Du hast die Betonung falsch gesetzt: Aber das war doch der entscheidene Vorteil der Doku. Damals.

            😀 Ich bin grad dabei, in einem Blog-Artikel meinen historischen Abschiedsschmerz zu verarbeiten.

            Herzliche Grüße

            Matthias Scharwies

            PS: Warum musstest du/ihr den Harald so absägen? Der war doch lustig.

            --
            Einfach mal was von der ToDo-Liste auf die Was-Solls-Liste setzen.“
        2. Hallo Matthias,

          Aber ich sehe die Recherche über Browser-Features und (Un-)Fähigkeiten nicht als unsere Aufgabe - außer vielleicht in eklatanten Fällen, wo man mal warnen muss, dass Browser XY ein bestimmtes Feature so richtig überhaupt nicht beherrscht.

          Aber das war doch der entscheidene Vorteil der Doku (abgesehen davon dass es eben gar keine anderen gab 😀 ):

          so habe ich das nie empfunden bzw. wahrgenommen. Die Icons zur Browserunterstützung fand ich als grobe Orientierung zwar ganz nett, aber ich habe sie nie allzu wichtig genommen.

          In der heutigen Browserlandschaft würde ich Gunnar zustimmen: Es gibt, was die Entwicklung angeht, zwei Browser, die meistens vorn dabei sind. Das sind Chrome und Firefox, wobei Chrome zumindest bei der Verbreitung dominiert. Da die beiden zusammen mit ihren Derivaten auch ganz klar die Mehrheit bezüglich der Nutzerzahlen stellen, kann man sich ohne schlechtes Gewissen an denen orientieren, und wenn in einem älteren oder einem Minderheiten-Browser irgendein Bleeding-Edge-Feature mal nicht ganz so aussieht wie es sich der Designer erträumt hat - so what?

          Das soll nicht heißen, dass man Webseiten nicht auch in anderen Browsern als Chrome und Firefox testen sollte. Im Gegenteil, doch, man sollte. Etwa auf dem Android-eigenen Browser oder Safari. Aber ich denke, wenn man sich an Spezifikationen hält und nicht sofort den ganz heißen Scheiß implementiert, sobald er in der Presse erwähnt wird, fährt man wahrscheinlich recht gut.

          Möge der Kaffee gut und der Montag kurz sein
           Martin

          --
          The taste of love: The more you get, the more you want
          (aus The Lightning Seeds: Sense)
  2. Hallo Matthias,

    eine Zusatzinfo: caniuse verwendet an sehr vielen Stellen mittlerweile die Kompatibilitätsinformationen von Mozilla. Ich recherchiere mal, ob es da ein API gibt und ob man das so einfach nutzen darf. Jedesmal dem caniuse Link zu folgen kann nämlich auch nervig sein…

    Rolf

    --
    sumpsi - posui - obstruxi
    1. Servus!

      Hallo Matthias,

      eine Zusatzinfo: caniuse verwendet an sehr vielen Stellen mittlerweile die Kompatibilitätsinformationen von Mozilla. Ich recherchiere mal, ob es da ein API gibt und ob man das so einfach nutzen darf. Jedesmal dem caniuse Link zu folgen kann nämlich auch nervig sein…

      Wobei caniuse die aktuellen und künftigen Versionen gut visualisiert.

      Ich hatte schon an einen Pfeil in caniuse-Orange als neuer Vorlage gedacht. 😀

      Herzliche Grüße

      Matthias Scharwies

      --
      Einfach mal was von der ToDo-Liste auf die Was-Solls-Liste setzen.“
    2. Hallo

      eine Zusatzinfo: caniuse verwendet an sehr vielen Stellen mittlerweile die Kompatibilitätsinformationen von Mozilla. Ich recherchiere mal, ob es da ein API gibt und ob man das so einfach nutzen darf. Jedesmal dem caniuse Link zu folgen kann nämlich auch nervig sein…

      Wo liegt da der Unterschied zwischen einem Link zu caniuse.com oder zur MDN?

      Tschö, Auge

      --
      200 ist das neue 35.
      1. Hi,

        eine Zusatzinfo: caniuse verwendet an sehr vielen Stellen mittlerweile die Kompatibilitätsinformationen von Mozilla. Ich recherchiere mal, ob es da ein API gibt und ob man das so einfach nutzen darf. Jedesmal dem caniuse Link zu folgen kann nämlich auch nervig sein…

        Wo liegt da der Unterschied zwischen einem Link zu caniuse.com oder zur MDN?

        Wenn die Info per API vom MDN aberufen werden könnte, könnte man sie direkt in die Seite integrieren (nicht nur einen Link darauf)

        cu,
        Andreas a/k/a MudGuard

        1. Hallo

          eine Zusatzinfo: caniuse verwendet an sehr vielen Stellen mittlerweile die Kompatibilitätsinformationen von Mozilla. Ich recherchiere mal, ob es da ein API gibt und ob man das so einfach nutzen darf. Jedesmal dem caniuse Link zu folgen kann nämlich auch nervig sein…

          Wo liegt da der Unterschied zwischen einem Link zu caniuse.com oder zur MDN?

          Wenn die Info per API vom MDN aberufen werden könnte, könnte man sie direkt in die Seite integrieren (nicht nur einen Link darauf)

          Aj ja, jetzt hat's klick gemacht. Danke.

          Tschö, Auge

          --
          200 ist das neue 35.
      2. Servus!

        Hallo

        eine Zusatzinfo: caniuse verwendet an sehr vielen Stellen mittlerweile die Kompatibilitätsinformationen von Mozilla. Ich recherchiere mal, ob es da ein API gibt und ob man das so einfach nutzen darf. Jedesmal dem caniuse Link zu folgen kann nämlich auch nervig sein…

        Wo liegt da der Unterschied zwischen einem Link zu caniuse.com oder zur MDN?

        Ziel wäre wohl in einem iframe/ div/whatever die Informationen direkt in der Seite sichtbar zu haben. Da dies selbst in der MDN nicht so perfekt aussieht, glaub ich da noch nicht so dran.

        MDN: Web/HTML/Element/dialog#browser_kompatibilität

        Herzliche Grüße

        Matthias Scharwies

        --
        Einfach mal was von der ToDo-Liste auf die Was-Solls-Liste setzen.“
        1. Hallo Matthias,

          also eher dies hier. Man müsste aber eine Wiki-Erweiterung schreiben für die Darstellung.

          Lizenz ist CC0, a.k.a. public domain.

          Rolf

          --
          sumpsi - posui - obstruxi
          1. Servus!

            Hallo Matthias,

            also eher dies hier. Man müsste aber eine Wiki-Erweiterung schreiben für die Darstellung.

            Ich bin grad mit @dedlfix am diskutieren. Früher konnte man die Sidebar, bzw. Teile davon collapsible machen. Das wurde mit dem Vector-Skin aufgegeben. Das könnte man mit einer Extension wieder herstellen. Die Frage ist nur, ob wir das auch wollen oder etwas eigenes schreiben.

            BTW:

            https://wiki.selfhtml.org/wiki/CSS

            Was haltet ihr von den .locale-anchornach den Überschriften? Nützlich (die MDN hat die als klickbare Überschriften) oder können die weg?

            Herzliche Grüße

            Matthias Scharwies

            --
            Einfach mal was von der ToDo-Liste auf die Was-Solls-Liste setzen.“
            1. Hallo Matthias,

              ich finde die locale-anchor gut. Das ist deutlicher erkennbar als eine Überschrift, die auf sich selbst verlinkt.

              Rolf

              --
              sumpsi - posui - obstruxi
          2. Hallo

            also eher dies hier. Man müsste aber eine Wiki-Erweiterung schreiben für die Darstellung.

            Lizenz ist CC0, a.k.a. public domain.

            Wenn ich das richtig verstehe, lädt man sich das Projekt herunter und greift dann lokal (auf dem eigenen Server) auf den Datenbestand zu. In Hinsicht auf den lokalen Part ist das eine Automation, aber der Datenbestand muss doch dennoch in Bezug auf Änderungen im Repository aktuell gehalten werden oder verstehe ich das falsch?

            Schön wäre eine API zum Zugriff auf die Releases auf Github, welchen man zum Beispiel per Cronjob auslösen kann.

            Tschö, Auge

            --
            200 ist das neue 35.
            1. Hallo Auge,

              Schön wäre eine API zum Zugriff auf die Releases auf Github,

              Die Idee von MDN ist ein npm install. Oder Update. Der ließe sich cron-nen.

              Rolf

              --
              sumpsi - posui - obstruxi
              1. Servus!

                Hallo Auge,

                Schön wäre eine API zum Zugriff auf die Releases auf Github,

                Die Idee von MDN ist ein npm install. Oder Update. Der ließe sich cron-nen.

                Ok, da können wir am Mittwoch ja mal brainstormen, ob wir das in Angriff nehmen wollen.

                Deutlich einfacher wäre es, voerst nur die ul aus der Vorlage selbst zu entfernen.

                Falls eine Vorlage die Option

                {{#if:{{{caniuse|}}}|<p class="caniuse" {{#ifeq:{{{1}}}|meta|style="float:right; clear:right"}}{{#ifeq:{{{1}}}|metadaten|style="float:right; clear:right"}}>Details: [https://caniuse.com/{{{caniuse}}} caniuse.com]</p>}}<div class="visualClear"></div>

                zieht, wird diese dann alein dargestellt. Evtl. mit „Browserunterstützung“ anstelle von „Details“.

                Dann kann man die 500+-Seiten peu a peu ändern.

                Herzliche Grüße

                Matthias Scharwies

                --
                Einfach mal was von der ToDo-Liste auf die Was-Solls-Liste setzen.“
                1. Servus!

                  Deutlich einfacher wäre es, voerst nur die ul aus der Vorlage selbst zu entfernen.

                  Aus der Vorlage ist die ul jetzt entfernt. Sie wird jetzt aufgerufen, stellt aber nur ein evtl. vorhandenes Caniuse dar.

                  Ich habe schon mal ein bisschen aufgeräumt und die Vorlage in den HTML/ und CSS/Tutorials entfernt. Es gibt da aber peu a peu noch viel zu tun.

                  Caniuse

                  Zusätzlich habe ich die Vorlage:Caniuse etwas aufgepeppt:

                  z. B. hier: position:_sticky

                  Verbesserungsvorschläge?

                  Herzliche Grüße

                  Matthias Scharwies

                  --
                  Einfach mal was von der ToDo-Liste auf die Was-Solls-Liste setzen.“
                  1. Hallo Matthias,

                    Weltkugel - nice.
                    Description List - WTF?

                    Rolf

                    --
                    sumpsi - posui - obstruxi
                  2. Zusätzlich habe ich die Vorlage:Caniuse etwas aufgepeppt:

                    Verbesserungsvorschläge?

                    Ohne den Halbsatz „Als Wert für den Parameter ist lediglich der Teil nach dem Gleichheitszeichen zu übergeben… “, wäre imho alles klar. Da ist kein Gleichheitszeichen!

                    1. Servus!

                      Zusätzlich habe ich die Vorlage:Caniuse etwas aufgepeppt:

                      Verbesserungsvorschläge? Ohne den Halbsatz „Als Wert für den Parameter ist lediglich der Teil nach dem Gleichheitszeichen zu übergeben… “, wäre imho alles klar. Da ist kein Gleichheitszeichen!

                      Danke, wird geändert!

                      Herzliche Grüße

                      Matthias Scharwies

                      --
                      Einfach mal was von der ToDo-Liste auf die Was-Solls-Liste setzen.“