WEBVTT

NOTE
Podcast: Wo wir sind ist vorne.
Episode: The Holy State of CSS
Publishing Date: 2020-11-01T12:16:00+01:00
Podcast URL: https://wowirsindistvorne.show
Episode URL: https://wowirsindistvorne.show/the-holy-state-of-css/

00:00:00.000 --> 00:00:03.800
 Wo wir sind, ist vorne, Folge 16. Heute füllen wir eine Umfrage aus.

00:00:03.800 --> 00:00:22.780
 Herzlich willkommen bei Wo wir sind, ist vorne. Frontend-Fakten-Frotzelein.

00:00:22.780 --> 00:00:26.800
 Der Late-Night-Frontend-Talkshow rund um Webdesign und Entwicklung.

00:00:30.000 --> 00:00:38.500
 Es reden sich um Head und Kragen, HTML-Fundamentalist Moritz Gießmann und JavaScript-Jongleur Konstantin Groß.

00:00:38.500 --> 00:00:59.060
 Hallo liebe Webwirkenden und gleich zu Beginn der Sendung die Frage an Moritz Moritz, wie geht's dir denn heute?

00:00:59.840 --> 00:01:01.340
 Ich frage für eine Zuhörerschaft.

00:01:01.340 --> 00:01:04.640
 Anders als letztes Mal.

00:01:04.640 --> 00:01:06.200
 Das klingt schon mal positiv.

00:01:06.200 --> 00:01:08.340
 Die Dinge haben sich geändert.

00:01:08.340 --> 00:01:09.900
 Verwirrung gestiftet.

00:01:09.900 --> 00:01:16.440
 Aber auf der anderen Seite haben wir tatsächlich mal Feedback bekommen und auch mal negatives Feedback, was mich ja fast schon gefreut hat.

00:01:17.440 --> 00:01:24.580
 Von daher haben wir vielleicht doch auch was richtig gemacht und vor allem die Spenden sind durch die Decke gegangen, was mich natürlich erst recht gefreut hat.

00:01:25.000 --> 00:01:27.560
 Manche haben sogar gleich mehrfach gespendet in den letzten Monaten.

00:01:27.560 --> 00:01:33.100
 Und deswegen möchte ich an der Stelle auch mal, ich glaube wir hatten das gesagt, ja wir bedanken uns dann in der Sendung bei euch.

00:01:33.100 --> 00:01:34.580
 Haben wir glaube ich gar nicht gemacht.

00:01:34.580 --> 00:01:38.520
 Ich möchte einfach mal die Namen nennen, die sowieso öffentlich auf der Buy-Me-Coffee-Seite stehen.

00:01:38.920 --> 00:01:44.720
 Vielen Dank an Hamper, an Hüggenberg und an den Schepp, die uns bereichlich bedacht haben.

00:01:45.680 --> 00:01:46.440
 Ja, vielen Dank.

00:01:46.440 --> 00:01:48.560
 Vielen Dank für einen andechtigen Applaus.

00:01:48.560 --> 00:01:55.640
 Genau, also Thema Feedback ist jetzt auch versprochen, versprechen wir das nicht, aber ich will mal sagen, ist jetzt erstmal erledigt.

00:01:55.640 --> 00:01:58.640
 Wir nerven euch nicht mehr damit, das hieß schon so, das ist eine kleine Marotte von uns.

00:01:58.640 --> 00:02:05.700
 Ihr dürft uns gerne weiterhin sagen, wie ihr uns findet, aber es ist jetzt auch, also wir wissen jetzt, dass wir anscheinend nicht alles verkehrt machen.

00:02:05.700 --> 00:02:09.200
 Und wenn wir es verkehrt machen, dann weist ihr uns drauf hin, das wissen wir jetzt auch.

00:02:09.200 --> 00:02:10.080
 Genau.

00:02:10.080 --> 00:02:15.440
 Ja, warte mal, irgendwas wollte ich zu den Spenden noch sagen.

00:02:15.460 --> 00:02:18.880
 Bei mir Coffee, wolltest du noch was, habe ich glaube ich auch schon gesehen in deinen Notizen, ja.

00:02:18.880 --> 00:02:27.720
 Wer spendet, der bekommt übrigens auch dann, wenn er mit Namen spendet, auch ein Tweet mit Kuss-Smileys, mit Kuss-Emojis, das ist ganz wichtig.

00:02:27.720 --> 00:02:28.160
 Tausend Küsse.

00:02:28.160 --> 00:02:33.340
 Wer Kuss-Emojis von uns haben will, es gibt immer einen handgeklöppelten Tweet für jeden, der das macht.

00:02:33.340 --> 00:02:42.160
 Und eventuell, auf den einen oder anderen bin ich danach auch zugekommen und habe gefragt, ob er vielleicht auch Sticker haben will, das ist auch eine Option.

00:02:42.400 --> 00:02:47.680
 Also wenn ihr Sticker haben wollt, könnt ihr uns auch fragen, aber wir schicken sie euch noch viel lieber, wenn ihr spendet.

00:02:48.020 --> 00:02:51.280
 Ja, und ihr könnt auch noch mehr von uns haben, ihr müsst uns nur sagen, was ihr denn gerne wollt.

00:02:51.800 --> 00:03:03.380
 Es gibt nämlich bei Buy-Meer-Coffee auch eine Membership, wo man jetzt, wenn man sagt, bevor ich jetzt jeden Monat manuell da was hinschicke, dann kann ich auch irgendwie mal ein paar Euro pro Monat springen lassen, automatisiert.

00:03:03.820 --> 00:03:08.040
 Und dann seid ihr WWSIV-VIP-Club-Member-Ultras.

00:03:08.040 --> 00:03:14.620
 Und es gibt da die Option, dass man irgendwelche Boni anbietet, da haben wir jetzt einfach mal reingeschrieben, sagt uns doch einfach, was ihr wollt.

00:03:14.620 --> 00:03:24.100
 Eine Idee war zum Beispiel, dass wir die Spam-Spots irgendwie downloadbar machen, da kam jetzt das Feedback schon öfter, dass die anscheinend sehr gut ankommen und das wäre zum Beispiel eine Idee.

00:03:24.100 --> 00:03:29.920
 Oder was könntet ihr euch denn vorstellen und habt ihr überhaupt Lust, uns regelmäßig zu unterstützen? Müsst ihr auch nicht, reicht auch so.

00:03:29.920 --> 00:03:33.120
 Wir werden keine nackte Videofolge machen.

00:03:33.120 --> 00:03:39.140
 Nein, nein. Eine Videofolge, da kann man vielleicht mal drüber reden, aber dann doch in Klamotten. Das will ja auch keiner sehen.

00:03:39.140 --> 00:03:42.140
 Aber vielleicht in Klamotten, die aussehen, als wären wir nackt.

00:03:42.140 --> 00:03:46.860
 Das wäre eine Idee, so ein Naked-Suit. Da lasse ich mich vielleicht zu breit schlagen.

00:03:48.920 --> 00:03:54.500
 Genau, und ihr könnt uns auch was persönlich zukommen lassen, wenn ihr den einen oder den anderen von uns bedenken wollt.

00:03:54.500 --> 00:04:02.020
 Ich glaube, das haben wir zu Beginn der zweiten Staffel eingeführt auf der Seite, auf vielfache Nachfrage, haben es aber, glaube ich, gar nicht beworben.

00:04:02.020 --> 00:04:09.240
 Also es gibt da einen neuen Link oben in dem Header, wer mehr oder weniger über uns erfahren will, der klickt auf, wer wir sind, ist fraglich.

00:04:09.360 --> 00:04:19.480
 Und da gibt es dann auch Links zu jedem von uns, zu Amazon-Wunschlisten, zu unseren verschiedenen Social-Media-Profilen oder direkter Paypal-Spende.

00:04:19.480 --> 00:04:22.000
 Also wer das in Anspruch nehmen will, natürlich sehr gerne.

00:04:22.000 --> 00:04:34.060
 Ja, und ansonsten, bevor wir jetzt zur obligatorischen Bierfrage kommen, die Stammhörer unter euch, die erinnern sich, und Stammhörerinnen natürlich, ich muss da selber immer dran denken,

00:04:35.280 --> 00:04:44.260
 die erinnern sich vielleicht an Moritz' Blockflöten-Solo aus Folge 5 und ich habe heute Abend dem Moritz noch vor der Sendung geschrieben, bring bitte deine Blockflöte mit.

00:04:44.260 --> 00:04:51.000
 Und ich habe hier, ich zeige es mal dem Moritz in die Kamera, ich bin jetzt auch in HD zu sehen, habe jetzt eine neue Webcam.

00:04:51.000 --> 00:04:53.160
 Also der Konstantin sieht so gut aus wie selten.

00:04:53.160 --> 00:04:57.580
 Ich bin jetzt gerüstet für eine Web-Folge, für eine Video-Folge.

00:04:57.580 --> 00:04:59.340
 Oh, ein buntes Glockenspiel sehe ich gerade.

00:04:59.340 --> 00:05:07.920
 Kinderglockenspiel. Und ich stimme einfach mal mit ein und du als Semiprofi-Musiker wirst bestimmt erkennen, was es ist und mitspielen.

00:05:07.920 --> 00:05:08.820
 Oh Gott.

00:05:08.820 --> 00:05:11.420
 Ich hoffe, man hört es laut genug, ist es ein bisschen weiter weg vom Mikrofon.

00:05:11.420 --> 00:05:16.340
 Er hat vorhin gesagt, es fängt an auf C. Ich weiß, bei der Blockflöte genau, wo das C ist und sonst nix.

00:05:16.340 --> 00:05:17.580
 Okay, dann gucken wir mal.

00:05:19.560 --> 00:05:39.720
 Sehr schön, auch mit der Verzögerung, der Übertragung.

00:05:39.720 --> 00:05:43.640
 Ja, herzlichen Glückwunsch, wo wir sind, ist vorne. Herzlichen Glückwunsch wir.

00:05:44.840 --> 00:05:51.160
 Das ist unsere Jubiläumsfolge. Am 27. Oktober 2019 ist unsere erste Folge entstanden.

00:05:51.160 --> 00:05:53.340
 Ich wusste das jetzt gar nicht.

00:05:53.340 --> 00:05:57.340
 Verrückt, ne? Ja, habe ich nachgeschaut und gedacht, das müsste doch jetzt ein Jahr her sein.

00:05:57.340 --> 00:05:59.320
 Das ist jetzt heute fast exakt ein Jahr her.

00:05:59.320 --> 00:06:04.940
 Also die Idee war ja schon ein bisschen länger, aber die erste Folge aufgenommen haben wir tatsächlich am 27. Oktober.

00:06:04.940 --> 00:06:07.900
 Live ging ja erst viel später, muss man ganz gut sagen.

00:06:07.900 --> 00:06:10.620
 Ja, irgendwie drei Monate später oder so war es dann noch länger.

00:06:10.620 --> 00:06:15.460
 War ja erst im Jahr drauf, also erst 2020, aber aufgenommen haben wir tatsächlich damals um die Zeit, ja.

00:06:15.460 --> 00:06:18.540
 Genau, jetzt haben wir das tatsächlich schon ein Jahr durchgezogen. Verrückt, verrückt.

00:06:18.540 --> 00:06:20.540
 Und das trotz Pandemie, niemand kann uns aufhalten.

00:06:20.540 --> 00:06:23.960
 Grüße an Olli an der Stelle, vielleicht, falls er zuhört.

00:06:23.960 --> 00:06:24.420
 Ja, hallo Olli.

00:06:24.420 --> 00:06:28.120
 Mit dem ich ursprünglich mal diese Idee geschmiedet hatte.

00:06:28.120 --> 00:06:30.180
 Und dann haben wir ihm sie einfach geklaut.

00:06:30.180 --> 00:06:34.240
 Dann haben wir sie ihm einfach geklaut, alles anders gemacht und hier sind wir.

00:06:34.240 --> 00:06:37.600
 Die Flöte sieht aus, als hätte da jemand reingepissen.

00:06:37.600 --> 00:06:43.080
 Was machst du denn nachts so? Ja, die sieht angekaut aus, definitiv.

00:06:43.080 --> 00:06:47.900
 Ich habe ja auch noch, warte mal, ich habe ja noch eine andere. Moment.

00:06:47.900 --> 00:06:52.080
 Aus Metall.

00:06:52.080 --> 00:06:56.240
 Die ist aus Metall, ein Tin Whistle nennt sich das und die ist auch angekaut.

00:06:56.240 --> 00:06:57.940
 Was machst du denn?

00:06:57.940 --> 00:07:05.300
 Ja, der ist ein billiger, der macht das, ja, die, das, da war ich, als ich die bekommen habe, war ich, ähm, weiß ich nicht, so neun.

00:07:05.300 --> 00:07:06.160
 Ach so.

00:07:06.160 --> 00:07:07.340
 Ich glaube, da kaut man noch auf Flöten.

00:07:07.340 --> 00:07:07.780
 Ja, möglich.

00:07:07.780 --> 00:07:12.940
 Kommen wir doch zur Bierfrage, damit wir dann endlich zu was Gehaltvollerem kommen.

00:07:12.940 --> 00:07:16.440
 Oh je, da kriege ich wieder Ärger, wenn ich Bier trinke, aber lass uns einfach mal.

00:07:16.440 --> 00:07:17.960
 Was, du kriegst Ärger, wenn du Bier trinkst? Warum?

00:07:17.960 --> 00:07:22.060
 Keine Ahnung. Lies mal die Kommentare zur letzten Folge.

00:07:22.060 --> 00:07:27.260
 Ach so, weil du dann ausfällig wirst und deine Körperöffnungen nicht mehr im Griff hast.

00:07:27.680 --> 00:07:33.580
 Ja, genau, weil ich, ich wollte eigentlich heute noch ankündigen, gleich in der Retro, dass ich jetzt eine Räuspertaste habe, um genau sowas zu verhindern.

00:07:33.580 --> 00:07:36.320
 Ja, aber die funktioniert leider, funktioniert leider technisch noch nicht.

00:07:37.020 --> 00:07:40.400
 Ähm, also, ihr müsst das vielleicht jetzt, ihr müsst jetzt heute noch mal aushalten.

00:07:40.400 --> 00:07:40.920
 So, was hast du denn?

00:07:40.920 --> 00:07:41.920
 Ich zeig's dir mal in die Kamera.

00:07:41.920 --> 00:07:45.240
 Ich hab schon wieder so eins in der, in der Papierverpackung, die hab ich da auch mitgenommen damals.

00:07:45.240 --> 00:07:45.240
 Ein Seepferd.

00:07:45.240 --> 00:07:46.700
 Seepferd, wildsauer.

00:07:46.700 --> 00:07:48.240
 Seltenes Bier steht auch wieder drauf.

00:07:48.240 --> 00:07:49.620
 Ähm, hoffen wir mal, dass es stimmt.

00:07:49.620 --> 00:07:52.160
 Ähm, ich mach das mal auf.

00:07:52.160 --> 00:07:53.660
 Zisch.

00:07:53.660 --> 00:07:57.060
 Ja, ich hab, ich hab wieder ein, äh, Grevensteiner, das irgendwie...

00:07:57.060 --> 00:07:57.920
 Oh, es läuft auch schon über.

00:07:58.800 --> 00:08:04.800
 Also, ihr dürft jetzt euch euer Bier holen und mittrinken.

00:08:04.800 --> 00:08:10.160
 Und, äh, ich hab wieder dieses Grevensteiner, dieses Pseudo-Craft-Bier, was ich schon öfter hatte.

00:08:10.160 --> 00:08:15.540
 Ähm, ich glaub, ich muss mal, muss mal Neues kaufen oder, oder vielleicht schicken die Hörer mal wieder was.

00:08:15.540 --> 00:08:22.880
 Ähm, weil ich, ja, also, ich bin auf jeden Fall immer sehr empfänglich für Augustina, da hatte ich aber jetzt die Woche nur eine Flasche und die ist leider schon weg.

00:08:22.880 --> 00:08:27.520
 Also, falls ihr mal was Nettes schicken wollt, schickt Augustina, das ist einfach ein sehr gutes Bier.

00:08:27.520 --> 00:08:31.800
 Oder das aus, äh, eurer Heimat, euer Lieblingsbier oder...

00:08:31.800 --> 00:08:32.540
 Das ist doch eine Idee.

00:08:32.540 --> 00:08:34.840
 Ihr wolltet, dass wir es schon immer mal trinken sollen.

00:08:34.840 --> 00:08:35.580
 Sehr gerne.

00:08:35.580 --> 00:08:37.360
 Jo.

00:08:37.360 --> 00:08:39.520
 Jüdi, dann, äh, fangen wir doch an mit der...

00:08:39.520 --> 00:08:47.340
 BBS e.V. präsentiert die Retrospektive.

00:08:47.340 --> 00:08:56.020
 Ja, ich hab grad nochmal überlegt, wir haben uns natürlich wieder schlecht abgesprochen, wir sollten uns bei der Retro vielleicht wieder abwechseln.

00:08:56.540 --> 00:08:58.340
 Ähm, ich verschiebe jetzt mal die Reihenfolge eben.

00:08:58.340 --> 00:08:59.800
 Was, äh, äh, ja, du bist ja dran mit der Retro.

00:08:59.800 --> 00:09:02.240
 Ja, genau, aber ich, äh, ich verschiebe mal.

00:09:02.240 --> 00:09:03.000
 Steht das da falsch?

00:09:03.000 --> 00:09:05.220
 Nein, nein, ist alles gut, ist alles gut.

00:09:05.220 --> 00:09:09.780
 Ich verschiebe nochmal die Reihenfolge, dass ich nicht einen langen Blog hab und, äh, du einen langen Blog.

00:09:09.780 --> 00:09:10.960
 Ach so, so meinst du abwechseln, ja.

00:09:11.160 --> 00:09:13.480
 Ja, genau, deswegen, ich hab jetzt grad mal verschoben.

00:09:13.480 --> 00:09:21.480
 Also, äh, mein erster Punkt ist, ähm, ich hab ja immer, ich hab ja immer Witze gemacht über YouTube und schreib's in die Kommentare, äh, oder drück die Glocke.

00:09:22.040 --> 00:09:37.680
 Oder abonnieren, ich mein, abonniert habt ihr ja hoffentlich schon, wenn ihr uns hört, ähm, aber es gibt jetzt, und wahrscheinlich gibt's das schon voll lange, es ist mir nur nie aufgefallen, es gibt bei Twitter eine Glocke, die man drücken kann, die genau denselben Effekt hat wie bei YouTube, nämlich, dass, äh, man über jeden Tweet, äh, eine Notification bekommt.

00:09:37.840 --> 00:09:45.580
 Und das könntet ihr bei unserem WWS-IV-Account einfach mal tun und wir würden uns freuen, weil dann kriegt ihr auch alles mit, wenn wir mal wieder Sticker verlosen.

00:09:45.580 --> 00:09:47.600
 Oder vielleicht auch mal was anderes verlosen, mal.

00:09:47.600 --> 00:09:48.780
 Oder was anderes verlosen.

00:09:48.780 --> 00:10:03.160
 Oder uns bei euch bedanken, dass ihr gespendet habt mit vielen Kuss-Smileys, äh, oder, oder was auch immer, wir schreiben gar nicht so viel, also keine Angst, wir spammen euch in der Regel nicht arg voll, aber, äh, das ist, das, die Glocke lohnt sich, würde ich sagen.

00:10:03.160 --> 00:10:06.380
 Ja, damit, äh, übergebe ich an dich.

00:10:06.380 --> 00:10:12.940
 Damit übergibst du dich, ähm, äh, jetzt muss ich, jetzt hast du mich mit dem Umsatz hier ein bisschen durch, äh, aus dem Konzept gebracht.

00:10:12.940 --> 00:10:15.140
 Oh, ich kann auch gerne noch, ich kann auch gerne noch was machen.

00:10:15.140 --> 00:10:16.260
 Ja, ja, ja, mach, mach noch was.

00:10:16.260 --> 00:10:18.580
 Ähm, Moment, ich muss gerade mal gucken.

00:10:18.580 --> 00:10:23.780
 Ich kann, äh, noch über, ich wollte über die Reaper, äh, Reusper-Taste sprechen.

00:10:23.780 --> 00:10:33.700
 Also, die ja jetzt nicht klappt, aber rein technisch funktioniert's nur nicht mit unserem Setup, aber trotzdem, äh, finde ich die Technik dahinter ganz interessant, weil ich da was gelernt hab, was ich nicht kannte vorher.

00:10:34.400 --> 00:10:47.900
 Ähm, und zwar, äh, gibt es ein, ein, äh, ein Format, das nennt sich OSC, ähm, mit dem kann man Events durchs Netzwerk schicken und das, äh, das heißt Open Sound Control, das, äh, Format.

00:10:47.960 --> 00:10:58.820
 Und damit kann man, äh, so, wenn ich jetzt, wenn ich jetzt im Netzwerk irgendwie mein, mein Handy zum Beispiel hab und da eine OSC-App drauf hab, ähm, kann ich da Events schicken an zum Beispiel, ähm, unsere Aufnahmesoftware Reaper.

00:10:58.820 --> 00:11:08.380
 Das, das Ding hat dann, äh, Reaper hat dann einen Listener und, äh, wenn die beide, äh, ich muss, ich muss an meinem Handy einfach nur, ähm, die IP-Adresse von meinem Rechner eingeben und ein Port.

00:11:08.900 --> 00:11:16.460
 Und auf dem hört Reaper dann zu und da kann ich da Events hinschicken und dann kann unsere Aufnahmesoftware drauf reagieren, wenn ich auf meinem Handy, äh, eine Taste drücke.

00:11:16.460 --> 00:11:25.240
 Und das fand ich irgendwie cool, dass es, äh, für genau diesen Fall, also eine Taste, die irgendwie Mute macht, ähm, irgendwie was gibt, wo ich eigentlich, äh, gar nichts irgendwie neu erfinden muss,

00:11:25.240 --> 00:11:32.700
 Sondern ich muss einfach nur die entsprechende App installieren, ähm, in Reaper das konfigurieren, dann sehe ich die Events reinlaufen und dann, äh, ist das im Prinzip schon eingerichtet.

00:11:32.700 --> 00:11:33.980
 Also das ist eine ziemlich coole Sache.

00:11:33.980 --> 00:11:39.540
 Funktioniert ist nur leider nicht, weil wir halt Remote aufnehmen und, äh, das, das Muten bei mir nicht ankommt.

00:11:39.540 --> 00:11:45.160
 Also das Mute-Signal auf der Spur, äh, die Spur wird trotzdem weiter aufgenommen und das Mute-Signal bei Moritz kommt natürlich bei mir nicht an.

00:11:45.160 --> 00:11:51.800
 Äh, aber wir finden vielleicht noch eine Lösung, damit uns, äh, Faux, Faux, Pässe, äh, in Zukunft erspart bleiben.

00:11:51.800 --> 00:11:54.520
 Äh, äh, ich, ich kann gleich noch weitermachen.

00:11:54.520 --> 00:12:07.420
 Ähm, wir haben vorhin, äh, der Konstantin hat vorhin schon die Spenden-Abo-Geschichte angesprochen und da habe ich noch einen kleinen Nachtrag dazu, ähm, weil mir aufgefallen ist, dass, äh, die Spenden eigentlich immer diese vorausgewählten, äh, Summen sind.

00:12:07.420 --> 00:12:15.180
 Also so ein, ein Bier, drei Biere und, ne, eins, zwei und, wie, wie, wie war das nochmal?

00:12:15.180 --> 00:12:23.600
 Äh, ich, drei, äh, ich weiß jetzt auch nicht mehr, drei, fünf und, äh, ich schaue nochmal kurz, äh, eins, drei und fünf.

00:12:23.600 --> 00:12:24.280
 Eins, drei und fünf.

00:12:24.280 --> 00:12:34.940
 Eins, drei und fünf. Ähm, es gibt da ein Freitextfeld, also wenn ihr jetzt, ihr könnt die Auswahl, also die, die Menge also selbstbestimmen, bei uns kosten wir drei Euro.

00:12:34.940 --> 00:12:41.560
 Ähm, ihr könnt aber auch, wenn ihr zwei spenden wollt, könnt ihr auch zwei spenden, das ist natürlich nicht gut.

00:12:41.660 --> 00:12:57.820
 Ihr könnt natürlich auch 87 Biere spenden, wenn ihr wollt, das kann man einfach in das Freitextfeld reinschreiben. Also, ähm, falls euch die fünf nicht reichen und ihr denkt, oh, den wollte ich, ich wollte den schon immer mal, ähm, das nächste Mikrofon, äh, sponsern, dann könnt ihr da auch 127 reinschreiben oder so.

00:12:59.420 --> 00:13:00.920
 Was, was guckst du denn so?

00:13:00.920 --> 00:13:03.620
 Ich, ich, ich, ich höre dir andächtig zu und, äh.

00:13:04.000 --> 00:13:09.520
 Konstantin hat gerade sehr, sehr, äh, verwirrt und belustigt geschaut, als ob ich irgendwas Lustiges gesagt hätte.

00:13:09.520 --> 00:13:10.500
 Nein, nein, nein, alles gut.

00:13:10.500 --> 00:13:13.460
 Vielleicht wirkt das Bier schon, das ist sauer, macht lustig, weißt du.

00:13:13.460 --> 00:13:15.180
 Du hast ja auch schon vorgetrunken, ne?

00:13:15.180 --> 00:13:17.480
 Ich hab, äh, schon, ja, bisschen mehr.

00:13:17.480 --> 00:13:26.100
 Ähm, gut, äh, ich, äh, ja, ich bin nicht irgendwie, ich bin immer noch aus dem Konzept, weil ich jetzt was sagen soll, obwohl du noch nicht fertig bist.

00:13:26.100 --> 00:13:38.140
 Ähm, mich beschäftigt tatsächlich seit unserer Webtypo-Folge vor zwei Folgen, äh, das Thema Typografie immer noch und, ähm, ich habe gearbeitet an der Bibliothek OpenType.js,

00:13:38.240 --> 00:13:48.280
 das ist eine, eine viel genutzte, auch in kommerzioneller, kommerzioneller Software eingesetzte JavaScript-Library, mit der man OpenType-Schriftarten lesen und auch speichern kann.

00:13:48.280 --> 00:13:53.800
 Und das Parsen funktioniert auch gut, aber beim Schreiben ist es doch noch etwas, äh, limitiert.

00:13:53.800 --> 00:14:01.180
 Und, äh, unter anderem fehlen bestimmte Tabellenformate, in denen OpenType-Features wie Contextual Alternates, ähm, gespeichert werden.

00:14:01.180 --> 00:14:06.560
 Und ich habe nach Alternativen gesucht, gibt es aber anscheinend nichts Open-Source-mäßiges.

00:14:06.960 --> 00:14:16.960
 Ähm, ganz oft ist man zum Beispiel auch, ähm, deswegen bin ich halt draufgekommen, in kommerzioneller Software, in, in den Formbeiträgen und vom Support so, äh, ja, warum funktionieren denn Contextual Alternates noch nicht?

00:14:17.400 --> 00:14:22.020
 Und dann kommt halt raus, ja, wir nutzen OpenType.js und die können das nicht und deswegen können wir das auch nicht.

00:14:22.020 --> 00:14:26.780
 Ist kommerzionell wirklich ein Wort, muss ich mal kurz einhaken? Oder meinst du kommerzionell?

00:14:26.880 --> 00:14:28.240
 Habe ich kommerzionell gesagt?

00:14:28.240 --> 00:14:29.640
 Zum fünften Mal.

00:14:29.640 --> 00:14:32.140
 Das ist wie Spezifizität, sag mal.

00:14:32.140 --> 00:14:34.920
 Oh Mann.

00:14:34.920 --> 00:14:37.820
 Nee, es ist okay, du hast jetzt einfach ein neues Wort erfunden.

00:14:37.820 --> 00:14:40.720
 Das ist das, äh, ich wollte nur fragen, ob es Absicht ist.

00:14:40.720 --> 00:14:41.880
 Ich glaube, wir sollten jetzt schon aufhören.

00:14:41.880 --> 00:14:43.880
 Nein, ich bin, ähm, ja.

00:14:43.880 --> 00:14:46.740
 Wenn ihr nicht wollt, dass wir aufhören, dann müsst ihr jetzt spenden.

00:14:46.740 --> 00:14:48.080
 Wir kriegen das live mit.

00:14:48.080 --> 00:14:49.940
 Ja, es hört ja nur keiner live zu.

00:14:50.340 --> 00:14:57.140
 Aber gut, ähm, komm jetzt, mein Gott, das ist, das ist so peinlich, da bin ich fast am überlegen, ob ich das, äh, rausschneide, aber, äh, gut.

00:14:57.140 --> 00:15:05.340
 Nein, nein, nein, nein, ich, ich, ich, ich, ich nehme jetzt ein paar kommerziell, kommerziell, kommerziell auf und dann kann ich die im Nachhinein an der entsprechenden Stelle einfügen.

00:15:05.340 --> 00:15:07.600
 Und ich habe gerade erfunden Spezifitot.

00:15:07.600 --> 00:15:09.100
 Spezifitot, okay, so.

00:15:09.100 --> 00:15:11.380
 Ähm, wo war ich denn jetzt?

00:15:11.380 --> 00:15:20.100
 Äh, genau, jedenfalls, äh, ich, oh Mann, ähm, ja, auch kommerzielle Software, äh, scheitern dann daran, dass die,

00:15:20.100 --> 00:15:24.340
 die Library das nicht unterstützt und dann habe ich angefangen, habe gedacht, so, äh, das kann doch so schwer nicht sein.

00:15:24.340 --> 00:15:26.700
 Äh, wenn die schon manche Sachen schreiben können, muss das doch gehen.

00:15:26.700 --> 00:15:33.540
 Und habe mir dann echt Nächte um die Ohren geschlagen und, äh, versucht, diese Schreibfunktionen selber zu vervollständigen.

00:15:33.540 --> 00:15:39.360
 Und das war echt mal interessant, ähm, so als Webentwickler, der normalerweise damit nicht so zu tun hat,

00:15:39.360 --> 00:15:46.140
 wirklich mal auf Byte-Ebene zu agieren und sich auch so die Spezifikation von so einem Dateiformat mal durchzulesen und das dann umzusetzen.

00:15:46.980 --> 00:15:53.600
 Und das ist tatsächlich ein tolles Gefühl, wenn es dann auch wirklich funktioniert, ja, wenn man die Schriftart reinlädt, äh, sie exportiert und es kommt keine Meldung,

00:15:53.600 --> 00:16:00.760
 das was nicht unterstützt wird und dann öffnet man sie in einem anderen Schriftprogramm wie Fontforge zum Beispiel und tatsächlich ist alles da, was man braucht.

00:16:01.160 --> 00:16:06.300
 Also das war, war echt super, mal, ähm, was komplett anderes zu machen und dann dabei auch noch erfolgreich zu sein.

00:16:06.300 --> 00:16:12.200
 Und was ich dabei rausgefunden habe, ist, dass Unit-Tests einfach so, so wichtig sind.

00:16:12.200 --> 00:16:21.560
 Das war früher für mich immer so ein bisschen, ach, äh, komm, braucht man das wirklich und so, ja, aber, äh, gerade in dem Fall war halt wirklich die beste Vorgehensweise erst den Test-Case schreiben,

00:16:21.780 --> 00:16:28.660
 weil ich hatte Beispieldaten aus den Specs oder zumindest anhand der Specs wusste ich, wie das am Schluss aussehen soll, manchmal gab es keine Beispiele dazu.

00:16:28.660 --> 00:16:34.120
 Das heißt, ich habe den Test-Case geschrieben, ähm, wenn ich den in den Input hätte, dann müsste am Schluss das und das rauskommen.

00:16:34.440 --> 00:16:40.800
 Und dann habe ich so lange am Code gearbeitet, bis der Test tatsächlich einfach erfolgreich war und deswegen, äh, Leute schreibt Test-Cases.

00:16:40.800 --> 00:16:47.520
 Ja, aber dazu muss ich sagen, da habe ich es jetzt gerade mit meinen Kollegen drüber gehabt über Unit-Tests, äh, oder generell Testing.

00:16:47.520 --> 00:16:58.620
 Ähm, ich finde Unit-Tests, man muss sich genau überlegen, Unit-Tests für alles ist aus meiner Sicht Quatsch, äh, Unit-Tests ist nur sinnvoll, wo du halt auch eine, eine sinnvolle Unit hast, die du testen kannst.

00:16:58.960 --> 00:17:08.060
 Und, äh, bei den meisten Sachen, die, äh, bei mir so gemacht werden, ähm, da gibt es zwar auch ein paar Units, die man testen kann, aber ich finde da Ende-zu-Ende-Tests, ähm, einfach besser.

00:17:08.060 --> 00:17:15.680
 Aber wenn du so richtig Software schreibst, so mit, mit Algorithmen und irgendwie Function und Input-Output und sowas, da ist ein Unit-Test durchaus sinnvoll, finde ich.

00:17:15.680 --> 00:17:26.580
 Genau, also, ja, Unit-Tests meine ich jetzt noch nicht unbedingt nur Unit-Tests, sondern auch, äh, Integration-Tests, also sämtliche Formen einfach, schreib irgendwas, was, was überprüft, ob dein Code dann tatsächlich das tut, was du von ihm erwartest, dass er das tut.

00:17:27.960 --> 00:17:29.640
 Ja, aber das macht doch der Code schon.

00:17:29.640 --> 00:17:33.300
 Naja, wenn ihr, ne, ne, ne, ne, ne.

00:17:33.300 --> 00:17:37.260
 Oh Gott, die ganzen Leute, die Test-Tests und Development geil finden, die, die hängen mich gleich auf.

00:17:37.260 --> 00:17:37.840
 Ja, aber echt.

00:17:37.840 --> 00:17:39.020
 Ähm, ist okay.

00:17:39.020 --> 00:17:44.560
 Ich hab gehört, wenn man ein bisschen, wenn man ein bisschen, äh, kontrovers ist, dann kriegt man auch mehr Spenden.

00:17:44.760 --> 00:17:46.460
 Ja, hab ich auch schon gehört, soll funktionieren.

00:17:46.460 --> 00:18:01.600
 Ähm, genau, und noch ein Punkt dazu, äh, Test-Cases, nicht nur einfach, wenn man jetzt gerade solche Specs hat, ja, nicht einfach nur das nehmen und dann einen Test-Case und dann ist die Sache abgehakt, sondern auch erweitern mit, äh, was ist denn, wenn ich mehr Daten hab als in dem Testfall?

00:18:01.660 --> 00:18:09.840
 Oder was ist, wenn ich weniger Daten hab? Weil wenn das mit einem Eintrag funktioniert und ich dann einem Buchstaben irgendwelche Ligaturen geben kann, äh, und allen anderen aber nicht, dann bringt das natürlich nix.

00:18:10.220 --> 00:18:15.880
 Also, äh, sinnvolle Tests schreiben. Können wir vielleicht auch mal eine Folge widmen, mal gucken.

00:18:15.880 --> 00:18:18.320
 Sinnvolle Tests schreiben, ja, das bringst du mir dann bei.

00:18:18.320 --> 00:18:20.660
 Mhm, live, in Farbe und bunt.

00:18:20.660 --> 00:18:24.740
 Ja, auch gern in, in, in, äh, HDR.

00:18:24.740 --> 00:18:27.480
 Gut, dann, äh, übergebe ich nochmal an dich.

00:18:27.480 --> 00:18:33.480
 Äh, ja, ich bin gerade überlegen, ob wir, ob wir darüber überhaupt jetzt nochmal sprechen. Ich, haben wir, haben wir schon mal über AV-Receiver gesprochen?

00:18:33.540 --> 00:18:47.480
 Also, ich weiß, dass wir, äh, ich weiß, dass wir, äh, wir haben schon mal über gesprochen. Äh, genau, also ich hab mal gesagt, irgendwie ist es irgendwie Peak-Bluetooth und, ähm, AV-Receiver sind scheiße und, äh, ich hab da so ein, so ein Quest gehabt nach dem richtigen Gerät, äh, für mich.

00:18:47.480 --> 00:19:03.500
 Und hatte zwei Geräte da, die beide, äh, sich, obwohl von komplett unterschiedlichen Marken, die sich, die beide, äh, darin geglänzt haben, äh, Bluetooth total scheiße zu unterstützen, also Bluetooth-Audio annehmen, ähm, ähm, also der Bluetooth-Receiver war einfach scheiße, so im Sinne von,

00:19:03.540 --> 00:19:13.960
 äh, ich spiel was ab und es hat irgendwie drei Sekunden Verzögerung, äh, ich, ich skipp im Song und dann, äh, passieren ganz komische Dinge, ich, die Lautstärke, Synchronisation funktioniert nicht vernünftig.

00:19:13.960 --> 00:19:21.840
 Ich hab jetzt tatsächlich was gefunden, was gut funktioniert. Ich hab's mit, mit Geld erschlagen. Ich will's, weiß gar nicht. Ich sag, nee, nee, Werbung mach ich jetzt nicht.

00:19:21.840 --> 00:19:33.140
 Ich hab jetzt was gefunden und, äh, Leute, lasst euch nicht verarschen. Wenn, äh, wenn in ein, in ein teures Gerät, sagen wir mal 500 Euro plus, ähm, ein Bluetooth-Receiver eingebaut ist,

00:19:33.140 --> 00:19:40.620
 der Scheiße macht, der, der drei Sekunden Verzögerung vom Sound hat, dann kauft das einfach nicht. Das, das geht einfach nicht. Das ist, äh,

00:19:40.620 --> 00:19:48.480
 äh, einfach, einfach nicht machen. Ähm, ja, ich bin da jetzt, ich bin da jetzt endlich happy und kann da einen, einen Punkt auf meiner

00:19:48.480 --> 00:19:53.360
 schlimmen Liste abhaken. Aber ich bin immer noch nicht überzeugt davon, dass Bluetooth gut funktioniert.

00:19:53.360 --> 00:19:58.200
 Ja, darfst du mir nachher gerne mal verraten, weil mein AV-Receiver gibt auch demnächst den Geist auf.

00:19:59.140 --> 00:20:03.980
 Kannst du mir die Marke verraten? Ja, ich kann ja mal bei der Firma anfragen und dann sponsern die uns vielleicht und dann, dann sag ich auch den Namen.

00:20:03.980 --> 00:20:13.980
 Ähm, alles klar. Ich sag nur, es ist, mit jeder Iteration ist es, es ist ungefähr 100, 150 Euro teurer geworden. Und es ist, ich bin jetzt an einem Punkt angelangt, der, der eigentlich schon total bekloppt ist.

00:20:14.040 --> 00:20:30.820
 Okay. Aber das Ding tut jetzt wirklich, äh, auch in den Edge-Cases, die mich sonst geärgert haben an anderen Geräten, tut es, was es soll oder hat eine extra Einstellung dafür. Also so der Klassiker ist, ähm, das Gerät sollte sich zu bestimmten Events ausschalten, wenn es weiß, dass es jetzt gerade nicht mehr gebraucht wird.

00:20:30.820 --> 00:20:43.260
 Aber da können interessante Edge-Cases entstehen. Also sowas wie, ich schalte es ein mit dem Fernseher über so ein ARC-Kabel. Also ich schalte den Fernseher ein und das ist mit so einem ARC-HDMI-Kabel verbunden.

00:20:45.260 --> 00:20:57.540
 Und dann geht der Receiver mit an. Jetzt wechsle ich, also und dann, wenn ich den Fernseher einfach dann wieder ausschalte, dann, äh, weiß, okay, gut, Fernsehton war gerade an, äh, geht's wieder mit aus. Das ist super, so soll das sein.

00:20:57.540 --> 00:21:02.560
 Also ist das, ich möchte mich eigentlich gar nicht drum kümmern müssen, dass das Gerät an oder aus geht mit, möchte ich gar nicht manuell machen müssen.

00:21:02.560 --> 00:21:13.420
 So. Ähm, jetzt, pass aber auf, jetzt gibt's folgenden Fall, ich wechsle jetzt während der Wiedergabe, während ich den Fernseher anhabe, auf Bluetooth-Input.

00:21:13.860 --> 00:21:14.040
 Mhm.

00:21:14.040 --> 00:21:24.040
 Dann ist ja de facto der Fernseher nicht mehr der Tongeber, sondern irgendein anderes Gerät und dann schalte ich den Fernseher aus und dann, was passiert auf den allen anderen Scheißgeräten?

00:21:24.040 --> 00:21:42.640
 Geht, geht auch mit aus, obwohl, obwohl die Audioquelle gerade von woanders kommt. Ja, es sind Edge-Cases, aber das Gerät macht sogar das jetzt richtig. Also, ähm, ich bin guter Dinge, dass ich's nicht in eineinhalb Wochen zurückschicken muss, was ich mit den anderen dann immer jeweils gemacht hab. Ja, äh, gut, das, das ist ein bisschen, äh, out of scope.

00:21:42.640 --> 00:21:54.000
 Aber vielleicht interessiert's ja irgendjemand. Vielleicht hat ja gerade jemand, ähm, auch den Fall, dass er irgendwie sowas sucht. Ähm, falls jemand genaueres wissen will zum Marco oder zum Typ, dann könnt ihr mich gerne auf Twitter anschreiben, ähm, dann verrate ich euch das.

00:21:54.820 --> 00:22:00.920
 Genau. Und falls es nicht interessiert, haben wir ja Kapitelmarken. Und falls, genau, äh, Kapitelmarken. Genau.

00:22:00.920 --> 00:22:16.840
 Gut, ähm, ich hatte ein ganz, äh, interessantes, spannendes, kleines Kundenprojekt letzte Woche. Und zwar ist das gewesen für eine Arztpraxis, die natürlich jetzt mit steigenden Corona-Zahlen aktuell sehr viele Tests am Tag hat.

00:22:16.840 --> 00:22:26.160
 Und, äh, deren Labor, mit dem die zusammenarbeiten, das bietet keine Online-Abfrage an. Das heißt, die bekommen die Ergebnisse per Fax, ja, muss man sich mal vorstellen, per Fax.

00:22:26.160 --> 00:22:37.580
 Und, äh, müssen dann die, die Patienten abtelefonieren. Und das kann bei, keine Ahnung, 20, 30 Tests am Tag oder was auch immer, äh, wenn du dann nicht gleich jeden erreichst und so, dann bist du echt viel beschäftigt.

00:22:37.580 --> 00:22:47.380
 Und das kostet sich verdammt viel Zeit. Und da war unser Auftrag, jetzt, äh, ein System zu schreiben, mit dem die Testergebnisse online abrufbar sind.

00:22:47.380 --> 00:22:56.520
 Und, äh, als das, da die Anfrage kam, gleich mal gedacht, oh, cool, klingt, äh, spannend, mal auch wieder was, was anderes. Ähm, haben aber gleich die Alarmglocken geschrillt.

00:22:56.860 --> 00:23:01.780
 Zeitenschutz, äh, möchte ich wirklich Patientendaten und Ergebnisse irgendwo zusammen speichern.

00:23:01.780 --> 00:23:10.920
 Ja, für den Fall eines Leaks, wenn dann da richtig schön, hier, Namen, Vorname, Geburtsdatum, äh, und hier war Corona positiv, am so und so fehlt und so, möchte ich natürlich nicht.

00:23:10.920 --> 00:23:18.860
 Aber trotzdem sollen die Leute das ja online abrufen können. Und, äh, unsere Lösung dafür war, dass die Zuordnung tatsächlich ausschließlich offline passiert.

00:23:19.000 --> 00:23:34.480
 Das heißt, online gespeichert wird nur entsprechend der Code und das Ergebnis dazu. Und die, äh, PDF-Erstellung, also man, es wird dann für den, für den Patienten eine Datei ausgedruckt, ähm, PDF ausgedruckt und für, äh, zum Verbleib in der Praxis eine Ausfertigung.

00:23:34.480 --> 00:23:41.600
 Und da steht dann eben drauf, was man machen muss, äh, wie man sich zu verhalten hat in der Zeit, ähm, wo man dann auch mit QR-Code, wo man das Ergebnis dann bekommt.

00:23:41.600 --> 00:23:48.040
 Und, ähm, das wird im Browser erstellt in, in der Eingabemaske, in dem Fall in, in, in WordPress als Backend für die Seite.

00:23:48.040 --> 00:23:56.760
 Und, ähm, das heißt, die Daten verlassen den Browser nie und werden nie irgendwo an den Server gesendet. Das Einzige, was erstellt wird online, ist der Code.

00:23:56.760 --> 00:24:01.140
 Und irgendwann später wird das Ergebnis zugeordnet anhand der offline gespeicherten Daten.

00:24:01.140 --> 00:24:11.160
 Und, ähm, auf der Ergebnisseite dann je nach Ergebnis, ob das jetzt ausstehend, positiv oder negativ ist, gibt es dann jeweils weiterführende Informationen zur Verhaltensweise, äh, zu Kontakten, ähm,

00:24:11.160 --> 00:24:13.440
 weiterführende Links, Telefonnummern und so weiter.

00:24:13.440 --> 00:24:24.760
 Und das war mal ganz, ganz lustig, was zu machen, wo man direkt weiß, das spart jetzt jemand einem einen Haufen Arbeit und ist vielleicht auch für die Patienten komfortabler, äh, da selber nachschauen zu können.

00:24:24.760 --> 00:24:26.800
 Das würde ich jetzt weiterverkaufen.

00:24:27.200 --> 00:24:41.120
 Ja, das wollte ich jetzt gerade nämlich noch sagen. Wenn denn jemand Arztpraxen als, äh, Kunden hat und keine Lust hat, sowas selber zu schreiben oder sich nicht zutraut, weil er vielleicht ein recht junger Entwickler, junger Entwicklerin ist, äh, oder auch einfach, ähm, das so schnell nicht hinbekommen, Auftragslage, was weiß ich.

00:24:41.380 --> 00:24:57.300
 Also, ich bin gerne gewillt, aktuell ist das eine Sonderlösung, direkt in das, äh, Custom-Theme, das wir da haben eingebaut, ähm, ich bin gerne gewillt, das als WordPress-Plugin zu verpacken, hab da auch schon ein paar Ideen für so Premium-Features mit Statistikauswertung und was weiß ich, ähm, oder auch gerne Standalone.

00:24:57.540 --> 00:25:01.300
 Wer das für einen Kunden haben möchte, einfach gerne bei mir melden. Twitter oder Twitter.

00:25:01.300 --> 00:25:09.500
 Also, das, das, das klingt doch echt nach, äh, da kriegst du jetzt gleich die Bude eingerannt, weil die, also das ist ja was, was jetzt gerade irgendwie jeder braucht, oder? Also, klingt für mich nach.

00:25:09.500 --> 00:25:22.600
 Ja, ich, also, ich, viele, äh, viele, äh, Labore bieten das, glaube ich, an. Da kriegst du schon, also, du kriegst ja auch für die, für die Corona-App, kriegst du ja auch schon beim Abstrich direkt den Code mit. Und je nachdem, wenn das dann positiv ist, dann kannst du den Code eingeben.

00:25:22.780 --> 00:25:42.440
 Ja, wenn ich mal das Fax-Papier bieten das auch schon. Also, ich bin, ich und, und auch andere, äh, Menschen in meinem persönlichen Umfeld sind schon mehrfach auch getestet worden. Und da kriegst du beim Abstrich, in der Regel, so war das bei mir immer, von der Praxis direkt auch schon einen Link mit, da kannst du dann online, äh, das abrufen. Ähm, ja, aber wie gesagt, alle, es bieten nicht alle Labore an, von daher, äh, ja.

00:25:42.440 --> 00:25:46.240
 Ja, manche, bei manchen, äh, ist ja das Fax-Papier leer ab und zu.

00:25:46.240 --> 00:25:47.640
 Ja, soll vorkommen.

00:25:48.680 --> 00:25:54.500
 Also, also, für, für Leute, die, also, falls ihr ein Fax in eurem Labor stehen habt, dann meldet euch beim Konstantin.

00:25:54.500 --> 00:25:55.200
 Genau.

00:25:55.200 --> 00:25:56.560
 Der hat da was für euch.

00:25:56.560 --> 00:26:00.580
 Und damit ist die Retro beendet und wir machen weiter.

00:26:01.580 --> 00:26:17.000
 Das ist heute Focus Visible, äh, eine Eigenschaft, die es schon relativ lange gibt in CSS, ähm, mit der ich mich immer mal beschäftigen wollte und irgendwie nicht so richtig dazu kam.

00:26:17.000 --> 00:26:24.480
 Und jetzt in den letzten Tagen, äh, hatte ich dann irgendwie nochmal einen Anlass dafür, weil ich es jetzt einfach mal ausprobieren wollte und auch konkret in einem Projekt brauche.

00:26:25.420 --> 00:26:38.420
 Ähm, und dabei geht's darum, ähm, einfach nur Focus in CSS oder, ähm, die, die Standard-Focus-Styles von Browsern sind oft von, äh, Designern und, äh, Product-Ownern, mit denen ich schon zusammengearbeitet habe, unerwünscht.

00:26:38.480 --> 00:26:48.180
 Also, worüber spreche ich da zum Beispiel bei einem Link, wenn ich da auf den draufklicke, dass er dann so einen gepünktelten Rahmen kriegt erst mal, ähm, oder ein Button, ähm, kriegt irgendwie einen bestimmten Rahmen.

00:26:48.180 --> 00:26:58.460
 Ähm, ähm, diverse Styles haben die Browser da, ähm, in petto und das ist oft, äh, ungewünscht und dann deswegen, dann kommt der Designer zum Developer und sagt, mach mal weg.

00:26:58.800 --> 00:27:04.240
 Und dann macht der sowas wie, ähm, Focus-Outline-Nun oder so, sowas Böses, was man nicht machen sollte.

00:27:04.240 --> 00:27:14.800
 Ähm, und eigentlich, äh, ist das in erster Linie deswegen, ähm, ein Problem, weil Focus, äh, egal wie man ein Element fokussiert, immer wirkt.

00:27:15.700 --> 00:27:25.520
 Also, auch wenn ich zum Beispiel mit der Tastatur fokussiere, wo vielleicht, wenn ich, wenn ich nur die Tastatur verwende, ähm, es ja ziemlich interessant ist, dass ich sehe, wo mein Fokus gerade ist.

00:27:25.520 --> 00:27:30.580
 Also generell finde ich es immer sehr, sehr, äh, interessant zu sehen, wo der Fokus gerade ist oder sehr, sehr nützlich.

00:27:30.580 --> 00:27:39.860
 Ähm, aber ich kann auch nachvollziehen, dass, äh, dass man in bestimmten Fällen, also zum Beispiel bei einem Mausklick auf bestimmten Elementen jetzt nicht unbedingt so einen gepünktelten Rahmen da haben will.

00:27:39.860 --> 00:27:43.620
 Ähm, ich finde die nicht schlimm, aber ich kann es nachvollziehen.

00:27:44.240 --> 00:27:55.160
 Ähm, und, äh, für diesen Fall gibt es jetzt Focus Visible, ähm, das nämlich erraten möchte, äh, auf welchem Wege gerade das Element fokussiert wurde.

00:27:55.160 --> 00:28:07.380
 Also, äh, zum Beispiel bei, ähm, Focus Visible wirkt zum Beispiel nicht bei einem normalen Mausklick, oder zumindest so soll das sein, ähm, sondern, äh, wenn ich nur mit der Tastatur jetzt ein Element fokussiere.

00:28:07.380 --> 00:28:14.220
 So, die, also das ist die Idee dahinter, dass, dass clever erkannt wird, auf welchem Weg ich jetzt ein Element fokussiere.

00:28:14.220 --> 00:28:19.300
 fokussiert habe und dann, äh, äh, dann eben, ähm, bestimmte Styles angezeigt werden oder eben auch nicht.

00:28:19.300 --> 00:28:24.760
 Also zum Beispiel eine, eine, ein Rahmen irgendwie um ein Input fällt oder ein Link oder keine Ahnung.

00:28:25.620 --> 00:28:38.180
 So, das funktioniert an sich eigentlich auch, äh, ich habe nämlich mal eine kleine Demo gebaut, ich, äh, ich hätte jetzt einfach nur irgendwie die, die MDN-Seite vorlesen können oder irgendwelche CSS-Tricks-Artikel, aber ich will sowas auch immer mal ausprobieren.

00:28:38.280 --> 00:28:42.060
 Und das habe ich jetzt heute gemacht, äh, den Link dazu, äh, kriegt ihr in den Shownotes.

00:28:42.060 --> 00:28:46.600
 Ähm, das hat ein paar Probleme, habe ich dann festgestellt.

00:28:47.260 --> 00:28:56.320
 Also, zunächst mal, äh, äh, fängt es damit an, dass, äh, in Firefox eine ganz andere Syntax derzeit unterstützt wird, also, äh, als der Standard eigentlich vorsieht.

00:28:56.320 --> 00:29:01.780
 Nämlich, also normalerweise, der Standard sieht vor, in den Chromium-Browsern ist das auch so, äh, Doppelpunkt Focus minus Visible.

00:29:02.280 --> 00:29:08.280
 Ähm, in, in Firefox ist es Doppelpunkt minus Mods minus Focus Ring.

00:29:08.280 --> 00:29:25.200
 Und der erste, der erste, äh, Stolperstein, über den ich dann gestolpert bin, habe gedacht, Mensch, wieso funktioniert das denn nicht, war, dass ich natürlich versucht habe, Focus Visible und, äh, Focus Ring einfach mit Komma zu trennen, die Selektoren, und dann denselben Style drauf anzuwenden.

00:29:25.200 --> 00:29:25.840
 Nee.

00:29:25.840 --> 00:29:29.860
 Dann funktioniert aber der ganze Selektor nicht, ne, wenn das Unbekanntes dabei ist.

00:29:30.140 --> 00:29:39.740
 Genau, der ganze Selektor funktioniert dann nicht. Ich hätte angenommen, der müsste funktionieren, bei manchen ist es aber, äh, bei manchen geht das, bei manchen geht das irgendwie nicht, also, bei, äh, User Select, glaube ich, hatte ich das Problem auch schon.

00:29:39.740 --> 00:29:40.520
 Genau, das hab, ja.

00:29:40.520 --> 00:29:56.140
 Ähm, also, erst mal, du musst quasi zweimal denselben, denselben Kram hinschreiben oder dir das irgendwie mit SAS irgendwie zurechtbauen, dass du, äh, da, äh, keine Ahnung, das mit Mixins oder so machst, dass, dass, dann schreibst du es nicht doppelt, aber am Ende im CSS wird, wird, wird das doppelt stehen, was du, was du dafür brauchst.

00:29:56.700 --> 00:30:14.120
 Also, du musst es einzeln schreiben, einmal Focus Visible, einmal Mods Focus Ring, ähm, und dann das, das zweite Problem, ähm, über das ich gestolpert bin, ist, dass die, die, der Algorithmus, wie versucht wird zu erkennen, ähm, was ich da gerade mache, sich auch irgendwie unterscheidet.

00:30:14.300 --> 00:30:29.580
 Ähm, weil in, ähm, ähm, also, ich hab's jetzt in Edge ausprobiert, in Edge ist es so, dass, und, äh, ja, übrigens, äh, lieber, lieber einer Hörer, der mich gefragt hat, ob ich Edge mal gesagt hab, ja, ich hab Edge gesagt, äh, in der letzten Folge, äh, ich benutze ihn tatsächlich ab und zu.

00:30:29.820 --> 00:30:38.380
 Und ich bin nicht gesponsert, äh, von Microsoft an der Stelle, aber ich find ihn tatsächlich, äh, es ist der beste Microsoft-Browser, äh, der jemals da gewesen ist.

00:30:38.380 --> 00:30:44.240
 Ich mein, es ist natürlich nicht so schwer, wenn man sich die Engine quasi klaut, äh, eine der besten Engines, aber okay.

00:30:44.720 --> 00:31:05.500
 Naja, ähm, also Edge macht das folgendermaßen, ähm, wenn ich klicke auf einen Link, passiert nix oder wird nur Fokus angewendet, nicht Fokus-Visible, ähm, wenn ich auf einen Button klicke, ebenso, wenn ich auf ein Input-Feld klicke, dann habe ich trotzdem den Fokus-Visible-Style.

00:31:05.500 --> 00:31:15.200
 Und ich weiß nicht so genau, warum. Wenn ich jetzt mit der Tastatur komme, also per Tabular-Taste, dann ist bei allen dreien, ähm, Fokus-Visible am Start.

00:31:15.200 --> 00:31:22.820
 Ich hab da so einen schönen Regenbogen, ähm, drumherum gepackt. Ich weiß nicht, ob ich, ich muss, ich muss, glaube ich, dem Konstantin mal schicken, dass der mal mitgucken kann, äh, die Demo.

00:31:22.820 --> 00:31:26.880
 Ja, ich guck gerade die, die, äh, MDN-Demo an. Die hat nur so einen orangenen.

00:31:26.880 --> 00:31:28.720
 Ja, die MDN-Demo, die kannst du vergessen.

00:31:28.720 --> 00:31:29.960
 Die funktioniert auch nicht so wirklich.

00:31:29.960 --> 00:31:35.380
 Hier hast du den, hier hast du den richtigen Link. So, ja, das ist der, genau, es ist eben, es ist eben sehr, sehr merkwürdiges Verhalten.

00:31:35.500 --> 00:31:41.220
 So, also wie gesagt, Edge macht das so. In Firefox haben wir wieder ein anderes Verhalten.

00:31:41.220 --> 00:32:03.180
 In Firefox ist es so, ähm, wenn ich, Moment, ich muss jetzt nochmal kurz nachvollziehen, ähm, wenn ich jetzt initial draufklicke, also wieder kein, kein Fokus, äh, Visible, also auf den Link, ähm, kein Fokus-Visible, ähm, bei dem Input-Feld auch nicht und bei dem Button auch nicht, also bei nix wirkt Fokus-Visible, dann tappe ich rein, dann habe ich die Fokus-Visible-Styles.

00:32:03.180 --> 00:32:12.800
 Das würde ich jetzt auch so erwarten. Allerdings, wenn ich einmal getappt habe und da nochmal draufklicke, dann wirken auch die Fokus-Visible-Styles in Firefox.

00:32:12.800 --> 00:32:25.220
 Das heißt, ich kriege die dann nicht mehr weg. Wenn das einmal, wenn einmal dieser Modus ausgelöst ist, ähm, dann sagt der Firefox so, du bist also mit Tastatur unterwegs, ähm, deswegen zeige ich dir jetzt Fokus-Visible immer an.

00:32:25.220 --> 00:32:37.900
 Kann man jetzt drüber streiten? Ich weiß nicht genau, was im Standard steht, wer sich jetzt da an den Standard hält, vielleicht ist das auch irgendwie sowas, was nicht so genau definiert ist mal wieder, ähm, aber die Browser versuchen da besonders clever zu sein, um irgendwelche Sachen irgendwie rauszufinden, wie, wie das Verhalten ist.

00:32:38.440 --> 00:32:50.120
 Ähm, wenn man da auf den, äh, CSS-Tricks-Artikel dazu geht, ähm, da ist so eine, so eine kleine Tabelle drin, ähm, in welcher Situation Fokus-Visible sichtbar sein sollte.

00:32:50.380 --> 00:32:54.940
 Allerdings, ähm, ist das, ähm, wie gesagt, die Browser unterscheiden sich da jetzt schon.

00:32:54.940 --> 00:33:01.220
 Also, ähm, zum Beispiel soll Fokus-Visible auch per Setting, per Browser-Setting, ähm, angeschaltet werden können.

00:33:01.220 --> 00:33:06.140
 Das heißt, wenn ich jetzt sage, ich möchte den Browser-Fokus, ich möchte den Fokus immer sehen, kann ich das, äh, weiß ich nicht.

00:33:06.140 --> 00:33:09.400
 Ich habe noch kein Browser-Setting gesehen in der Richtung, aber kann sein, dass es das gibt.

00:33:09.400 --> 00:33:14.420
 Ähm, es soll auch sichtbar sein, ähm, generell für Inputs.

00:33:14.420 --> 00:33:19.860
 Das würde jetzt das, äh, Verhalten von, äh, Edge, beziehungsweise Chrome in dem Fall unterstützen.

00:33:20.180 --> 00:33:21.920
 Ähm, in Firefox-Systemen nicht so.

00:33:21.920 --> 00:33:25.920
 Ähm, Keyboard-Navigation, ja, äh, kann ich bestätigen.

00:33:25.920 --> 00:33:27.840
 Ähm, das funktioniert tatsächlich auch.

00:33:27.840 --> 00:33:31.800
 Ähm, wenn man mit einem, mit einer Maus kommt, soll es nicht funktionieren.

00:33:31.800 --> 00:33:36.320
 Da würde jetzt der Edge widersprechen bei seinem Input, was ich irgendwie wirklich merkwürdig finde.

00:33:36.320 --> 00:33:37.100
 Hast du es mal ausprobiert?

00:33:37.100 --> 00:33:37.920
 Ist es bei dir auch so?

00:33:37.920 --> 00:33:38.040
 Ja, ja.

00:33:38.040 --> 00:33:40.760
 Es ist wirklich merkwürdig.

00:33:40.760 --> 00:33:44.620
 Ja, also ich finde da vorhin, ich, der Konstantin meinte so, lass uns mal endlich anfangen.

00:33:44.620 --> 00:33:49.980
 Ich so, nein, ich frage nur 15 Minuten, um meine Demo fertig zu bauen, äh, weil ich, weil es einfach so komisch

00:33:49.980 --> 00:33:51.160
 äh, reagiert hat.

00:33:51.160 --> 00:33:53.180
 Ähm, so, ja, genau.

00:33:53.180 --> 00:33:58.540
 Und dann gibt es noch natürlich den Fall, dass ein Skript, ähm, Fokus, äh, macht.

00:33:58.540 --> 00:34:01.960
 Und dann soll auch Fokus-Visible, äh, angesprochen werden.

00:34:01.960 --> 00:34:05.600
 Ähm, und, äh, aber Moment, warte mal.

00:34:05.600 --> 00:34:08.120
 Das habe ich jetzt, äh, bevor ich jetzt was Falsches sage,

00:34:08.220 --> 00:34:12.680
 A script causes Fokus to move from Fokus-Visible to another element, dann soll es kommen.

00:34:12.680 --> 00:34:16.320
 Ähm, wenn es von einem nicht-Fokus-Visible-Element kommt, dann nicht.

00:34:17.500 --> 00:34:21.700
 Also, und selbst die Demo in dem CSS-Tricks-Artikel, den ich, äh, auch in, den wir auch in die

00:34:21.700 --> 00:34:28.780
 Shownotes packen, ähm, ist da nicht so eindeutig und funktioniert nicht überall so.

00:34:28.900 --> 00:34:31.800
 Also, da ist zum Beispiel der Firefox-Fall, äh, glaube ich, gar nicht bedacht.

00:34:31.800 --> 00:34:34.240
 Also, in meinem Firefox funktioniert das eingebettet zumindest nicht.

00:34:34.240 --> 00:34:37.460
 Ich habe aber auch schon festgestellt, dass je nachdem, ob ich mich im iFrame befinde oder

00:34:37.460 --> 00:34:39.880
 nicht, ähm, das Verhalten unterschiedlich sein kann.

00:34:39.980 --> 00:34:41.660
 Also, das ganze Ding ist noch ziemlich buggy.

00:34:41.660 --> 00:34:46.760
 Ähm, es ist trotzdem meine Property der Woche, weil, äh, ich finde, dass es, das ist ein

00:34:46.760 --> 00:34:53.140
 verdammt wichtiger Use-Case, ähm, da, daran, dass, ähm, dass es in Firefox noch, äh, mit,

00:34:53.140 --> 00:34:57.600
 mit Mods-Prefix und einer anderen Eigenschaft, äh, ist, sieht man, das Ding ist noch im Fluss.

00:34:57.600 --> 00:35:02.060
 Ähm, ich kann auch noch mal kurz was, äh, zu der, zur, zur Browser-Unterstützung, ähm,

00:35:02.060 --> 00:35:05.820
 geben. Also, es sind tatsächlich derzeit nur die, äh, Chromium-basierten Browser und

00:35:05.820 --> 00:35:09.960
 Firefox, die das unterstützen und Firefox halt mit dieser Spezial-Syntax, äh,

00:35:09.980 --> 00:35:17.440
 ähm, bei Opera ist es hinter einem Flag, ähm, noch und noch dichter und, äh, ansonsten

00:35:17.440 --> 00:35:21.660
 also irgendwie Safari oder so, äh, kann das auch noch nicht. Ich sehe KaiOS, äh, kann

00:35:21.660 --> 00:35:26.140
 es auch, aber ich glaube, das basiert auf Firefox. Es hat nämlich auch diese Focus-Ring-Syntax.

00:35:26.140 --> 00:35:31.600
 Also, das ist noch, ähm, relativ neu, äh, gerade im Fluss, aber ich finde, äh, ist eine

00:35:31.600 --> 00:35:37.280
 echt coole Sache und sehr wichtig. Ähm, und da jetzt noch ein ganz kleiner Ausflug, äh, was

00:35:37.280 --> 00:35:40.720
 mir dabei aufgefallen ist, als ich bei Can I Use nachgeschaut habe, wie die Unterstützung

00:35:40.720 --> 00:35:44.100
 ist, ist mir was aufgefallen, was Neues, was ich auch irgendwie über Twitter schon so halb

00:35:44.100 --> 00:35:49.100
 mitgelesen hatte, aber jetzt weiß ich, was das wirklich bedeutet. Ähm, bei Can I Use, äh,

00:35:49.100 --> 00:35:54.160
 ist jetzt Browser-Stack mit angebunden. Ähm, da ist nämlich jetzt, äh, unter den, unter

00:35:54.160 --> 00:35:58.260
 den jeweiligen Erklärungen und Eigenschaften, da wo die Notes und die Known-Issues und sowas

00:35:58.260 --> 00:36:02.480
 stehen und die Resources, gibt's jetzt einen neuen Reiter, Reiter, der heißt Test on Real

00:36:02.480 --> 00:36:08.980
 Browser. Da kann ich einen Browser auswählen, also zum Beispiel einen IE6. Und dann habe ich

00:36:08.980 --> 00:36:12.560
 da einen Knopf, Launch this Browser. Also, die werden jetzt unterstützt vom Browser-Stack

00:36:12.560 --> 00:36:16.960
 und dann kann ich tatsächlich, ich hab das vorhin mal ausprobiert, ähm, einen IE6 aufmachen,

00:36:17.120 --> 00:36:21.920
 äh, also in meinem Firefox. Ähm, warte mal, hier ist Starting Real Explorer. Ich mach das

00:36:21.920 --> 00:36:27.940
 grad mal live. Ähm, ah, die sagen jetzt schon, äh, ich, ich muss jetzt schon irgendwie was

00:36:27.940 --> 00:36:31.520
 kaufen, damit ich's benutzen kann, oder? Darf ich, darf ich noch? Ja, nee, ich glaub, ich

00:36:31.520 --> 00:36:34.380
 glaub, ich muss jetzt schon was kaufen. Aber das fand ich echt extrem beeindruckend, dass

00:36:34.380 --> 00:36:39.560
 ich vorhin einfach mal im Browser ein IE6 öffnen konnte. Nicht, dass man den noch irgendwie

00:36:39.560 --> 00:36:46.980
 benutzen sollte, aber ... Ja, wie, du supportest den nicht mehr? Äh, nee, nur 5.5 und 7, aber

00:36:46.980 --> 00:36:49.580
 6 ist rausgefallen aus dem Support, weil da haben wir nicht mehr genug.

00:36:49.580 --> 00:36:56.160
 Also, äh, um, um ehrlich zu sein, ich bin, äh, bei mir auf der Arbeit in einer relativ

00:36:56.160 --> 00:37:02.620
 komfortablen Situation, ähm, da wir Tools für interne, äh, internal Use, äh, hauptsächlich

00:37:02.620 --> 00:37:09.160
 machen. Ähm, die, die Browser stehen ja unter, unter, so ein bisschen unter der, der Herrschaft

00:37:09.160 --> 00:37:14.800
 unserer, unserer IT, ähm, und, ähm, wir haben zum Beispiel auch schon kein IE11 mehr bei uns

00:37:14.800 --> 00:37:19.260
 drin, sondern, äh, und, äh, Edge, glaube ich, haben wir mittlerweile auch nur noch den

00:37:19.260 --> 00:37:24.300
 Edge Chromium. Also, es ist, ähm, wir können, wir haben ein relativ kontrolliertes Umfeld

00:37:24.300 --> 00:37:28.400
 und unsere Browser werden auch relativ regelmäßig geupdatet. Das ist, äh, ich weiß, in vielen

00:37:28.400 --> 00:37:32.060
 anderen großen Firmen ist das nicht so. Da, da, ich weiß nicht, wo man, früher hieß es

00:37:32.060 --> 00:37:36.860
 immer, ja, die hängen noch auf dem IE6, als irgendwie IE9 schon, äh, da war. Ähm, ich weiß

00:37:36.860 --> 00:37:40.440
 nicht, was jetzt der alte Browser ist, auf dem die Firmen noch hängen oder ob das immer

00:37:40.440 --> 00:37:44.780
 noch so ist, aber, ähm, wir sind relativ. Schreibt's in die Kommentare. Aktuell. Schreibt's in die

00:37:44.780 --> 00:37:49.740
 Kommentare und drückt die Glocke bei Twitter. Wir brauchen noch so ein Ding, Ding, jedes Mal,

00:37:49.740 --> 00:37:54.520
 wenn wir drückt die Glocke sagen. Ja, äh, wolltest du dazu noch was sagen? Äh, ich hatte

00:37:54.520 --> 00:38:00.500
 tatsächlich, letztens hab ich an der Seite gebastelt, ähm, also die, die nicht von mir war, sondern

00:38:00.500 --> 00:38:03.900
 wo ich für jemanden was eingebaut hab und die richtete sich vom Zielpublikum sogar

00:38:03.900 --> 00:38:11.360
 an Menschen mit potenziellen, äh, Sehbeeinträchtigungen und da war auch alles an visuellem Feedback

00:38:11.360 --> 00:38:18.120
 bei Fokus weg. Ja, super. Und, äh, ja, ganz großartig. Das ist ja sogar, das ist, das

00:38:18.120 --> 00:38:22.140
 finde ja sogar ich nützlich, wenn ich den Fokus sehen kann. Ich bin ja auch so jemand, der, der

00:38:22.140 --> 00:38:27.500
 total viel mit, äh, Keyboard navigiert tatsächlich und das stört mich auch kolossal. Also ich hatte

00:38:27.500 --> 00:38:31.820
 da was an dem Formular gebaut und hab dann selber gedacht, es funktioniert nicht, was ich

00:38:31.820 --> 00:38:35.740
 da mache, weil ich dann zu einem Selectfeld gesprungen bin und das hat einfach halt keinen

00:38:35.740 --> 00:38:40.380
 Fokus oder sowas, äh, visuell erhalten. Und ich dachte, was, warum, warum funktioniert das denn?

00:38:40.380 --> 00:38:44.460
 Was hab, was hab ich denn kaputt gemacht? Äh, und dann hab ich festgestellt, durch Pfeiltaste

00:38:44.460 --> 00:38:47.920
 hoch, runter, dass sich da was verändert im Selectfeld. Also ich war drin, ich hab's nur nicht

00:38:47.920 --> 00:38:52.520
 gesehen. Oh, dazu hab ich auch noch eine Perle. Ähm, was, was ich heute gesehen hab auf, auf einer

00:38:52.520 --> 00:39:00.760
 Seite. Ähm, und zwar, also auch, äh, fehlender Fokus, großes, großes Suchfeld. Ähm, also so, so, so, so, so, so ein

00:39:00.760 --> 00:39:05.840
 richtig riesiges Suchfeld mitten auf der Seite. Ähm, und dann fiel mir auf, äh, beim Fokus

00:39:05.840 --> 00:39:10.840
 durchtappen, dass der Cursor die ganze Zeit blinkt in dem Suchfeld. Und ich dachte so, Moment mal, ich

00:39:10.840 --> 00:39:14.420
 seh doch jetzt hier gerade, dass ich auf irgendeinem Link bin, das Suchfeld kann gar nicht aktiviert

00:39:14.420 --> 00:39:18.840
 sein. Dann guck ich mir den Style davon an und seh, naja, da ist halt ein animierter, blinkender

00:39:18.840 --> 00:39:24.640
 Cursor rein, rein animiert worden mit CSS. Nein. Und doch, und dann dachte ich mir, hm, aber das ist

00:39:24.640 --> 00:39:27.720
 ja Quatsch, weil wenn ich jetzt was eintippt, dann geht das ja gar nicht da rein. Und dann hab ich

00:39:27.720 --> 00:39:33.460
 getippt und es ging da rein. Ach. Das heißt, die fangen jede Tastatureingabe auf der Seite

00:39:33.460 --> 00:39:39.460
 ab. Brutal. Und der geht dann da rein. Das bedeutet natürlich, dass du damit alle möglichen

00:39:39.460 --> 00:39:43.080
 Screenreader-Shortcuts, die du potenziell hast, da gibt es nämlich sowas wie Haar für Headings

00:39:43.080 --> 00:39:48.880
 und sowas, das killst du damit komplett. Also alle, jede assistive Technologie, die auf Shortcuts

00:39:48.880 --> 00:39:56.820
 setzt, die irgendwie Buchstaben hat, vergiss es, sofort tot, kaputt. Ja, aber ich kann nachvollziehen,

00:39:56.820 --> 00:40:01.980
 warum mal jemand sich gedacht hat, dass das eine gute Idee ist. Man hat halt nur den einen Nutzer

00:40:01.980 --> 00:40:06.200
 im Sinn gehabt, der so, was man glaubt, wie der halt funktioniert. Und dass der halt

00:40:06.200 --> 00:40:10.420
 es möglichst einfach hat, da einzutippen, also nicht mit Autofokus, wir setzen den Fokus

00:40:10.420 --> 00:40:14.760
 da rein, sondern egal, was du tippst, ich kann schon verstehen, ich kann nachvollziehen.

00:40:14.760 --> 00:40:20.780
 Wenn man nur UX betrachtet, ganz ohne Accessibility und sonst irgendwas, könnte das, wenn man genau

00:40:20.780 --> 00:40:25.240
 weiß, wie der Nutzer ist, könnte das vielleicht sogar eine gute Idee sein. Aber so funktioniert

00:40:25.240 --> 00:40:30.600
 die Welt leider nicht. War das nicht, zumindest früher mal, auch bei Amazon? Wenn du da auf

00:40:30.600 --> 00:40:34.420
 die Seite gekommen bist, da konntest du, glaube ich, da war direkt standardmäßig der Fokus

00:40:34.420 --> 00:40:38.980
 im Suchfeld und du konntest tippen, soweit ich weiß. Ja, das ist ja Autofokus, aber das

00:40:38.980 --> 00:40:43.160
 meine ich damit nicht. Ja, ich weiß schon, was du meinst. Also egal, wo du hingekickt hast,

00:40:43.160 --> 00:40:47.940
 selbst wenn wirklich was anderes fokussiert war, war trotzdem hier Blinky Blinky und du konntest

00:40:47.940 --> 00:40:52.720
 tippen. Nein, nicht bei Amazon. Das weiß ich jetzt nicht, ob das so war. Ich meine nur, ich

00:40:52.720 --> 00:40:57.260
 habe verstanden, was du gerade erzählt hast. Ja, es ist wirklich, und der Cursor ist ja gar nicht

00:40:57.260 --> 00:41:00.480
 echt, der da blinkt. Der ist mit CSS da reingebaut und der blinkt einfach immer.

00:41:00.480 --> 00:41:05.820
 Also außer, wenn man was schreibt, dann kommt tatsächlich der echte Cursor und rutscht

00:41:05.820 --> 00:41:10.720
 weiter, weil dann der Fokus mit Gewalt natürlich in dieses Feld gezwängt wird. Also ich weiß,

00:41:10.720 --> 00:41:13.700
 dass der Fokus nicht immer da ist, aber in dem Augenblick, wo ich tippe, wird er in dieses

00:41:13.700 --> 00:41:17.260
 Feld einfach reingesetzt. Also jeder Keystroke wird abgefangen. Das ist schon crazy. Das habe

00:41:17.260 --> 00:41:23.460
 ich vorher so noch nie gesehen. Ja, damit können wir die Property abschließen. Abschließen? Wir

00:41:23.460 --> 00:41:28.620
 brauchen noch so ein Abschließgeräusch. Nein, wir haben ja ein, wir haben jetzt ein, das nächste

00:41:28.620 --> 00:41:32.060
 Startetgeräusch, weil wir gehen immer nur nach vorne, wir gehen nicht zurück. Richtig. Weil wo wir

00:41:32.060 --> 00:41:43.500
 sind, ist vorne. Sie sind hochstwahrscheinlich neugierig, wer ihnen gerade schreibt. Es scheint mir, dass ich

00:41:43.500 --> 00:41:50.040
 auch überrascht war, eine solche Nachricht zu lesen. Ich habe keine Lust, sie in einen unangenehmen Zustand

00:41:50.040 --> 00:41:55.680
 zu versetzen. Ich schlage vor, als Erwachsene zu kommunizieren und auch ein mögliches Treffen zu

00:41:55.680 --> 00:42:02.080
 besprechen. Ich hoffe, du hast Freizeit davor. Das Leben hat sich so entwickelt, dass ich immer noch

00:42:02.080 --> 00:42:08.100
 nicht heiraten konnte. Ich begann relativ spart zu denken, dass es Zeit war, einen Ehemann zu suchen.

00:42:08.100 --> 00:42:14.520
 Früher glaubte ich, dass der Mann meiner Traume mich in dieser Welt finden wurde. Mit der Zeit wurde mir

00:42:14.520 --> 00:42:20.460
 klar, dass das Leben alleine weitergehen kann. Erst vor einer Woche habe ich beschlossen, dass ich mein

00:42:20.460 --> 00:42:26.360
 Schicksal selbst entscheiden muss. Ich fand eine ausgezeichnete Plattform vor die Kommunikation ohne

00:42:26.360 --> 00:42:33.240
 finanzielle Kosten. Natürlich ist dieses Format der Datierung vor mich neu, aber ich finde es interessant.

00:42:33.240 --> 00:42:39.360
 Die Menschen nutzen die Gelegenheit, immer weniger auf die Straße zu gehen. Das Zeitalter der

00:42:39.360 --> 00:42:46.180
 Informationstechnologie dominiert zunehmend. Es wird vor mich unpraktisch sein, die Kommunikation

00:42:46.180 --> 00:42:52.080
 fortzusetzen und Briefe auszutauschen. Das Tempo des Lebens zwingt die Menschen, vorsichtiger mit

00:42:52.080 --> 00:42:57.420
 der Zeit umzugehen. Dies ist der Ort, an dem sie mich finden konnten und wir werden mit der

00:42:57.420 --> 00:43:03.060
 Kommunikation beginnen. Nach einer einfachen Registrierung finden sie mein Profil. Verwenden

00:43:03.060 --> 00:43:10.980
 sie dazu meinen Spitznamen helena354. Ich warte auf sie auf der Website. Ich hoffe, dass faszinierende

00:43:10.980 --> 00:43:16.060
 Kommunikation auf uns wartet. Mit freundlichen Grußen, Helena.

00:43:16.060 --> 00:43:20.420
 Zu Risiken und Nebenwirkungen lesen Sie die Dokumentation oder fragen Sie Ihren Systemadministrator.

00:43:23.200 --> 00:43:24.660
 Bist du auch ein bisschen erregt?

00:43:24.660 --> 00:43:27.480
 Sehr, sehr.

00:43:27.480 --> 00:43:32.400
 Man merkt schon, das ist jetzt fast zwei Minuten lang oder so der Spam-Spot. Wer liest sich,

00:43:32.400 --> 00:43:36.280
 also es ist ja schon anstrengend dazu zu hören, obwohl ich es selber aufgenommen habe, aber

00:43:36.280 --> 00:43:40.240
 wer liest sich dann so lange eine Spam-Mail durch und denkt sich dann, oh ja, das klingt

00:43:40.240 --> 00:43:41.880
 vertrauenswürdig, da melde ich mich gleich mal an.

00:43:41.880 --> 00:43:45.280
 Ich habe sie durchgelesen und ich habe mir gedacht, oh, das ist eine super Mail.

00:43:45.280 --> 00:43:50.060
 Wir gehen, glaube ich, an Spam-Mails auch anders ran. Also hier der obligatorische Hinweis

00:43:50.060 --> 00:43:57.320
 an unsere Neuzuhörerinnen und Zuhörer. Spam-Spots sind Spam-Mails, die wir tatsächlich im

00:43:57.320 --> 00:44:03.160
 Original-Wortlaut verwursten, inklusive fehlender Umlaute, wie diesmal der Fall. Und die verwursten

00:44:03.160 --> 00:44:08.600
 wir dann zu Spam-Spots. Und diesmal muss ich dazu sagen, die Hintergrundmusik, mir gehen

00:44:08.600 --> 00:44:12.840
 so langsam die Public-Domain-Musikstücke aus. Und dann habe ich, das poste ich auch in

00:44:12.840 --> 00:44:19.300
 die Shownotes, beim Internet-Archive gefunden, dass es da auch Musikarchive gibt.

00:44:19.920 --> 00:44:26.500
 Und diesmal muss ich, darf ich, kann ich, soll ich anbringen, dass es sich um eine

00:44:26.500 --> 00:44:34.940
 CC bei NC, also Creative Commons, mit Attribution und nicht-konventioneller Nutzung nach Version

00:44:34.940 --> 00:44:41.480
 2.0 handelt. Und muss auch noch kurz vorlesen, der Titel ist Take Me Now. Der Artist Nick Chapman

00:44:41.480 --> 00:44:48.940
 und vom Album Waka Chika Waka Chika Porn Music for the Masters Volume 1. Und ich glaube,

00:44:48.940 --> 00:44:54.620
 ich werde da in Zukunft öfter drauf zugreifen. Interessant, was es da so alles gibt.

00:44:54.620 --> 00:44:56.300
 Ich fand's großartig.

00:44:56.300 --> 00:45:00.520
 So, bist du imstande, weiterzumachen? Oder bist du zu erregt?

00:45:00.900 --> 00:45:03.480
 Ja, ich bin, also...

00:45:03.480 --> 00:45:04.440
 Wir machen weiter.

00:45:04.440 --> 00:45:08.480
 Hier ist WWS IV mit dem Tagesthema.

00:45:14.480 --> 00:45:17.900
 Das nüchterne Intro jetzt, das hat mich ein bisschen wieder abgekühlt.

00:45:17.900 --> 00:45:21.200
 Das hat sich wieder runtergebracht, sehr gut. Ich hab ja eingangs gesagt, wir füllen heute

00:45:21.200 --> 00:45:25.420
 eine Umfrage aus. Das war kein Spaß. Wir füllen heute eine Umfrage aus.

00:45:25.420 --> 00:45:31.980
 Boris, du hattest die Idee. State of CSS ist eine Umfrage. Die hatte ich letztens in meiner,

00:45:31.980 --> 00:45:36.120
 auch in meiner Twitter-Timeline. Und hab sie dann irgendwie kurz angeklickt und dann doch

00:45:36.120 --> 00:45:39.140
 wieder verworfen, weil man sich anmelden musste. Und da hatte ich irgendwie keine Lust drauf.

00:45:39.740 --> 00:45:42.520
 Und dann hast du vorgeschlagen, dass wir das einfach mal zum Thema machen.

00:45:42.520 --> 00:45:46.600
 Genau. Das ist ein sehr, sehr billiges Thema. Da muss man nicht viel vorbereiten.

00:45:46.600 --> 00:45:51.920
 Wir sind faule Säcke. Außerdem hatten wir jetzt sehr arbeitsintensive Themen. Jetzt machen

00:45:51.920 --> 00:45:57.780
 wir mal was anderes. Ich glaube, es wird trotzdem spannend, weil wir da dann auch über Sachen

00:45:57.780 --> 00:46:02.000
 reden können, ob wir die kennen oder nicht. Erzähl doch du mal kurz, was das denn überhaupt

00:46:02.000 --> 00:46:02.260
 ist.

00:46:02.260 --> 00:46:09.260
 Ja, ganz kurz. Es geht um eine Umfrage, die heißt, ich sag's nochmal, State of CSS 2020.

00:46:09.260 --> 00:46:12.860
 Die gab's letztes Jahr schon mal. Ich weiß nicht, ob es die davor schon mal gab.

00:46:12.860 --> 00:46:15.560
 Es gab davor State of JS.

00:46:15.560 --> 00:46:17.060
 Ja, das kenne ich auch.

00:46:17.060 --> 00:46:19.940
 Die gab's, glaube ich, seit 2017. Das sind auch die gleichen Macher.

00:46:19.940 --> 00:46:24.460
 Da wird so ein bisschen erfasst. Also, ich hab sie tatsächlich, darf ich das sagen? Ich

00:46:24.460 --> 00:46:31.960
 hab auch schon mal reingeguckt. Da wird so ein bisschen abgefragt, wer sind denn so, also

00:46:31.960 --> 00:46:38.280
 so ein paar demografische Sachen. Wer, wie alt, Geschlecht und so weiter sind denn CSS-Developer?

00:46:38.280 --> 00:46:42.300
 Und dann auch so ein bisschen, welche Features sind denn wie bekannt? Hat man damit schon

00:46:42.300 --> 00:46:45.960
 mal was gemacht? Kennt man das? Kennt man das nicht? So in diese Richtung geht's. Und

00:46:45.960 --> 00:46:49.360
 dann wird am Ende, ich weiß nicht genau, wie lange, wie lange jetzt noch geht? Steht

00:46:49.360 --> 00:46:50.100
 das da dabei.

00:46:50.100 --> 00:46:54.060
 Ich sehe es jetzt gerade auf den ersten Blick nicht.

00:46:54.060 --> 00:46:56.840
 Irgendwann, wenn die genug Daten haben, nehme ich mal an,

00:46:56.840 --> 00:46:58.500
 dann werten die das aus und dann

00:46:58.500 --> 00:47:01.000
 zeigen sie nochmal irgendwie, was ist denn

00:47:01.000 --> 00:47:03.220
 der State of CSS 2020.

00:47:03.220 --> 00:47:04.960
 Und ich finde es irgendwie eine ganz

00:47:04.960 --> 00:47:06.860
 interessante Sache. Ich finde es immer geil, wenn da

00:47:06.860 --> 00:47:08.600
 möglichst viele Leute mitmachen,

00:47:08.600 --> 00:47:10.880
 weil ich auch,

00:47:10.880 --> 00:47:13.060
 ich kann ja immer nur

00:47:13.060 --> 00:47:14.820
 so das überblicken an der

00:47:14.820 --> 00:47:16.760
 CSS-Branche, wenn ich das mal so nennen kann,

00:47:16.760 --> 00:47:17.980
 oder irgendwie der CSS-Szene.

00:47:18.480 --> 00:47:20.700
 Die Leute, die ich kenne oder denen ich auf Twitter folge,

00:47:20.700 --> 00:47:22.120
 was man irgendwie öffentlich so mitkriegt.

00:47:22.120 --> 00:47:24.340
 Aber ich finde es total interessant,

00:47:24.340 --> 00:47:26.680
 je mehr Leute mitmachen, umso besser,

00:47:26.680 --> 00:47:28.700
 dass man irgendwie so mal einen Überblick kriegt. Ich finde es einfach

00:47:28.700 --> 00:47:30.740
 sehr, sehr spannend. Und das zeigt dann auch so,

00:47:30.740 --> 00:47:32.820
 welche Features sind denn eigentlich noch unbekannt,

00:47:32.820 --> 00:47:34.580
 die eigentlich total geil oder

00:47:34.580 --> 00:47:36.680
 total nützlich sind. Also man lernt daraus auch

00:47:36.680 --> 00:47:37.840
 was, wenn man das macht, weil

00:47:37.840 --> 00:47:40.500
 es ist vielleicht dann auch was dabei, was man noch nicht kannte.

00:47:40.500 --> 00:47:42.680
 Man muss dazu sagen, die Ergebnisse werden auch wirklich öffentlich

00:47:42.680 --> 00:47:44.460
 dann auch grafisch dargestellt.

00:47:44.460 --> 00:47:46.620
 Dementsprechend, ich weiß gar nicht,

00:47:47.000 --> 00:47:48.220
 wer so genau dahinter steckt,

00:47:48.220 --> 00:47:50.720
 das ist keine Firma, die dahinter steckt,

00:47:50.720 --> 00:47:52.180
 wenn ich das richtig weiß. Das sind einfach

00:47:52.180 --> 00:47:54.160
 eine Handvoll Entwickler, die diese

00:47:54.160 --> 00:47:56.620
 State-of-JS-Fragebögen

00:47:56.620 --> 00:47:58.100
 ursprünglich ins Leben gerufen haben.

00:47:58.100 --> 00:48:00.300
 Und das Ganze jetzt eben auch auf CSS machen.

00:48:00.300 --> 00:48:02.220
 Also das ist einfach wirklich nur

00:48:02.220 --> 00:48:03.960
 reines Interesse von Entwicklern.

00:48:03.960 --> 00:48:04.940
 Ich glaube, da steht keinerlei

00:48:04.940 --> 00:48:06.760
 finanzielles Interesse in irgendeiner Form dahinter.

00:48:08.860 --> 00:48:13.080
 Ja, warte mal, da stehen jetzt hier zwei Entwickler, glaube ich.

00:48:13.080 --> 00:48:17.820
 Ist made by Raphael Benitz und Sacha Greif.

00:48:17.820 --> 00:48:20.680
 Also zwei Leute, ja, keine Ahnung.

00:48:20.680 --> 00:48:23.120
 Und selbst wenn, ich finde es eine gute Sache.

00:48:23.120 --> 00:48:26.520
 Ist auch verfügbar in Englisch, Deutsch, Spanisch, Französisch,

00:48:26.580 --> 00:48:27.300
 Kindie, was auch immer,

00:48:27.300 --> 00:48:30.100
 in vielen verschiedenen Sprachen.

00:48:30.100 --> 00:48:32.920
 Genau, die Ergebnisse vom letzten Jahr.

00:48:32.920 --> 00:48:35.460
 Und wer möchte, der kann doch einfach mal mitmachen,

00:48:35.460 --> 00:48:36.540
 auch während wir das hier machen.

00:48:36.540 --> 00:48:37.820
 Genau, mach doch mal mit.

00:48:37.820 --> 00:48:39.640
 Stateofcss.com

00:48:39.640 --> 00:48:43.580
 Genau, und die Ergebnisse vom letzten Jahr,

00:48:43.580 --> 00:48:46.100
 die sind auch online, kann man sich noch angucken.

00:48:46.100 --> 00:48:47.880
 Und die sind auch irgendwie schon interessant.

00:48:47.880 --> 00:48:49.640
 Es ist wirklich auch grafisch eine hübsche Seite.

00:48:49.640 --> 00:48:52.020
 Also man sieht schon, dass die Leute sich auch mit CSS beschäftigen,

00:48:52.020 --> 00:48:52.720
 die das gemacht haben.

00:48:52.720 --> 00:48:53.460
 Das ist schon irgendwie schick.

00:48:53.460 --> 00:48:58.240
 Ja, schade ist, dass das Logo als Grafik drin ist.

00:48:58.240 --> 00:49:00.500
 Das wäre natürlich schick gewesen,

00:49:00.500 --> 00:49:03.100
 wenn man das irgendwie mit CSS Shapes oder so

00:49:03.100 --> 00:49:06.160
 schon direkt als CSS umgesetzt hätte.

00:49:06.160 --> 00:49:08.120
 Du, das ist als CSS umgesetzt.

00:49:08.120 --> 00:49:09.540
 Also wenn ich das ankläge rechts gehe,

00:49:09.540 --> 00:49:11.740
 Grafik, Stateofcss2020png.

00:49:11.740 --> 00:49:14.180
 Bei mir sind das Diffs.

00:49:14.180 --> 00:49:16.800
 Das ist daran, dass ich Firefox bin.

00:49:16.800 --> 00:49:19.000
 Diff Class, Letter C zum Beispiel habe ich hier.

00:49:19.000 --> 00:49:23.000
 Und dann Class Tilde, Tilde 2, Tilde 3.

00:49:23.000 --> 00:49:25.020
 Das sind diese komischen Waves da rechts.

00:49:25.020 --> 00:49:26.880
 Das ist tatsächlich mit CSS gebaut bei mir.

00:49:26.880 --> 00:49:28.400
 Also ich habe sie auch in Chrome als Grafik.

00:49:28.400 --> 00:49:31.280
 Direkt auf der Startseite.

00:49:31.280 --> 00:49:31.820
 Seltsam.

00:49:31.820 --> 00:49:32.620
 Ja, keine Ahnung.

00:49:32.620 --> 00:49:33.760
 Gut, also wir machen mal.

00:49:33.760 --> 00:49:34.300
 Wir fangen mal an.

00:49:34.300 --> 00:49:36.360
 Wir werden dann natürlich ...

00:49:36.360 --> 00:49:37.620
 In Firefox haben sie es durchgezogen,

00:49:37.620 --> 00:49:38.820
 In Chrome haben sie gedacht, naja.

00:49:38.820 --> 00:49:41.540
 Wer mit Chrome kommt, hat er es nicht verdient.

00:49:41.540 --> 00:49:43.900
 Okay, ja, dann fangen wir mal an, oder?

00:49:43.900 --> 00:49:44.580
 Genau.

00:49:44.580 --> 00:49:46.020
 Also jetzt kommt natürlich schon die erste Hürde,

00:49:46.020 --> 00:49:48.660
 nämlich da muss man jetzt irgendwie eine E-Mail-Adresse eingeben.

00:49:48.660 --> 00:49:50.720
 Ich mache da immer ganz gern welche, die es nicht gibt.

00:49:50.720 --> 00:49:54.540
 Man sollte natürlich das jetzt aber auch nicht spammen

00:49:54.540 --> 00:49:58.100
 mit unnötigen Einträgen und unechten Einträgen.

00:49:58.740 --> 00:50:00.580
 Also ich habe einfach schnell meine E-Mail-Adresse eingegeben.

00:50:00.580 --> 00:50:01.980
 Das geht ja ganz schnell.

00:50:01.980 --> 00:50:03.960
 Warte mal, was?

00:50:03.960 --> 00:50:06.100
 Langehands, Trashmail?

00:50:12.580 --> 00:50:16.000
 Also es sind ja, ich erzähle schon mal ein bisschen für die Leute,

00:50:16.000 --> 00:50:19.060
 die nicht die Zeit oder die Möglichkeit haben, das gerade selber mitzumachen.

00:50:19.060 --> 00:50:21.560
 Eingeteilt in verschiedene Kategorien.

00:50:21.560 --> 00:50:26.820
 Layout, Formen und Grafik, Interaktionen, Typografie, Animationen und Transformationen,

00:50:26.820 --> 00:50:31.080
 Media-Queries, andere Features, Einheiten und Selektoren,

00:50:31.660 --> 00:50:35.740
 Pre-Post-Processors, CSS-Frameworks, CSS-Methoden, CSS-in-JS,

00:50:35.740 --> 00:50:39.200
 andere Werkzeuge, Umgebungen, Ressourcen, Meinungen über dich.

00:50:39.200 --> 00:50:41.920
 Und da sind dann jeweils eine Handvoll von Fragen.

00:50:41.920 --> 00:50:45.560
 Also das ist, glaube ich, das klingt jetzt nach relativ vielen Kategorien,

00:50:45.560 --> 00:50:48.560
 aber da sind immer so drei, vier, fünf Fragen drin,

00:50:48.560 --> 00:50:52.360
 die jeweils drei Antworten haben, die man schnell anklicken kann.

00:50:52.360 --> 00:50:55.940
 Und vom Format her ist das eigentlich auch immer das Gleiche an Antworten,

00:50:55.940 --> 00:50:58.700
 nie davon gehört oder nicht sicher, worum es sich handelt.

00:50:59.040 --> 00:51:01.860
 kenne ich, aber nicht genutzt oder habe ich verwendet.

00:51:01.860 --> 00:51:05.460
 Und dementsprechend hat man das dann doch recht schnell durchgeklickt.

00:51:05.460 --> 00:51:07.820
 Ich habe gerade mal die Sprache ändern müssen,

00:51:07.820 --> 00:51:09.780
 weil bei mir hat er das automatisch auf Deutsch gemacht

00:51:09.780 --> 00:51:10.660
 und das will ich eigentlich.

00:51:10.660 --> 00:51:13.380
 Ja, ich musste es automatisch auf Deutsch,

00:51:13.380 --> 00:51:15.020
 ich musste es manuell auf Deutsch ändern,

00:51:15.020 --> 00:51:17.100
 weil ich es für den Podcast, weil wir ja auf Deutsch senden,

00:51:17.100 --> 00:51:18.680
 auch auf Deutsch vorlesen wollte,

00:51:18.680 --> 00:51:20.340
 weil normalerweise habe ich auch immer alles auf Englisch.

00:51:20.340 --> 00:51:23.460
 Aber ich dachte, wenn wir auf Deutsch senden,

00:51:23.460 --> 00:51:25.380
 dann machen wir auch die Fragen und so auf Deutsch.

00:51:25.380 --> 00:51:26.680
 Dann lese ich es aber auch,

00:51:26.680 --> 00:51:28.620
 dann lese ich es aber auch Deutsch vor,

00:51:28.740 --> 00:51:29.720
 also SubGrid.

00:51:29.720 --> 00:51:32.780
 SubGrid, das ist ein schöner Name.

00:51:32.780 --> 00:51:35.500
 Hallo, das ist meine Tochter, die SubGrid.

00:51:35.500 --> 00:51:40.100
 Sollen wir anfangen?

00:51:40.100 --> 00:51:40.420
 Ja.

00:51:40.420 --> 00:51:43.280
 Also die erste Kategorie ist Layout.

00:51:43.280 --> 00:51:45.300
 Und da ist die erste Frage,

00:51:45.300 --> 00:51:47.700
 wie positionierst du Elemente auf dem Bildschirm?

00:51:47.700 --> 00:51:50.240
 Und dann sind jetzt, keine Ahnung,

00:51:50.240 --> 00:51:51.880
 oh, das sind relativ viele Fragen.

00:51:53.220 --> 00:51:54.720
 Ja, gut, bei der ersten ist gleich ein paar mehr, ja.

00:51:54.720 --> 00:51:56.160
 Das erste ist CSS Grid,

00:51:56.160 --> 00:51:58.220
 und da kann ich sagen, habe ich verwendet.

00:51:58.240 --> 00:51:59.440
 Ja, habe ich auch verwendet.

00:51:59.440 --> 00:52:02.120
 Ich glaube, das kennt man mittlerweile auch.

00:52:02.120 --> 00:52:02.800
 Mittlerweile, ja.

00:52:02.800 --> 00:52:04.680
 Wir hatten es, als wir 2000,

00:52:04.680 --> 00:52:07.440
 boah, wann war das, wann war wir in Amsterdam auf der CSS Conf?

00:52:07.440 --> 00:52:10.840
 CSS Days 2017.

00:52:10.840 --> 00:52:12.800
 Da war das relativ neu,

00:52:12.800 --> 00:52:14.000
 da wurde es noch so angekündigt,

00:52:14.000 --> 00:52:14.640
 hier ganz groß,

00:52:14.640 --> 00:52:18.320
 oh, das ist jetzt endlich in den Stable Builds gelandet und so.

00:52:19.000 --> 00:52:20.540
 Aber ich glaube, denke doch,

00:52:20.540 --> 00:52:21.640
 dass man das mittlerweile schon,

00:52:21.640 --> 00:52:24.500
 ich nutze es tatsächlich nicht so oft.

00:52:24.500 --> 00:52:24.980
 Ich bin,

00:52:24.980 --> 00:52:28.340
 ich setze tatsächlich Flexbox noch recht häufig ein.

00:52:28.340 --> 00:52:32.360
 Grid tue ich mich auch ein bisschen schwer,

00:52:32.360 --> 00:52:33.980
 auch weil ich es nicht so häufig nutze.

00:52:33.980 --> 00:52:35.900
 Ich müsste es einfach mal mir selber in den Arsch treten

00:52:35.900 --> 00:52:36.720
 und es öfter mal nutzen.

00:52:36.720 --> 00:52:38.800
 Lass uns mal eine Grid-Folge machen.

00:52:38.800 --> 00:52:40.180
 Können wir sehr gerne mal machen, ja.

00:52:40.180 --> 00:52:41.500
 Es gibt nämlich auch sehr coole Tools,

00:52:41.500 --> 00:52:44.400
 mit denen man sich auch visuell einfach die Grids zusammenziehen kann.

00:52:44.400 --> 00:52:45.740
 Weil wenn man da,

00:52:45.740 --> 00:52:48.200
 ja, wenn man da versucht,

00:52:48.200 --> 00:52:49.360
 das händisch zu schreiben

00:52:49.360 --> 00:52:50.640
 und sich noch nicht so gut damit auskennt,

00:52:50.640 --> 00:52:52.660
 dann ist es so ein bisschen,

00:52:52.660 --> 00:52:54.380
 man wird da ein bisschen überwältigt

00:52:54.380 --> 00:52:56.860
 von der Syntax und von der Komplexität,

00:52:56.860 --> 00:52:57.860
 die man da erreichen kann.

00:52:57.860 --> 00:52:59.640
 Aber was geil ist an Grid,

00:52:59.640 --> 00:53:01.700
 ist, dass es eine Syntax gibt,

00:53:01.700 --> 00:53:04.780
 wo du dein Layout im Prinzip schreibst.

00:53:04.780 --> 00:53:06.400
 Also das klingt jetzt komisch,

00:53:06.400 --> 00:53:08.480
 sondern du kannst dein Layout im Prinzip

00:53:08.480 --> 00:53:09.660
 ins CSS so schreiben,

00:53:09.660 --> 00:53:10.760
 wie es später aussehen soll.

00:53:10.760 --> 00:53:11.440
 Du hast dann quasi,

00:53:11.440 --> 00:53:15.240
 du schreibst tatsächlich die Positionen

00:53:15.240 --> 00:53:16.140
 von den Elementen.

00:53:16.140 --> 00:53:17.980
 Du hast Spalten und Zeilen

00:53:17.980 --> 00:53:18.720
 und kannst dann wirklich

00:53:18.720 --> 00:53:19.820
 Head, Head, Head schreiben

00:53:19.820 --> 00:53:20.860
 und futter, futter, futter.

00:53:20.860 --> 00:53:22.280
 Genau, genau das.

00:53:22.280 --> 00:53:23.620
 Also das ist,

00:53:23.620 --> 00:53:25.180
 also wenn man das mal gemacht hat,

00:53:25.180 --> 00:53:26.840
 das ist super intuitiv.

00:53:26.840 --> 00:53:27.480
 Also ich weiß,

00:53:27.480 --> 00:53:28.500
 bei Flexbox und Grid,

00:53:28.500 --> 00:53:29.520
 da sind oft Sachen dabei,

00:53:29.520 --> 00:53:30.040
 wo man so denkt,

00:53:30.040 --> 00:53:30.540
 oh ja,

00:53:30.540 --> 00:53:31.780
 das muss ich irgendwie lernen,

00:53:31.780 --> 00:53:32.760
 das ist mir irgendwie nicht so klar.

00:53:32.760 --> 00:53:34.340
 Aber wenn man das mal gesehen hat,

00:53:34.340 --> 00:53:35.780
 dann möchte man eigentlich

00:53:35.780 --> 00:53:36.560
 nichts anderes mehr machen.

00:53:36.560 --> 00:53:37.360
 Wobei ich sagen muss,

00:53:37.360 --> 00:53:39.260
 ich setze es auch nicht so oft ein.

00:53:40.540 --> 00:53:41.440
 Das liegt aber auch daran,

00:53:41.440 --> 00:53:42.720
 dass ich hauptsächlich

00:53:42.720 --> 00:53:43.440
 auf der Arbeit

00:53:43.440 --> 00:53:44.800
 das Bootstrap-Grid

00:53:44.800 --> 00:53:45.620
 verwende,

00:53:45.620 --> 00:53:47.500
 das nicht auf CSS-Grid basiert.

00:53:47.500 --> 00:53:49.300
 Aber so für private Projekte,

00:53:49.300 --> 00:53:49.760
 wie zum Beispiel

00:53:49.760 --> 00:53:51.040
 mein Accessibility-Cheatsheet,

00:53:51.040 --> 00:53:52.040
 habe ich das schon mal

00:53:52.040 --> 00:53:53.000
 eingesetzt

00:53:53.000 --> 00:53:53.740
 und da so ein bisschen

00:53:53.740 --> 00:53:54.380
 mit rumgespielt.

00:53:54.380 --> 00:53:55.800
 Also ich kann es nur empfehlen

00:53:55.800 --> 00:53:57.040
 und es gibt, glaube ich,

00:53:57.040 --> 00:53:57.660
 auch coole,

00:53:57.660 --> 00:53:59.040
 so coole kleine Spiele

00:53:59.040 --> 00:53:59.820
 und Tutorials,

00:53:59.820 --> 00:54:00.620
 wie man das lernen kann.

00:54:00.620 --> 00:54:01.160
 Aber wir können nicht

00:54:01.160 --> 00:54:02.280
 an jedem Punkt so lange reden.

00:54:02.280 --> 00:54:03.180
 Nee, krass.

00:54:03.180 --> 00:54:04.060
 Ja, habe ich auch gerade gedacht.

00:54:04.060 --> 00:54:05.120
 Gut, schnell weiter.

00:54:05.120 --> 00:54:05.880
 Sub-Grid.

00:54:05.880 --> 00:54:06.940
 Sub-Grid.

00:54:07.460 --> 00:54:08.380
 Habe ich noch nicht verendet,

00:54:08.380 --> 00:54:09.020
 kenne ich aber.

00:54:09.020 --> 00:54:10.400
 Verendet, verwendet.

00:54:10.400 --> 00:54:12.000
 Ich bin noch nicht dran verendet,

00:54:12.000 --> 00:54:12.880
 aber ich kenne es.

00:54:12.880 --> 00:54:14.300
 Ist im Endeffekt,

00:54:14.300 --> 00:54:15.440
 wenn man so ein Card-Layout hat,

00:54:15.440 --> 00:54:17.360
 dass wirklich alle,

00:54:17.360 --> 00:54:18.060
 wenn das jetzt nicht

00:54:18.060 --> 00:54:20.080
 im gleichen Parent-Element ist,

00:54:20.080 --> 00:54:21.940
 dass dann alles trotzdem

00:54:21.940 --> 00:54:22.780
 auf der gleichen Höhe ist.

00:54:22.780 --> 00:54:23.340
 Ich hoffe,

00:54:23.340 --> 00:54:23.960
 das habe ich jetzt

00:54:23.960 --> 00:54:25.640
 in Kürze korrekt wiedergegeben.

00:54:25.640 --> 00:54:27.360
 So habe ich es auch verstanden.

00:54:27.360 --> 00:54:29.940
 Die Rachel Andrew auf Twitter,

00:54:29.940 --> 00:54:30.660
 die hat da immer

00:54:30.660 --> 00:54:31.680
 sehr viel drüber geschrieben.

00:54:31.680 --> 00:54:32.900
 Also da könnt ihr mal reingucken,

00:54:32.900 --> 00:54:33.620
 wenn ihr mehr was habt.

00:54:33.620 --> 00:54:34.160
 Weiß ich auch gar nicht,

00:54:34.160 --> 00:54:35.280
 wie da der Stand ist,

00:54:35.280 --> 00:54:35.860
 ob das überall

00:54:35.860 --> 00:54:36.680
 benutzt werden kann.

00:54:36.680 --> 00:54:38.940
 Mein letzter Stand war,

00:54:38.940 --> 00:54:40.060
 ja, lässt sich leider

00:54:40.060 --> 00:54:40.660
 noch nirgends so

00:54:40.660 --> 00:54:41.480
 wirklich sinnvoll nutzen.

00:54:41.480 --> 00:54:43.720
 Aber ich glaube,

00:54:43.720 --> 00:54:44.280
 wir können da jetzt wirklich

00:54:44.280 --> 00:54:45.400
 nicht zu jedem einzelnen Punkt

00:54:45.400 --> 00:54:46.080
 hier keiner use.

00:54:46.080 --> 00:54:47.120
 So, genau.

00:54:47.120 --> 00:54:48.360
 Flexbox habe ich verwendet.

00:54:48.360 --> 00:54:49.960
 Flexbox habe ich auch verwendet.

00:54:49.960 --> 00:54:51.040
 Wer es nicht kennt,

00:54:51.040 --> 00:54:52.840
 guck's nach.

00:54:52.840 --> 00:54:54.920
 Generell bei allen Sachen,

00:54:54.920 --> 00:54:55.400
 die jetzt kommen.

00:54:55.400 --> 00:54:56.120
 Wer es nicht kennt,

00:54:56.120 --> 00:54:57.440
 nachgucken lohnt sich.

00:54:57.440 --> 00:54:58.080
 Außer wir sagen,

00:54:58.080 --> 00:54:58.760
 es lohnt sich nicht.

00:54:58.760 --> 00:54:59.020
 Genau.

00:54:59.020 --> 00:55:00.280
 Also wir können uns in die E-Show

00:55:00.280 --> 00:55:02.140
 uns ja auch ein paar Links reinpacken.

00:55:02.140 --> 00:55:02.980
 Vielleicht auch nicht zu allem.

00:55:02.980 --> 00:55:03.260
 Ich glaube,

00:55:03.260 --> 00:55:04.200
 dann wird es wirklich zu viel.

00:55:04.200 --> 00:55:05.580
 Nein, das wird zu viel.

00:55:05.860 --> 00:55:07.280
 Es geht auch erstmal darum,

00:55:07.280 --> 00:55:08.280
 also es ist ja keine Schande,

00:55:08.280 --> 00:55:08.920
 es nicht zu kennen,

00:55:08.920 --> 00:55:11.220
 sondern man stellt durch die Umfrage fest,

00:55:11.220 --> 00:55:11.700
 kenne ich nicht,

00:55:11.700 --> 00:55:12.400
 schaue ich mir an

00:55:12.400 --> 00:55:13.740
 und genau so ist es auch gedacht,

00:55:13.740 --> 00:55:15.040
 man macht das am besten so.

00:55:15.040 --> 00:55:16.840
 CSS Multicallium

00:55:16.840 --> 00:55:17.720
 habe ich gerade erst letztens

00:55:17.720 --> 00:55:18.620
 bei einem Projekt eingesetzt.

00:55:18.620 --> 00:55:22.160
 Also automatisierte Spaltigkeit im CSS.

00:55:22.160 --> 00:55:23.080
 Kenne ich,

00:55:23.080 --> 00:55:24.360
 habe ich aber noch nie benutzt.

00:55:24.360 --> 00:55:24.960
 Ich habe noch nie

00:55:24.960 --> 00:55:26.140
 einen Anwendungsfall gefunden,

00:55:26.140 --> 00:55:28.520
 wo das irgendwie sinnvoll hingepasst hatte.

00:55:28.520 --> 00:55:30.460
 In meinem Fall,

00:55:30.460 --> 00:55:31.360
 also wenn es dich interessiert,

00:55:31.360 --> 00:55:32.540
 was konkrete Anwendungsfall,

00:55:32.740 --> 00:55:34.440
 es ist eine Art Kiosk-System

00:55:34.440 --> 00:55:35.760
 für Museen

00:55:35.760 --> 00:55:38.100
 und da können die halt Inhalte

00:55:38.100 --> 00:55:39.080
 einpflegen

00:55:39.080 --> 00:55:40.940
 und die sollen das natürlich

00:55:40.940 --> 00:55:41.720
 auch irgendwie ansprechen.

00:55:41.720 --> 00:55:42.720
 Du musst halt auf dem Bildschirm

00:55:42.720 --> 00:55:43.680
 immer gucken,

00:55:43.680 --> 00:55:45.180
 wie kriegst du das platztechnisch unter

00:55:45.180 --> 00:55:46.360
 und je nachdem,

00:55:46.360 --> 00:55:47.180
 wie viel Content du hast,

00:55:47.180 --> 00:55:47.700
 wie viel Text,

00:55:47.700 --> 00:55:48.220
 wie viel Bild,

00:55:48.220 --> 00:55:50.600
 kann das tatsächlich sinnvoll sein,

00:55:50.600 --> 00:55:51.580
 das irgendwie dreispaltig

00:55:51.580 --> 00:55:52.460
 oder vielleicht vierspaltig

00:55:52.460 --> 00:55:53.300
 oder sowas aufzuteilen.

00:55:53.940 --> 00:55:56.840
 Und da die jetzt auch nicht

00:55:56.840 --> 00:55:57.820
 unbedingt Gestalter sind,

00:55:57.820 --> 00:55:59.000
 die das machen,

00:55:59.000 --> 00:56:01.780
 kann ich da nicht verlangen,

00:56:01.780 --> 00:56:02.400
 dass ich dann mit CSS

00:56:02.400 --> 00:56:03.640
 irgendwie selber was basteln

00:56:03.640 --> 00:56:05.240
 und vier verschiedene Spalten befüllen

00:56:05.240 --> 00:56:05.720
 oder was weiß ich.

00:56:05.720 --> 00:56:06.100
 Das heißt,

00:56:06.100 --> 00:56:07.700
 ich wollte das einfach schön fließen lassen

00:56:07.700 --> 00:56:09.240
 und möglichst automatisch

00:56:09.240 --> 00:56:10.840
 und das geht damit natürlich super.

00:56:10.840 --> 00:56:14.120
 Okay.

00:56:14.120 --> 00:56:16.440
 CSS-Writing-Modes.

00:56:17.740 --> 00:56:18.720
 Weiß ich jetzt gerade gar nicht,

00:56:18.720 --> 00:56:19.280
 was gemeint ist.

00:56:19.280 --> 00:56:19.660
 Schrift,

00:56:19.660 --> 00:56:21.860
 ob die Schrift von oben nach unten,

00:56:21.860 --> 00:56:22.680
 rechts nach links.

00:56:22.680 --> 00:56:25.380
 Irgendwie sowas in der Richtung.

00:56:25.380 --> 00:56:26.480
 Also ich kann mit dem Begriff

00:56:26.480 --> 00:56:27.240
 gerade nichts anfangen.

00:56:27.240 --> 00:56:27.660
 Es kann sein,

00:56:27.660 --> 00:56:29.180
 dass ich es vielleicht schon genutzt habe,

00:56:29.180 --> 00:56:30.260
 aber ...

00:56:30.260 --> 00:56:31.460
 Ich habe gerade mal nachgeschlagen.

00:56:31.460 --> 00:56:33.700
 Writing-Mode CSS-Property

00:56:33.700 --> 00:56:34.520
 ist das tatsächlich.

00:56:34.520 --> 00:56:35.900
 Und da gibt es so Werte

00:56:35.900 --> 00:56:37.580
 wie Horizontal minus TB,

00:56:37.580 --> 00:56:39.120
 Vertical minus LR,

00:56:39.120 --> 00:56:40.980
 Vertical minus RL.

00:56:40.980 --> 00:56:43.780
 This property specifies

00:56:43.780 --> 00:56:45.740
 the block flow direction.

00:56:45.740 --> 00:56:47.540
 Also es gibt ja Schriften,

00:56:47.740 --> 00:56:48.120
 es gibt ja,

00:56:48.120 --> 00:56:49.560
 also das Chinesische ursprünglich

00:56:49.560 --> 00:56:50.560
 wird von oben nach unten geschrieben,

00:56:50.560 --> 00:56:51.460
 auch wenn man heutzutage

00:56:51.460 --> 00:56:52.660
 eigentlich von links nach rechts schreibt.

00:56:52.660 --> 00:56:54.580
 Es gibt aber bestimmt auch andere Sprachen,

00:56:54.580 --> 00:56:55.280
 wo das der Fall ist.

00:56:55.280 --> 00:56:57.060
 Also allein vom Namen her

00:56:57.060 --> 00:56:57.620
 würde ich jetzt sagen,

00:56:57.620 --> 00:56:58.080
 nicht sicher,

00:56:58.080 --> 00:56:58.980
 worum es sich handelt.

00:56:58.980 --> 00:57:00.740
 Tatsächlich habe ich es aber letztens

00:57:00.740 --> 00:57:01.840
 schon für was verwendet,

00:57:01.840 --> 00:57:02.760
 wo ich von was von oben

00:57:02.760 --> 00:57:03.700
 nach unten schreiben wollte.

00:57:03.700 --> 00:57:04.380
 Ah.

00:57:04.380 --> 00:57:06.140
 Okay.

00:57:06.140 --> 00:57:07.620
 Weiß ich jetzt nicht,

00:57:07.620 --> 00:57:08.180
 was ich ...

00:57:08.180 --> 00:57:09.100
 Das Beispiel bei MDN

00:57:09.100 --> 00:57:11.140
 sind auch diverse Sprachen,

00:57:11.140 --> 00:57:12.660
 die ich nicht lese.

00:57:12.660 --> 00:57:13.580
 Also da mir der Name

00:57:13.580 --> 00:57:14.300
 nichts gesagt hat,

00:57:14.300 --> 00:57:15.240
 gebe ich jetzt mal an,

00:57:15.240 --> 00:57:15.660
 nicht sicher,

00:57:15.660 --> 00:57:16.520
 worum es sich handelt.

00:57:16.520 --> 00:57:17.580
 Ja, also das ist auch

00:57:17.580 --> 00:57:18.280
 eine coole Demo,

00:57:18.280 --> 00:57:18.840
 ja, da sieht man,

00:57:18.840 --> 00:57:20.540
 also auf MDN Writing Modes

00:57:20.540 --> 00:57:21.960
 sieht man wie das dann,

00:57:21.960 --> 00:57:23.140
 also wenn tatsächlich irgendwie

00:57:23.140 --> 00:57:23.960
 von rechts nach links

00:57:23.960 --> 00:57:25.120
 und da wird es irgendwie umgedreht,

00:57:25.120 --> 00:57:25.940
 die Schrift und so weiter.

00:57:25.940 --> 00:57:26.340
 Also ja.

00:57:26.340 --> 00:57:27.520
 CSS Exclusions.

00:57:27.520 --> 00:57:28.340
 Habe ich aber auch noch nie verwendet.

00:57:28.340 --> 00:57:29.380
 Schnell weiter.

00:57:29.380 --> 00:57:31.900
 Ja, schnell CSS Exclusions.

00:57:31.900 --> 00:57:32.400
 Keine Ahnung.

00:57:32.400 --> 00:57:32.760
 Habe ich noch,

00:57:32.760 --> 00:57:33.700
 weiß ich auch nicht,

00:57:33.700 --> 00:57:34.300
 noch nie gehört.

00:57:34.300 --> 00:57:36.000
 Wir schreiben,

00:57:36.000 --> 00:57:37.360
 vielleicht notieren wir das mal irgendwie,

00:57:37.360 --> 00:57:38.300
 was wir noch nie gehört haben

00:57:38.300 --> 00:57:39.820
 und dann machen wir mal eine Folge,

00:57:39.820 --> 00:57:41.760
 wo wir nur über die Sachen reden,

00:57:41.760 --> 00:57:42.900
 die wir noch nie gehört haben.

00:57:43.520 --> 00:57:46.100
 Schreibst du mit?

00:57:46.100 --> 00:57:46.960
 Ich schreibe das auf, ja.

00:57:46.960 --> 00:57:48.100
 Nee, wir können auch einfach

00:57:48.100 --> 00:57:49.240
 unsere Sekretärin schreibt mit.

00:57:49.240 --> 00:57:51.300
 Die Redaktion im Hintergrund.

00:57:51.300 --> 00:57:52.120
 Die Redaktion,

00:57:52.120 --> 00:57:53.180
 die Redaktion schreibt mit.

00:57:55.360 --> 00:57:57.400
 Okay, dann gehe ich mal gleich zum Nächsten.

00:57:57.400 --> 00:57:58.900
 Position Sticky.

00:57:58.900 --> 00:58:00.380
 Ja, habe ich schon verwendet.

00:58:00.380 --> 00:58:01.940
 Das habe ich auch schon verwendet.

00:58:01.940 --> 00:58:04.320
 Funktioniert leider nicht so cool,

00:58:04.320 --> 00:58:06.240
 wie man sich denken würde,

00:58:06.240 --> 00:58:07.080
 dass es das tut.

00:58:07.080 --> 00:58:09.160
 Manchmal funktioniert es dann irgendwie doch nicht.

00:58:09.160 --> 00:58:10.640
 Also das müssen bestimmte Voraussetzungen

00:58:10.640 --> 00:58:11.200
 erfüllt sein,

00:58:11.200 --> 00:58:12.360
 der Parent Container irgendwie

00:58:12.360 --> 00:58:13.200
 und Position Relative

00:58:13.200 --> 00:58:13.700
 und was weiß ich.

00:58:13.700 --> 00:58:15.040
 Kurz gesagt ist es,

00:58:15.040 --> 00:58:16.280
 du scrollst auf der Seite

00:58:16.280 --> 00:58:18.440
 und das Element bleibt wirklich oben kleben,

00:58:18.440 --> 00:58:20.060
 statt dass es aus dem sichtbaren Bereich scrollt,

00:58:20.060 --> 00:58:20.960
 scrollt es mit runter.

00:58:20.960 --> 00:58:23.140
 Also einzusetzen zum Beispiel bei Table Headers,

00:58:23.560 --> 00:58:25.940
 die beim Scrollen von langen, endlosen Tabellen

00:58:25.940 --> 00:58:27.620
 dann trotzdem oben sichtbar sein sollen.

00:58:27.620 --> 00:58:29.340
 Oder auch bei vertikalem Scrollen,

00:58:29.340 --> 00:58:30.500
 nee, horizontal.

00:58:30.500 --> 00:58:32.000
 Ach, beim Scrollen weiß ich nie,

00:58:32.000 --> 00:58:33.880
 wie das, ist das jetzt horizontales Scrollen?

00:58:33.880 --> 00:58:35.660
 Ja, also von links nach rechts

00:58:35.660 --> 00:58:36.720
 auf Mobilgeräten,

00:58:36.720 --> 00:58:37.780
 wenn da Tabellen gerne mal

00:58:37.780 --> 00:58:39.480
 auf dem Handy abgeschnitten werden,

00:58:39.480 --> 00:58:40.420
 dann kann man das auch nutzen,

00:58:40.420 --> 00:58:42.240
 dass dann links das stehen bleibt.

00:58:42.240 --> 00:58:42.640
 Aber wie gesagt,

00:58:42.640 --> 00:58:43.740
 es ist nicht ganz so einfach.

00:58:43.740 --> 00:58:46.480
 Hast du dazu was?

00:58:46.480 --> 00:58:48.360
 Ich habe es auch schon verwendet.

00:58:48.360 --> 00:58:49.320
 Ich habe da sonst nichts zu.

00:58:49.320 --> 00:58:51.300
 Logical Properties.

00:58:51.300 --> 00:58:52.780
 Ah, da steht jetzt sogar ein Beispiel da.

00:58:52.780 --> 00:58:53.340
 Das ist auch gut.

00:58:53.420 --> 00:58:56.180
 Ja, Margin, Block, Start, Padding, Inline, End.

00:58:56.180 --> 00:58:58.240
 Da hattest du schon mal dazu, ja.

00:58:58.240 --> 00:59:00.520
 Hast du schon mal was dazu gesagt?

00:59:00.520 --> 00:59:03.460
 Kenne ich, habe ich aber selber noch nicht genutzt.

00:59:03.460 --> 00:59:06.000
 Ist im Prinzip so die Weiterentwicklung,

00:59:06.000 --> 00:59:07.380
 wenn man so auch viel

00:59:07.380 --> 00:59:09.640
 Right-to-Left-Layouts und so was macht,

00:59:09.640 --> 00:59:11.480
 dann ist das besser als Left

00:59:11.480 --> 00:59:13.700
 oder Right oder Top oder Bottom oder so.

00:59:13.800 --> 00:59:14.340
 Weil das kann ja,

00:59:14.340 --> 00:59:14.440
 weil das kann ja,

00:59:14.440 --> 00:59:17.680
 wie wir gerade bei Writing-Modes gelernt haben,

00:59:17.680 --> 00:59:20.180
 kann ja gerne mal umgedreht werden

00:59:20.180 --> 00:59:21.620
 und dann braucht man Logical Properties,

00:59:21.620 --> 00:59:23.500
 weil dann Left und Right und so nicht mehr stand.

00:59:23.500 --> 00:59:25.940
 Aspect Ratio.

00:59:27.140 --> 00:59:31.620
 Ich glaube, hat das nicht auch mit diesem Object Fit und Object Position zu tun?

00:59:31.620 --> 00:59:33.740
 Kann man da nicht auch sagen, das soll aber.

00:59:33.740 --> 00:59:35.080
 Aber ich sage jetzt mal,

00:59:35.080 --> 00:59:37.180
 ich bin mir nicht sicher, worum es sich handelt.

00:59:37.180 --> 00:59:39.160
 Weil das war jetzt nur so halb geraten.

00:59:39.560 --> 00:59:41.500
 Ich glaube, da geht es tatsächlich um so,

00:59:41.500 --> 00:59:44.720
 ich möchte irgendwie was 16 zu 9 haben oder so.

00:59:44.720 --> 00:59:45.540
 Ja, genau, genau.

00:59:45.540 --> 00:59:48.640
 Aber halt im, also in welchem Anwendungsfall,

00:59:48.640 --> 00:59:49.940
 also generell einfach,

00:59:49.940 --> 00:59:51.860
 statt dass ich Höhe und Breite definieren muss oder,

00:59:51.860 --> 00:59:54.400
 egal, ich habe es notiert.

00:59:54.400 --> 00:59:57.800
 Ich sage jedenfalls, ich habe es, kenne ich nicht.

00:59:57.800 --> 01:00:00.060
 Das wird, also erstens mal wird das,

01:00:00.060 --> 01:00:01.620
 wenn wir das jetzt echt ganz durchziehen,

01:00:01.620 --> 01:00:02.440
 eine sehr lange Folge.

01:00:02.440 --> 01:00:03.000
 Ja, richtig.

01:00:03.000 --> 01:00:05.340
 Und wir machen uns hier total nackig

01:00:05.340 --> 01:00:06.620
 mit Sachen, die wir nicht kennen.

01:00:06.620 --> 01:00:08.240
 Ja gut, aber das war ja klar,

01:00:08.380 --> 01:00:09.740
 als wir das Thema angegangen sind.

01:00:09.740 --> 01:00:11.480
 Oh Gott, und das war auch noch meine Idee.

01:00:11.480 --> 01:00:11.920
 Ja, natürlich.

01:00:11.920 --> 01:00:16.400
 Content Visibility sagt mir auch nichts.

01:00:16.400 --> 01:00:18.540
 Ja doch, das, da habe ich schon mal,

01:00:18.540 --> 01:00:20.240
 habe ich schon mal gehört.

01:00:20.240 --> 01:00:21.880
 Doch, ich glaube, das hat was,

01:00:21.880 --> 01:00:23.580
 das ist so ein Performance-Ding, oder?

01:00:23.580 --> 01:00:24.860
 Bin ich da jetzt komplett falsch?

01:00:24.860 --> 01:00:26.300
 Ist ja, ist ja auch egal.

01:00:26.300 --> 01:00:27.700
 Ah, warte mal.

01:00:27.700 --> 01:00:28.380
 Nee, nee, nee, Moment,

01:00:28.380 --> 01:00:29.380
 jetzt muss ich jetzt kurz nachgucken,

01:00:29.380 --> 01:00:30.380
 ob ich da richtig liege

01:00:30.380 --> 01:00:31.480
 oder ob ich komplett falsch liege.

01:00:31.480 --> 01:00:32.700
 Und der erste Blogartikel,

01:00:32.700 --> 01:00:33.500
 den ich dazu gefunden habe,

01:00:33.500 --> 01:00:34.260
 Content Visibility,

01:00:34.260 --> 01:00:35.840
 the new CSS property

01:00:35.840 --> 01:00:37.540
 that boosts your rendering performance.

01:00:37.580 --> 01:00:38.300
 Herzlich Willkommen zum

01:00:38.300 --> 01:00:39.940
 WWSIV Five-Hour-Special.

01:00:39.940 --> 01:00:41.580
 Ja, genau, nein,

01:00:41.580 --> 01:00:42.820
 ich wollte nur noch mal wissen,

01:00:42.820 --> 01:00:44.100
 ob ich damit grob richtig liege.

01:00:44.100 --> 01:00:45.480
 Also da geht es um Seiten

01:00:45.480 --> 01:00:47.420
 mit sehr vielen Inhalten, glaube ich.

01:00:47.420 --> 01:00:48.220
 Aber, ja, egal.

01:00:48.220 --> 01:00:49.400
 CSS Shapes.

01:00:49.400 --> 01:00:50.900
 Ich fahre dir jetzt einfach über den Mund.

01:00:50.900 --> 01:00:52.740
 Was, CSS Shapes?

01:00:52.740 --> 01:00:53.540
 Moment, warte mal.

01:00:53.540 --> 01:00:55.440
 Du bist schon in der nächsten Kategorie.

01:00:55.440 --> 01:00:55.620
 Ja.

01:00:55.620 --> 01:00:58.220
 Formen und Grafik.

01:00:58.220 --> 01:00:59.440
 Genau.

01:01:00.220 --> 01:01:01.380
 Hast du gerade Fick gesagt?

01:01:01.380 --> 01:01:02.300
 Oh, das gibt wieder Ärger.

01:01:02.300 --> 01:01:04.300
 Grafik, habe ich gesagt.

01:01:04.300 --> 01:01:06.000
 CSS Shapes.

01:01:06.000 --> 01:01:06.480
 Der Graf,

01:01:06.480 --> 01:01:08.420
 kennst du nicht den Graf Ik?

01:01:08.420 --> 01:01:10.160
 Wow.

01:01:10.160 --> 01:01:13.140
 CSS Shapes,

01:01:13.140 --> 01:01:13.780
 kenne ich,

01:01:13.780 --> 01:01:14.620
 habe ich aber noch nicht genutzt.

01:01:14.620 --> 01:01:15.800
 Also damit kann man wirklich,

01:01:15.800 --> 01:01:16.500
 ja,

01:01:16.500 --> 01:01:18.240
 Formen zeichnen,

01:01:18.240 --> 01:01:18.900
 Kreise,

01:01:18.900 --> 01:01:19.420
 Dreiecke.

01:01:19.420 --> 01:01:21.260
 Ja,

01:01:21.260 --> 01:01:21.660
 kenne ich auch,

01:01:21.660 --> 01:01:22.700
 habe ich auch noch nicht genutzt.

01:01:22.700 --> 01:01:23.660
 Object Fit,

01:01:23.660 --> 01:01:24.040
 genau,

01:01:24.040 --> 01:01:25.060
 da hatten wir es schon mal davon,

01:01:25.060 --> 01:01:26.860
 haben wir jetzt gerade eben noch mal davon gehabt.

01:01:27.060 --> 01:01:29.000
 Damit kann ich einfach dafür sorgen,

01:01:29.000 --> 01:01:34.680
 dass ein Bild tatsächlich den ihm zur Verfügung stehenden Platz nur einnimmt oder ein Video.

01:01:34.680 --> 01:01:36.060
 Das heißt,

01:01:36.060 --> 01:01:42.140
 so wie Background Size Fit oder Cover oder so kann ich aber für Elemente setzen.

01:01:42.140 --> 01:01:42.560
 Gut,

01:01:42.560 --> 01:01:43.520
 habe ich schon benutzt.

01:01:43.520 --> 01:01:45.240
 Clip Path habe ich auch schon benutzt.

01:01:45.240 --> 01:01:46.120
 Damit kann ich,

01:01:46.120 --> 01:01:48.140
 da bin ich mir gerade nicht sicher,

01:01:48.140 --> 01:01:49.420
 ob ich das auf der WoWir sind,

01:01:49.420 --> 01:01:51.240
 das vorne Seite vielleicht sogar eingesetzt habe.

01:01:51.240 --> 01:01:54.040
 Also damit kann ich einen Pfad definieren.

01:01:54.040 --> 01:01:55.740
 Ah nein.

01:01:55.980 --> 01:01:57.180
 wo dann Sachen abgeschnitten werden.

01:01:57.180 --> 01:01:58.060
 Wir müssen mal,

01:01:58.060 --> 01:01:59.000
 wir müssen mal,

01:01:59.000 --> 01:01:59.360
 ähm,

01:01:59.360 --> 01:02:01.600
 dieses Neulabel,

01:02:01.600 --> 01:02:02.040
 äh,

01:02:02.040 --> 01:02:02.340
 was da,

01:02:02.340 --> 01:02:04.100
 was da gesetzt wird an die aktuelle Folge.

01:02:04.100 --> 01:02:04.480
 Ja.

01:02:04.480 --> 01:02:05.420
 Da kann es sein,

01:02:05.420 --> 01:02:05.760
 dass du das,

01:02:05.760 --> 01:02:08.040
 dass du das irgendwie an eine Zeit geknüpft hast,

01:02:08.040 --> 01:02:09.360
 weil das ist jetzt gerade nicht da,

01:02:09.360 --> 01:02:10.840
 weil da habe ich das für mich eingesetzt.

01:02:10.840 --> 01:02:10.840
 Ah,

01:02:10.840 --> 01:02:11.600
 doch,

01:02:11.600 --> 01:02:12.960
 das sollte bei der,

01:02:12.960 --> 01:02:14.560
 immer bei der aktuellsten,

01:02:14.560 --> 01:02:16.160
 warum ist das denn nicht da?

01:02:16.160 --> 01:02:17.560
 Es ist aber gerade nicht da.

01:02:17.560 --> 01:02:18.700
 Das ist mir schon mal aufgefallen.

01:02:18.700 --> 01:02:19.300
 Es ist immer nach,

01:02:19.300 --> 01:02:20.580
 nach einer Weile geht das weg.

01:02:20.580 --> 01:02:23.500
 Habe ich das vielleicht sogar absichtlich reingebaut,

01:02:23.500 --> 01:02:25.500
 dass das nach einer Weile weggeht?

01:02:25.620 --> 01:02:26.920
 Das wäre blöd.

01:02:26.920 --> 01:02:28.300
 Das soll immer bei der aktuellen Folge sein,

01:02:28.300 --> 01:02:29.140
 egal wie alt die ist,

01:02:29.140 --> 01:02:29.640
 finde ich.

01:02:29.640 --> 01:02:30.620
 Äh,

01:02:30.620 --> 01:02:31.360
 gucke ich mir an.

01:02:31.360 --> 01:02:32.200
 Ähm,

01:02:32.200 --> 01:02:32.860
 äh,

01:02:32.860 --> 01:02:33.160
 genau,

01:02:33.160 --> 01:02:33.520
 Clip Path.

01:02:33.520 --> 01:02:34.020
 Also man kann damit ...

01:02:34.020 --> 01:02:34.500
 Es könnte sein,

01:02:34.500 --> 01:02:34.780
 dass ich,

01:02:34.780 --> 01:02:35.140
 ich glaube,

01:02:35.140 --> 01:02:36.400
 damit habe ich Clip Path eingesetzt,

01:02:36.400 --> 01:02:37.100
 aber da bin ich mir gerade,

01:02:37.100 --> 01:02:37.660
 oder war es,

01:02:37.660 --> 01:02:38.600
 mein Gott,

01:02:38.600 --> 01:02:38.900
 oh Gott.

01:02:38.900 --> 01:02:40.080
 Also ich hatte das letztens bei einem,

01:02:40.080 --> 01:02:41.000
 bei einem WordPress-Theme,

01:02:41.000 --> 01:02:41.320
 das,

01:02:41.320 --> 01:02:41.620
 äh,

01:02:41.620 --> 01:02:41.900
 so,

01:02:41.900 --> 01:02:42.200
 so,

01:02:42.200 --> 01:02:43.620
 so angeschrägte Section,

01:02:43.620 --> 01:02:44.260
 ähm,

01:02:44.260 --> 01:02:45.380
 unterstützt.

01:02:45.380 --> 01:02:46.480
 Also wo dann die,

01:02:46.480 --> 01:02:48.320
 die Section nicht einfach eine gerade Linie ist,

01:02:48.320 --> 01:02:49.720
 sondern die ist so leicht diagonal.

01:02:49.720 --> 01:02:50.800
 Ähm,

01:02:51.800 --> 01:02:53.260
 da wurde das mit Clip Path umgesetzt.

01:02:53.260 --> 01:02:55.660
 Äh,

01:02:55.660 --> 01:02:57.560
 und auch für was anderes habe ich schon mal verwendet,

01:02:57.560 --> 01:02:58.480
 aber das darf ich, glaube ich,

01:02:58.480 --> 01:02:58.880
 nicht sagen,

01:02:58.880 --> 01:02:59.380
 was das war.

01:02:59.380 --> 01:03:00.420
 Äh,

01:03:00.420 --> 01:03:02.340
 CSS Masks.

01:03:02.340 --> 01:03:04.060
 Das ist, glaube ich,

01:03:04.060 --> 01:03:04.660
 das Gleiche,

01:03:04.660 --> 01:03:05.040
 nur mit,

01:03:05.040 --> 01:03:06.440
 mit Maskenbildern,

01:03:06.440 --> 01:03:06.820
 richtig?

01:03:07.680 --> 01:03:08.280
 Ich glaube,

01:03:08.280 --> 01:03:10.060
 das habe ich auch schon von gehört,

01:03:10.060 --> 01:03:11.340
 habe ich aber auch noch nicht benutzt.

01:03:11.340 --> 01:03:12.380
 Genauer.

01:03:12.380 --> 01:03:13.920
 Ähm,

01:03:13.920 --> 01:03:16.060
 Blend Modes habe ich auch schon mitgearbeitet,

01:03:16.060 --> 01:03:16.900
 arbeiten wir, glaube ich,

01:03:16.900 --> 01:03:17.760
 sogar auf unserer Seite,

01:03:17.760 --> 01:03:18.520
 auf wo wir sind,

01:03:18.520 --> 01:03:20.020
 ist vorne.show damit,

01:03:20.020 --> 01:03:21.040
 mit dem Hintergrundbild,

01:03:21.040 --> 01:03:21.200
 oder?

01:03:21.200 --> 01:03:21.720
 Das ist,

01:03:21.720 --> 01:03:22.740
 ist das Blend Mode,

01:03:22.740 --> 01:03:23.240
 oder ist das?

01:03:23.240 --> 01:03:24.060
 Ja, doch,

01:03:24.060 --> 01:03:24.580
 ich glaube.

01:03:24.580 --> 01:03:25.980
 Also es ist im Endeffekt,

01:03:25.980 --> 01:03:27.380
 wie man es aus Photoshop vielleicht kennt,

01:03:27.380 --> 01:03:27.800
 ähm,

01:03:27.800 --> 01:03:29.900
 oder anderen Grafikbearbeitungsprogrammen,

01:03:29.900 --> 01:03:32.820
 also wirklich Ebenen-Misch-Modi,

01:03:32.820 --> 01:03:33.820
 die ich da machen kann,

01:03:33.820 --> 01:03:34.460
 Multiply,

01:03:34.460 --> 01:03:35.800
 Substract und so weiter.

01:03:35.800 --> 01:03:36.920
 Warte mal,

01:03:37.000 --> 01:03:37.700
 wir haben Filter,

01:03:37.700 --> 01:03:38.440
 Filter,

01:03:38.440 --> 01:03:39.120
 äh,

01:03:39.120 --> 01:03:40.260
 habe ich da eingesetzt.

01:03:40.260 --> 01:03:42.100
 Jetzt muss ich gerade mal gucken,

01:03:42.100 --> 01:03:44.400
 das ist dieses Background Image.

01:03:44.400 --> 01:03:45.380
 Ja,

01:03:45.380 --> 01:03:46.140
 das kommt als nächstes,

01:03:46.140 --> 01:03:47.260
 CSS Filter Effects.

01:03:47.260 --> 01:03:48.880
 Ich glaube,

01:03:48.880 --> 01:03:49.580
 keine Blend Modes,

01:03:49.580 --> 01:03:50.740
 aber Blend Modes habe ich auf jeden Fall

01:03:50.740 --> 01:03:51.920
 auf meiner persönlichen Homepage

01:03:51.920 --> 01:03:52.680
 eingesetzt,

01:03:52.680 --> 01:03:54.300
 für mein Bild,

01:03:54.300 --> 01:03:55.580
 was da drauf ist.

01:03:55.580 --> 01:03:57.100
 Also CSS Filter kann man nutzen,

01:03:57.100 --> 01:03:57.700
 um zum Beispiel,

01:03:57.700 --> 01:03:58.180
 ähm,

01:03:58.180 --> 01:04:00.040
 Sachen in Graustufen anzeigen zu lassen,

01:04:00.040 --> 01:04:00.380
 Bilder,

01:04:00.380 --> 01:04:01.080
 äh,

01:04:01.080 --> 01:04:02.540
 oder Kontrast erhöhen,

01:04:02.540 --> 01:04:03.160
 oder,

01:04:03.160 --> 01:04:04.320
 äh,

01:04:04.320 --> 01:04:04.860
 was gibt's noch?

01:04:04.860 --> 01:04:06.060
 Ja,

01:04:06.120 --> 01:04:06.540
 Kontrast,

01:04:06.540 --> 01:04:07.280
 Gamma-Korrektur,

01:04:07.280 --> 01:04:07.940
 irgendwie sowas.

01:04:07.940 --> 01:04:10.560
 Oh,

01:04:10.560 --> 01:04:11.900
 jetzt bräuchte ich die Rollstuhl-Taste.

01:04:11.900 --> 01:04:14.040
 Mein Bier ist auch leer.

01:04:14.040 --> 01:04:15.120
 Ähm,

01:04:15.120 --> 01:04:16.420
 Backdrop Filter.

01:04:16.420 --> 01:04:18.100
 Äh,

01:04:18.100 --> 01:04:22.060
 ist das nicht dasselbe für Background Images?

01:04:22.060 --> 01:04:22.840
 Ja.

01:04:22.840 --> 01:04:23.980
 Backdrop Filter,

01:04:23.980 --> 01:04:24.420
 Blurr?

01:04:24.420 --> 01:04:25.280
 Ich glaube schon.

01:04:25.280 --> 01:04:26.260
 Aber ich sag mal,

01:04:26.260 --> 01:04:26.980
 ich weiß es nicht,

01:04:26.980 --> 01:04:28.320
 weil ich bin mir jetzt nicht ganz sicher.

01:04:32.320 --> 01:04:33.020
 Abverschiebung,

01:04:33.020 --> 01:04:35.240
 ah ja,

01:04:35.240 --> 01:04:35.700
 ich glaube,

01:04:35.700 --> 01:04:36.060
 das ist,

01:04:36.060 --> 01:04:36.700
 oh Gott,

01:04:36.700 --> 01:04:38.020
 ich bin mir nicht sicher.

01:04:38.020 --> 01:04:38.620
 Also,

01:04:38.620 --> 01:04:38.860
 ich bin,

01:04:38.860 --> 01:04:39.840
 ich habe das,

01:04:39.840 --> 01:04:40.620
 ich habe das schon mal gehört,

01:04:40.620 --> 01:04:41.440
 aber benutzt habe ich es nicht

01:04:41.440 --> 01:04:42.220
 und ich weiß auch nicht genau,

01:04:42.220 --> 01:04:42.780
 was es tut.

01:04:42.780 --> 01:04:44.880
 Ich schreibe es mal mit auf.

01:04:44.880 --> 01:04:45.720
 Ja,

01:04:45.720 --> 01:04:46.580
 schreibe mal auf.

01:04:46.580 --> 01:04:48.260
 Wir können auch,

01:04:48.260 --> 01:04:49.700
 vielleicht wird es auch eine Doppelfolge,

01:04:49.700 --> 01:04:50.120
 weil ich glaube,

01:04:50.120 --> 01:04:51.000
 das wird echt zu lang.

01:04:51.040 --> 01:04:52.380
 Das ist echt krass,

01:04:52.380 --> 01:04:52.600
 ja.

01:04:52.600 --> 01:04:55.360
 Ja,

01:04:55.360 --> 01:04:56.460
 da sollten wir echt übernachten.

01:04:56.460 --> 01:04:56.780
 Scrollsnap.

01:04:56.780 --> 01:04:58.360
 Scrollsnap hast du,

01:04:58.360 --> 01:04:58.660
 glaube ich,

01:04:58.660 --> 01:04:59.460
 schon mal vorgestellt.

01:04:59.460 --> 01:05:00.080
 Ja,

01:05:00.080 --> 01:05:01.340
 das habe ich auch schon verwendet.

01:05:01.340 --> 01:05:02.420
 Es ist zwar noch nichts live,

01:05:02.420 --> 01:05:03.300
 was ich damit gemacht habe,

01:05:03.300 --> 01:05:05.700
 aber falls irgendwann in einer Million Jahren

01:05:05.700 --> 01:05:08.840
 mal der Content auf meiner Homepage live geht

01:05:08.840 --> 01:05:10.020
 und nicht nur irgendwelche Links,

01:05:10.020 --> 01:05:11.920
 die zu irgendwelchen Social Profilen zeigen,

01:05:11.920 --> 01:05:13.660
 dann ist das wahrscheinlich da mit drin.

01:05:13.660 --> 01:05:15.280
 Ja,

01:05:15.280 --> 01:05:16.340
 also das ist so,

01:05:16.340 --> 01:05:17.420
 da kann man,

01:05:17.420 --> 01:05:18.300
 da kann man quasi,

01:05:18.300 --> 01:05:19.160
 also das,

01:05:19.160 --> 01:05:20.420
 das billigste Beispiel ist,

01:05:20.480 --> 01:05:22.080
 dass man quasi so Folien machen kann,

01:05:22.080 --> 01:05:23.760
 so dass ich einzelne Seiten habe,

01:05:23.760 --> 01:05:24.320
 die dann,

01:05:24.320 --> 01:05:25.240
 die ich scrolle

01:05:25.240 --> 01:05:25.940
 und dann aber auch immer

01:05:25.940 --> 01:05:27.360
 die komplette Seite sichtbar ist

01:05:27.360 --> 01:05:28.520
 und immer an einer bestimmten Stelle

01:05:28.520 --> 01:05:29.800
 des Scrollen dann aufhört.

01:05:29.800 --> 01:05:30.660
 Also sozusagen,

01:05:30.660 --> 01:05:31.780
 muss man mal ausprobiert haben,

01:05:31.780 --> 01:05:32.920
 wie sich es anfühlt.

01:05:32.920 --> 01:05:34.440
 Also das kennt man ganz gerne

01:05:34.440 --> 01:05:35.600
 irgendwie von Slidern oder so,

01:05:35.600 --> 01:05:37.020
 dass die an bestimmten Stellen anhalten,

01:05:37.020 --> 01:05:38.820
 dass man den Content immer gut sieht

01:05:38.820 --> 01:05:39.960
 und es nicht irgendwie zwischendrin

01:05:39.960 --> 01:05:41.400
 hinscrollt.

01:05:41.400 --> 01:05:44.280
 Overscrollbehavior.

01:05:44.280 --> 01:05:45.320
 Ne,

01:05:45.320 --> 01:05:46.020
 sagt mir nichts.

01:05:46.020 --> 01:05:46.640
 Ja,

01:05:46.640 --> 01:05:48.960
 ich glaube mir auch nicht tatsächlich.

01:05:49.920 --> 01:05:50.500
 Aufschreiben.

01:05:50.500 --> 01:05:53.400
 Overflow Anchor

01:05:53.400 --> 01:05:55.080
 habe ich tatsächlich vorhin hinzugefügt

01:05:55.080 --> 01:05:56.840
 als unser Backlog

01:05:56.840 --> 01:05:57.860
 für die Property der Woche.

01:05:57.860 --> 01:05:59.640
 Weiß ich nicht,

01:05:59.640 --> 01:06:01.360
 ob ich da jetzt schon was davon

01:06:01.360 --> 01:06:03.380
 wegnehmen will.

01:06:03.380 --> 01:06:05.680
 sagen wir nichts dazu.

01:06:05.680 --> 01:06:06.500
 Also ich kenne es,

01:06:06.500 --> 01:06:08.520
 ich habe es tatsächlich noch nie produktiv benutzt,

01:06:08.520 --> 01:06:10.160
 aber ich habe es gerade vorhin erst

01:06:10.160 --> 01:06:10.980
 in der Hand gehabt,

01:06:10.980 --> 01:06:11.500
 sage ich jetzt mal.

01:06:11.500 --> 01:06:14.300
 Touch Action.

01:06:14.300 --> 01:06:17.140
 Das ist dieses,

01:06:17.140 --> 01:06:17.540
 ich glaube,

01:06:17.540 --> 01:06:18.740
 das ist dieses Callout-Menü

01:06:18.740 --> 01:06:21.620
 auf iPads und sowas.

01:06:21.620 --> 01:06:23.780
 Das kann man damit deaktivieren.

01:06:23.780 --> 01:06:26.640
 Habe ich tatsächlich auch schon benutzt.

01:06:26.720 --> 01:06:27.460
 Ich muss jetzt nur nachgucken,

01:06:27.460 --> 01:06:29.260
 ob ich nicht was Falsches sage,

01:06:29.260 --> 01:06:31.580
 ob das das ist.

01:06:31.580 --> 01:06:33.520
 Ob man das will,

01:06:33.520 --> 01:06:35.220
 ob das eine gute Idee ist.

01:06:35.220 --> 01:06:36.460
 Mir fällt tatsächlich was ein,

01:06:36.460 --> 01:06:37.520
 wo ich das mal gebraucht hätte,

01:06:37.520 --> 01:06:39.240
 aber ich weiß trotzdem nicht,

01:06:39.240 --> 01:06:40.760
 ob es eine gute Idee gewesen wäre.

01:06:44.460 --> 01:06:47.340
 Nee, das war nicht mit dem Callout.

01:06:47.340 --> 01:06:47.940
 Das war mit,

01:06:47.940 --> 01:06:48.720
 ob man

01:06:48.720 --> 01:06:50.760
 Pan to Zoom

01:06:50.760 --> 01:06:52.020
 oder Pinch to Zoom,

01:06:52.020 --> 01:06:54.200
 ob man das machen darf.

01:06:54.200 --> 01:06:55.860
 Das sollte auch,

01:06:55.860 --> 01:06:57.320
 meiner Meinung nach,

01:06:57.320 --> 01:06:59.080
 dafür sollte es nichts in CSS geben.

01:06:59.080 --> 01:07:02.120
 Habe ich in dem Fall auch gebraucht

01:07:02.120 --> 01:07:02.980
 bei diesem Kiosk-Ding,

01:07:02.980 --> 01:07:03.560
 weil da will ich nicht,

01:07:03.560 --> 01:07:04.940
 dass die User irgendwas rumscrollen.

01:07:04.940 --> 01:07:06.620
 Das ist tatsächlich eher für Apps,

01:07:06.620 --> 01:07:07.440
 also für Web-Apps,

01:07:07.440 --> 01:07:09.000
 das ist eine Progressive Web-App,

01:07:09.000 --> 01:07:10.920
 die ich dafür gemacht habe.

01:07:10.920 --> 01:07:12.740
 Da will man das nicht,

01:07:12.740 --> 01:07:13.780
 dass der User da irgendwas

01:07:13.780 --> 01:07:14.640
 manipulieren kann.

01:07:14.640 --> 01:07:16.080
 Ja, es gibt immer irgendein Argument,

01:07:16.080 --> 01:07:17.080
 aber da können wir uns jetzt,

01:07:17.080 --> 01:07:17.820
 da will ich jetzt

01:07:17.820 --> 01:07:18.340
 Point-Events.

01:07:18.340 --> 01:07:20.240
 Point-Events habe ich auch schon verwendet.

01:07:20.240 --> 01:07:23.280
 Wenn man in bestimmten Situationen

01:07:23.280 --> 01:07:23.580
 nicht will,

01:07:23.580 --> 01:07:24.720
 dass irgendwas anklickbar ist,

01:07:24.720 --> 01:07:25.720
 obwohl es sichtbar ist.

01:07:25.720 --> 01:07:26.860
 Und ja.

01:07:26.860 --> 01:07:29.220
 Ja, das habe ich auch schon verwendet.

01:07:29.220 --> 01:07:32.880
 So, dann gehen wir zum nächsten.

01:07:32.880 --> 01:07:34.580
 Typografie.

01:07:34.580 --> 01:07:36.200
 Und wer sich dafür nochmal

01:07:36.200 --> 01:07:38.100
 im Besonderen interessiert,

01:07:38.100 --> 01:07:39.560
 unsere Folge Nummer 13.

01:07:39.560 --> 01:07:41.060
 13? War das die 13?

01:07:41.060 --> 01:07:41.740
 Oder die 14?

01:07:41.740 --> 01:07:43.260
 Ich glaube, das war die 14.

01:07:43.260 --> 01:07:44.980
 Folge 14 widmet sich

01:07:44.980 --> 01:07:46.860
 komplett der Web-Typografie.

01:07:46.860 --> 01:07:48.120
 Web-Fonds,

01:07:48.120 --> 01:07:48.700
 Font-Face,

01:07:48.700 --> 01:07:48.960
 yo.

01:07:48.960 --> 01:07:50.420
 Ja, Font-Face,

01:07:50.420 --> 01:07:50.960
 das kennen wir.

01:07:50.960 --> 01:07:51.680
 Ist inzwischen ja

01:07:51.680 --> 01:07:52.640
 nicht mehr so neu.

01:07:52.640 --> 01:07:53.200
 Variable-Fonds.

01:07:53.200 --> 01:07:54.940
 Variable-Fonds hatten wir es drüber,

01:07:54.940 --> 01:07:55.460
 kenne ich,

01:07:55.460 --> 01:07:57.480
 habe ich aber selber noch nicht eingesetzt.

01:07:57.800 --> 01:07:59.760
 Ja, ich habe auf jeden Fall schon mit rumgespielt.

01:07:59.760 --> 01:08:00.300
 Folge 14.

01:08:00.300 --> 01:08:02.660
 Folge 14, da kann ich auf jeden Fall,

01:08:02.660 --> 01:08:03.900
 da sage ich nochmal,

01:08:03.900 --> 01:08:05.280
 in der Folge 14 kommt das auch,

01:08:05.280 --> 01:08:06.780
 der Inter-Font,

01:08:06.780 --> 01:08:07.960
 Inter heißt die Schriftart,

01:08:07.960 --> 01:08:10.480
 da kann man sehr viel mit rumspielen,

01:08:10.480 --> 01:08:11.420
 auch auf deren Seite.

01:08:11.420 --> 01:08:12.460
 Das macht echt Spaß.

01:08:12.460 --> 01:08:14.660
 Also da muss man gar nichts irgendwie installieren.

01:08:14.660 --> 01:08:15.780
 Da kann man einfach auf deren Seite

01:08:15.780 --> 01:08:17.140
 die ganzen Font-Features ausprobieren.

01:08:17.140 --> 01:08:17.660
 Das ist echt cool.

01:08:18.500 --> 01:08:19.460
 Dann haben wir hier

01:08:19.460 --> 01:08:20.940
 Line-Breaking-Properties.

01:08:20.940 --> 01:08:22.100
 Overflow-Rap,

01:08:22.100 --> 01:08:22.740
 Word-Break,

01:08:22.740 --> 01:08:24.200
 Line-Break und Hyphens.

01:08:24.200 --> 01:08:26.420
 Jo, da hatten wir es auch bei der Typografie.

01:08:26.420 --> 01:08:26.960
 Also ich glaube,

01:08:26.960 --> 01:08:28.500
 bei dem ganzen Thema kann man sagen,

01:08:28.500 --> 01:08:30.440
 davon hatten wir es in der Typografie-Folge.

01:08:30.440 --> 01:08:32.100
 Einfach die anhören,

01:08:32.100 --> 01:08:32.820
 wer sich dafür interessiert.

01:08:32.820 --> 01:08:33.840
 Overflow-Rap habe ich, glaube ich,

01:08:33.840 --> 01:08:34.460
 noch nie verwendet.

01:08:34.460 --> 01:08:34.900
 Word-Break,

01:08:34.900 --> 01:08:36.920
 Line-Break bin ich mir nicht sicher,

01:08:36.920 --> 01:08:38.680
 aber Hyphens und Word-Break.

01:08:38.680 --> 01:08:40.380
 Overflow-Rap bin ich mir auch nicht sicher,

01:08:40.380 --> 01:08:41.820
 aber die anderen drei auf jeden Fall.

01:08:41.820 --> 01:08:43.420
 Font-Variant,

01:08:43.420 --> 01:08:44.740
 davon hatten wir es

01:08:44.740 --> 01:08:46.780
 auch in der Folge.

01:08:46.780 --> 01:08:48.240
 Initial-Letter,

01:08:48.240 --> 01:08:49.200
 ja, das ist dieses Typische,

01:08:49.200 --> 01:08:50.400
 was man aus dem Print so kennt,

01:08:50.400 --> 01:08:52.400
 dass der erste Buchstabe anders formatiert ist.

01:08:52.400 --> 01:08:53.320
 Moment.

01:08:53.320 --> 01:08:54.300
 Habe ich, glaube ich.

01:08:54.300 --> 01:08:54.940
 Moment, warte mal.

01:08:54.940 --> 01:08:58.020
 Aber das ist doch First Letter.

01:08:58.020 --> 01:08:58.940
 Ach so.

01:08:58.940 --> 01:08:59.620
 Du meinst, oder?

01:08:59.620 --> 01:09:03.660
 Du meinst bestimmt First Letter.

01:09:03.660 --> 01:09:04.600
 Ja, das ist der Selektor,

01:09:04.600 --> 01:09:06.700
 aber Initial Letter ist doch ...

01:09:06.700 --> 01:09:08.320
 Set styling for dropped,

01:09:08.320 --> 01:09:10.240
 raised and sunken initial letters.

01:09:10.240 --> 01:09:11.940
 Ja, aber wo unterscheidet sich das denn?

01:09:11.940 --> 01:09:13.580
 Applies to First Letter.

01:09:13.580 --> 01:09:16.540
 Das gehört zu First Letter dazu.

01:09:17.980 --> 01:09:19.800
 Another approach is different.

01:09:19.800 --> 01:09:20.320
 Number or Integer.

01:09:20.320 --> 01:09:22.900
 Also, ich glaube,

01:09:22.900 --> 01:09:24.820
 das macht tatsächlich das Gleiche.

01:09:24.820 --> 01:09:26.220
 Nee, nee, nee.

01:09:26.220 --> 01:09:27.940
 Das ist, das ist,

01:09:27.940 --> 01:09:29.680
 da kommt, da kommt entweder

01:09:29.680 --> 01:09:31.480
 ein numerischer Wert rein,

01:09:31.480 --> 01:09:31.840
 oder

01:09:31.840 --> 01:09:36.200
 da kommen numeric values rein.

01:09:37.320 --> 01:09:40.900
 also, wie viele Zeilen der irgendwie verschoben wird.

01:09:40.900 --> 01:09:42.900
 Dann habe ich es tatsächlich mit First Letter verwechselt.

01:09:42.900 --> 01:09:43.220
 Ja, genau.

01:09:43.220 --> 01:09:44.240
 Gut, also ...

01:09:44.240 --> 01:09:46.000
 Es ist für First Letter gedacht,

01:09:46.000 --> 01:09:47.500
 es ist für First Letter gedacht,

01:09:47.500 --> 01:09:49.360
 aber es verschiebt den Buchstaben,

01:09:49.360 --> 01:09:50.340
 wenn ich das richtig sehe.

01:09:50.340 --> 01:09:51.780
 Initial Letters,

01:09:51.780 --> 01:09:53.660
 CSS Property set styling for dropped,

01:09:53.660 --> 01:09:55.660
 raised and sunken initial letters.

01:09:55.660 --> 01:09:58.080
 Also, da kommen tatsächlich numerische Werte rein.

01:09:58.080 --> 01:09:58.560
 Interessant.

01:09:58.560 --> 01:09:59.660
 Also, kannte ich auch noch nicht.

01:10:00.080 --> 01:10:02.260
 Dann haben wir hier Font Variant Numeric.

01:10:02.640 --> 01:10:04.600
 Das sagt mir jetzt gezielt nichts.

01:10:04.600 --> 01:10:06.600
 Das ist, glaube ich,

01:10:06.600 --> 01:10:09.600
 ein Feature von Variable Fonts.

01:10:09.600 --> 01:10:12.080
 Auch gleich mal notiert.

01:10:12.080 --> 01:10:13.300
 Font Display.

01:10:13.300 --> 01:10:15.560
 Font Display.

01:10:15.560 --> 01:10:19.480
 Glaube ich auch ein Feature von Variable Fonts.

01:10:19.480 --> 01:10:21.040
 Aber jetzt ...

01:10:21.040 --> 01:10:21.240
 Ha!

01:10:21.240 --> 01:10:23.000
 Und dann Line Clamp.

01:10:23.000 --> 01:10:24.340
 Das hatten wir hier schon als Property.

01:10:24.340 --> 01:10:25.440
 Da hatten wir es schon mal drüber, ja.

01:10:25.440 --> 01:10:27.560
 Das gab schon,

01:10:27.560 --> 01:10:28.760
 das war schon eine Property der Woche.

01:10:28.760 --> 01:10:29.780
 Dürft ihr selbst raussuchen,

01:10:29.780 --> 01:10:30.740
 in welcher Folge das war.

01:10:30.740 --> 01:10:31.600
 Da haben wir schon mal drüber gesprochen.

01:10:31.600 --> 01:10:32.560
 Wüsste ich jetzt spontan auch nicht.

01:10:33.360 --> 01:10:35.400
 Gertsch, dann nächste Kategorie.

01:10:35.400 --> 01:10:37.600
 Animationen und Transformationen.

01:10:37.600 --> 01:10:40.040
 Animiere und transformiere Elemente.

01:10:40.040 --> 01:10:41.000
 CSS Transitions.

01:10:41.000 --> 01:10:43.560
 Ja, natürlich.

01:10:43.560 --> 01:10:47.740
 Da muss man auch nix drüber sagen.

01:10:47.740 --> 01:10:48.760
 Das kennt ja jeder.

01:10:48.760 --> 01:10:49.880
 Nein, Spaß.

01:10:49.880 --> 01:10:52.900
 CSS Transforms.

01:10:52.900 --> 01:10:53.980
 Ja, das sind Übergänge, Animationen, Transforms.

01:10:53.980 --> 01:10:54.720
 Genau, also Übergänge,

01:10:54.720 --> 01:10:58.260
 dass ich ein Property von der Farbe Rot zur Farbe Blau

01:10:58.260 --> 01:11:01.660
 zum Beispiel transitionieren lasse.

01:11:01.660 --> 01:11:03.080
 Ich erfinde einfach wieder ein neues Wort dafür.

01:11:03.080 --> 01:11:05.600
 Hier können die Opas nochmal vom Krieg erzählen.

01:11:05.600 --> 01:11:06.760
 Das war nicht immer so ein.

01:11:06.760 --> 01:11:07.460
 Nein, das ging nicht.

01:11:07.460 --> 01:11:09.320
 Das hatte man früher mit Jahreskaps machen müssen.

01:11:09.320 --> 01:11:11.940
 Und gerade bei Farben war das irgendwie schwierig.

01:11:11.940 --> 01:11:13.940
 Da brauchte man extra Bibliotheken,

01:11:13.940 --> 01:11:16.300
 die dann die Farbwerte ineinander umrechnen können.

01:11:16.300 --> 01:11:18.520
 Das war früher großer Schmerz.

01:11:18.520 --> 01:11:19.100
 Geht jetzt mittlerweile sehr einfach.

01:11:19.100 --> 01:11:20.400
 Kinder, Kinder, Kinder, ich weiß ja gar nicht,

01:11:20.400 --> 01:11:21.340
 wie gut ihr es heute habt.

01:11:21.340 --> 01:11:22.500
 Ach ja.

01:11:22.500 --> 01:11:25.800
 Mensch, jetzt sitzen wir hier immer noch

01:11:25.800 --> 01:11:27.440
 und machen diesen komischen Schrott.

01:11:27.440 --> 01:11:29.340
 Ich glaube, wir machen mal eine komplette Folge

01:11:29.340 --> 01:11:30.640
 als Waldorf und Stadler.

01:11:30.640 --> 01:11:34.460
 Ja, aber ich glaube, wir verstehen uns zu gut.

01:11:34.460 --> 01:11:35.880
 Ja, vermutlich.

01:11:35.880 --> 01:11:38.680
 Danach, das ist ja die letzte Folge, glaube ich.

01:11:38.680 --> 01:11:40.340
 CSS Transforms.

01:11:41.300 --> 01:11:43.420
 Sachen durch die Gegend schieben oder rotieren.

01:11:43.420 --> 01:11:44.980
 Oder vergrößern.

01:11:44.980 --> 01:11:46.180
 Auch im 3D-Bereich.

01:11:46.180 --> 01:11:49.020
 Ja, das möchte ich unbedingt mal machen.

01:11:49.020 --> 01:11:49.820
 Animations, ja.

01:11:49.820 --> 01:11:52.660
 Sie heißt Animations, ähnlich wie Transitions,

01:11:52.660 --> 01:11:54.320
 nur dass die halt automatisiert ablaufen

01:11:54.320 --> 01:11:56.400
 und nicht irgendwie, wenn ich eine Klasse setze

01:11:56.400 --> 01:11:59.780
 und entferne, dann passiert das oder so.

01:11:59.780 --> 01:12:01.740
 Sondern die laufen einfach ab.

01:12:01.740 --> 01:12:04.840
 Ich kann sagen, fangen mit Rot an und Blau

01:12:04.840 --> 01:12:05.920
 und bei 20 Prozent und so weiter.

01:12:05.920 --> 01:12:07.700
 Du kannst diese Twins machen mit Prozentual

01:12:07.700 --> 01:12:09.700
 und so Geschichten, das ist irgendwie schon cool.

01:12:09.700 --> 01:12:11.100
 Perspective.

01:12:11.300 --> 01:12:14.280
 Das spielt mit rein bei den Transitions.

01:12:14.280 --> 01:12:15.160
 Bei 3D, ne?

01:12:15.160 --> 01:12:17.380
 Genau, wenn man da irgendwelche 3D-Rotationen macht,

01:12:17.380 --> 01:12:19.120
 dann kann man da die Perspektive festlegen.

01:12:19.120 --> 01:12:20.920
 Das habe ich auch schon mal irgendwo benutzt,

01:12:20.920 --> 01:12:23.700
 aber so ganz häufig brauche ich das eigentlich nicht.

01:12:23.700 --> 01:12:26.740
 Ich rotiere da selten im 3D-Raum, muss ich sagen.

01:12:26.740 --> 01:12:28.260
 Also meistens ist es dann doch eher auf

01:12:28.260 --> 01:12:31.000
 hier ein paar Grad mal was drehen oder so.

01:12:31.000 --> 01:12:32.440
 Ich habe da vor kurzem,

01:12:32.440 --> 01:12:34.820
 ich weiß nicht, ob ich den Link dazu nochmal finde,

01:12:34.820 --> 01:12:37.540
 jemanden gesehen, der auf YouTube Live-Coding gemacht hat.

01:12:37.540 --> 01:12:38.360
 Das ist ja irgendwie gerade so ein Ding,

01:12:38.360 --> 01:12:40.220
 dass die Leute irgendwie Live-Coding machen.

01:12:40.860 --> 01:12:45.620
 Und der hat da tatsächlich so relativ einfach erklärt,

01:12:45.620 --> 01:12:48.800
 wie man einen Würfel baut mit CSS

01:12:48.800 --> 01:12:50.920
 und wie man den dann auch animiert und so.

01:12:50.920 --> 01:12:51.940
 Und das fand ich ziemlich cool.

01:12:51.940 --> 01:12:55.440
 Tatsächlich habe ich das für eine Bastelei schon mal.

01:12:55.440 --> 01:12:58.340
 Ich habe so einen Ticker gebaut,

01:12:58.340 --> 01:13:00.960
 auch für so eine Screen-Anzeige,

01:13:00.960 --> 01:13:03.440
 also so ein Display-Werbemittel,

01:13:03.440 --> 01:13:04.820
 nein, nicht Werbemittel, aber egal,

01:13:04.820 --> 01:13:06.060
 also so ein Wartebildschirm.

01:13:06.460 --> 01:13:07.480
 Und da habe ich so einen Ticker,

01:13:07.480 --> 01:13:08.960
 so N24-Style-mäßig,

01:13:08.960 --> 01:13:12.440
 da rotiert so der Text eben auch wie in so einem,

01:13:12.440 --> 01:13:14.900
 ja, nicht Würfel, aber halt ein Quader.

01:13:14.900 --> 01:13:17.240
 Das ist schwierig zu beschreiben,

01:13:17.240 --> 01:13:18.340
 wenn man es jetzt nicht zeigen kann.

01:13:18.340 --> 01:13:21.180
 Und der geht nicht einfach nur nach oben

01:13:21.180 --> 01:13:22.220
 und verschwindet aus dem Sichtbarbereich,

01:13:22.220 --> 01:13:23.420
 sondern der wird wirklich gedreht.

01:13:23.960 --> 01:13:25.640
 Und dafür habe ich das auch schon eingesetzt,

01:13:25.640 --> 01:13:26.980
 die Perspective.

01:13:26.980 --> 01:13:30.100
 Gut, dann haben wir schon den nächsten Bereich,

01:13:30.100 --> 01:13:31.000
 Media-Queries.

01:13:31.000 --> 01:13:32.700
 Warte mal.

01:13:32.700 --> 01:13:33.380
 Ach so, ja, stimmt.

01:13:33.380 --> 01:13:34.360
 Ah, ich war schon eins weiter.

01:13:34.360 --> 01:13:36.300
 Da bist du noch weiter, okay.

01:13:36.300 --> 01:13:37.420
 Nee, nee, ich war eins weiter.

01:13:37.420 --> 01:13:38.180
 Also da gibt es,

01:13:38.180 --> 01:13:40.100
 da habe ich bei allen dreien,

01:13:40.100 --> 01:13:41.440
 kenne ich, aber noch nicht genutzt.

01:13:41.440 --> 01:13:44.120
 So, nee, ich habe da schon.

01:13:44.120 --> 01:13:44.480
 Ja.

01:13:44.480 --> 01:13:46.400
 Ich glaube, wir haben es sogar auf der Podcast-Seite

01:13:46.400 --> 01:13:47.400
 teilweise auch im Einsatz.

01:13:47.400 --> 01:13:49.740
 Also Prefers-Reduced-Motion.

01:13:50.760 --> 01:13:53.800
 Ich glaube, da gibt es mittlerweile so ein paar CSS-Tricks,

01:13:53.800 --> 01:13:54.740
 hatten sie es mal davon,

01:13:54.740 --> 01:13:56.220
 und das habe ich eigentlich überall eingebaut,

01:13:56.220 --> 01:13:58.740
 so ein Standardschnipsel, den man da reinpackt,

01:13:58.740 --> 01:14:02.420
 der einfach alle Animationen auf Zeit Null setzt,

01:14:02.420 --> 01:14:03.240
 somit important,

01:14:03.240 --> 01:14:05.940
 damit eben die Motion-Reduced wird.

01:14:05.940 --> 01:14:07.200
 Also man soll halt,

01:14:07.200 --> 01:14:08.580
 es soll sich dann eben nichts mehr bewegen.

01:14:08.580 --> 01:14:10.980
 Oder es soll sich nicht bewegen,

01:14:10.980 --> 01:14:12.640
 es soll halt mehr so abgehackt dann sein.

01:14:12.640 --> 01:14:14.500
 Das ist vielleicht, ich nehme mal an,

01:14:14.500 --> 01:14:16.200
 es geht viel so in Richtung Epilepsie.

01:14:16.200 --> 01:14:18.160
 Genau, genau, ja.

01:14:18.160 --> 01:14:18.740
 Könnte ich mir vorstellen.

01:14:18.740 --> 01:14:20.200
 Oder vielleicht auch ältere Devices,

01:14:20.400 --> 01:14:22.300
 die aber durch ein Update noch quasi mitbekommen,

01:14:22.300 --> 01:14:23.320
 hier sag allen Seiten,

01:14:23.320 --> 01:14:27.340
 dass du keine krassen Animationen unterstützen möchtest.

01:14:27.340 --> 01:14:31.740
 Aber zum Thema Epilepsie fällt mir gerade noch was ein.

01:14:31.740 --> 01:14:39.000
 Ich weiß nicht, ob ich das noch mal irgendwo verlinken darf

01:14:39.000 --> 01:14:41.500
 oder ob die Leute mich dann komplett bekloppt halten.

01:14:41.500 --> 01:14:43.440
 Aber erinnerst du dich an den Epileptomat?

01:14:43.440 --> 01:14:43.720
 Ja.

01:14:43.720 --> 01:14:46.420
 Den packe ich noch mal in die Shownotes.

01:14:46.420 --> 01:14:47.000
 Okay, alles klar.

01:14:47.000 --> 01:14:48.160
 Ich hab mal was, ich hab mal was,

01:14:48.160 --> 01:14:49.040
 ich hab mal quasi,

01:14:49.040 --> 01:14:50.540
 nee, das ist jetzt wirklich geht,

01:14:50.540 --> 01:14:52.840
 also wenn ihr Epilepsie gefährdet seid

01:14:52.840 --> 01:14:54.000
 oder das nicht wisst, ob ihr es habt,

01:14:54.000 --> 01:14:55.620
 dann geht da wirklich nicht drauf.

01:14:55.620 --> 01:14:56.120
 Das ist wirklich,

01:14:56.120 --> 01:14:58.100
 dann ist es vielleicht tatsächlich gefährlich für euch.

01:14:58.100 --> 01:14:59.580
 Also ich muss es jetzt wirklich sagen,

01:14:59.580 --> 01:15:01.500
 so lustig es für mich ist,

01:15:01.500 --> 01:15:02.980
 aber ich hab halt mal eine Seite gebaut,

01:15:02.980 --> 01:15:04.520
 die ein bisschen anstrengend anzugucken ist.

01:15:04.520 --> 01:15:05.700
 Das ist moritzgiesmann.de

01:15:05.700 --> 01:15:06.840
 slash Epileptomat.

01:15:07.060 --> 01:15:08.720
 Da solltest du vielleicht auch dann das

01:15:08.720 --> 01:15:11.400
 Prefers Reduced Motion einbauen,

01:15:11.400 --> 01:15:13.960
 damit das dann einfach nichts tut.

01:15:13.960 --> 01:15:17.140
 Ja, also es ist sehr wild.

01:15:17.140 --> 01:15:18.480
 Ich hab's irgendwann mal entschärft,

01:15:18.480 --> 01:15:19.640
 aber es ist immer noch ziemlich wild.

01:15:19.640 --> 01:15:21.260
 Und es kommt aber vorher auch so eine Warning

01:15:21.260 --> 01:15:24.560
 so im Style von Jackass.

01:15:24.560 --> 01:15:26.000
 Und da ist auch ein Button,

01:15:26.000 --> 01:15:27.280
 auf dem steht No Risk, No Fun.

01:15:27.280 --> 01:15:29.540
 Also den muss man erst klicken,

01:15:29.540 --> 01:15:31.200
 bevor was Schlimmes passiert.

01:15:31.200 --> 01:15:31.540
 Sehr vernünftig.

01:15:31.540 --> 01:15:33.160
 Und ich sag nichts weiter,

01:15:33.160 --> 01:15:34.580
 es passiert dann was Schlimmes.

01:15:34.580 --> 01:15:36.580
 Sehr vernünftig, wie wir dich kennen, Moritz.

01:15:36.580 --> 01:15:40.720
 Ja, ja, also ich hatte das ursprünglich ohne

01:15:40.720 --> 01:15:42.340
 und dann hat mich jemand darauf hingewiesen,

01:15:42.340 --> 01:15:44.340
 dass das eventuell wirklich gefährlich sein kann.

01:15:44.340 --> 01:15:45.860
 Und dann hab ich diesen Hinweis noch eingebaut.

01:15:45.860 --> 01:15:46.780
 Weil ich will ja auch,

01:15:46.780 --> 01:15:49.300
 Accessibility ist ja schon eins meiner Themen

01:15:49.300 --> 01:15:50.440
 und dann kann ich nicht dafür sorgen,

01:15:50.440 --> 01:15:51.840
 dass alle epileptische Anfälle kriegen.

01:15:51.840 --> 01:15:52.800
 Das ist einfach nicht cool.

01:15:52.800 --> 01:15:54.480
 Also Prefers Reduced Motion.

01:15:54.480 --> 01:15:55.920
 Gibt's einen coolen kleinen Schnipsel,

01:15:55.920 --> 01:15:57.240
 könnt ihr irgendwie mal googeln.

01:15:57.240 --> 01:15:58.940
 Der schadet keiner Seite,

01:15:58.940 --> 01:16:01.280
 der einfach, wenn dieses Media Query gesetzt ist,

01:16:01.540 --> 01:16:04.160
 einfach alle Animationen und Transitions ausschaltet.

01:16:04.160 --> 01:16:06.640
 Und das tut niemandem weh, würde ich sagen.

01:16:06.640 --> 01:16:07.800
 Also ich hab's auch schon verwendet.

01:16:07.800 --> 01:16:11.240
 Dann sind wir Prefers Color Scheme,

01:16:11.240 --> 01:16:14.300
 Dark und Light sind da die Werte meines Wissens nach.

01:16:14.300 --> 01:16:15.340
 Und da geht's tatsächlich um,

01:16:15.340 --> 01:16:17.880
 dass der Browser beziehungsweise das Betriebssystem

01:16:17.880 --> 01:16:20.200
 Dark Modes oder Light Modes setzen kann.

01:16:20.200 --> 01:16:22.340
 Hab ich bei meinem Accessibility Cheat Sheet schon eingebaut.

01:16:22.340 --> 01:16:23.340
 Also hab ich schon verwendet.

01:16:23.340 --> 01:16:26.560
 Color Gamut, da hatten wir es ganz kurz davon

01:16:26.560 --> 01:16:28.060
 in unserer Folge Nummer 5,

01:16:28.060 --> 01:16:29.380
 Badass CSS Colors.

01:16:30.060 --> 01:16:32.580
 Zugriff auf 50% mehr Farben auf eurer Webseite.

01:16:32.580 --> 01:16:35.180
 Ja, das ist hervorragend.

01:16:35.180 --> 01:16:38.160
 Mit so einem Clickbait-Beschreibungstext.

01:16:38.160 --> 01:16:40.660
 Genau, da ging's um den LCH-Farbraum

01:16:40.660 --> 01:16:41.800
 und generell um Farbräume.

01:16:41.800 --> 01:16:44.500
 Und damit kann man eben steuern,

01:16:44.500 --> 01:16:46.000
 dass nur die Browser,

01:16:46.000 --> 01:16:47.440
 die einen bestimmten Farbraum unterstützen,

01:16:47.440 --> 01:16:49.240
 dann auch entsprechende Farben angezeigt bekommen

01:16:49.240 --> 01:16:50.420
 und eben halt Fallbacks schaffen

01:16:50.420 --> 01:16:52.440
 für andere Browser, die das nicht können.

01:16:53.880 --> 01:16:55.680
 Dann andere Features.

01:16:55.680 --> 01:16:58.380
 CSS Variables, jo, verwendet.

01:16:58.380 --> 01:17:00.140
 Oh, ich muss noch weiter, ja.

01:17:00.140 --> 01:17:01.840
 Äh, Variables, ja, auf jeden Fall.

01:17:01.840 --> 01:17:03.780
 Also inzwischen immer häufiger,

01:17:03.780 --> 01:17:05.540
 also auch irgendwie so zu,

01:17:05.540 --> 01:17:06.820
 um so eine Art Theming zu schaffen,

01:17:06.820 --> 01:17:07.740
 tatsächlich irgendwie,

01:17:07.740 --> 01:17:09.420
 Farben haben wir bei uns bei der Seite auch,

01:17:09.420 --> 01:17:11.460
 so ein paar Default-Farben

01:17:11.460 --> 01:17:13.900
 aufs Root-Element als Variable

01:17:13.900 --> 01:17:15.080
 und die dann nutzen im Code.

01:17:15.080 --> 01:17:17.540
 Ähm, weiß gar nicht,

01:17:17.540 --> 01:17:18.960
 wie der Support inzwischen ist.

01:17:18.960 --> 01:17:20.720
 CSS Variablen.

01:17:20.720 --> 01:17:22.860
 Ziemlich gut, glaube ich.

01:17:22.860 --> 01:17:23.800
 Ziemlich gut mittlerweile auch, ne?

01:17:23.800 --> 01:17:23.900
 Also ich, also ich,

01:17:23.900 --> 01:17:25.180
 ich hab ja vorhin schon gesagt,

01:17:25.180 --> 01:17:26.180
 ich bin in einer guten Lage,

01:17:26.180 --> 01:17:27.720
 was CSS-Features angeht,

01:17:27.720 --> 01:17:29.420
 aber ich würde das bedenkenlos einsetzen

01:17:29.420 --> 01:17:30.240
 bei uns auf jeden Fall.

01:17:30.240 --> 01:17:32.600
 Dann Feature-Support-Queries.

01:17:32.600 --> 01:17:34.100
 Hab ich schon verwendet.

01:17:34.100 --> 01:17:35.180
 Hab ich auch schon verwendet.

01:17:35.180 --> 01:17:36.260
 Das heißt, man kann wirklich abfragen,

01:17:36.260 --> 01:17:37.180
 kann der Browser das

01:17:37.180 --> 01:17:38.740
 und nur dann mach ich was Bestimmtes.

01:17:38.740 --> 01:17:39.760
 Auf der WoWir sind,

01:17:39.760 --> 01:17:40.080
 ist vorne,

01:17:40.080 --> 01:17:41.160
 wollte ich das auch für was

01:17:41.160 --> 01:17:43.440
 mehr sophisticated einsetzen,

01:17:43.520 --> 01:17:45.080
 wo ich nämlich tatsächlich abfragen wollte,

01:17:45.080 --> 01:17:46.620
 ob ein bestimmter Selektor geht.

01:17:46.620 --> 01:17:47.660
 Nicht ein CSS-Feature,

01:17:47.660 --> 01:17:48.640
 sondern ein Selektor.

01:17:48.640 --> 01:17:50.020
 Und das war zu dem Zeitpunkt,

01:17:50.020 --> 01:17:51.140
 ich weiß nicht, wie das jetzt ist,

01:17:51.140 --> 01:17:54.300
 so schlecht oder gar nicht unterstützt.

01:17:54.300 --> 01:17:55.920
 Weil das ist natürlich auch interessant,

01:17:55.920 --> 01:17:57.880
 ob es bestimmte Selektoren in CSS gibt.

01:17:57.880 --> 01:17:58.740
 Weil wenn es den nicht gibt,

01:17:58.740 --> 01:17:59.860
 dann macht man irgendwie was anderes.

01:17:59.860 --> 01:18:01.920
 Fand ich damals schade,

01:18:01.920 --> 01:18:02.640
 dass das noch nicht geht,

01:18:02.640 --> 01:18:03.640
 aber vielleicht geht es mittlerweile.

01:18:03.640 --> 01:18:04.740
 Kann ich jetzt nicht genau sagen.

01:18:04.740 --> 01:18:05.940
 Hab ich auf jeden Fall schon eingesetzt.

01:18:05.940 --> 01:18:07.560
 CSS-Containment.

01:18:07.560 --> 01:18:08.580
 Ich glaube, da geht es darum,

01:18:08.580 --> 01:18:10.400
 um das, was zum Beispiel Vue macht,

01:18:10.400 --> 01:18:13.020
 dass das abkapselt für Components.

01:18:13.140 --> 01:18:15.140
 richtig, weißt du es?

01:18:15.140 --> 01:18:15.700
 Ah, ich glaube,

01:18:15.700 --> 01:18:19.840
 da geht es auch um Anzeigeperformance.

01:18:19.840 --> 01:18:21.220
 Also ja,

01:18:21.220 --> 01:18:22.200
 aber ich glaube,

01:18:22.200 --> 01:18:23.820
 da geht es um,

01:18:23.820 --> 01:18:25.120
 ist das nicht,

01:18:25.120 --> 01:18:26.180
 also ich schreibe es auf jeden Fall mal auf.

01:18:26.180 --> 01:18:27.100
 Ich glaube,

01:18:27.100 --> 01:18:28.880
 da hat da nicht jemand drüber berichtet,

01:18:28.880 --> 01:18:30.500
 da in Amsterdam.

01:18:30.500 --> 01:18:31.080
 Ich meine,

01:18:31.080 --> 01:18:32.360
 da wäre das irgendwo Thema gewesen.

01:18:32.360 --> 01:18:35.300
 Auf jeden Fall habe ich darüber

01:18:35.300 --> 01:18:39.080
 auf einer Konferenz mal gehört.

01:18:39.080 --> 01:18:39.440
 Egal.

01:18:39.440 --> 01:18:41.300
 Also ich habe es schon mal davon gehört,

01:18:41.300 --> 01:18:42.140
 ich weiß nicht genau,

01:18:42.140 --> 01:18:42.740
 was es tut.

01:18:42.740 --> 01:18:45.800
 Will Change habe ich auch schon benutzt.

01:18:45.800 --> 01:18:47.740
 Da ging es auch um Performance.

01:18:47.740 --> 01:18:50.520
 Da kann man dem Browser einfach so einen Tipp geben,

01:18:50.520 --> 01:18:52.720
 wird sich das Property noch irgendwann ändern

01:18:52.720 --> 01:18:54.340
 oder bleibt das eher gleich?

01:18:54.340 --> 01:18:56.820
 Und dann kann man so bestimmte

01:18:56.820 --> 01:18:58.640
 Performance-Optimierungsmechanismen

01:18:58.640 --> 01:19:00.040
 im Browser aktivieren,

01:19:00.600 --> 01:19:02.300
 wo dann Sachen normalerweise geflackert hätten,

01:19:02.300 --> 01:19:03.300
 die dann nicht flackern,

01:19:03.300 --> 01:19:04.060
 weil der Browser weiß,

01:19:04.060 --> 01:19:04.300
 aha,

01:19:04.300 --> 01:19:05.940
 das wird sich später ändern,

01:19:05.940 --> 01:19:06.520
 deswegen,

01:19:06.520 --> 01:19:08.160
 ja,

01:19:08.160 --> 01:19:09.440
 cache ich das irgendwie nicht

01:19:09.440 --> 01:19:09.700
 oder,

01:19:09.700 --> 01:19:10.820
 ja,

01:19:10.820 --> 01:19:11.940
 wie das genau technisch funktioniert,

01:19:11.940 --> 01:19:12.940
 kann ich jetzt nicht sagen,

01:19:12.940 --> 01:19:13.260
 aber,

01:19:13.260 --> 01:19:14.820
 ähm,

01:19:14.820 --> 01:19:16.420
 kann nützlich sein.

01:19:16.420 --> 01:19:16.960
 Ja.

01:19:16.960 --> 01:19:17.740
 Calc?

01:19:17.740 --> 01:19:18.480
 Calc, ja,

01:19:18.480 --> 01:19:20.160
 inzwischen auch eigentlich regelmäßig.

01:19:20.160 --> 01:19:20.400
 Ich glaube,

01:19:20.400 --> 01:19:21.780
 der Support ist mittlerweile auch gut

01:19:21.780 --> 01:19:24.500
 und damit lassen sich halt einfach auch tolle Dinge machen,

01:19:24.500 --> 01:19:24.860
 also,

01:19:24.860 --> 01:19:27.260
 irgendwelche Abstände berechnen

01:19:27.260 --> 01:19:28.460
 zwischen Elementen oder so,

01:19:28.460 --> 01:19:29.100
 wenn ich halt genau weiß.

01:19:29.100 --> 01:19:32.180
 25% minus 30 Pixel oder sowas geht da nicht.

01:19:32.180 --> 01:19:32.580
 Genau, genau.

01:19:32.580 --> 01:19:33.320
 Das ist immer ganz interessant.

01:19:33.320 --> 01:19:35.940
 Das ist sehr, sehr, sehr nett zu haben.

01:19:35.940 --> 01:19:36.800
 Houdini.

01:19:36.800 --> 01:19:37.400
 Folge 6.

01:19:37.400 --> 01:19:38.660
 Folge Nummer 6, ja.

01:19:38.660 --> 01:19:40.560
 Wer dazu was hören will,

01:19:40.560 --> 01:19:41.580
 ähm,

01:19:41.580 --> 01:19:42.480
 Houdini.

01:19:42.480 --> 01:19:44.220
 Aber nicht verwendet bisher.

01:19:44.220 --> 01:19:46.080
 Ähm.

01:19:46.080 --> 01:19:47.280
 Ich hab's in Demos verwendet,

01:19:47.280 --> 01:19:47.780
 das zählt für mich.

01:19:47.780 --> 01:19:47.920
 Ja, gut.

01:19:47.920 --> 01:19:49.020
 Ja, ja.

01:19:49.020 --> 01:19:51.980
 CSS Comparison Functions,

01:19:51.980 --> 01:19:53.300
 Min, Max und Clamp,

01:19:53.300 --> 01:19:53.700
 jo,

01:19:53.700 --> 01:19:54.920
 hab ich auch mal verwendet,

01:19:54.920 --> 01:19:56.060
 aber ich glaube,

01:19:56.060 --> 01:19:57.760
 das sollte man tatsächlich aktuell

01:19:57.760 --> 01:19:58.880
 nur hinter irgendwelchen

01:19:58.880 --> 01:19:59.660
 Transpilern,

01:19:59.660 --> 01:20:00.500
 äh,

01:20:00.500 --> 01:20:01.420
 also nicht Transpilern,

01:20:01.420 --> 01:20:01.960
 aber, äh,

01:20:01.960 --> 01:20:02.880
 CSS Post,

01:20:02.880 --> 01:20:03.640
 äh,

01:20:03.640 --> 01:20:04.420
 Prozessoren,

01:20:04.420 --> 01:20:04.960
 äh,

01:20:04.960 --> 01:20:05.640
 verwenden,

01:20:05.640 --> 01:20:07.060
 die dann irgendwelche Workarounds

01:20:07.060 --> 01:20:08.700
 dafür, äh,

01:20:08.700 --> 01:20:09.140
 schreiben,

01:20:09.140 --> 01:20:10.140
 sofern das geht.

01:20:10.140 --> 01:20:10.840
 Ähm,

01:20:10.840 --> 01:20:12.320
 ist aber tatsächlich auch ganz praktisch,

01:20:12.320 --> 01:20:12.940
 wenn man wirklich will,

01:20:12.940 --> 01:20:13.180
 dass,

01:20:13.180 --> 01:20:14.720
 dass ein Element sich einfach zwischen

01:20:14.720 --> 01:20:16.760
 zwei verschiedenen Größen bewegt.

01:20:16.760 --> 01:20:17.320
 Also,

01:20:17.320 --> 01:20:18.800
 ich will irgendwie meinen Content beschränken,

01:20:18.800 --> 01:20:19.460
 aber ich will auch,

01:20:19.460 --> 01:20:21.300
 dass es beim Mobile irgendwie nicht kleiner wird,

01:20:21.300 --> 01:20:21.620
 als,

01:20:21.620 --> 01:20:22.640
 als die Bildschirmbreite,

01:20:22.640 --> 01:20:24.440
 dann kann ich eben sagen, äh,

01:20:24.440 --> 01:20:25.860
 Min, Max,

01:20:25.860 --> 01:20:26.360
 Clamp,

01:20:26.360 --> 01:20:26.820
 fertig.

01:20:26.820 --> 01:20:30.600
 Einheiten und Selektoren,

01:20:30.700 --> 01:20:31.900
 die CSS Units,

01:20:31.900 --> 01:20:32.960
 da hatten wir das letzte Folge,

01:20:32.960 --> 01:20:34.980
 in unserem von Special Nummer 2,

01:20:34.980 --> 01:20:35.760
 kurz davon,

01:20:35.760 --> 01:20:36.840
 von Empower Units,

01:20:36.840 --> 01:20:38.180
 gibt natürlich deutlich mehr,

01:20:38.180 --> 01:20:39.000
 wie man jetzt hier sieht,

01:20:39.000 --> 01:20:39.780
 ähm,

01:20:39.780 --> 01:20:41.000
 wer dazu was hören will,

01:20:41.000 --> 01:20:42.400
 einfach letzte Folge nochmal reinhören,

01:20:42.400 --> 01:20:44.160
 dann, äh,

01:20:44.160 --> 01:20:45.160
 kann man hier anklicken,

01:20:45.160 --> 01:20:46.900
 das ist jetzt tatsächlich ein anderes Format

01:20:46.900 --> 01:20:47.800
 der Beantwortung,

01:20:47.800 --> 01:20:49.240
 da klickt man einfach Checkboxen an,

01:20:49.660 --> 01:20:51.700
 welche dieser CSS Einheiten hast du genutzt,

01:20:51.700 --> 01:20:51.960
 also,

01:20:51.960 --> 01:20:52.880
 PX,

01:20:52.880 --> 01:20:53.940
 äh,

01:20:53.940 --> 01:20:54.380
 PT,

01:20:54.380 --> 01:20:55.620
 also Punkt,

01:20:55.620 --> 01:20:56.760
 habe ich die jemals genutzt?

01:20:56.760 --> 01:20:57.040
 Ne,

01:20:57.040 --> 01:20:57.740
 habe ich nie genutzt?

01:20:57.740 --> 01:20:57.920
 Glaube ich nicht.

01:20:57.920 --> 01:20:58.700
 Prozent,

01:20:58.700 --> 01:20:59.260
 EM,

01:20:59.260 --> 01:20:59.880
 RAM,

01:20:59.880 --> 01:21:01.380
 VH,

01:21:01.380 --> 01:21:01.800
 VW,

01:21:01.800 --> 01:21:02.680
 das heißt, ähm,

01:21:02.680 --> 01:21:03.600
 wirklich Display,

01:21:03.600 --> 01:21:04.160
 ähm,

01:21:04.160 --> 01:21:05.120
 Einheiten,

01:21:05.120 --> 01:21:06.740
 Vmin,

01:21:06.740 --> 01:21:07.240
 Vmax,

01:21:07.240 --> 01:21:08.660
 habe ich auch mal irgendwo benutzt,

01:21:08.660 --> 01:21:09.500
 ich weiß nur gar nicht mehr,

01:21:09.500 --> 01:21:09.660
 wo.

01:21:09.660 --> 01:21:10.260
 Ich glaube,

01:21:10.260 --> 01:21:11.140
 ich habe es noch nicht verwendet.

01:21:11.140 --> 01:21:11.740
 CH,

01:21:11.740 --> 01:21:14.680
 für diese Demo,

01:21:14.680 --> 01:21:15.640
 hatten wir es auch letztes Mal drüber,

01:21:15.640 --> 01:21:17.740
 habe ich tatsächlich auch letztens bei was eingesetzt.

01:21:17.740 --> 01:21:21.420
 Hätte ich jetzt tatsächlich die Tage einen Fall dafür gehabt,

01:21:21.420 --> 01:21:21.800
 ähm,

01:21:21.800 --> 01:21:23.520
 habe ich einem Kollegen empfohlen,

01:21:23.520 --> 01:21:24.120
 dass es das gibt,

01:21:24.120 --> 01:21:24.980
 aber, ähm,

01:21:24.980 --> 01:21:26.680
 habe ich tatsächlich noch nicht eingesetzt.

01:21:26.680 --> 01:21:28.740
 X habe ich auch noch nicht eingesetzt.

01:21:28.740 --> 01:21:29.500
 X,

01:21:29.500 --> 01:21:31.080
 hatten wir es da auch letztes Mal davon,

01:21:31.080 --> 01:21:32.080
 ich bin mir gerade gar nicht sicher,

01:21:32.080 --> 01:21:32.960
 hatten wir X.

01:21:32.960 --> 01:21:33.600
 Ich weiß es nicht.

01:21:33.600 --> 01:21:37.140
 Aber Millimeter, Zentimeter habe ich tatsächlich benutzt letztens,

01:21:37.140 --> 01:21:39.220
 als es um PDF-Generierung im Browser ging.

01:21:39.660 --> 01:21:40.600
 Inch nicht,

01:21:40.600 --> 01:21:42.720
 weil ich in Inch nicht arbeite.

01:21:42.720 --> 01:21:45.780
 Zentimeter habe ich auf meinem Accessibility-Cheat-Sheet benutzt,

01:21:45.780 --> 01:21:46.240
 einfach nur.

01:21:46.240 --> 01:21:46.580
 Ah ja.

01:21:46.580 --> 01:21:49.060
 Welches ist das?

01:21:49.060 --> 01:21:50.620
 Es ist Pseudo-Elemente.

01:21:50.620 --> 01:21:51.720
 Pseudo-Elemente.

01:21:51.720 --> 01:21:52.000
 Before,

01:21:52.000 --> 01:21:52.600
 After,

01:21:52.600 --> 01:21:53.840
 Firstline,

01:21:53.840 --> 01:21:54.540
 Firstletter,

01:21:54.540 --> 01:21:55.300
 Selection,

01:21:55.300 --> 01:21:56.580
 Placeholder,

01:21:56.580 --> 01:21:58.260
 Marker habe ich noch nie benutzt.

01:21:58.260 --> 01:21:59.060
 Marker ist,

01:21:59.060 --> 01:21:59.680
 glaube ich,

01:21:59.680 --> 01:22:00.380
 für Listen.

01:22:00.380 --> 01:22:02.060
 Ah,

01:22:02.060 --> 01:22:02.640
 ja.

01:22:02.640 --> 01:22:04.100
 Das habe ich auf jeden Fall gesagt.

01:22:04.100 --> 01:22:06.460
 In den Firefox-Dev-Tools sieht man das.

01:22:06.460 --> 01:22:07.600
 Backdrop,

01:22:07.600 --> 01:22:08.600
 was macht ein Backdrop?

01:22:08.600 --> 01:22:10.600
 Backdrop sagt man als einziges wirklich gar nichts.

01:22:10.600 --> 01:22:11.280
 Backdrop,

01:22:11.280 --> 01:22:12.740
 ich glaube,

01:22:12.740 --> 01:22:14.020
 ich glaube,

01:22:14.020 --> 01:22:18.540
 das könnte zusammenhängen mit dem mal geplanten Dialog-Element,

01:22:18.540 --> 01:22:21.580
 das automatisch auch einen Backdrop setzt.

01:22:21.580 --> 01:22:23.880
 Das muss ich gerade noch mal gucken.

01:22:23.880 --> 01:22:25.840
 Also Dialog-Element ist dir bekannt?

01:22:27.140 --> 01:22:27.580
 Ja,

01:22:27.580 --> 01:22:28.140
 ja,

01:22:28.140 --> 01:22:29.700
 aber auch noch nicht irgendwie im Einsatz gehabt.

01:22:29.700 --> 01:22:30.540
 Noch ganz kurz,

01:22:30.540 --> 01:22:31.260
 Firstline,

01:22:31.260 --> 01:22:32.100
 Firstletter,

01:22:32.100 --> 01:22:37.900
 da hatten wir es ein bisschen ausführlicher in unseren CSS-Feature-Folgen drüber,

01:22:37.900 --> 01:22:38.680
 Folge Nummer 10,

01:22:38.680 --> 01:22:39.360
 Folge Nummer 11,

01:22:39.360 --> 01:22:42.500
 wo wir eine kleine Wunschliste erstellt haben,

01:22:42.500 --> 01:22:45.580
 was wir an CSS-Features vermissen.

01:22:45.580 --> 01:22:48.060
 Und da ging es auch um Firstline und Firstletter.

01:22:48.840 --> 01:22:49.600
 Also Backdrop,

01:22:49.600 --> 01:22:50.900
 ich habe es kurz nachgeschlagen,

01:22:50.900 --> 01:22:53.100
 ist tatsächlich für das Dialog-Element,

01:22:53.100 --> 01:22:57.880
 jedes Element im Stack des Top-Layers,

01:22:57.880 --> 01:22:59.060
 was auch immer das ist,

01:22:59.060 --> 01:22:59.580
 wahrscheinlich das,

01:22:59.580 --> 01:23:02.020
 was angezeigt wird bei Dialog,

01:23:02.020 --> 01:23:04.960
 hat ein Backdrop-Pseudo-Element,

01:23:04.960 --> 01:23:07.620
 steht bei MDN.

01:23:08.520 --> 01:23:11.800
 Also das ist dann der Backdrop von dem Dialog.

01:23:11.800 --> 01:23:13.020
 Aber Dialog ist, glaube ich,

01:23:13.020 --> 01:23:14.180
 auch noch nicht so weit,

01:23:14.180 --> 01:23:15.920
 dass man das wirklich irgendwo einsetzen könnte.

01:23:15.920 --> 01:23:16.220
 Ich glaube,

01:23:16.220 --> 01:23:20.180
 das ist leider noch nicht so weit.

01:23:20.180 --> 01:23:20.880
 Gut,

01:23:20.880 --> 01:23:22.520
 dann geht es als nächstes um Verkettungen.

01:23:22.520 --> 01:23:23.400
 Das sind einfach,

01:23:23.400 --> 01:23:24.680
 da wusste ich zuerst gar nicht,

01:23:24.680 --> 01:23:25.240
 was meinen die,

01:23:25.240 --> 01:23:26.400
 Selektoren.

01:23:26.400 --> 01:23:27.820
 Kombinatoren.

01:23:27.820 --> 01:23:28.580
 Genau.

01:23:28.580 --> 01:23:30.940
 Also einfach ein Diff-Span,

01:23:30.940 --> 01:23:31.920
 ohne irgendwas dazwischen,

01:23:31.920 --> 01:23:32.580
 jo, klar.

01:23:32.580 --> 01:23:32.920
 Naja,

01:23:32.920 --> 01:23:33.360
 nein,

01:23:33.360 --> 01:23:35.140
 mit einem Leerzeichen dazwischen,

01:23:35.140 --> 01:23:35.920
 das ist entscheidend.

01:23:35.920 --> 01:23:36.300
 Ja,

01:23:36.300 --> 01:23:37.260
 schon klar.

01:23:38.520 --> 01:23:42.400
 Nur kein Kombinator dazwischen.

01:23:42.400 --> 01:23:44.460
 Also einfach ein Span,

01:23:44.460 --> 01:23:45.280
 das sich irgendwo,

01:23:45.280 --> 01:23:45.960
 wo auch immer,

01:23:45.960 --> 01:23:46.660
 an welcher Position

01:23:46.660 --> 01:23:49.380
 im verschachtelten Baum

01:23:49.380 --> 01:23:50.760
 innerhalb eines Diffs befindet.

01:23:50.760 --> 01:23:51.740
 Dann Diff,

01:23:51.740 --> 01:23:52.880
 Pfeil nach rechts,

01:23:52.880 --> 01:23:53.440
 Span,

01:23:53.440 --> 01:23:55.000
 also ein Span,

01:23:55.000 --> 01:23:56.420
 das direktes Kind-Element

01:23:56.420 --> 01:23:57.200
 eines Diff ist.

01:23:57.200 --> 01:23:57.880
 Direktes Kind-Element, genau.

01:23:57.880 --> 01:23:59.100
 Diff plus Diff,

01:23:59.100 --> 01:24:00.420
 also ein bestimmtes Diff,

01:24:00.420 --> 01:24:02.000
 das direkt auf ein Diff folgt.

01:24:02.000 --> 01:24:03.560
 Und Diff mit Tilde,

01:24:03.560 --> 01:24:05.200
 also dieses geschweifte Dingens.

01:24:05.200 --> 01:24:06.800
 Und ein Diff,

01:24:06.800 --> 01:24:07.280
 das heißt,

01:24:07.780 --> 01:24:09.060
 ein Sibling,

01:24:09.060 --> 01:24:10.040
 der irgendwann folgt,

01:24:10.040 --> 01:24:11.240
 aber nicht zwingend darauf.

01:24:11.240 --> 01:24:11.720
 Ja,

01:24:11.720 --> 01:24:13.240
 das ist mein Lieblingsselektor,

01:24:13.240 --> 01:24:13.580
 äh,

01:24:13.580 --> 01:24:14.040
 Kombinator,

01:24:14.040 --> 01:24:15.280
 den benutze ich am allerliebsten.

01:24:15.280 --> 01:24:16.780
 Und den kennen die wenigsten.

01:24:16.780 --> 01:24:17.020
 Ja.

01:24:17.020 --> 01:24:17.800
 Oder sagen wir mal so.

01:24:17.800 --> 01:24:19.100
 Ich nutze ihn relativ selten,

01:24:19.100 --> 01:24:19.620
 muss ich sagen.

01:24:19.620 --> 01:24:21.140
 Wenn irgendjemand den nicht,

01:24:21.140 --> 01:24:22.820
 also irgendeinen von denen nicht kennt,

01:24:22.820 --> 01:24:23.740
 dann ist das die Tilde.

01:24:23.740 --> 01:24:24.800
 Mhm.

01:24:25.480 --> 01:24:27.660
 Also das benutze ich aber echt gerne.

01:24:27.660 --> 01:24:29.960
 Also gerade so im Zusammenhang mit,

01:24:29.960 --> 01:24:30.260
 ähm,

01:24:30.260 --> 01:24:31.780
 ich möchte das,

01:24:31.780 --> 01:24:32.700
 etwas,

01:24:32.700 --> 01:24:34.560
 das nach einem Checkt,

01:24:34.560 --> 01:24:35.100
 äh,

01:24:35.100 --> 01:24:35.840
 vom, äh,

01:24:35.840 --> 01:24:36.740
 Input oder so,

01:24:36.740 --> 01:24:37.760
 irgendwie sich verändert,

01:24:37.760 --> 01:24:38.160
 nochmal,

01:24:38.160 --> 01:24:38.940
 ähm,

01:24:38.940 --> 01:24:40.000
 gerade dafür,

01:24:40.000 --> 01:24:40.240
 äh,

01:24:40.240 --> 01:24:41.340
 eignet sich das echt gut.

01:24:41.340 --> 01:24:42.640
 Also vielleicht muss man das auch erwähnen,

01:24:42.640 --> 01:24:43.360
 für Leute,

01:24:43.360 --> 01:24:44.980
 denen das vielleicht nicht klar ist,

01:24:44.980 --> 01:24:46.100
 das geht jetzt nicht nur mit,

01:24:46.100 --> 01:24:46.880
 mit, äh,

01:24:46.880 --> 01:24:48.120
 Tag-Namen,

01:24:48.120 --> 01:24:48.440
 also,

01:24:48.440 --> 01:24:49.560
 oder Element-Typen,

01:24:49.560 --> 01:24:50.500
 also Diff und Spans,

01:24:50.580 --> 01:24:51.360
 natürlich auch mit Klassen,

01:24:51.360 --> 01:24:52.160
 also ich kann auch sagen,

01:24:52.160 --> 01:24:52.900
 äh,

01:24:52.900 --> 01:24:54.500
 wenn ein Element mit der Klasse so und so,

01:24:54.500 --> 01:24:55.040
 ein Kind,

01:24:55.040 --> 01:24:55.400
 ein,

01:24:55.400 --> 01:24:56.940
 ein direktes Sibling-Element

01:24:56.940 --> 01:24:58.400
 von einem anderen Element ist.

01:24:58.400 --> 01:24:59.620
 Mit all diesen Klassen,

01:24:59.620 --> 01:25:00.880
 also generell mit allen Selektoren.

01:25:00.880 --> 01:25:02.340
 Gut,

01:25:02.340 --> 01:25:03.160
 dann, äh,

01:25:03.160 --> 01:25:03.520
 Baum,

01:25:03.520 --> 01:25:04.760
 Dokument-Struktur,

01:25:04.760 --> 01:25:05.960
 das ist nicht übersetzt.

01:25:05.960 --> 01:25:08.100
 Which of these structure-related CSS-Selectors

01:25:08.100 --> 01:25:08.880
 have you used?

01:25:08.880 --> 01:25:09.200
 Hui.

01:25:09.200 --> 01:25:11.320
 Also Root für CSS-Variablen,

01:25:11.320 --> 01:25:12.720
 Empty für Elemente,

01:25:12.720 --> 01:25:13.780
 die keinen Content enthalten,

01:25:13.780 --> 01:25:15.140
 das ist manchmal auch ganz praktisch,

01:25:15.140 --> 01:25:16.280
 wenn man da leere Spalten hat,

01:25:16.280 --> 01:25:17.220
 die dann irgendwie aber trotzdem

01:25:17.220 --> 01:25:18.440
 sich aufspannen sollen oder so.

01:25:18.440 --> 01:25:19.140
 Äh,

01:25:19.140 --> 01:25:20.500
 Not-Selektor,

01:25:20.580 --> 01:25:21.420
 heute benutzt.

01:25:21.420 --> 01:25:23.200
 Brauche ich auch sehr häufig inzwischen.

01:25:23.200 --> 01:25:24.400
 End-Child.

01:25:24.400 --> 01:25:25.060
 End-Child sehr selten.

01:25:25.060 --> 01:25:26.380
 Ähm,

01:25:26.380 --> 01:25:26.780
 ja,

01:25:26.780 --> 01:25:27.800
 manchmal ganz praktisch.

01:25:27.800 --> 01:25:28.600
 glaube ich,

01:25:28.600 --> 01:25:28.940
 habe ich noch nie verwendet.

01:25:28.940 --> 01:25:29.900
 End-Last-Child,

01:25:29.900 --> 01:25:30.180
 doch,

01:25:30.180 --> 01:25:31.260
 habe ich auch schon mal verwendet,

01:25:31.260 --> 01:25:32.180
 aber glaube ich auch eher

01:25:32.180 --> 01:25:33.020
 in so einer Spielerei.

01:25:33.020 --> 01:25:34.000
 Äh,

01:25:34.000 --> 01:25:34.580
 First-Child,

01:25:34.580 --> 01:25:35.120
 Last-Child,

01:25:35.120 --> 01:25:35.300
 ja,

01:25:35.300 --> 01:25:36.540
 doch auch recht häufig.

01:25:36.540 --> 01:25:37.760
 Only-Child,

01:25:37.760 --> 01:25:37.920
 manchmal.

01:25:37.920 --> 01:25:37.920
 Only-Child,

01:25:37.920 --> 01:25:39.180
 kenne ich noch nie verwendet.

01:25:39.180 --> 01:25:39.980
 Äh,

01:25:39.980 --> 01:25:41.000
 End-Of-Type,

01:25:41.000 --> 01:25:42.120
 habe ich schon verwendet,

01:25:42.120 --> 01:25:43.220
 End-Last-Of-Type,

01:25:43.220 --> 01:25:43.480
 also,

01:25:43.480 --> 01:25:45.380
 das letzte Diff in einem,

01:25:45.380 --> 01:25:46.180
 äh,

01:25:46.180 --> 01:25:47.180
 am besten kein Diff,

01:25:47.180 --> 01:25:47.400
 ne,

01:25:50.580 --> 01:25:51.480
 Element mit einer bestimmten Klasse

01:25:51.480 --> 01:25:53.140
 innerhalb von einem Element zum Beispiel.

01:25:53.140 --> 01:25:54.080
 Ähm,

01:25:54.080 --> 01:25:55.880
 First-Of-Type,

01:25:55.880 --> 01:25:56.320
 Last-Of-Type.

01:25:56.320 --> 01:25:56.400
 Also,

01:25:56.400 --> 01:25:57.440
 die meisten von diesen Type-Dingern,

01:25:57.440 --> 01:25:57.780
 ich glaube,

01:25:57.780 --> 01:25:58.440
 da habe ich,

01:25:58.440 --> 01:25:59.180
 glaube ich noch nicht.

01:25:59.180 --> 01:26:00.380
 Only-Of-Type.

01:26:00.380 --> 01:26:01.200
 Habe ich nie gebraucht.

01:26:01.200 --> 01:26:01.680
 Das ist das Gleiche.

01:26:01.680 --> 01:26:02.780
 Dann gibt's Lang,

01:26:02.780 --> 01:26:03.900
 tatsächlich,

01:26:03.900 --> 01:26:04.620
 äh,

01:26:04.620 --> 01:26:06.600
 Sprachselektor,

01:26:06.600 --> 01:26:07.700
 habe ich noch nicht gebraucht.

01:26:07.700 --> 01:26:09.120
 Nee,

01:26:09.120 --> 01:26:09.660
 ich auch nicht.

01:26:09.660 --> 01:26:10.840
 Dann gibt's Is-And-Where,

01:26:10.840 --> 01:26:12.140
 da hatten wir es auch schon mal drüber,

01:26:12.140 --> 01:26:14.020
 weil das jetzt recht neu in Chrome ist,

01:26:14.020 --> 01:26:14.420
 da gibt's auch,

01:26:14.420 --> 01:26:14.920
 äh,

01:26:14.920 --> 01:26:15.880
 weiß ich gar nicht,

01:26:15.880 --> 01:26:17.940
 ob ich dann Update dazu gesagt habe,

01:26:17.940 --> 01:26:19.140
 in den letzten Folgen,

01:26:19.500 --> 01:26:19.680
 ähm,

01:26:19.680 --> 01:26:20.540
 da hat sich jetzt was getan,

01:26:20.540 --> 01:26:21.180
 also das Ticket,

01:26:21.180 --> 01:26:21.700
 ähm,

01:26:21.700 --> 01:26:24.000
 ist jetzt im Endeffekt durch

01:26:24.000 --> 01:26:25.560
 und das wird demnächst in Chrome,

01:26:25.560 --> 01:26:26.300
 äh,

01:26:26.300 --> 01:26:29.600
 als fixes Feature kommen.

01:26:29.600 --> 01:26:30.540
 Cool.

01:26:30.540 --> 01:26:31.780
 Ähm,

01:26:31.780 --> 01:26:33.160
 Attribute.

01:26:33.160 --> 01:26:34.760
 Also,

01:26:34.760 --> 01:26:36.840
 Diff und den eckigen Klammern.

01:26:36.840 --> 01:26:37.540
 Wir gehen hier echt einmal quer durch CSS,

01:26:37.540 --> 01:26:39.480
 dass das ja nicht einmal aus da drin ist.

01:26:39.480 --> 01:26:40.280
 Äh,

01:26:40.280 --> 01:26:40.520
 Diff,

01:26:40.520 --> 01:26:41.140
 eckige Klammern,

01:26:41.140 --> 01:26:41.620
 also,

01:26:41.620 --> 01:26:43.220
 wir machen echt,

01:26:43.220 --> 01:26:43.520
 äh,

01:26:43.520 --> 01:26:43.860
 ich weiß nicht,

01:26:43.860 --> 01:26:45.120
 ob wir das echt bis zum Ende.

01:26:45.120 --> 01:26:45.980
 Ach, das schaffen wir noch,

01:26:45.980 --> 01:26:46.180
 komm.

01:26:46.180 --> 01:26:46.740
 Weißt du?

01:26:46.740 --> 01:26:48.780
 Wir haben jetzt schon eineinhalb Stunden,

01:26:48.920 --> 01:26:49.620
 meine Frisei.

01:26:49.620 --> 01:26:49.840
 Okay,

01:26:49.840 --> 01:26:50.780
 müssen wir uns jetzt echt beeilen.

01:26:50.780 --> 01:26:51.280
 So,

01:26:51.280 --> 01:26:51.960
 ähm,

01:26:51.960 --> 01:26:52.960
 wir waren bei Attribute-Selektoren.

01:26:52.960 --> 01:26:54.380
 Ich editiere es einfach auf doppelte Geschwindigkeit.

01:26:54.380 --> 01:26:55.260
 Äh,

01:26:55.260 --> 01:26:55.720
 Attribute,

01:26:55.720 --> 01:26:56.580
 also,

01:26:56.580 --> 01:26:57.520
 ein Diff mit dem,

01:26:57.520 --> 01:26:59.180
 mit dem Attribut Foo,

01:26:59.180 --> 01:27:00.760
 Diff mit dem Attribut Foo,

01:27:00.760 --> 01:27:02.000
 und einem speziellen Value,

01:27:02.000 --> 01:27:02.820
 äh,

01:27:02.820 --> 01:27:02.980
 äh,

01:27:02.980 --> 01:27:03.740
 äh,

01:27:03.740 --> 01:27:03.980
 äh,

01:27:03.980 --> 01:27:04.540
 äh,

01:27:04.540 --> 01:27:04.540
 äh,

01:27:04.540 --> 01:27:04.880
 ähm,

01:27:04.880 --> 01:27:05.540
 ein Diff,

01:27:05.540 --> 01:27:06.440
 das mit dem,

01:27:06.440 --> 01:27:09.400
 wo das Attribut Foo mit dem Wort Bar beginnt.

01:27:09.400 --> 01:27:09.860
 Ja,

01:27:09.860 --> 01:27:10.060
 also,

01:27:10.060 --> 01:27:11.420
 das habe ich alles schon mal endet mit,

01:27:11.420 --> 01:27:12.400
 startet mit,

01:27:12.400 --> 01:27:13.120
 beinhaltet,

01:27:13.120 --> 01:27:14.280
 auch schon benutzt,

01:27:14.280 --> 01:27:15.860
 Sternchen gleich heißt einfach,

01:27:15.860 --> 01:27:16.300
 äh,

01:27:16.300 --> 01:27:17.640
 was ist denn da der Unterschied?

01:27:17.640 --> 01:27:20.700
 Tilde gleich und Sternchen gleich?

01:27:20.700 --> 01:27:22.880
 Ach,

01:27:22.880 --> 01:27:24.640
 beinhaltet Wort und beinhaltet Zeichen,

01:27:24.640 --> 01:27:24.860
 ja.

01:27:25.280 --> 01:27:25.420
 Also,

01:27:25.420 --> 01:27:26.080
 ähm,

01:27:26.080 --> 01:27:26.280
 also,

01:27:26.280 --> 01:27:27.240
 das habe ich noch nicht verwendet.

01:27:27.240 --> 01:27:27.460
 Ich glaube, das ist,

01:27:27.460 --> 01:27:29.420
 meistens wird man das brauchen bei,

01:27:29.420 --> 01:27:29.920
 äh,

01:27:29.920 --> 01:27:30.940
 Class zum Beispiel,

01:27:30.940 --> 01:27:34.260
 aber dann kann ich es ja auch als Klasse benutzen.

01:27:34.260 --> 01:27:35.540
 Aber wenn ich jetzt ein Attribut habe,

01:27:35.540 --> 01:27:36.640
 das ähnlich wie,

01:27:36.640 --> 01:27:38.040
 wie das Class-Attribut funktioniert,

01:27:38.040 --> 01:27:38.340
 das heißt,

01:27:38.340 --> 01:27:39.300
 ich habe bestimmte Keywords,

01:27:39.300 --> 01:27:40.060
 die da drin stehen,

01:27:40.060 --> 01:27:41.540
 und das können ein oder mehrere sein.

01:27:41.540 --> 01:27:43.320
 Wenn ich jetzt, ähm,

01:27:43.320 --> 01:27:45.000
 Sternchen gleich Bar mache,

01:27:45.000 --> 01:27:46.360
 dann heißt das,

01:27:46.360 --> 01:27:47.000
 dass wenn das,

01:27:47.000 --> 01:27:48.900
 wenn das Wort Foo Bar drin vorkommt,

01:27:48.900 --> 01:27:50.480
 dann würde das auch matchen,

01:27:50.480 --> 01:27:52.700
 obwohl ja nicht Bar einzeln vorkommt.

01:27:52.700 --> 01:27:53.380
 Wenn ich jetzt aber,

01:27:53.380 --> 01:27:54.140
 jetzt mal ehrlich,

01:27:54.140 --> 01:27:54.660
 also,

01:27:55.280 --> 01:27:57.860
 wieso benutze ich da nicht einfach die Klasse?

01:27:57.860 --> 01:27:59.620
 Na gut,

01:27:59.620 --> 01:28:02.720
 also fürs Class würdest du es tatsächlich über die Klasse machen,

01:28:02.720 --> 01:28:04.260
 aber wenn ich jetzt ein Data-Attribut habe,

01:28:04.260 --> 01:28:06.240
 in dem mehrere Werte drin stehen können,

01:28:06.240 --> 01:28:07.460
 dann sage ich hier,

01:28:07.460 --> 01:28:10.900
 Data XY beinhaltet speziell das Wort.

01:28:10.900 --> 01:28:12.040
 Wow.

01:28:12.040 --> 01:28:12.800
 Ja,

01:28:12.800 --> 01:28:13.140
 habe ich,

01:28:13.140 --> 01:28:13.740
 habe ich wirklich,

01:28:13.740 --> 01:28:14.260
 ähm,

01:28:14.260 --> 01:28:14.760
 also,

01:28:14.760 --> 01:28:15.680
 ich glaube,

01:28:15.680 --> 01:28:16.640
 beginnt mit,

01:28:16.640 --> 01:28:17.340
 endet mit,

01:28:17.340 --> 01:28:18.540
 habe ich schon mal verwendet,

01:28:18.540 --> 01:28:19.080
 ähm,

01:28:19.080 --> 01:28:20.320
 die,

01:28:20.320 --> 01:28:22.320
 die unteren beiden mit der Tilde und dem Stern,

01:28:22.320 --> 01:28:22.900
 ähm,

01:28:22.900 --> 01:28:23.460
 boah,

01:28:23.620 --> 01:28:23.740
 nee,

01:28:23.740 --> 01:28:24.540
 ich glaube noch nicht.

01:28:24.540 --> 01:28:26.480
 Ich glaube noch nicht.

01:28:26.480 --> 01:28:28.460
 Dann haben wir hier,

01:28:28.460 --> 01:28:28.880
 äh,

01:28:28.880 --> 01:28:30.600
 Link und URL related.

01:28:30.600 --> 01:28:31.960
 Doppelpunkt,

01:28:31.960 --> 01:28:32.860
 any minus link.

01:28:32.860 --> 01:28:34.400
 Nö.

01:28:34.400 --> 01:28:34.660
 Nee.

01:28:34.660 --> 01:28:36.200
 Sagt mir nichts.

01:28:36.200 --> 01:28:37.400
 Kannst du mal aufschreiben.

01:28:37.400 --> 01:28:38.720
 Ähm,

01:28:38.720 --> 01:28:40.360
 dann haben wir Doppelpunkt,

01:28:40.360 --> 01:28:42.320
 Link Selector und Visitor Selector.

01:28:42.320 --> 01:28:42.560
 Ja.

01:28:43.340 --> 01:28:43.500
 Oh,

01:28:43.500 --> 01:28:44.260
 Local Link,

01:28:44.260 --> 01:28:44.660
 das ist noch nicht.

01:28:44.660 --> 01:28:46.240
 Local Link sagt mir auch nichts.

01:28:46.240 --> 01:28:46.940
 Kenn ich auch noch nicht.

01:28:46.940 --> 01:28:47.620
 Ist das,

01:28:47.620 --> 01:28:48.420
 ist das vielleicht einer,

01:28:48.420 --> 01:28:50.420
 der kein HTTP oder sowas dabei hat?

01:28:50.420 --> 01:28:51.660
 Ich weiß es tatsächlich nicht.

01:28:51.660 --> 01:28:51.720
 Ah,

01:28:51.720 --> 01:28:52.440
 relative Links,

01:28:52.440 --> 01:28:52.720
 mhm.

01:28:52.720 --> 01:28:54.480
 Ja.

01:28:54.480 --> 01:28:55.900
 Damit könnte man dann irgendwie,

01:28:55.900 --> 01:28:57.620
 ja,

01:28:57.620 --> 01:28:58.300
 keine Ahnung.

01:28:58.300 --> 01:28:58.800
 Keine Ahnung.

01:28:58.800 --> 01:28:59.640
 Könnte sein,

01:28:59.640 --> 01:29:00.480
 müssen wir sagen.

01:29:00.480 --> 01:29:02.760
 Target haben wir tatsächlich verwendet

01:29:02.760 --> 01:29:04.040
 auf unserer Seite für den Player.

01:29:04.040 --> 01:29:05.500
 Korrekt.

01:29:05.620 --> 01:29:07.200
 Da wird das Element selektiert,

01:29:07.200 --> 01:29:10.400
 das dem aktuellen Hash in der URL entspricht.

01:29:10.400 --> 01:29:12.660
 Korrekt.

01:29:12.660 --> 01:29:13.120
 Und,

01:29:13.120 --> 01:29:13.380
 äh,

01:29:13.380 --> 01:29:14.240
 das haben wir bei uns,

01:29:14.240 --> 01:29:15.460
 also da wird dann angehängt,

01:29:15.460 --> 01:29:16.160
 äh,

01:29:16.160 --> 01:29:18.620
 Raute Show minus Player an die URL

01:29:18.620 --> 01:29:19.940
 und dann wird,

01:29:19.940 --> 01:29:21.800
 wenn das vorhanden ist in der URL,

01:29:21.800 --> 01:29:23.020
 tatsächlich das Element,

01:29:23.020 --> 01:29:23.580
 ähm,

01:29:23.580 --> 01:29:25.760
 mit Display Block angezeigt,

01:29:25.760 --> 01:29:26.640
 das Player Element.

01:29:26.640 --> 01:29:27.500
 Ja.

01:29:27.500 --> 01:29:29.320
 Ist für so lustige Spielereien

01:29:29.320 --> 01:29:29.820
 und für,

01:29:29.820 --> 01:29:32.960
 ohne JavaScript was sichtbar und unsichtbar machen,

01:29:32.960 --> 01:29:33.660
 ist das ganz cool.

01:29:33.660 --> 01:29:34.780
 Ähm,

01:29:34.900 --> 01:29:36.000
 es gibt dafür,

01:29:36.000 --> 01:29:36.440
 also ich glaube,

01:29:36.440 --> 01:29:38.660
 der Anwendungsfall ist eigentlich der ursprüngliche,

01:29:38.660 --> 01:29:39.580
 der für den es gedacht war,

01:29:39.580 --> 01:29:40.380
 ist eigentlich noch ein anderer

01:29:40.380 --> 01:29:42.620
 und so setze ich das gerade ein bei mir auf der Arbeit

01:29:42.620 --> 01:29:43.440
 und zwar, ähm,

01:29:43.440 --> 01:29:44.260
 äh,

01:29:44.260 --> 01:29:46.220
 klassische Seite mit viel,

01:29:46.220 --> 01:29:48.320
 mit vielen Posts oder Kommentaren,

01:29:48.320 --> 01:29:49.240
 ähm,

01:29:49.240 --> 01:29:50.600
 und dann kann es sein,

01:29:50.600 --> 01:29:51.840
 dass man ja einen Link kriegt,

01:29:51.840 --> 01:29:52.200
 ähm,

01:29:52.200 --> 01:29:54.300
 zu einem bestimmten Kommentar auf der Seite,

01:29:54.300 --> 01:29:56.060
 also der vielleicht relativ weit unten ist.

01:29:56.060 --> 01:29:56.420
 Mhm.

01:29:56.420 --> 01:29:57.000
 Ähm,

01:29:57.000 --> 01:29:58.700
 und dann springt das da hin

01:29:58.700 --> 01:30:00.500
 und dann kann ich zum Beispiel animieren,

01:30:00.500 --> 01:30:01.140
 ähm,

01:30:01.140 --> 01:30:01.420
 und,

01:30:01.420 --> 01:30:02.540
 und das dann hervorheben,

01:30:02.540 --> 01:30:03.580
 diesen einen Kommentar.

01:30:03.580 --> 01:30:03.620
 Genau,

01:30:03.620 --> 01:30:04.720
 hervorheben ist zum Beispiel auch.

01:30:04.720 --> 01:30:05.400
 Oder den einen,

01:30:05.400 --> 01:30:07.280
 oder den Post auf der Seite hervorheben

01:30:07.280 --> 01:30:08.280
 und ich hab das dann also so,

01:30:08.280 --> 01:30:09.440
 dass das dann ein bisschen hinterlegt ist

01:30:09.440 --> 01:30:10.020
 mit einer Farbe

01:30:10.020 --> 01:30:11.220
 und dann noch so eine kleine Animation,

01:30:11.220 --> 01:30:12.760
 dass das quasi so ein bisschen aufblinkt,

01:30:12.760 --> 01:30:13.440
 wenn man da hinkommt.

01:30:13.440 --> 01:30:15.580
 Also dafür ist das sehr, sehr praktisch.

01:30:16.000 --> 01:30:16.820
 Gut, dann haben wir, äh,

01:30:16.820 --> 01:30:16.820
 äh,

01:30:16.820 --> 01:30:17.320
 Hover,

01:30:17.320 --> 01:30:17.340
 Hover,

01:30:17.340 --> 01:30:17.980
 Active,

01:30:17.980 --> 01:30:18.800
 Focus,

01:30:18.800 --> 01:30:20.220
 ähm,

01:30:20.220 --> 01:30:20.680
 ja.

01:30:20.680 --> 01:30:21.620
 Focus Within,

01:30:21.620 --> 01:30:22.280
 Focus Visible,

01:30:22.280 --> 01:30:24.240
 da hatten wir es jetzt auch gerade erst davon.

01:30:24.240 --> 01:30:25.100
 Genau.

01:30:25.100 --> 01:30:25.540
 Brauchen wir, glaube ich,

01:30:25.540 --> 01:30:26.440
 nichts weiter dazu zu sagen.

01:30:26.440 --> 01:30:26.760
 Nee,

01:30:26.760 --> 01:30:27.700
 Formularfelder,

01:30:27.700 --> 01:30:29.560
 Enabled und Disabled als Selector.

01:30:29.560 --> 01:30:29.860
 Interessant.

01:30:29.860 --> 01:30:30.920
 Enabled hab ich,

01:30:30.920 --> 01:30:31.740
 ich wusste gar nicht,

01:30:31.740 --> 01:30:32.720
 dass es Enabled gibt,

01:30:32.720 --> 01:30:33.640
 ich kenn nur Disabled.

01:30:33.640 --> 01:30:35.240
 Ja, tatsächlich.

01:30:35.240 --> 01:30:35.520
 Wusste ich gar nicht,

01:30:35.520 --> 01:30:36.800
 dass es da ein Gegenstück zu gibt.

01:30:36.800 --> 01:30:37.740
 Äh,

01:30:37.740 --> 01:30:38.980
 Read Only und Read Write,

01:30:39.080 --> 01:30:39.440
 Okay,

01:30:39.440 --> 01:30:40.760
 das wusste ich jetzt zum Beispiel auch nicht,

01:30:40.760 --> 01:30:42.120
 dass man das, äh,

01:30:42.120 --> 01:30:43.200
 tatsächlich selektieren kann.

01:30:43.200 --> 01:30:43.820
 Interessant.

01:30:43.820 --> 01:30:46.400
 Placeholder Shown hatte ich gerade erst letztens.

01:30:46.400 --> 01:30:46.800
 Oh ja,

01:30:46.800 --> 01:30:48.260
 da hab ich schon eklige Sachen mitgemacht,

01:30:48.260 --> 01:30:50.860
 weil da auch der Internet Explorer merkwürdige Dinge tut.

01:30:50.860 --> 01:30:52.580
 Doppelpunkt Default.

01:30:52.580 --> 01:30:54.420
 Das sagt mir jetzt nix.

01:30:54.420 --> 01:30:55.040
 Au.

01:30:55.040 --> 01:30:56.060
 Ist das das,

01:30:56.060 --> 01:30:56.280
 wenn,

01:30:56.280 --> 01:31:00.540
 wenn das beim Laden der Seite quasi schon das Checked Attribut vielleicht enthält?

01:31:00.540 --> 01:31:01.660
 Ah,

01:31:01.660 --> 01:31:01.860
 es könnte auch sein.

01:31:01.860 --> 01:31:04.880
 Und im Vergleich dazu dann aber Checked jedes sein kann,

01:31:04.880 --> 01:31:06.200
 dass das später bekommt, oder?

01:31:06.200 --> 01:31:08.100
 Oder in einem Input-Feld,

01:31:08.200 --> 01:31:10.120
 da kannst du ja auch einen Default-Value drin haben,

01:31:10.120 --> 01:31:11.340
 der schon drinsteht.

01:31:11.340 --> 01:31:13.520
 Das muss ich mir direkt mal anschauen.

01:31:13.520 --> 01:31:14.560
 Und dann könnte es sein,

01:31:14.560 --> 01:31:15.800
 dass das weggeht in dem Augenblick,

01:31:15.800 --> 01:31:16.400
 wo du,

01:31:16.400 --> 01:31:17.160
 äh,

01:31:17.160 --> 01:31:18.240
 wo du den veränderst.

01:31:18.240 --> 01:31:20.100
 Weiß ich aber tatsächlich nicht.

01:31:20.100 --> 01:31:21.140
 Also wir werden über die Sachen,

01:31:21.140 --> 01:31:21.960
 die wir jetzt aufschreiben,

01:31:21.960 --> 01:31:22.720
 auf jeden Fall mal,

01:31:22.720 --> 01:31:23.020
 äh,

01:31:23.020 --> 01:31:23.700
 uns schlau machen

01:31:23.700 --> 01:31:25.340
 und dann auch sicherlich mal drüber sprechen.

01:31:25.340 --> 01:31:25.920
 Ja.

01:31:25.920 --> 01:31:26.360
 Gut,

01:31:26.360 --> 01:31:27.840
 Checked Indeterminate.

01:31:27.840 --> 01:31:28.700
 Nö.

01:31:28.700 --> 01:31:30.100
 Kann ich mir was darunter vorstellen,

01:31:30.100 --> 01:31:30.880
 aber ich weiß gar nicht,

01:31:30.880 --> 01:31:31.900
 ob es das mittlerweile gibt,

01:31:31.900 --> 01:31:33.240
 Indeterminate-Checkboxes.

01:31:33.240 --> 01:31:34.060
 Gibt's das mittlerweile?

01:31:34.060 --> 01:31:35.500
 Können das,

01:31:35.500 --> 01:31:37.060
 kann das die Browser?

01:31:37.320 --> 01:31:37.500
 Äh,

01:31:37.500 --> 01:31:37.760
 das,

01:31:37.760 --> 01:31:38.060
 äh,

01:31:38.060 --> 01:31:39.560
 glaub ich nicht.

01:31:39.560 --> 01:31:40.120
 Oder?

01:31:40.120 --> 01:31:40.720
 Also,

01:31:40.720 --> 01:31:42.100
 wenn's den Selector gibt,

01:31:42.100 --> 01:31:43.180
 scheint's auch jemanden zu geben,

01:31:43.180 --> 01:31:43.820
 der das unterstützt,

01:31:43.820 --> 01:31:44.740
 sonst würde es keinen Sinn machen,

01:31:44.740 --> 01:31:45.020
 aber,

01:31:45.020 --> 01:31:46.180
 ähm,

01:31:46.180 --> 01:31:46.780
 ja.

01:31:46.780 --> 01:31:48.280
 Ja,

01:31:48.280 --> 01:31:48.640
 Valid,

01:31:48.640 --> 01:31:49.340
 Invalid,

01:31:49.340 --> 01:31:50.480
 klar.

01:31:50.480 --> 01:31:50.840
 Mhm,

01:31:50.840 --> 01:31:51.540
 Formvalidierung,

01:31:51.540 --> 01:31:52.000
 äh,

01:31:52.000 --> 01:31:52.720
 User Invalid,

01:31:52.720 --> 01:31:53.600
 sagt mir jetzt auch nix.

01:31:53.600 --> 01:31:54.680
 Inrange,

01:31:54.680 --> 01:31:55.320
 Out of Range

01:31:55.320 --> 01:31:56.300
 ist bestimmt für,

01:31:56.300 --> 01:31:58.340
 Range,

01:31:58.340 --> 01:31:59.540
 Elemente.

01:31:59.540 --> 01:31:59.700
 Gott,

01:31:59.700 --> 01:32:00.860
 wir machen uns hier so nackig,

01:32:00.860 --> 01:32:01.000
 ey,

01:32:01.000 --> 01:32:02.360
 danach hört ihr den Podcast nie wieder,

01:32:02.360 --> 01:32:02.720
 weil ihr denkt,

01:32:02.720 --> 01:32:03.860
 wir haben eigentlich keine Ahnung,

01:32:03.860 --> 01:32:04.240
 die wissen,

01:32:04.240 --> 01:32:05.980
 die wissen gar nix,

01:32:05.980 --> 01:32:07.320
 wissen die.

01:32:08.380 --> 01:32:10.740
 Ich bin jetzt aber auch nicht der CSS-Spezialist,

01:32:10.740 --> 01:32:11.140
 also, ne,

01:32:11.140 --> 01:32:11.520
 ich bin,

01:32:11.520 --> 01:32:15.300
 ich bin doch eher tendenziell dann Richtung JavaScript vor.

01:32:15.300 --> 01:32:15.500
 Ja,

01:32:15.500 --> 01:32:16.860
 ich jetzt auch nicht mehr.

01:32:16.860 --> 01:32:22.240
 Wird required und optional ist auch klar.

01:32:22.240 --> 01:32:22.720
 Ja.

01:32:22.720 --> 01:32:26.300
 Dann kommen wir jetzt zu den Pre- und Post-Prozessoren.

01:32:26.300 --> 01:32:27.700
 Das ist vielleicht für,

01:32:27.700 --> 01:32:28.380
 für Leute,

01:32:28.380 --> 01:32:31.920
 die gar nicht mit irgendwelchen Build-Systemen und so arbeiten,

01:32:31.920 --> 01:32:32.980
 sondern wirklich, ähm,

01:32:32.980 --> 01:32:33.860
 nur,

01:32:33.860 --> 01:32:35.180
 nur in Anführungsstrichen,

01:32:35.180 --> 01:32:35.800
 HTML,

01:32:35.800 --> 01:32:36.340
 CSS,

01:32:36.340 --> 01:32:38.060
 vielleicht JavaScript im Browser,

01:32:38.060 --> 01:32:38.560
 äh,

01:32:38.560 --> 01:32:40.800
 also im Editor schreiben und, äh,

01:32:40.800 --> 01:32:42.000
 so ist das ein,

01:32:42.000 --> 01:32:43.400
 eine schwarze Box.

01:32:43.400 --> 01:32:44.720
 Ähm,

01:32:45.300 --> 01:32:47.260
 aber wir gehen jetzt trotzdem mal durch.

01:32:47.260 --> 01:32:48.040
 Äh,

01:32:48.040 --> 01:32:48.380
 Sass,

01:32:48.380 --> 01:32:49.380
 jo,

01:32:49.380 --> 01:32:50.380
 schon mal verwendet.

01:32:50.380 --> 01:32:50.980
 Ach so,

01:32:50.980 --> 01:32:52.420
 oder kann man jetzt sogar werten?

01:32:52.420 --> 01:32:52.940
 Aha.

01:32:52.940 --> 01:32:53.380
 Ja,

01:32:53.380 --> 01:32:54.720
 würde ich wiederverwenden,

01:32:54.720 --> 01:32:55.400
 kein Interesse.

01:32:55.400 --> 01:32:55.500
 Genau,

01:32:55.500 --> 01:32:55.860
 nicht sicher,

01:32:55.860 --> 01:32:56.200
 ob es geht,

01:32:56.200 --> 01:32:56.940
 möchte lernen,

01:32:56.940 --> 01:32:57.680
 kein Interesse,

01:32:57.680 --> 01:32:58.580
 würde ich wiederverwenden,

01:32:58.580 --> 01:32:59.680
 würde ich nicht wiederverwenden.

01:32:59.680 --> 01:33:02.120
 Da muss ich mich jetzt aber auch noch entscheiden.

01:33:02.120 --> 01:33:04.360
 Ich würde es wiederverwenden

01:33:04.360 --> 01:33:05.260
 und ich verwende es gerade.

01:33:05.260 --> 01:33:05.460
 Ja,

01:33:05.460 --> 01:33:06.540
 ich würde es wiederverwenden,

01:33:06.540 --> 01:33:07.040
 äh,

01:33:07.040 --> 01:33:10.620
 ich nutze tatsächlich eher less als Sass.

01:33:10.620 --> 01:33:12.760
 Kann dir gar nicht sagen,

01:33:12.760 --> 01:33:13.080
 warum.

01:33:13.080 --> 01:33:13.560
 Ich glaube,

01:33:13.560 --> 01:33:14.400
 das war einfach das Erste,

01:33:14.400 --> 01:33:15.180
 was ich gelernt habe.

01:33:15.300 --> 01:33:16.400
 Ähm,

01:33:16.400 --> 01:33:17.240
 PostCSS,

01:33:17.240 --> 01:33:17.680
 jo,

01:33:17.680 --> 01:33:19.380
 habe ich auch schon verwendet.

01:33:19.380 --> 01:33:21.000
 Das macht eben genau solche Sachen,

01:33:21.000 --> 01:33:22.280
 da gibt es verschiedene Filter,

01:33:22.280 --> 01:33:23.020
 auch Plugins,

01:33:23.020 --> 01:33:23.480
 ähm,

01:33:23.480 --> 01:33:25.980
 das macht so Sachen wie eben,

01:33:25.980 --> 01:33:26.500
 äh,

01:33:26.500 --> 01:33:28.300
 Vendor-Prefixes davor setzen.

01:33:28.300 --> 01:33:29.160
 Ja.

01:33:29.160 --> 01:33:29.480
 Oder,

01:33:29.480 --> 01:33:30.120
 ähm,

01:33:30.120 --> 01:33:31.060
 was wir da vorhin hatten,

01:33:31.060 --> 01:33:33.280
 wenn da eine Browser irgendwie ausreißt

01:33:33.280 --> 01:33:34.360
 und der braucht dann ein anderes,

01:33:34.360 --> 01:33:34.940
 äh,

01:33:34.940 --> 01:33:35.400
 Attribut,

01:33:35.400 --> 01:33:36.440
 weil das einfach anders heißt,

01:33:36.440 --> 01:33:37.340
 dann,

01:33:37.340 --> 01:33:39.040
 Moritz lässt es vor Schrecks ein Bier fallen,

01:33:39.040 --> 01:33:39.740
 ähm,

01:33:39.820 --> 01:33:42.200
 dann macht es das automatisch.

01:33:42.200 --> 01:33:43.460
 also wenn man jetzt irgendwie, ähm,

01:33:43.460 --> 01:33:45.080
 Webpack oder sowas nutzt,

01:33:45.080 --> 01:33:45.800
 äh,

01:33:45.800 --> 01:33:47.400
 dann kann man das einsetzen.

01:33:47.400 --> 01:33:49.280
 Stylus,

01:33:49.280 --> 01:33:50.180
 ähm,

01:33:50.180 --> 01:33:50.780
 davon gehört,

01:33:50.780 --> 01:33:51.500
 äh,

01:33:51.500 --> 01:33:52.280
 kein Interesse.

01:33:52.280 --> 01:33:52.860
 Ja,

01:33:52.860 --> 01:33:53.240
 nee,

01:33:53.240 --> 01:33:53.740
 keine Ahnung.

01:33:53.740 --> 01:33:54.640
 Ja,

01:33:54.640 --> 01:33:55.220
 muss nicht sein.

01:33:55.220 --> 01:33:56.900
 Jetzt kann man noch andere eintragen,

01:33:56.900 --> 01:33:57.680
 das machen wir jetzt mal nicht.

01:33:57.680 --> 01:33:58.340
 Also ich hab,

01:33:58.340 --> 01:33:59.000
 ich hab da jetzt auch,

01:33:59.000 --> 01:33:59.340
 glaube ich,

01:33:59.340 --> 01:33:59.580
 nichts.

01:33:59.580 --> 01:34:00.180
 Ähm,

01:34:00.180 --> 01:34:00.400
 doch,

01:34:00.400 --> 01:34:01.440
 da gibt's doch noch von dem,

01:34:01.440 --> 01:34:02.300
 von dem Peter Kröner,

01:34:02.300 --> 01:34:03.700
 das Turbine gab's da mal.

01:34:03.700 --> 01:34:04.380
 Ach Gott.

01:34:04.380 --> 01:34:05.700
 Könnte man jetzt da noch eintragen?

01:34:05.700 --> 01:34:07.660
 Zufriedenheit insgesamt.

01:34:07.660 --> 01:34:10.220
 Wie zufrieden bin ich mit den?

01:34:10.220 --> 01:34:11.160
 Ich würd sagen,

01:34:11.160 --> 01:34:11.840
 sehr neutral.

01:34:11.840 --> 01:34:14.400
 Was mit den unten genannten Optionen?

01:34:14.400 --> 01:34:16.640
 Ähm,

01:34:16.640 --> 01:34:17.500
 ich glaube,

01:34:17.500 --> 01:34:17.800
 Ich glaub,

01:34:17.800 --> 01:34:18.620
 das ist falsch übersetzt,

01:34:18.620 --> 01:34:18.860
 oder?

01:34:18.860 --> 01:34:20.100
 Unten genannten Optionen,

01:34:20.100 --> 01:34:20.760
 das ist, glaube ich,

01:34:20.760 --> 01:34:21.360
 gemeint.

01:34:21.360 --> 01:34:23.180
 Ich,

01:34:23.180 --> 01:34:24.460
 ich übersetze mal kurz auf Englisch.

01:34:24.460 --> 01:34:26.180
 Das macht natürlich keinen Sinn.

01:34:26.180 --> 01:34:27.400
 Ähm,

01:34:28.980 --> 01:34:29.160
 Ja,

01:34:29.160 --> 01:34:29.640
 äh,

01:34:29.640 --> 01:34:30.920
 Options Listed Above.

01:34:30.920 --> 01:34:31.720
 Ja.

01:34:31.720 --> 01:34:32.640
 Ah ja,

01:34:32.640 --> 01:34:33.060
 und vor allem,

01:34:33.060 --> 01:34:33.580
 äh,

01:34:33.580 --> 01:34:34.220
 es geht um den,

01:34:34.220 --> 01:34:34.700
 um den,

01:34:34.700 --> 01:34:34.960
 äh,

01:34:34.960 --> 01:34:37.420
 Current Overall State of Things.

01:34:37.420 --> 01:34:40.840
 As it relates to the Options Listed Above.

01:34:40.840 --> 01:34:41.140
 Also,

01:34:41.140 --> 01:34:42.780
 wie diese genannten Techniken,

01:34:42.780 --> 01:34:43.220
 SAS,

01:34:43.220 --> 01:34:43.540
 LAS,

01:34:43.540 --> 01:34:44.140
 Post CSS,

01:34:44.140 --> 01:34:44.780
 Stylus,

01:34:44.780 --> 01:34:46.460
 wie zufrieden man mit dem,

01:34:46.460 --> 01:34:47.680
 mit dem Ist-Zustand ist.

01:34:47.680 --> 01:34:48.980
 Das ist wirklich schlecht übersetzt.

01:34:48.980 --> 01:34:50.460
 Äh,

01:34:50.460 --> 01:34:51.520
 was soll ich jetzt,

01:34:51.520 --> 01:34:52.040
 äh,

01:34:52.040 --> 01:34:52.820
 neutral.

01:34:52.820 --> 01:34:53.180
 Ja komm,

01:34:53.180 --> 01:34:53.520
 egal,

01:34:53.520 --> 01:34:53.920
 weiter,

01:34:53.920 --> 01:34:54.460
 Frameworks.

01:34:54.460 --> 01:34:55.580
 Ja,

01:34:55.580 --> 01:34:56.180
 nächster Punkt.

01:34:56.180 --> 01:34:56.600
 Gut,

01:34:56.600 --> 01:34:57.080
 äh,

01:34:57.080 --> 01:34:57.460
 Bootstrap.

01:34:57.460 --> 01:34:57.880
 Jetzt mal,

01:34:58.620 --> 01:35:00.240
 Bootstrap habe ich verwendet,

01:35:00.240 --> 01:35:00.880
 würde ich wieder verwendet.

01:35:00.880 --> 01:35:01.560
 Würde ich auch wieder verwendet.

01:35:01.560 --> 01:35:01.780
 Das ist ein gutes Framework.

01:35:01.780 --> 01:35:02.240
 Da würde ich auch wieder verwendet.

01:35:02.240 --> 01:35:03.780
 Materialized CSS, äh,

01:35:03.780 --> 01:35:06.220
 schon mal gehört,

01:35:06.220 --> 01:35:06.660
 ja,

01:35:06.660 --> 01:35:07.400
 weiß nicht,

01:35:07.400 --> 01:35:07.860
 muss nicht,

01:35:07.860 --> 01:35:08.400
 äh,

01:35:08.400 --> 01:35:09.080
 Ant Design kenne ich nicht.

01:35:09.080 --> 01:35:09.560
 Ja, warte mal,

01:35:09.560 --> 01:35:10.180
 sind das,

01:35:10.180 --> 01:35:10.880
 sind das nicht diese,

01:35:10.880 --> 01:35:12.540
 hatten wir es da nicht mal von bei Twitter?

01:35:12.540 --> 01:35:13.420
 Ist das nicht so,

01:35:13.420 --> 01:35:15.840
 ist das nicht so ein Micro-Mini-Framework?

01:35:15.840 --> 01:35:18.160
 Da hast du doch mal vor,

01:35:18.160 --> 01:35:19.400
 vor einer Weile nachgefragt,

01:35:19.400 --> 01:35:21.020
 ob jemand so Mini-Dinger kennt

01:35:21.020 --> 01:35:22.440
 und dann hat sich auch jemand gemeldet.

01:35:22.440 --> 01:35:22.780
 Oder nee,

01:35:22.780 --> 01:35:23.120
 anders,

01:35:23.120 --> 01:35:24.080
 uns hat jemand gefragt,

01:35:24.080 --> 01:35:24.860
 ob wir so kleine,

01:35:24.860 --> 01:35:25.860
 äh,

01:35:26.700 --> 01:35:27.120
 Ja,

01:35:27.120 --> 01:35:27.640
 aber da war das,

01:35:27.640 --> 01:35:27.940
 glaube ich,

01:35:27.940 --> 01:35:28.380
 nicht dabei.

01:35:28.380 --> 01:35:29.240
 Ist ja auch egal.

01:35:29.240 --> 01:35:31.140
 Semantic UI,

01:35:31.140 --> 01:35:32.000
 sag mir nix.

01:35:32.000 --> 01:35:32.720
 Bulma,

01:35:32.720 --> 01:35:33.420
 sag mir nix.

01:35:33.420 --> 01:35:33.920
 Kenne ich,

01:35:33.920 --> 01:35:36.720
 die reagieren konsequent

01:35:36.720 --> 01:35:38.000
 nicht auf Fragen,

01:35:38.000 --> 01:35:39.700
 die Accessibility-Version zu machen.

01:35:39.700 --> 01:35:41.620
 An sich ist es aber

01:35:41.620 --> 01:35:42.400
 ein cooles Framework,

01:35:42.400 --> 01:35:42.800
 glaube ich.

01:35:42.800 --> 01:35:43.480
 Foundation,

01:35:43.480 --> 01:35:44.180
 habe ich gehört,

01:35:44.180 --> 01:35:46.020
 aber aktuell kein Interesse.

01:35:46.020 --> 01:35:46.880
 UI-Kids,

01:35:46.880 --> 01:35:47.820
 sag mir nix.

01:35:47.820 --> 01:35:51.180
 Tachions,

01:35:51.180 --> 01:35:52.140
 Taktakions,

01:35:52.140 --> 01:35:53.120
 keine Ahnung.

01:35:53.120 --> 01:35:54.060
 Primer,

01:35:54.060 --> 01:35:54.880
 keine Ahnung.

01:35:55.120 --> 01:35:55.580
 Also man merkt,

01:35:55.580 --> 01:35:57.660
 so CSS-Framework-mäßig,

01:35:57.660 --> 01:35:58.900
 da bin ich überhaupt nicht bewandert.

01:35:58.900 --> 01:35:59.280
 Also klar,

01:35:59.280 --> 01:36:00.300
 Bootstrap kenne ich,

01:36:00.300 --> 01:36:01.060
 aber ansonsten,

01:36:01.060 --> 01:36:02.540
 nope.

01:36:02.540 --> 01:36:04.400
 Tailwind,

01:36:04.400 --> 01:36:05.700
 habe ich schon verwendet.

01:36:05.700 --> 01:36:06.240
 Ja,

01:36:06.240 --> 01:36:06.680
 habe ich nicht.

01:36:06.680 --> 01:36:08.480
 Das ist so Utility-First,

01:36:08.480 --> 01:36:09.880
 das ist interessant.

01:36:09.880 --> 01:36:11.840
 Ich weiß nicht,

01:36:11.840 --> 01:36:13.500
 ob das jetzt der geilste Ansatz

01:36:13.500 --> 01:36:14.400
 aller Zeiten ist,

01:36:14.400 --> 01:36:17.620
 aber es ist auf jeden Fall interessant.

01:36:17.620 --> 01:36:18.320
 Du kommst auf jeden Fall

01:36:18.320 --> 01:36:19.220
 schnell vorwärts damit,

01:36:19.220 --> 01:36:19.800
 wenn du schnell mal

01:36:19.800 --> 01:36:20.920
 irgendwas Prototypen willst.

01:36:20.920 --> 01:36:22.400
 Ich finde es generell schwierig

01:36:22.400 --> 01:36:24.320
 bei diesen CSS-Frameworks,

01:36:24.660 --> 01:36:25.940
 weil du halt unheimlich schnell

01:36:25.940 --> 01:36:27.500
 dein komplettes Markup

01:36:27.500 --> 01:36:28.260
 zuklatschst

01:36:28.260 --> 01:36:29.600
 mit hunderten

01:36:29.600 --> 01:36:30.880
 an Klassen

01:36:30.880 --> 01:36:31.600
 pro Element.

01:36:31.600 --> 01:36:33.060
 Und

01:36:33.060 --> 01:36:35.440
 ich habe gerne

01:36:35.440 --> 01:36:35.940
 meine Sachen

01:36:35.940 --> 01:36:36.740
 einfach schlank.

01:36:36.740 --> 01:36:38.420
 Also wenn ich,

01:36:38.420 --> 01:36:40.340
 wenn ich mit einer HTML-Seite

01:36:40.340 --> 01:36:41.900
 ein KB durch die Gegend

01:36:41.900 --> 01:36:42.360
 schicken kann

01:36:42.360 --> 01:36:43.740
 oder 50,

01:36:43.740 --> 01:36:44.440
 ja,

01:36:44.440 --> 01:36:46.100
 dann schicke ich lieber

01:36:46.100 --> 01:36:46.860
 eins durch die Gegend.

01:36:46.860 --> 01:36:48.740
 Ja, aber...

01:36:48.740 --> 01:36:48.940
 Weißt du,

01:36:48.940 --> 01:36:49.940
 man macht so viel mit,

01:36:49.940 --> 01:36:51.100
 oh und dann minifiziere ich das

01:36:51.100 --> 01:36:52.040
 und dann entferne ich sogar

01:36:52.040 --> 01:36:53.520
 alle Umbrüche automatisch

01:36:53.520 --> 01:36:54.320
 und was weiß ich,

01:36:54.320 --> 01:36:55.740
 aber dann kleinst du das

01:36:55.740 --> 01:36:56.860
 dann halt so mit...

01:36:56.860 --> 01:36:57.220
 Ich glaube,

01:36:57.220 --> 01:36:57.580
 ich glaube,

01:36:57.580 --> 01:36:58.380
 am Ende gibt sich das

01:36:58.380 --> 01:36:59.080
 gar nicht so viel,

01:36:59.080 --> 01:37:01.560
 weil wo du die Komplexität hast

01:37:01.560 --> 01:37:03.480
 und ob du dann doppelte Sachen

01:37:03.480 --> 01:37:04.260
 in CSS hast

01:37:04.260 --> 01:37:05.200
 oder die Sachen in CSS

01:37:05.200 --> 01:37:05.800
 nur einmal,

01:37:05.800 --> 01:37:07.520
 aber im HTML halt mehrere Klassen,

01:37:07.520 --> 01:37:07.820
 ich glaube,

01:37:07.820 --> 01:37:09.740
 am Ende gibt es sich

01:37:09.740 --> 01:37:10.600
 wahrscheinlich gar nicht so viel.

01:37:10.600 --> 01:37:11.300
 Da würde ich gerne mal

01:37:11.300 --> 01:37:12.300
 eine Studie dazu sehen.

01:37:12.300 --> 01:37:13.780
 Ich kann mir echt vorstellen,

01:37:13.780 --> 01:37:14.520
 dass es am Ende

01:37:14.520 --> 01:37:16.180
 total egal ist

01:37:16.180 --> 01:37:17.360
 und es nur

01:37:17.360 --> 01:37:19.220
 an unterschiedlichen Orten

01:37:19.220 --> 01:37:19.940
 die Komplexität

01:37:19.940 --> 01:37:20.540
 sich befindet.

01:37:20.540 --> 01:37:24.240
 Was zu diskutieren wäre.

01:37:24.240 --> 01:37:24.820
 Egal,

01:37:24.820 --> 01:37:25.640
 pure CSS

01:37:25.640 --> 01:37:26.480
 klingt für mich

01:37:26.480 --> 01:37:27.400
 nach Vanilla JavaScript.

01:37:27.400 --> 01:37:28.980
 Ich weiß aber nicht,

01:37:28.980 --> 01:37:29.800
 ob damit gemeint ist,

01:37:29.800 --> 01:37:30.640
 wir machen einfach nur

01:37:30.640 --> 01:37:31.680
 normales CSS.

01:37:31.680 --> 01:37:33.260
 Skeleton kenne ich nicht

01:37:33.260 --> 01:37:34.220
 und Spectre

01:37:34.220 --> 01:37:34.980
 kenne ich auch nicht.

01:37:34.980 --> 01:37:36.000
 Nee,

01:37:36.000 --> 01:37:37.260
 Spectre war doch so ein,

01:37:37.260 --> 01:37:38.300
 was ist nicht,

01:37:38.300 --> 01:37:39.260
 so eine Sicherheitslücke.

01:37:41.380 --> 01:37:43.200
 und ein Jens-Bund-Film.

01:37:43.200 --> 01:37:44.100
 Stimmt.

01:37:44.100 --> 01:37:46.280
 Zu viel denn insgesamt

01:37:46.280 --> 01:37:46.920
 auch neutral.

01:37:46.920 --> 01:37:47.720
 Ich will da gar nichts,

01:37:47.720 --> 01:37:48.780
 ich will gar nichts werten.

01:37:48.780 --> 01:37:49.240
 Ich glaube,

01:37:49.240 --> 01:37:50.960
 das ist eine super langweilige Folge.

01:37:50.960 --> 01:37:51.600
 Ich glaube auch.

01:37:51.600 --> 01:37:52.880
 Das ist eine schreckliche Folge.

01:37:52.880 --> 01:37:53.060
 Nee,

01:37:53.060 --> 01:37:54.020
 wir reden ja auch zwischendrin.

01:37:54.020 --> 01:37:55.300
 BEM,

01:37:55.300 --> 01:37:56.500
 da hatten wir es auch

01:37:56.500 --> 01:37:58.160
 in Folge Nummer 14 davon.

01:37:58.160 --> 01:38:00.420
 Also ich bin schon

01:38:00.420 --> 01:38:01.800
 beim nächsten CSS-Piloten.

01:38:01.800 --> 01:38:02.040
 Ja,

01:38:02.040 --> 01:38:02.400
 BEM,

01:38:02.400 --> 01:38:03.800
 das versuche ich,

01:38:03.800 --> 01:38:05.120
 da bin ich gerade

01:38:05.120 --> 01:38:06.640
 großer Advokat

01:38:06.640 --> 01:38:07.580
 und bringe das

01:38:07.580 --> 01:38:08.280
 gerade Leuten bei.

01:38:08.280 --> 01:38:09.600
 Magst du es kurz umreißen?

01:38:10.940 --> 01:38:12.500
 Ist eine Methode,

01:38:12.500 --> 01:38:16.980
 um CSS möglichst flach zu schreiben.

01:38:16.980 --> 01:38:19.600
 Es heißt Block Element Modifier

01:38:19.600 --> 01:38:20.800
 und genau das ist es.

01:38:20.800 --> 01:38:21.720
 Du definierst Blöcke,

01:38:21.720 --> 01:38:23.480
 innerhalb denen kann es Elemente geben

01:38:23.480 --> 01:38:25.580
 und die können auch jeweils Modifier haben.

01:38:25.580 --> 01:38:25.880
 Das heißt,

01:38:25.880 --> 01:38:27.340
 du hast irgendwie eine Variante davon,

01:38:27.340 --> 01:38:28.840
 die ist jetzt irgendwie mal blau oder so.

01:38:28.840 --> 01:38:29.100
 Genau,

01:38:29.100 --> 01:38:31.460
 da gibt es spezielle,

01:38:31.460 --> 01:38:32.940
 also eine Konvention,

01:38:32.940 --> 01:38:33.640
 wie man das schreibt.

01:38:33.640 --> 01:38:34.840
 Also ich sage jetzt mal

01:38:34.840 --> 01:38:36.120
 ein Card Block

01:38:36.120 --> 01:38:37.440
 und da drin gibt es dann

01:38:37.440 --> 01:38:38.840
 das Visual Element

01:38:38.840 --> 01:38:39.840
 und das Headline Element

01:38:39.840 --> 01:38:41.060
 und das wäre dann

01:38:41.060 --> 01:38:42.780
 was weiß ich was,

01:38:42.780 --> 01:38:44.140
 Card-Unterstrich-Unterstrich,

01:38:44.140 --> 01:38:44.940
 damit trenne ich dann

01:38:44.940 --> 01:38:46.160
 ein Element ab

01:38:46.160 --> 01:38:47.560
 und dann ist es halt

01:38:47.560 --> 01:38:50.220
 Card-Unterstrich-Unterstrich-Headline

01:38:50.220 --> 01:38:51.480
 und wenn das jetzt

01:38:51.480 --> 01:38:52.980
 eine speziell ausgezeichnete Headline ist,

01:38:52.980 --> 01:38:53.660
 zum Beispiel eben

01:38:53.660 --> 01:38:55.060
 für das neueste Element,

01:38:55.060 --> 01:38:55.520
 für New,

01:38:55.520 --> 01:38:56.140
 dann wäre das

01:38:56.140 --> 01:38:59.120
 Card-Unterstrich-Unterstrich-Headline-minus-minus-New.

01:38:59.740 --> 01:39:00.980
 Das ist dann der Modifier,

01:39:00.980 --> 01:39:01.480
 das New.

01:39:01.480 --> 01:39:02.680
 Genau.

01:39:02.680 --> 01:39:04.540
 Setze ich auch ein,

01:39:04.540 --> 01:39:05.680
 wenn ich gerade Lust drauf habe.

01:39:05.680 --> 01:39:07.060
 Manchmal auch nicht.

01:39:07.060 --> 01:39:09.320
 Da hatte der Gerrit auch was dazu gesagt.

01:39:09.320 --> 01:39:10.240
 Wie gesagt,

01:39:10.240 --> 01:39:11.540
 einfach mal Folge 14 anhören.

01:39:11.540 --> 01:39:14.080
 Es geht aber auch wieder in die Richtung mit,

01:39:14.080 --> 01:39:15.760
 ich klatsche mir halt dann ordentlich

01:39:15.760 --> 01:39:17.880
 da die Klassenattribute zu.

01:39:17.880 --> 01:39:18.520
 Aber gut,

01:39:18.520 --> 01:39:19.180
 brauchen wir nicht nochmal

01:39:19.180 --> 01:39:19.800
 darüber zu sprechen.

01:39:19.800 --> 01:39:19.920
 Nee,

01:39:19.920 --> 01:39:21.240
 ganz kurz noch,

01:39:21.240 --> 01:39:22.140
 es kommt echt drauf an,

01:39:22.140 --> 01:39:24.080
 also gerade wenn du große Projekte hast,

01:39:24.080 --> 01:39:25.520
 ist das echt sehr,

01:39:25.520 --> 01:39:26.380
 sehr, sehr hilfreich,

01:39:26.380 --> 01:39:29.480
 weil du gerade so Spezifitätsprobleme damit löst,

01:39:29.480 --> 01:39:33.020
 weil du also auch komplett flaches CSS schreiben kannst.

01:39:33.020 --> 01:39:35.820
 Du hast im Prinzip kaum noch verschachtelte Selektoren.

01:39:35.820 --> 01:39:37.300
 Die gibt es zwar an der einen oder anderen Stelle

01:39:37.300 --> 01:39:37.880
 schon immer noch,

01:39:37.880 --> 01:39:39.700
 aber im Prinzip brauchst du die dann gar nicht mehr,

01:39:39.700 --> 01:39:40.580
 weil du einfach,

01:39:40.580 --> 01:39:42.320
 weil einfach alles einfach eine Klasse hat.

01:39:42.320 --> 01:39:43.540
 Es ist vor allem auch,

01:39:43.540 --> 01:39:47.280
 wenn ein anderer Entwickler deinen Code übernimmt,

01:39:47.280 --> 01:39:49.380
 dann ist viel klarer,

01:39:49.380 --> 01:39:50.740
 was du,

01:39:50.740 --> 01:39:51.960
 also wie du es strukturiert hast

01:39:51.960 --> 01:39:52.780
 und was du meinst

01:39:52.780 --> 01:39:54.180
 und was du damit eigentlich bezweckst,

01:39:54.180 --> 01:39:56.360
 weil jeder schreibt irgendwie seine Klassen an,

01:39:56.380 --> 01:39:57.240
 das und dann,

01:39:57.240 --> 01:39:58.580
 was weiß ich,

01:39:58.580 --> 01:39:59.820
 was derjenige damit gemeint hat

01:39:59.820 --> 01:40:00.660
 und damit wird es einfach klar.

01:40:00.660 --> 01:40:02.040
 Es gibt ja auch das Schirmwort Klassitis,

01:40:02.040 --> 01:40:04.120
 das könnte man jetzt darauf natürlich anwenden,

01:40:04.120 --> 01:40:05.460
 aber es ist,

01:40:05.460 --> 01:40:07.400
 es hilft echt

01:40:07.400 --> 01:40:08.080
 und vor allem auch,

01:40:08.080 --> 01:40:09.220
 weil es unabhängig ist

01:40:09.220 --> 01:40:09.860
 von dem Element,

01:40:09.860 --> 01:40:10.620
 was du verwendest,

01:40:10.620 --> 01:40:12.160
 aber wenn du Elementselektoren verwendest,

01:40:12.160 --> 01:40:13.300
 dann musst du jedes Mal Refactoren,

01:40:13.300 --> 01:40:13.960
 wenn du jetzt denkst,

01:40:13.960 --> 01:40:14.260
 naja,

01:40:14.260 --> 01:40:15.320
 ich will jetzt aus dem Span

01:40:15.320 --> 01:40:16.380
 vielleicht doch mal ein Diff machen

01:40:16.380 --> 01:40:17.440
 oder eine Section oder so,

01:40:17.440 --> 01:40:19.200
 aber wenn du BAM verwendest,

01:40:19.200 --> 01:40:20.120
 überhaupt gar kein Problem,

01:40:20.120 --> 01:40:21.020
 verändere das einfach,

01:40:21.020 --> 01:40:22.160
 die Klasse ist immer noch da,

01:40:22.160 --> 01:40:23.480
 funktioniert alles,

01:40:23.480 --> 01:40:23.780
 subi.

01:40:24.700 --> 01:40:26.020
 Also BAM bin ich,

01:40:26.020 --> 01:40:27.380
 also ich habe lang gebraucht,

01:40:27.380 --> 01:40:28.320
 um damit warm zu werden

01:40:28.320 --> 01:40:29.820
 und mittlerweile bin ich ein Fan davon,

01:40:29.820 --> 01:40:30.980
 das ist echt gut.

01:40:30.980 --> 01:40:32.160
 Ja.

01:40:32.160 --> 01:40:34.640
 Also die anderen restlichen Sachen

01:40:34.640 --> 01:40:35.400
 hier auf der Seite,

01:40:35.400 --> 01:40:37.220
 habe ich einfach mal alle,

01:40:37.900 --> 01:40:39.920
 Also Atomic habe ich gehört,

01:40:39.920 --> 01:40:40.680
 aber kein Interesse,

01:40:40.680 --> 01:40:42.380
 den Rest habe ich alles nicht gehört.

01:40:42.380 --> 01:40:45.380
 Also eigentlich würde ich sagen,

01:40:45.380 --> 01:40:45.880
 sind da,

01:40:45.880 --> 01:40:47.020
 das ist,

01:40:47.020 --> 01:40:49.020
 da könnte man eine Timeline draus machen.

01:40:49.020 --> 01:40:49.900
 Und zwar,

01:40:49.900 --> 01:40:51.900
 am Anfang steht OOCSS,

01:40:51.900 --> 01:40:53.280
 meines Wissens nach,

01:40:53.280 --> 01:40:54.560
 das hat die Nicole Sullivan

01:40:54.560 --> 01:40:55.620
 irgendwann mal eingeführt,

01:40:55.620 --> 01:40:57.160
 2000, weiß ich nicht,

01:40:57.160 --> 01:40:57.980
 10 oder so,

01:40:57.980 --> 01:40:58.940
 oder 9 oder so,

01:40:58.940 --> 01:41:01.040
 die hat damals bei Yahoo gearbeitet,

01:41:01.040 --> 01:41:02.360
 die hat da so eine Idee gehabt,

01:41:02.420 --> 01:41:04.320
 wie man ein objektorientiertes CSS bauen kann.

01:41:04.320 --> 01:41:05.080
 Das war noch relativ

01:41:05.080 --> 01:41:06.940
 simpler Ansatz.

01:41:06.940 --> 01:41:08.360
 Und danach kam das

01:41:08.360 --> 01:41:09.780
 Smacks von Jonathan Snook,

01:41:09.780 --> 01:41:11.360
 der hat da ein Buch drüber geschrieben auch

01:41:11.360 --> 01:41:12.000
 und ich habe auch mal

01:41:12.000 --> 01:41:13.980
 einen Workshop dazu bei dem gehabt,

01:41:13.980 --> 01:41:14.700
 der hat das auf vielen,

01:41:14.700 --> 01:41:16.360
 vielen Konferenzen präsentiert.

01:41:16.360 --> 01:41:17.880
 Das ging von dem OOCSS

01:41:17.880 --> 01:41:18.820
 noch einen Schritt weiter.

01:41:18.820 --> 01:41:21.200
 Noch ein bisschen mehr Methode,

01:41:21.200 --> 01:41:22.180
 der hatte dann irgendwie auch schon

01:41:22.180 --> 01:41:23.360
 Modifier und sowas

01:41:23.360 --> 01:41:24.800
 für Theming und so weiter,

01:41:24.800 --> 01:41:26.460
 also auch irgendwie so eine Methode,

01:41:26.460 --> 01:41:26.900
 wie man das,

01:41:26.900 --> 01:41:27.900
 wie man das aufteilt.

01:41:27.900 --> 01:41:29.940
 und das wurde immer spezieller

01:41:29.940 --> 01:41:31.480
 und BAM ist quasi so,

01:41:31.480 --> 01:41:33.240
 wenn du jetzt Smacks

01:41:33.240 --> 01:41:34.240
 auf die Spitze treibst,

01:41:34.240 --> 01:41:35.860
 zumindest habe ich das so verstanden immer.

01:41:35.860 --> 01:41:37.680
 Krass, also da bist du

01:41:37.680 --> 01:41:38.820
 deutlich tiefer drin als ich.

01:41:38.820 --> 01:41:41.300
 Das sind ganz ähnliche Ansätze

01:41:41.300 --> 01:41:42.160
 und das sind verschiedene,

01:41:42.160 --> 01:41:43.100
 meiner Meinung nach,

01:41:43.100 --> 01:41:44.460
 verschiedene Evolutionsstufen

01:41:44.460 --> 01:41:46.000
 von der gleichen Idee,

01:41:46.000 --> 01:41:48.680
 die dann immer weitergehen.

01:41:48.680 --> 01:41:49.940
 Und IT,

01:41:49.940 --> 01:41:51.680
 IT, CSS,

01:41:51.680 --> 01:41:52.640
 ist nochmal,

01:41:52.640 --> 01:41:54.340
 das habe ich auch,

01:41:54.340 --> 01:41:56.380
 das ist davon eigentlich losgelöst,

01:41:56.760 --> 01:41:59.600
 das ist quasi eine Reihenfolge,

01:41:59.600 --> 01:42:01.720
 in der du dein CSS gruppierst.

01:42:01.720 --> 01:42:03.540
 Also da geht es darum,

01:42:03.540 --> 01:42:04.600
 am Ende,

01:42:04.600 --> 01:42:08.540
 dass man mit den allgemeinsten,

01:42:08.540 --> 01:42:11.460
 mit den niedrigsten Spezifitäten beginnt,

01:42:11.460 --> 01:42:12.640
 mit den allgemeinsten Sachen

01:42:12.640 --> 01:42:13.940
 und sich immer weiter arbeitet

01:42:13.940 --> 01:42:15.180
 zu höherer Spezifität.

01:42:15.180 --> 01:42:16.160
 Das heißt,

01:42:16.160 --> 01:42:17.300
 ganz am Ende stehen irgendwie

01:42:17.300 --> 01:42:18.620
 so Helferklassen mit Important,

01:42:18.620 --> 01:42:20.560
 die ja manchmal auch sinnvoll sind.

01:42:21.120 --> 01:42:22.180
 und ganz am Anfang

01:42:22.180 --> 01:42:24.880
 hast du so Reset zum Beispiel stehen

01:42:24.880 --> 01:42:27.980
 oder, keine Ahnung,

01:42:27.980 --> 01:42:29.420
 allgemeines Styling für,

01:42:29.420 --> 01:42:30.840
 es gibt es ja nicht unbedingt

01:42:30.840 --> 01:42:31.440
 zu verteufeln,

01:42:31.440 --> 01:42:32.260
 wenn du jetzt irgendwie sagst,

01:42:32.260 --> 01:42:33.360
 ja, ich habe halt allgemein

01:42:33.360 --> 01:42:33.980
 so eine H1,

01:42:33.980 --> 01:42:35.480
 die sieht halt bei mir erst mal so aus

01:42:35.480 --> 01:42:37.200
 und ein P sieht bei mir erst mal so aus.

01:42:37.200 --> 01:42:38.860
 Das hast du halt am Anfang

01:42:38.860 --> 01:42:39.960
 und dann irgendwann hast du halt

01:42:39.960 --> 01:42:42.040
 dein Styling für deine Module

01:42:42.040 --> 01:42:43.240
 mit irgendwelchen Klassen,

01:42:43.240 --> 01:42:45.260
 dass die Spezifität dir dann schon mal höher

01:42:45.260 --> 01:42:46.360
 als der Element,

01:42:46.360 --> 01:42:48.220
 die Elementspezifität

01:42:48.220 --> 01:42:49.100
 und dann bis halt eben

01:42:49.100 --> 01:42:50.080
 zu irgendwelchen Helferklassen

01:42:50.080 --> 01:42:50.640
 mit Important.

01:42:50.640 --> 01:42:52.160
 Empfehle ich auf jeden Fall,

01:42:52.160 --> 01:42:52.940
 da mal reinzugucken,

01:42:52.940 --> 01:42:54.640
 weil das Ziel dahinter ist,

01:42:54.640 --> 01:42:54.880
 glaube ich,

01:42:54.880 --> 01:42:55.240
 dann auch schon,

01:42:55.240 --> 01:42:56.620
 dass man eine gute Performance kriegt

01:42:56.620 --> 01:42:58.440
 und auch mit der Spezifität

01:42:58.440 --> 01:42:59.740
 keine Probleme mehr hat.

01:42:59.740 --> 01:43:02.900
 Also der Spezifitäts-Graph,

01:43:02.900 --> 01:43:04.620
 da gibt es ja auch so eine schöne Seite

01:43:04.620 --> 01:43:06.120
 um und die Specificity-Graph,

01:43:06.120 --> 01:43:07.880
 der soll stetig aufsteigend sein.

01:43:07.880 --> 01:43:09.040
 Das ist das Ziel hinter It's.

01:43:09.040 --> 01:43:10.760
 Ist eine coole Sache,

01:43:10.760 --> 01:43:11.580
 auf jeden Fall.

01:43:11.580 --> 01:43:13.040
 Kann man auf sein Projekt drauf tun,

01:43:13.040 --> 01:43:14.140
 egal was für eine Methode

01:43:14.140 --> 01:43:15.140
 man sonst verwendet hat.

01:43:15.260 --> 01:43:16.200
 Ist eine gute Sache.

01:43:16.200 --> 01:43:18.000
 Cube CSS kenne ich tatsächlich nicht.

01:43:18.000 --> 01:43:20.200
 Meine Zufriedenheit damit ist so,

01:43:20.200 --> 01:43:21.560
 ich bin eigentlich bei allen neutral,

01:43:21.560 --> 01:43:22.840
 ich bin der Seiten euphorisch.

01:43:22.840 --> 01:43:26.780
 Okay, so, viel geredet.

01:43:26.780 --> 01:43:27.580
 Aber das ist so was,

01:43:27.580 --> 01:43:28.660
 womit ich mich halt schon viel beschäftigt habe.

01:43:28.660 --> 01:43:29.560
 Ja, krass, ja, ich merke schon.

01:43:29.560 --> 01:43:30.120
 Also das war,

01:43:30.120 --> 01:43:31.760
 mir hat das wie gesagt alles nichts gesagt.

01:43:31.760 --> 01:43:32.520
 Jetzt kommt was,

01:43:32.520 --> 01:43:34.360
 da kann ich fast gar nichts dazu sagen,

01:43:34.360 --> 01:43:35.140
 aber du vielleicht.

01:43:35.140 --> 01:43:36.580
 Nee, auch nicht.

01:43:36.580 --> 01:43:38.000
 Also ich weiß so grob,

01:43:38.000 --> 01:43:39.800
 also CSS in JS,

01:43:39.800 --> 01:43:40.740
 das ist so der,

01:43:40.740 --> 01:43:41.800
 glaube ich,

01:43:41.800 --> 01:43:42.980
 der neue heiße Scheiß,

01:43:42.980 --> 01:43:45.080
 wenn man gerade viel mit React

01:43:45.080 --> 01:43:46.140
 zum Beispiel arbeitet.

01:43:46.140 --> 01:43:48.540
 Ja,

01:43:48.540 --> 01:43:50.420
 ich weiß gar nicht,

01:43:50.420 --> 01:43:51.040
 ob wir das fast,

01:43:51.040 --> 01:43:52.980
 ob wir das fast jetzt aufmachen sollen.

01:43:52.980 --> 01:43:54.000
 Und da irgendwie,

01:43:54.000 --> 01:43:55.000
 es ist im Endeffekt,

01:43:55.000 --> 01:43:56.000
 du schreibst tatsächlich,

01:43:56.000 --> 01:43:58.480
 also dein CSS wird geschrieben

01:43:58.480 --> 01:43:59.020
 durch

01:43:59.020 --> 01:44:01.200
 Bildtools,

01:44:01.200 --> 01:44:02.860
 indem du mit JavaScript,

01:44:02.860 --> 01:44:03.520
 also es ist,

01:44:03.520 --> 01:44:04.340
 oh, nee,

01:44:04.340 --> 01:44:05.340
 also ich glaube,

01:44:05.340 --> 01:44:06.460
 wir lassen das echt.

01:44:06.460 --> 01:44:07.880
 Okay,

01:44:07.880 --> 01:44:09.160
 dann machen wir das nicht auf,

01:44:09.160 --> 01:44:10.820
 das macht ihr dann einfach selbst,

01:44:10.820 --> 01:44:11.960
 dann überspringen wir das jetzt einfach mal.

01:44:11.960 --> 01:44:13.940
 Also wir können vielleicht mal eine Folge dazu machen,

01:44:13.940 --> 01:44:15.580
 auch wenn ich mich dann tiefer eingearbeitet habe,

01:44:15.580 --> 01:44:18.340
 weil ich jetzt auch noch nicht so tief da mit drin bin,

01:44:18.340 --> 01:44:21.260
 aber ich glaube an sich finde ich es auch nicht gut.

01:44:21.260 --> 01:44:23.400
 Wir bewerten das jetzt nicht,

01:44:23.400 --> 01:44:25.300
 wir überspringen das,

01:44:25.300 --> 01:44:26.600
 aber ich möchte einfach noch

01:44:26.600 --> 01:44:29.420
 drei Namen von Frameworks oder Methoden,

01:44:29.420 --> 01:44:30.020
 oder Methoden,

01:44:30.020 --> 01:44:30.660
 ich weiß gar nicht genau,

01:44:30.660 --> 01:44:31.240
 ich kenne die nicht,

01:44:31.240 --> 01:44:31.780
 vorlesen,

01:44:31.780 --> 01:44:32.680
 weil die einfach lustig sind,

01:44:32.680 --> 01:44:32.980
 und zwar

01:44:32.980 --> 01:44:34.300
 Styletron,

01:44:34.300 --> 01:44:37.180
 Linaria

01:44:37.180 --> 01:44:37.600
 und

01:44:37.600 --> 01:44:38.780
 AstroTurf.

01:44:38.780 --> 01:44:41.600
 AstroTurf, ja.

01:44:41.600 --> 01:44:42.920
 Und damit springen wir zum nächsten.

01:44:42.920 --> 01:44:44.480
 Genau,

01:44:44.480 --> 01:44:45.440
 andere Werkzeuge.

01:44:45.440 --> 01:44:46.720
 Andere Werkzeuge.

01:44:46.720 --> 01:44:47.940
 Stylinth.

01:44:47.940 --> 01:44:49.180
 Jawohl.

01:44:49.180 --> 01:44:51.020
 Eingesetzt

01:44:51.020 --> 01:44:51.940
 bei mir.

01:44:51.940 --> 01:44:52.560
 Perch, CSS,

01:44:52.560 --> 01:44:53.380
 Purify, CSS sagt mir aber nix.

01:44:53.380 --> 01:44:53.900
 Das ist eine sehr gute Sache.

01:44:53.900 --> 01:44:54.400
 Das sagt mir aber nix.

01:44:54.400 --> 01:44:57.300
 Also zu Stylinth noch ganz kurz,

01:44:57.300 --> 01:45:01.140
 sehr, sehr, sehr umfangreich zu konfigurieren.

01:45:01.140 --> 01:45:02.480
 Ich empfehle in jedem Falle

01:45:02.480 --> 01:45:05.500
 so ein Standard-Stylinth-Default-Konfiguration,

01:45:05.500 --> 01:45:07.060
 weil du möchtest nicht alle Regeln

01:45:07.060 --> 01:45:08.260
 selbst konfigurieren müssen.

01:45:08.260 --> 01:45:09.580
 Also vielleicht müssen wir auch ein bisschen,

01:45:09.580 --> 01:45:10.940
 also Linting generell,

01:45:10.940 --> 01:45:11.700
 was ist denn Linting?

01:45:11.700 --> 01:45:12.720
 Weil wir haben halt auch

01:45:12.720 --> 01:45:14.420
 vielleicht nicht so erfahrene

01:45:14.420 --> 01:45:16.300
 Zuhörerinnen und Zuhörer.

01:45:16.300 --> 01:45:18.100
 Also Linting ist,

01:45:18.100 --> 01:45:20.080
 es gibt ein definiertes Regelset,

01:45:20.080 --> 01:45:21.600
 auch zum Beispiel bei JavaScript,

01:45:21.600 --> 01:45:23.040
 das ist nicht bei CSS nur,

01:45:23.380 --> 01:45:24.460
 wie Sachen,

01:45:24.460 --> 01:45:26.980
 wie der Code formatiert sein soll.

01:45:26.980 --> 01:45:27.500
 Also wie viel,

01:45:27.500 --> 01:45:29.760
 fängt an mit Indentation,

01:45:29.760 --> 01:45:30.900
 wie viele Leerzeichen

01:45:30.900 --> 01:45:32.460
 oder Tabs nutze ich denn,

01:45:32.460 --> 01:45:34.400
 um den Code einzurücken.

01:45:34.400 --> 01:45:37.900
 Oder darf nach einer CSS-Regel,

01:45:37.900 --> 01:45:39.540
 da dürfen da zwei Leerzeilen sein

01:45:39.540 --> 01:45:40.940
 oder darf immer maximal eine sein

01:45:40.940 --> 01:45:41.400
 und so weiter.

01:45:41.400 --> 01:45:42.660
 Also die diverse Regeln,

01:45:42.660 --> 01:45:44.060
 wie soll der Code formatiert sein.

01:45:44.060 --> 01:45:45.500
 Und da gibt es eben Tools

01:45:45.500 --> 01:45:46.360
 in der Toolchain,

01:45:46.360 --> 01:45:49.320
 Linter, eben Style-Lint für CSS

01:45:49.320 --> 01:45:51.940
 oder JS-Lint oder was weiß ich.

01:45:51.940 --> 01:45:53.560
 oder auch PHP,

01:45:53.560 --> 01:45:55.840
 jede Programmiersprache hat also ihre Bibliothek,

01:45:55.840 --> 01:45:57.860
 die das einfach automatisiert übernimmt,

01:45:57.860 --> 01:45:59.320
 vielleicht sogar automatisiert fixt,

01:45:59.320 --> 01:46:00.240
 wenn sie das anbietet,

01:46:00.240 --> 01:46:01.280
 die Library.

01:46:01.280 --> 01:46:03.740
 Hilft eben auch,

01:46:03.740 --> 01:46:04.760
 einen einheitlichen

01:46:04.760 --> 01:46:06.460
 Code-Stil durchzuziehen,

01:46:06.460 --> 01:46:07.820
 wenn da viele Entwickler mitarbeiten.

01:46:07.820 --> 01:46:09.640
 Und es hilft einem zum Beispiel auch,

01:46:09.640 --> 01:46:12.520
 besser Stellen im Code zu finden.

01:46:13.200 --> 01:46:14.980
 Also wenn ich zum Beispiel weiß,

01:46:14.980 --> 01:46:16.220
 mein Linter,

01:46:16.220 --> 01:46:17.380
 der lässt mich gar nicht

01:46:17.380 --> 01:46:18.540
 ins Repository pushen,

01:46:18.540 --> 01:46:19.980
 wenn die Regeln fehlen

01:46:19.980 --> 01:46:21.660
 oder zumindest kriege ich

01:46:21.660 --> 01:46:22.500
 einen anderen Entwickler

01:46:22.500 --> 01:46:23.280
 auf die Finger gehauen,

01:46:23.280 --> 01:46:24.540
 dann weiß ich zum Beispiel,

01:46:24.540 --> 01:46:25.720
 wenn definiert ist in den Regeln,

01:46:25.720 --> 01:46:27.520
 nach einem If kommt immer ein Leerzeichen

01:46:27.520 --> 01:46:28.540
 vor der öffnenden Klammer,

01:46:28.540 --> 01:46:30.220
 dann brauche ich im Code

01:46:30.220 --> 01:46:31.220
 gar nicht suchen nach

01:46:31.220 --> 01:46:32.980
 If mit Direktklammer auf.

01:46:32.980 --> 01:46:35.680
 Oder ich suche nach einer bestimmten Variable

01:46:35.680 --> 01:46:36.640
 in der If-Abfrage.

01:46:36.960 --> 01:46:38.160
 Dann suche ich eben

01:46:38.160 --> 01:46:40.860
 nach der Zeichenkette

01:46:40.860 --> 01:46:42.100
 und ich weiß einfach,

01:46:42.100 --> 01:46:43.180
 wir haben die und die Regeln

01:46:43.180 --> 01:46:44.320
 und nach dem und dem

01:46:44.320 --> 01:46:44.860
 muss ich suchen

01:46:44.860 --> 01:46:45.940
 und dann übersehe ich auch nichts,

01:46:45.940 --> 01:46:47.640
 weil es vielleicht irgendwo

01:46:47.640 --> 01:46:48.260
 an einer anderen Stelle

01:46:48.260 --> 01:46:49.220
 anders geschrieben ist.

01:46:49.220 --> 01:46:51.160
 Da kann es mir fressen.

01:46:51.160 --> 01:46:54.460
 Super, danke für den Lehrauftrag

01:46:54.460 --> 01:46:55.360
 hier an der Stelle nochmal,

01:46:55.360 --> 01:46:55.840
 weil ich glaube,

01:46:55.840 --> 01:46:56.740
 wir sind über viele Sachen

01:46:56.740 --> 01:46:58.020
 jetzt sehr schnell drüber gegangen.

01:46:58.020 --> 01:46:58.720
 Ja, absolut.

01:46:58.720 --> 01:46:59.200
 Also ich glaube,

01:46:59.200 --> 01:47:00.460
 da fühlen sich vielleicht jetzt

01:47:00.460 --> 01:47:01.980
 Neulinge echt überfordern.

01:47:01.980 --> 01:47:02.540
 Oh mein Gott.

01:47:02.540 --> 01:47:04.140
 Mir geht es ja jetzt schon teilweise so,

01:47:04.140 --> 01:47:04.860
 wenn ich das alles sehe

01:47:04.860 --> 01:47:05.320
 und denke so,

01:47:05.320 --> 01:47:06.940
 ich bin voll hinten dran,

01:47:06.960 --> 01:47:08.800
 Aber ich habe ja jetzt auch schon gehört,

01:47:08.800 --> 01:47:10.640
 dass wir viel auch nicht kennen.

01:47:10.640 --> 01:47:11.620
 Ja, definitiv.

01:47:11.620 --> 01:47:12.440
 Also von daher.

01:47:12.440 --> 01:47:13.880
 Oh Gott,

01:47:13.880 --> 01:47:15.340
 die Postcast-Folge,

01:47:15.340 --> 01:47:17.200
 die darf kein zukünftiger Arbeitgeber hören.

01:47:17.200 --> 01:47:18.680
 Wir wissen ja gar nichts.

01:47:18.680 --> 01:47:20.340
 Die Iopaisa.

01:47:20.340 --> 01:47:20.900
 So,

01:47:20.900 --> 01:47:22.300
 ja,

01:47:22.300 --> 01:47:23.760
 ich habe mir gerade noch ein Bier geholt.

01:47:23.760 --> 01:47:24.480
 Das war jetzt mal noch.

01:47:24.480 --> 01:47:25.660
 Ja, plötzlich warst du weg.

01:47:25.660 --> 01:47:28.540
 Ja, ich war aber nur ganz kurz weg.

01:47:28.540 --> 01:47:29.660
 Also ich war ja schon mal länger weg.

01:47:29.660 --> 01:47:29.940
 Sehr schnell.

01:47:29.940 --> 01:47:31.680
 Aber diesmal war ich nur ganz kurz weg.

01:47:31.680 --> 01:47:33.080
 Ja.

01:47:33.080 --> 01:47:34.280
 Gut,

01:47:34.280 --> 01:47:35.400
 schnell weiter.

01:47:35.400 --> 01:47:36.120
 Texteditoren.

01:47:36.120 --> 01:47:37.720
 VSCode habe ich benutzt.

01:47:37.720 --> 01:47:38.900
 Sublime habe ich benutzt.

01:47:38.900 --> 01:47:40.840
 Atom habe ich noch nicht benutzt.

01:47:40.840 --> 01:47:43.700
 Vim habe ich benutzen müssen.

01:47:43.700 --> 01:47:46.000
 Das muss man manchmal,

01:47:46.000 --> 01:47:47.140
 wenn man auf Server geht.

01:47:47.140 --> 01:47:48.720
 Emacs ist, glaube ich,

01:47:48.720 --> 01:47:49.680
 auch so ein Server-Dings.

01:47:49.680 --> 01:47:51.880
 Oder Git-Merch.

01:47:53.340 --> 01:47:54.340
 Oh ja.

01:47:54.340 --> 01:47:56.020
 Da könnt ihr,

01:47:56.020 --> 01:47:56.940
 was mich jetzt wundert,

01:47:56.940 --> 01:47:57.180
 ist,

01:47:57.180 --> 01:47:58.700
 dass da Nano nicht dabei steht.

01:47:58.700 --> 01:48:00.160
 Weil das ist das,

01:48:00.160 --> 01:48:01.940
 was ich immer versuche zu benutzen

01:48:01.940 --> 01:48:02.580
 auf den Servern.

01:48:02.580 --> 01:48:03.240
 Weil das ist was,

01:48:03.240 --> 01:48:04.200
 das finde ich noch,

01:48:04.200 --> 01:48:05.680
 wenn man mal auf einem Server

01:48:05.680 --> 01:48:07.000
 per SSH irgendwie

01:48:07.000 --> 01:48:09.040
 ein Textfile editieren muss,

01:48:09.040 --> 01:48:10.400
 also in der Kommandozeile,

01:48:10.400 --> 01:48:11.400
 ohne GUI,

01:48:11.400 --> 01:48:13.220
 dann ist Nano für mich

01:48:13.220 --> 01:48:14.520
 immer noch das am zugänglichste.

01:48:14.520 --> 01:48:15.320
 Da werden jetzt die ganzen

01:48:15.320 --> 01:48:16.800
 Wim-Fanatiker aufschreien,

01:48:17.120 --> 01:48:18.000
 aber dazu sage ich nur

01:48:18.000 --> 01:48:18.760
 Doppelpunkt Q.

01:48:18.760 --> 01:48:22.120
 Doppelpunkt Q,

01:48:22.120 --> 01:48:22.900
 Ausrufezeichen.

01:48:22.900 --> 01:48:23.800
 Ah, scheiße,

01:48:23.800 --> 01:48:24.300
 Ausrufezeichen,

01:48:24.300 --> 01:48:25.700
 das kann ich mir merken.

01:48:25.700 --> 01:48:26.440
 Es ist

01:48:26.440 --> 01:48:29.200
 Wim oder VI,

01:48:29.200 --> 01:48:30.440
 ich sage es euch,

01:48:30.440 --> 01:48:32.080
 wenn ihr da drumherum kommen könnt,

01:48:32.080 --> 01:48:32.820
 da werden jetzt

01:48:32.820 --> 01:48:34.380
 die Wim-Fanatiker

01:48:34.380 --> 01:48:35.420
 oder die VI-Fanatiker,

01:48:35.420 --> 01:48:35.980
 die werden mich jetzt

01:48:35.980 --> 01:48:36.700
 auch dafür steinigen,

01:48:36.700 --> 01:48:37.540
 weil davon gibt es wirklich,

01:48:37.540 --> 01:48:38.280
 es gibt so richtig

01:48:38.280 --> 01:48:40.460
 Hardcore-Fans davon.

01:48:40.460 --> 01:48:42.480
 Aber das ist einfach ich.

01:48:42.480 --> 01:48:43.200
 Also,

01:48:43.200 --> 01:48:43.880
 nee,

01:48:43.880 --> 01:48:44.400
 nee,

01:48:44.400 --> 01:48:44.580
 nee.

01:48:44.580 --> 01:48:46.420
 Dann gibt es hier noch

01:48:46.420 --> 01:48:46.940
 die Frage,

01:48:47.000 --> 01:48:52.500
 WebStorm habe ich tatsächlich

01:48:52.500 --> 01:48:53.280
 noch nie verwendet,

01:48:53.280 --> 01:48:54.300
 aber was ich schon verwendet habe,

01:48:54.300 --> 01:48:54.960
 ist IntelliJ

01:48:54.960 --> 01:48:57.020
 und das ist von der gleichen Firma,

01:48:57.020 --> 01:48:59.160
 aber so die ultimative,

01:48:59.160 --> 01:49:00.000
 alles mögliche,

01:49:00.000 --> 01:49:01.340
 auch Java-Variante.

01:49:01.340 --> 01:49:02.100
 Also es geht auch darum,

01:49:02.100 --> 01:49:03.540
 welche man regelmäßig benutzt.

01:49:03.540 --> 01:49:04.660
 Also deswegen habe ich da mal

01:49:04.660 --> 01:49:07.180
 VS Code und Sublime angekriegt.

01:49:07.180 --> 01:49:08.420
 Dann muss ich,

01:49:08.420 --> 01:49:09.200
 nee,

01:49:09.200 --> 01:49:10.120
 Sublime,

01:49:10.120 --> 01:49:11.800
 dann ist es tatsächlich bei mir

01:49:11.800 --> 01:49:12.600
 nur VS Code,

01:49:12.600 --> 01:49:13.840
 was ich wirklich regelmäßig benutze.

01:49:13.840 --> 01:49:14.880
 Ich habe noch so ein IntelliJ

01:49:14.880 --> 01:49:15.600
 bei mir auf dem Rechner,

01:49:15.600 --> 01:49:16.760
 aber eigentlich benutze ich es nicht mehr.

01:49:16.880 --> 01:49:19.240
 Also ich habe Sublime tatsächlich,

01:49:19.240 --> 01:49:20.780
 wenn ich mal nur eben schnell

01:49:20.780 --> 01:49:22.160
 irgendeine Textdatei anschauen will

01:49:22.160 --> 01:49:24.460
 und noch kein VS Code offen habe,

01:49:24.460 --> 01:49:25.920
 dann öffne ich die schnell in Sublime,

01:49:25.920 --> 01:49:27.480
 weil VS Code inzwischen

01:49:27.480 --> 01:49:28.560
 echt immer länger dauert.

01:49:28.560 --> 01:49:29.720
 Je mehr Plugins und so,

01:49:29.720 --> 01:49:30.120
 was du hast,

01:49:30.120 --> 01:49:31.160
 es dauert immer länger,

01:49:31.160 --> 01:49:31.700
 bis es offen ist.

01:49:31.700 --> 01:49:32.700
 muss ich gerade sagen,

01:49:32.700 --> 01:49:34.020
 dass VS Code,

01:49:34.020 --> 01:49:37.400
 das wird das neue Visual Studio.

01:49:37.400 --> 01:49:39.360
 Die bohren das jetzt so auf,

01:49:39.360 --> 01:49:41.480
 also da kommen ja mit jeder Version

01:49:41.480 --> 01:49:43.200
 so viele krasse neue Features dazu.

01:49:43.200 --> 01:49:43.640
 Ich sag auch,

01:49:43.640 --> 01:49:44.880
 es ist toll,

01:49:44.880 --> 01:49:46.960
 aber das wird jetzt so ein,

01:49:46.960 --> 01:49:48.460
 das wird gerade so ein Schwergewicht.

01:49:48.460 --> 01:49:51.160
 Und das war ja das Coole an Sublime eigentlich immer,

01:49:51.160 --> 01:49:52.500
 dass es super leichtgewichtig war,

01:49:52.500 --> 01:49:54.080
 mega schnell gestartet hat,

01:49:54.080 --> 01:49:54.680
 auch irgendwie,

01:49:54.760 --> 01:49:57.840
 Vervollständigungen so immer super schnell alles.

01:49:57.840 --> 01:49:59.840
 Also bei Sublime Text war immer,

01:49:59.840 --> 01:50:00.360
 ja,

01:50:00.360 --> 01:50:01.560
 und so langsam wie es Code,

01:50:01.560 --> 01:50:03.620
 auch ohne Plugins,

01:50:03.620 --> 01:50:04.400
 es wird,

01:50:04.400 --> 01:50:04.980
 es wird sehr,

01:50:04.980 --> 01:50:06.320
 sehr schwer gerade.

01:50:06.320 --> 01:50:08.580
 Da kann ich auch gleich IntelliJ benutzen,

01:50:08.580 --> 01:50:08.840
 also,

01:50:08.840 --> 01:50:09.620
 ja.

01:50:09.620 --> 01:50:11.960
 Gut,

01:50:11.960 --> 01:50:13.400
 dann ist noch eine Frage nach dem Browser,

01:50:13.400 --> 01:50:14.820
 welche Browser oder welchen Browser

01:50:14.820 --> 01:50:17.100
 nutzt du primär zu Beginn eines neuen Projekts?

01:50:17.100 --> 01:50:17.980
 Jetzt kriege ich wieder Ärger.

01:50:17.980 --> 01:50:19.900
 Edge tatsächlich?

01:50:19.900 --> 01:50:20.420
 Edge,

01:50:20.420 --> 01:50:21.140
 Edge tatsächlich,

01:50:21.140 --> 01:50:21.400
 ja.

01:50:21.400 --> 01:50:24.020
 Lieber als Chrome.

01:50:24.620 --> 01:50:25.620
 Lieber als Chrome.

01:50:25.620 --> 01:50:27.980
 Vor allem auch wegen dem Feature,

01:50:27.980 --> 01:50:30.380
 das ich irgendwann mal vielleicht als Geilteil vorstelle.

01:50:30.380 --> 01:50:32.100
 Aber das ist jetzt noch nicht.

01:50:32.100 --> 01:50:32.240
 Ja,

01:50:32.240 --> 01:50:32.880
 noch nicht vorgreifen.

01:50:32.880 --> 01:50:34.580
 Für Umgebungen.

01:50:34.580 --> 01:50:36.480
 Für welche Umgebungen?

01:50:36.480 --> 01:50:36.920
 Moment,

01:50:36.920 --> 01:50:36.960
 warte mal.

01:50:36.960 --> 01:50:39.200
 Hast du jetzt echt alle Browser schon durchgelesen?

01:50:39.200 --> 01:50:39.920
 Das sind so viele.

01:50:39.920 --> 01:50:40.900
 Ja,

01:50:40.900 --> 01:50:41.780
 aber die brauchen wir doch jetzt alle.

01:50:41.780 --> 01:50:44.260
 Für die Zuhörer ist es ja jetzt.

01:50:44.260 --> 01:50:45.920
 Jetzt warte doch mal.

01:50:45.920 --> 01:50:47.740
 Vielleicht ist das ja total interessant,

01:50:47.740 --> 01:50:48.820
 was für Browser ich benutze.

01:50:48.820 --> 01:50:51.620
 Ich benutze nämlich den Android Firefox regelmäßig.

01:50:51.620 --> 01:50:54.480
 Aber es geht ja um zu Beginn eines neuen

01:50:54.480 --> 01:50:55.140
 neuen Projekts.

01:50:55.140 --> 01:50:57.600
 Da hast du gleich 50 Geräte offen.

01:50:57.600 --> 01:51:00.540
 Da dürfte ich ja nur einen auswählen dürfen.

01:51:00.540 --> 01:51:01.400
 Das wäre dann wahrscheinlich...

01:51:01.400 --> 01:51:01.640
 Ja,

01:51:01.640 --> 01:51:03.460
 ich habe meistens Firefox und Chrome parallel.

01:51:03.460 --> 01:51:05.660
 Und Polypane.

01:51:05.660 --> 01:51:06.520
 Polypane.

01:51:06.520 --> 01:51:07.160
 Opera,

01:51:07.160 --> 01:51:07.880
 wie war die Samsung?

01:51:07.880 --> 01:51:08.320
 Den kenne ich nicht,

01:51:08.320 --> 01:51:08.620
 nie gehört,

01:51:08.620 --> 01:51:08.640
 aber das ist der letzte Liste.

01:51:08.640 --> 01:51:10.560
 Also da sind jedenfalls einige aufgelistet,

01:51:10.560 --> 01:51:12.020
 aber wir müssen die jetzt nicht alle vorlesen.

01:51:12.020 --> 01:51:13.340
 Opera Mini,

01:51:13.340 --> 01:51:14.820
 da muss der echt hart drauf sein,

01:51:14.820 --> 01:51:16.280
 wenn das dein erster Browser ist,

01:51:16.280 --> 01:51:17.500
 wenn du ein Projekt aufmachst.

01:51:17.500 --> 01:51:18.360
 Das ist ja so der,

01:51:18.360 --> 01:51:20.260
 der bei Can I Use immer gar nichts unterstützt.

01:51:22.260 --> 01:51:22.680
 Warte mal.

01:51:22.680 --> 01:51:23.280
 Und,

01:51:23.280 --> 01:51:23.600
 und,

01:51:23.600 --> 01:51:23.900
 ähm,

01:51:23.900 --> 01:51:24.560
 Dings da,

01:51:24.560 --> 01:51:25.220
 wie heißt der?

01:51:25.220 --> 01:51:26.260
 Wieder vergessen,

01:51:26.260 --> 01:51:26.600
 der,

01:51:26.600 --> 01:51:26.760
 der,

01:51:26.760 --> 01:51:27.660
 der Textbrowser.

01:51:27.660 --> 01:51:29.100
 Der Kommandozeilenbrowser.

01:51:29.100 --> 01:51:30.080
 Egal.

01:51:30.080 --> 01:51:30.620
 Der,

01:51:30.620 --> 01:51:31.860
 der nach Teletext aussieht,

01:51:31.860 --> 01:51:32.080
 ja.

01:51:32.080 --> 01:51:32.760
 Der,

01:51:32.760 --> 01:51:33.760
 der nach Teletext aussieht.

01:51:33.760 --> 01:51:34.600
 Gut,

01:51:34.600 --> 01:51:35.260
 Umgebungen.

01:51:35.260 --> 01:51:36.960
 Für welche Umgebungen schreibst du CSS?

01:51:36.960 --> 01:51:38.740
 Ja gut,

01:51:38.740 --> 01:51:38.980
 ich glaube,

01:51:38.980 --> 01:51:40.500
 also Edge und Chrome ist inzwischen...

01:51:40.500 --> 01:51:40.740
 Ja,

01:51:40.740 --> 01:51:41.780
 müssen wir glaube ich jetzt nicht,

01:51:41.780 --> 01:51:43.640
 müssen wir glaube ich nicht alle die ganze Liste durchgehen.

01:51:43.760 --> 01:51:44.240
 Also gut,

01:51:44.240 --> 01:51:44.800
 interessant,

01:51:44.800 --> 01:51:48.920
 Internet Explorer 11 hast du gesagt,

01:51:48.920 --> 01:51:50.320
 ist bei euch schon gar nicht mehr relevant,

01:51:50.320 --> 01:51:51.500
 weil einfach in der Firma.

01:51:51.500 --> 01:51:53.480
 Ich muss tatsächlich auch sagen,

01:51:53.480 --> 01:51:55.300
 wenn ich nicht weiß,

01:51:55.300 --> 01:51:56.700
 also es kommt auf den Kunden an,

01:51:56.700 --> 01:51:59.400
 ich lasse inzwischen,

01:51:59.400 --> 01:52:02.440
 also inzwischen gucke ich nach dem IE 11 auch nicht mehr so wirklich.

01:52:02.440 --> 01:52:04.200
 Sage ich ganz ehrlich.

01:52:05.540 --> 01:52:06.060
 Wenn ich weiß,

01:52:06.060 --> 01:52:06.880
 das ist was Größeres,

01:52:06.880 --> 01:52:09.240
 wo viele Businesskunden vielleicht eben noch mit,

01:52:09.240 --> 01:52:12.480
 mein Arbeitsrechner kann nichts anderes,

01:52:12.480 --> 01:52:13.860
 ja,

01:52:13.860 --> 01:52:14.460
 dann schon,

01:52:14.460 --> 01:52:15.040
 dann gucke ich,

01:52:15.040 --> 01:52:15.580
 dass es läuft.

01:52:15.580 --> 01:52:16.280
 Aber gerade so,

01:52:16.280 --> 01:52:18.320
 also vor allem bei ES6-Geschichten.

01:52:18.320 --> 01:52:20.620
 Aber hier geht es jetzt um CSS hauptsächlich,

01:52:20.620 --> 01:52:22.540
 weil wir ja in der CSS-Umfrage sind,

01:52:22.540 --> 01:52:24.740
 aber ich hatte das jetzt gerade letztens,

01:52:24.740 --> 01:52:25.000
 ja,

01:52:25.000 --> 01:52:26.620
 nutze ich jetzt Arrow-Functions oder nicht?

01:52:26.620 --> 01:52:29.520
 Ich habe es dann einfach gemacht

01:52:29.520 --> 01:52:32.140
 und ja,

01:52:32.140 --> 01:52:33.920
 also irgendwann muss man auch mal aufhören.

01:52:33.920 --> 01:52:34.720
 Eieieieiei.

01:52:34.720 --> 01:52:35.280
 Eieieiei.

01:52:35.280 --> 01:52:37.120
 Man muss auch irgendwann einfach mal aufhören,

01:52:37.120 --> 01:52:37.920
 es zu supporten,

01:52:37.920 --> 01:52:38.300
 weil sonst,

01:52:38.300 --> 01:52:39.140
 einfach mal aufhören.

01:52:39.140 --> 01:52:40.740
 So wie wir,

01:52:40.740 --> 01:52:41.540
 wir müssen einfach mal irgendwann aufhören.

01:52:41.540 --> 01:52:42.440
 Ich wollte gerade sagen,

01:52:42.440 --> 01:52:42.700
 ich glaube,

01:52:42.700 --> 01:52:44.420
 wir müssen jetzt auch mal aufhören.

01:52:44.420 --> 01:52:46.420
 Okay.

01:52:46.420 --> 01:52:48.020
 Also,

01:52:48.020 --> 01:52:50.200
 vielleicht aus der Liste,

01:52:50.200 --> 01:52:51.700
 welchen Brause ich zum Testen,

01:52:51.700 --> 01:52:51.960
 ah nee,

01:52:51.960 --> 01:52:52.520
 das haben wir,

01:52:52.520 --> 01:52:52.880
 Moment,

01:52:52.880 --> 01:52:53.220
 warte mal,

01:52:53.220 --> 01:52:53.480
 hä?

01:52:53.480 --> 01:52:56.220
 Ich bin schon bei Umgebungen.

01:52:56.220 --> 01:52:57.360
 Du bist bei,

01:52:57.360 --> 01:52:59.100
 wie bei Umgebungen?

01:52:59.100 --> 01:52:59.660
 Nächster Punkt.

01:52:59.660 --> 01:52:59.840
 Was?

01:52:59.840 --> 01:53:01.980
 Hast du jetzt die Formfaktoren

01:53:01.980 --> 01:53:03.580
 und CSS für Print und E-Mail-Klein?

01:53:03.580 --> 01:53:04.460
 Habe ich da was?

01:53:04.460 --> 01:53:05.140
 Nee,

01:53:05.140 --> 01:53:06.460
 das ist doch das.

01:53:06.460 --> 01:53:06.900
 Ach Mensch,

01:53:06.900 --> 01:53:07.200
 ich bin,

01:53:07.200 --> 01:53:07.780
 ja,

01:53:07.780 --> 01:53:09.660
 genau.

01:53:09.660 --> 01:53:11.360
 Mit welchen Formfaktoren

01:53:11.360 --> 01:53:11.780
 testest du?

01:53:11.780 --> 01:53:12.360
 Desktop,

01:53:12.360 --> 01:53:13.220
 Smartphone?

01:53:13.220 --> 01:53:15.240
 Featurephone nicht.

01:53:15.240 --> 01:53:15.700
 Tablet,

01:53:15.700 --> 01:53:16.000
 ja.

01:53:16.000 --> 01:53:16.420
 Tablet,

01:53:16.420 --> 01:53:16.780
 Tablet,

01:53:16.780 --> 01:53:17.080
 ja.

01:53:17.080 --> 01:53:18.160
 Smartwatch,

01:53:18.160 --> 01:53:18.620
 unbedingt.

01:53:18.620 --> 01:53:19.700
 Also meine Webseite,

01:53:19.700 --> 01:53:21.600
 meine Firmenwebseite muss auf der Smartwatch

01:53:21.600 --> 01:53:22.400
 auch gut aussehen.

01:53:22.560 --> 01:53:22.800
 Ja,

01:53:22.800 --> 01:53:23.260
 hallo.

01:53:23.260 --> 01:53:25.720
 TV.

01:53:25.720 --> 01:53:27.540
 Also das mache ich manchmal,

01:53:27.540 --> 01:53:28.680
 wenn ich richtig hart drauf bin.

01:53:28.680 --> 01:53:29.900
 Ich habe so einen relativ,

01:53:29.900 --> 01:53:32.480
 mittlerweile relativ alten Samsung TV,

01:53:32.480 --> 01:53:34.420
 der also für heutige Verhältnisse,

01:53:34.420 --> 01:53:34.740
 ich glaube,

01:53:34.740 --> 01:53:35.660
 der ist vier Jahre alt,

01:53:35.660 --> 01:53:39.560
 der aber halt so einen Uraltbrowser drauf hat,

01:53:39.560 --> 01:53:41.840
 so einen komischen Samsung irgendwas Chromium

01:53:41.840 --> 01:53:43.980
 und das ist so eine Katastrophe.

01:53:43.980 --> 01:53:45.780
 Also wenn ich mir mal wirklich einen Tag vermiesen will,

01:53:45.780 --> 01:53:47.440
 dann mache ich eine Webseite auf diesem Browser auf.

01:53:47.540 --> 01:53:48.060
 Das ist echt,

01:53:48.060 --> 01:53:49.400
 das ist wirklich schlimm,

01:53:49.400 --> 01:53:49.620
 schlimm,

01:53:49.620 --> 01:53:49.860
 schlimm.

01:53:49.860 --> 01:53:52.460
 Wobei mich echt mal interessieren würde,

01:53:52.460 --> 01:53:56.580
 was für Zeigegeräte da detected werden würden

01:53:56.580 --> 01:53:57.200
 per JavaScript.

01:53:57.200 --> 01:53:58.660
 Also mit was ist das?

01:53:58.660 --> 01:54:00.740
 Tastatur ist es ja irgendwie nicht,

01:54:00.740 --> 01:54:01.700
 aber irgendwie vielleicht schon

01:54:01.700 --> 01:54:03.440
 und da gibt es auch so ein Zeigegerät

01:54:03.440 --> 01:54:04.820
 und man kann aber mit der Tastatur ...

01:54:04.820 --> 01:54:06.420
 Das ist ja quasi wie Touch dann oft,

01:54:06.420 --> 01:54:08.740
 dass man da irgendwie so einfach so einen Böbel rumschiebt.

01:54:08.740 --> 01:54:10.100
 Es ist echt,

01:54:10.100 --> 01:54:10.480
 ja,

01:54:10.480 --> 01:54:14.480
 es wäre vielleicht tatsächlich interessantes Archäologie-Material,

01:54:14.480 --> 01:54:15.500
 was ich hier habe.

01:54:17.160 --> 01:54:18.140
 Was haben wir noch?

01:54:18.140 --> 01:54:19.300
 Spielkonsole, Screenreader,

01:54:19.300 --> 01:54:19.520
 ja,

01:54:19.520 --> 01:54:22.100
 das ist tatsächlich mein Ding.

01:54:22.100 --> 01:54:22.620
 Sollte man.

01:54:22.620 --> 01:54:23.640
 Druckerzeugnis,

01:54:23.640 --> 01:54:24.920
 also Print-CSS,

01:54:24.920 --> 01:54:26.560
 teste ich nicht.

01:54:26.560 --> 01:54:28.540
 Das soll man nicht mehr machen.

01:54:28.540 --> 01:54:31.180
 Habe ich tatsächlich für diese PDF-Druckgeschichte,

01:54:31.180 --> 01:54:34.200
 die ja auf HTML-Template basierend gedruckt wird,

01:54:34.200 --> 01:54:35.960
 gebraucht,

01:54:35.960 --> 01:54:38.580
 aber regelmäßig mache ich das jetzt nicht.

01:54:38.580 --> 01:54:40.700
 Aber da habe ich vielleicht noch eine kleine,

01:54:40.700 --> 01:54:42.000
 lustige Code-Pen-Demo,

01:54:42.000 --> 01:54:43.160
 die,

01:54:43.160 --> 01:54:44.700
 muss ich mal gerade gucken,

01:54:44.700 --> 01:54:45.700
 ob ich die jetzt schnell finde.

01:54:46.780 --> 01:54:48.720
 Weil ich habe irgendwann mal ausprobiert,

01:54:48.720 --> 01:54:52.600
 ob man denn den Inhalt von einer Seite für Sprint-CSS

01:54:52.600 --> 01:54:54.380
 auch mit CSS austauschen kann,

01:54:54.380 --> 01:54:55.360
 um dann einfach zu sagen,

01:54:55.360 --> 01:54:56.220
 nee, nee, nee, nee, nee,

01:54:56.220 --> 01:54:57.700
 druck das hier einfach nicht aus.

01:54:57.700 --> 01:54:58.920
 Wenn jemand versucht zu drucken,

01:54:58.920 --> 01:55:00.080
 kriegt er einfach was anderes.

01:55:00.080 --> 01:55:03.700
 Und das hat tatsächlich auch funktioniert.

01:55:03.700 --> 01:55:04.720
 Ich muss gerade gucken,

01:55:04.720 --> 01:55:06.500
 ich hatte da mal eine Code-Pen-Demo gebaut.

01:55:06.500 --> 01:55:10.280
 Die ist aber jetzt in der Liste schon relativ weit nach hinten gerutscht.

01:55:11.120 --> 01:55:13.480
 So, ich bin jetzt aber gleich da.

01:55:13.480 --> 01:55:14.080
 Das Ding,

01:55:14.080 --> 01:55:15.300
 da stand nämlich dann irgendwie,

01:55:15.300 --> 01:55:16.700
 try to print this.

01:55:16.700 --> 01:55:18.820
 Und, äh,

01:55:18.820 --> 01:55:21.100
 Spoiler-Alert geht natürlich nicht, ne?

01:55:21.100 --> 01:55:22.620
 So, das ist aber eine,

01:55:22.620 --> 01:55:23.080
 ich glaube,

01:55:23.080 --> 01:55:25.500
 eins meiner ersten Code-Pens war das überhaupt.

01:55:25.500 --> 01:55:27.780
 Da muss ich echt weit zurück.

01:55:27.780 --> 01:55:28.360
 Soll ich das,

01:55:28.360 --> 01:55:30.620
 das wird jetzt gerade langweilig für die Zuhörer, gell?

01:55:30.860 --> 01:55:32.200
 Das ist sogar mein,

01:55:32.200 --> 01:55:33.620
 das ist sogar mein erstes Code-Pen.

01:55:33.620 --> 01:55:35.000
 Das ist sogar mein allererstes.

01:55:35.000 --> 01:55:36.220
 Ich habe es gerade gefunden.

01:55:36.220 --> 01:55:40.080
 Und es hat ein Herz und tatsächlich 1097 Views.

01:55:40.080 --> 01:55:40.660
 Ich habe keine Ahnung,

01:55:40.660 --> 01:55:42.040
 wie das zustande gekommen ist.

01:55:42.040 --> 01:55:43.680
 Ich muss mal gucken,

01:55:43.680 --> 01:55:44.460
 ob ich da noch sehen kann,

01:55:44.460 --> 01:55:45.500
 wann das angelegt wurde.

01:55:45.500 --> 01:55:48.000
 Das wäre jetzt echt mal interessant zu wissen.

01:55:48.000 --> 01:55:48.740
 Moment mal.

01:55:48.740 --> 01:55:51.640
 Last saved almost eight years ago.

01:55:51.640 --> 01:55:52.120
 Wow.

01:55:52.120 --> 01:55:53.960
 Okay,

01:55:53.960 --> 01:55:55.780
 das packe ich mal in die Show-Notes mal rein.

01:55:55.780 --> 01:55:57.300
 Das, äh,

01:55:57.300 --> 01:55:58.720
 wer mal,

01:55:58.720 --> 01:55:59.760
 wer mal drucken will

01:55:59.760 --> 01:56:01.280
 und nicht drucken will,

01:56:01.280 --> 01:56:02.140
 würde ich sagen.

01:56:02.140 --> 01:56:02.980
 Das ist auch witzig.

01:56:02.980 --> 01:56:03.440
 Äh,

01:56:03.440 --> 01:56:05.200
 nächstes ist CSS für Print.

01:56:05.200 --> 01:56:06.360
 Schreibst du Styles für Print?

01:56:06.360 --> 01:56:08.520
 Und es gibt tatsächlich die Auswahlmöglichkeit,

01:56:08.520 --> 01:56:10.880
 ich schreibe hauptsächlich Print-Style-Sheets.

01:56:10.880 --> 01:56:15.080
 Das würde mich in der Auswertung extrem interessieren.

01:56:15.080 --> 01:56:15.120
 Oh ja,

01:56:15.120 --> 01:56:18.020
 das kann eigentlich fast nur Spaßantwort sein.

01:56:18.020 --> 01:56:18.620
 Doch, doch,

01:56:18.620 --> 01:56:18.840
 nein,

01:56:18.840 --> 01:56:20.260
 das kann ich mir vorstellen.

01:56:20.260 --> 01:56:21.560
 Es gibt ja auch Leute,

01:56:21.560 --> 01:56:24.820
 die hauptsächlich E-Mail-Newsletter bauen.

01:56:24.820 --> 01:56:25.760
 Ja, ja.

01:56:25.760 --> 01:56:27.460
 Und das finde ich auch schon sehr speziell.

01:56:27.460 --> 01:56:29.360
 Mich würde es nicht wundern,

01:56:29.760 --> 01:56:32.780
 wenn es irgendeinen speziellen Anwendungsfall gibt,

01:56:32.780 --> 01:56:34.840
 an den wir jetzt gerade nicht denken,

01:56:34.840 --> 01:56:35.960
 wo, ähm,

01:56:35.960 --> 01:56:37.940
 wie ist das denn,

01:56:37.940 --> 01:56:40.080
 wenn du jetzt zum Beispiel ein EPUB hast,

01:56:40.080 --> 01:56:42.040
 das aber published wird?

01:56:42.040 --> 01:56:43.840
 EPUB ist ja CSS hintendran.

01:56:43.860 --> 01:56:46.260
 Und jemand,

01:56:46.260 --> 01:56:48.180
 der für sowas CSS schreibt,

01:56:48.180 --> 01:56:52.200
 das wäre ja vielleicht Print-Style im weitesten Sinne.

01:56:52.200 --> 01:56:54.960
 Es ist zwar nicht in dem Print-Media-Query,

01:56:54.960 --> 01:56:57.580
 aber es wäre Print-Style.

01:56:57.580 --> 01:56:58.820
 Also man kann ja mit CSS,

01:56:58.820 --> 01:57:01.260
 kannst ja theoretisch auch Druckerzeugnisse designen.

01:57:01.260 --> 01:57:01.580
 Geht ja.

01:57:01.580 --> 01:57:04.680
 Also würde ich nicht ausschließen wollen.

01:57:04.820 --> 01:57:05.140
 Ja, klar.

01:57:05.140 --> 01:57:06.080
 Nee, weiß man nicht.

01:57:06.080 --> 01:57:07.000
 Man steckt nicht drin.

01:57:07.000 --> 01:57:08.300
 Als nächstes kommt nämlich auch für E-Mail-Clients.

01:57:08.300 --> 01:57:09.160
 Ja, CSS für E-Mail-Clients.

01:57:09.160 --> 01:57:12.720
 Ich habe tatsächlich eine Zeit lang,

01:57:12.720 --> 01:57:14.940
 weil du es gerade angesprochen hast,

01:57:14.940 --> 01:57:16.680
 sehr viel damit zu tun gehabt

01:57:16.680 --> 01:57:18.160
 und da auch sehr viel drüber gelernt.

01:57:18.160 --> 01:57:19.540
 Inzwischen,

01:57:19.540 --> 01:57:22.300
 weil ich da nicht mehr mit betraut bin,

01:57:22.300 --> 01:57:23.680
 mit dem Team,

01:57:23.680 --> 01:57:24.160
 mit der Sache,

01:57:24.160 --> 01:57:25.900
 nicht mehr so oft.

01:57:25.900 --> 01:57:27.200
 Aber ab und zu mal noch.

01:57:27.200 --> 01:57:29.620
 Schön Tabellen-Layouts.

01:57:29.620 --> 01:57:31.660
 Coding like it's 1999.

01:57:33.660 --> 01:57:37.500
 Ich musste gerade nicht rülpsen,

01:57:37.500 --> 01:57:38.060
 tut mir leid.

01:57:38.060 --> 01:57:39.400
 Gut.

01:57:39.400 --> 01:57:41.060
 Nächster Punkt.

01:57:41.060 --> 01:57:42.820
 Wir sind jetzt fast fertig.

01:57:42.820 --> 01:57:43.680
 Jetzt sind wir fast durch.

01:57:43.680 --> 01:57:44.520
 Ressourcen.

01:57:44.520 --> 01:57:45.100
 Oh Gott, wir haben es bald geschafft.

01:57:45.100 --> 01:57:45.840
 Welche Ressourcen?

01:57:45.840 --> 01:57:46.780
 Wird das unsere längste Folge?

01:57:46.780 --> 01:57:47.480
 Vielleicht, wer weiß.

01:57:47.480 --> 01:57:50.980
 Ressourcen, also wo lernt man konsultieren?

01:57:50.980 --> 01:57:51.800
 Das ist ja schön übersetzt.

01:57:51.800 --> 01:57:54.140
 Welche Ressourcen konsultierst du zu CSS?

01:57:54.140 --> 01:57:55.000
 Das ist sehr schön.

01:57:55.000 --> 01:57:57.620
 Ich finde konsultieren ist ein sehr schönes Wort.

01:57:57.620 --> 01:57:59.580
 Konsultatieren, würde ich jetzt sagen.

01:57:59.580 --> 01:58:01.140
 Ich habe einfach mal wieder was erfunden.

01:58:02.960 --> 01:58:06.220
 Also CSS Tricks, A List Apart, Smashing Magazine.

01:58:06.220 --> 01:58:08.000
 Code Drops.

01:58:08.000 --> 01:58:08.320
 Code Drops.

01:58:08.320 --> 01:58:09.020
 Eine, also wirklich,

01:58:09.020 --> 01:58:10.680
 Shoutout Code Drops.

01:58:10.680 --> 01:58:12.620
 Schaut euch Code Drops an.

01:58:12.620 --> 01:58:13.760
 Da gibt es so geile Demos,

01:58:13.760 --> 01:58:14.840
 das ist immer wieder der Hammer.

01:58:14.840 --> 01:58:16.640
 Also eigentlich will ich das gar nicht so laut sagen,

01:58:16.640 --> 01:58:18.320
 weil ich eigentlich der Einzige sein will,

01:58:18.320 --> 01:58:18.900
 der die kennt.

01:58:18.900 --> 01:58:20.300
 Das ist eh schon mega bekannt.

01:58:20.300 --> 01:58:21.960
 Code Drops, supergeile Seite.

01:58:21.960 --> 01:58:23.560
 Sidepoint.

01:58:23.560 --> 01:58:25.480
 Hatte ich sogar mal ein Buch von denen,

01:58:25.480 --> 01:58:26.720
 aber das ist nicht mehr so bekannt.

01:58:26.720 --> 01:58:28.680
 David Walsh, Blog, DevTO, Sidebar,

01:58:28.680 --> 01:58:30.920
 Hey Designer, CSS Weekly, Frontend Horse.

01:58:30.920 --> 01:58:32.940
 Frontend Horse?

01:58:32.940 --> 01:58:33.940
 Was?

01:58:33.940 --> 01:58:34.720
 Kennst du das?

01:58:34.720 --> 01:58:35.100
 Nee.

01:58:35.100 --> 01:58:38.020
 Frontend Fertz.

01:58:38.020 --> 01:58:40.620
 Ich kenne keinen Seiten und Kurse,

01:58:40.620 --> 01:58:41.560
 MDN natürlich,

01:58:41.560 --> 01:58:43.000
 Stack Overflow hatten wir ja auch schon.

01:58:43.000 --> 01:58:44.200
 Gut, andere Blogs und Magazine,

01:58:44.200 --> 01:58:45.140
 natürlich wo wir sind,

01:58:45.140 --> 01:58:46.400
 ist vorne von der Show, ne?

01:58:46.400 --> 01:58:48.400
 Muss da rein als andere Antwort, oder?

01:58:48.400 --> 01:58:49.640
 Ja, das müsste ja auf jeden Fall kommen.

01:58:49.640 --> 01:58:51.760
 Wo, ja, wo wir sind.

01:58:51.760 --> 01:58:53.880
 Aber kommt das vielleicht später noch?

01:58:53.880 --> 01:58:57.600
 Also alle sind aufgefordert,

01:58:57.600 --> 01:58:59.420
 hier in dieses Feld reinzuschreiben,

01:58:59.420 --> 01:59:00.680
 wo wir sind, ist vorne.show.

01:59:00.680 --> 01:59:02.340
 Ja, bitte das machen.

01:59:02.340 --> 01:59:03.940
 Also ich könnte mir vorstellen,

01:59:03.940 --> 01:59:05.460
 dass wenn jeder Hörer das macht,

01:59:05.460 --> 01:59:06.720
 also ich sage jetzt mal nicht,

01:59:06.720 --> 01:59:07.600
 wie viele Hörer wir haben,

01:59:07.600 --> 01:59:08.520
 aber wenn es jeder macht,

01:59:08.520 --> 01:59:11.440
 das würde statistisch signifikant werden,

01:59:11.440 --> 01:59:13.120
 sodass wir, behaupte ich mal,

01:59:13.120 --> 01:59:15.440
 dass wir da irgendwie so vielleicht

01:59:15.440 --> 01:59:17.000
 einen kleinen Balken auftauchen würden.

01:59:17.080 --> 01:59:19.380
 Was ist das denn?

01:59:19.380 --> 01:59:20.980
 Ja, das, ich,

01:59:20.980 --> 01:59:22.440
 also wenn es wirklich jeder macht,

01:59:22.440 --> 01:59:23.360
 also hier wird es wirklich,

01:59:23.360 --> 01:59:25.400
 ihr, also ihr kriegt Ruhm und Ehre,

01:59:25.400 --> 01:59:26.740
 also wenn wir da auftauchen,

01:59:26.740 --> 01:59:28.220
 dann, Ruhm und Ehre,

01:59:28.220 --> 01:59:29.660
 da machen wir eine Sonderfolge,

01:59:29.660 --> 01:59:30.960
 wo wir eine Flasche rumtrinken

01:59:30.960 --> 01:59:34.100
 und Feuerwerk abschießen,

01:59:34.100 --> 01:59:35.060
 den Sound,

01:59:35.060 --> 01:59:37.300
 den kriegt ihr dann live eingespielt.

01:59:37.300 --> 01:59:37.980
 Nee, Spaß.

01:59:37.980 --> 01:59:41.580
 Also schnell weiter, schnell weiter.

01:59:41.580 --> 01:59:43.060
 Seiten und Kurse,

01:59:43.060 --> 01:59:44.740
 Stack Overflow,

01:59:44.740 --> 01:59:46.380
 da haben wir tatsächlich

01:59:46.380 --> 01:59:47.400
 Folge Nummer eins

01:59:47.400 --> 01:59:49.360
 widmet sich Stack Overflow.

01:59:49.360 --> 01:59:50.960
 MDN hatten wir es

01:59:50.960 --> 01:59:52.220
 schon sehr oft davon,

01:59:52.220 --> 01:59:53.160
 haben wir auch immer wieder verlinkt

01:59:53.160 --> 01:59:53.840
 in den Shownotes,

01:59:53.840 --> 01:59:55.380
 auch wenn es jetzt wohl leider

01:59:55.380 --> 01:59:56.100
 nicht weitergeht,

01:59:56.100 --> 01:59:58.160
 da hatten wir es in Folge,

01:59:58.160 --> 01:59:58.900
 was weiß ich,

01:59:58.900 --> 01:59:59.240
 davon.

01:59:59.240 --> 01:59:59.920
 Aber da habe ich jetzt gerade

01:59:59.920 --> 02:00:00.680
 was gehört drüber.

02:00:00.680 --> 02:00:01.860
 Geht es, soll doch weitergehen?

02:00:02.060 --> 02:00:05.040
 Die haben ja offiziell,

02:00:05.040 --> 02:00:06.060
 sollte das ja nie aufhören,

02:00:06.060 --> 02:00:06.480
 das soll jetzt

02:00:06.480 --> 02:00:08.400
 in den Sternen,

02:00:08.400 --> 02:00:10.320
 das wird jetzt migriert

02:00:10.320 --> 02:00:11.340
 zu GitHub,

02:00:11.340 --> 02:00:12.740
 habe ich gehört.

02:00:12.740 --> 02:00:15.240
 Also zumindest die Datenquelle,

02:00:15.240 --> 02:00:15.740
 wenn ich das,

02:00:15.740 --> 02:00:16.620
 okay, korrigiert mich,

02:00:16.620 --> 02:00:17.700
 wenn ich das falsch verstanden habe,

02:00:17.700 --> 02:00:18.660
 ich lese bei Twitter

02:00:18.660 --> 02:00:19.400
 immer nur so drüber,

02:00:19.400 --> 02:00:21.220
 dass die Datenquelle

02:00:21.220 --> 02:00:22.020
 am Ende GitHub ist

02:00:22.020 --> 02:00:22.680
 und nicht mehr irgendwie

02:00:22.680 --> 02:00:23.240
 die Datenbank,

02:00:23.240 --> 02:00:24.080
 aus der das vorher kam.

02:00:24.080 --> 02:00:24.440
 Wahrscheinlich,

02:00:24.580 --> 02:00:25.880
 weil Mozilla das loswerden will,

02:00:25.880 --> 02:00:26.520
 dass sie das nicht mehr

02:00:26.520 --> 02:00:27.260
 betreiben müssen.

02:00:27.260 --> 02:00:29.300
 Kommt das jetzt woanders hin?

02:00:29.300 --> 02:00:31.540
 Ja, beim MDN

02:00:31.540 --> 02:00:32.620
 total geile,

02:00:32.620 --> 02:00:33.580
 unverzichtbare Quelle.

02:00:33.580 --> 02:00:34.500
 Hoffen wir mal,

02:00:34.500 --> 02:00:35.640
 dass es das noch lange gibt.

02:00:35.640 --> 02:00:37.720
 W3-Schools,

02:00:37.720 --> 02:00:39.240
 oft gescholten,

02:00:39.240 --> 02:00:39.820
 ich weiß nicht,

02:00:39.820 --> 02:00:40.840
 wie da der aktuelle Stand ist.

02:00:40.840 --> 02:00:42.260
 Die haben auf jeden Fall

02:00:42.260 --> 02:00:42.900
 sehr gute SEO,

02:00:42.900 --> 02:00:43.960
 man landet oft da drauf,

02:00:43.960 --> 02:00:44.880
 wenn man nach was sucht.

02:00:44.880 --> 02:00:46.360
 Free Code Camp

02:00:46.360 --> 02:00:47.120
 kenne ich,

02:00:47.120 --> 02:00:48.360
 habe ich auch schon benutzt,

02:00:48.360 --> 02:00:50.220
 mache ich jetzt aber nicht

02:00:50.220 --> 02:00:50.740
 regelmäßig,

02:00:50.740 --> 02:00:51.140
 aber eigentlich auch ganz cool.

02:00:51.140 --> 02:00:51.820
 Code Academy,

02:00:51.820 --> 02:00:53.020
 Dito,

02:00:53.020 --> 02:00:54.340
 Level Up Tutorial,

02:00:54.420 --> 02:00:55.040
 sagt mir gar nichts.

02:00:55.040 --> 02:00:55.280
 Also,

02:00:55.280 --> 02:00:56.800
 ich habe so langsam

02:00:56.800 --> 02:00:57.380
 echtes Gefühl,

02:00:57.380 --> 02:00:58.360
 ich bin Legastheniker,

02:00:58.360 --> 02:00:59.920
 weil nachdem du das

02:00:59.920 --> 02:01:00.840
 jetzt vorgelesen hast,

02:01:00.840 --> 02:01:03.060
 habe ich zum ersten Mal gemerkt.

02:01:03.060 --> 02:01:04.720
 Ich hatte letztens auf Twitter

02:01:04.720 --> 02:01:06.520
 die Diskussion verfolgt,

02:01:06.520 --> 02:01:07.120
 wo jemand geschrieben hat,

02:01:07.120 --> 02:01:07.560
 ach Gott,

02:01:07.560 --> 02:01:09.180
 das heißt ja Code Academy,

02:01:09.180 --> 02:01:10.140
 das heißt ja gar nicht

02:01:10.140 --> 02:01:10.800
 Code Academy.

02:01:10.800 --> 02:01:11.160
 Ja,

02:01:11.160 --> 02:01:12.380
 das ist dasselbe

02:01:12.380 --> 02:01:13.340
 wie I'm Developer.

02:01:13.340 --> 02:01:13.680
 Ja,

02:01:13.680 --> 02:01:13.900
 genau,

02:01:13.900 --> 02:01:14.460
 I'm Developer.

02:01:14.460 --> 02:01:15.460
 Das ist,

02:01:15.460 --> 02:01:15.880
 also,

02:01:15.880 --> 02:01:17.080
 jetzt,

02:01:17.080 --> 02:01:18.480
 jetzt habe ich gerade geblickt,

02:01:18.480 --> 02:01:20.020
 dass das nicht Code Academy heißt,

02:01:20.020 --> 02:01:20.380
 sondern Code Academy.

02:01:20.380 --> 02:01:20.660
 Sehr schön,

02:01:20.660 --> 02:01:21.140
 wir sind ja hier,

02:01:21.140 --> 02:01:21.760
 um was zu lernen.

02:01:21.760 --> 02:01:22.840
 Ei,

02:01:22.840 --> 02:01:23.600
 ei, ei, ei,

02:01:23.600 --> 02:01:24.260
 meine Güte.

02:01:24.260 --> 02:01:25.140
 Man hätte auch denken können,

02:01:25.140 --> 02:01:25.720
 ich habe wieder einfach

02:01:25.720 --> 02:01:26.640
 irgendein Wort erfunden,

02:01:26.640 --> 02:01:28.140
 so wie Spezifizität

02:01:28.140 --> 02:01:29.760
 oder kommersionelle.

02:01:29.760 --> 02:01:33.420
 Die kommersionelle Spezifizität,

02:01:33.420 --> 02:01:34.940
 das Frontendbuch

02:01:34.940 --> 02:01:36.780
 von Konstantin Klein.

02:01:39.780 --> 02:01:40.180
 Okay,

02:01:40.180 --> 02:01:41.040
 wir überspringen das mal,

02:01:41.040 --> 02:01:42.340
 da gibt es noch diverse Alternativen.

02:01:42.340 --> 02:01:43.240
 Ich habe einfach,

02:01:43.240 --> 02:01:43.920
 bei überall,

02:01:43.920 --> 02:01:45.580
 wo stehen andere Seiten und Kurse

02:01:45.580 --> 02:01:46.620
 und andere Podcasts,

02:01:46.620 --> 02:01:46.800
 habe ich,

02:01:46.800 --> 02:01:47.200
 wo wir sind,

02:01:47.200 --> 02:01:48.560
 ist vorne im Punkt Show eingetragen.

02:01:48.560 --> 02:01:49.180
 Okay,

02:01:49.180 --> 02:01:49.780
 das mache ich jetzt auch.

02:01:49.780 --> 02:01:51.800
 Gut,

02:01:51.800 --> 02:01:53.500
 dann gibt es Syntax FM.

02:01:53.500 --> 02:01:53.680
 Ach,

02:01:53.680 --> 02:01:54.680
 Podcast kommt noch als extra.

02:01:54.680 --> 02:01:58.560
 Das sind natürlich alles Englischsprachige.

02:01:58.560 --> 02:02:00.220
 Ich kenne sie nicht alle.

02:02:00.220 --> 02:02:01.980
 Und ich höre davon keinen regelmäßig.

02:02:01.980 --> 02:02:02.940
 Also Syntax,

02:02:02.940 --> 02:02:03.840
 ja,

02:02:03.840 --> 02:02:05.140
 mal rein,

02:02:05.140 --> 02:02:07.700
 aber keinen davon regelmäßig.

02:02:07.700 --> 02:02:10.020
 Non-Breaking Space Show?

02:02:10.020 --> 02:02:11.020
 Keine Ahnung.

02:02:11.020 --> 02:02:11.960
 Das geht auch ein bisschen nach Drogen.

02:02:11.960 --> 02:02:12.920
 Gut.

02:02:12.920 --> 02:02:15.020
 Am Schluss geht es jetzt noch um Meinungen.

02:02:15.020 --> 02:02:15.420
 Ich glaube,

02:02:15.420 --> 02:02:16.640
 das füllt jeder für sich aus.

02:02:16.640 --> 02:02:16.980
 Ich glaube,

02:02:16.980 --> 02:02:18.280
 wir kommen dann wirklich zum Ende damit,

02:02:18.280 --> 02:02:18.440
 oder?

02:02:19.040 --> 02:02:20.160
 Es gibt noch Meinungen,

02:02:20.160 --> 02:02:21.160
 sowas wie,

02:02:21.160 --> 02:02:22.140
 nur ein paar Beispiele.

02:02:22.140 --> 02:02:23.400
 CSS ist leicht zu lernen.

02:02:23.400 --> 02:02:24.240
 Starke Ablehnung,

02:02:24.240 --> 02:02:24.780
 Ablehnung neutral,

02:02:24.780 --> 02:02:25.440
 Zustimmung,

02:02:25.440 --> 02:02:26.180
 starke Zustimmung.

02:02:26.180 --> 02:02:27.540
 Entwickelt sich zu langsam

02:02:27.540 --> 02:02:28.420
 und so weiter und so fort.

02:02:28.420 --> 02:02:30.140
 Also das müssen wir jetzt echt nicht durchgehen.

02:02:30.140 --> 02:02:34.100
 Dann gibt es zuallerletzt noch eine Section über dich.

02:02:34.100 --> 02:02:36.140
 Erfahrungen in Jahren,

02:02:36.140 --> 02:02:37.100
 Unternehmensgröße,

02:02:37.100 --> 02:02:38.060
 jährliches Einkommen,

02:02:38.060 --> 02:02:39.440
 wenn man das angeben will.

02:02:39.440 --> 02:02:41.360
 Ich arbeite kostenlos.

02:02:41.360 --> 02:02:43.040
 Jetzt auch als Auswahl.

02:02:43.040 --> 02:02:44.300
 Okay,

02:02:44.300 --> 02:02:44.960
 mich kann man mieten.

02:02:44.960 --> 02:02:45.940
 Mir ist gerade aufgefallen,

02:02:45.940 --> 02:02:47.960
 ich habe da jetzt gerade mal,

02:02:48.220 --> 02:02:49.440
 also ich muss mal rausfinden,

02:02:49.440 --> 02:02:50.940
 was für eine Schriftart

02:02:50.940 --> 02:02:53.240
 diese Optionen sind,

02:02:53.240 --> 02:02:57.440
 weil ich das scharfe S

02:02:57.440 --> 02:02:58.800
 abgefahren finde da drin.

02:02:58.800 --> 02:03:00.000
 Das ist mir nämlich gerade aufgefallen.

02:03:00.000 --> 02:03:00.280
 Ach ja,

02:03:00.280 --> 02:03:01.080
 Unternehmensgröße.

02:03:01.080 --> 02:03:01.400
 Ui,

02:03:01.400 --> 02:03:02.180
 schick.

02:03:02.180 --> 02:03:05.980
 Das ist noch so ein richtiges S-Set.

02:03:05.980 --> 02:03:07.460
 Es ist ein S-Set.

02:03:07.460 --> 02:03:07.960
 Da sieht man,

02:03:07.960 --> 02:03:09.720
 warum das auch so genannt wird.

02:03:09.720 --> 02:03:10.320
 Und dann ein Z.

02:03:10.320 --> 02:03:11.500
 Das lange S.

02:03:11.500 --> 02:03:12.720
 Das lange S und das Z.

02:03:12.720 --> 02:03:13.100
 Genau.

02:03:13.100 --> 02:03:14.260
 Ich würde jetzt nicht sagen,

02:03:14.260 --> 02:03:15.020
 dass es schön ist,

02:03:15.020 --> 02:03:15.960
 aber es ist abgefahren.

02:03:15.960 --> 02:03:17.480
 Das habe ich so noch nie gesehen.

02:03:17.740 --> 02:03:19.460
 Das sieht echt verrückt aus.

02:03:19.460 --> 02:03:19.800
 Ah,

02:03:19.800 --> 02:03:20.260
 ich sehe es gerade.

02:03:20.260 --> 02:03:21.480
 Okay.

02:03:21.480 --> 02:03:23.020
 IBM Plex Mono.

02:03:23.020 --> 02:03:23.960
 IBM Plex Mono.

02:03:23.960 --> 02:03:24.820
 Okay,

02:03:24.820 --> 02:03:25.360
 krass.

02:03:25.360 --> 02:03:27.020
 Verrückt.

02:03:27.020 --> 02:03:28.020
 Gut,

02:03:28.020 --> 02:03:29.640
 aber ja,

02:03:29.640 --> 02:03:30.540
 damit sind wir eigentlich am Ende.

02:03:30.540 --> 02:03:31.060
 Das kann,

02:03:31.060 --> 02:03:31.380
 wie gesagt,

02:03:31.380 --> 02:03:32.720
 jeder für sich ausfüllen.

02:03:32.720 --> 02:03:34.100
 Und ich glaube,

02:03:34.100 --> 02:03:36.040
 wenn man das jetzt nicht so zerkaut,

02:03:36.040 --> 02:03:37.120
 sondern wirklich nur anklickt,

02:03:37.120 --> 02:03:38.620
 dann kann man da echt schnell durch sein.

02:03:38.620 --> 02:03:38.960
 Man kriegt einen Score am Ende.

02:03:38.960 --> 02:03:40.080
 Man kriegt einen Score am Ende.

02:03:40.080 --> 02:03:41.080
 Wir haben nicht alles ausgefüllt,

02:03:41.080 --> 02:03:41.560
 aber ich habe,

02:03:41.560 --> 02:03:43.900
 wie viel Prozent hast du?

02:03:43.900 --> 02:03:44.760
 Na,

02:03:44.760 --> 02:03:45.880
 ich habe es ja noch nicht alles durch.

02:03:46.760 --> 02:03:47.260
 Ist ja egal.

02:03:47.260 --> 02:03:48.400
 Einfach jetzt mal abschließen.

02:03:48.400 --> 02:03:49.400
 Ich habe auch nicht alles durch.

02:03:49.400 --> 02:03:49.700
 Ja,

02:03:49.700 --> 02:03:50.820
 aber dann komme ich da noch mal zurück,

02:03:50.820 --> 02:03:52.080
 wenn ich jetzt abfertig stelle?

02:03:52.320 --> 02:03:52.720
 Egal,

02:03:52.720 --> 02:03:53.300
 mach noch mal.

02:03:53.300 --> 02:03:53.320
 Nee,

02:03:53.320 --> 02:03:53.520
 nee,

02:03:53.520 --> 02:03:55.520
 ich will den Rest ja auch in ehrlich.

02:03:55.520 --> 02:03:57.280
 Also ich habe 89 Prozent

02:03:57.280 --> 02:03:59.160
 und ich habe 89,

02:03:59.160 --> 02:04:00.140
 so viel hatte ich doch,

02:04:00.140 --> 02:04:01.380
 als ich es ehrlich ausgefüllt habe,

02:04:01.380 --> 02:04:02.140
 letztes Mal nicht.

02:04:02.140 --> 02:04:05.760
 Ich muss irgendwas falsch ausgefüllt haben.

02:04:05.760 --> 02:04:08.420
 Also ich mache das noch fertig dann bei Gelegenheit

02:04:08.420 --> 02:04:10.140
 und ja,

02:04:10.140 --> 02:04:10.720
 ich hoffe,

02:04:10.720 --> 02:04:11.940
 das war jetzt echt nicht zu langweilig.

02:04:11.940 --> 02:04:12.820
 Wir haben einfach gedacht,

02:04:12.820 --> 02:04:13.840
 wir probieren das mal aus.

02:04:13.840 --> 02:04:14.380
 Kannst du ja mal deinen Score vertwittern.

02:04:14.740 --> 02:04:16.420
 genau im Nachgang sage ich dann,

02:04:16.420 --> 02:04:16.940
 wie viel ich habe.

02:04:16.940 --> 02:04:18.560
 Ja,

02:04:18.560 --> 02:04:19.060
 wie gesagt,

02:04:19.060 --> 02:04:19.560
 ich hoffe,

02:04:19.560 --> 02:04:20.800
 das war jetzt nicht zu langweilig.

02:04:20.800 --> 02:04:21.560
 Wir haben einfach gedacht,

02:04:21.560 --> 02:04:22.460
 wir probieren das mal aus.

02:04:22.460 --> 02:04:23.980
 Ich behaupte,

02:04:23.980 --> 02:04:24.460
 ich behaupte,

02:04:24.460 --> 02:04:25.400
 dass wir haben auf der Hälfte

02:04:25.400 --> 02:04:26.420
 bestimmt die Leute verloren.

02:04:26.420 --> 02:04:27.120
 Ja,

02:04:27.120 --> 02:04:29.240
 das sehen wir dann in den Zuschauerzahlen.

02:04:29.240 --> 02:04:30.780
 Vielleicht müssen wir noch,

02:04:30.780 --> 02:04:31.900
 vielleicht müssen wir am Anfang

02:04:31.900 --> 02:04:34.120
 noch irgendeinen Cliffhanger packen,

02:04:34.120 --> 02:04:34.600
 wo wir sagen,

02:04:34.600 --> 02:04:36.440
 da gehen wir ganz am Ende noch mal drauf ein,

02:04:36.440 --> 02:04:37.240
 dass die Leute zuhören.

02:04:38.180 --> 02:04:38.980
 Wir verlosen ein Pony.

02:04:38.980 --> 02:04:40.360
 Ganz am Ende gibt es noch einen Werbeblock.

02:04:40.360 --> 02:04:43.560
 Gut.

02:04:43.560 --> 02:04:44.080
 Ja.

02:04:44.080 --> 02:04:44.880
 Ja,

02:04:44.880 --> 02:04:45.780
 ich würde sagen.

02:04:45.780 --> 02:04:47.300
 Wir sind etwas über zwei Stunden jetzt schon.

02:04:47.300 --> 02:04:47.840
 Oh,

02:04:47.840 --> 02:04:48.240
 verrückt.

02:04:48.240 --> 02:04:49.740
 Dann machen wir jetzt noch ganz schnell,

02:04:49.740 --> 02:04:50.720
 was steht jetzt noch an?

02:04:50.720 --> 02:04:51.660
 Noch ein Geilteil.

02:04:51.660 --> 02:04:51.900
 Ein Steilteil.

02:04:51.900 --> 02:04:54.040
 Und dann machen wir das ganz schnell.

02:04:54.040 --> 02:04:55.000
 Moment,

02:04:55.000 --> 02:04:56.020
 wenn ich hier einen Knopf finde.

02:04:56.020 --> 02:04:57.420
 Soll ich den Knopf machen?

02:04:57.420 --> 02:04:58.380
 Das Geilteil.

02:04:58.380 --> 02:05:01.620
 Geilteil.

02:05:01.620 --> 02:05:03.100
 Sehr beliebt.

02:05:03.100 --> 02:05:05.180
 In Jingle reinlabern.

02:05:05.180 --> 02:05:07.980
 So.

02:05:08.180 --> 02:05:10.900
 Das Geilteil ist heute ein Link,

02:05:10.900 --> 02:05:11.720
 wie so oft.

02:05:11.720 --> 02:05:13.060
 Ich habe,

02:05:13.060 --> 02:05:14.480
 habe ich dir den reingepostet?

02:05:14.480 --> 02:05:14.800
 Also,

02:05:14.800 --> 02:05:15.180
 ja,

02:05:15.180 --> 02:05:16.160
 du hast den reingepostet.

02:05:16.160 --> 02:05:17.240
 Geh mal da drauf.

02:05:17.240 --> 02:05:18.560
 Es ist schwierig.

02:05:18.560 --> 02:05:19.280
 Es klingt schon,

02:05:19.280 --> 02:05:20.720
 es klingt schon sehr merkwürdig.

02:05:20.720 --> 02:05:21.360
 Es ist so geil.

02:05:21.360 --> 02:05:21.380
 Ich weiß nicht,

02:05:21.380 --> 02:05:22.220
 ob ich das nicht eigentlich

02:05:22.220 --> 02:05:23.640
 im Private-Mode aufrufen muss,

02:05:23.640 --> 02:05:24.060
 weil da steht

02:05:24.060 --> 02:05:25.960
 adultswim.com.

02:05:25.960 --> 02:05:25.980
 Ach so,

02:05:25.980 --> 02:05:26.080
 nee,

02:05:26.080 --> 02:05:26.620
 adultswim,

02:05:26.620 --> 02:05:27.960
 das ist so das Nachprogramm

02:05:27.960 --> 02:05:29.100
 von Comedy Central,

02:05:29.100 --> 02:05:29.700
 habe ich gelernt.

02:05:29.700 --> 02:05:31.280
 Die haben zum Beispiel auch,

02:05:31.280 --> 02:05:33.340
 die haben auch,

02:05:33.340 --> 02:05:33.360
 die haben auch,

02:05:33.360 --> 02:05:34.460
 die haben auch mehrere solche,

02:05:34.460 --> 02:05:35.820
 solche Spiele und sowas drauf.

02:05:35.820 --> 02:05:37.320
 Die sind auch teilweise sehr komisch.

02:05:37.580 --> 02:05:39.820
 so künstlerisch angehaubt.

02:05:39.820 --> 02:05:41.600
 Es ist lustig.

02:05:41.600 --> 02:05:41.900
 Also,

02:05:41.900 --> 02:05:43.080
 ich versuche es mal zu beschreiben

02:05:43.080 --> 02:05:43.400
 für alle,

02:05:43.400 --> 02:05:45.060
 die den Link jetzt nicht gerade öffnen können

02:05:45.060 --> 02:05:46.280
 und als Tipp auch,

02:05:46.280 --> 02:05:48.240
 nicht auf schwachen Mobilgeräten anschauen,

02:05:48.240 --> 02:05:49.100
 sondern schon in einem,

02:05:49.100 --> 02:05:50.100
 in einem gescheiten,

02:05:50.100 --> 02:05:52.480
 gepowerten Desktop-Blauser.

02:05:52.480 --> 02:05:53.920
 Das ist ja crazy.

02:05:53.920 --> 02:05:55.040
 Das sind vier Münder,

02:05:55.040 --> 02:05:56.760
 einer ist im Vordergrund

02:05:56.760 --> 02:05:58.460
 und den kann man anpacken

02:05:58.460 --> 02:05:59.500
 mit der Maus

02:05:59.500 --> 02:06:00.700
 und nach unten ziehen,

02:06:00.700 --> 02:06:01.600
 dass er aufgeht.

02:06:01.600 --> 02:06:03.500
 Und dann öffnen sich alle Münder,

02:06:03.500 --> 02:06:04.280
 ich weiß nicht,

02:06:04.280 --> 02:06:05.140
 ob man das versteht,

02:06:05.140 --> 02:06:06.280
 wenn ich das jetzt beschreibe,

02:06:06.280 --> 02:06:08.420
 und öffnen sich und singen.

02:06:08.420 --> 02:06:08.680
 Schade,

02:06:08.680 --> 02:06:09.040
 dass wir es,

02:06:09.040 --> 02:06:11.040
 wir müssten das jetzt einspielen können,

02:06:11.040 --> 02:06:11.260
 ne?

02:06:11.260 --> 02:06:12.440
 Das ist ja verrückt.

02:06:12.440 --> 02:06:13.640
 Wow,

02:06:13.640 --> 02:06:14.140
 ich bin,

02:06:14.140 --> 02:06:15.040
 äh,

02:06:15.040 --> 02:06:16.080
 Jedenfalls singen die,

02:06:16.080 --> 02:06:17.660
 also ich erkläre es mal dazu,

02:06:17.660 --> 02:06:19.420
 die Münder singen

02:06:19.420 --> 02:06:20.620
 und zwar in schönen,

02:06:20.620 --> 02:06:21.600
 passenden Akkorden

02:06:21.600 --> 02:06:22.160
 und ich kann die,

02:06:22.160 --> 02:06:23.480
 je höher ich die aufziehe,

02:06:23.480 --> 02:06:24.420
 umso höher singen die

02:06:24.420 --> 02:06:25.500
 und je weniger,

02:06:25.500 --> 02:06:26.120
 desto weniger.

02:06:26.120 --> 02:06:27.540
 Also es ist echt verrückt.

02:06:27.540 --> 02:06:31.660
 Und wir wären natürlich kein Frontend-Podcast,

02:06:31.660 --> 02:06:33.020
 wenn ich mir nicht die technische Seite

02:06:33.020 --> 02:06:34.540
 dann auch angeschaut hätte.

02:06:34.540 --> 02:06:34.760
 Ah,

02:06:34.760 --> 02:06:37.260
 und das ist natürlich minifiziert,

02:06:37.260 --> 02:06:39.440
 ich hab's natürlich versucht dann zu deminifizieren,

02:06:39.440 --> 02:06:42.020
 aber die variablen Namen sind dann nicht mehr sprechend

02:06:42.020 --> 02:06:43.020
 und, ähm,

02:06:43.020 --> 02:06:44.340
 aber so ganz kurz,

02:06:44.500 --> 02:06:46.300
 Audio-Kontext kommt natürlich zum Einsatz,

02:06:46.300 --> 02:06:46.880
 ja,

02:06:46.880 --> 02:06:47.180
 wenn man,

02:06:47.180 --> 02:06:48.840
 wenn man irgendwie Audio-Dateien geloopt,

02:06:48.840 --> 02:06:50.780
 ohne dass man so eine Schnitt,

02:06:50.780 --> 02:06:51.440
 äh,

02:06:51.440 --> 02:06:52.460
 Marke,

02:06:52.460 --> 02:06:53.400
 Schnittnarbe,

02:06:53.400 --> 02:06:54.360
 wie auch immer man es nennen will,

02:06:54.360 --> 02:06:54.840
 hört,

02:06:54.840 --> 02:06:56.660
 das macht kann man mit Audio-Kontext.

02:06:56.660 --> 02:06:56.920
 Was für ein Format?

02:06:56.920 --> 02:06:57.820
 Nee,

02:06:57.820 --> 02:06:59.160
 bin ich leider nicht dahinter gekommen,

02:06:59.160 --> 02:06:59.560
 was die da reinladen.

02:06:59.560 --> 02:07:01.400
 Weil damit hab ich ja auch schon mal Probleme gehabt,

02:07:01.400 --> 02:07:01.740
 ähm,

02:07:01.740 --> 02:07:02.080
 dass ich,

02:07:02.080 --> 02:07:03.520
 dass ich ein schönes Loop machen wollte

02:07:03.520 --> 02:07:04.700
 und das hat irgendwie nicht geklappt.

02:07:04.700 --> 02:07:06.440
 Da kam ich leider nicht,

02:07:06.440 --> 02:07:06.940
 nicht dahinter,

02:07:06.940 --> 02:07:08.920
 weil das wird im Netzwerktab nicht angezeigt.

02:07:08.920 --> 02:07:09.940
 Und zwar,

02:07:09.940 --> 02:07:10.840
 Meinst du,

02:07:10.840 --> 02:07:11.940
 das ist Web-Audio-API?

02:07:13.320 --> 02:07:14.180
 Na gut,

02:07:14.180 --> 02:07:15.740
 Audio-Kontext ist,

02:07:15.740 --> 02:07:16.120
 gehört,

02:07:16.120 --> 02:07:18.160
 ist das nicht auch schon Teil der Web-Audio-API?

02:07:18.160 --> 02:07:19.360
 Das ist Web-Audio-API,

02:07:19.360 --> 02:07:19.740
 wird das eventuell direkt erzeugt?

02:07:19.740 --> 02:07:19.860
 Genau,

02:07:19.860 --> 02:07:22.160
 also Audio-Kontext ist drin,

02:07:22.160 --> 02:07:22.740
 nee,

02:07:22.740 --> 02:07:24.080
 erzeugt wird es,

02:07:24.080 --> 02:07:24.620
 wird es nicht,

02:07:24.620 --> 02:07:25.120
 also es kann sein,

02:07:25.120 --> 02:07:26.440
 dass der Pitch verändert wird

02:07:26.440 --> 02:07:27.740
 mit der Web-Audio-API.

02:07:28.260 --> 02:07:28.620
 ich glaub nicht,

02:07:28.620 --> 02:07:29.400
 dass die für jeden,

02:07:29.400 --> 02:07:30.580
 für jede Tonhöhe

02:07:30.580 --> 02:07:31.760
 da einen eigenen Sound haben,

02:07:31.760 --> 02:07:33.360
 aber das sind wohl schon Samples,

02:07:33.360 --> 02:07:33.740
 die da,

02:07:33.740 --> 02:07:35.020
 die da genommen wurden.

02:07:35.020 --> 02:07:35.400
 Ja,

02:07:35.400 --> 02:07:36.880
 die müsste man ja sehen können im Netzwerk.

02:07:36.880 --> 02:07:37.600
 Die müssten nicht.

02:07:37.600 --> 02:07:38.020
 Weil,

02:07:38.020 --> 02:07:38.720
 Achtung,

02:07:38.720 --> 02:07:39.340
 und jetzt kommt's

02:07:39.340 --> 02:07:40.840
 und wieder eine Cross-Referenz,

02:07:40.840 --> 02:07:41.260
 äh,

02:07:41.260 --> 02:07:42.060
 Reference,

02:07:42.060 --> 02:07:42.880
 äh,

02:07:42.880 --> 02:07:45.860
 Cross-Referenz auf eine unserer ersten Folgen,

02:07:45.860 --> 02:07:46.580
 glaub ich,

02:07:46.580 --> 02:07:47.020
 war das,

02:07:47.020 --> 02:07:47.300
 oder?

02:07:47.300 --> 02:07:48.620
 Ist das Frontend,

02:07:48.620 --> 02:07:49.180
 oder kann das weg?

02:07:49.180 --> 02:07:49.940
 Folge Nummer drei.

02:07:49.940 --> 02:07:53.220
 Und zwar ist das gemacht mit WebGL und Wasm.

02:07:54.100 --> 02:07:56.940
 Da muss doch auch,

02:07:56.940 --> 02:07:58.740
 da muss doch aber auch was reingeladen werden.

02:07:58.740 --> 02:07:59.520
 Ach, Wasm,

02:07:59.520 --> 02:07:59.800
 okay,

02:07:59.800 --> 02:08:00.800
 Wasm ist natürlich,

02:08:00.800 --> 02:08:00.980
 äh,

02:08:00.980 --> 02:08:01.560
 verschlüsselt,

02:08:01.560 --> 02:08:02.560
 also nicht verschlüsselt,

02:08:02.560 --> 02:08:03.020
 aber binär,

02:08:03.020 --> 02:08:04.020
 das ist natürlich binär.

02:08:04.020 --> 02:08:05.180
 Da siehst du halt nix

02:08:05.180 --> 02:08:07.140
 und das taucht dann wohl auch nicht im Netzwerk drauf auf.

02:08:07.140 --> 02:08:07.820
 Fick.

02:08:07.820 --> 02:08:08.840
 Und,

02:08:08.840 --> 02:08:09.160
 äh,

02:08:09.160 --> 02:08:10.600
 zu dem Thema WebGL und Wasm noch,

02:08:10.600 --> 02:08:11.460
 wen es interessiert,

02:08:11.460 --> 02:08:11.860
 ähm,

02:08:11.860 --> 02:08:13.800
 einfach mal die Folge Nummer drei anhören.

02:08:13.800 --> 02:08:14.660
 Ähm,

02:08:14.660 --> 02:08:16.200
 man sieht,

02:08:16.200 --> 02:08:17.460
 es ist wieder nur eine Spielerei,

02:08:17.460 --> 02:08:19.340
 also es ist wieder noch kein Anwendungsfall,

02:08:19.340 --> 02:08:19.720
 wo ich sag,

02:08:19.720 --> 02:08:20.000
 oh ja,

02:08:20.000 --> 02:08:20.380
 krass,

02:08:20.380 --> 02:08:21.260
 äh,

02:08:21.260 --> 02:08:23.160
 aber es scheint wohl performance-hungrig zu sein,

02:08:23.160 --> 02:08:23.700
 genug,

02:08:24.100 --> 02:08:26.340
 dass man Wasm hier einsetzen muss,

02:08:26.340 --> 02:08:26.980
 um es,

02:08:26.980 --> 02:08:27.320
 äh,

02:08:27.320 --> 02:08:28.500
 flüssig wiederzugeben.

02:08:28.500 --> 02:08:30.200
 Wow.

02:08:30.200 --> 02:08:31.820
 Es ist aber auch echt verrückt.

02:08:31.820 --> 02:08:33.180
 Es ist crazy, ne?

02:08:33.180 --> 02:08:34.660
 Es ist wirklich verrückt.

02:08:34.660 --> 02:08:36.120
 Und mit,

02:08:36.120 --> 02:08:37.300
 mit DevTools offen,

02:08:37.300 --> 02:08:37.740
 ähm,

02:08:37.740 --> 02:08:38.120
 äh,

02:08:38.120 --> 02:08:38.980
 hört sich's komisch an.

02:08:38.980 --> 02:08:39.180
 Ja,

02:08:39.180 --> 02:08:40.500
 es ruckelt und stottert und,

02:08:40.500 --> 02:08:41.000
 ja.

02:08:41.000 --> 02:08:42.240
 Ja,

02:08:42.240 --> 02:08:42.600
 aber es,

02:08:42.600 --> 02:08:43.400
 wow,

02:08:43.400 --> 02:08:44.040
 wow,

02:08:44.040 --> 02:08:44.380
 ich glaub,

02:08:44.380 --> 02:08:44.720
 das macht,

02:08:44.720 --> 02:08:46.220
 das macht den Akku von meinem Laptop hier,

02:08:46.220 --> 02:08:46.400
 ja.

02:08:46.400 --> 02:08:48.480
 Also wenn der Moritz gleich weg ist,

02:08:48.480 --> 02:08:48.620
 dann.

02:08:48.620 --> 02:08:50.580
 Ich schließ mal den Strom an,

02:08:50.580 --> 02:08:51.500
 damit es weitergeht.

02:08:51.500 --> 02:08:52.280
 Alles klar.

02:08:53.480 --> 02:08:53.680
 Genau,

02:08:53.680 --> 02:08:55.380
 also Link kommt in die Shownotes

02:08:55.380 --> 02:08:56.440
 und das fand ich einfach,

02:08:56.440 --> 02:08:56.860
 ähm,

02:08:56.860 --> 02:08:57.260
 ja,

02:08:57.260 --> 02:08:58.440
 also verrückt,

02:08:58.440 --> 02:09:00.240
 was mit Webtechnik zu machen ist,

02:09:00.240 --> 02:09:00.600
 wobei,

02:09:00.600 --> 02:09:00.980
 wie gesagt,

02:09:00.980 --> 02:09:01.360
 die Frage,

02:09:01.360 --> 02:09:03.320
 ist das denn noch Frontend oder kann das weg?

02:09:03.320 --> 02:09:04.060
 Äh,

02:09:04.060 --> 02:09:06.060
 beantworten die definitiv und endgültig,

02:09:06.060 --> 02:09:06.400
 äh,

02:09:06.400 --> 02:09:06.780
 für alle Zeiten in Folge 3.

02:09:06.780 --> 02:09:07.920
 Ich bin total verstört.

02:09:07.920 --> 02:09:09.400
 Mich verstört das total.

02:09:09.400 --> 02:09:09.760
 Ich glaub's auch.

02:09:09.760 --> 02:09:12.700
 Dann schick ich dir noch mal die anderen Spiele,

02:09:12.700 --> 02:09:14.180
 die ich gefunden hab auf Adult Swim.

02:09:14.180 --> 02:09:14.900
 Es ist faszinierend.

02:09:14.900 --> 02:09:17.720
 Wo du als Alien irgendwie Menschen sammelst und so.

02:09:17.720 --> 02:09:21.040
 Ja,

02:09:21.040 --> 02:09:21.280
 ich,

02:09:21.280 --> 02:09:21.540
 ich,

02:09:21.540 --> 02:09:21.680
 ich,

02:09:21.680 --> 02:09:23.400
 ich poste die auch mit rein.

02:09:23.400 --> 02:09:24.320
 Wir besprechen's jetzt nicht hier,

02:09:24.320 --> 02:09:24.680
 aber ich,

02:09:24.680 --> 02:09:24.980
 ähm,

02:09:24.980 --> 02:09:26.260
 ich poste die mit rein.

02:09:26.260 --> 02:09:26.980
 Ja,

02:09:26.980 --> 02:09:27.520
 faszinierend.

02:09:27.540 --> 02:09:27.700
 Genau.

02:09:27.700 --> 02:09:28.840
 Wow,

02:09:28.840 --> 02:09:29.520
 das ist also,

02:09:29.520 --> 02:09:30.540
 das ist glaube ich das,

02:09:30.540 --> 02:09:31.860
 das krasseste Geilteil,

02:09:31.860 --> 02:09:32.820
 was wir jemals hatten.

02:09:32.820 --> 02:09:34.340
 Wirklich das,

02:09:34.340 --> 02:09:35.260
 also das,

02:09:35.260 --> 02:09:36.120
 weißt du mal,

02:09:36.120 --> 02:09:36.660
 ich,

02:09:36.660 --> 02:09:37.400
 ich denke jedes Mal,

02:09:37.400 --> 02:09:37.660
 wenn ich,

02:09:37.660 --> 02:09:37.960
 wenn ich,

02:09:37.960 --> 02:09:39.860
 wenn ich dann den Mund geöffnet hab,

02:09:39.860 --> 02:09:42.360
 was ist da jetzt los?

02:09:42.360 --> 02:09:43.580
 Und das sieht auch komisch aus.

02:09:43.580 --> 02:09:43.720
 Ja.

02:09:43.720 --> 02:09:45.280
 Und dann der Ton ist auch irgendwie verstörend.

02:09:45.280 --> 02:09:47.300
 Aber ich kann trotzdem nicht aufhören zu machen.

02:09:47.300 --> 02:09:47.740
 Nee, nee,

02:09:47.740 --> 02:09:48.020
 echt,

02:09:48.020 --> 02:09:49.360
 man muss es dann auch irgendwann,

02:09:49.360 --> 02:09:50.900
 also mein Bruder hat mir das geschickt

02:09:50.900 --> 02:09:51.880
 während der Arbeitszeit.

02:09:51.880 --> 02:09:52.740
 Oh Gott.

02:09:52.740 --> 02:09:53.840
 Und ich hab dann echt irgendwann gesagt,

02:09:53.840 --> 02:09:55.060
 ich muss das jetzt zumachen.

02:09:55.060 --> 02:09:55.480
 Ich kann,

02:09:55.480 --> 02:09:56.360
 ich kann nicht mehr aufhören.

02:09:56.460 --> 02:09:57.200
 ich kann nicht arbeiten.

02:09:57.200 --> 02:09:59.920
 Es ist verstörend und faszinierend zugleich,

02:09:59.920 --> 02:10:00.100
 ja.

02:10:00.100 --> 02:10:01.220
 Oh je.

02:10:01.220 --> 02:10:02.320
 Gut,

02:10:02.320 --> 02:10:03.160
 ja,

02:10:03.160 --> 02:10:04.200
 dann sind wir durch.

02:10:04.200 --> 02:10:05.940
 Und da wir keinen Endschingel haben.

02:10:05.940 --> 02:10:15.260
 Heidebimbam.

02:10:15.260 --> 02:10:17.200
 Kommen wir noch zum Werbeblock.

02:10:17.200 --> 02:10:17.820
 Genau.

02:10:17.820 --> 02:10:18.700
 Und jetzt kommen wir zu

02:10:18.700 --> 02:10:20.140
 Werbung.

02:10:20.140 --> 02:10:23.720
 Oh Gott.

02:10:23.720 --> 02:10:24.460
 Ja,

02:10:24.460 --> 02:10:25.180
 ihr merkt schon,

02:10:25.180 --> 02:10:25.920
 also ich hab mir auch schon

02:10:25.920 --> 02:10:26.720
 das zweite Bier geholt,

02:10:26.720 --> 02:10:27.400
 dass du immer merkt,

02:10:27.400 --> 02:10:27.620
 das auch.

02:10:27.620 --> 02:10:28.340
 Aber ich kann,

02:10:28.340 --> 02:10:30.200
 ich muss das mit diesen Mündern jetzt zumachen.

02:10:30.200 --> 02:10:30.600
 Machst du,

02:10:30.600 --> 02:10:31.060
 machst du ja.

02:10:31.060 --> 02:10:32.960
 Das verwirrt mich einfach zu sehr.

02:10:32.960 --> 02:10:34.100
 Okay.

02:10:34.100 --> 02:10:34.840
 So,

02:10:34.840 --> 02:10:35.360
 Disziplin.

02:10:35.360 --> 02:10:36.360
 Am Ende nochmal.

02:10:36.360 --> 02:10:37.540
 Gut.

02:10:37.540 --> 02:10:40.180
 Ihr sollt uns bewerten,

02:10:40.180 --> 02:10:41.360
 weitererzählen,

02:10:41.360 --> 02:10:42.900
 also bewerten auf Podcastportalen.

02:10:42.900 --> 02:10:44.580
 Ihr sollt weitererzählen.

02:10:44.580 --> 02:10:45.500
 Die Leute,

02:10:45.500 --> 02:10:46.480
 die Sticker bekommen haben,

02:10:46.480 --> 02:10:48.040
 die haben auch alle einen kleinen Sticker,

02:10:48.040 --> 02:10:49.140
 einen kleinen Zettel bekommen,

02:10:49.140 --> 02:10:49.760
 wo drauf steht,

02:10:49.760 --> 02:10:50.820
 empfehlt uns weiter.

02:10:50.820 --> 02:10:52.920
 Das dürft ihr auch machen ohne Sticker,

02:10:52.920 --> 02:10:54.520
 aber ihr dürft auch bei uns Sticker anfragen.

02:10:54.520 --> 02:10:55.260
 vielleicht sind wir nett

02:10:55.260 --> 02:10:56.460
 und schicken euch einfach welche.

02:10:56.460 --> 02:10:58.880
 Ja,

02:10:58.880 --> 02:11:00.880
 wir nerven euch nicht mehr

02:11:00.880 --> 02:11:02.380
 in Zukunft jetzt mit Feedback,

02:11:02.380 --> 02:11:03.160
 aber dafür mit

02:11:03.160 --> 02:11:03.900
 empfehlt uns weiter,

02:11:03.900 --> 02:11:04.820
 weil das ist glaube ich so,

02:11:04.820 --> 02:11:06.380
 dass wir wissen jetzt,

02:11:06.380 --> 02:11:07.000
 dass wir gut sind.

02:11:07.000 --> 02:11:10.240
 Jetzt müssen es nur noch mehr,

02:11:10.240 --> 02:11:11.840
 noch mehr Leute wissen.

02:11:11.840 --> 02:11:12.900
 Und für Leute,

02:11:12.900 --> 02:11:13.700
 die es interessiert

02:11:13.700 --> 02:11:14.420
 und die uns,

02:11:14.420 --> 02:11:15.320
 die uns helfen wollen,

02:11:15.320 --> 02:11:16.120
 uns zu verbreiten,

02:11:16.120 --> 02:11:16.940
 ihr könnt ja einen

02:11:16.940 --> 02:11:18.920
 TikTok-Fankanal machen.

02:11:18.920 --> 02:11:19.280
 Oh ja.

02:11:19.380 --> 02:11:20.800
 das hätten wir jetzt noch nicht.

02:11:20.800 --> 02:11:21.380
 Also,

02:11:21.380 --> 02:11:24.560
 ich würde mich sehr drüber freuen,

02:11:24.560 --> 02:11:25.540
 wenn ich demnächst

02:11:25.540 --> 02:11:27.000
 beim Scrollen durch TikTok

02:11:27.000 --> 02:11:30.420
 WWS-IV-Ultras-Kanal finden würde,

02:11:30.420 --> 02:11:33.000
 wo mit den merkwürdigsten Zitaten

02:11:33.000 --> 02:11:33.940
 von uns

02:11:33.940 --> 02:11:35.880
 und gefakten Nacktbildern

02:11:35.880 --> 02:11:36.180
 oder so,

02:11:36.180 --> 02:11:37.320
 das fände ich wirklich,

02:11:37.320 --> 02:11:38.820
 da würde ich mich drüber freuen.

02:11:39.180 --> 02:11:40.140
 Und offenen Mündern.

02:11:40.140 --> 02:11:41.540
 Offenen Mündern?

02:11:41.540 --> 02:11:41.860
 Oh Gott,

02:11:41.860 --> 02:11:42.080
 nein,

02:11:42.080 --> 02:11:43.420
 das kriege ich nie wieder weg

02:11:43.420 --> 02:11:43.900
 aus meinem Hirn.

02:11:43.900 --> 02:11:44.580
 Geilteil,

02:11:44.580 --> 02:11:45.180
 meine ich jetzt.

02:11:45.180 --> 02:11:46.020
 Achso,

02:11:46.020 --> 02:11:46.400
 ja,

02:11:46.400 --> 02:11:47.220
 meine ich ja.

02:11:47.220 --> 02:11:48.720
 Das kriege ich nie wieder

02:11:48.720 --> 02:11:49.460
 aus meinem Hirn weg.

02:11:49.460 --> 02:11:51.040
 Okay,

02:11:51.040 --> 02:11:51.560
 ja,

02:11:51.560 --> 02:11:52.520
 bevor es noch blöder wird

02:11:52.520 --> 02:11:54.060
 und noch langwieriger,

02:11:54.060 --> 02:11:54.940
 würde ich sagen,

02:11:54.940 --> 02:11:56.600
 wir verabschieden uns

02:11:56.600 --> 02:11:57.260
 und

02:11:57.260 --> 02:11:58.560
 wir hoffen,

02:11:58.560 --> 02:11:59.580
 es hört uns nächstes Mal

02:11:59.580 --> 02:12:00.400
 noch jemand zu.

02:12:00.400 --> 02:12:01.500
 Oh je,

02:12:01.500 --> 02:12:02.760
 wir haben es echt durchgezogen.

02:12:02.760 --> 02:12:03.380
 Okay,

02:12:03.380 --> 02:12:05.340
 das Gute daran ist,

02:12:05.340 --> 02:12:06.280
 Ups.

02:12:07.600 --> 02:12:10.000
 Das Gute daran ist,

02:12:10.000 --> 02:12:11.500
 ihr müsst keine zweite Folge

02:12:11.500 --> 02:12:12.240
 damit aushalten,

02:12:12.240 --> 02:12:12.800
 weil zwischendurch

02:12:12.800 --> 02:12:13.760
 haben wir ja drüber nachgedacht,

02:12:13.760 --> 02:12:14.480
 ob wir das splitten.

02:12:14.480 --> 02:12:14.680
 Oh Gott,

02:12:14.680 --> 02:12:15.420
 stell dir mal vor.

02:12:15.420 --> 02:12:16.620
 Ja,

02:12:16.620 --> 02:12:17.500
 dann wäre es aber vielleicht

02:12:17.500 --> 02:12:18.960
 leichter konsumierbar gewesen.

02:12:18.960 --> 02:12:20.280
 Also jetzt ganz am Ende,

02:12:20.280 --> 02:12:21.100
 nachdem ihr das gehört habt,

02:12:21.100 --> 02:12:21.640
 können wir sagen,

02:12:21.640 --> 02:12:23.040
 es wäre vielleicht eine gute Idee,

02:12:23.040 --> 02:12:24.140
 zwischendurch mal einen Tag

02:12:24.140 --> 02:12:25.340
 Pause zu machen mit der Folge.

02:12:25.340 --> 02:12:27.540
 Weil es jetzt natürlich zu spät ist.

02:12:27.540 --> 02:12:27.720
 Tja,

02:12:27.720 --> 02:12:28.600
 dumm gelaufen.

02:12:28.600 --> 02:12:30.300
 Ja,

02:12:30.300 --> 02:12:31.160
 Mensch,

02:12:31.160 --> 02:12:32.340
 das war jetzt blöd.

02:12:32.340 --> 02:12:34.580
 Ich habe jetzt einfach mal draufgedrückt.

02:12:34.580 --> 02:12:37.060
 Bevor das hier kein Ende nimmt.

02:12:37.060 --> 02:12:37.580
 Ciao.

02:12:37.680 --> 02:12:37.840
 Ciao.