Diesmal trafen sich Vanessa und Schepp, um über ein ganzes Potpourri an aktuellen Themen aus der Web-Standards-Welt zu sprechen. Und über Münchener Restaurants.
Schaunotizen
- [00:01:20]
accent-color
- Mit
accent-color
könnt Ihr zukünftig bestimmen, in welcher Farbe farbliche Bestandteile von nativen Inputs dargestellt werden. Zu der Farbe optimal kontrastierende Icon- und Textfarben gibt es kostenlos obendrauf. Kommt mit Chrome 93 und Firefox 92. - [00:19:16] Smooth and simple page transitions with the shared element transition API
- Team Chromium testet die Praxistauglichkeit einer neuen Idee in Form eines Origin-Trials: die Shared Element Transitions API. Die Idee ist grundsätzlich richtig cool, Frage ist, ob sie in der aktuell geplanten Umsetzungsform zukunftstauglich genug ist, oder ob wir „schlauere“ technische Ansätze brauchen, wie man sie etwa in Svelte oder Ramjet findet. Schaut sie Euch an und gebt dem Team Feedback!
- [00:30:55] Implement window.{alert, prompt, confirm} removal from cross-origin iframes
- Team Chromium hat sich vor ein paar Wochen mit dem Release von Chrome 92 so richtig in die Nesseln gesetzt. Denn man hatte iframes dort um die Fähigkeit beschnitten, alerts, confirms oder prompts auszulösen. An sich löblich aus Sicherheitssicht. Weil man zuvor ein paar relevante Nutzungsszenarien übersehen hatte und diese doch recht drastische Änderung im Vorfeld nicht kommuniziert hatte, kam es wie es kommen musste: Reichlich Webentwickler*innen-Exkremente trafen die Windpaddel des großen Google-Bugtracker-Ventilators. Und so kam es, dass Google die Änderung nach anfänglicher Gegenwehr zurückgerollt und auf Anfang 2022 vertagt hat.
- [00:37:00] How I experience the web today
- Lustige Seite, die auf leicht übertriebene Art und Weise zeigt, wie kaputt das Web heutzutage ist.
- [00:47:41] Nachteile von Tailwind CSS
- Eeeendlich packt Vanessa mal mit Dingen aus, die ihr bei Tailwind auf die Füße gefallen sind 🥳 Tatsächlich muss man aber sagen, wäre man auch mit BEM & Co nicht viel besser aus der Nummer rausgekommen. Aber immer spannend, diese Berichte aus der Praxis!
Keine Schaunotizen
- Stefan’s Web Weekly
- Auf das Thema
accent-color
kamen wir aufgrund des wöchentlichen Newsletters von Stefan Judis, den Ihr vielleicht schon als Gast unseres Podcasts kennengelernt habt. - Restaurant Inszenario
- Tolles Münchener Restaurant mit ziemlich langatmig ladenden Webseite.
- Page Transitions Travel App
- Sarah Drasners Page Transitions Demo.
- Auphonic
- Der von vermutlich allen Podcastern genutzte Audio-Verschönerungsdienst.
- Unroll.me
- Ein leicht zu bedienender Newsletter-Abmelde-Service.
Kommentare
ptrckschrdtr #
Geschrieben am 8.09.2021 um 12:39
Hey ihr lieben. Ihr habt wieder mal mein Leib und Magenthema Tailwind gehabt. Und da bin ich ja schon mal grundsätzlich froh 😁
Aber warum sagt ihr, dass es ein Nachteil ist, wenn man die Farbe ändern möchte? Ich für meinen Teil trenne rigoros das Styling vom Markup! So haben wir das doch alle mal ganz früher gelernt oder?
Und genau jetzt kommt @apply ins Spiel. Wenn man das schlau einsetzt ergibt sich im von euch genannten Fall ein absoluter Vorteil. Alle genannten Nachteile sind dann auf einmal obsolet.
Mfg aus Berlin 👋
Schepp #
Geschrieben am 14.09.2021 um 08:48
Guten Morgen Patrick und entschuldige die späte Rückmeldung. Du bist bei Akismet leider im SPAM gelandet, den wir nur alle Jubeljahre mal durchforsten.
@apply
finde ich an sich auch super. So kann man gut eine Brücke zwischen BEM in HTML und Utility Komposition im CSS schlagen. Was ich allerdings doof finde, ist dass man dadurch einen großen Vorteil von Utility-based CSS verliert, nämlich das sehr kompakte Stylesheet. Das wäre anders (und ziemlich grandios), wenn die Browser@apply
nativ unterstützen würden (zumindest dann, wenn man mehr als eine Anweisung vorher gruppieren täte). Leider scheint aus einem offiziellen Standard nichts mehr zu werden: https://twitter.com/derSchepp/status/1236686711092129792Schade :/
Vanessa #
Geschrieben am 14.09.2021 um 08:58
Servus Patrick, servus Schepp,
Ich bin mir mit @apply ja immer nicht ganz so sicher.
1. Wenn man grundsätzlich `@apply` einsetzt, wo bleibt dann der Vorteil von Tailwind? Muss ich mir dann nicht doch wieder Gedanken um die Box-Komponenten Struktur machen, HTML-Elementen CSS Klassen geben etc.?
2. Vergrößert es nicht das geladene CSS? Beispiel: Ich lade einfach mal alle Tailwind Klassen (gepurged). So weit so gut. Jetzt erstelle ich eine Klasse `my-box`, die Tailwind-Klassen applied. Dadurch muss ich dann zusätzlich die Klasse `my-box` ausliefern.
Kurz gefragt: Wenn man Styling vom Markup trennt, was hat man denn dann von Tailwind?
Viele Grüße
Vanessa
Andi #
Geschrieben am 15.09.2021 um 11:28
Hallo zusammen,
zu allererst möchte ich mich für die Episode bedanken, da mich Tailwind beschäftigt, ich es aber bisher nicht eingesetzt habe. D.h. ich habe wenig bis gar keine Erfahrung damit. Also das ist nur meine eigene Einschätzung als Außenstehender:
IMHO ein Vorteil den man, auch mit @apply noch, hat an Tailwind ist das dahinter liegende Design-System mit den Farbspektren etc. Ich persönlich finde dieses System weitaus interessanter als den Rest von Tailwind, aber das ist natürlich nur meine persönliche Meinung.
Ich sehe natürlich auch, dass mit der Nutzung von @apply das ganze weitere System mit CSS-Utility in HTML mehr oder minder flöten geht.
LG Andi
Latz #
Geschrieben am 1.10.2021 um 21:15
Chris Coyer und Dave Rupert haben mittlerweile ein „Shoptalk“-Video zum Thema „accent-color“ veröffentlicht: https://www.youtube.com/watch?v=F17DzJYysWM
Vanessa Otto #
Geschrieben am 2.10.2021 um 10:35
Super, danke für den Link. Bestimmten waren viele auf eine Reaktion von Apple/Safari: https://caniuse.com/?search=accent-color
Aber wir wollen ja auch nicht Opera und Samsung Internet vergessen.
RSS-Feed zu diesem Beitrag
Kommentare sind für diesen Beitrag geschlossen.