Vertikal Zentrieren - endlich gelöst?
Ach wie war doch ehedem
Das Table Layout so bequem
Ein schneller vertical-align
Ausrichten kann so einfach sein.
Experiment Discord - Fazit nach einem Jahr
Im Juni '23 wurde vorgeschlagen, den bestehenden Discord-Server mit Text-Kanälen zu erweitern. Wir, d.h. der Vorstand stimmten zu und wollten das beobachten. Wichtig war uns persönlich, dass dies von anderen aus dem Verein übernommen werden sollte, um nicht bisher Aktiven noch mehr aufzubürden.
Nach knapp einem Jahr ist es nun Zeit für ein Fazit:
Der rote Faden
Letztes Wochenende trafen wir uns in Hannover, um einerseits das ganz normale jährliche Treffen mit Mitgliederverammlung und einem Workshop zu unserem immer noch anstehenden Wiki-Makeover durchzuführen und andererseits das 20-jährige Jubiläum des Vereins zu feiern, der am 21.05.2004 gegründet wurde.
Barrierefrei - Brauch' ich das? - Ja!
Offline-Wiki - 3 Jahre später
Wir erzwingen Ihre Einstimmung!
@when das W3C aufSASSig wird - CSS Conditionals Level 5 und die Kompatibilität
Die CSS Conditionals 5 Spezifikation entwickelt sich. Aber sie haben ein Problem: SASS
Navigation - alles inclusive
OKLCH: greller, bunter und so weiter?
Trend 2024: eine eigene Webseite!
Silvester-Knaller: Exklusive Akkordeons ohne JavaScript!
Im Oktober stellten wir die neuen Popover-Boxen vor, mit der die open-ui.org Tooltipps und Popover vereinheitlichen wollten. Schon da wunderte ich mich über die schnelle Umsetzung der sinnvollen Vorschläge durch die Browserhersteller. Verständlich wird dies, wenn man sieht, dass viele Mitglieder der Initative Google-Mitarbeiter sind.
Frohe Weihnachten!
HTMLHell - „Da brauchst du kein JavaScript für!“
Auch HTMLHell von Manuel Matuzović hat dieses Jahr einen Adventskalender, der sich - anders als der Name vermuten lässt - für semantisches HTML und ein barrierefreies, benutzerfreundliches Web einsetzt.
Am 02. Dezember fand ich dort den empfehlenswerten Artikel „You don't need JavaScript for that“ von Kilian Valkhof, von dem ich hier die Kernaussage übersetzt wiedergeben möchte:
Advent, Advent, das Raumschiff brennt?
Adventskalender 2023
Blue-Beanie-Day
Heute, am 30.11., ist wieder Blue Beanie Day; ein Aktionstag, um auf die Wichtigkeit von Webstandards aufmerksam zu machen. Er wird seit 2007 jährlich am 30. November begangen und wurde von Douglas Vos ins Leben gerufen.
SELFHTML - 410 GONE?
Am 24.-26.11.2023 fand das jährliche SELF-Treffen in Mainz statt. Im Vorfeld gab es Stimmen, dass man die Gelegenheit zu einer Diskussion nutzen sollte, ob der Verein heute noch handlungsfähig sei und ob es nicht besser sei, ihn jetzt in Ruhe abzuwickeln. Trübe Stimmung im trüben Novemberwetter - als mich Felix plötzlich auf eine rote Ampel hinwies. Das Mainzelmännchen zauberte uns ein Lächeln ins Gesicht!
Wird SELFHTML heute noch gebraucht?
Popover ohne Programmieren!
Aufklappbare Infoboxen gehören zu den immer wieder gefragten UI-Elementen. Bis jetzt wurden sie mit viel CSS und sogar JavaScript nachgebaut, bzw. gab es in diversen Frameworks voneinander abweichende Implementierungen.
Jetzt gibt es eine Native Umsetzung in HTML, die von der open-ui.org entworfen und zur Standardisierung vorgeschlagen wurde:
Zwischenbilanz 2. + 3. Quartal
Ich hatte ja im März eine Zwischenbilanz für das erste Quartal gepostet.
Hier kommt nun die ursprünglich für Juni geplante - leider etwas verspätete - Zwischenbilanz, was im 2. und 3. Quartal angepackt wurde!
Schicke Schachteln - CSS Nesting ist in den Browsern angekommen
Geschachtelte CSS Regeln waren früher ein Anwendungsfall von CSS Präprozessoren. Aber nun schlägt das Imperium zurück!
CSS Selektoren - :nth-match() vs :nth-child(... of S)
Die Selektion von HTML-Elementen mit der CSS Pseudoklasse :nth-child()
wird schwierig, wenn die Elemente noch zusätzlich über Klassen- oder Attributselektoren eingegrenzt werden sollen und die Kindelement-Zählung nur innerhalb der zusätzlichen Selektoren stattfinden soll.
Um das zu lösen, wurde bereits 2011, im ersten Entwurf der CSS Selectors Level 4 Spezifikation, die Pseudoklasse :nth-match() vorgeschlagen.
Lesen Sie hier, was daraus wurde.
Wordpress - individuell mit CSS gestalten
Gesucht: Autoren (m,w,d)
Webdesign-Trend 2023 - Auf Direkt-Einbindung von Google-Fonts verzichten!
Vor einem Jahr schreckte ein Urteil des Landgerichts München Seitenbetreiber auf: Eine ungefragte Einbindung von Google-Fonts stellt eine Verletzung des Persönlichkeitsrechts durch Datenschutzverstoß dar.[1]
Frohe Weihnachten!
Adventskalender 2022
Auch in diesem Jahr möchte SELFHTML wieder einen Adventskalender für die Community anbieten.
In unserem Forum und in den eingehenden Emails ist uns aufgefallen, dass es sich bei den Themen häufig nicht um cutting-edge-technologies für early-adopter, sondern um den ganz normalen Wahnsinn handelt, den man eigentlich doch auch selbst gewusst hat.
Oranger Text auf weißem Grund?
Teil 2 unserer Makeover-Serie
Die bis 2022 im SELF-Wiki verwendete Linkfarbe #2673bf
hat auf weißem Hintergrund einen Kontrast von 4.90:1, was für großen Text ausreicht, für kleinen Fließtext jedoch nicht akzeptiert werden kann. Auf farbigen Hintergünden ist der Kontrast noch schlechter.
Als das CSS untersucht wurde, fiel auf, dass die Farbe der Linktexte bei :hover
zu orange (auf weiß! - Kontrast 3.33:1) wechselte.
Makeover für das SELF-Wiki
Am 14. September wurde unser Wiki ein Achtel Jahrhundert (12,5 Jahre) alt! In unserer Vereins-Chronik gibt es einen Überblick mit vielen Screenshots aus vergangenen Jahren.
Wir wollten das unrunde Jubiläum zum Anlass für ein Makeover nehmen, das auf der Mitgliederversammlung 2021 beschlossen wurde.
Immer wieder gefragt …
Outline raus! Dafür ist hgroup wieder da!
… oder war es nie weg?
In seinem Artikel Roundup of Recent Document Outline Chatter auf css-tricks gibt Geoff Graham die neuesten Entwicklungen um den document-outline-algorithm wieder.
Endlich - der Internet Explorer ist Geschichte!
Navigationen - oben oder unten?
Aus einer unverfänglichen Frage im Forum (Warum soll die Navigation im Quelltext neuerdings über dem Haupttext stehen?) entwickelte sich ein umfangreicheres Projekt, das noch nicht ganz abgeschlossen ist:
GIF - heute noch aktuell?
Vor wenigen Tagen starb Stephen E. Wilhite an Covid. Er wurde als Erfinder des GIF-Grafikformats berühmt. Das Graphics Interchange Format, kurz GIF ist ein Grafikformat für Bilder mit einer Farbpalette von max. 256 Farben, inkl. einer „Transparenzfarbe“. Es erlaubt eine verlustfreie Kompression der Bilder.
Besonders interessant: Es können mehrere (übereinanderliegende) Einzelbilder in einer Datei abgespeichert werden, die dann als Animationen interpretiert werden.
Geht das auch im IE? - eine Geschichte der Iconsets zur Browserunterstützung
Die Doku beschrieb von Anfang an nicht nur den Soll-Zustand der Spezifikationen, sondern eben auch die tatsächlich vorhandene Browserunterstützung.
Die ersten Versionen waren geprägt von der Zeit der Browserkriege, in der manche proprietären Elemente eben nur in einem Browser funktionierten. Heute ist die Anzeige dieser Browserunterstützung lange nicht mehr so wichtig wie früher, da selbst völlig neue Features oft sehr schnell von allen Browsern übernommen werden. Die schnelle Versionierung im Wochenabstand (bald haben Chrome und Firefox die 100 erreicht) wirkt im Vergleich zur Vergangenheit paradiesisch.
Mit dem Ende des Internet Explorer und dem kommenden Makeover wird nun auch die im Wiki verwendete Vorlage:Iconset beerdigt.
Wussten Sie schon? - SELFHTML gibt's auch auf Twitter
Schon seit mehreren Jahren hat SELFHTML einen Twitter-Kanal, auf dem Gunnar Bittersmannn (@g16n) News und Interessantes über Webdesign, Technologie und Typografie retweeted.
CSS - voll normal! Sind CSS-Resets heute noch nötig?
CSS revolutionierte die Gestaltung von Webseiten. Leider gab es aber große Inkonsistenzen zwischen den verschiedenen Browsern. Während der Internet Explorer bei Listen die Einrückungen über margin
vornahm, verwendeten die anderen Browser dafür padding
. Grund genug, alle Browser-Einstellungen in einem CSS-Reset zurückzusetzen:
20, 21 -22 …
Weihnachtsbrief 2021
Warten, zählen, hoffen, bangen …
2021 war wieder ein Jahr des Wartens und Zählens. Nicht Wetter und Unternehmungslust bestimmten, ob man rausdurfte. Es wurden Inzidenzen verglichen, Statistiken analysiert und die Tage bis zum Ende der Quarantäne oder zum erhofften Impftermin gezählt.
ARIA-live Regionen
Wenn es darum geht, deutsche Quellen für Barrierefreiheit zu nennen, landet man unwillkürlich immer wieder bei denselben Menschen und Firmen. Eine von den sehr aktiven ist die tollwerk GmbH aus Nürnberg mit einem tollen Blog über Barrierefreiheit.
mindscreen: Blog und Veranstaltungshinweise
Gerade in deutscher Sprache gleicht das Zusammentragen von Informationen zur Barrierefreiheit einem Puzzlespiel. Die Informationen sind verstreut und zusammenhängende Sammlungen sind rar. (Eine schöne Sammlung dazu findet sich übrigens bei uns im SELF-Wiki) ;-)
Manuel Matuzovic: Die Superpower der Tabulator-Taste
Manuel ist nach eigenen Angaben zur Barrierefreiheit gekommen, weil er sich an einem Wettbewerb beteiligt hat, bei der ein barrierefreies Produkt abgegeben werden sollte und seine Einreichung war nicht barrierefrei.
technica11y
Automatisierung war bereits an Tag 9 ein Thema. Die Tools selber sind in der Regel auf Englisch und hier soll es nur um deutsche Quellen gehen.
Die Prüfverfahren von T-Systems und BIK im Vergleich
Im Grunde kann man Testverfahren unterscheiden in
- automatische Tests, die lediglich einige wenige Vorgaben an Barrierefreiheit prüfen können
- Manuelle Tests durch Experten, die alle Vorgaben an die Barrierefreiheit überprüfen und aufgrund von sorgfältiger Ausbildung, Erfahrung und Strategien bei der Qualitätssicherung versuchen, damit den menschlichen Faktor der subjektiven Bewertung auf ein Minimum zu reduzieren
- Nutzertests, bei denen sogenannte authentische Nutzer ein Produkt nutzen und die Erfahrung bewerten. Als authentische Nutzer werden Menschen mit Behinderungen bezeichnet, die täglich Hilfsmittel verwenden.
Jede Methode hat ihre Vor- und Nachteile. Automatische Tests scheitern an Aufgaben wie „Macht ein Alternativtext Sinn“, machen aber keine Fehler - sie finden aber wirklich jedes Bild ohne Alternativ-Text.
Barrierefreiheitsstärkungsgesetz/ European Accessibility Act
Seit jeher veranlasst die Europäische Union sogenannte Harmonisierungen. Dabei geht es darum, die unterschiedlichen Gesetze in der Union zu vereinheitlichen. So wird es für einen Spanier leichter eine Dienstleistung in Skandinavien anzubieten oder für einen deutschen Hersteller etwas in Osteuropa zu verkaufen. Natürlich profitieren auch alle Bürger davon. Denn sie können sich darauf verlassen, dass viele aus dem Heimatland bekannte Regeln auch im Rest der EU gelten.
Sag ich's?
Blue-Beanie-Day
Heute, am 30.11., ist wieder Blue Beanie Day; ein Aktionstag, um auf die Wichtigkeit von Webstandardsaufmerksam zu machen. Er wird seit 2007 jährlich am 30. November begangen und wurde von Douglas Vos ins Leben gerufen.