Wo wir sind, ist vorne, Folge 59. Wer UL sagt, muss auch Blockquote sagen. Herzlich willkommen bei Wo wir sind, ist vorne. Frontend Fakten Frotzeleien. Der Late Night Frontend Talkshow rund um Webdesign und Entwicklung. Es reden sich um Head und Kragen, HTML-Fundamentalist Moritz Gießmann und JavaScript-Jongleur Konstantin Groß. Hey, herzlich willkommen zu einer neuen Folge. Mit funktionierender Technik. Ja, es läuft. Wir hatten gar keine Probleme heute. Das ist so schön. Seltsam.
Fühlt sich ganz komisch an. Ganz komisch. Ich muss hier mal wieder ein paar Kabel rumwackeln, damit alles kaputt geht. Dann reicht ja schon, dein MacBook zu berühren. Wir hatten noch nicht mal Knackser heute. Das ist ja fantastisch. Ich habe mich gerade so gefreut über das Intro, über eine Stelle, wo der Super-Mario-Sound kommt. Pling! Nee, nee, nee. Ich meine deinen. Ich meine deinen bei Konstantin Groß.
Das ist einfach ... Ich weiß nicht, ob wir das schon mal aufgelöst haben oder ob ihr das schon mal selbst rausgefunden habt. Es gab auf jeden Fall, als wir das Intro am Anfang gemacht haben, immer Leute, denen ich das vorgespielt habe, haben gesagt, ah ja, das ist ein geiler Gag. Ohne, dass ich es erklärt habe. Von daher wird es wahrscheinlich der ein oder andere auch schon rausgefunden haben.
Aber das ist einfach schön und es hat mich gerade gefreut, das mal wieder zu hören, dass es einfach eine gute Idee war. Genau, also das haben wir es immer noch nicht aufgelöst, ne? Also das ist der, wegen Groß und der Wachs-Sound von dem Pilz bei Super Mario. Also genau, Super Mario ist so ein komischer Klempner, der immer Pilze frisst. Deswegen ist diese Welt auch so bunt und voller komischer Frässer und Pflanzen und so. Ich glaube, das ist einfach nur so ein Fiebertraum.
Ach ja, das kann gut sein, wie du das sagst, ja. Ich meine, der reitet auf der Schmutzgründung. Was ist denn da los? Es ist doch schon ein bisschen wild, oder? Also ich glaube, der hat einfach am Pilz zu viel geflossen. Der kann, ja, ich kann fliegen manchmal und dann schwimme ich mal. Oh, ein Drache. Oh, eine Qualle, die mir hinterher schwimmt. Es ist auch alles. Oh, ich werfe mit Schildkröten. Also ich meine, das kann man ja nicht ernst nehmen. Ja. Hast du ein Getränk?
Ich habe ein Getränk und ich habe beschlossen, das Fasten zu brechen. Das Alkoholfasten. Mit was völlig, das Alkoholfasten, das hast du ja beim letzten ... Genau, beim Stream oder beim letzten, ich weiß es gar nicht mehr. Du hast irgendwann mal einen Radler getrunken, ein alkoholfolles Radler, hast du es vorhin genannt. Ein alkoholfolles, ja. So, und wir haben ja gesagt, vielleicht nochmal zur Erklärung, dass wir bis zur Sommerpause nichts mehr trinken.
Und jetzt habe ich beschlossen, dass quasi, da die Sommerpause für Podcasts jetzt quasi beginnt, also nach dieser Folge, ist es okay, wenn ich jetzt eine Folge überlappen lasse. Und ich trinke wieder ein kleines Wolfbräu-Pilz, das habe ich jetzt noch im Kühlschrank gehabt und das gibt es jetzt heute. Und ich mache noch ein bisschen ... Zischklack. Zischklack, ich habe ein normales Null-Nuller-Radler wieder hier, Bitburger Standardprogramm.
Also du hast mit diesem geilen Öffner, das muss man nochmal dazu sagen, Konstantin hat dieses massive Metallgerät, mit dem man auch Gurkengläser und alles mögliche öffnen kann. Also was du damit nicht aufträgst, das lässt sich nicht öffnen. Ja, ich glaube auch. Dann stoßen wir noch an. Durchs Portal natürlich, wie immer, weil wir nehmen Remote auf, auch wenn man das nicht merkt. Also ich hoffe, dass man es nicht merkt, das wäre sehr schön.
Ja, irgendwie hat sich das so eingeschliffen, habe ich nochmal drüber nachgedacht vor kurzem. Vielleicht machen wir mal Retro. Was hat sich eingeschliffen? Ja, dann lass es uns zu Retro. Ja, lass es uns zu Retro. Okay. BW SIV präsentiert die Retrospektive. Das ist unser erster Punkt, es hat sich etwas eingeschlichen. Hat sich etwas eingeschlichen, spontaner Retro-Punkt. Ja, wir haben ja ursprünglich diesen Podcast aufgenommen, also die ersten zwei, drei Folgen.
Ich weiß gar nicht mehr genau wie viel. Vor Corona, ja, vor Ort, wir waren am gleichen Ort und haben da in Mikrofone gesprochen, haben uns ganz tief in die Augen geschaut. Und dann kam Corona und dann haben wir erst mal lernen müssen, wie man das Remote macht. Und das hat dann irgendwie ganz gut geklappt. Und das machen wir jetzt immer noch, obwohl wir, glaube ich, nicht mehr müssten. Eigentlich nicht, nee. Aber wir machen es trotzdem sehr bequem.
Es ist richtig, weil sonst müsste ich jetzt, entweder müsstest du zu mir kommen oder ich zu dir und das ist halt doch eine halbe Stunde. Und jeder hat sein Setup zu Hause aufgebaut. Ja, eigentlich passt das so. Ich glaube auch, dass wir das außer vielleicht für ein paar Specials nicht mehr ändern werden, oder? Also für unseren Hot-Tab-Stream, so er denn kommt. Ja, da müssen wir uns das überlegen, wie wir das machen, wenn er denn zusammenkommt. Der auch ganz bestimmt.
Irgendwann kommt irgendjemand auf die Idee. Vielleicht muss man dazu noch kurz was erklären, die Leute, die nicht bei Twitch zuschauen. Es gibt bei Twitch so eine Kategorie Beach and Pools oder irgendwie sowas, glaube ich, heißt die, wo dann leicht bekleidete Menschen ihre leicht bekleideten Körper in die Kamera halten. Aber ich glaube, es gibt so Regeln. Du darfst irgendwie keinen Nippel zeigen und sowas. Als Frau zumindest wieder nicht. Keine primären Geschlechtsalte.
Ich glaube, irgendwo habe ich mal sowas gelesen wie, dass das nicht der Hauptinhalt des Streams sein sollte, sondern dass man noch irgendwie, ob das noch gilt, da bin ich mir nicht so sicher. Naja, und dann haben wir natürlich, also manchmal sind, ist das halt in so, sind sogenannte Hot-Tab-Streams, ob die jetzt wirklich hot sind, die Tubs, weiß man nicht so genau, aber die haben so kleine Pools irgendwie aufgebaut an den Orten, wo sie streamen und sitzen dann halt da drin im Wasser teilweise.
Weil das, keine Ahnung, ich weiß gar nicht genau warum. Ja, gut, ich glaube, es hat mal angefangen halt mit leicht begleiteten Damen, die das gemacht haben. Vielleicht ist das aber, vielleicht ist das eine Ausrede, dass sie ein Bikini tragen können. Es könnte sein, dass das gar nicht mal, weil du könntest dich ja auch im Bikini irgendwie so hinsetzen, aber dann hast du ja vielleicht keinen, also keinen plausiblen Grund, warum du jetzt in Unterwäsche da sitzt.
Genau, genau. Dann könnte TikTok sagen hier so, mhm. Ja, aber ich sitze halt im Wasser, was soll ich machen, da kann ich ja nicht mit Klamotten reinsetzen. Genau, und der Witz war dann halt, dass wir gesagt haben, ja, sowas machen wir auch mal, aber halt erst, wenn wir mal 100 Subscriber auf Twitch gleichzeitig haben. Also ich meine, es wurde sogar schon von der Community gefordert, ne? Es kam ein Hot Tub Stream 1.
Ja, ja, genau. Und dann haben wir gesagt, okay, sobald wir 100 Subscriber haben, machen wir das. Also zur Erklärung auch nochmal, die Leute, die Twitch nicht kennen, Subscriber bedeutet, dass man entweder mit seinem Prime Sub, also man kann, wenn man Prime hat, dann kann man das mit Twitch verknüpfen und dann kann man einen Twitch-Account kostenlos unterstützen, jeden Monat. Das würde uns freuen, wenn ihr das machen würdet, das kann man hier noch kurz droppen.
Aber ein Subscriber, das ist nicht einfach nur ein Follower, also nicht jemand, der einfach nur sagt, ich möchte mitbekommen, wenn jemand live geht, sondern das ist jemand, der entweder das über Twitch Prime macht oder halt eben tatsächlich Geld bezahlt, jeden Monat. Und das muss man nicht, das ist freiwillig, also es gibt auch Sub-Only-Streams oder so, das kann man, glaube ich, machen bei Twitch. Das macht aber, glaube ich, so gut wie niemand und wir machen das auch nicht.
Also das ist wirklich nur, um uns zu unterstützen. Und ich glaube, derzeit sind wir so, um mal so eine Zahl zu nennen, bei irgendwas um die 20. Man kann bei Twitch auch Subs verschenken und es wurde auch schon angekündigt, war es 50? War die Ankündung 50? Ja, der Prime meinte. Ja, genau, der im Stream war, hat gesagt, wenn ihr mal 50 regelmäßige Zuschauer habt, dann schmeiße ich auch 50 Subs rein. Ja, das ist gar nicht so einfach. Kommt alle vorbei.
Kommt einfach alle vorbei im nächsten Stream. Im nächsten Stream ist am Mittwoch, diesmal auch außerhalb der Reihe. Und zwar am Mittwoch, den 12. Juli. Genau. Ab 20 Uhr voraussichtlich. Plus, minus, plus, minus Technikprobleme. Just set up. Ja, aber das wollte ich einfach nochmal besprechen, so von wegen, ja, wir haben uns irgendwie so eingegroovt, dass wir das jetzt irgendwie so aufnehmen. Und es funktioniert irgendwie sehr gut, finde ich.
Seit wir festgestellt haben, dass wir uns dabei sehen müssen und nicht einfach nur telefonieren quasi und irgendwie gemeinsam die Notizen hier vor uns haben mit Trello, die man schön gemeinsam live bearbeiten kann, was total gut funktioniert, schon immer. Ja, funktioniert gut remote. Wobei ich aber sagen muss, bei der GPN, das hat auch Spaß gemacht. Das war mal was anderes und da waren wir richtig mal wieder vor Ort und mit Publikum. Das war auch, war auch schön.
Also mal gucken, was die Zukunft so bringt. Vor Publikum würde ich das auch auf jeden Fall nochmal machen. Ja. Das war wirklich sehr schön. Genau. Okay, ich dachte eigentlich zuerst, ich hätte heute gar keinen Retro-Punkt, aber mir ist dann beim Anlegen des Ordners für die Aufnahme jetzt ist mir was passiert. Und zwar war ich zu faul zum Tippen, weil es so warm ist und habe einfach nur, wir machen manchmal so witzige Namen, weiß nicht, was wir da schon alles hatten.
Valentin und Moritz, Poritz oder so irgendwas, ja. Und ich wollte einfach nur Con eingeben. Und ich gebe als Ordnernam Con ein, nicht Com, ja, sondern Con, meine Anfangsbuchstaben und es begrüßt mich die Meldung, the specified device name is invalid. Ich dachte so, hä, was spinnt jetzt irgendwie, das war in dem Dropbox-Ordner, ist da irgendwas kaputt gegangen, weil ich den Prozess abgeschossen habe. Darüber gab es einen Vortrag bei der GPN, witzigerweise.
Ja, es gab bei der GPN einen Vortrag über Ordnernamen, die unter Windows nicht erlaubt sind. Ah, vielleicht können wir den noch reinhängen in die Shownotes. Das notiere ich gleich mal hier dazu, GPN-Vortrag, Link. Genau, ich habe nämlich dann, also erst dachte ich, es ist irgendwas jetzt kaputt. Ich habe den Prozess abgeschossen, damit Dropbox nicht hier synchronisiert und irgendwie habe ich was kaputt gemacht.
Habe dann aber festgestellt, okay, alle anderen Namen gehen, aber Con kann ich nicht eingeben. Dann habe ich kurz gegoogelt und bin tatsächlich auf einen Artikel gestoßen, so ein Microsoft-Hilfe-Forums-Artikel. Und siehe da, man kann bestimmte Buchstabenkombinationen nicht benutzen. Und zwar die ganzen alten Ports, die es gab, COM1, COM2 bis COM9, LPT1 und so weiter, aber auch AUX zum Beispiel oder PRN.
Also wenn ich jetzt meinen Porno-Ordner auf dem Computer ganz geheim anders nennen will, damit niemand draufkommt, PRN geht nicht. Genau, und das liegt daran, dass das irgendwelche reservierten System-Actions und Devices waren, in DOS-Zeiten noch. Und das hat sich irgendwie so, ja, bis heute eingeschlichen, dass man das nicht nennen kann. Ich such gerade mal den Talk raus. Ja, den habe ich so angefangen zu schauen, ich habe ihn nicht ganz fertig geschaut, glaube ich.
Aber definitiv, naja, guck nochmal, da gibt es auf jeden Fall einen Talk genau zu dem Thema, wo auch dann erklärt wird tatsächlich, warum. Warum das so ist. Und das scheint gar nicht so einfach zu sein, die Erklärung. Also ich meine, es liegt jetzt erstmal auf der Hand, sowas wie COM oder AUX, ja. Aber wieso ist das denn immer noch so, ist ja dann auch eine berechtigte Frage. Also der ging da, glaube ich, ziemlich in die Tiefe. Kann ich empfehlen, sich mal anzuschauen.
Also wir suchen es doch und packen es in die Show Notes auf jeden Fall. Ja, ich sage es mal so, es ist, glaube ich, auch okay, wenn man das nicht weiß, warum das so ist. Ich denke auch. Also, ja, es geht einem nichts verloren. Okay. Gut, dann hätte ich noch als Retropunkt meinen Accessibility-Cheat-Sheet, das ich schon öfter erwähnt habe. Das hat ein kleines Update bekommen. Das hatte ich im Stream auch schon erwähnt.
Und da sind jetzt, ich habe mal ein paar Links noch mit reingepackt zu, meistens zu den Web-Content-Accessibility-Guidelines, um so ein bisschen weitere Informationen für die einzelnen Themen. Ich meine, das Sheet-Sheet ist nicht, das ist kein umfassendes Accessibility-Werk, sondern das soll ja auf kurzem, also auf ganz kleinem Raum irgendwie möglichst viel Informationen unterbringen, sodass man schnell anfangen kann und so die üblichen Fehler findet.
Genau, das hat ein kleines Update bekommen, da sind jetzt Links mit dabei, das kommt auch nochmal in die Shownotes. Und ich habe auch die Why ARIA-Section ein bisschen abgedatet, weil da stand drin vorher, dass man das benutzen soll für Dynamic Websites. Und ich würde das, das stand da lange und ich habe schon immer im Stream und im Podcast was anderes erzählt, nämlich sowas wie, nutze es nur dann, wenn es nicht anders geht. Also am besten gar kein ARIA verwenden.
Genau, das steht jetzt auch so da drin, nicht, dass ich da irgendwelchen Leuten falsche Informationen weitergebe. Das war das. Gut. Und dann, wir haben es gerade von vorhin schon angekündigt, dies ist die letzte Podcast-Folge vor der Sommerpause. Und wie immer geht die Sommerpause so lang, wie sie geht. So lang, bis wir wieder Lust haben. So lang, bis wir wieder, ja gut, Lust habe ich natürlich immer. Sowieso. Aber bis es nicht mehr so warm ist, dass man nicht mehr denken kann.
Genau. Ich habe zum Beispiel Hardware-Probleme hier und ich weiß nicht, ob es an der Hitze liegt. So arg warm ist es eigentlich gar nicht. Aber ich hatte in den letzten Tagen immer wieder, und ich glaube, ich weiß jetzt, also ich weiß nicht genau, woran es liegt, aber ich habe jetzt die Ursache ausgemacht, zumindest so die Ursache Nummer eins.
Ich weiß noch nicht ganz tief, woran es liegt, aber wenn mein Internet langsam wird, was ich in letzter Zeit öfter mal hatte, dann hilft tatsächlich Router neu starten. Und das ergibt irgendwie keinen Sinn für mich. Also wieso alle zwei Tage oder mittlerweile sogar fast täglich irgendwann das Internet langsamer wird und ich das durch Router-Neustart beheben kann, ich habe keine Ahnung. Ich habe nichts an der Konfiguration geändert in letzter Zeit.
Und das bedeutet für mich, ist die Hardware kaputt oder haben die mir irgendein falsches Konfigurationsprofil draufgespielt, weil es ist ja kein, der Router gehört nicht mir, das ist so ein Gemieteter. Nicht auszuschließen, zumal ja Vodafone gerade hier in der Region auch zur Zeit öfter mal Probleme hatte.
Ja, mein Anbieter kann da Dinge tun, aber ich muss tatsächlich, also es ist jetzt noch nicht, es ist noch nicht behoben, aber der Ton, mit dem der Vodafone Support agiert auf Twitter, ich schreibe die immer über Twitter an mittlerweile, weil die da schnell antworten, der hat sich drastisch verändert zum Positiven, muss ich sagen. Also sie antworten sehr schnell und sie antworten jetzt tatsächlich mal die Menschen.
Also nicht sowas wie, ja schreib halt eine Mail an diese E-Mail-Adresse und geh sterben. Das hatte ich so, das kann man in meinem ganzen Twitter-Verlauf mit denen noch so ein bisschen nachlesen. Also das sind immer Direct Messages gewesen, sowas würden die öffentlich, glaube ich, nicht schreiben. Aber das tun sie, also sinngemäß, lass uns in Ruhe mit dem Scheiß, schreib dein Kram hier an die E-Mail-Adresse und dann schreibe ich da eine Mail und dann passiert nie wieder was.
So, das war so meine Erfahrung bislang und jetzt habe ich gedacht, jetzt habe ich hier dieses Problem, ich versuche das jetzt nochmal über Twitter. Also habe dann mal gefragt, ja gibt es denn eine Störung, weil da wusste ich noch nicht, wenn ich Router neu starte, klappt es dann wieder. Ja, nee, gibt keine Störung und ich sagte, ja, aber irgendwie, dann kam ich drauf mit dem Router und habe ich gemeint, ja, wie ist denn das, könnt ihr auch irgendwie einen Router austauschen oder so?
Und dann kam echt sehr schnell eine sehr nette Nachricht zurück, ah, wir haben dir hier mal ein Ticket aufgemacht, hier ist die ID, schicken wir dir mal. Wir können dir kostenfrei den Router einfach austauschen gegen das gleiche Modell oder gegen einen einmaligen Aufpreis von 30 Euro, glaube ich war es, kriege ich ein neueres Modell.
Da könnte ich, glaube ich, sogar entscheiden, ob ich das Große oder das Kleine nehme, da gibt es bei den Kabelroutern, bei den Kabelfritzboxen gibt es nicht so viel Auswahl. Da gibt es meines Wissens nach aktuell genau zwei Modelle, da gibt es einen Großer und einen Kleiner. Also, groß bedeutet, der hat dann mehr USB-Anschlüsse und kann irgendwie unter der Haube ein bisschen mehr, verbraucht natürlich auch mehr Strom.
Und einen Kleineren, der dann halt ein bisschen dünner Respekt ist, aber, glaube ich, auch weniger Strom verbraucht. Ja, und das war so das Angebot, hey, du kannst dasselbe Ding wieder haben oder ein neueres Modell. Da dachte ich so, hey, das ist doch mal was, ich könnte jetzt einfach mit dem Finger schnippen und sagen, schick mir einen neuen Router. Aber sie haben gesagt, ja, vielleicht ist ja auch was anderes das Problem. Wir machen ja mal ein Ticket auf, die Technik soll das checken.
Und sie hat gesagt, ja klar, wenn die Technik das checkt, ist mir auch recht, ich will nur, dass es funktioniert. Mir ist scheißegal, ob da dieser Router steht oder ein Austauschgerät oder sonst irgendeiner, make it work. Und ich hatte zum ersten Mal bei denen das Gefühl, mit einem Menschen zu sprechen. Ob das am Ende jetzt wirklich zum Erfolg führt, weiß ich nicht, aber ich fühle mich schon ein bisschen ernst genommen. Und ich finde, das macht ja schon echt was aus.
Also, dass die denen nicht immer sofort helfen können und dass es manchmal vielleicht auch wirklich Probleme gibt, wo die einfach selber nicht reinschauen können und nicht hell sehen können, ist klar. Aber der Ton macht die Musik und es ist, wenn man sich gut behandelt fühlt und einfach das Gefühl hat, okay, da gibt sich aber wirklich jemand Mühe, dass wir eine Lösung finden.
Dann ist das was komplett anderes, als wenn jemand gleich von vornherein irgendwie abblockt und so, ja, du bist das Problem, wahrscheinlich so. Ja, dann tun ich so. Was ich jetzt aber, was auch interessant ist bei denen, ist, sie haben jetzt eine eigene Störungskarte. Das finde ich eigentlich cool, dass du irgendwie nachgucken kannst, bin ich jetzt Teil von einer bekannten Störung.
Und sie haben nicht mehr, und das habe ich ja mal bemängelt, weil ich mir das technisch auch mal angeschaut hatte, lange, lange ist es her, haben wir auch im Podcast viel drüber gesprochen. Die hatten ja mal ihren eigenen Speedtest auch, der so ein bisschen weird funktioniert hat, so nach dem Motto, die größte Zahl, die ich jemals gemessen habe, in dem Zeitraum, wo ich gemessen habe, ist die Zahl, die wir sagen, dass du jetzt, also das Schnellste.
Also auch wenn nur für eine Sekunde mal ganz schnell war und danach ist es komplett gedroppt und ganz langsam, dann haben sie immer die größte Zahl angezeigt, wo du quasi direkt siehst, da stimmt was nicht. Ja, das machen sie nicht mehr, die haben den nicht mehr, oder ich weiß nicht, vielleicht haben sie den auch noch, betreiben sie aber nicht, sie weisen darauf hin, dass man doch das Ding von der Breitbandmessung nehmen soll.
Und das finde ich ein cooler Move, ich weiß nicht, ob das alle wissen, es gibt die Breitbandmessung-App, das ist tatsächlich, ich muss ich gerade nochmal gucken, von welcher Institution ist das, das ist irgendwas vom Bund, glaube ich, von der Bundesnetzagentur oder so, warte, Moment, Info.
Ist, ich weiß es nicht, ja, es ist auf jeden Fall sowas Offizielles, womit du auch zwar eine Einzelmessung machen kannst vom Internet, aber du kannst auch so eine Messstrecke machen, oder wie nennen die das, einen Messverlauf, eine Messkampagne nennen die das genau, wo sie dir dann ganz genau sagen, also die überprüfen auch deine Hardware und sagen, ja, es geht dann auch nur, wenn du im Laden bist und so, also über WLAN nicht, weil es ist dann verfälscht.
Und dann sagen sie noch, ja, und du musst irgendwie alle möglichen Apps zumachen und so weiter. Und dann sagen die, du musst jetzt innerhalb von Zeitraum X so und so viele Messungen machen mit so einem großen Abstand. Und wenn du dann am Ende dieses Ergebnis hast und das ist deutlich schlechter, das Insgesamtergebnis von diesen Messungen, und das ist deutlich schlechter als das, was der Netzanbieter dir verspricht oder wofür du bezahlst, dann hast du Rechtsanspruch auf Preisminderung.
Und von einem Kommunikationsanbieter, dass die sagen, nutz doch das, das finde ich, das finde ich ein starker Move, ehrlich gesagt, dass sie nicht sagen, ja, nutz mal unser Tool, du hast überhaupt gar kein Problem, sondern nutz mal das Offizielle und wenn wir da ein Problem haben, dann schauen wir danach. Wie gesagt, ich kann noch nicht sagen, ob es klappen wird, aber ich fühle mich viel ernster genommen.
Es ist, ich weiß nicht, was da im Support passiert ist, aber irgendjemand, da sind ein paar Köpfe gerollt und dann haben sie gesagt, so, jetzt machen wir es mal richtig. Oder?
Auch das mit der Störungskarte, das ist ein kompletter Wandel zu früher, wo es irgendwie so erstmal grundsätzlich, nee, Störung kann gar nicht sein, wir haben keine Störung und es ist keine Störung bekannt, erstmal alles abblocken, auch wenn du irgendwie halt 20.000 Tweets dazu hast von wegen, hey, mein Wodafone-Anschluss funktioniert, nicht, aber erstmal alles abblocken und das ist ja schon ein guter Move.
Nachdem wir hier so viel Schlechtes auch schon über unsere Telekommunikationsanbieter gelassen haben, ist doch schön, dass wir auch mal was Positives haben. Nee, muss man aber auch mal sagen.
Ja, genau, finde ich auch wichtig und ja, ich glaube, wir sind immer noch nicht auf Null mit den Aussagen hier, selbst wenn ich jetzt einmal was Positives sage, das Negative überwog dann doch deutlich in der Vergangenheit, deswegen dürfen wir auch noch ein paar Mal was Positives sagen, sofern es denn positiv ist. Genau.
Ich weiß aber, dass einige Kollegen von mir auch in Karlsruhe den gleichen Anschluss haben sozusagen, auch über Kabel und auch das Gigabit und die haben auch immer wieder Probleme, also es gibt sogar Leute, die dann gesagt haben, hey, so kann ich nicht arbeiten, ich lege mir jetzt noch einen zweiten Internetanschluss, also über Telefonleitung zur Sicherheit, ja, weil die es einfach so genervt hat und ich kann es, ja, es ist schlimm, aber ich kann es irgendwie nachvollziehen.
Ja, klar. Ich habe letztens ein Artikel gelesen, dass irgendwie, keine Ahnung, wie viele tausend Kunden in Karlsruhe einen kompletten Tag ohne Internet waren. Oh, aber was jetzt? Kabel oder was? Weiß ich nicht, es stand da Vodafone-Kunden, also ich nehme an, muss da Kabel sein, oder? Oder hat Vodafone auch noch DSL-Leitungen an? Also bei mir war es, du kannst auch Vodafone DSL buchen, glaube ich. Ja, ah, okay. Ja, ja.
Ich dachte, die hätten nur hier Unity Media komplett übernommen mit Kabel. Ich glaube, das ist bei Vodafone und DSL so ein bisschen ähnlich wie bei so anderen Resellern, die verkaufen halt da auch das Netz von den anderen mit und haben wahrscheinlich auch, wahrscheinlich haben sie auch teilweise eigenes Netz, könnte ich mir vorstellen, das weiß ich nicht, ist bestimmt kompliziert, ist ein großer Konzern.
Ja. Okay, Mensch, jetzt haben wir so noch zwei spontane Retro-Punkte dazu gehabt, sehr schön. Stimmt, Mensch, ja, manchmal, manchmal muss es raus. Dann geht's weiter. Ich versuch's schon gar nicht mehr, die Jingle irgendwie in ein grammatikalisches Konstrukt einzubetten. Ich hätte dir das jetzt bei dem ausnahmsweise sagen können, ist natürlich hinterher leicht gesagt. Ja, die Property der Woche. Heute gibt's was, das dampft noch, so frisch ist das.
Und zwar ist es eine CSS-Property, die nennt sich Animation Composition. Und die gibt's frisch im Sinne von, der Firefox hatte die zwar schon im August letzten Jahres hinter einem Flag, aber da ist sie jetzt erst seit dem Firefox 115 vom 4. Juli ist sie jetzt da erst released. Und auch Safari Ende 2022 und Chromium Browser seit April dieses Jahr. Also, das ist wirklich relativ frisch. Und was macht das Ganze?
Ähm, es kann ja durchaus den Zustand geben, dass ein Element zwei Animationen gleichzeitig machen soll. Also, ich, das Element ist vielleicht schon irgendwie an sich animiert. Ähm, ich hab da auch ne, ne kleine Demo dazu gefunden auf, äh, äh, CodePen. Ähm, kannst du auch mal draufklicken, dann siehst du's auch. Dann kann ich's mal beschreiben. Das ist so ein Kreis, der pulsiert einfach so. Da wird größer und kleiner und da steht Hover Me drauf.
Und wenn ich da jetzt Hover drüber mache, dann springt der so ein bisschen hoch und runter. Und bisher war das so, dass die eine Animation dann die andere Animation überschrieben hat. Das heißt, ähm, wenn der Button jetzt klein war und ich hab drüber gehoffert, dann ist der einfach zack groß geworden und hat diese Hüpfanimation gemacht.
Und was ich jetzt aber machen kann, ist, äh, auf das Element, Punkt Circle ist es in dem Fall der Selektor, Animation Composition, Minus Composition und das Keyword Add. Und dann werden diese Frames miteinander verrechnet. Das heißt, der pulsiert lustig weiter und bewegt sich dabei dann hoch und runter. Ja, ich hab's nicht drüber nachgedacht, dass das nicht geht. Ja, ich auch nicht, ja.
Ich mach's auch wenig mit so Animationen, aber klar, in dem Fall, äh, ja, das war bisher schon eine relativ große Einschränkung, wenn man irgendwie was machen wollte, was, was ich so. Oder man hätte jetzt irgendwie ein Rapper-Element quasi drumrum machen müssen und dann das einmal animieren und das andere animieren, damit es geht. Aber das gleiche Element doppelt animieren, ähm, genau, das kann ich damit jetzt machen.
Smart und, und das ist jetzt, ich mag solche Sachen, ähm, wo ich das Gefühl hab, dass ich einfach nur kurz drauf gucken muss auf den Code, ohne dass ich's jemals gesehen hab und verstehe, was da passiert. Mhm. Wird gleich noch ein bisschen komplexer, aber, ähm. Aber Add ist super, ist super einfach. Und was halt auch schön ist, graceful fallback, das heißt, der Standardzustand, äh, das bleibt einfach alles wie gehabt.
Das, ähm, Default-Keyword ist replace, also es gibt auch ein Keyword, das ich setzen kann, wenn ich diesen Standardzustand haben will und das ist das, wie es die ganze Zeit war. Und ich kann aber eben Adds setzen und dann, äh, in den Browsern dies unterstützen, was jetzt halt mittlerweile der Großteil ist, dank Evergreen-Browsern, ähm, der macht das dann einfach in schön.
Und, äh, genau, jetzt wird's noch ein bisschen komplizierter, es gibt nämlich noch ein, äh, Keyword accumulate, und, ähm, da hab ich zuerst so, ich hab diese beiden Absätze gelesen auf MDM
und hab Schwierigkeiten gehabt zu verstehen, ähm, was es da genau geht, also was da der Unterschied ist zwischen den beiden, weil da die Rede ist von, ähm, warte mal hier, if the operation is not commutative, äh, da weiß ich halt nicht, was das, was das bedeutet in dem Zusammenhang, ähm, und, äh, Animation-Type, Addition-Operation, bla, also das war, war irgendwie so ein bisschen unverständlich.
Aber es gibt eine Demo, die ich dann gefunden habe von einem Artikel auf Chrome-Developers, den ich auch noch verlinken werde in den Shownotes, der macht das Ganze ein bisschen deutlicher. Da kannst du auch mal die Demo aufrufen, äh, dazu auf dem CodePen, das ist die gleiche wie in, wie in dem Artikel, nur kann man's da in groß sehen. Das sind so vier Quadrate, ähm, die sind mit einem Transform nach rechts verschoben und um 45 Grad gedreht.
Und dann wird zusätzlich über Add Keyframes und Animation wird nochmal ein Transform draufgelegt, der dieses Quadrat, äh, per Translate X um 100 Pixel nochmal verschiebt. Ähm, und auch das, ähm, also das ist ja auch eine, eine Animation, Add Keyframes mit, äh, 2 in dem Fall, ähm, und eben Transform, Translate X 100 Pixel, ähm, und auch hier gibt's jetzt einen Unterschied, ähm, zwischen Add und Accumulate.
Und zwar, wenn ich, also in dem Standardfall, äh, da, da, da dreht sich das Rechteck einfach nochmal weiter, weil dieser, äh, der Transform mit dem, ähm, Rotate 45 Grad, der wird quasi ersetzt durch den Transform einfach nur 100 Pixel nach rechts geschoben, ähm, und das ist dann der, der Endpunkt ist dann einfach nur 100 Pixel nach rechts und die anderen beiden verschwinden.
Und früher hätte ich dann in dem Ziel-Transform, hätte ich das Translate X und das Rotate 45 Grad, hätte ich nochmal dazu packen müssen, also nochmal kopieren, ne, Duplikation wieder im Code, ähm, damit das im Endstadium auch diesen Transform vom Ursprungszustand noch, äh, beibehält. Ich hoffe, das wird halbwegs verständlich, wenn man's jetzt hört, statt zu sehen. Ich seh's, ich seh's jetzt gerade, aber es ist natürlich ein bisschen schwierig. Aber es ist ja immer so mit so CSS-Sachen.
Genau, bei Add ist es so, dass diese 100 Pixel einfach dazukommen. Ähm, das heißt, die, die Drehung bleibt dabei, äh, bleib beibehalten, die 50 Pixel nach rechts bleiben beibehalten, aber die 100 Pixel in die X-Richtung, ne, die Drehung muss man sich halt dazudenken. Das ist auch eine andere Demo, du sagst, du hast doch vier Quadrate gesagt. Drei, drei Quadrate. Drei, okay.
Ähm, genau, da schiebt sich das Quadrat dann noch zusätzlich nach unten, das heißt, so wie man's sich halt vorstellt, also das wird hinzugefügt und das heißt in dem Fall hinzugefügt, ähm, nicht nur einfach, da werden irgendwie Pixelwerte addiert, sondern es ist also wirklich so, ähm, Ich hab das Transform-Property mit Translate X und Rotate 45 Grad und hinten dran gestellt wird jetzt eben noch das Translate X 100 Pixel.
Genau, und, äh, bei Accumulate ist es so, dass das Quadrat sich wirklich einfach nur 100 Pixel direkt nach rechts verschiebt, also ich hab die Ausgangsposition, ähm, und zusätzlich kommt aber diese, kommen diese 100 Pixel nach rechts dazu, ähm. Genau, ja, ich hoffe, das ist, ist jetzt halbwegs, verständlich, wahrscheinlich nicht, wahrscheinlich nicht, aber es ist einfach, es ist auch schwierig, das zu erklären, weil es ist halt was Optisches, eine Animation ist was, was Visuelles, ähm.
Und ich denke, ähm, und ich denke, wenn man die Demo sich anschaut, äh, dann, dann wird das hoffentlich klar. Ja, die Demo ist, äh, die Demo macht's eindeutig. Genau.
Und ansonsten den Artikel auch nochmal lesen, da steht's auch nochmal dann wirklich erklärt, ne, was, was genau, äh, welche Werte gesetzt sind und, äh, was eben wo dazukommt, also da sieht man auch eben, dass das, was das Endergebnis ist, dass das Endergebnis dann eben diese drei Translate, beziehungsweise Rotate-Werte sind, ähm, die dann hintereinander stehen und bei dem anderen ist es quasi, ja genau, gut, vielleicht wird's so noch deutlicher, dass, ähm, Translate X, das wird quasi wirklich addiert, also ich hab diese, diese, äh, 50 Pixel,
in dem Ausgangswert drin von Translate X und da werden die 100 Pixel von dem, äh, von der Animation, von dem Ziel, werden da drauf gerechnet, sodass ich am Schluss also wirklich Translate X von 150 Pixel hab. Also da werden wirklich die Werte addiert und nicht einfach dieses komplette, äh, Konstrukt, diese CSS-Funktion hinten dran gesetzt, also das ist der Unterschied. Dass die Pixelwerte, äh, äh, äh, ja, wirklich addiert werden.
Genau, und, äh, ja, ich weiß jetzt noch nicht, ob ich, ob das jetzt für mich irgendwie total bahnbrechend sein wird, weil ich, wie gesagt, äh, nicht so viel mit CSS-Animationen mach, aber ich glaub, wenn man damit viel arbeitet, dann ist das echt eine große Hilfe. Cool. Das war das. Mach mal Werbung. Mach mal Werbung. Mach mal Werbung. Mach mal Werbung. Hey, hey du. Schön, dass du da bist. Na, öfter hier? Dir gefällt, was du hörst und du magst es am liebsten werbefrei und unabhängig?
Dann freuen wir uns sehr über ein paar Euro in unserem digitalen Strumpfband unter www.iv.de slash spende Auf www.iv.de slash unterstützen findest du noch ca. 69 weitere Wege, uns zu supporten. Wir danken dir. Ach, schön. Ja, Mensch, wir sind so richtig schnell, hey, halbe Stunde durch und wir sind schon beim Tagesthema verrückt. Was machen wir jetzt noch? Sollen wir noch einen schlechten Witz erzählen, oder? Fällt dir einer ein?
Nee. Ich kann Siri. Hier ist WWS IV mit dem Tagesthema. Ja, ich glaube auch, dass das Thema nicht so extrem lange dauern wird heute. Aber so ist es halt vor der Sommerpause, es ist heiß, ich fang hier gerade echt voll an zu schwitzen. Wieso eigentlich jetzt? Es ist jetzt Abend, also um zur Erklärung. Es ist jetzt 20.47 Uhr am Freitag und jetzt wird mir irgendwie warm. Ist das jetzt, war ich jetzt Alkohol, um Bier zu trinken? Kopfhörer. Kopfhörer, Alkohol, ja.
Kopf, Alkohol ist einfach, ist nicht zu unterschätzen. Genau, so, wir haben, musst du eigentlich noch den Titel erklären am Anfang? Möchtest du das noch, bevor wir anfangen? Also, das Thema haben wir noch gar nicht, wir haben es noch gar nicht gesagt. Genau, also ich habe ja gesagt, wer UL sagt, muss auch Blogquote sagen und wir setzen unsere HTML von A bis Z, äh, bis ZZ Serie weiter, äh, fort.
Und, äh, wir haben, wir hatten den Abschnitt noch nicht fertig, wir hatten Text-Content und das war ein größerer Blog, deswegen haben wir da nicht alles untergebracht, sondern haben uns ein paar wenige jetzt noch für eine zweite Folge übrig gelassen und wir hatten da angefangen mit UL im Text-Content und, äh, heute beenden wir diesen Abschnitt mit Blogquote. Und, äh, genau. Beziehungsweise, ähm, Blogquote ist das Erste, worüber wir jetzt sprechen.
Stimmt, eigentlich hätte ich sagen müssen, wer, wer, äh, UL sagt, muss auch Pre sagen. Ist egal. Ja, egal. Also, ich kann jetzt mal, ich sag jetzt mal, wir sprechen heute über Blogquote, äh, über Figure und Fit Caption, ähm, über HR, HR, äh, und Pre. Das sind die vier, über die wir heute sprechen wollen. So, und wir beginnen mit Blogquote.
Ähm, und wir haben uns heute, also, erstens sind es, ähm, wenige Elemente, die wir uns heute nur vorgenommen haben und zweitens, zumindest die, die ich jetzt vorbereitet habe, ähm, Blogquote und HR, sind relativ unspektakulär, muss ich sagen.
Also, das Blogquote-Element ist ein, ein Blog-Zitat, das heißt, ich, ich möchte, ähm, aus einem Text, der von woanders kommt, zum Beispiel, wenn ich jetzt, äh, in Social Media oder Social Network denke, ähm, im Prinzip wäre so was wie ein Retweet, ein Quote-Tweet, wäre aus meiner Sicht so eine Art Blog-Zitat, wenn er da drin ist.
Gibt's aber auch oft, also, ich hab, ich hab sofort an Markdown denken müssen, bei Markdown, ähm, man zitiert gerne aus einem anderen Text irgendwie, äh, in dem man, ähm, die spitze Klammer davor setzt und Leerzeichen, das gibt's ja auch irgendwie in E-Mails.
Also, so Zitat, das kennt man, da hast du meistens, ist das irgendwie eingerückt, so, so grafisch, ähm, manchmal hat man noch so einen Strich nebendran, ähm, manchmal hast du noch Anführungszeichen dabei, je nachdem, ob du jetzt irgendwie, ähm, noch, noch eine Quelle nennst, ähm, da komm ich dann auch gleich noch dazu.
Also, es ist ein Blog-Element, es ist für ein größeres Zitat, ähm, von irgendeiner anderen Stelle, ähm, wie gesagt, gerne verwendet, wenn man irgendwie in Social Media jetzt irgendwie, du hast irgendwie ein Thread irgendwie und dann greifst du was auf von einer anderen Stelle oder von jemandem anderen, der was geschrieben hat und antwortest explizit darauf oder auch in der Mail, ähm, dafür gibt es Blog-Quote.
Ähm, wenn man jetzt noch angeben möchte, äh, die, die Quelle davon, ähm, dafür gibt es noch das Site-Element, das, äh, möchte ich aber mal wieder mit Michael Ende sagen, das ist eine andere Geschichte und die kommt dann bei den Inline-Text.
Die kommt dann bei den Inline-Text, genau, also da, da werden wir das auf jeden Fall nochmal aufgreifen, Blog-Code, weil, ähm, das eigentlich immer zusammen vorkommt, ähm, aber da wird es dann nochmal genauer erklärt, was es mit dem Site auf sich hat, weil Blog-Code kann man auch ohne das, ähm, verwenden. Ähm, ich hab auch mal,
ein kleines, äh, Code-Pen, ähm, mit verlinkt, für Blog-Quote, wo, wo mal ein schönes Design gemacht wurde, sag ich mal, einfach nur das Blog-Quote-Element und dann mit CSS, ähm, so schöne Anführungszeichen, ähm, in dem, in dem Before, also das wurde Before und After verwendet für eine, eine Linie, die unten drunter ist, es ist ein bisschen eingerückt, ist so ein hübsches, großes Anführungszeichen nebendran, also da gibt's, da sind der Kreativität keine Grenzen gesetzt, wie man das verwenden kann.
Ähm, genau. So, äh, wichtig ist noch, dass es abzugrenzen, es gibt nämlich noch ein anderes Element für Quotes, nämlich das Q-Element, ähm, das Q-Element ist ein Inline-Quote, also wenn ich irgendwo im Text etwas habe, also zum Beispiel in einem Paragraf oder so,
und möchte sagen, das ist jetzt irgendwie ein, ein, zwei, fünf Worte, die, äh, ein Zitat sind von woanders, da will ich das Q-Element verwenden, für ein richtiges Zitat, das aus, das seinen eigenen Blog darstellt, dafür ist das Blog-Quote. Also indirekte Rede könnte man so kennzeichnen, ne? Genau. In einem Interview oder beziehungsweise im Artikel, wo man ein Interview aufgreift, dann innerhalb von einem Satz, äh, das Zitat aufgreifen, ja.
Ähm, ich hab noch, äh, einen Accessibility-Test gemacht, weil ich festgestellt habe, ähm, dass das Ding keine ARIA-Rolle hat, zumindest, äh, laut der MDN, ich hab da auch Widersprüchliches gefunden. Ähm, in, in, in, in der Spec stand was drin, dass es eine implizite Rolle hat, es ist ein bisschen wild, da, wer da sich genauer mit auskennt, äh, gerne, gerne mal melden.
Ähm, ich kann auf jeden Fall sagen, dass VoiceOver, also der Screenreader auf dem Mac, das nicht ankündigt oder irgendwie sagt, das ist jetzt ein Quote. Das fand ich ein bisschen überraschend, ich hätte jetzt, äh, erwartet, dass das irgendwie das erkennt und dann sagt, ja, das ist jetzt irgendwie ein Zitat, aber das interessiert den Null, das ist einfach, wird vorgelesen wie ganz normaler Text. Ähm, auch. Genau, und damit, äh, kommen wir auch schon zum Ende von Blockquote.
Habe ich das jetzt überhört oder, äh, oder haben wir es vergessen? Das Site-Attribut auf dem Blockquote. Das Site-Attribut? Du meinst das Site-Tag? Nee, das Site-Attribut. Das Site-Attribut habe ich das, äh. Ja, also wenn du nochmal auf die MDN-Seite gehst, da steht unter Attributes, Site. Oh, tatsächlich. Und das hatte ich nämlich auch zuerst übersehen, ich dachte so, ah ja, Site, das Element, ja, aber dann habe ich nochmal gelesen, wie URL.
Ich habe dann was gelesen von URL und dachte, nee, aber in das Site packe ich doch einen Text rein, also den Autor. Aber ich kann auf das Blockquote-Element, und da sieht man, wie selten man das nutzt, ein Site-Attribut, also nicht S-I-T-E, sondern C-I-T-E setzen. Und da rein gehört eine URL, äh, zu einer Webseite, die, äh, dieses Quote enthält, also da kann ich cross-referenzen.
Das ist aber so ein reines, äh, so ein reines Semantik-Ding, du kannst wahrscheinlich nirgends draufklicken, oder? Ich wüsste nicht, dass es da irgendeine Möglichkeit gibt. Ich weiß nicht, was, äh, gegebenenfalls so Assisting-Technologies damit machen, ob die einem das vorlesen, sagen, die Möglichkeit geben, da hinzuspringen, weiß ich nicht. Ähm, ich guck mal im HTML-Standard. Es könnte vielleicht aus SEO-Gründen irgendwie, äh, interessant sein.
So, if the Site-Attribute is present, ich hab übrigens grad mal auf die, ähm, HTML-Spec von der, äh, What-Working-Group. Ähm, so, if the Site-Attribute is present, it must be a valid URL potentially surrounded by spaces, potentially surrounded by spaces, ist auch ein komischer Satz. Äh, to obtain the corresponding link, the value of the attribute must be passed relative to the Elements-Node-Document, okay.
User-Agents may allow users to follow such, such Citation-Links, but they are primarily, primarily intended for private-use, äh, Server-Side-Scripts. Okay, gut. Also, das ist ein, ein, ein, ähm, vorgefertigter Ort, wo man einen Link zu dem Quote hinpacken könnte. Ähm, und, äh, User-Agents könnten das irgendwie verlinken, aber ist jetzt erst mal nicht unbedingt vorgesehen. Okay, gut. Nee, danke für die Ergänzung, das hab ich tatsächlich übersehen.
Äh, ich hab Side gesehen und hab gedacht, ah ja, das Site-Attack, das kenn ich doch. So ging's mir auch. Genau, so ging's mir auch. Und da hab ich noch mal gelesen, wie URL, ja. Hoffentlich hab ich bei Haar nicht auch noch irgendwas übergelesen. Das gucken wir dann. Aber das ist wieder, das sind doch die kleinen Sachen, weshalb wir das hier machen. Also, vielen Dank, dass du genauer hingeguckt hast als ich.
Ähm, genau, dann, äh, dann sind wir jetzt fertig, hoffentlich, oder hab ich noch was übersehen? Nee, jetzt ist, jetzt können wir weitermachen. Ah, perfekt. Ja, ich komm zu Figure und Fig-Caption. Das sind zwei, die auch so eng zusammengehören und, äh, auch beide unter diese Kategorie fallen, dass wir die zusammenpacken können in, äh, einen Block.
Und, äh, Fig-Caption ist auch was, was man relativ selten sieht. Ähm, und was ich auch selber noch nicht so oft eingesetzt habe, obwohl's eigentlich semantisch, äh, schon an vielen Stellen Sinn macht. Und sogar an mehr Stellen, als man vielleicht so denkt. Also, das erste, was, was einem da, ähm, in den Sinn kommt, sind wahrscheinlich Bilder mit Bildunterschriften. Mhm, das hätt ich jetzt auch gedacht.
Ähm, das sieht so aus, ich hab das Figure-Element, das ist dieser gesamte Block, der dieses, ähm, äh, ja, quasi zitierte Medien-Element, das nenn ich's jetzt mal, ähm, beinhaltet. Und da drin kann ich dann ein Fig-Caption-Element angeben für die Beschreibung. Ähm, und könnte zum Beispiel jetzt ein Image-Tag, wäre also der klassischste Fall.
Also, Figure außenrum, dann ein Image-Tag, ähm, mit einem Bild drin und eine Fig-Caption, die das Ganze beschreibt. Und die ist halt wirklich auch für den End-User sichtbar. Also, nicht, ähm, wie jetzt so ein Alt-Text, äh, der für, für, äh, für Accessibility ist, sondern wirklich für, äh, Beschreibungstexte für, für alle. Und, ähm, ja, weitere Beispiele sind zum Beispiel aber auch, äh, Codeschnipsel, die in so eine Figur rein können.
Oder Diagramme. Also, egal, ob die jetzt als, als Bild mit Image-Tag umgesetzt sind oder in einem Canvas oder als SVG oder wie auch immer. Ähm, man kann sich das so vorstellen und daher kommt das eigentlich auch, ähm, aus dem wissenschaftlichen Bereich. Also, wenn ich irgendwelche wissenschaftlichen Bücher habe, die ja gerne mal gespickt sind mit irgendwelchen Tabellen und so, da steht ja dann auch wirklich, ähm, also ich glaube auch im Englischen wirklich Figure, Figure 8, Figure 9, ja.
Ähm, wenn man da drauf referenziert, also in dem Fleece-Text steht dann zum Beispiel, as you can see in Figure, äh, so und so viel. Ähm, das sind solche Dinge, solche Einschübe und es, äh, steht hier auch, mal gucken, ähm, dass das quasi in dem Textflow drin ist, aber jederzeit auch aus diesem Textflow rausgenommen werden könnte, um es zum Beispiel in einen Appendix zu hängen oder so, ja.
Also, das ist einfach wie so ein, vielleicht auch wie so ein Aside-Element, ja, also es ist, es gehört irgendwie dazu und ich kann es referenzieren, aber es ist jetzt nicht so, dass es, dass es wirklich in den Content, dass es elementarer Bestandteil des Contents ist.
Ja, genau, und wie gesagt, Code könnte ich da zum Beispiel auch reinpacken, ähm, da kommen wir dann später auf ein Element noch, äh, mit dem ich das dann machen könnte, ähm, ja, ansonsten habe ich jetzt zu, zu Figure und Fig Caption auch nichts mehr zu sagen. Ich habe gerade mal auf einer Seite geguckt, ähm, mit der ich so ein bisschen related bin und habe geschaut, wie das da gemacht ist, weil ich mir dachte, da tauchen solche Elemente ganz oft auf, also Bilder mit Bildunterricht.
Das ist eine News-Seite. Ähm, und da habe ich tatsächlich gesehen, okay, Figur wurde tatsächlich eingesetzt, ähm, und dann tatsächlich, äh, auch irgendwie das Picture-Element, ähm, das ich auch nicht so oft, äh, in the wild gesehen habe, tatsächlich mit eins, zwei, drei, vier verschiedenen Sources.
Ähm, aber leider wurde verpasst, ähm, das, äh, Fig Caption zu verwenden, das ist einfach nur, oder warte mal einen Moment, bin ich jetzt, nee, das ist tatsächlich ein Diff, ein Diff sogar außerhalb der Figure, leider. Ähm, vielleicht weiß ich, äh, weiß ich, äh, weiß ich die Menschen, die da dran arbeiten, mal darauf hin, dass man das ein bisschen semantischer machen kann. Wobei ich jetzt auch keine Ahnung habe, inwiefern das wirklich dann Einfluss hat.
Zum Beispiel tatsächlich, weil du jetzt auch Picture gesagt hast, hat's bei mir geklingelt, ich hab das bei unserer Seite, also nicht bei WWSV, sondern bei unserer Firmenseite 4.8 Design, ähm, hab ich das tatsächlich eingesetzt.
Wir haben so eine, so, äh, Kacheln mit Bildern für unsere Projekte, das ist eine Portfolio-Seite, äh, und diese Kacheln sind tatsächlich, ähm, also natürlich als erstes mal links außenrum, aber dann auch Figure, dann ein Picture-Element und eine Fig Caption, äh, die in dem Fall erst bei, bei Hover dann erscheint.
Ähm, das kann man natürlich auch machen, also die muss, muss nicht immer da sein und die Fig Caption kann vor allem auch oben drüber oder unten drunter sein, sieht man auch auf der MDN-Seite bei den Beispielen, die haben da zum Beispiel auch Blockquote, äh, kann man also auch kombinieren, das passt alles gerade heute sehr gut zusammen.
Ähm, und dann gibt's zum Beispiel einmal, äh, für ein Zitat, ähm, das Ganze in den Fig, ja, dann die Fig Caption, wo dann der Name oben drüber steht und dann ein Blockquote, ähm, oder ein, äh, Poem, also ein, ein Gedicht, das zitiert wird, ähm, da war jetzt zu überlegen, ob man das vielleicht auch in einen Blockquote packen könnte, weil das ja irgendjemand mal geäußert hat, aber gut, in dem Fall ist das ein Paragraph, das sind dann, glaub ich, auch so, äh, nitty, nitty, nitty-gritty Geschichten.
Ähm, ähm, und das Fig Caption unten drunter und dann darin aber ein, ein Side-Element, äh, wo dann Venus and Adonis bei William Shakespeare dann drinsteht. Ja. Genau, also das ist einfach, ja, semantische Aufhübschung und schafft einem auch wieder ein, ein Rapper-Element, das man vielleicht in irgendeiner Form nutzen kann, um Layout zu machen, ohne dass man jetzt wieder ein Diff oder was drum packen muss. Genau.
Sondern es hat wirklich einen Sinn, ne, man will diese Dinge ja oft getrennt stylen, weil die rausstechen sollen und dann muss ich mir nicht irgendwas erfinden, sondern es gibt einfach ein semantisch richtiges Element dafür. Es macht es auch natürlich, nicht nur deswegen, es macht es auch lesbarer für einen selbst, weil es der, weil der Sinn komplett klar ist, wofür ist denn das jetzt?
Also im Code ist ganz klar, ne, ich sehe die Figge, gerade weil man es auch nicht so häufig liest, ist also sofort klar, okay, das ist jetzt was, was ganz eigenes. Ich glaube, ich habe es selbst, das Figge-Elementen noch nie irgendwo eingesetzt. Dann wird es Zeit. Ja, das ist eins von denen, also ich erinnere mich noch an die Zeit, als irgendwie HTML5, da hieß es plötzlich, jetzt kommt HTML5 mit diesen folgenden neuen Elementen.
Fiction, Nav, äh, Side, Header, Footer und da war eben auch Figure und Fig-Caption dabei. Erstmal habe ich gekichert, hi, hi, hi, hi, hi, figure, figure, figure, figure, äh, ja, aber eingesetzt habe ich, das ist, glaube ich, wahrscheinlich das einzige von diesen damals neuen HTML5-Elementen, oh Gott, jetzt habe ich bestimmt irgendwelche vergessen, ähm, aber eins, von dem ich weiß, dass ich es, glaube ich, noch nie eingesetzt habe.
Was ein bisschen schade ist, äh, weil ich glaube, ich habe ein paar Chancen verpasst, wo ich da mal hätte dran denken können, ähm, das zu verwenden. Gerade weil wir ja immer hier Semantik predigen, äh, äh, predigen, ne? Ja, ich bin, ja, ich bin echt am überlegen, aber ich meine, das ist halt echt so ein, so ein typisches News-Seiten-Element, würde ich sagen.
Also da, wo du ein Bild hast mit einem Text dabei, da ist es absolut prädestiniert, das ist genau das, das ist genau dafür gemacht und ich weiß nicht, wie oft ich sowas seitdem gemacht habe, nicht so oft. Ich schreibe ja auch keinen Code mehr, ich bin ja jetzt Politiker geworden, aber egal, das ist, äh, das erzähle ich auch ein andermal. Das ist eine Geschichte für einen anderen.
Genau, das wird, äh, da, da mache ich mal einen Vortrag draus, wie ich Politiker, einer, der sich auszog, um Politiker zu werden, oder so. Ach, du machst das nackt? Ja, das ist halt meine neue Strategie, ist, äh, damit fällt mir auf jeden Fall auf, ich hab festgestellt, das ist manchmal, reicht das, um in der Politik erfolgreich zu sein, reicht es einfach nur aufzufallen. Und, äh, wir könnten das so als Untertitel für unseren Podhub-Stream machen. Ausgezogen, um zu streamen.
Ausgezogen, um zu streamen. Ja, richtig gut. So, aber nun, wieder HTML hier, Technik, Technik. Äh, als nächstes das HR-Element, das hat nichts mit Personalabteilung. Und auch nicht mit dem hessischen Rundfunk. Nicht der hessische Rundfunk und auch keine Personalabteilung, es tut mir leid. Und interessanterweise, heißt das ... Wir sind eher so der hässliche Rundfunk. Sorry, mach weiter.
Ich fand, ich, weißt du, ich mag das ja, ich kann, ich stehe da absolut dazu, ich mag so blöde Wortspiele. Ich bin ein absoluter Dead-Joke-Fan. Also, das HR-Element, ähm, das hat, das hat wirklich, da sind mehrere Sachen interessant dran, wie ich finde, obwohl das auch nicht so extrem viel hergibt. Aber, ähm, das hieß mal, das heißt so, weil, äh, es hieß früher Horizontal Rule. Also, es steht tatsächlich für ein, ein, ein Strich auf der Seite, der gezogen wird. Ein horizontaler Strich.
Wie man sagt, auf Englisch, Ruler ist ja das Lineal, also daher kommt das ... Genau. Und interessanterweise, wenn man jetzt aber die MDN guckt, wurde das umgemodelt, das heißt, das heißt, es ist jetzt was anderes. Also, es heißt nämlich eigentlich jetzt The Thematic Break in Klammern Horizontal Rule Element.
Ich meine, man kann es nicht umbenennen oder man hat es nicht umbenannt, aber was passiert ist, früher war das tatsächlich ein unsemantisches Element, ein reines grafisches Element, wenn man so will. Ähm, man hat aber jetzt gesagt, nee, ähm, das, äh, das wollen wir, wir wollen es weiterverwenden, aber das repräsentiert einen thematischen Bruch zwischen, hier steht in der MDN, Paragraph Level Elements.
Ähm, also zum Beispiel, äh, Change of Scene in a Story, also das ist tatsächlich irgendwie, ähm, eine andere Szene in der, in der Geschichte, man ist plötzlich woanders oder so. Shift of Topic steht da noch. Und das ist total interessant, das bedeutet, das hat eine semantische Bedeutung jetzt bekommen, die es früher nicht hatte. Ähm, das ist, das ist selten so, oder das gab's an anderer Stelle auch schon, dass das so Sachen mal umgedeutet wurden.
Und mir fällt gerade ein, äh, äh, Definition List und Description List, die auch mal einen anderen Namen bekommen haben, obwohl es immer noch, äh, ja, das ist auch irgendwie spannend. Ähm, und das Beispiel hier in der MDN ist, äh, einfach nur ein Paragraph, äh, und dann ein HR dazwischen, ähm, und dann kommt, kommt das nächste, nächste Paragraph, also tatsächlich das P-Element.
Ähm, was da dran auch interessant ist für die, für die Älteren, früher, äh, gab es, ich weiß gar nicht, ich hab ja immer gesagt, man, man soll sowas nicht mehr sagen, aber da hab ich jetzt ein bisschen Lust drauf, ausnahmsweise mal so alten Käse rauszukramen. Also, Disclaimer, was jetzt kommt, das hört ihr jetzt nur, das ist, das ist quasi Historie, das vergesst ihr sofort wieder, das braucht ihr niemals.
Ähm, zu Zeiten als CSS, ähm, entweder es noch nicht gab oder es noch nicht so viel konnte, ähm, da hat man viele Dinge mit Attributen gestylt.
Und das HR-Element hatte einige Attribute, ähm, zum Beispiel Align, ähm, man konnte das, äh, ausrichten, in welche Richtung, äh, es zeigt, ähm, es gab auch eine Color, es gab, standardmäßig hatte das Ding einen Schatten, und es gab ein No-Shade-Attribut, was total abgefahren ist, wie ich finde, weil du nimmst, es hat nicht ein Shade-Attribut, das zum Schatten hinzufügen, sondern ein No-Shade, weil der Standard, das ist schon verrückt.
Size, man konnte das, äh, die Höhe davon verändern, und die Width, also die Breite, konntest du auch, äh, angeben. Krass, äh, das ist so voll verdrängt, und jetzt, wo du das sagst, kommen mir Erinnerungen hoch, wie ich mit Notepad irgendwelche, äh, ganz simplen Layouts gebaut hab.
So, und da hab ich jetzt in der Spec, also, äh, in, in der echten Spec, nicht auf der MDN, noch was Interessantes gefunden dazu, was mich ein bisschen überrascht hat, was ich nicht kannte, bin ich mal gespannt, ob du das schon mal gehört hast. Das kann man nämlich nicht einfach nur in Text verwenden, sondern es gibt noch offenbar, aber selbst der HTML-Validator hat sich da dran gestört, muss ich sagen.
Aber laut der Spec gibt es ein, noch einen weiteren, äh, Ort, wo das erlaubt ist, nämlich innerhalb eines Selects zwischen Option-Tags. Ich meine, dass wir da auch schon mal drüber gestolpert sind, als wir die, äh, warte mal, Selectisten hatten wir auch schon, oder? War das im Rahmen von dieser HTML, hatten wir noch nicht?
Wir hatten noch, wir hatten noch keine Formularelemente, waren bisher relativ langweilig unterwegs. Also, es ist tatsächlich, es steht hier original drin, warte mal, ich glaube, ich packe das, packe das nochmal als Extralink. Aber eben, wo sind wir mal hier drüber gestolpert, da erinnere ich mich dran.
Ich packe das noch als Extralink, äh, nochmal mit rein, ähm, das ist der Link zum HTML-Standard, ähm, da steht explizit drin, ähm, alternatively, it represents a separator between a set of options of a select-Element. Allerdings muss ich dazu sagen, ich habe da eine kleine Demo gebaut, ähm, die verlinken wir jetzt nicht, das ist zu unspektakulär, das lohnt sich eigentlich nicht, wo ich das mal ausprobiert habe.
Ich habe das wirklich, das reingepackt, man sieht es nicht, also zumindest, äh, in meinem Brave-Browser auf dem Mac sieht man es nicht, es ist weg. Ähm, der HTML-Validator vom, äh, vom W3C meckert das an und sagt, da stimmt was nicht, ähm, wenn man das macht. Ähm, und es, es wird auch, ähm, nicht, ähm, vorgeliefert. Oder irgendwas, wenn ich es mit dem Screenreader mir anhöre, innerhalb von einem Select, da ist kein Bruch irgendwas, also das ist quasi nicht vorhanden, das Ding.
Vielleicht habe ich auch einen Fehler gemacht, vielleicht soll ich die Demo doch verlinken. Äh, nee, ich lasse, lasse mal weg. Also, falls da jemand mal, falls jemand weiß, wie das geht oder vielleicht irgendeine Demo hat, wo das so verwendet wird, das fände ich sehr interessant. Allerdings ist es normalerweise, wird es anders verwendet. Äh, halt wie gesagt, zwischen einzelne thematische Blöcke kann man so eine Linie machen und die kann man auch ganz nett stylen.
Ähm, da gibt es, äh, schöne Beispiele auf CodePen, die wir auch, äh, verlinken. Ähm, was so ein Klassiker ist, äh, ist, was auch in der MDN gemacht wurde, nämlich, dass man, äh, mit Before und After da irgendwelche Elemente drüber legt, äh, und das dann zum Beispiel unterbricht. Das ist irgendwie ganz nett, also, ähm, in der MDN, äh, jetzt muss ich gerade nochmal gucken, wo war ich denn, wo bin ich denn dahin?
Genau, da haben die nämlich das so gemacht, dass sie, ähm, dass das HR ein Border-Double ist, aber das Paragrafenzeichen in die Mitte drüber gelegt wurde und so ergibt sich eigentlich ein ganz nettes, grafisches. Also, so wie bei, äh, bei den Field-Sets, ne, wo man, wo der Text dann auch so über diesem Rahmen drüber legt. Genau, in dem Fall haben sie quasi als Trick verwendet, der Hintergrund davon ist weiß, also von, von dem allgemeinen Block ist weiß.
Und der Hintergrund von dem Paragrafen auch weiß, so sieht es aus, als ob es unterbrochen werden würde, was natürlich nicht wird. Also, wenn du da die Hintergrundfarbe änderst, siehst du sofort, äh, den Beschiss. Das heißt, mit Dark Theme und so muss man dann nochmal alles ummodeln, aber, ähm, generell eigentlich, äh, ne, ne, ne coole Idee und sieht, sieht auch nett aus, muss ich sagen.
Ähm, und ich hab, wie gesagt, wir verlinken noch ein Code-Pen, wo, ähm, so ein paar verschiedene Varianten drin sind, wie, wie man das noch machen kann, also, das ist jetzt nichts wahnsinnig spektakuläres, mit unterschiedlichen Borders wurde da gespielt. Aber man kann da auch einen Schatten irgendwie draufsetzen, ähm, oder Diverses, also da gibt's viele, viele verschiedene interessante, ähm, Varianten, die man da machen kann.
Ähm, genau. Äh, ich hab es noch, vielleicht sei das noch angemerkt, ah, genau, äh, äh, äh, zum Thema Semantik von dem Ding, ich hab ja gesagt, das ist jetzt, ist umgedeutet worden. Das hat tatsächlich, äh, äh, eine implizite ARIA-Rolle Separator und da hab ich mir gedacht, okay, wenn das jetzt ein semantisches Element ist, dann würde ich auch erwarten, dass es vorgelesen wird. Und dem ist auch so, VoiceOver sagt bei dem Element, wenn es kommt, Horizontal-Teilungsfunktion.
Ist jetzt, ähm, wie soll ich sagen? Ein bisschen holprig, oder? Ist besser als nichts, aber ja, warum nicht? Also es wird auf jeden Fall vorgelesen, äh, in diesem, also im Kontext, wenn es nicht im Select ist. Im Select war es komplett stumm, da war das, als wäre es nicht da, also als ob es ein Fehler wäre, als ob man das nicht darf.
Aber wie gesagt, vielleicht hab ich da auch irgendeinen Fehler gemacht in meiner Demo und ich komm jetzt grad wieder zu dem Punkt, dass ich sie vielleicht doch verlinken soll. Ähm, ja komm, das machen wir, dann muss ich die, dann schalte ich die hier noch public und, ähm, genauso mach was. Also die Demo, die Demo kommt noch in die Shownotes. Hab ich da jetzt was vergessen? Oder was ich, was ich wieder übersehen hab? Oder, äh, oh Gott, krieg ich Ärger?
Nee, da hatten wir sogar jetzt noch mehr, weil wir die alten Elemente, äh, alte Attribute noch beschrieben haben. Okay, sehr gut. Hab ich Glück gehabt. Gut, damit kommen wir schon zum letzten, Mensch, hier, Rekordtempo heute. Und, äh, das letzte in diesem Block ist das Pre-Element. Und das Pre-Element hat den einzigen Zweck, Text so darzustellen, wie er tatsächlich im Editor, im Markup, äh, Markup steht.
Normalerweise ist es ja so, mehrere Leerzeichen hintereinander werden zusammengezogen, optisch in der Darstellung, in der Ausgabe, ähm, und sind nicht sichtbar.
Und, äh, wenn ich jetzt Text habe, zum Beispiel AsciiArt, wird hier auch tatsächlich explizit als, als Beispiel in der MDN genannt, ähm, wo ich ja die Leerzeichen tatsächlich haben will, Dann kann ich ein Pre-Tag-Tag außenrum setzen und das sorgt dafür, dass standardmäßig der Browser, das, also das, das Browser-Style-Sheet, das, äh, mit einem Monospaced-Font, ähm, ausgibt. Und mit, äh, mit White-Space, ähm, entsprechend, äh, ja, wie er tatsächlich erscheint.
Und dadurch ist die Darstellung so, wie man es im Texteditor sehen würde. Und, äh, da ist auch explizit zu dieser, äh, ASCII-Geschichte, hier Accessibility-Concerns, ähm, noch angegeben. Äh, und auch wieder reingepackt in ein Figure und, äh, mit einem Fig-Caption-Element, also das passt wunderbar heute zusammen. Ähm, ist eben eine Figure, dann ist da ein, ein Pre-Tag, da ist ein, ein, ein Esel aus ASCII-Art.
Ähm, und das Pre-Tag hat in dem Fall ein Role-Attribut Image und ein ARIA-Label ASCII-Cow. So, dass es dann, äh, von einem Screenreader entsprechend vorgelesen würde, anstatt jetzt irgendwie Linie, Linie, Linie, äh, Backslash, äh, Karree, was weiß ich, ja, äh, wird das überschrieben, ASCII-Cow, also der Screenreader sagt dann, hier ist ein, ein Image-Element, ein Bild-Element, das ist eine ASCII-Cow, ohne jetzt irgendwie die Leute,
die darauf angewiesen sind, weiter zu verwirren, ähm, und dann, weil mir ja natürlich in dem Fall jetzt aber ein, ein Alt-Attribut fehlt, weil es eben keine Grafik ist, kann ich dann das Fig-Caption-Element nutzen, Und, äh, wenn man das jetzt nicht für sehende UserInnen haben möchte, dann kann man das ja dann wiederum verstecken.
Ich bin grad ein bisschen verwirrt. Hilf mir mal. Ist meine Erinnerung falsch, dass man in das Pre-Früher auch mal HTML einfach so reinpacken konnte und das wurde dann nicht als HTML gerendert? Oder ist, hab ich eine falsche Erinnerung? Weil ich hab's grad ausprobiert, das geht nicht. Also hier steht explizit dabei, wenn man, äh, Zeichen benutzen will, wie spitze Klammern und, und Double-Quote, dann muss man's mit HTML-Entities.
Ja, ich hab's ausprobiert, das stimmt, aber irgendwas sagt mir, dass man früher einfach, wieso hab ich das so in Erinnerung? Ich dachte, wenn du einfach Pre irgendwo reinschreibst, dass du einfach irgendwo Pre davor schreibst, so ein beliebter Hack, um Seiten zu defacen, wenn du es schaffst, irgendwo ins HTML reinzukommen, dass du einfach Pre hinschreibst und ab dem Punkt wird die Seite nicht mehr gerendert, sondern einfach als Text dargestellt.
Du könntest durchaus recht haben, dass das mal so war, ja. Es klingelt auch irgendwo dunkel ganz hinten im Kopf. Ich erinnere mich, dass da mit wilden Sachen gemacht wurden früher, aber, aber ist das, oder vielleicht ist es auch einfach falsche Erinnerung, aber haben die das vielleicht geändert und haben gesagt, nee, es ist uns zu unsecure und das darf man nicht mehr oder so?
Ich finde jetzt gerade auch kein Beispiel, wo das so ist, aber irgendwie, bitte schreibt mal in die Kommentare, falls ihr euch erinnern könnt oder vielleicht noch ein Beispiel irgendwo habt, wo ein Blogartikel, der das irgendwie beschreibt, dieses Verhalten, das würde mich echt interessieren, weil irgendwie kommt es mir vor, als ob das, das war mal anders. Das war doch mal anders. Oder ich habe eine ganz komplett falsch eingepflanzte Erinnerung.
Nee, ich dachte auch, oder war es bei Code, wo das noch irgendwann kommen wird. Ich bin mir extrem sicher, dass es Pre war, aber, weil Code ist, glaube ich ... Nee, Code ist ja auch nur für diese Inline-Formatierung. Ja, nee, ich kann es mir gut vorstellen, dass es mal anders war, weil ich es auch so ... Oder es ist Mandela-Effekt, dass wir beide das Gefühl haben, es war so, aber es war nie so. Also, ich finde auch auf die Schnelle jetzt nichts dazu. Nee, ich auch nicht.
Das ist cool, als wäre es nie so gewesen. Ja, hat Google gut gemacht, Google gut versteckt. Vielleicht muss man eine alternative Suchmaschine verwenden oder irgendwie das Internet Archive oder so. Eine alte Ehe irgendwie auftreiben. Oder einfach, wahrscheinlich würde eine alte HTML-Spec ausreichen. Okay, sagt uns mal, ob wir komplett falsch liegen da. Ja, das würde mich auch mal interessieren, ob andere auch noch diese Erinnerung haben.
Was nur bedeuten könnte, dass der Mandela-Effekt sehr stark ist. Ja. Ja, Mensch. Hey, dann sind wir jetzt schon durch, ne? Exakte Stunde so. Ja, gut, aber es geht ja noch, es gibt noch ein Geil-Teilchen und dann ... Ja. Wir machen jetzt Folgen für Leute, die sich schon immer beschwert haben, das unsere Folgen zu lassen. Ja, richtig. Jetzt ausnahmsweise, die alle schon abgesprungen sind und den Podcast nicht mehr hören, das ist für euch.
Das hättet ihr haben können, wenn ihr länger dabei geblieben wären. Okay. Ja. Ah, falsch. Falsch. Einmal verklickt, egal. Egal. Das Geil-Teil hatten wir schon im Stream. Ich sage das viel zu oft, gell. Und es ist auch nicht 100% auf dem aktuellen Stand, aber trotzdem fand ich es jetzt nochmal erwähnenswert, weil es mir vor kurzem wieder eingefallen ist, dass es sowas mal gab. Und zwar heißt das Selectors Explained von Kitty Giraudel.
Und ich habe bei dem Namen immer Angst, vor allem den Nachnamen, dass ich ihn falsch ausspreche. Und zwar ist es unter kitty-giraudel.gitter.io slash selectors-explained. Aber der Link kommt auch noch in die Shownotes. Und was es tut oder was es vorgibt zu tun, ich tue Selektoren, CSS-Selektoren, die können auch länger sein, rein.
Also ich habe hier zum Beispiel mal jetzt ganz, ganz billig geschrieben, aside, größer Zeichen, p. Und dann drücke ich auf Explain und dann kriege ich erklärt, was der Selektor tut. Und in diesem Fall, ich habe, wie gesagt, geschrieben aside, Leerzeichen, größer Zeichen, p. Und dann steht hier jetzt a p-Element directly within a side-Element. Wir haben letztes Mal festgestellt, dass so neuere Sachen nicht unterstützt werden. Has zum Beispiel wird nicht unterstützt und not auch nicht.
Bei not sagt er einem aber, glaube ich, sogar Bescheid. War das nicht so? Dass er das nicht unterstützt oder so, ja. Ich glaube, not pseudo-class is not supported. Genau, man kann es aber auch forken. Das ist schon ein bisschen älter. Moment, bei GitHub der letzte Commit ist von ... vom 5. Januar? Doch nicht so. vom 5. Januar. Ja, aber ich weiß nicht genau, was alles unterstützt ist. Das kann man bestimmt auch auf GitHub dann rausfinden.
Aber so klassische Selektoren, also wenn ihr euch mal fragt, hey, was macht denn das Ding jetzt? Gibt es eine gute Chance, wenn es jetzt nicht was ganz Neues ist, dass das Ding es ganz gut erklären kann. Und einem dann sagt, ja, das ist irgendwie eine Klasse und dann kommt irgendwie direkt ein nachfolgendes Kind-Element oder Geschwister-Element. was weiß ich, was es halt alles so gibt an Selektoren und Kombinatoren in CSS, die man sich damit eigentlich recht schön erklären lassen kann.
Schönes, kleines, äh, minimalistisches Tool. Die Seite ist auch sehr minimalistisch, einfach quasi nur ein Eingabefeld. ähm, ähm, und dann einen Knopf und auf den drücke ich und dann kriege ich es erklärt. Und das war's auch schon. Sehr schön. Jetzt aber, ne? Haben wir gerade wieder gleichzeitig geklickt. Wir klicken immer unsere To-Do-Punkte weg in Trello und manchmal, äh, ist es so, als ob man quasi nicht geklickt hätte und dann haben wir gleichzeitig geklickt.
Jetzt klicke ich aber woanders hin und zwar diesmal richtig. Woanders hin jetzt. Das Ende. Ja, Mensch. Es ist so, es ist ganz komisch. Es ist 20 nach 9 jetzt und wir sind durch. Jetzt warten wir noch eine Runde, oder? Ja, auf jeden Fall, aber auf, äh, auf Aufnahme. Ich glaub, das wird noch langweiliger als im Stream. Wir zocken einfach eine Runde Worms, Armageddon, äh, Worms, WMD, einfach, äh, während wir podcasten. Genau, ohne, ohne, dass ihr den Ton vom Spiel hört.
Einfach nur stille und zwischendrin so, oah. Oh nein, oh nein, ich hab's wieder daneben, oh scheiße. Und wer, wer, wer das jetzt total geil findet, die Vorstellung, dass wir das tun, der kann gerne mal im Stream vorbeischauen, wenn wir tatsächlich spielen. Jetzt die heilige Handkanade. Dann sieht man aber sogar was dabei und hört was. Das Schaf am Seil. Und, äh, Armageddon gibt's ja auch. Äh, wer das nicht verpassen möchte, auf twitch.tv slash WWSIV.
Vielleicht demnächst mit anderem Namen. Müssen wir mal gucken. Haben wir vor kurzem drüber geredet. Weil uns findet keine Sau. WWSIV, da sagen die Leute, WWSIV, was soll denn das sein? WWSIV, wer seid ihr denn? Für SIV. Schön! Mensch, ach, solche Folgen könnten wir eigentlich öfter mal, lass uns, lass uns öfter mal so ein bisschen kürzer. Also vom Thema her, das fand ich jetzt irgendwie schön knackig, das ist, es muss ja nicht immer so überbordend sein.
Nee. Wenn wir weitermachen nach der Sommerpause, und wir werden weitermachen nach der Sommerpause, dann könnten wir ja das mit so ähnlicher Anzahl HTML-Elemente uns dann nehmen. Dann dauert, dann haben wir zwar noch ein paar Folgen vor uns. Ich glaube, da haben wir sehr viel vor uns, weil wir haben nämlich, also der nächste Blog, der wird ziemlich riesig mit den Inline-Text-Semantics. Da ist sehr viel, aber ja gut, dann geht uns schon der Content nicht aus. Ach, schön.
Gut, da hatte ich eigentlich noch nie Angst, dass uns der Content ausgeht. Irgendwas zu reden finden wir immer. Also es gibt Podcasts, die sich Themen bei anderen kopieren. Wir haben das noch nie gemacht. Weiß ich nicht, ob das wirklich zu 100 Prozent stimmt, aber es stimmt zu 99 Prozent. Wir behaupten es einfach so steif und fest, dass wir der einzige Stream in Deutschland mit Faxnummer sind. Ja, das behaupten wir auch einfach.
Da muss uns mal jemand das Gegenteil beweisen, dann behaupten wir das nicht mehr. Genau, aber genau die, so, Moment, was hast du gerade gesagt? Die, ah genau, die Inline-Elemente, Inline-Text-Semantics, da haben wir einiges vor uns. Das sind, weiß ich nicht, 30 Stück oder so, könnte sein. Und da, ja, aber die, obwohl die geben auch nicht, die geben teilweise vielleicht sogar mehr her, als das, was wir jetzt heute hatten. Also müssen wir mal gucken.
Müssen wir mal schauen und wir werden natürlich auch nicht alles am, jetzt nicht nur noch diese Serie fortsetzen, sondern wieder zwischendrin auch andere Dinge. Grid, will man uns da drauf festnageln, dass wir eine Grid-Folge mal endlich machen. Vielleicht nochmal jemanden einladen oder so, das wird es bestimmt auch nochmal geben. Ja, und du vielleicht von den Bahamas, dann, ne, du bist ja nach der Sommerpause eventuell unterwegs.
Genau, genau, da werde ich erstmal Sabbatical machen und bin jetzt aber dann, also erstmal dann tatsächlich im Urlaub für zwei Wochen. Gut, August ist ja eh, ist ja eh Sommerpause. Genau, es ist eh noch Sommerpause und dann danach muss man mal gucken. Ich würde sagen, es ist tatsächlich jetzt noch gar nicht so viel fest geplant.
Also ich weiß, dass ich Anfang nächsten Jahres mal ein bisschen länger weg sein werde, aber vielleicht können wir auch da mal, müssen wir mal gucken, wie es dann so, wie so der Delay ist zum Aufnehmen. Der Jan. Wenn ich weiter weg bin, weiß ich nicht, ob das gut funktioniert dann.
Aber ich habe festgestellt jetzt die Tage, dass das Mikrofon von meinem MacBook, ich will jetzt nicht sagen, es ist besonders gut, also auf jeden Fall nicht so gut wie dieses hier, vor allem wenn man ein bisschen näher rangeht. Das geht natürlich nicht mit dem MacBook-Mikrofon, aber ich habe tatsächlich damit so ein bisschen Background-Vocals aufgenommen, so für was die innoleise im Hintergrund und ich war in einem ruhigen Raum und so, das war okay.
Das war gut genug, da machst du ein bisschen Rauschfilter drauf und gut ist, es war jetzt auch nichts, was in den Charts landen wird, sage ich jetzt mal so. Ich war erstaunt, wie gut es ist, das heißt, vielleicht kann ich tatsächlich nur mit diesem Gerät dann, wenn ich tatsächlich einen stillen Ort finde, nur mit dem Gerät und Kopfhörern vielleicht podcasten, das wäre schon ... Ja cool, und wenn es nur ist, um uns zwischendrin mal zu melden, dann wird es nicht zu lange eine Pause geben.
Unbedingt, ich glaube, ich bin eh nie so lange am Stück jetzt irgendwie weg, wir werden das schon irgendwie hinkriegen. Also das ist jetzt aber erstmal die letzte Podcast-Folge vor der Sommerpause und wir werden auf jeden Fall, keine Ahnung, ich tippe jetzt mal so, irgendwann im September, Ja, aber ja in der Regel Mitte September so um den Dreh, das soll wieder loslegen. Das tippe ich jetzt mal, wir müssen jetzt mal ein bisschen uns wieder auffrischen und ...
Sonne tanken, Energie tanken, Tieren lüften. ... uns mal umziehen, mal wieder duschen und ... Wird auch mal wieder Zeit nach so einem Dreivierteljahr. Ja, ich habe Weihnachten das letzte Mal, damit die Familie nicht so guckt und ... Jetzt wird es mal wieder Zeit, bevor ich irgendwo in öffentliches Verkehrsmittel stehe oder sowas, ja. Vielleicht ein bisschen Rücksicht nehmen. Nehmt mal Rücksicht, genau. Nehmt einfach mal, so für die Sommerpause nicht durchlebt. Seid nett zueinander.
Nehmt mal Rücksicht auf andere. Einfach so, so überall. So ganz generell. Nicht am Ende der Volltreppe stehen bleiben, nicht in der Mitte vom Weg laufen. Oder einfach mal ein Auge zudrücken. Genau. Wenn irgendwas Blödes passiert ist, irgendjemand schneidet euch mit dem Auto oder so. Einfach mal cool bleiben, einfach mal ein Auge zudrücken.
Davon ausgehen, was dir wiederum jemand gesagt hat, einfach davon ausgehen, dass jeder, dem du begegnest, das Beste tut, was er in dieser Situation gerade tun kann. Und wenn er eben nicht freundlich sein kann, dann hat das wahrscheinlich auch seine Gründe. Und einfach mal. Das ist auf jeden Fall, ich weiß nicht, ob man mit dieser Einstellung, wenn man die immer hat, ob man da so extrem weit kommt oder ob man nicht oft dann frustriert wird.
Aber ja, ich finde, das ist eine schöne Einstellung, die man auf jeden Fall ab und zu mal rauskramen sollte. Dass man den Leuten erstmal nichts Schlechtes unterstellt, sondern dass man erstmal davon ausgeht, da will eigentlich, die Leute wollen erstmal nur was für sich, die wollen nichts gegen dich. Da gibt es auch den Spruch irgendwie, schiebe nichts auf Bösartigkeit, was du nicht auch mit Ignoranz erklären könntest.
Ja, oder ich glaube, ich kenne es auch mit Dummheit, ja, das habe ich auf jeden Fall schon mal gehört. Aber ich glaube, ich würde es anders nennen, ich würde nicht sagen Dummheit, sondern Unwissenheit, aber im positivsten Sinne. Dass jemand sich einfach gar nicht um das Ding, was in deinem Kopf ist, kümmert. Und das ist, glaube ich, in den allermeisten Fällen der Fall, dass jemand eben nicht, klar, keiner kann in deinen Kopf reingucken.
Und dass die Leute eben einfach nicht, sich gar nicht um das kümmern, was dich kümmert. Und das nicht böse meinen. Und wenn die dich ignorieren oder dich blöd behandelt fühlst, ist es tatsächlich oft so, dass da gar keine böse Absicht dahinter steckt. Ich bin der Meister im Leute auf die Füße treten und hinterher dann vielleicht merken, dass ich was falsch gemacht habe oder dass es falsch angekommen ist.
Oder manchmal kriege ich es dann auch gesagt, da freue ich mich immer drüber, wenn jemand sagt, ah ja, da irgendwie, so eine Situation hatte ich vor kurzem, ein halbes, nee, ein halbes Jahr später ist jetzt übertrieben, irgendwie ein Monate, zwei Monate später. Ah ja, die Situation, die war irgendwie ein bisschen blöd. Und ich habe gesagt, ey, sprich doch bitte sofort mit mir. Ich bin manchmal der Elefant im Porzellanladen und merke es nicht.
Ja, ich glaube, ich bin eigentlich das elegante Kätzchen, das rumhüpft. Aber eigentlich war ich in dem Augenblick ein Elefant, habe alles zertrümmert und habe es nicht mal gemerkt und gehe fröhlich pfeifend wieder raus und habe gar nicht gemerkt. Und alles qualmt hinter dir. Alles qualmt, aber ich habe es nicht gemerkt. Aber es ist ja schön, wenn man diese Kritik dann auch positiv annehmen kann. Ja, das ist nicht einfach.
Das ist echt unter Umständen anstrengend, wenn dann jemand sagt, ey, da warst du richtig scheiße. Und das, vor allem, ich finde es auch immer gut, wenn dann Leute nicht dir einen Vorwurf machen, sondern dir sagen, ey, du hast das gemacht und das habe ich dabei gefühlt. Also mit einer Ich-Botschaft. Und das kann man dann auch sehr gut annehmen, kann ich sagen, hey, also ich kann ja nicht sagen, du darfst dich nicht so fühlen, wie du dich fühlst.
Also, es gibt Leute, die sowas versuchen, aber das ist ja völlig irre. Also wenn euch jemand sagt, dass ihr euch nicht so fühlen dürft, wie ihr euch fühlt, schwierig. Das ist ja auch so ein Ding in der Kindererziehung, dass man früher gesagt hat, so heul jetzt nicht, stell dir jetzt nicht so an. Oder das ist doch jetzt aber nicht so wichtig, deswegen muss man doch jetzt nicht so einen Aufstand machen. Also Gefühle, die sind halt da, die kann man nicht verbieten.
Jetzt sind wir aber nochmal. Jetzt sind wir nochmal hier. Ja, richtig, wie wir es früher als im Stream hatten, so richtig Psycho-Talk. Ja, das haben wir im Stream schon lange nicht mehr gemacht, ich weiß gar nicht genau, warum. Ich glaube, das kamen oft aus der Community so irgendwelche Fragen und dann geht man da drauf ein und denkt so drüber nach. Aber irgendwie kam es nicht mehr so. Wir haben ja noch zwei Streams.
Entweder kommen die schlecht gelaunten Leute nicht mehr oder, ich weiß nicht, oder vielleicht geht es denen jetzt besser, das kann auch sein. Das wäre doch auch schön. Das wäre auch schön. Also gut, machen wir den Deckel drauf. In diesem Sinne, habt einen schönen Sommer, genießt die Sonne, seid nett zueinander und bis bald. Macht's gut. Ciao. Untertitelung des ZDF für funk, 2017