Revision 509: Letzte Runde Glucksrad fur 2021

Published: Dec. 28, 2021, 5:29 p.m.

b'Dieses Mal hat Schepp Patrick Lipinski aka Lippe aka @dickelippe zu einer Runde\\nGl\\xfccksrad zu Gast. Wir kennen Patrick schon sehr lange von dem ganzen\\nKonferenz-Getingele, besser bekannt unter dem Begriff \\u201eKlassenfahrt\\u201c, und bei\\nder letzten gemeinsamen Konferenz kamen wir darauf, dass er doch einmal Gast bei\\nuns sein k\\xf6nnte. Gesagt, getan!\\n\\n\\n[00:00:59] GL\\xdcCKSRAD\\n\\nCSS\\u2018 APPEARANCE-PROPERTY\\n\\nLos geht es mit der appearance-Property. Patrick und Schepp stellen fest, dass\\nsie diese CSS-Eigenschaft eigentlich immer nur mit dem Wert none verwenden. Gibt\\nes auch andere Use-Cases? Schepp kommt au\\xdferdem in den Sinn, dass man im\\nneuesten Edge Canary das vom Open UI Projekt konzipierte, und frei umgestaltbare\\n ausprobieren kann. Wir debattieren zum Abschluss kurz \\xfcber Reset\\nvs. Normalize und \\xfcber die neueste Form des Resets.\\n\\nDAS -ELEMENT\\n\\nDie Anfangszeiten des Webs gr\\xfc\\xdfen und wir erinnern uns an Java-Applet-getriebene\\nWellen-Effekte auf Websites. Auch Java-getrieben, aber anders schlimm: Die\\nLog4j-Sicherheitsl\\xfccke, \\xfcber die Kristian K\\xf6hntopp ein herrliches Meinungsst\\xfcck\\ngeschrieben hat.\\n\\nDAS TITLE-ATTRIBUT\\n\\nWird leider meist als Tooltip oder von SEOs missbraucht. Wo das title-Attribut\\nsinnvoll eingesetzt werden kann, ist z. B. als Sidekick des -Elements.\\n\\nDER CSS-DATENTYP \\n\\nMehr als das, was wir in MDN lesen k\\xf6nnen, wissen wir in der Folge selbst nicht\\n\\xfcber diesen Datentyp: Er darf wahlweise ein Zeitwert oder ein Prozentwert (einer\\nZeit) sein. Anders als Schepp vermutet, hat das Ganze aber nichts mit den neuen\\nScroll-Linked-Animations zu tun.\\n\\nDIE GYROSCOPE API\\n\\nEine der ersten APIs, die mit HTML5 aus der Taufe gehoben wurden. Schepp\\nerinnert sich, dass Macbooks auch ein eingebautes Gyroskop/Accelerometer haben,\\nauf welches man aus Browsern heraus zugreifen kann.\\n\\nDIE CSS :HOST-CONTEXT()-PSEUDOKLASSE\\n\\n\\xdcber diese Pseudoklasse kann eine Webcomponent trotz Shadow-DOM-Barriere\\nherausfinden, in was f\\xfcr einem Light-DOM-Baum ihr Shadow-Dom-Host steckt. Gut,\\nwenn die Komponente sich an verschiedene Kontexte anpassen k\\xf6nnen soll.\\n\\nCSS GLOBAL KEYWORDS\\n\\nGlobale Keywords in CSS w\\xe4ren Dinge wie auto, none, inherit, revert oder\\ninitial, die man in so gut wie jede Eigenschaft stecken kann.\\n\\nHTMLS INPUTMODE-ATTRIBUT\\n\\n\\xdcber das inputmode-Attribut k\\xf6nnen Web-Entwickelnde auf einem -Element\\nsteuern, welche Art von Softkeyboard zur Eingabe angezeigt wird. Praktisch, wenn\\nes etwa in einer Anmeldung ein Feld gibt, in dem man entweder seine\\nE-Mail-Adresse oder seinen Benutzernamen eingeben kann.\\n\\nWEB ANIMATIONS API KEYFRAME EFFECTS ITERATIONCOMPOSITE-EIGENSCHAFT\\n\\nDiese Eigenschaft, von der wir zuvor noch nicht geh\\xf6rt haben, scheint zu\\nsteuern, ob erneute Animationsdurchg\\xe4nge einen vorherigen Wert ersetzen oder\\nsich aufaddieren. Tja, wieder was gelernt und vielleicht brauchen wir es eines\\nTages mal? Sowohl Patrick als auch Schepp haben die Web Animations API bislang\\nnoch nicht eingesetzt, allerdings kommt Schepp eine bestimmte Folge der \\u201eHTTP\\n203\\u201c-Serie in den Sinn, in welcher Jake ein ganz bestimmtes Problem nur mit\\nHilfe des Web Animations API l\\xf6sen konnte. Sehenswert!\\n\\nDER CSS-DATENTYP RATIO\\n\\nWurde der ratio-Datentyp fr\\xfcher ausschlie\\xdflich in Media Queries genutzt, kommt\\ner neuerdings auch in der CSS-Eigenschaft namens aspect-ratio zum Einsatz.\\n\\nDIE PRESENTATION API\\n\\nWir wissen nur eines: Es gibt sie wohl. Wer wei\\xdf, wof\\xfcr sie gut ist: Bitte\\nmelden! \\U0001f605\\n\\nCSS\\u2018 @PROPERTY-RULE\\n\\nWir finden diese ist das Beste des ganzen CSS-Houdini-Projekts und verweisen auf\\nSchepps Darlegungen in der 33-ten Folge des \\u201eWo wir sind ist vorne\\u201c-Podcasts (ab\\n00:12:31).\\n\\n\\nLINKS\\n\\nCSS\\u2018 -WEBKIT-TEXT-STROKE-PROPERTY\\n\\nPatrick erz\\xe4hlte in der Vorbesprechung von der M\\xf6glichkeit, farbige\\nText-Umrandungen nicht nur in SVG, sondern auch in HTML per CSS zu setzen. \\U0001f60a\\n\\nCSS\\u2018 PAINT-ORDER-PROPERTY\\n\\nDie zweite CSS-Eigenschaft, von der Patrick erz\\xe4hlte, war paint-order, das in\\nKombination mit -webkit-text-stroke n\\xfctzlich w\\xe4re, um eine Umrandung wirklich\\nnur au\\xdfen herum gehen zu lassen, indem man den Hintergrund/Fill dr\\xfcber legt.\\nLeider wird diese noch nicht au\\xdferhalb von SVG unterst\\xfctzt. \\U0001f641\\n\\nPATRICK SUCHT AKTUELL EINE POSITION ALS UX-ENGINEER!\\n\\nIhr fragt, was macht denn ein UX-Engineer eigentlich? Kein Problem, auch hier\\nk\\xf6nnen wir wieder auf die Kollegen vom \\u201eWo wir sind ist vorne\\u201c-Podcast\\nverweisen, die zu dem Thema eine Folge mit Dirk Ginader aufgenommen haben. Wer\\nalso jemanden wei\\xdf, der jemanden wei\\xdf\\u2026 Immer her mit den Jobangeboten!'