WEBVTT

NOTE
Podcast: Wo wir sind ist vorne.
Episode: HTML von a bis z-z VI: Inline Text Semantics (Teil 2)
Publishing Date: 2024-07-21T21:03:33+02:00
Podcast URL: https://wowirsindistvorne.show
Episode URL: https://wowirsindistvorne.show/html-von-a-bis-z-z-vi-inline-text-semantics-teil-2/

00:00:00.000 --> 00:00:06.000
Wo Wir Sind ist vorne, Folge 65. Heute geht's weiter auf unserer Reise durch die Welt der HTML-Elemente.

00:00:06.000 --> 00:00:25.000
Herzlich Willkommen bei Wo Wir Sind ist vorne. Frontend-Fakten-Frotzeleien.

00:00:25.000 --> 00:00:29.000
Der Late-Night-Frontend-Talkshow rund um Webdesign und Entwicklung.

00:00:30.000 --> 00:00:41.000
Es reden sich um Head und Kragen, HTML-Fundamentalist Moritz Gießmann und JavaScript-Jongleurin Sarah Groß.

00:00:56.000 --> 00:01:03.000
Hallo zusammen. Hallo. Hi, Sarah. Na, sind wir heute gut drauf? Nee.

00:01:03.000 --> 00:01:08.000
Ich frag deswegen, weil wir beim letzten Stream beide irgendwie so einen Durchhänger hatten.

00:01:08.000 --> 00:01:11.000
Ach, viel anders ist es jetzt heute nicht. Okay.

00:01:11.000 --> 00:01:22.000
Aber wir haben ja festgestellt, die Durchhängersituationen leiten immer irgendwie in interessante Deep-Talk-Gespräche.

00:01:22.000 --> 00:01:26.000
Das war jetzt irgendwie dann auch wieder so. Stimmt. Da war bestimmt ein Zusammenhang. Ja.

00:01:26.000 --> 00:01:29.000
Also könnte sein. Da haben wir doch was Positives rausgezogen. Ja. Genau.

00:01:29.000 --> 00:01:34.000
Ja, dann lass uns doch Flüssigkeiten woanders rausziehen. Wow. Okay, lass uns bezogen.

00:01:34.000 --> 00:01:38.000
Was für eine Überleitung. Ja, ich bin wieder langweilig. Hast du ein Getränk?

00:01:38.000 --> 00:01:41.000
Ich hab ein Getränk. Ich hab heute Club Marte Eistee.

00:01:41.000 --> 00:01:47.000
Wichtig ist mir noch zu sagen, dass da draufsteht auf der Flasche Kraftstoff. Kraftstoff.

00:01:47.000 --> 00:01:52.000
Ich weiß nicht genau warum. Also das ist wirklich eines, oder wie soll ich sagen?

00:01:52.000 --> 00:01:57.000
Es sieht aus, als hätte der Praktikant das Logo gemacht. Das sieht irgendwie schon immer so aus.

00:01:57.000 --> 00:02:00.000
Vielleicht hat der Praktikant das Logo gemacht oder die Praktikantin.

00:02:00.000 --> 00:02:04.000
Oder die Praktikantin. Ich möchte ja echt gar nicht genderdiskriminieren an der Stelle.

00:02:04.000 --> 00:02:11.000
Das ist, egal wer es gemacht hat, es ist besonders. Und es ist schon seit ewigen Jahren so bei dem Eistee.

00:02:11.000 --> 00:02:17.000
Ich weiß nicht, es ist halt so, als ob jemand irgendwie mal rausgefunden hat, dass er Vektor ...

00:02:17.000 --> 00:02:22.000
Es sieht aus, als hätte es jemand in Word gemacht, mit so Word-Clipart-Zeug, ja.

00:02:22.000 --> 00:02:27.000
Ja, aber es ist eigentlich schlechter als Clipart. Die Cliparts waren meistens, das ist halt so selbst geklöppelt.

00:02:27.000 --> 00:02:34.000
Ich versuch's mal zu beschreiben. Es soll ein Eisblock, glaube ich, sein, der so von Hand gezeichnet ist, so Vektormäßig.

00:02:34.000 --> 00:02:39.000
Aber der hat natürlich einen Verlauf von links nach rechts über diverse Blautöne.

00:02:39.000 --> 00:02:48.000
Und darüber befindet sich eine breitgezogene Ellipse in etwas dunklerem Blau. Auf der steht ICE, also Eis.

00:02:48.000 --> 00:02:53.000
Und rechts daneben ein riesengroßes, im Vergleich dazu ein riesengroßes rotes T,

00:02:53.000 --> 00:03:01.000
in dem wiederum ganz unten, weiß, ganz klein, die Buchstaben E A, also für T.

00:03:01.000 --> 00:03:07.000
Und unten drunter steht noch Rot-Kraftstoff. Also Rot auf Blau ist auch immer eine sehr beliebte Kombination.

00:03:07.000 --> 00:03:12.000
Also man hat wirklich nichts ausgelassen. Also ich kann euch nur empfehlen,

00:03:12.000 --> 00:03:15.000
falls ihr euch jetzt fragt, was hat er da komisches gerade beschrieben,

00:03:15.000 --> 00:03:19.000
kauft euch mal oder schaut euch nur mal im Supermarkt an eine Flasche Club Marte Eistee.

00:03:19.000 --> 00:03:23.000
Ich hab den schon gesucht, bei mir im Edeka gibt's den aber nicht.

00:03:23.000 --> 00:03:33.000
Also wirklich, ich bin seit zwei Jahren oder so überzeugter Getränke-Lieferanten-Service-Inanspruchnehmer.

00:03:33.000 --> 00:03:39.000
Ich kaufe Getränke quasi außer Einzelflaschen oder sowas, was ich gerade haben will,

00:03:39.000 --> 00:03:43.000
kaufe ich nicht mehr im Supermarkt oder im Getränkemarkt. Ich lasse liefern.

00:03:43.000 --> 00:03:45.000
Aber der Moritz lässt liefern.

00:03:45.000 --> 00:03:51.000
Ich lasse liefern. Und das ist sogar, wenn ich jetzt das vergleiche mit dem Einzelpreis für Club Marte-Flaschen,

00:03:51.000 --> 00:03:54.000
bei mir hier im Supermarkt, da kann man keinen Kasten kaufen, da gibt's nur Einzelflaschen,

00:03:54.000 --> 00:03:57.000
deutlich billiger. Selbst beim Liefern lassen.

00:03:57.000 --> 00:04:06.000
Ich glaube, die Kiste normale Club Marte kostet mich bei meinem Lieferanten 15,50 Euro oder 15,30 Euro oder sowas.

00:04:06.000 --> 00:04:08.000
Exklusiv-Gefangen.

00:04:08.000 --> 00:04:11.000
Musst du mir nachher mal sagen, was das ist, damit wir hier keine Werbung machen.

00:04:11.000 --> 00:04:16.000
Weil bei unserem Speziverbrauch hier wird sich das, glaube ich, auch bald lohnen, es liefern zu lassen.

00:04:16.000 --> 00:04:20.000
Doch, doch, das ist ganz toll, wenn man es geliefert bekommt. Ich kann das nur empfehlen.

00:04:20.000 --> 00:04:24.000
Und ich war auch dann erstaunt, dass es eigentlich nicht teurer ist, als wenn ich es im Getränkemarkt kaufe.

00:04:24.000 --> 00:04:29.000
Genau, das sind 0,5er-Club Marte-Flaschen, 20 Stück. Kannst du dir ausrechnen.

00:04:29.000 --> 00:04:36.000
Dann kostet mich die Flasche unter einen Euro, zwischen 15 und 16 Euro, die Kiste für 20.

00:04:36.000 --> 00:04:44.000
Und wenn ich eine 0,33er-Flasche Club Marte, also noch kleiner, bei mir im Supermarkt hier einzeln kaufe,

00:04:44.000 --> 00:04:47.000
kostet die, glaube ich, 1,30 Euro mittlerweile.

00:04:47.000 --> 00:04:54.000
Ja, ist sogar billiger. Also kann ich nur empfehlen, guck mal, und da kann ich ganz unverdient mal Werbung machen.

00:04:54.000 --> 00:04:57.000
Ich kann mal Werbung machen für die Seite, wo ich bestelle, das ist nicht der Lieferant.

00:04:57.000 --> 00:05:01.000
Das heißt nämlich wir-liefern-getränke.de.

00:05:01.000 --> 00:05:06.000
Und das ist quasi so eine Portalseite, wo Getränkelieferanten ihr Angebot einstellen können,

00:05:06.000 --> 00:05:12.000
aber die halt selbst keinen Online-Shop haben. Die haben quasi dann darüber einen Shop.

00:05:12.000 --> 00:05:17.000
Und das heißt, du hast dann, so wie ich gerade gesagt habe, sucht euren lokalen Getränkelieferanten, hast du dann da.

00:05:17.000 --> 00:05:23.000
Genau, das ist es. Du gibst dann da deine Adresse ein und dann siehst du, wer liefert denn von diesem Portal alles zu dir.

00:05:23.000 --> 00:05:26.000
Und das sind bei mir so drei oder vier, habe ich zur Auswahl.

00:05:26.000 --> 00:05:31.000
Und aber nur einer davon hat vernünftiges Marte-Angebot, also auch verschiedene Sorten.

00:05:31.000 --> 00:05:34.000
Genau, auch die Club Marte Zero mittlerweile, die es eigentlich ja gar nicht gibt.

00:05:34.000 --> 00:05:40.000
Grüße an Manuel Matusewitsch. Genau, also das ist total cool.

00:05:40.000 --> 00:05:42.000
Und die haben auch alle unterschiedliche Preise.

00:05:42.000 --> 00:05:44.000
Also letzten Endes ist das ein ganz normaler Getränkelieferant.

00:05:44.000 --> 00:05:51.000
Der kommt dann da mit seinem LKW oder mit seinem kleinen Lastfahrzeug angefahren

00:05:51.000 --> 00:05:57.000
und mit einer Sackkarre und bringt dann die Kisten und holt das Leergut auch mit.

00:05:57.000 --> 00:06:02.000
Und das zu einem verdammt guten Preis, wie ich finde. Und wieso soll man das selbst schleppen?

00:06:02.000 --> 00:06:08.000
Auch hier, obwohl ich nicht so zentral wohne in Karlsruhe, habe ich vier Anbieter zur Auswahl,

00:06:08.000 --> 00:06:11.000
wo ich gucken kann, was hier mit Preisen besser ist.

00:06:11.000 --> 00:06:18.000
Einfach mal gucken, Preise checken und dann unterstützt ihr auch eure lokalen Getränkelieferanten.

00:06:18.000 --> 00:06:22.000
Sehr schön. Aber noch was für die Shownotes.

00:06:22.000 --> 00:06:25.000
Noch was für die Shownotes, genau.

00:06:25.000 --> 00:06:32.000
Ich habe auch was Nichtalkoholisches. Ich mache jetzt auch schon wieder Erwerbung für die Edeka.

00:06:32.000 --> 00:06:37.000
Es gibt so ein amerikanisches Regal, wo es so Riesesachen manchmal gibt.

00:06:37.000 --> 00:06:41.000
Also immer wechselnd auch Sachen, die es nicht immer im Sortiment gibt.

00:06:41.000 --> 00:06:45.000
Und die haben auch immer wieder so Getränke, die es bei uns in Deutschland nicht gibt.

00:06:45.000 --> 00:06:50.000
Und unter anderem habe ich jetzt hier eine Fanta Pineapple & Grapefruit.

00:06:50.000 --> 00:06:54.000
Blaue Fanta-Dose mit Ananas und Grapefruit. Da bin ich mal gespannt.

00:06:54.000 --> 00:06:59.000
Guck ich mal, was gibt es denn da so und dann nehme ich mir ab und zu was mit.

00:06:59.000 --> 00:07:03.000
Also, das klingt gut. Ich habe meine Flasche leider schon offen gehabt.

00:07:03.000 --> 00:07:05.000
Ich musste vorhin schon ein bisschen Zucker zu mir nehmen.

00:07:05.000 --> 00:07:07.000
Also dann anstoßen ist eh schwierig.

00:07:07.000 --> 00:07:09.000
Natürlich, kein Problem.

00:07:09.000 --> 00:07:11.000
Guck mal, meine Dose klingt wie eine Flasche.

00:07:11.000 --> 00:07:15.000
Klingt fantastisch, oder? Wir haben durch das Portal mal wieder angestoßen.

00:07:15.000 --> 00:07:23.000
Wir sitzen ja nicht im gleichen Raum, aber zum Anstoßen haben wir so ein kleines Portal geschaltet

00:07:23.000 --> 00:07:25.000
und das funktioniert dann immer ganz gut.

00:07:25.000 --> 00:07:27.000
Schmeckt tatsächlich echt ganz gut.

00:07:27.000 --> 00:07:34.000
Und ich hätte jetzt nicht gedacht, bei einem amerikanischen Getränk, dass da tatsächlich Fruchtsaft drin ist.

00:07:34.000 --> 00:07:38.000
Also 5% Fruchtsaft aus Konzentrat. Immerhin.

00:07:38.000 --> 00:07:44.000
Weil normalerweise kaufst du sowas und dann steht da irgendwie Passionfruit und dann enthält kein Fruchtsaft.

00:07:44.000 --> 00:07:47.000
Passionsfrucht? Frisches Obst?

00:07:47.000 --> 00:07:51.000
Nee, aber mir schmeckt das tatsächlich ziemlich gut.

00:07:51.000 --> 00:07:59.000
Gut, aber bevor wir jetzt zum Getränke-Podcast montieren, würde ich sagen, starten wir mit der Retro, oder?

00:07:59.000 --> 00:08:01.000
Warum nicht? Okay, na gut.

00:08:01.000 --> 00:08:16.000
Ja, wenn es sein muss, dann starten wir mit Inhalt.

00:08:16.000 --> 00:08:24.000
Naja, dazu muss ich sagen, wir waren ja mal bei der GPN und haben da einen Vortrag gehalten.

00:08:24.000 --> 00:08:26.000
Das ist schon wieder abgeschweift, ne?

00:08:26.000 --> 00:08:32.000
Und das wurde hinterher unter anderem auf YouTube veröffentlicht, aber auch auf dem CCC-Portal.

00:08:32.000 --> 00:08:35.000
Aber bei YouTube kann man halt Kommentare drunter schreiben.

00:08:35.000 --> 00:08:38.000
Und das Ding ging, glaube ich, eine Stunde oder so.

00:08:38.000 --> 00:08:42.000
Und irgendjemand hat in die Kommentare geschrieben, Inhalt beginnt bei 20 Minuten.

00:08:42.000 --> 00:08:50.000
Irgendjemand hatte sich beschwert, ich bin bei Minute 19 ausgestiegen, nur gelabert.

00:08:50.000 --> 00:08:54.000
Und ab Minute 20 ging es halt los mit Inhalt.

00:08:54.000 --> 00:08:57.000
Aber ich finde, das gehört doch auch irgendwie einfach dazu.

00:08:57.000 --> 00:08:59.000
Also, ich meine, das sind halt wir.

00:08:59.000 --> 00:09:04.000
Also, wer irgendwie nur harte Fakten reingetrümmert kriegen will, der ist halt falsch.

00:09:04.000 --> 00:09:07.000
Der kann Chat-GPT fragen, das labert einen dann auch voll.

00:09:07.000 --> 00:09:10.000
Ja, Chat-GPT, da geht es in meinem zweiten Retro-Punkt auch sogar drum.

00:09:10.000 --> 00:09:13.000
Aber jetzt komme ich erst mal zu meinem ersten.

00:09:13.000 --> 00:09:16.000
Und zwar merkt man, dass ich wieder am Arbeiten bin seit Mai.

00:09:16.000 --> 00:09:23.000
Und jetzt auch tatsächlich öfter wieder Beiträge habe, auch im Stream und so, die mit Technik zu tun haben.

00:09:23.000 --> 00:09:25.000
Und ich habe diese Woche zum ersten Mal Container-Querys verwendet.

00:09:25.000 --> 00:09:28.000
Wir haben ja über Container-Querys hier auch schon gesprochen.

00:09:28.000 --> 00:09:30.000
Und jetzt habe ich sie zum ersten Mal selber eingesetzt.

00:09:30.000 --> 00:09:34.000
Und zwar ging es, du weißt es schon, ich habe es im Stream schon angesprochen,

00:09:34.000 --> 00:09:37.000
um so eine Buchungsbox auf einer Seite für den Kunden.

00:09:37.000 --> 00:09:40.000
Und es ist noch nicht ganz klar, wo die überall hinkommt.

00:09:40.000 --> 00:09:44.000
Ob die später als Element auf alle Seiten oben irgendwie kommt oder ein Header.

00:09:44.000 --> 00:09:47.000
Oder nur auf die Startseite als Element, als Widget, das man setzen kann.

00:09:47.000 --> 00:09:50.000
Das ist jedenfalls WordPress-Kontext, das ist ein Shortcode.

00:09:50.000 --> 00:09:54.000
Das heißt, ich weiß nicht, wo dieses Ding am Ende vielleicht auftaucht.

00:09:54.000 --> 00:09:58.000
Und dann dachte ich, Mensch, das ist doch jetzt der perfekte Einsatzzweck für Container-Querys.

00:09:58.000 --> 00:10:04.000
Ich möchte, dass dieses Ding unabhängig, wo es ist, einfach in der darstellbaren Breite immer gut angezeigt wird.

00:10:04.000 --> 00:10:09.000
Sprich, dass die Felder bei zu wenig Platz untereinander sind, statt nebeneinander, wenn der Platz nicht ausreicht.

00:10:09.000 --> 00:10:12.000
Und dann habe ich zum ersten Mal Container-Querys eingesetzt.

00:10:12.000 --> 00:10:15.000
Und das ist eigentlich echt simpel und echt cool.

00:10:15.000 --> 00:10:18.000
Aber ich bin gleich am Anfang über was gestolpert, was mir nicht bewusst war.

00:10:18.000 --> 00:10:25.000
Und zwar kann ich den Container, also das Element, dem ich das Container-Attribut in CSS gebe,

00:10:25.000 --> 00:10:31.000
das kann ich selbst nicht stylen im Container-Query selbst.

00:10:31.000 --> 00:10:39.000
Also ich kann da jetzt nicht sagen, das Container-Element kriegt einen roten Background kleiner als 300 Pixel oder so.

00:10:39.000 --> 00:10:44.000
Und was ich dann gemacht habe, ist ein kleiner Ausweg mit einem Hass-Selector.

00:10:44.000 --> 00:10:54.000
Das heißt, ich habe, ich sage, jedes Element, das als direktes Kind-Element diese Buchungsbox hat,

00:10:54.000 --> 00:11:01.000
also Doppel-Punkt-Hass-Klammer auf, spitze Pfeil rechts und dann die ID oder die Klasse von diesem Buchungscontainer,

00:11:01.000 --> 00:11:08.000
das bekommt den entsprechenden Containernamen über CSS, den ich dann später in dem Container-Query benutzen kann.

00:11:08.000 --> 00:11:12.000
Und damit bin ich eigentlich ganz zufrieden.

00:11:12.000 --> 00:11:18.000
Und inzwischen ist ja Hass-Unterstützung mindestens genauso wie Container-Query-Unterstützung.

00:11:18.000 --> 00:11:21.000
Von daher habe ich da jetzt eigentlich wenig Bedenken gehabt, das so anzuwenden.

00:11:21.000 --> 00:11:28.000
Aber ich habe zusätzlich trotzdem noch die Regeln in einem Media-Query dupliziert.

00:11:28.000 --> 00:11:32.000
Und wir hatten es jetzt im Stream auch schon drüber und haben da so ein bisschen mal Feedback eingeholt,

00:11:32.000 --> 00:11:35.000
wie würden es die anderen machen, bin ich einfach zu übervorsichtig.

00:11:35.000 --> 00:11:38.000
Wir sind noch so die Generation, keine Evergreen-Browser.

00:11:38.000 --> 00:11:44.000
Wir müssen immer noch gucken, dass wir irgendwie Omas altes Nokia 3210 noch unterstützen.

00:11:44.000 --> 00:11:53.000
Den Webbrowser. Und ich weiß nicht, ich kann das selbst schwer einschätzen, ist das jetzt noch notwendig,

00:11:53.000 --> 00:11:58.000
weil halt irgendwelche alten Opera Minis oder was das nicht unterstützen.

00:11:58.000 --> 00:12:02.000
Und in dem Fall wäre es halt einfach wirklich blöd oder irgendwelche alten iPhones vielleicht auch.

00:12:02.000 --> 00:12:08.000
Muss ja nichts ganz Absurdes sein, aber einfach irgendwie ein iPhone, das halt schon, sagen wir mal, drei Jahre alt ist

00:12:08.000 --> 00:12:13.000
und vielleicht nicht mehr die aktuellste Software, den aktuellsten Safari erhält oder so.

00:12:13.000 --> 00:12:17.000
Und dann funktioniert es da nicht. Und das sieht dann einfach, wenn es nicht angepasst ist, kacke aus,

00:12:17.000 --> 00:12:19.000
weil es einfach abgeschnitten wird und man es nicht richtig benutzen kann.

00:12:19.000 --> 00:12:21.000
Ich muss kurz korrigieren.

00:12:21.000 --> 00:12:28.000
Also Apple-Geräte, die kriegen normalerweise so sechs bis sieben Jahre lang Feature-Versions-Updates.

00:12:28.000 --> 00:12:32.000
Es gibt bestimmt Leute, die immer noch ein altes iPhone haben. Ist nicht jeder so, dass er immer das gleiche Gerät braucht.

00:12:32.000 --> 00:12:38.000
Also ein altes iPhone wäre die Kategorie sechs, sieben, acht Jahre und älter.

00:12:38.000 --> 00:12:43.000
Gut, okay, das ist schon. Und jetzt habe ich es natürlich nicht gleich parat, aber wie ist denn der Stand?

00:12:43.000 --> 00:12:53.000
Can I use von Hasselector? Da sind wir Safari 15, also März 22.

00:12:53.000 --> 00:12:59.000
Das heißt, die letzten iPhones der letzten sechs Jahre, sagst du, müssten das haben.

00:12:59.000 --> 00:13:03.000
Dann ist die Frage, forciert Apple Updates?

00:13:03.000 --> 00:13:07.000
Oder kann das sein, dass Leute einfach den aktuellen Safari halt nicht aktualisiert haben?

00:13:07.000 --> 00:13:11.000
Der Safari ist Bestandteil des Betriebssystems.

00:13:11.000 --> 00:13:16.000
Das heißt, ich kann nicht sagen, ich updatet den Safari nicht, wenn ich mein Betriebssystem updatet.

00:13:16.000 --> 00:13:22.000
Der ist da fest mit einverdüngelt. Das ist keine App in dem eigentlichen Sinne, der gehört fest mit dazu.

00:13:22.000 --> 00:13:27.000
Es gibt aber allerdings mit Sicherheit Menschen, die das Update nicht machen.

00:13:27.000 --> 00:13:34.000
Apple forciert es nicht im Sinne von Abstichtag X musst du das Update machen.

00:13:34.000 --> 00:13:41.000
Ich weiß nicht, wie das bei Android ist. Aber sie nerven dich schon damit, dass du das machst nach einer Weile.

00:13:41.000 --> 00:13:47.000
Also die werden dich nicht am Tag, wo das Update rauskommt, bekommst du die Meldung.

00:13:47.000 --> 00:13:51.000
Aber nach einer Weile später sagen sie dann so, wir haben jetzt eine neue Version.

00:13:51.000 --> 00:13:55.000
Es wäre gut, wenn du mal updaten würdest. Und das wird dann schon penetrant irgendwann.

00:13:55.000 --> 00:14:02.000
Und sie selbst, also ich glaube, keiner hat die Statistik dazu außer Apple selbst.

00:14:02.000 --> 00:14:06.000
Und sie selbst sagen immer wieder, dass sie sehr schnell Update-Zeiten haben.

00:14:06.000 --> 00:14:12.000
Ob das stimmt, das muss man ihnen jetzt einfach glauben oder halt nicht.

00:14:12.000 --> 00:14:16.000
Aber was sagen sie davon, eine andere Aussage zu machen?

00:14:16.000 --> 00:14:26.000
Keine Ahnung. Wenn man sich mit der Konkurrenz vergleicht und sagt, guck mal, wie zerfleddert die Android-Welt ist.

00:14:26.000 --> 00:14:32.000
Das wollte ich nämlich auch gerade sagen, zu Android selbst, weil du gesagt hast, ich weiß nicht, wie es da aussieht.

00:14:32.000 --> 00:14:36.000
Es gibt ja nicht das eine Android, das ist ja das Ding. Es gibt so viele Flavor von den unterschiedlichen Herstellern.

00:14:36.000 --> 00:14:40.000
Und die haben ja auch sehr unterschiedliche Politik.

00:14:40.000 --> 00:14:44.000
Also bei mir war es zum Beispiel so, dass mein Handy sich letztens über Nacht neu gestartet hatte.

00:14:44.000 --> 00:14:48.000
Und ich sehe das dann daran, weil sich erst alles langsam aufbaut, wenn ich das erste Mal entsperre.

00:14:48.000 --> 00:14:52.000
Und dann stand oben auch hier System Update Installed.

00:14:52.000 --> 00:14:56.000
Das ist mir vorher nicht passiert mit MUI.

00:14:56.000 --> 00:15:02.000
Und jetzt bin ich auf diesem HyperOS von Huawei.

00:15:02.000 --> 00:15:08.000
Beziehungsweise Poco X3. Da ist mir das jetzt passiert.

00:15:08.000 --> 00:15:14.000
Also das hängt eben, wie gesagt, damit zusammen, was du da für ein Android drauf hast.

00:15:14.000 --> 00:15:20.000
Aber gut, wenn Chrome tatsächlich auch unabhängig davon aktualisiert, ist es eigentlich im Hintergrund automatisch.

00:15:20.000 --> 00:15:24.000
Wenn man das jetzt nicht irgendwie ausgestellt hat.

00:15:24.000 --> 00:15:28.000
Das heißt, wenn Safari da auch gut ist, dann bin ich ja guter Dinge, dass ich theoretisch das Media Query gar nicht bräuchte.

00:15:28.000 --> 00:15:32.000
Aber für den Fall der Fälle habe ich es jetzt mal gemacht.

00:15:32.000 --> 00:15:36.000
Es war nicht viel an CSS, was ich da duplizieren musste.

00:15:36.000 --> 00:15:40.000
Aber generell fände ich es irgendwie cool, wenn man das irgendwie vermeiden könnte, da alles duplizieren zu müssen.

00:15:40.000 --> 00:15:44.000
Sondern halt sagen könnte, und das kann man ja mit einem Bildsystem auch machen.

00:15:44.000 --> 00:15:48.000
Aber trotzdem ist es halt im CSS zweimal drin.

00:15:48.000 --> 00:15:52.000
Aber für Backwards-Compatibility geht es halt auch nicht anders, als dass du es noch mal reinkopieren musst.

00:15:52.000 --> 00:15:56.000
Jedenfalls ist es eine coole Sache. Egal, wo das Ding jetzt ist, es wird richtig dargestellt.

00:15:56.000 --> 00:16:00.000
Wenn ich es mir leisten könnte, das haben wir, glaube ich, auch im Stream schon besprochen.

00:16:00.000 --> 00:16:04.000
Wenn ich ein bisschen Zeit hätte und es mir leisten kann zeitlich,

00:16:04.000 --> 00:16:08.000
würde ich immer versuchen, echte Zahlen zu erfassen von der jeweiligen Webseite.

00:16:08.000 --> 00:16:12.000
Weil eine Can-I-Use-Statistik ist schön und gut für irgendwie weltweite Zahlen.

00:16:12.000 --> 00:16:16.000
Ich weiß nicht mal genau, wo die Zahlen herkommen bei Can-I-Use.

00:16:16.000 --> 00:16:20.000
Kann man bestimmt irgendwo nachlesen.

00:16:20.000 --> 00:16:24.000
Und trotzdem ist es aber auch so, dass das überhaupt keine Aussage darüber trifft,

00:16:24.000 --> 00:16:28.000
was jetzt wirklich die Realität ist auf der Seite, für die du was baust.

00:16:28.000 --> 00:16:32.000
Weil es kann sein, dass das irgendwie Kunden sind mit ganz speziellen Systemen.

00:16:32.000 --> 00:16:36.000
Es geht um Reisen, es geht um Reisen in ein bestimmtes Land.

00:16:36.000 --> 00:16:40.000
Das heißt, klar, weißt du nicht, wie sind die Leute drauf?

00:16:40.000 --> 00:16:44.000
Kann es alle möglichen Überraschungen geben, je nachdem, wo du dich befindest

00:16:44.000 --> 00:16:46.000
oder was für ein Content du anbietest?

00:16:46.000 --> 00:16:50.000
Ich glaube, es kann ganz interessante Sachen geben, die man da drin noch findet in den Statistiken.

00:16:50.000 --> 00:16:54.000
Früher war es halt so, man hat einfach überall Google Analytics reingeworfen.

00:16:54.000 --> 00:16:58.000
Unabhängig davon, ob der Kunde das jetzt unbedingt wollte oder nicht.

00:16:58.000 --> 00:17:02.000
Man hat es ihm halt gleich mit reingeklopft und gesagt, guck mal, da kannst du in die Statistiken schauen.

00:17:02.000 --> 00:17:06.000
Jetzt mit DSGVO und so wollten viele das rausgeschmissen haben.

00:17:06.000 --> 00:17:08.000
Aber auch nicht irgendwie Geld in die Hand nehmen,

00:17:08.000 --> 00:17:12.000
dass wir da irgendwas anderes integrieren, Matomo oder so was.

00:17:12.000 --> 00:17:16.000
Dementsprechend fehlen uns da oft die Zahlen, die wir früher noch eher gehabt hätten,

00:17:16.000 --> 00:17:19.000
weil wir es einfach standardmäßig mit reingeklopft haben.

00:17:19.000 --> 00:17:22.000
Sorry, jetzt schweife ich noch weiter aus.

00:17:22.000 --> 00:17:26.000
Aber so als Agentur eine Matomo-Instanz zu betreiben,

00:17:26.000 --> 00:17:31.000
die dann überall für alle Kunden verwendet wird und dann jeweils eine eigene Seite angelegt wird

00:17:31.000 --> 00:17:35.000
und die dann Berechtigung kriegen, nur um die Statistiken ihrer Seite anzuschauen,

00:17:35.000 --> 00:17:37.000
wäre ja schon ein gangbarer Weg.

00:17:37.000 --> 00:17:41.000
Wäre ein gangbarer Weg, ist aber trotzdem wieder eine Drittanbieter-Anbindung

00:17:41.000 --> 00:17:45.000
und man müsste das halt entsprechen in den Cookie-Notices und so weiter,

00:17:45.000 --> 00:17:47.000
was da halt alles mitkommt.

00:17:47.000 --> 00:17:54.000
Nee, du kannst Matomo so konfigurieren, dass es keine Cookies verwendet zum Beispiel.

00:17:54.000 --> 00:17:58.000
Die gehen natürlich bestimmte Daten verloren, aber so was wie Browserdaten,

00:17:58.000 --> 00:18:01.000
das, was dich jetzt interessiert, oder wie groß ist das Display.

00:18:01.000 --> 00:18:03.000
Das haben wir tatsächlich sogar, ja.

00:18:03.000 --> 00:18:05.000
Wir haben ja theoretisch, wenn wir selber hosten,

00:18:05.000 --> 00:18:07.000
auch Zugriff auf die ganzen Server-Statistiken.

00:18:07.000 --> 00:18:09.000
Also da kommen wir schon an Daten ran.

00:18:09.000 --> 00:18:12.000
Also ohne Cookie, genau, das würde auch so gehen.

00:18:12.000 --> 00:18:14.000
Du kannst natürlich auch Log-Analyse machen,

00:18:14.000 --> 00:18:17.000
aber das geht auch ohne Cookie und du kannst Matomo tatsächlich,

00:18:17.000 --> 00:18:19.000
die haben das schon verstanden, wie man das macht,

00:18:19.000 --> 00:18:22.000
kannst du so konfigurieren, dass es keine Cookies verwendet.

00:18:22.000 --> 00:18:24.000
Wir haben auch eine eigene Matomo-Instanz.

00:18:24.000 --> 00:18:26.000
Also wir haben das auch und wir können das auch anbieten,

00:18:26.000 --> 00:18:28.000
nur wenn wir das anbieten und wenn wir das bei uns hosten,

00:18:28.000 --> 00:18:30.000
dann möchten wir natürlich was dafür haben.

00:18:30.000 --> 00:18:31.000
Na klar.

00:18:31.000 --> 00:18:37.000
Im Vergleich zu Google Analytics und da sind viele KundInnen einfach nicht dran interessiert.

00:18:37.000 --> 00:18:40.000
Also ich habe mein eigenes Matomo am Laufen für meine,

00:18:40.000 --> 00:18:42.000
schon lange, da hieß es noch pwik.

00:18:42.000 --> 00:18:44.000
Ja, genau, bei uns auch.

00:18:44.000 --> 00:18:47.000
Ich glaube, die SAP-Domain bei uns ist auch noch pwik.irgendwas.

00:18:47.000 --> 00:18:51.000
Und das habe ich halt in allen meinen Sachen drin,

00:18:51.000 --> 00:18:54.000
aber ich habe das sehr, sehr datensparsam eingestellt.

00:18:54.000 --> 00:18:58.000
Also es verwendet keine Cookies, es respektiert den Do-Not-Track-Header

00:18:58.000 --> 00:19:03.000
und ich glaube, es beschneidet sogar irgendwie die IP-Adressen.

00:19:03.000 --> 00:19:06.000
Also mich interessiert auch das alles gar nicht.

00:19:06.000 --> 00:19:09.000
Mich interessieren schon die Wege, die jemand nimmt über eine Seite

00:19:09.000 --> 00:19:11.000
und das geht halt nur,

00:19:11.000 --> 00:19:15.000
also ich kann keine wiederkehrenden BesucherInnen identifizieren,

00:19:15.000 --> 00:19:17.000
weil kein Cookie gesetzt ist.

00:19:17.000 --> 00:19:20.000
Beziehungsweise das müsste man dann mit Local Storage oder so,

00:19:20.000 --> 00:19:22.000
müsste das doch eigentlich gehen, oder?

00:19:22.000 --> 00:19:25.000
Ja, aber auch das IP, es geht ja gar nicht mehr nur um Cookies.

00:19:25.000 --> 00:19:29.000
Auch solche Storage-Geschichten, dachte ich auch, das kann man schön umgehen,

00:19:29.000 --> 00:19:33.000
aber es ist trotzdem eine Daten, die du speicherst.

00:19:33.000 --> 00:19:36.000
Also wiederkehrende BesucherInnen kann ich nicht identifizieren,

00:19:36.000 --> 00:19:39.000
das ist etwas, was auf jeden Fall verloren geht.

00:19:39.000 --> 00:19:43.000
Das ist aber so ziemlich das Einzige, was mir verloren geht von den Sachen,

00:19:43.000 --> 00:19:45.000
die mich potenziell interessieren würden,

00:19:45.000 --> 00:19:48.000
weil ich kann trotzdem die Browser-Statistiken sehen

00:19:48.000 --> 00:19:50.000
und kann sehen, ah ja, okay,

00:19:50.000 --> 00:19:53.000
da kommt niemand mehr mit dem Internet Explorer.

00:19:53.000 --> 00:19:55.000
Gut, hätte mich sowieso nicht interessiert.

00:19:55.000 --> 00:19:57.000
Das ist das Wichtigste.

00:19:57.000 --> 00:19:59.000
Oder wie neu sind denn die Browser?

00:19:59.000 --> 00:20:01.000
Ich gucke aber, ehrlich gesagt, selten rein.

00:20:01.000 --> 00:20:03.000
Ich sehe dann grob ungefähr da drauf,

00:20:03.000 --> 00:20:06.000
oder zumindest wie viele Page-Impressions und so was.

00:20:06.000 --> 00:20:08.000
Das ist ja schon interessant.

00:20:08.000 --> 00:20:11.000
Aber wie gesagt, viele KundInnen interessiert das überhaupt gar nicht.

00:20:11.000 --> 00:20:13.000
Wer guckt sich was an?

00:20:13.000 --> 00:20:16.000
Also, wenn ich ein neues Blog-Artikel schreibe ...

00:20:16.000 --> 00:20:18.000
Schon sehr abgeschwurft.

00:20:18.000 --> 00:20:20.000
Na gut, dann schwurfen wir wieder mal zurück.

00:20:20.000 --> 00:20:22.000
Genau, was ich noch sagen wollte,

00:20:22.000 --> 00:20:25.000
schreibt doch mal in die Kommentare, wie ihr das handhaben würdet.

00:20:25.000 --> 00:20:27.000
Nutzt ihr Container-Querys schon?

00:20:27.000 --> 00:20:30.000
Und wenn ja, habt ihr zusätzlich noch Media-Querys,

00:20:30.000 --> 00:20:32.000
oder seid ihr mit der Bildschirmbreite noch ...

00:20:32.000 --> 00:20:34.000
Also, gar nicht mal von dem Container abhängig,

00:20:34.000 --> 00:20:37.000
sondern generell einfach, wenn weniger als die Breite,

00:20:37.000 --> 00:20:39.000
dann verhält sich das anders.

00:20:39.000 --> 00:20:42.000
Macht ihr das, oder sagt ihr, pff, dann sieht's da halt doof aus.

00:20:42.000 --> 00:20:45.000
Und ich nutze nur State-of-the-Art-neuestes CSS.

00:20:45.000 --> 00:20:47.000
Und was mich noch interessieren würde,

00:20:47.000 --> 00:20:50.000
gibt es vielleicht noch irgendeinen cleveren Trick,

00:20:50.000 --> 00:20:52.000
den Container selbst zu stylen?

00:20:52.000 --> 00:20:54.000
Genau, vielleicht war ich da zu doof,

00:20:54.000 --> 00:20:57.000
aber ich hab auch tatsächlich an anderen Stellen gefunden,

00:20:57.000 --> 00:20:59.000
sorry, das geht ja nicht.

00:20:59.000 --> 00:21:01.000
Das haltet ihr von dem Hass-Workaround,

00:21:01.000 --> 00:21:04.000
weil, genau, da hatten wir's auch noch drüber,

00:21:04.000 --> 00:21:07.000
ich könnte auch einfach ein zusätzliches Container-Element

00:21:07.000 --> 00:21:09.000
außenrum basteln,

00:21:09.000 --> 00:21:12.000
das nur den Zweck hat, als Container zu dienen.

00:21:12.000 --> 00:21:15.000
Aber das fand ich in dem Fall halt irgendwie doof,

00:21:15.000 --> 00:21:17.000
weil einfach unsemantisch und überflüssig.

00:21:17.000 --> 00:21:19.000
Wir wollen ja eigentlich weg von Dingen,

00:21:19.000 --> 00:21:21.000
die nur zum Styling dienen.

00:21:21.000 --> 00:21:24.000
Wir wollen ja eigentlich hin zu semantischem HTML

00:21:24.000 --> 00:21:27.000
und das nur drin haben, was wir auch tatsächlich benötigen.

00:21:27.000 --> 00:21:29.000
Genau.

00:21:29.000 --> 00:21:33.000
Gut, so, dann.

00:21:33.000 --> 00:21:35.000
Nächster Retro-Punkt.

00:21:35.000 --> 00:21:38.000
Ich hangel mich heute in meinen Retro-Punkten

00:21:38.000 --> 00:21:41.000
ein bisschen an Dingen entlang,

00:21:41.000 --> 00:21:44.000
die ich gebloggt habe, unter anderem.

00:21:44.000 --> 00:21:47.000
Also gebloggt, nicht gebloggt.

00:21:47.000 --> 00:21:49.000
Gebloggt, gebloggt.

00:21:49.000 --> 00:21:52.000
Ist eigentlich der oder das Blog?

00:21:52.000 --> 00:21:54.000
Das Log, oder?

00:21:54.000 --> 00:21:56.000
Ja, aber Blog.

00:21:56.000 --> 00:21:58.000
Von Logbuch, also eigentlich das Blog,

00:21:58.000 --> 00:22:00.000
aber ich sag auch der Blog.

00:22:00.000 --> 00:22:02.000
Aber eigentlich ist es auch egal.

00:22:02.000 --> 00:22:06.000
Ja, also, ich habe zum Beispiel eine Sache getan,

00:22:06.000 --> 00:22:10.000
nämlich ich wollte mal wieder so einen Server

00:22:10.000 --> 00:22:16.000
oder so was Low-Leveliges einfach zu bedienendes installieren,

00:22:16.000 --> 00:22:20.000
womit ich irgendwie einen Server bei mir aufsetzen kann auf dem Mac.

00:22:20.000 --> 00:22:22.000
Jetzt kann man natürlich das so machen,

00:22:22.000 --> 00:22:24.000
dass man für jedes Projekt irgendwie

00:22:24.000 --> 00:22:26.000
einen eigenen Node-Server irgendwie hochzieht.

00:22:26.000 --> 00:22:28.000
Das machen ja viele mittlerweile so.

00:22:28.000 --> 00:22:30.000
Ich habe aber ganz viele so alte Projekte,

00:22:30.000 --> 00:22:32.000
wo noch irgendwie PHP drin rumgammelt

00:22:32.000 --> 00:22:34.000
und wo es irgendwie angenehm ist,

00:22:34.000 --> 00:22:36.000
wenn man einfach sagt, ich habe einfach einen Server

00:22:36.000 --> 00:22:40.000
und dessen Home-Folder ist irgendwie ein Projekt-Ordner

00:22:40.000 --> 00:22:42.000
und in dem sind halt tausend Sachen drin

00:22:42.000 --> 00:22:44.000
und alles, was mit PHP funktioniert,

00:22:44.000 --> 00:22:47.000
funktioniert dann halt, wenn ich den starte

00:22:47.000 --> 00:22:50.000
und ich dann in den Browser auf einen bestimmten Pfad gehe

00:22:50.000 --> 00:22:52.000
und dann funktioniert das einfach alles mit dem PHP.

00:22:52.000 --> 00:22:54.000
Und ich muss da jetzt nicht irgendwie

00:22:54.000 --> 00:22:57.000
jedes Mal was Eigenes irgendwie zusammenbasteln.

00:22:57.000 --> 00:23:00.000
So, und dann habe ich mich erinnert,

00:23:00.000 --> 00:23:02.000
oder es gibt so verschiedene Varianten,

00:23:02.000 --> 00:23:04.000
man kann es irgendwie selbst basteln.

00:23:04.000 --> 00:23:08.000
Der Mac hatte auch mal ein Apache und ein PHP selbst mit dabei,

00:23:08.000 --> 00:23:12.000
aber hat jetzt nur noch den Apache und das PHP, glaube ich, nicht mehr,

00:23:12.000 --> 00:23:14.000
was so fest mit eingebaut war.

00:23:14.000 --> 00:23:16.000
Unter Linux zum Beispiel oder Ubuntu war das nie ein Problem,

00:23:16.000 --> 00:23:19.000
es war einfach alles quasi fast schon da.

00:23:19.000 --> 00:23:22.000
Und auf Windows nutzt man ja XAMPP,

00:23:22.000 --> 00:23:24.000
oder das war zumindest das, was ich früher immer ...

00:23:24.000 --> 00:23:26.000
Oder inzwischen Laragon, da hatte ich es auch mal drüber,

00:23:26.000 --> 00:23:28.000
dass ich das inzwischen nutze.

00:23:28.000 --> 00:23:30.000
Aber XAMPP ist somit das verbreiteste, denke ich mal.

00:23:30.000 --> 00:23:33.000
XAMPP ist, vielleicht für alle, die es nicht wissen,

00:23:33.000 --> 00:23:36.000
ist so ein kleines Programm, das starte ich

00:23:36.000 --> 00:23:40.000
und dann habe ich da drin so ein paar Konfigurationssachen,

00:23:40.000 --> 00:23:42.000
aber da kann ich einfach sagen, starte mir mal den Apache,

00:23:42.000 --> 00:23:45.000
starte mir mal PHP, starte mir mal MySQL oder MariaDB

00:23:45.000 --> 00:23:47.000
und dann läuft das einfach.

00:23:47.000 --> 00:23:49.000
Und wenn ich es nicht mehr brauche, dann schieße ich das wieder ab.

00:23:49.000 --> 00:23:51.000
Und dann kann ich halt vielleicht noch konfigurieren,

00:23:51.000 --> 00:23:54.000
wo greift denn das drauf zu oder wo ist denn der Ordner,

00:23:54.000 --> 00:23:57.000
wo das Zeug rumliegt, was ich dann irgendwie

00:23:57.000 --> 00:24:01.000
unter Localhost Pfad oder so dann angezeigt bekommen möchte.

00:24:01.000 --> 00:24:04.000
So, und dann, ich hatte so was Ähnliches hier auch laufen,

00:24:04.000 --> 00:24:07.000
aber das hat nicht so richtig funktioniert, das war langsam.

00:24:07.000 --> 00:24:10.000
Ich weiß gar nicht mehr, wie hieß denn das?

00:24:10.000 --> 00:24:13.000
Ah, LAMP hieß das, glaube ich.

00:24:13.000 --> 00:24:15.000
Nee, warte, nee, MAMP, ich bin falsch.

00:24:15.000 --> 00:24:17.000
MAMP natürlich für einen Mac, ne?

00:24:17.000 --> 00:24:20.000
Genau, MAMP hieß das.

00:24:20.000 --> 00:24:23.000
Das hatte ich eine Weile am Laufen, aber das war irgendwie,

00:24:23.000 --> 00:24:25.000
ich weiß nicht genau, was das für eine komische Magie

00:24:25.000 --> 00:24:27.000
im Hintergrund gemacht hat, aber ich hatte den Eindruck,

00:24:27.000 --> 00:24:29.000
das kopiert jedes Mal die ganzen Files von irgendwo weg

00:24:29.000 --> 00:24:32.000
und woanders hin und dann sind mal diese Files übrig geblieben

00:24:32.000 --> 00:24:35.000
und dann hatte ich irgendwie dreimal meinen Projekteordner

00:24:35.000 --> 00:24:37.000
irgendwo gefunden und dachte, was ist denn das?

00:24:37.000 --> 00:24:39.000
Also, vielleicht habe ich auch irgendwas falsch gemacht,

00:24:39.000 --> 00:24:41.000
aber das hat für mich nicht so richtig gut funktioniert.

00:24:41.000 --> 00:24:43.000
Und dann habe ich nochmal geguckt, weil ich dachte schon,

00:24:43.000 --> 00:24:46.000
XAMPP gab es doch auch mal für einen Mac.

00:24:46.000 --> 00:24:50.000
Aber ich habe mich dann auch wieder erinnert,

00:24:50.000 --> 00:24:53.000
dass ich das schon mal gefunden hatte,

00:24:53.000 --> 00:24:56.000
aber davon abgeschreckt war, dass es sah so aus,

00:24:56.000 --> 00:25:00.000
als ob es uralt ist, weil da stand irgendwie,

00:25:00.000 --> 00:25:03.000
ich weiß gar nicht mehr, was war denn das Problem?

00:25:03.000 --> 00:25:05.000
Ich muss es gerade selbst nochmal gucken.

00:25:05.000 --> 00:25:09.000
Ach so, ich wollte gerade nicht runterladen, egal.

00:25:09.000 --> 00:25:12.000
Da stand irgendeine komische Versionsnummer

00:25:12.000 --> 00:25:14.000
und Release 2017 oder irgendwie sowas.

00:25:14.000 --> 00:25:17.000
Und da dachte ich so, nee, so was Altes will ich jetzt nicht haben.

00:25:17.000 --> 00:25:20.000
Habe jetzt aber rausgefunden, ich lag da falsch.

00:25:20.000 --> 00:25:25.000
Das ist schon durchaus aktuell und auch aktuelle PHP-Version usw.

00:25:25.000 --> 00:25:27.000
Und habe das jetzt nochmal installiert.

00:25:27.000 --> 00:25:32.000
Das hat schon ein bisschen, ja, das Startprogramm,

00:25:32.000 --> 00:25:35.000
das heißt dann OSX irgendwas.

00:25:35.000 --> 00:25:37.000
Das ist ganz merkwürdig, das habe ich jetzt auch umbenannt,

00:25:37.000 --> 00:25:39.000
weil es mir auf den Keks geht.

00:25:39.000 --> 00:25:41.000
Egal, aber das funktioniert tatsächlich genauso,

00:25:41.000 --> 00:25:45.000
wie ich das unter Windows in Erinnerung hatte.

00:25:45.000 --> 00:25:48.000
Und das heißt, ich habe so ein kleines Fenster, das aufgeht

00:25:48.000 --> 00:25:50.000
und ich kann dann sagen, starte mit dem Server,

00:25:50.000 --> 00:25:52.000
starte PHP usw.

00:25:52.000 --> 00:25:54.000
Funktioniert auch soweit so gut.

00:25:54.000 --> 00:25:59.000
Aber was ich auch damals schon auf meinem Ubuntu immer haben wollte,

00:25:59.000 --> 00:26:02.000
war, ich will nicht meine Dateien irgendwo hinlegen,

00:26:02.000 --> 00:26:05.000
wo normalerweise der Server seine Dateien liegen hat,

00:26:05.000 --> 00:26:07.000
also irgendwo in irgendeinem Systemdings da,

00:26:07.000 --> 00:26:10.000
z.B. in den Docs oder sowas, sondern ich will eigentlich

00:26:10.000 --> 00:26:14.000
meine Dateien irgendwo in meinem Home-Folder liegen haben,

00:26:14.000 --> 00:26:17.000
weil meine Projekte einfach in meinem Home-Folder liegen,

00:26:17.000 --> 00:26:20.000
da wird alles gebackupt usw.

00:26:20.000 --> 00:26:23.000
Das heißt, man muss dem Ding das noch ein bisschen beibringen.

00:26:23.000 --> 00:26:26.000
Und ich will jetzt gar nicht in die tiefen Details gehen,

00:26:26.000 --> 00:26:29.000
da gibt es einfach, beim Apache gibt es sowas,

00:26:29.000 --> 00:26:35.000
das nennt sich User-Folder, glaube ich.

00:26:35.000 --> 00:26:39.000
User-Home-Directory, User-Dir, genau, User-Dir.

00:26:39.000 --> 00:26:42.000
Und dann kann man das auf ein anderes Verzeichnis setzen.

00:26:42.000 --> 00:26:45.000
Ich gehe jetzt nicht in die Details, wie man das einrichtet,

00:26:45.000 --> 00:26:47.000
aber das habe ich dann damit gemacht,

00:26:47.000 --> 00:26:50.000
das habe ich mir so aus verschiedenen Tutorials zusammengesucht,

00:26:50.000 --> 00:26:53.000
weil ich keins gefunden habe, dass genau das alles beschrieben hat,

00:26:53.000 --> 00:26:56.000
was ich wollte und darüber habe ich einen kleinen Blogartikel geschrieben,

00:26:56.000 --> 00:26:58.000
der kommt in die Show Notes, der heißt

00:26:58.000 --> 00:27:01.000
Setting up XAMPP on macOS Sonoma with local user folder.

00:27:01.000 --> 00:27:05.000
So viel gelabert, wenig Inhalt, wie es von uns gewohnt sei.

00:27:05.000 --> 00:27:10.000
Ihr kriegt bei uns immer, was wir euch nicht versprochen haben oder so.

00:27:10.000 --> 00:27:13.000
Keine Ahnung.

00:27:13.000 --> 00:27:18.000
Gut, ich habe vorhin schon gesagt, bei mir geht es um Chat-GPT

00:27:18.000 --> 00:27:22.000
und eigentlich darum, dass wir Chat-GPT loswerden wollten

00:27:22.000 --> 00:27:25.000
beziehungsweise mal was anderes ausprobieren wollten.

00:27:25.000 --> 00:27:29.000
Bei Chat-GPT, am Anfang war es super

00:27:29.000 --> 00:27:33.000
und dann zwischendrin wurde irgendwie so viel zensiert,

00:27:33.000 --> 00:27:37.000
weil oh, Copyright und AI übernimmt die Welt,

00:27:37.000 --> 00:27:40.000
dass dann die Antworten total katastrophal waren.

00:27:40.000 --> 00:27:42.000
Also Sachen, wo du ganz sicher weißt,

00:27:42.000 --> 00:27:45.000
das habe ich schon mal so in die Richtung eingegeben

00:27:45.000 --> 00:27:48.000
und da kam Code, den ich einfach benutzen konnte, der funktioniert hat,

00:27:48.000 --> 00:27:51.000
kam dann plötzlich A4-seitenweise gefühlt einfach nur Text,

00:27:51.000 --> 00:27:54.000
der dir das beschrieben hat, was du machen könntest.

00:27:54.000 --> 00:27:59.000
Das war zwischendurch wirklich kaum noch benutzbar.

00:27:59.000 --> 00:28:03.000
Dann kamen auch einfach wirklich falsche Sachen bei raus und so weiter.

00:28:03.000 --> 00:28:05.000
Da hat sich irgendwie viel getan und gewandelt

00:28:05.000 --> 00:28:09.000
und die Nützlichkeit war da sehr schwankend.

00:28:09.000 --> 00:28:12.000
Und auch jetzt ist es immer noch so,

00:28:12.000 --> 00:28:15.000
dass manchmal es sich so festfrisst irgendwie

00:28:15.000 --> 00:28:20.000
und dann partout nicht das macht, was du sagst, was es bitte machen soll.

00:28:20.000 --> 00:28:23.000
Das hat uns irgendwie genervt und dann dazu noch die ganzen Ausfälle,

00:28:23.000 --> 00:28:25.000
weil immer mal wieder plötzlich JetGPT hängt

00:28:25.000 --> 00:28:28.000
und dann auch immer gleich mal irgendwie für eine Viertelstunde, halbe Stunde

00:28:28.000 --> 00:28:30.000
und das ist halt in der täglichen Arbeit echt blöd.

00:28:30.000 --> 00:28:33.000
Und dann haben wir uns überlegt, gut, was gibt es sonst noch so?

00:28:33.000 --> 00:28:36.000
Und mein Bruder hat dann Cloud AI mal ausprobiert

00:28:36.000 --> 00:28:39.000
und hat gemeint, oh, das sieht eigentlich ganz gut aus,

00:28:39.000 --> 00:28:43.000
lass uns doch mal JetGPT, die Premium-Geschichte, die Subscription kündigen,

00:28:43.000 --> 00:28:47.000
weil geht ja monatlich, und stattdessen mal Cloud AI ausprobieren.

00:28:47.000 --> 00:28:51.000
Und dann haben wir das am Anfang erst mal gemacht mit der Nicht-Premium-Version

00:28:51.000 --> 00:28:55.000
und man muss sagen, das UI wirkt aufgeräumter,

00:28:55.000 --> 00:28:57.000
auch wenn es noch ein bisschen buggy ist.

00:28:57.000 --> 00:29:00.000
Also ich hab manchmal Probleme, Antwortteile einfach rauszukopieren,

00:29:00.000 --> 00:29:02.000
vor allem Code-Antworten.

00:29:02.000 --> 00:29:05.000
Im ganzen Block ist kein Problem, da ist so ein Copy-Button

00:29:05.000 --> 00:29:07.000
und der wandert auch mit beim Scrollen.

00:29:07.000 --> 00:29:10.000
Das ist so eine ganz kleine Feinheit im Unterschied zu JetGPT,

00:29:10.000 --> 00:29:14.000
aber es ist nervig, immer wieder hochscrollen zu müssen zu dem Code-Block.

00:29:14.000 --> 00:29:17.000
Und das war gleich schon mal so was so, ah cool, ich kann da runterscrollen

00:29:17.000 --> 00:29:21.000
zu der Erklärung und dann komm ich trotzdem so ...

00:29:21.000 --> 00:29:24.000
Was hat jetzt mein Ultraschall gemacht?

00:29:24.000 --> 00:29:26.000
Okay, ich dachte grad, die Aufnahme wär weg.

00:29:26.000 --> 00:29:28.000
Aber ist sie zum Glück noch da.

00:29:28.000 --> 00:29:30.000
Nö, bei mir läuft auf jeden Fall noch was.

00:29:30.000 --> 00:29:32.000
Ja, bei mir jetzt auch, das war nur irgendwie,

00:29:32.000 --> 00:29:34.000
hat sich's komisch hingescrollt, egal.

00:29:34.000 --> 00:29:36.000
Ähm, genau, also war's eine Kleinigkeit,

00:29:36.000 --> 00:29:40.000
aber wo man gleich schon mal dachte, ah cool, da haben sie gleich mitgedacht.

00:29:40.000 --> 00:29:42.000
Also insgesamt aufgeräumter.

00:29:42.000 --> 00:29:46.000
Und ich hab's dann, wir haben dann Premium mal abonniert

00:29:46.000 --> 00:29:48.000
für einen Monat jetzt zum Testen.

00:29:48.000 --> 00:29:51.000
Weil wir dachten, ähm, beziehungsweise festgestellt haben,

00:29:51.000 --> 00:29:55.000
okay, das Anfragenlimit ist relativ gering für so einen Arbeitstag.

00:29:55.000 --> 00:29:58.000
Also ich hatte das irgendwie nach einem Problem,

00:29:58.000 --> 00:30:00.000
das ich so hin und her geschrieben hab,

00:30:00.000 --> 00:30:02.000
war quasi schon sicher, deine Anfragen

00:30:02.000 --> 00:30:05.000
sind bis heute Nachmittag um drei irgendwie aufgebraucht.

00:30:05.000 --> 00:30:08.000
Also haben wir das jetzt mal, das Premium freigeschaltet

00:30:08.000 --> 00:30:10.000
und damit gearbeitet.

00:30:10.000 --> 00:30:14.000
Und ich hab dann auch JGPT und Clode.ai gegeneinander antreten lassen.

00:30:14.000 --> 00:30:17.000
Also wirklich genau das Gleiche gegeneinander machen lassen.

00:30:17.000 --> 00:30:19.000
Und da muss man sagen,

00:30:19.000 --> 00:30:23.000
JGPT versucht manchmal schon, so ein bisschen out of the box zu denken.

00:30:23.000 --> 00:30:26.000
Also es ging in dem Fall um WordPress und PHP.

00:30:26.000 --> 00:30:28.000
Und ich hab da geschrieben, was ich brauch.

00:30:28.000 --> 00:30:30.000
Und JGPT hat zum Beispiel dann gleich schon

00:30:30.000 --> 00:30:33.000
den JavaScript-Teil fürs Frontend auch schon mitgeliefert,

00:30:33.000 --> 00:30:36.000
obwohl ich danach gar nicht explizit gefragt hatte.

00:30:36.000 --> 00:30:38.000
Mir ging's erst mal nur ums Backend.

00:30:38.000 --> 00:30:41.000
Und das ist zwar irgendwie cool, dass das da weiter mitdenkt,

00:30:41.000 --> 00:30:43.000
aber auf der anderen Seite hatte ich explizit

00:30:43.000 --> 00:30:45.000
nur nach dem Backend gefragt.

00:30:45.000 --> 00:30:48.000
Und die JGPT-Antwort war dadurch einfach total aufgebläht.

00:30:48.000 --> 00:30:51.000
Also da war viel mehr drin, als ich eigentlich brauchte.

00:30:51.000 --> 00:30:53.000
Und es war schwierig, dann rauszusuchen,

00:30:53.000 --> 00:30:56.000
so was ist jetzt für mich grade das Wichtige und was nicht.

00:30:56.000 --> 00:30:58.000
Und dann hab ich festgestellt,

00:30:58.000 --> 00:31:03.000
Clode.ai macht vieles am Anfang richtiger

00:31:03.000 --> 00:31:07.000
oder, sagen wir mal, zielgerichteter, brauchbarer.

00:31:07.000 --> 00:31:10.000
Aber es verrennt sich dann teilweise

00:31:10.000 --> 00:31:13.000
in den gleichen Details wie JGPT auch.

00:31:13.000 --> 00:31:16.000
Also so dieses, du sagst dann, mach das,

00:31:16.000 --> 00:31:18.000
und es macht dann trotzdem das Gegenteil

00:31:18.000 --> 00:31:20.000
und berücksichtigt bestimmte Dinge nicht,

00:31:20.000 --> 00:31:22.000
die du vorher eigentlich schon gesagt hast,

00:31:22.000 --> 00:31:24.000
und so passiert da genauso.

00:31:24.000 --> 00:31:26.000
Also ich kann jetzt gar nicht sagen,

00:31:26.000 --> 00:31:29.000
es ist deutlich besser oder JGPT ist deutlich besser.

00:31:29.000 --> 00:31:32.000
Es hält sich, glaub ich, so ungefähr die Waage.

00:31:32.000 --> 00:31:35.000
Was jetzt aber für mich total der Dealbreaker war,

00:31:35.000 --> 00:31:38.000
dass ich heute dann beim Arbeiten so gegen Nachmittag,

00:31:38.000 --> 00:31:41.000
Spätnachmittag, plötzlich die Meldung wieder erhalten hab,

00:31:41.000 --> 00:31:43.000
deine Anfragen sind aufgebraucht.

00:31:43.000 --> 00:31:46.000
Und dann hab ich gesagt, das kann doch nicht sein.

00:31:46.000 --> 00:31:49.000
Also es war vorher schon an einer anderen Stelle so,

00:31:49.000 --> 00:31:52.000
dass das Frontend noch nicht mitbekommen hatte,

00:31:52.000 --> 00:31:54.000
dass wir Premium-Subscription gemacht haben.

00:31:54.000 --> 00:31:56.000
Und ich hab dann bekommen,

00:31:56.000 --> 00:31:59.000
so ja, die maximale Länge der Konversation ist erreicht.

00:31:59.000 --> 00:32:01.000
Dann hab ich aber neu geladen

00:32:01.000 --> 00:32:04.000
und konnte dann trotzdem die Konversation fortsetzen.

00:32:04.000 --> 00:32:07.000
Und dann kam die Zeit auf, wo das nicht gerafft hat,

00:32:07.000 --> 00:32:09.000
dass wir jetzt halt Premium haben.

00:32:09.000 --> 00:32:11.000
Und dann dacht ich, ist das jetzt wieder so?

00:32:11.000 --> 00:32:13.000
Aber neu geladen, neu geladen.

00:32:13.000 --> 00:32:15.000
Und dann haben wir mal recherchiert.

00:32:15.000 --> 00:32:17.000
Und es ist tatsächlich so,

00:32:17.000 --> 00:32:20.000
dass Premium fünfmal so viele Anfragen zulässt,

00:32:20.000 --> 00:32:22.000
wie die Nicht-Premium-Version.

00:32:22.000 --> 00:32:24.000
Was kostet's?

00:32:24.000 --> 00:32:26.000
Ich glaub, das sind 20 Euro im Monat.

00:32:26.000 --> 00:32:28.000
Und es ist halt ...

00:32:28.000 --> 00:32:30.000
Gut, wir haben zu zweit dran gearbeitet,

00:32:30.000 --> 00:32:33.000
aber mein Bruder hat jetzt nicht so viel gemacht heute.

00:32:33.000 --> 00:32:36.000
Und wenn das für mich nicht für einen Arbeitstag reicht ...

00:32:36.000 --> 00:32:39.000
Ich hab's zwar schon sehr intensiv heute genutzt,

00:32:39.000 --> 00:32:41.000
aber dann ist es irgendwo lächerlich.

00:32:41.000 --> 00:32:44.000
Und dieses Limit haben wir bei Chat-GPT noch nie gesprengt.

00:32:44.000 --> 00:32:48.000
Weiß nicht, ob's da eins gibt überhaupt bei Premium oder nicht.

00:32:48.000 --> 00:32:51.000
Aber jedenfalls fand ich das also wirklich ein No-Go.

00:32:51.000 --> 00:32:53.000
Und da müssen die auf jeden Fall nachlegen,

00:32:53.000 --> 00:32:56.000
weil sonst ist das für uns einfach nicht nutzbar.

00:32:56.000 --> 00:32:59.000
Genau. Und das war's eigentlich schon dazu.

00:32:59.000 --> 00:33:01.000
Ich hab noch eine Frage.

00:33:01.000 --> 00:33:05.000
Ob du weißt, was sich denn dahinter verbirgt?

00:33:05.000 --> 00:33:07.000
Also, haben die ein eigenes Model?

00:33:07.000 --> 00:33:09.000
Ist ein eigenes Model, ja.

00:33:09.000 --> 00:33:11.000
Es gibt auch verschiedene zur Auswahl.

00:33:11.000 --> 00:33:14.000
Ist das auf irgendeinem Open-Source, was man kennt?

00:33:14.000 --> 00:33:16.000
Das kann ich dir gar nicht sagen.

00:33:16.000 --> 00:33:19.000
So genau hab ich mich damit noch gar nicht beschäftigt.

00:33:19.000 --> 00:33:22.000
Ich hab einfach nur gedacht, wir probieren das mal aus.

00:33:22.000 --> 00:33:26.000
Es trainiert ja jetzt nicht mal so eben jeder sein Large-Language-Model,

00:33:26.000 --> 00:33:28.000
dass das dann auch vernünftig funktioniert.

00:33:28.000 --> 00:33:30.000
Das wollen wir mal irgendwie rausfinden.

00:33:30.000 --> 00:33:33.000
Wir benutzen das jetzt auch als Zeit dieser Woche.

00:33:33.000 --> 00:33:36.000
Es gibt CLOUD 3.5, CLOUD 3.0 Opus, CLOUD 3.0 HLQ,

00:33:36.000 --> 00:33:38.000
Fastest Model for Daily Tasks,

00:33:38.000 --> 00:33:42.000
Accelerated Writing and Complex Tasks, Most Intelligent Model.

00:33:42.000 --> 00:33:46.000
Ah, warte mal. Ich geh grad so mal zu Wikipedia.

00:33:46.000 --> 00:33:49.000
Es ist a Family of Large-Language-Models

00:33:49.000 --> 00:33:51.000
developed by Anthropic.

00:33:51.000 --> 00:33:54.000
Also wohl doch selber trainieren.

00:33:54.000 --> 00:33:58.000
Oder Anthropic ... na ja.

00:33:58.000 --> 00:34:01.000
Generative Pretrained Transformers. Okay, mhm.

00:34:01.000 --> 00:34:04.000
Das ist einer der wenigen Player, würd ich sagen.

00:34:04.000 --> 00:34:08.000
Es gibt, glaub ich, nicht so viele, die so was ...

00:34:08.000 --> 00:34:13.000
die wirklich selbst was komplett selbst basteln.

00:34:13.000 --> 00:34:16.000
Okay. Interessant. Also, das kannte ich noch gar nicht.

00:34:16.000 --> 00:34:18.000
Also, lohnt sich auf jeden Fall mal.

00:34:18.000 --> 00:34:21.000
Jetzt will ich's auch gar nicht ausprobieren.

00:34:21.000 --> 00:34:24.000
Ich hab's grad versucht, aber dann musste ich ...

00:34:24.000 --> 00:34:27.000
Das wollte dann sofort meine Handynummer haben,

00:34:27.000 --> 00:34:30.000
und dann hab ich mir gedacht, weiß ich nicht, Digga.

00:34:30.000 --> 00:34:34.000
Also, ich würde sagen, es lohnt sich schon, das mal auszuprobieren.

00:34:34.000 --> 00:34:37.000
Auch wirklich grad im direkten Vergleich zu gucken,

00:34:37.000 --> 00:34:40.000
oh, okay, das war jetzt tatsächlich besser als JGPD,

00:34:40.000 --> 00:34:42.000
oder da haben sie die gleichen Probleme,

00:34:42.000 --> 00:34:45.000
oder vielleicht ist es sogar schlechter in manchen Belangen.

00:34:45.000 --> 00:34:48.000
Und wenn man die Kohle hat, kann man natürlich auch sagen,

00:34:48.000 --> 00:34:52.000
da ist ein weiterer Anbieter, der so ein bisschen diese Monopolstellung

00:34:52.000 --> 00:34:55.000
von JGPD, was ja in aller Munde war, so ein bisschen aufbricht.

00:34:55.000 --> 00:34:58.000
Und das ist ja auch immer gut, belebt das Geschäft,

00:34:58.000 --> 00:35:00.000
wenn's da ein bisschen Konkurrenz gibt.

00:35:00.000 --> 00:35:03.000
Genau. Wir foreshadowen schon das Geil-Teil, by the way.

00:35:03.000 --> 00:35:05.000
Ja, ja, ja, stimmt, stimmt.

00:35:05.000 --> 00:35:07.000
Gut.

00:35:07.000 --> 00:35:10.000
Genau. Wenn ihr AI blöd findet, dann ...

00:35:10.000 --> 00:35:13.000
na ja, dann ist das so.

00:35:13.000 --> 00:35:14.000
Genau. Pech.

00:35:14.000 --> 00:35:17.000
Dann tut's mir ein bisschen leid.

00:35:18.000 --> 00:35:19.000
Ähm, okay.

00:35:19.000 --> 00:35:23.000
Aus der Reihe Blogartikel, die ich geschrieben hab,

00:35:23.000 --> 00:35:26.000
seit der letzten Podcast-Folge, kam noch was.

00:35:26.000 --> 00:35:28.000
Wir haben vorhin schon drüber geredet,

00:35:28.000 --> 00:35:32.000
ob man das jetzt noch macht oder ob wir jetzt darüber reden oder nicht.

00:35:32.000 --> 00:35:37.000
Und zwar war es so, dass ich irgendwie noch mal das Bedürfnis hatte,

00:35:37.000 --> 00:35:39.000
Menschen RSS-Feeds näherzubringen.

00:35:39.000 --> 00:35:41.000
Und ich glaube, es ist leider natürlich,

00:35:41.000 --> 00:35:43.000
wenn ich was in meinem Blog schreibe,

00:35:43.000 --> 00:35:45.000
ist es mehr so Preaching to the Choir.

00:35:45.000 --> 00:35:50.000
Also, das heißt, ich schreib da so was, wo dann Leute sagen, jawoll, super,

00:35:50.000 --> 00:35:53.000
die aber eh schon überzeugt waren von der ganzen Sache.

00:35:53.000 --> 00:35:55.000
Und zwar RSS-Feeds.

00:35:55.000 --> 00:35:57.000
Ähm, genau.

00:35:57.000 --> 00:35:59.000
Ich wollte einfach noch mal erklären,

00:35:59.000 --> 00:36:02.000
wie funktionieren RSS-Feeds so grob für Menschen,

00:36:02.000 --> 00:36:05.000
die damit noch nicht in Berührung gekommen sind,

00:36:05.000 --> 00:36:07.000
weil's mich einfach unglaublich ankotzt,

00:36:07.000 --> 00:36:11.000
dass alle nur von Algorithmen irgendwie ihren Kram sortiert bekommen im Netz.

00:36:11.000 --> 00:36:12.000
Und das muss nicht sein.

00:36:12.000 --> 00:36:17.000
Und es gibt schon so lange eine Technologie dafür, um News zu empfangen,

00:36:17.000 --> 00:36:21.000
wo kein Algorithmus mir reinpfuscht oder sagt in der Reihenfolge,

00:36:21.000 --> 00:36:25.000
oder ich jubel dir übrigens noch diese Werbung jetzt mal unter,

00:36:25.000 --> 00:36:27.000
weil ich das jetzt grad super finde.

00:36:27.000 --> 00:36:30.000
Oder vor allem Pushen von extremistischem Content,

00:36:30.000 --> 00:36:34.000
das ist das, was mich eigentlich am meisten nervt an den Algorithmen.

00:36:34.000 --> 00:36:37.000
Es wird ja extremistischer Content gepusht ohne Ende.

00:36:37.000 --> 00:36:40.000
Also, ich hab's ja auch schon öfter mal drüber.

00:36:40.000 --> 00:36:46.000
Über TikTok und über Instagram-Reels und auch die YouTube-Startseite.

00:36:46.000 --> 00:36:48.000
Ich kann es wirklich reproduzierbar,

00:36:48.000 --> 00:36:51.000
wir können es gerne im Stream mal machen oder so,

00:36:51.000 --> 00:36:53.000
ich kann es reproduzierbar zeigen.

00:36:53.000 --> 00:36:57.000
Ich geh in ein neues Browser-Profil, starte eins von diesen Dingern,

00:36:57.000 --> 00:37:00.000
und es dauert irgendwie drei Empfehlungen,

00:37:00.000 --> 00:37:03.000
und dann kommt der erste extremistische Scheiß,

00:37:03.000 --> 00:37:08.000
der mir sagen will, dass Ausländer umbringen doch irgendwie eine super Idee ist

00:37:08.000 --> 00:37:10.000
oder dass die AfD die beste Partei ist.

00:37:10.000 --> 00:37:14.000
Übrigens, falls ihr so was, solches Gedankengut in euch habt,

00:37:14.000 --> 00:37:17.000
dann brauch ich euch hier nicht als Zuhörende.

00:37:17.000 --> 00:37:19.000
Tschüss, tschüss, das war's.

00:37:19.000 --> 00:37:22.000
Diese Folge ist jetzt hier für euch vorbei,

00:37:22.000 --> 00:37:24.000
für alle anderen dürfen weiterhören.

00:37:24.000 --> 00:37:28.000
Ähm, genau, also Content, um den Bogen noch mal zu kriegen,

00:37:28.000 --> 00:37:31.000
Content, der nicht von irgendwas gefiltert wird,

00:37:31.000 --> 00:37:36.000
der, wo ich selbst bestimme, was für Newsquellen ich anzapfe,

00:37:36.000 --> 00:37:41.000
ähm, und niemand, und einfach die Reihenfolge einfach,

00:37:41.000 --> 00:37:43.000
die Chronologie ist der Artikel.

00:37:43.000 --> 00:37:49.000
So, und das, das leistet RSS, oder das leisten Feeds schon seit über 20 Jahren,

00:37:49.000 --> 00:37:53.000
und irgendwie ist es, irgendwie ist es, sind die, sind die aus der Mode gekommen,

00:37:53.000 --> 00:37:56.000
das macht irgendwie keiner mehr, Leute sagen, es gibt ja auch,

00:37:56.000 --> 00:37:59.000
gibt ja auch Leute, die sagen, ich konsumiere so viel News,

00:37:59.000 --> 00:38:01.000
ohne Algorithmus kann ich dem nicht Herr werden.

00:38:01.000 --> 00:38:04.000
Kann ich nachvollziehen, aber dann würde ich einen Algorithmus,

00:38:04.000 --> 00:38:07.000
also, ich kann das nachvollziehen, dass man einen gern hätte,

00:38:07.000 --> 00:38:10.000
aber dann möchte ich einen, wo ich nachvollziehen kann, was er tut.

00:38:10.000 --> 00:38:13.000
Also, dass er vielleicht irgendwie ein Popularitätsranking macht,

00:38:13.000 --> 00:38:16.000
so und so viele Leute lesen das, ähm, aus den Newsquellen,

00:38:16.000 --> 00:38:19.000
die du ausgewählt hast, aber ich krieg da nix reingespült,

00:38:19.000 --> 00:38:21.000
was ich nie haben wollte oder so, naja.

00:38:21.000 --> 00:38:23.000
Das machen ja die Algorithmen eigentlich auch,

00:38:23.000 --> 00:38:25.000
nur wenn du halt ein neues Profil anlegst,

00:38:25.000 --> 00:38:28.000
dann hat der Algorithmus noch nix, worauf er sich verlassen kann,

00:38:28.000 --> 00:38:31.000
und dann spielt er dir halt mal alles aus allen Ecken aus

00:38:31.000 --> 00:38:33.000
und guckt, worauf du am meisten reagierst.

00:38:33.000 --> 00:38:35.500
Das Problem mit journalistischen Inhalten ist halt,

00:38:35.500 --> 00:38:37.500
dass du ja vielleicht auch drauf reagierst

00:38:37.500 --> 00:38:40.500
und in die Kommentare schreibst, wie scheiße du das findest.

00:38:40.500 --> 00:38:43.500
Das Problem ist nur, dass der Algorithmus das nicht auswertet,

00:38:43.500 --> 00:38:46.000
sondern der Algorithmus sieht nur, oh, Interaction,

00:38:46.000 --> 00:38:48.500
das findet er wohl gut, da zeig ich mehr davon.

00:38:48.500 --> 00:38:50.500
Fantastisch. Na ja, also der Artikel.

00:38:50.500 --> 00:38:54.000
Eine kleine Erklärung, was RSS ist, was es heißt, wie es funktioniert,

00:38:54.000 --> 00:38:56.500
wie man, was für Tools man dafür verwenden kann,

00:38:56.500 --> 00:39:00.000
ähm, wie man Feeds finden kann auf Webseiten,

00:39:00.000 --> 00:39:03.500
äh, wie man subscriben kann, was für Vorteile es hat.

00:39:03.500 --> 00:39:07.000
Und, ähm, warte mal, hab ich das eigentlich in dem Artikel mit drin?

00:39:07.000 --> 00:39:09.500
Ah ja, genau. Und noch eine kleine Empfehlung,

00:39:09.500 --> 00:39:12.000
was, was ich auch noch gar nicht so lange kenne.

00:39:12.000 --> 00:39:15.000
Ähm, wenn's Seiten gibt, die kein RSS-Feed anbieten,

00:39:15.000 --> 00:39:21.500
dann kann man sich eventuell von rss.app einbauen lassen von der Seite.

00:39:21.500 --> 00:39:23.000
Selbst wenn's keine ...

00:39:23.000 --> 00:39:26.000
Also, die versuchen dann quasi mit irgendwelcher Magie

00:39:26.000 --> 00:39:30.000
einen RSS-Feed, äh, dir zu generieren aus den Inhalten,

00:39:30.000 --> 00:39:32.000
ähm, ohne dass es einen gibt.

00:39:32.000 --> 00:39:35.500
Das kann ich hier vielleicht noch mal an der Stelle empfehlen.

00:39:35.500 --> 00:39:40.000
Genau, das war der zweite Artikel, den ich da, den ich da geschrieben hab.

00:39:40.000 --> 00:39:41.500
So.

00:39:41.500 --> 00:39:44.000
Du brauchst mir das auch noch nicht schonen, oder?

00:39:44.000 --> 00:39:46.500
Und, äh, wobei, ich hab das nur einmal kurz getestet.

00:39:46.500 --> 00:39:48.500
Das ist jetzt keine super Empfehlung,

00:39:48.500 --> 00:39:51.000
sondern das ist nur so ein, äh, manche Seiten,

00:39:51.000 --> 00:39:54.000
die man, die man haben will, äh, haben, haben kein Feed.

00:39:54.000 --> 00:39:58.000
Äh, ich hab sogar Feeds gefunden von Zeit.de,

00:39:58.000 --> 00:40:01.000
obwohl die offiziell, glaub ich, nirgends mehr verlinkt sind.

00:40:01.000 --> 00:40:02.000
Mhm.

00:40:02.000 --> 00:40:05.500
Ähm, sie funktionieren aber, und sie sind nach Ressorts aufgelistet,

00:40:05.500 --> 00:40:07.000
und das ist sehr, sehr gut.

00:40:07.000 --> 00:40:08.000
Ja.

00:40:08.000 --> 00:40:11.500
Bei einem, bei einem großen, bei einer großen, äh, Zeitung kann man,

00:40:11.500 --> 00:40:15.000
möchte man vielleicht nicht alles in einem großen Feed drin haben.

00:40:15.000 --> 00:40:16.000
Ja.

00:40:16.000 --> 00:40:19.500
Sondern man möchte sagen, na ja, ich hätt gern ein Politik-Ressort,

00:40:19.500 --> 00:40:22.500
und ich hätt gern, Sport interessiert mich zum Beispiel nicht,

00:40:22.500 --> 00:40:25.000
und da kommt ja dann schon relativ viel rein, genau.

00:40:25.000 --> 00:40:26.000
Ja, cool.

00:40:26.000 --> 00:40:28.500
Ja, also, äh, dieser Artikel, den könnt ihr,

00:40:28.500 --> 00:40:31.000
ist auch ganz kurzweilig, ganz schnell, ähm,

00:40:31.000 --> 00:40:35.000
falls ihr nicht wisst, was RSS ist oder mal es ausprobieren wollt,

00:40:35.000 --> 00:40:37.000
ähm, dann lest euch den mal durch,

00:40:37.000 --> 00:40:41.000
äh, installiert den Feed-Reader, euer Wahl, und, äh, los geht's.

00:40:41.000 --> 00:40:45.000
Ja, unser Podcast ist ja übrigens auch über ein Feed, äh, verbunden.

00:40:45.000 --> 00:40:49.500
Ähm, mit, mit allen möglichen, äh, Seiten, äh, Podcast-Seiten, wo ...

00:40:49.500 --> 00:40:53.000
Also, es ist ja dieselbe Technologie, die da für verwendet wird.

00:40:53.000 --> 00:40:54.500
Also, das ist es einfach.

00:40:54.500 --> 00:40:56.500
Das ist es einfach, so.

00:40:56.500 --> 00:40:59.500
Ähm, und speaking of Sachen, die ich gemacht hab,

00:40:59.500 --> 00:41:02.000
ich hab heute noch was gemacht, spontan.

00:41:02.000 --> 00:41:06.000
Ähm, und zwar hab ich mir überlegt, äh,

00:41:06.000 --> 00:41:11.000
was für andere Möglichkeiten, was für andere Präsentationsformen

00:41:11.000 --> 00:41:13.000
für meinen Accessibility-Cheat-Sheet,

00:41:13.000 --> 00:41:15.000
das immer noch relativ beliebt ist,

00:41:15.000 --> 00:41:18.500
ich seh's an den Aufrufzahlen jetzt seit über sechs Jahren, ähm,

00:41:18.500 --> 00:41:19.500
gäb es denn noch?

00:41:19.500 --> 00:41:23.500
Und dann dacht ich mir, äh, als Poster wär das vielleicht auch nicht schlecht.

00:41:23.500 --> 00:41:26.500
Man könnte das auch sich als Poster irgendwo hinhängen.

00:41:26.500 --> 00:41:30.000
Und, äh, da ich, in Ermangelung eines eigenen Shops von Spreadshirt,

00:41:30.000 --> 00:41:32.000
mach ich so was jetzt immer in den, äh,

00:41:32.000 --> 00:41:34.500
in den Wo-Wir-Sind-Es-Vorne-Shop einfach mit rein.

00:41:34.500 --> 00:41:38.500
Weil der Spread, bei Spreadshirt kann man auch, äh, Poster bestellen.

00:41:38.500 --> 00:41:42.000
Und das hab ich jetzt einfach mal ein bisschen aufbereitet für ...

00:41:42.000 --> 00:41:46.000
Ihr seht irgendwie, die Qualität ist echt mies von den Vorschau-Bildern.

00:41:46.000 --> 00:41:50.000
Ich kann euch versprechen, äh, ich hab's in hoher Qualität eingeliefert.

00:41:50.000 --> 00:41:52.000
Ähm, wenn's schlecht gedruckt wird,

00:41:52.000 --> 00:41:54.500
dann zurückschicken und mir Bescheid sagen.

00:41:54.500 --> 00:41:57.500
Äh, auf jeden Fall gibt es mein Accessibility-Cheat-Sheet

00:41:57.500 --> 00:42:01.000
so für, äh, zum an die Wand hängen, jetzt als Poster zum Bestellen.

00:42:01.000 --> 00:42:03.000
Äh, Link kommt auch in die Shownotes.

00:42:03.000 --> 00:42:07.000
Äh, ja, dacht ich mir, wär doch irgendwie noch eine nette Sache, ähm,

00:42:07.000 --> 00:42:10.000
bis ich dann irgendwann, das erzähl ich dir im Nachgang noch,

00:42:10.000 --> 00:42:13.000
irgendwann, es gibt, es gibt noch, es gibt noch was,

00:42:13.000 --> 00:42:15.000
was ich mir vorstellen würde an Design,

00:42:15.000 --> 00:42:18.000
was in so eine Richtung geht, was man sich aufhängen könnte.

00:42:18.000 --> 00:42:21.000
Ähm, aber ich bin noch nicht dazu gekommen seit acht Jahren.

00:42:21.000 --> 00:42:22.000
Von daher ...

00:42:22.000 --> 00:42:25.000
Aber ich will mal bei dir abfragen, ob du es cool findest.

00:42:25.000 --> 00:42:26.500
Okay. Bin ich gespannt.

00:42:26.500 --> 00:42:28.500
Ähm, müssen wir mal, müssen wir mal.

00:42:28.500 --> 00:42:31.000
Aber das kann ich jetzt noch nicht so sagen,

00:42:31.000 --> 00:42:34.000
sonst macht's jemand anderes vor mir und das will ich nicht.

00:42:34.000 --> 00:42:36.000
So, retrofertig von meiner Seite aus.

00:42:36.000 --> 00:42:39.000
Ja, die wird vielleicht, vielleicht länger als das Thema,

00:42:39.000 --> 00:42:40.000
gucken wir mal.

00:42:40.000 --> 00:42:41.000
Ach was, nein.

00:42:41.000 --> 00:42:43.000
Das ist die Property der Woche.

00:42:43.000 --> 00:42:45.500
But first.

00:42:45.500 --> 00:42:49.000
Genau, aber jetzt kommt erst mal noch die Property der Woche.

00:42:49.000 --> 00:42:52.500
Ups, nein, ich will nicht alle laufenden Recordings stoppen.

00:42:52.500 --> 00:42:53.500
Danke.

00:42:53.500 --> 00:42:54.500
Ähm ...

00:42:54.500 --> 00:42:57.500
Falsche, er hat einmal die falsche Taste gedrückt.

00:42:57.500 --> 00:43:01.000
Ähm, genau, es gibt mal wieder eine Property der Woche.

00:43:01.000 --> 00:43:07.000
Und zwar ist das diesmal Element.scrollIntoViewIfNeeded.

00:43:07.000 --> 00:43:09.500
Da bin ich heute über die Konsole rausgekommen.

00:43:09.500 --> 00:43:12.000
Also das Scroll-Interview, das kannte ich schon,

00:43:12.000 --> 00:43:14.500
aber wer es noch nicht kennt, damit kann ich,

00:43:14.500 --> 00:43:17.500
wie der Name sagt, sehr sprechender Methodenname,

00:43:17.500 --> 00:43:21.500
super, ein Element in die, in den Viewport-Bereich,

00:43:21.500 --> 00:43:24.000
in den aktuellen, reinscrollen lassen.

00:43:24.000 --> 00:43:27.000
Und ich kann dann sogar über ein Optionsobjekt

00:43:27.000 --> 00:43:30.500
mit Behavior Doppelpunkt Smooth sagen,

00:43:30.500 --> 00:43:33.500
dass das Scrollen so animiert laufen soll

00:43:33.500 --> 00:43:35.500
und nicht einfach nur hinspringen soll.

00:43:35.500 --> 00:43:39.000
Das ist eigentlich echt ganz cool, das hab ich da intensiv genutzt.

00:43:39.000 --> 00:43:40.500
Ich hatte diese Buchungsbox,

00:43:40.500 --> 00:43:43.000
und je nachdem, da kommen erst mal die Ergebnisse,

00:43:43.000 --> 00:43:46.000
und dann wählt man die aus, und dann kommt ein Formular.

00:43:46.000 --> 00:43:49.000
Und dann hab ich halt, das wird dann immer so kleiner,

00:43:49.000 --> 00:43:51.500
und damit das dann aber auch ausgerichtet ist,

00:43:51.500 --> 00:43:55.000
weil da kann natürlich viel oder wenig drin sein, das weiß ich nie,

00:43:55.000 --> 00:43:57.500
scroll ich danach, warte ich mit AnimationEnd,

00:43:57.500 --> 00:44:01.000
beziehungsweise TransitionEnd in dem Fall, mit dem EventListener,

00:44:01.000 --> 00:44:04.000
bis das fertig ist, und dann lass ich da hinscrollen.

00:44:04.000 --> 00:44:06.500
Und dann hab ich in der Konsole was ausprobiert,

00:44:06.500 --> 00:44:08.000
und das kannte ich noch nicht.

00:44:08.000 --> 00:44:10.500
Und ich hatte auch tatsächlich schon den Fall,

00:44:10.500 --> 00:44:14.000
dass es manchmal so wegen ein paar Pixeln da rumgesprungen ist,

00:44:14.000 --> 00:44:17.000
obwohl eigentlich das Element sichtbar war,

00:44:17.000 --> 00:44:21.000
aber halt irgendwie wegen dem ScrollMargin oder warum auch immer

00:44:21.000 --> 00:44:24.000
dann trotzdem meinte, es muss da noch mal hinscrollen.

00:44:24.000 --> 00:44:27.000
Und dann hab ich das gesehen, dachte, ja, ist ja cool,

00:44:27.000 --> 00:44:28.500
aber wie ist denn da die ...

00:44:28.500 --> 00:44:31.000
Weil da kommt gleich auf der NDN-Seite oben,

00:44:31.000 --> 00:44:32.500
rote Box, non-standard,

00:44:32.500 --> 00:44:35.500
und hier wird nicht für alle funktionieren und so.

00:44:35.500 --> 00:44:38.500
Und dann hab ich mal geguckt, can I use?

00:44:38.500 --> 00:44:42.500
Und außer Firefox, je, da brauchen wir jetzt gar nicht von reden,

00:44:42.500 --> 00:44:45.500
können das aber eigentlich alle und auch schon sehr lange,

00:44:45.500 --> 00:44:47.500
also Safari seit 2011, Edge seit ...

00:44:47.500 --> 00:44:52.000
Äh, Edge natürlich erst seit es Edge auf Chromium-Basis gibt,

00:44:52.000 --> 00:44:56.500
aber Chrome mindestens auch seit 2011,

00:44:56.500 --> 00:44:59.500
Support Unknown für Chrome unter 15,

00:44:59.500 --> 00:45:01.500
aber also wirklich sehr lange.

00:45:01.500 --> 00:45:04.000
Hier Android-Browser 2.3 ab seit 2010.

00:45:04.000 --> 00:45:08.000
Und ich kannte das noch nicht, weil's wahrscheinlich kein Standard ist

00:45:08.000 --> 00:45:12.000
und man es dementsprechend nicht so häufig irgendwo findet in Antworten.

00:45:12.000 --> 00:45:15.000
Aber fand ich ganz cool und hab mir dann nur gedacht,

00:45:15.000 --> 00:45:18.000
na ja, gut, Firefox komplett ignorieren ist auch blöd.

00:45:18.000 --> 00:45:21.000
Man könnte natürlich sagen, okay, wenn die Funktion

00:45:21.000 --> 00:45:23.000
ScrollIntoViewIfNeeded existiert,

00:45:23.000 --> 00:45:26.000
dann nimm die, ansonsten nimm das normale ScrollIntoView.

00:45:26.000 --> 00:45:29.000
Ähm, aber vielleicht gibt's noch andere Möglichkeiten.

00:45:29.000 --> 00:45:33.000
Dann bin ich gekommen auf element.checkVisibility.

00:45:33.000 --> 00:45:36.000
Aber auch das ist kein geeigneter Workaround,

00:45:36.000 --> 00:45:38.000
weil checkVisibility überprüft nur,

00:45:38.000 --> 00:45:40.000
ob das Element theoretisch sichtbar ist.

00:45:40.000 --> 00:45:42.000
Aber nicht, ob's im Viewport ist.

00:45:42.000 --> 00:45:44.000
Aber nicht, ob's im Viewport ist, genau.

00:45:44.000 --> 00:45:48.000
Also ist es nicht, ähm, äh, hat es einen Container,

00:45:48.000 --> 00:45:51.000
der irgendwo auf Display nah ist oder so, also ist es ...

00:45:51.000 --> 00:45:54.000
Genau, ist das Element theoretisch ein sichtbares Element,

00:45:54.000 --> 00:45:57.000
unabhängig des Viewports? Deswegen geht das auch nicht.

00:45:57.000 --> 00:46:00.000
Was man stattdessen benutzen kann, ist getBoundingClientRect,

00:46:00.000 --> 00:46:03.000
weil die Unterstützung ist ja schon recht gut mittlerweile.

00:46:03.000 --> 00:46:05.000
Und zumindest auch im Firefox.

00:46:05.000 --> 00:46:08.000
Und dann halt überprüfen, ob es innerhalb des Rahmens

00:46:08.000 --> 00:46:12.000
von WindowInnerHeight und WindowInnerWidth liegt.

00:46:12.000 --> 00:46:15.000
Aber, ähm, also ein bisschen schade,

00:46:15.000 --> 00:46:19.000
dass Firefox da nicht mitzieht, obwohl's das jetzt schon seit,

00:46:19.000 --> 00:46:22.000
was hab ich gesagt, 2010 war, glaub ich, das Älteste,

00:46:22.000 --> 00:46:25.000
also jetzt 14 Jahre schon gibt und das nicht adaptiert hat.

00:46:25.000 --> 00:46:27.000
Aber gut, das ist eben kein Standard

00:46:27.000 --> 00:46:29.000
und so ist das mit nicht-standardisierten Sachen.

00:46:29.000 --> 00:46:32.000
Ähm, die werden dann halt entweder adaptiert oder nicht.

00:46:32.000 --> 00:46:35.000
Und in dem Fall ist es leider im Firefox nicht.

00:46:35.000 --> 00:46:37.000
Aber wie gesagt, mit dem Workaround,

00:46:37.000 --> 00:46:40.000
dass man ja das normale ScrollInterview benutzen kann,

00:46:40.000 --> 00:46:42.000
ähm, und das jetzt nicht dramatisch ist,

00:46:42.000 --> 00:46:44.000
wenn das halt dann trotzdem scrollt,

00:46:44.000 --> 00:46:47.000
sondern nur halt eigentlich so eine kosmetische Sache.

00:46:47.000 --> 00:46:50.000
Ähm, ja, find ich das eigentlich eine ganz coole Sache.

00:46:50.000 --> 00:46:53.000
ScrollInterview an sich ist auch schon cool, find ich.

00:46:53.000 --> 00:46:56.000
Das ist so ein nettes Feature. Als ich das entdeckt hab,

00:46:56.000 --> 00:46:59.000
hab ich mich gewundert, dass es so was Cooles überhaupt gibt.

00:46:59.000 --> 00:47:01.000
Weil normalerweise dachte ich immer so,

00:47:01.000 --> 00:47:04.000
so was muss man doch immer selbst von Hand klöppeln,

00:47:04.000 --> 00:47:07.000
wenn man's haben will. Weil's so ein bisschen Magie mitbringt.

00:47:07.000 --> 00:47:11.000
Ich erinnere mich an Zeiten, und das muss also vor 2010 gewesen sein,

00:47:11.000 --> 00:47:14.000
wo man das noch gemacht hat. Man hat geguckt, wo ist das?

00:47:14.000 --> 00:47:17.000
Und da gab's halt auch noch kein Get Bounding Client.

00:47:17.000 --> 00:47:21.000
Ich würde tippen, dass ich's vor vier Jahren oder so entdeckt hab

00:47:21.000 --> 00:47:25.000
und dann mal eingebaut hab und dann auch total mich drüber gefreut hab,

00:47:25.000 --> 00:47:27.000
dass es die Animation dafür gibt.

00:47:27.000 --> 00:47:31.000
Dass es nicht einfach hinspringt, sondern dass es wirklich scrollt.

00:47:31.000 --> 00:47:33.000
Weil das kann echt nützlich sein.

00:47:33.000 --> 00:47:35.000
Und das hat man halt echt früher, ne?

00:47:35.000 --> 00:47:38.000
Du musstest gucken, wo liegt dieses Element genau?

00:47:38.000 --> 00:47:40.000
Das war dann wirklich gar nicht so einfach.

00:47:40.000 --> 00:47:42.000
Ich weiß noch, als man diese Bounding Racks

00:47:42.000 --> 00:47:45.000
da noch nicht so einfach bekommen hat vom Browser,

00:47:45.000 --> 00:47:47.000
da musste man halt wirklich gucken,

00:47:47.000 --> 00:47:49.000
okay, ich summiere quasi die Position

00:47:49.000 --> 00:47:51.000
aller darüber liegenden Elemente

00:47:51.000 --> 00:47:55.000
und die Scrollposition davon summiere ich auf

00:47:55.000 --> 00:47:58.000
und guck dann, wo ist das jetzt und wohin muss ich scrollen.

00:47:58.000 --> 00:48:00.000
Und dann muss ich natürlich noch gucken,

00:48:00.000 --> 00:48:03.000
wenn ich noch einen Header hab, der irgendwie fix drüber liegt,

00:48:03.000 --> 00:48:06.000
dann muss ich das mit einberechnen und so weiter und so fort.

00:48:06.000 --> 00:48:09.000
Inzwischen ist das mit, wenn ich dann noch Scroll Margin eingebe,

00:48:09.000 --> 00:48:12.000
Scroll Margin Top über CSS, weil es war in dem Fall auch so,

00:48:12.000 --> 00:48:14.000
oben ist so ein Sticky Header.

00:48:14.000 --> 00:48:18.000
Und wenn's da hinspringen soll, soll der natürlich nicht drüber liegen.

00:48:18.000 --> 00:48:21.000
Und das hat man dann so im Job eingebaut von, keine Ahnung,

00:48:21.000 --> 00:48:24.000
wie viel RAM, wie hoch das Ding ist und mit dem Hinscrollen.

00:48:24.000 --> 00:48:27.000
Es hat einfach zack, eine Zeile Code, eine Zeile CSS

00:48:27.000 --> 00:48:30.000
und es hat einfach genauso funktioniert, wie man's haben will.

00:48:30.000 --> 00:48:32.000
Ja.

00:48:32.000 --> 00:48:34.000
Vielleicht an der Stelle noch,

00:48:34.000 --> 00:48:37.000
weil's mir jetzt grad noch in den Kopf kam,

00:48:37.000 --> 00:48:40.000
was, was ich finde, ein bisschen thematisch dazu passt,

00:48:40.000 --> 00:48:42.000
CSS Scroll Behavior Smooth.

00:48:42.000 --> 00:48:44.000
Mhm.

00:48:44.000 --> 00:48:47.000
Das funktioniert ja dann, wenn man Ankerlinks auf der Seite hat

00:48:47.000 --> 00:48:49.000
und ein Ankerlink angesprungen wird,

00:48:49.000 --> 00:48:51.000
und dann wird der Smooth angescrollt

00:48:51.000 --> 00:48:54.000
genauso mit demselben Effekt wie bei Scroll Interview.

00:48:54.000 --> 00:48:57.000
Dass man das per JavaScript abfangen müsste, ja.

00:48:57.000 --> 00:49:00.000
Genau, und das ist meiner Meinung nach auch ...

00:49:00.000 --> 00:49:03.000
Ich find ja, die Defaults bei solchen Sachen in Browsern,

00:49:03.000 --> 00:49:05.000
die sind ja oft nicht gut.

00:49:05.000 --> 00:49:07.000
Ja, aber die liegen halt daran,

00:49:07.000 --> 00:49:10.000
dass man bestehendes Verhalten nicht ändern wollte.

00:49:10.000 --> 00:49:12.000
Aber die sind gut, die Scroll Defaults.

00:49:12.000 --> 00:49:16.000
Ich mein jetzt auch so, wie's dahin scrollt und wie lang's braucht.

00:49:16.000 --> 00:49:18.000
Äh, das find ich genau richtig.

00:49:18.000 --> 00:49:20.000
Das fühlt sich für mich richtig an.

00:49:20.000 --> 00:49:22.000
Sowohl bei Scroll Interview

00:49:22.000 --> 00:49:24.000
als auch bei Scroll Behavior Smooth.

00:49:24.000 --> 00:49:26.000
Smooth.

00:49:26.000 --> 00:49:28.000
Smooth Criminal.

00:49:28.000 --> 00:49:30.000
Genau.

00:49:30.000 --> 00:49:32.000
All right.

00:49:32.000 --> 00:49:35.000
Jetzt hab ich grad Scroll Beaver eingegeben.

00:49:35.000 --> 00:49:37.000
Scroll Beaver?

00:49:37.000 --> 00:49:39.000
Scroll Beaver.

00:49:39.000 --> 00:49:41.000
Was?

00:49:41.000 --> 00:49:44.000
Statt Scroll Behavior wollt ich bei Can I Use eingeben.

00:49:44.000 --> 00:49:47.000
Okay. Gut, das kann man auch mal machen.

00:49:47.000 --> 00:49:52.000
Gut, ja, dann war das die Property der Woche.

00:49:52.000 --> 00:49:56.000
Und wir kommen tatsächlich jetzt ...

00:49:56.000 --> 00:50:01.000
Hier ist WWSIV mit dem Tagesthema.

00:50:01.000 --> 00:50:08.000
Ich wollte bewusst auf jeglichen Übergang verzichten,

00:50:08.000 --> 00:50:10.000
aber es passt halt auch so nicht,

00:50:10.000 --> 00:50:13.000
wenn man sagt, dann kommen wir jetzt, hier ist WWSIV.

00:50:13.000 --> 00:50:15.000
Aber gut.

00:50:15.000 --> 00:50:19.000
Ich glaube, entweder überarbeiten wir die Jingles irgendwann mal,

00:50:19.000 --> 00:50:21.000
dass es besser passt.

00:50:21.000 --> 00:50:24.000
Nee, ich glaube, das gehört einfach dazu.

00:50:24.000 --> 00:50:27.000
Oder wir leben einfach damit, dass wir Versager sind.

00:50:27.000 --> 00:50:29.000
Genau, würd ich auch sagen.

00:50:29.000 --> 00:50:31.000
Ich glaube, das ist auch in Ordnung.

00:50:31.000 --> 00:50:35.000
Heute geht's weiter mit Teil zwei der Inline-Elemente.

00:50:35.000 --> 00:50:39.000
Uns ist aufgefallen, es ist echt noch eine Menge vor uns.

00:50:39.000 --> 00:50:43.000
Es kommen noch ein paar Folgen zu den Inline-Elementen.

00:50:43.000 --> 00:50:46.000
Aber jetzt bringen wir erst mal diesen Abschnitt zu Ende.

00:50:46.000 --> 00:50:49.000
Vielleicht sterben wir auch vorher an Altersschwäche.

00:50:49.000 --> 00:50:52.000
Oder es geht dem Podcast einfach nicht mehr.

00:50:52.000 --> 00:50:55.000
Aber wir fräsen uns weiter durch.

00:50:55.000 --> 00:50:59.000
Und wir beginnen heute, ich hab's noch mal umsortiert,

00:50:59.000 --> 00:51:02.000
dass es so ein bisschen nach dem Alphabet geht.

00:51:02.000 --> 00:51:05.000
Wir beginnen heute mit Q.

00:51:05.000 --> 00:51:09.000
Ach so, weil so weit hinten sind wir schon.

00:51:09.000 --> 00:51:13.000
Ich dachte grade, okay, du hast es nach Alphabet sortiert,

00:51:13.000 --> 00:51:15.000
wir beginnen mit Q.

00:51:15.000 --> 00:51:17.000
Ja, wir beginnen mit Q.

00:51:17.000 --> 00:51:19.000
Aber heute beginnen wir mit Q,

00:51:19.000 --> 00:51:22.000
weil beim letzten Mal haben wir mit M aufgehört.

00:51:22.000 --> 00:51:25.000
Also, mit Mark, glaub ich, haben wir aufgehört.

00:51:25.000 --> 00:51:27.000
Zumindest war das das Letzte.

00:51:27.000 --> 00:51:29.000
Und na ja, danach kommt halt N.

00:51:29.000 --> 00:51:31.000
Ja, da ist nicht mehr so viel.

00:51:31.000 --> 00:51:34.000
Es gibt kein Element mit N, also kommt halt Q.

00:51:34.000 --> 00:51:36.000
Ach, scheiße.

00:51:36.000 --> 00:51:39.000
Aber Inline, das ist nur bei Inline-Elementen.

00:51:39.000 --> 00:51:42.000
Genau, es gibt kein Inline-Element. Ja, korrekt.

00:51:42.000 --> 00:51:44.000
Äh, ja, genau.

00:51:44.000 --> 00:51:49.000
Das Q-Element ist für Inline-Zitate gedacht.

00:51:49.000 --> 00:51:53.000
Und darüber hab ich tatsächlich jetzt noch mehr rausgefunden,

00:51:53.000 --> 00:51:55.000
als ich gedacht hätte.

00:51:55.000 --> 00:51:58.000
Weil es ist, von denen, die ich heute vorstelle,

00:51:58.000 --> 00:52:01.000
ist es eins der Interessanteren, muss ich sagen.

00:52:01.000 --> 00:52:03.000
Es hat mich ein bisschen überrascht.

00:52:03.000 --> 00:52:05.000
Also, letzten Endes geht es darum,

00:52:05.000 --> 00:52:08.000
ein Zitat, das innerhalb eines Textblocks drin ist.

00:52:08.000 --> 00:52:10.000
Also, wenn ihr ein eigenes Zitat habt,

00:52:10.000 --> 00:52:13.000
das für sich stehen soll, dann nehmt ihr Blockquote.

00:52:13.000 --> 00:52:15.000
Das hatten wir, glaub ich, schon.

00:52:15.000 --> 00:52:18.000
Q ist für ein Zitat innerhalb eines Textes.

00:52:18.000 --> 00:52:21.000
Also, das Beispiel auf der MDN ist hier.

00:52:21.000 --> 00:52:24.000
When Dave asks Hal to open the port bay door,

00:52:24.000 --> 00:52:28.000
Hal answers, I'm sorry, Dave, I'm afraid I can't do that.

00:52:28.000 --> 00:52:30.000
Im Kontext.

00:52:30.000 --> 00:52:32.000
Was ich nicht darüber wusste,

00:52:32.000 --> 00:52:35.000
ist, dass es automatisch Anführungszeichen macht.

00:52:35.000 --> 00:52:37.000
Das war mir nicht klar.

00:52:37.000 --> 00:52:40.000
Das überrascht mich auch gerade, und ich find's total cool.

00:52:40.000 --> 00:52:43.000
Und was ich natürlich dann als Erstes ausprobieren musste,

00:52:43.000 --> 00:52:46.000
und deswegen hab ich auch eine Mini-Codepen-Demo gebastelt,

00:52:46.000 --> 00:52:48.000
ich wollte wissen, ja, Mensch, okay,

00:52:48.000 --> 00:52:51.000
der macht jetzt hier irgendwie Anführungszeichen,

00:52:51.000 --> 00:52:54.000
aber woher weiß der denn, welche Sprache es ist?

00:52:54.000 --> 00:52:57.000
Und die Anführungszeichen werden tatsächlich nach der Sprache,

00:52:57.000 --> 00:52:59.000
die eingestellt ist, verändert.

00:52:59.000 --> 00:53:01.000
Ich habe auch ausprobiert,

00:53:01.000 --> 00:53:04.000
das Leng-Attribut auf dem Q-Element selbst zu ändern.

00:53:04.000 --> 00:53:06.000
Das hat keine Auswirkungen gehabt.

00:53:06.000 --> 00:53:08.000
Ah, okay.

00:53:08.000 --> 00:53:10.000
Was ja eigentlich blöd ist, ne?

00:53:10.000 --> 00:53:12.000
Also, es könnte ja ein Zitat ...

00:53:12.000 --> 00:53:15.000
Ich hab vielleicht französischen Text, den ich zitiere,

00:53:15.000 --> 00:53:19.000
und will da die Anführungsstriche mit diesen Doppelpfeilen haben.

00:53:19.000 --> 00:53:21.000
Also, genau, das hab ich ausprobiert.

00:53:21.000 --> 00:53:23.000
Schade.

00:53:23.000 --> 00:53:26.000
Im Codepen ist standardmäßig en als Sprache eingestellt.

00:53:26.000 --> 00:53:31.000
Und ich hab dann das mal verändert auf dem HTML-Element,

00:53:31.000 --> 00:53:33.000
also hab Leng.de gesetzt,

00:53:33.000 --> 00:53:36.000
und dann wurden tatsächlich deutsche Anführungszeichen gesetzt.

00:53:36.000 --> 00:53:38.000
Ich hätte jetzt echt erwartet,

00:53:38.000 --> 00:53:41.000
vielleicht geht's mit einem Rapper, das hab ich nicht ausprobiert,

00:53:41.000 --> 00:53:43.000
obwohl es irgendwie drumherum ist.

00:53:43.000 --> 00:53:46.000
Aber eigentlich will ich es im Element selbst haben.

00:53:46.000 --> 00:53:50.000
Es könnte ja sein, dass das Zitat selbst in einer anderen Sprache ist,

00:53:50.000 --> 00:53:52.000
als der Text drumherum.

00:53:52.000 --> 00:53:55.000
Also, wenn ich schon anfange mit automatischen Anführungszeichen,

00:53:55.000 --> 00:53:56.000
dann könnte ...

00:53:56.000 --> 00:53:58.000
Ah, mit Rapper funktioniert's.

00:53:58.000 --> 00:54:00.000
Mit Rapper funktioniert's?

00:54:00.000 --> 00:54:03.000
Okay, das heißt, man bräuchte noch ein Extralelement.

00:54:03.000 --> 00:54:06.000
Normalerweise hast du wahrscheinlich ein Paragraph außenrum.

00:54:06.000 --> 00:54:08.000
Und du willst ja eigentlich ...

00:54:08.000 --> 00:54:11.000
Die Frage ist halt, wenn ein französisches Zitat

00:54:11.000 --> 00:54:13.000
in einem deutschen Text eingebettet ist,

00:54:13.000 --> 00:54:16.000
würde ich aber trotzdem deutsche Anführungsstriche erwarten.

00:54:16.000 --> 00:54:18.000
Wenn ich aber einen Paragraph hab,

00:54:18.000 --> 00:54:20.000
der quasi aus einem französischen Buch ist,

00:54:20.000 --> 00:54:23.000
und da wird direkte Rede zum Beispiel verwendet.

00:54:23.000 --> 00:54:26.000
Das ist für Konstruierte so gar nicht geht. Ja.

00:54:26.000 --> 00:54:28.000
Also, das find ich eigentlich schon sinnvoll.

00:54:28.000 --> 00:54:30.000
Ich hätte trotzdem wahrscheinlich erwartet,

00:54:30.000 --> 00:54:34.000
dass ich mit dem lang Attribute auf dem Q-Element

00:54:34.000 --> 00:54:36.000
direkt was verändern kann.

00:54:36.000 --> 00:54:39.000
So, also weitere interessante Sachen zum Q-Element ist,

00:54:39.000 --> 00:54:41.000
das Q hat ein eigenes Attribut,

00:54:41.000 --> 00:54:44.000
das ich jetzt mal als Site aussprechen würde,

00:54:44.000 --> 00:54:46.000
also C-I-T-E.

00:54:46.000 --> 00:54:50.000
Und darin sollen Quellenangaben hinterlegt werden.

00:54:50.000 --> 00:54:53.000
Allerdings muss ich sagen,

00:54:53.000 --> 00:54:56.000
ich hab jetzt mit dem Screenreader auch ausprobiert,

00:54:56.000 --> 00:54:59.000
weil ich gedacht hab, na ja, was bringt denn das jetzt,

00:54:59.000 --> 00:55:01.000
diese Quellenangabe?

00:55:01.000 --> 00:55:03.000
Was tut der Browser damit?

00:55:03.000 --> 00:55:05.000
Oder was kann ich denn damit jetzt noch machen?

00:55:05.000 --> 00:55:08.000
Oder ist das wirklich nur für die Suchmaschine beispielsweise

00:55:08.000 --> 00:55:10.000
oder für irgendeinen Parser?

00:55:10.000 --> 00:55:12.000
Es ist offenbar nur für Parser,

00:55:12.000 --> 00:55:14.000
weil Screenreader interessieren sich dafür null.

00:55:14.000 --> 00:55:16.000
Die lesen keine Quellenangabe vor.

00:55:16.000 --> 00:55:20.000
Voice-Over auf dem Mac interessiert sich dafür nicht.

00:55:20.000 --> 00:55:23.000
Und ja, ansonsten hab ich jetzt auch nichts gesehen,

00:55:23.000 --> 00:55:26.000
auch nicht, dass es im Title oder sonst irgendwo angezeigt wird.

00:55:26.000 --> 00:55:29.000
Ich glaube, das können wir schon mal wegnehmen,

00:55:29.000 --> 00:55:31.000
das ist so ein Thema,

00:55:31.000 --> 00:55:34.000
das sich so durchzieht durch alle Inline-Elemente,

00:55:34.000 --> 00:55:36.000
dass die zwar schön semantisch sind,

00:55:36.000 --> 00:55:40.000
aber in der Regel für Screenreader keinerlei Bedeutung haben.

00:55:40.000 --> 00:55:43.000
Ja, teilweise. Wir kommen noch zu anderen.

00:55:43.000 --> 00:55:45.000
Also ich kann jetzt auf jeden Fall sagen,

00:55:45.000 --> 00:55:47.000
das Q-Element hat zum Beispiel,

00:55:47.000 --> 00:55:49.000
und daran sieht man dann auch schon,

00:55:49.000 --> 00:55:51.000
dass selbst wenn ein Screenreader wollte,

00:55:51.000 --> 00:55:53.000
dann müsste er sich schon ein bisschen verrenken.

00:55:53.000 --> 00:55:55.000
Es hat keine implizite ARIA-Role.

00:55:55.000 --> 00:55:57.000
Es ist einfach generic, als wäre es halt irgendwas.

00:55:57.000 --> 00:55:59.000
Also von daher ist es auch gar nicht angedacht,

00:55:59.000 --> 00:56:01.000
dass es dafür irgendwie eine semantische,

00:56:01.000 --> 00:56:03.000
also es sieht für mich so aus,

00:56:03.000 --> 00:56:07.000
dass es dafür eine semantische Aussage haben soll.

00:56:07.000 --> 00:56:10.000
Ähm, ja, keine Ahnung.

00:56:10.000 --> 00:56:13.000
Ähm, ja, das dazu.

00:56:13.000 --> 00:56:15.000
Das Q-Element.

00:56:15.000 --> 00:56:17.000
Mu.

00:56:17.000 --> 00:56:22.000
Und damit zum nächsten kuriosen Element,

00:56:22.000 --> 00:56:25.000
das wir beide noch nicht so wirklich kannten,

00:56:25.000 --> 00:56:27.000
beziehungsweise das sind drei Elemente,

00:56:27.000 --> 00:56:30.000
die wir da gleich zusammenfassen, weil die zusammengehören.

00:56:30.000 --> 00:56:33.000
Und zwar sind das Ruby, RT und RP.

00:56:33.000 --> 00:56:36.000
Und bei Ruby hab ich gleich an die Programmiersprache gedacht.

00:56:36.000 --> 00:56:39.000
Aber es geht um was ganz anderes,

00:56:39.000 --> 00:56:42.000
und zwar um was, was mir dann doch tatsächlich näher ist,

00:56:42.000 --> 00:56:44.000
als dass Ruby die Programmiersprache mir wäre.

00:56:44.000 --> 00:56:50.000
Es geht um die Auszeichnung von ostasiatischen Zeichen,

00:56:50.000 --> 00:56:55.000
also Ideografen, sprich japanisch, chinesisch,

00:56:55.000 --> 00:57:00.000
alles was eben nicht arabische, nicht lateinische

00:57:00.000 --> 00:57:03.000
oder sonstige Schriftzeichen benutzt, sondern eben asiatische.

00:57:03.000 --> 00:57:07.000
Ähm, und da der einzige Zweck dazu ist wohl,

00:57:07.000 --> 00:57:11.000
dass man die Aussprache, also es gibt ja so eine Romanisierung

00:57:11.000 --> 00:57:14.000
der Zeichen, ja, also zum Beispiel

00:57:14.000 --> 00:57:17.000
Qin für Herz auf Chinesisch wird auf,

00:57:17.000 --> 00:57:20.000
in der romanisierten Umschreibung XIN geschrieben.

00:57:20.000 --> 00:57:23.000
Da gibt's einen Standard, wie man das eben ausspricht.

00:57:23.000 --> 00:57:28.000
Ähm, wenn wir schon eben ja abschweifen,

00:57:28.000 --> 00:57:32.000
Qingdao, das chinesische Bier, das man vielleicht so kennt,

00:57:32.000 --> 00:57:36.000
das wird auf der Flasche Qingtao geschrieben.

00:57:36.000 --> 00:57:38.000
Und das liegt eben daran, dass diese Standardisierung

00:57:38.000 --> 00:57:40.000
nicht immer so war, wie sie ist.

00:57:40.000 --> 00:57:42.000
Also früher hat man, keine Ahnung, vor 200, 300 Jahren,

00:57:42.000 --> 00:57:45.000
haben Leute noch anders das Chinesische umschrieben,

00:57:45.000 --> 00:57:47.000
als das heute ist. Heute ist man da näher dran.

00:57:47.000 --> 00:57:49.000
Es gibt das internationale phonetische Alphabet und so weiter.

00:57:49.000 --> 00:57:53.000
Und es gibt eben diese standardisierte Romanisierung.

00:57:53.000 --> 00:57:56.000
Aber das nur völlig am Rande, einfach weil ich das Wissen hab

00:57:56.000 --> 00:57:58.000
und gerne damit rumschwerfe.

00:57:58.000 --> 00:58:00.000
Ja, das war spannend, danke.

00:58:00.000 --> 00:58:03.000
Genau, also ja, damit kann man eben die Aussprache

00:58:03.000 --> 00:58:05.000
oder zum Beispiel auch die Übersetzung des Zeichens

00:58:05.000 --> 00:58:07.000
direkt über das Zeichen setzen.

00:58:07.000 --> 00:58:09.000
Und das ist natürlich schon ganz cool.

00:58:09.000 --> 00:58:13.000
Es ist ein sehr eigener Anwendungsfall,

00:58:13.000 --> 00:58:16.000
sehr, wie soll ich sagen, begrenzt.

00:58:16.000 --> 00:58:19.000
Man denkt so, krass, dafür gibt's was Eigenes.

00:58:19.000 --> 00:58:22.000
Aber man merkt da auch wieder so ein bisschen

00:58:22.000 --> 00:58:26.000
so den Ursprung von HTML eben aus dem wissenschaftlichen Bereich.

00:58:26.000 --> 00:58:30.000
Ja, und vernetzte Dokumente und Zitate

00:58:30.000 --> 00:58:32.000
und Verlinkungen untereinander.

00:58:32.000 --> 00:58:36.000
Und da passt das ja natürlich eigentlich ganz gut rein,

00:58:36.000 --> 00:58:40.000
dass ich eben, wenn ich wissenschaftlich was darstellen will

00:58:40.000 --> 00:58:43.000
über die Sprache, muss ich das in irgendeiner Form machen können.

00:58:43.000 --> 00:58:46.000
Und in dem Fall brauche ich dann eben nicht mal eigenes CSS,

00:58:46.000 --> 00:58:49.000
sondern der Browser kann das, wenn er's unterstützt,

00:58:49.000 --> 00:58:51.000
eben einfach so darstellen.

00:58:51.000 --> 00:58:53.000
Also es wird dann einfach der Text,

00:58:53.000 --> 00:58:55.000
also ich hab, ich soll's nicht mal beschreiben,

00:58:55.000 --> 00:58:57.000
wie's überhaupt aussieht.

00:58:57.000 --> 00:58:59.000
Ich hab grad die Demo mal aufgemacht, um's mir anzugucken.

00:58:59.000 --> 00:59:02.000
Ich hab, es gibt das Ruby Tag, das ist außenrum erst mal.

00:59:02.000 --> 00:59:04.000
Und dann schreibe ich da direkt rein

00:59:04.000 --> 00:59:07.000
die chinesischen Schriftzeichen in dem Fall, die ich haben will.

00:59:07.000 --> 00:59:10.000
Und dann, das lass ich jetzt mal noch weg, das RP.

00:59:10.000 --> 00:59:12.000
Und dann schreibe ich RT.

00:59:12.000 --> 00:59:14.000
Und da steht zum Beispiel Ashita.

00:59:14.000 --> 00:59:16.000
Also das muss dann wohl japanisch sein.

00:59:16.000 --> 00:59:18.000
Das benutzt ja teilweise die gleichen Schriftzeichen

00:59:18.000 --> 00:59:20.000
wie das chinesische, aber teilweise auch die ...

00:59:20.000 --> 00:59:22.000
Es gibt ja irgendwie Hiragana und Katakana,

00:59:22.000 --> 00:59:24.000
aber mit Japanisch kenn ich mich nicht aus.

00:59:24.000 --> 00:59:26.000
Ähm, und ...

00:59:26.000 --> 00:59:28.000
Dann, äh, genau.

00:59:28.000 --> 00:59:30.000
Steht da eben Ashita, und das steht dann

00:59:30.000 --> 00:59:33.000
über diesen beiden chinesischen Schriftzeichen, oben drüber.

00:59:33.000 --> 00:59:37.000
Und da es Browser gibt, die das nicht unterstützen,

00:59:37.000 --> 00:59:39.000
gibt es sogar noch ne Möglichkeit,

00:59:39.000 --> 00:59:42.000
ähm, ein Fallback darzustellen.

00:59:42.000 --> 00:59:44.000
Also indem man zum Beispiel sagt,

00:59:44.000 --> 00:59:46.000
ich möchte das einfach in Klammern dahinterstehen haben,

00:59:46.000 --> 00:59:48.000
hinter den Schriftzeichen.

00:59:48.000 --> 00:59:50.000
Und dann kann ich die öffnende Klammer

00:59:50.000 --> 00:59:54.000
in einem RP-Tagpaar, schon gefasst,

00:59:54.000 --> 00:59:57.000
davor schreiben, vor die Übersetzung oder vor die Aussprache.

00:59:57.000 --> 00:59:59.000
Und die geschlossene Klammer eben wieder auch

00:59:59.000 --> 01:00:01.000
im RP-Text außenrum.

01:00:01.000 --> 01:00:03.000
Sprich, Browser, die es nicht unterstützen,

01:00:03.000 --> 01:00:05.000
die ignorieren einfach sowohl das Ruby-Tag

01:00:05.000 --> 01:00:07.000
als auch das RP-Tag, als auch das RT-Tag,

01:00:07.000 --> 01:00:09.000
weil sie damit nichts anfangen können.

01:00:09.000 --> 01:00:11.000
Und schreiben das einfach alles als Text hintereinander.

01:00:11.000 --> 01:00:13.000
Genau so will man es eigentlich auch haben.

01:00:13.000 --> 01:00:15.000
Und Browser, die es können, die setzen eben,

01:00:15.000 --> 01:00:17.000
die ignorieren das RP-Tag.

01:00:17.000 --> 01:00:19.000
Also da ist wahrscheinlich im Browser-Style-Sheet

01:00:19.000 --> 01:00:21.000
dann ein Display-None-Implizit draufgesetzt.

01:00:21.000 --> 01:00:24.000
Das eben dann diese Klammern oder was auch immer

01:00:24.000 --> 01:00:26.000
ich als Fallback habe, dann ausblendet.

01:00:26.000 --> 01:00:29.000
Und es stellt dann nur das RT-Tag dar

01:00:29.000 --> 01:00:31.000
und das platziert's eben oben drüber.

01:00:31.000 --> 01:00:33.000
Magic.

01:00:33.000 --> 01:00:36.000
Ich guck jetzt grad mal, ob ich schnell im Web

01:00:36.000 --> 01:00:38.000
einmal nackt was dazu finde.

01:00:38.000 --> 01:00:40.000
Weil wir haben vorhin schon drüber gesprochen,

01:00:40.000 --> 01:00:42.000
wie viel das wohl verwendet wird.

01:00:42.000 --> 01:00:45.000
Ja, das wär interessant, wenn du da so schnell was findest.

01:00:45.000 --> 01:00:47.000
Ja, ich glaube, ich ...

01:00:47.000 --> 01:00:49.000
Ja, so schnell geht's, glaub ich, nicht.

01:00:49.000 --> 01:00:51.000
Nee, ja, kein Stress.

01:00:51.000 --> 01:00:53.000
Ich hab auch noch ein bisschen was dazu zu sagen.

01:00:53.000 --> 01:00:56.000
Also Browser-Unterstützung ist eigentlich auch relativ gut.

01:00:56.000 --> 01:00:58.000
Chrome seit Version 5, Firefox seit 38.

01:00:58.000 --> 01:01:00.000
Also Safari seit 5.

01:01:00.000 --> 01:01:03.000
Das wird eigentlich überall unterstützt.

01:01:03.000 --> 01:01:05.000
Also dieses RP-Tag, ja, keine Ahnung,

01:01:05.000 --> 01:01:08.000
braucht man eigentlich wahrscheinlich gar nicht groß.

01:01:08.000 --> 01:01:10.000
Außer vielleicht für Screenreader.

01:01:10.000 --> 01:01:13.000
Weil da sind wir nämlich schon wieder bei dem Punkt.

01:01:13.000 --> 01:01:15.000
Es gibt keine implizite ARIA-Rolle.

01:01:15.000 --> 01:01:19.000
Weder für das Ruby noch für das RT noch für das RP.

01:01:19.000 --> 01:01:21.000
Das heißt, das ist einfach für Screenreader

01:01:21.000 --> 01:01:23.000
ein ganz normaler Text.

01:01:23.000 --> 01:01:28.000
Und der Screenreader würde dann eben diese Fallback-Geschichte

01:01:28.000 --> 01:01:30.000
auch auslesen.

01:01:30.000 --> 01:01:32.000
In dem Fall, ja, ob er dann sagt,

01:01:32.000 --> 01:01:35.000
Runde-Klammer geöffnet, Runde-Klammer geschlossen,

01:01:35.000 --> 01:01:37.000
weiß ich jetzt nicht.

01:01:37.000 --> 01:01:39.000
Müsste man ausprobieren.

01:01:39.000 --> 01:01:41.000
Hängt vielleicht auch vom Screenreader ab.

01:01:41.000 --> 01:01:43.000
Ähm, genau.

01:01:43.000 --> 01:01:45.000
Ich hab tatsächlich was gefunden.

01:01:45.000 --> 01:01:47.000
Ja, sehr nischig.

01:01:47.000 --> 01:01:49.000
Äh, und zwar ...

01:01:49.000 --> 01:01:52.000
Ach, wieso Mobile Pages, das versteh ich jetzt grad nicht.

01:01:52.000 --> 01:01:54.000
Bin ich hier ...

01:01:54.000 --> 01:01:56.000
Naja, also ich hab hier eine Statistik,

01:01:56.000 --> 01:01:58.000
die ist aus dem Web-Almanack von 2021.

01:01:58.000 --> 01:02:02.000
Und da ist eine Tabelle mit der, wie viel ...

01:02:02.000 --> 01:02:04.000
Ja, es geht tatsächlich darum,

01:02:04.000 --> 01:02:07.000
auf wie vielen Seiten bestimmte Tags vorkommen.

01:02:07.000 --> 01:02:11.000
Und wenn ich das jetzt richtig interpretiere hier an der Stelle,

01:02:11.000 --> 01:02:13.000
dann sind das 0,02 Prozent.

01:02:13.000 --> 01:02:15.000
Okay. Ja, krass.

01:02:15.000 --> 01:02:17.000
Ich geh mal da in die Daten rein,

01:02:17.000 --> 01:02:19.000
weil offenbar gibt's da tatsächlich ...

01:02:19.000 --> 01:02:21.000
Ah ja, tatsächlich, da gibt's eine Liste.

01:02:21.000 --> 01:02:23.000
Oh, das packen wir mal in die Show Notes.

01:02:23.000 --> 01:02:25.000
Das ist geil.

01:02:25.000 --> 01:02:28.000
Das ist so eine Google-Doc-Liste mit allen HTML-Tags.

01:02:28.000 --> 01:02:30.000
Warte mal, das pack ich dir da noch mal rein.

01:02:30.000 --> 01:02:33.000
Das ist, glaub ich, generell für unsere Liste hier interessant.

01:02:33.000 --> 01:02:36.000
Aber für das Ruby-Tag find ich's jetzt besonders interessant.

01:02:36.000 --> 01:02:38.000
Deswegen würd ich's mal da dazu packen.

01:02:38.000 --> 01:02:40.000
Da auch im Trello schieben.

01:02:40.000 --> 01:02:43.000
Wenn ich in der Lage bin, es an die richtige Stelle zu schieben.

01:02:43.000 --> 01:02:45.000
Dann noch eins hoch, genau.

01:02:45.000 --> 01:02:47.000
Ja, ja, schon.

01:02:47.000 --> 01:02:50.000
So, wenn man jetzt da mal guckt, da hab ich hier die Pages.

01:02:50.000 --> 01:02:54.000
Und da scroll ich jetzt mal ganz nach unten.

01:02:54.000 --> 01:02:57.000
Also, warte mal, vielleicht muss ich mal nachsuchen.

01:02:57.000 --> 01:02:59.000
Ruby. Wieso geht das jetzt grad nicht?

01:02:59.000 --> 01:03:02.000
Sorry, jetzt hier debugge ich noch selbst.

01:03:02.000 --> 01:03:04.000
Äh, ich ...

01:03:04.000 --> 01:03:06.000
Ich find das Ruby jetzt aber auch nicht.

01:03:06.000 --> 01:03:08.000
Was ich find, ist das rp und das rt.

01:03:08.000 --> 01:03:10.000
Und die sind bei ... Ach doch, hier, Ruby.

01:03:10.000 --> 01:03:13.000
0,0 Prozent, 0,0 Prozent, 0,0 Prozent.

01:03:13.000 --> 01:03:15.000
Ah, perfekt. Also quasi ...

01:03:15.000 --> 01:03:18.000
Was ist das, was pct? Pages, total.

01:03:18.000 --> 01:03:22.000
Also wirklich, äh, sehr wenig.

01:03:22.000 --> 01:03:26.000
Also auf wahrscheinlich so zehn Millionen Seiten,

01:03:26.000 --> 01:03:28.000
würd ich jetzt mal tippen.

01:03:28.000 --> 01:03:32.000
Ach ja, warte mal. Das HTML-Element 7,4 Millionen.

01:03:32.000 --> 01:03:34.000
Äh, ja.

01:03:34.000 --> 01:03:36.000
Aber ich weiß auch nicht, was ...

01:03:36.000 --> 01:03:38.000
Da hinten steht so eine Prozentzahl.

01:03:38.000 --> 01:03:41.000
Das ist witzig. Das muss doch eigentlich fast ein Fehler sein.

01:03:41.000 --> 01:03:44.000
rt und math haben nämlich exakt die gleiche Anzahl.

01:03:44.000 --> 01:03:48.000
Aber diese 6.286.373, die tauchen überall wieder auf.

01:03:48.000 --> 01:03:51.000
Das ist komisch.

01:03:51.000 --> 01:03:53.000
Aber hinten steht so eine Prozentzahl.

01:03:53.000 --> 01:03:56.000
Da müsste man sich mal genauer mit beschäftigen,

01:03:56.000 --> 01:03:58.000
wie dieses Ding genau funktioniert.

01:03:58.000 --> 01:04:01.000
Aber die Verbreitung scheint sehr wenig zu sein.

01:04:01.000 --> 01:04:04.000
Das probier ich im Nachgang auf jeden Fall noch mal.

01:04:04.000 --> 01:04:07.000
Aber ich find's abgefahren, was das Ding tut.

01:04:07.000 --> 01:04:09.000
Weil das ist ja schon nicht trivial.

01:04:09.000 --> 01:04:12.000
Text übereinandersetzen einfach mal so, find ich jetzt.

01:04:12.000 --> 01:04:15.000
Ja, wer weiß, wofür man das noch missbrauchen kann.

01:04:15.000 --> 01:04:17.000
Bei Can I Use sieht man,

01:04:17.000 --> 01:04:21.000
dass der Support fast überall als partially markiert ist.

01:04:21.000 --> 01:04:25.000
Und das liegt wohl daran, dass bestimmte Sachen wie, ähm,

01:04:25.000 --> 01:04:29.000
ob der Text jetzt von oben nach unten läuft oder von links nach rechts,

01:04:29.000 --> 01:04:32.000
das wohl nicht überall berücksichtigt wird.

01:04:32.000 --> 01:04:35.000
Also so ein paar Unterschiede gibt's da noch.

01:04:35.000 --> 01:04:37.000
Und zu dem Foreback-Element RP,

01:04:37.000 --> 01:04:40.000
da kann man mal auf die MDN-Seite schauen.

01:04:40.000 --> 01:04:43.000
Da sieht man ganz schön unten als letztes Beispiel,

01:04:43.000 --> 01:04:46.000
wie das quasi dargestellt werden würde in einem Browser,

01:04:46.000 --> 01:04:48.000
der es nicht unterstützt.

01:04:48.000 --> 01:04:50.000
Da sieht man einfach das Zeichen

01:04:50.000 --> 01:04:53.000
und hintendran in Klammer die Aussprache.

01:04:53.000 --> 01:04:56.000
Und das nächste Zeichen in Klammer die Aussprache.

01:04:56.000 --> 01:04:58.000
Da hab ich auch wieder was gelernt.

01:04:58.000 --> 01:05:01.000
Ich weiß nicht, ob ich's jemals einsetzen werde,

01:05:01.000 --> 01:05:05.000
aber es gibt's, es ist standardisiert, es ist gut unterstützt.

01:05:05.000 --> 01:05:08.000
Ich bin froh, dass es bei dir gelandet ist,

01:05:08.000 --> 01:05:12.000
weil du dich ja tatsächlich mit solchen Sachen auseinandersetzt.

01:05:12.000 --> 01:05:15.000
Weil du erstens angefangen hast, zu Chinesisch zu lernen,

01:05:15.000 --> 01:05:17.000
wenn ich mich recht erinnere.

01:05:17.000 --> 01:05:19.000
Und auch wegen OpenType.js,

01:05:19.000 --> 01:05:22.000
wo du's ja auch mit Schriften zu tun hast.

01:05:22.000 --> 01:05:24.000
Wo ja eigentlich ist ja schon ...

01:05:24.000 --> 01:05:28.000
Wo auch solche Didi-Direction-Gedöns zum Einsatz kommen.

01:05:28.000 --> 01:05:30.000
Von daher hat's ganz gut gepasst.

01:05:30.000 --> 01:05:33.000
Als ich die MDN-Seite dann geöffnet hab und gesehen hab,

01:05:33.000 --> 01:05:35.000
oh, chinesische Schriftzeichen.

01:05:35.000 --> 01:05:38.000
Hat gar nichts mit der Programmiersprache zu tun.

01:05:38.000 --> 01:05:40.000
Was ist eigentlich der Python-Element?

01:05:40.000 --> 01:05:42.000
Und das PHP-Element.

01:05:42.000 --> 01:05:45.000
Als ich angefangen hab, da gab's ja noch VB-Script.

01:05:45.000 --> 01:05:49.000
Das gibt's immer noch.

01:05:49.000 --> 01:05:51.000
Echt? Kann man das noch nicht ...

01:05:51.000 --> 01:05:54.000
VB-Script kann man noch nicht mehr benutzen, oder?

01:05:54.000 --> 01:05:58.000
Weiß ich nicht, du musst nur ein altes Betriebssystem aufsetzen.

01:05:58.000 --> 01:06:01.000
Und noch ein altes Netscape oder ein IE4 oder was.

01:06:01.000 --> 01:06:05.000
Irgendwo gibt's doch bestimmt noch so einen verfilzten Rechner

01:06:05.000 --> 01:06:08.000
mit lauter Wollmäusen im Lüfter, der ...

01:06:08.000 --> 01:06:10.000
Wuuuuh!

01:06:10.000 --> 01:06:12.000
Wo man den Power-Knopf drücken muss,

01:06:12.000 --> 01:06:14.000
damit er so richtig in Gang kommt.

01:06:14.000 --> 01:06:16.000
Nee, den Turbo-Knopf.

01:06:16.000 --> 01:06:19.000
Eine Sache noch, bevor ich zum Ende komme.

01:06:19.000 --> 01:06:22.000
Es gibt, hab ich dann noch entdeckt, bei der MDN,

01:06:22.000 --> 01:06:25.000
einen CSS-Text-Transform-Value,

01:06:25.000 --> 01:06:28.000
wo die Unterstützung aber ziemlich schlecht ist.

01:06:28.000 --> 01:06:34.000
Und zwar Text-Transform full-size-kana.

01:06:34.000 --> 01:06:38.000
Und kana sind eben, also es gibt irgendwie Katakana, Hiragana,

01:06:38.000 --> 01:06:40.000
das weiß ich nur so grob im Japanischen.

01:06:40.000 --> 01:06:43.000
Das eine sind eben die rein japanischen Schriftzeichen,

01:06:43.000 --> 01:06:46.000
das andere sind die, die aus dem Chinesischen entlehnt sind.

01:06:46.000 --> 01:06:48.000
Ich weiß jetzt nicht, welche was sind.

01:06:48.000 --> 01:06:51.000
Aber ich glaub, kana sind diese japanischen.

01:06:51.000 --> 01:06:55.000
Und die gibt's wohl in der Groß- und Kleinschreibung,

01:06:55.000 --> 01:06:57.000
und damit kann man forcieren.

01:06:57.000 --> 01:06:59.000
Also normalerweise Text-Transform ja capitalize,

01:06:59.000 --> 01:07:02.000
uppercase, lowercase und so weiter.

01:07:02.000 --> 01:07:05.000
Und dann gibt's eben noch full-width und full-size-kana.

01:07:05.000 --> 01:07:09.000
Full-width weiß ich jetzt auch nicht, was das genau machen soll.

01:07:09.000 --> 01:07:11.000
Das hab ich mir jetzt nicht angeschaut,

01:07:11.000 --> 01:07:14.000
weil es mir jetzt nur um das ging, was eben damit eine Rolle spielt.

01:07:14.000 --> 01:07:16.000
Und da kann man dann sagen full-size-kana.

01:07:16.000 --> 01:07:19.000
Das kann interessanterweise, wenn ich's richtig im Kopf hab,

01:07:19.000 --> 01:07:20.000
nur der Firefox.

01:07:20.000 --> 01:07:23.000
Guck noch mal unten hier bei der Unterstützungstabelle.

01:07:23.000 --> 01:07:27.000
Full-size-kana, ja, das kann der Firefox, das kann der Safari.

01:07:27.000 --> 01:07:30.000
Firefox, Android, Safari, iOS, ja.

01:07:30.000 --> 01:07:32.000
Also die beiden können das.

01:07:32.000 --> 01:07:34.000
Wer's braucht, bitte.

01:07:34.000 --> 01:07:38.000
Genau, und damit ...

01:07:38.000 --> 01:07:42.000
wäre das jetzt schon zu Ende. Du hast noch einen Bonus.

01:07:42.000 --> 01:07:45.000
Ich hab grad noch ein Bonus-Element eingetragen.

01:07:45.000 --> 01:07:49.000
So ein Opa erzählt vom Krieg, obwohl er selbst nicht dabei war.

01:07:49.000 --> 01:07:52.000
Und zwar, weil ich bin grade drauf gestoßen

01:07:52.000 --> 01:07:55.000
in der Tabelle von dem Webalmanack,

01:07:55.000 --> 01:07:59.000
wo beim Ruby-Element 0,02 Prozent stand und RT,

01:07:59.000 --> 01:08:01.000
da war das TT-Element dabei.

01:08:01.000 --> 01:08:04.000
Und dann war ich neugierig, was ist das eigentlich?

01:08:04.000 --> 01:08:06.000
Weil das hab ich auch noch nie gehört.

01:08:06.000 --> 01:08:10.000
Und im MDN-Artikel steht gleich richtig fett obendrauf deprecated.

01:08:10.000 --> 01:08:13.000
Und das heißt das Teletype-Text-Element.

01:08:14.000 --> 01:08:19.000
Ist dafür da, einen Inline-Text darzustellen,

01:08:19.000 --> 01:08:25.000
der dem User-Agent seinen Default- Monospace-Font verwendet.

01:08:25.000 --> 01:08:31.000
Und es wurde verwendet oder wurde erfunden,

01:08:31.000 --> 01:08:38.000
um Text darzustellen, als wär's im Fixed-Width-Display

01:08:38.000 --> 01:08:42.000
und wie Teletype-Text-Only-Screen-Line-Printer.

01:08:42.000 --> 01:08:44.000
Also, das klingt nach sehr alt.

01:08:44.000 --> 01:08:53.000
Also, irgendwie so, um Standardmonospace-Font darzustellen,

01:08:53.000 --> 01:08:55.000
aus irgendwelchen Gründen.

01:08:55.000 --> 01:08:57.000
Verrückt.

01:08:57.000 --> 01:09:00.000
Ja, ich will jetzt auch gar nicht weiter tiefer einsteigen,

01:09:00.000 --> 01:09:02.000
fand ich nur interessant, hab ich gesagt TT,

01:09:02.000 --> 01:09:04.000
das hab ich noch nie gehört.

01:09:04.000 --> 01:09:06.000
Nee, nur Teletext.

01:09:06.000 --> 01:09:09.000
Also, einfach nicht verwenden, aber ja.

01:09:09.000 --> 01:09:13.000
Aber unterstützt halt Chrome 1 und Firefox 1.

01:09:13.000 --> 01:09:14.000
Krass.

01:09:14.000 --> 01:09:17.000
Ja, letzten Endes ist es ja wahrscheinlich nur Styling.

01:09:17.000 --> 01:09:19.000
Das hat ja keinen semantischen Wert,

01:09:19.000 --> 01:09:22.000
ziemlich sicher nicht mehr, selbst wenn's das mal hatte.

01:09:22.000 --> 01:09:24.000
Und dann ist es nur irgendein Styling,

01:09:24.000 --> 01:09:27.000
was du natürlich mit CSS machen kannst und auch solltest.

01:09:27.000 --> 01:09:29.000
Was eine schöne Überleitung.

01:09:29.000 --> 01:09:32.000
Zu dem S-Element, was jetzt als nächstes kommt.

01:09:32.000 --> 01:09:34.000
The Strike-Through-Element.

01:09:34.000 --> 01:09:37.000
Und jetzt könnte man annehmen, ja, das ist jetzt irgendwie wieder

01:09:37.000 --> 01:09:39.000
wie bei HTML5, es gibt ja keine Elemente mehr,

01:09:39.000 --> 01:09:42.000
die für Styling sind, sondern es ist ja alles nur noch

01:09:42.000 --> 01:09:44.000
Semantik in Anführungsstrichen.

01:09:44.000 --> 01:09:46.000
Man soll ja Styling mit CSS machen.

01:09:46.000 --> 01:09:51.000
Deswegen ist das S-Element nicht einfach nur durchgestrichener Text,

01:09:51.000 --> 01:09:54.000
auch wenn der Browser das standardmäßig so darstellt,

01:09:54.000 --> 01:09:58.000
sondern es ist jetzt umgewidmet worden zu Inhalt,

01:09:58.000 --> 01:10:02.000
der nicht länger gültig ist auf einer Seite.

01:10:02.000 --> 01:10:05.000
Allerdings nicht für Korrekturen.

01:10:05.000 --> 01:10:08.000
Für Korrekturen gibt es Dell und Inst.

01:10:08.000 --> 01:10:12.000
Ich weiß gar nicht, das kommt, glaube ich, noch in unserer HTML-Reihe.

01:10:12.000 --> 01:10:16.000
Das sind Extralelemente, die sind dafür zu sagen,

01:10:16.000 --> 01:10:19.000
hier ist was gelöscht worden und hier wurde was eingefügt.

01:10:19.000 --> 01:10:22.000
Also tatsächlich um eine Korrektur, irgendwas wurde ausgetauscht.

01:10:22.000 --> 01:10:24.000
Aber ich möchte jetzt nicht es einfach tauschen,

01:10:24.000 --> 01:10:26.000
sondern ich möchte es sichtbar zeigen,

01:10:26.000 --> 01:10:28.000
dass was ausgetauscht wurde.

01:10:28.000 --> 01:10:30.000
Egal, darum geht's nicht.

01:10:30.000 --> 01:10:32.000
Es geht um Inhalt, der nicht mehr gültig ist,

01:10:32.000 --> 01:10:35.000
aber auf der Seite trotzdem bleiben soll aus irgendwelchen Gründen.

01:10:35.000 --> 01:10:42.000
Das kann ja sein, dass irgendeine Info in einem Artikel nicht mehr stimmt

01:10:42.000 --> 01:10:49.000
oder irgendwas, was weiß ich, das Event findet statt an Ort X,

01:10:49.000 --> 01:10:52.000
aber das stimmt nicht mehr, aber man möchte die Info noch da behalten.

01:10:52.000 --> 01:10:53.000
Dann könnte man...

01:10:53.000 --> 01:10:56.000
Dann würde man ja normalerweise aber Dell und Inst wahrscheinlich benutzen,

01:10:56.000 --> 01:10:57.000
um zu zeigen, was sich...

01:10:57.000 --> 01:10:58.000
Ja, genau.

01:10:58.000 --> 01:11:00.000
Es ist eigentlich nur dafür, wenn was weggenommen wird,

01:11:00.000 --> 01:11:02.000
wenn was dazu kommt.

01:11:02.000 --> 01:11:04.000
Aber dann hat man den Fall schon mal.

01:11:04.000 --> 01:11:06.000
Dann bist du ein schlechter Content Provider,

01:11:06.000 --> 01:11:08.000
wenn du Sachen einfach durchstreichst,

01:11:08.000 --> 01:11:10.000
ohne dem User irgendwie zu sagen,

01:11:10.000 --> 01:11:13.000
was denn jetzt stattdessen dann Gültigkeit hat.

01:11:13.000 --> 01:11:16.000
So, und weil wir vorhin die Screenreader schon angesprochen haben,

01:11:16.000 --> 01:11:21.000
interessanterweise, da gibt's in dem MDN-Artikel dazu extra einen Absatz,

01:11:21.000 --> 01:11:25.000
der sagt, ja, wenn man jetzt den Screenreadernutzenden helfen will,

01:11:25.000 --> 01:11:27.000
weil das nämlich nicht announced wird,

01:11:27.000 --> 01:11:30.000
dann könnte man Folgendes tun.

01:11:30.000 --> 01:11:33.000
Das haben wir an anderer Stelle auch schon mal gehabt, das Beispiel.

01:11:33.000 --> 01:11:38.000
Man könnte in Before und After versteckt Text reinpacken.

01:11:38.000 --> 01:11:41.000
Und hier Start des durchgestrichenen Textes,

01:11:41.000 --> 01:11:44.000
Ende des durchgestrichenen Textes in Before und After jeweils.

01:11:44.000 --> 01:11:47.000
Allerdings so, dass es halt versteckt dargestellt wird,

01:11:47.000 --> 01:11:49.000
ohne es mit Display hinan auszublenden,

01:11:49.000 --> 01:11:51.000
sodass ein Screenreader es trotzdem vorliest.

01:11:51.000 --> 01:11:53.000
Also hier haben sie irgendwie Clip Path,

01:11:53.000 --> 01:11:56.000
Inset 100 Prozent, Clip Rect, ein Pixel und so weiter.

01:11:56.000 --> 01:12:00.000
Ein großes Array an Eigenschaften.

01:12:00.000 --> 01:12:03.000
Aber es steht dann auch gleich hinten dran,

01:12:03.000 --> 01:12:06.000
das sind sich nicht alle so einig, ob das jetzt eine gute Idee ist oder nicht,

01:12:06.000 --> 01:12:08.000
weil es Leute gibt, die so was extra nicht wissen wollen.

01:12:08.000 --> 01:12:10.000
Allerdings bei Text, der nicht mehr gültig ist,

01:12:10.000 --> 01:12:13.000
fände ich das schon relativ wichtig, dass man das mitkriegt.

01:12:13.000 --> 01:12:16.000
Weil wenn der mir jetzt einfach nur vorgelesen wird,

01:12:16.000 --> 01:12:19.000
dann gehe ich ja davon aus, ja, das ist die Info hier.

01:12:19.000 --> 01:12:22.000
Ich muss bei etwas, was gelöscht wurde, was keine Gültigkeit mehr hat,

01:12:22.000 --> 01:12:25.000
muss ich eigentlich schon eine Möglichkeit bereitstellen,

01:12:25.000 --> 01:12:28.000
dass man das mitkriegt.

01:12:28.000 --> 01:12:31.000
Weil das ist eine extrem wichtige semantische Information,

01:12:31.000 --> 01:12:36.000
aus meiner Sicht ist irgendwas gültig oder ist nicht mehr gültig.

01:12:36.000 --> 01:12:43.000
Und generell zu diesem Thema hat Adrian Roselli,

01:12:43.000 --> 01:12:45.000
der ein total geiles Blog hat,

01:12:45.000 --> 01:12:47.000
wo es ganz viele tolle Accessibility-Artikel gibt,

01:12:47.000 --> 01:12:50.000
die gehen immer total in die Tiefe, die sind wahnsinnig toll geschrieben,

01:12:50.000 --> 01:12:53.000
das muss ich echt mal hier an der Stelle empfehlen, wirklich toll.

01:12:53.000 --> 01:12:56.000
Und der updatet die auch immer wieder, die Artikel.

01:12:56.000 --> 01:13:02.000
Also der ist jetzt hier von 2017 ursprünglich,

01:13:02.000 --> 01:13:05.000
aber im Januar diesen Jahres zum letzten Mal geupdatet worden.

01:13:05.000 --> 01:13:11.000
Also schon seit sieben Jahren wird der Artikel geupdatet,

01:13:11.000 --> 01:13:13.000
der sich eben genau mit diesem Thema beschäftigt,

01:13:13.000 --> 01:13:18.000
wie sollte man das tun und auf welche Elemente betrifft das

01:13:18.000 --> 01:13:20.000
und wie macht man das denn am besten,

01:13:20.000 --> 01:13:23.000
dass man den Screenreadern Informationen gibt

01:13:23.000 --> 01:13:26.000
zu semantischen Elementen,

01:13:26.000 --> 01:13:28.000
die aber in Screenreadern nicht announced werden.

01:13:28.000 --> 01:13:30.000
Aber was aber vielleicht wichtig ist,

01:13:30.000 --> 01:13:32.000
also zum Beispiel das Mark-Element wird hier noch angesprochen,

01:13:32.000 --> 01:13:34.000
Dell und Ins auch.

01:13:34.000 --> 01:13:37.000
Wobei die teilweise, glaube ich, mittlerweile unterstützt sind usw.

01:13:37.000 --> 01:13:40.000
Aber der Artikel ist wirklich super schön kurzweilig geschrieben

01:13:40.000 --> 01:13:42.000
mit vielen Beispielen.

01:13:42.000 --> 01:13:44.000
Gute Sache, wenn man sich dafür interessiert,

01:13:44.000 --> 01:13:47.000
auf jeden Fall den Artikel noch mal angucken.

01:13:47.000 --> 01:13:51.000
Und wie gesagt, der ist auch super auf dem aktuellen Stand.

01:13:51.000 --> 01:13:54.000
Gut, so, dann haben wir das.

01:13:54.000 --> 01:13:57.000
Dann gehen wir jetzt, warte mal.

01:13:57.000 --> 01:13:59.000
Ach nee, jetzt bist du noch mal dran.

01:13:59.000 --> 01:14:01.000
Hab grad schon gedacht, ich wär wieder.

01:14:01.000 --> 01:14:03.000
Weil ich hab später noch einen längeren Bock.

01:14:03.000 --> 01:14:04.000
Okay, okay.

01:14:04.000 --> 01:14:06.000
Ne, meins geht, glaube ich, relativ schnell.

01:14:06.000 --> 01:14:08.000
Und zwar das Samp-Element.

01:14:08.000 --> 01:14:11.000
Und wir hatten es darüber nämlich tatsächlich auch schon mal

01:14:11.000 --> 01:14:14.000
in dem ersten Teil der Inline-Text-Semantics,

01:14:14.000 --> 01:14:17.000
weil wir es da erwähnt haben, beim KBD-Element.

01:14:17.000 --> 01:14:23.000
Und zwar ist das Samp-Element ein Beispiel-Output

01:14:23.000 --> 01:14:26.000
von zum Beispiel einer Konsole.

01:14:26.000 --> 01:14:29.000
Also ähnlich wie das TT.

01:14:29.000 --> 01:14:33.000
Es wird auch standardmäßig mit dem Default-Font-Face

01:14:33.000 --> 01:14:36.000
für Monospace-Fonts ausgegeben.

01:14:36.000 --> 01:14:40.000
Und ja, es ist eben, also wenn ich jetzt ein Manual hab

01:14:40.000 --> 01:14:43.000
und ich will da zeigen, was da irgendwie der Bildschirm ausgibt,

01:14:43.000 --> 01:14:46.000
also Keyboard not found, press F1 to continue,

01:14:46.000 --> 01:14:49.000
steht da jetzt in der Demo auf MDN,

01:14:49.000 --> 01:14:51.000
dann kann ich das damit kennzeichnen.

01:14:51.000 --> 01:14:53.000
Und ich kann da drin dann eben wieder,

01:14:53.000 --> 01:14:55.000
also das F1 könnte ich jetzt zum Beispiel markieren

01:14:55.000 --> 01:14:59.000
mit diesem KBD-Element wieder, was dann für User-Input

01:14:59.000 --> 01:15:04.000
beziehungsweise zum Markieren von Input gedacht ist.

01:15:04.000 --> 01:15:08.000
Und da gibt's ein interessantes Beispiel unten noch.

01:15:08.000 --> 01:15:16.000
Da ist halt wirklich so ein Command-Line-Shell-Prompt quasi,

01:15:16.000 --> 01:15:20.000
wie soll man sagen, emuliert mit HTML-Elementen.

01:15:20.000 --> 01:15:23.000
Das heißt, ich hab einen Prompt, das ist jetzt in dem Fall,

01:15:23.000 --> 01:15:25.000
also ich hab außenrum das Samp-Element,

01:15:25.000 --> 01:15:27.000
und dann hab ich einen Span mit klares Prompt,

01:15:27.000 --> 01:15:29.000
das ist dann halt rot eingefärbt,

01:15:29.000 --> 01:15:32.000
das steht an der Benutzername mit Doppelpunkt-Tilde-Dollar,

01:15:32.000 --> 01:15:34.000
wie man das so kennt.

01:15:34.000 --> 01:15:37.000
Dann ist da drin ein KBD, das gibt dann eben die User-Eingabe da

01:15:37.000 --> 01:15:39.000
in der ersten Zeile quasi in dem Shell,

01:15:39.000 --> 01:15:41.000
was der User eingetippt hat.

01:15:41.000 --> 01:15:44.000
Und dann unten drunter wieder als normaler Text

01:15:44.000 --> 01:15:47.000
eben der Output von dem Shell-Script.

01:15:47.000 --> 01:15:52.000
Also auch sehr speziell wieder, auch wieder sehr dieses,

01:15:52.000 --> 01:15:56.000
wo kommt HTML her, wissenschaftliche Dokumentation,

01:15:56.000 --> 01:16:00.000
Beispiele, Manuals, wer erinnert sich vielleicht noch

01:16:00.000 --> 01:16:05.000
an die Hilfe-Seiten bei Windows, die mit F1 dann geöffnet wurden,

01:16:05.000 --> 01:16:08.000
auch Infogrammen dann, was ja auch HTML war,

01:16:08.000 --> 01:16:10.000
wo vielleicht tatsächlich solche Dinge am ehesten

01:16:10.000 --> 01:16:12.000
noch zum Einsatz gekommen sind.

01:16:12.000 --> 01:16:18.000
Ja, Unterstützung, sehr gut, auch wieder Chrome 1, Firefox 1,

01:16:18.000 --> 01:16:22.000
Safari 4, das sind so Dinge, die sind einfach,

01:16:22.000 --> 01:16:24.000
das kommt auch wirklich noch aus Urzeiten.

01:16:24.000 --> 01:16:30.000
Und wahrscheinlich haben wir das auch lange hinter uns gelassen,

01:16:30.000 --> 01:16:34.000
dass das für uns so eine großartige Nützlichkeit hat.

01:16:34.000 --> 01:16:40.000
Aber ja, wer viel Dokus schreibt und da irgendwelche Sample-Outputs hat,

01:16:40.000 --> 01:16:44.000
der wird glücklich sein, dass es dafür ein semantisches Element gibt.

01:16:44.000 --> 01:16:46.000
Da könnte man auch in der Liste mal gucken,

01:16:46.000 --> 01:16:49.000
das können wir jetzt generell vielleicht ab und zu mal machen,

01:16:49.000 --> 01:16:53.000
wie viele Leute das denn nutzen.

01:16:53.000 --> 01:16:58.000
Sam und KBD, mal anschauen.

01:16:58.000 --> 01:17:00.000
Ich könnte ja in der Zeit weitermachen.

01:17:00.000 --> 01:17:02.000
Wenn du fertig bist mit dem Sam, bist du fertig?

01:17:02.000 --> 01:17:03.000
Ja, dann gucke ich schon mal.

01:17:03.000 --> 01:17:07.000
Dann könnte ich mal weitermachen mit dem Small-Element.

01:17:07.000 --> 01:17:11.000
Und das wird überschrieben mit The-Side-Comment-Element.

01:17:11.000 --> 01:17:14.000
Ja, das ist wieder so ein Element, das es schon relativ lange gibt

01:17:14.000 --> 01:17:17.000
und das früher halt eigentlich für Styling eingesetzt wurde,

01:17:17.000 --> 01:17:21.000
für kleinen Text eben oder für kleineren Text.

01:17:21.000 --> 01:17:31.000
Und mittlerweile wurde es jetzt umgewidmet zu Text,

01:17:31.000 --> 01:17:35.000
der jetzt nicht so wichtig ist wie der eigentliche Text.

01:17:35.000 --> 01:17:38.000
Der Browser macht standardmäßig immer noch das,

01:17:38.000 --> 01:17:42.000
was er früher auch gemacht hat, nämlich den Text kleiner darstellen

01:17:42.000 --> 01:17:46.000
als den eigentlichen Text, also als die eigentliche Schriftgröße,

01:17:46.000 --> 01:17:48.000
die der Text normalerweise hätte.

01:17:48.000 --> 01:17:53.000
Und zwar innerhalb von diesen merkwürdigen CSS-Schriftgrößen-Angaben,

01:17:53.000 --> 01:17:56.000
die es ja gibt, Normal, Small, X-Small.

01:17:56.000 --> 01:17:58.000
Also wenn der Text jetzt normalerweise Small wäre,

01:17:58.000 --> 01:18:02.000
dann würde er dann X-Small dargestellt werden.

01:18:02.000 --> 01:18:04.000
Als Beispiel wird hier jetzt genannt,

01:18:04.000 --> 01:18:08.000
wofür man das verwenden könnte, wären Copyright-Informationen

01:18:08.000 --> 01:18:12.000
oder Legal-Text, wobei ich mir dann so denke,

01:18:12.000 --> 01:18:16.000
Legal-Text kleiner darstellen als was anderes.

01:18:16.000 --> 01:18:18.000
Ja, das ist eine gängige Praxis.

01:18:18.000 --> 01:18:21.000
Ob ich das gut finde? Nee, finde ich eher nicht so gut,

01:18:21.000 --> 01:18:24.000
weil das ja meistens die interessanten Sachen sind auf der Webseite.

01:18:24.000 --> 01:18:28.000
Je kleiner es ist, desto eher sollte man es vielleicht lesen.

01:18:28.000 --> 01:18:30.000
Ja, je kleiner und ausgegrauter der Text ist,

01:18:30.000 --> 01:18:32.000
umso wichtiger ist er wahrscheinlich.

01:18:32.000 --> 01:18:35.000
Wobei, das ist was, was man gerne versucht zu verstecken

01:18:35.000 --> 01:18:37.000
oder was gerne versucht wird zu verstecken.

01:18:37.000 --> 01:18:40.000
Durch Drücken dieses Buttons, erklären Sie sich damit einverstanden,

01:18:40.000 --> 01:18:43.000
dass uns Ihre Erstgeborenes gehört?

01:18:43.000 --> 01:18:47.000
Na ja, dann ist das wenigstens irgendwo unter.

01:18:47.000 --> 01:18:49.000
Genau, so.

01:18:49.000 --> 01:18:52.000
Hat auch keine besondere ARIA-Rolle, Small.

01:18:52.000 --> 01:18:56.000
Also, ja, ich weiß nicht so genau, ob ich das jetzt ...

01:18:56.000 --> 01:19:01.000
Ich glaube, ich würde dafür versuchen, was anderes zu finden.

01:19:01.000 --> 01:19:06.000
Ich weiß auch nicht, ob man dafür jetzt das Small-Element nehmen sollte,

01:19:06.000 --> 01:19:11.000
weil letzten Endes würde ich das hauptsächlich für den Style verwenden

01:19:11.000 --> 01:19:14.000
und dafür ist es eigentlich nicht mehr gedacht.

01:19:14.000 --> 01:19:16.000
Na ja, wie auch immer.

01:19:16.000 --> 01:19:18.000
So, das nächste Element.

01:19:18.000 --> 01:19:22.000
Wir sind immer noch bei S und da kommen auch noch ein paar.

01:19:22.000 --> 01:19:26.000
Ist das Span-Element das allseits Geliebte?

01:19:26.000 --> 01:19:28.000
Warum das so?

01:19:28.000 --> 01:19:30.000
Es ist ja eins meiner Lieblingselemente,

01:19:30.000 --> 01:19:32.000
weil man es nämlich, wenn man nicht ...

01:19:32.000 --> 01:19:34.000
Und es steht sogar, interessanterweise,

01:19:34.000 --> 01:19:36.000
ich habe das so gedacht, das habe ich aufgeschrieben,

01:19:36.000 --> 01:19:39.000
was mir zum Span-Element einfällt und dann lese ich die MDM und denke so,

01:19:39.000 --> 01:19:41.000
ah ja, da steht es auch nochmal genauso drin.

01:19:41.000 --> 01:19:45.000
Wenn dir gar nichts anderes einfällt und du einen Rapper brauchst für irgendwas,

01:19:45.000 --> 01:19:48.000
der aber überhaupt gar keine semantische Informationen hat,

01:19:48.000 --> 01:19:52.000
sondern einfach nur ein dies Ding möchte ich jetzt rappen,

01:19:52.000 --> 01:19:55.000
zum Beispiel um irgendeinen Style anzuwenden.

01:19:55.000 --> 01:20:00.000
Als Beispiel ist mir eingefallen, auf unserer Podcast-Startseite,

01:20:00.000 --> 01:20:04.000
unser WWSYV, wo wir sind, das ist vorne Schriftzug,

01:20:04.000 --> 01:20:08.000
wo wir ja was Lustiges mit den Buchstaben machen,

01:20:08.000 --> 01:20:10.000
wenn man mit der Maus drüber fährt.

01:20:10.000 --> 01:20:13.000
Ich weiß gar nicht, ob das alle wissen, was das passiert.

01:20:13.000 --> 01:20:15.000
Eines unserer Easter Eggs.

01:20:15.000 --> 01:20:18.000
Eines unserer fünf Easter Eggs oder so.

01:20:18.000 --> 01:20:22.000
Wer sie alle findet, hat sie alle gefunden.

01:20:22.000 --> 01:20:24.000
Glückwunsch.

01:20:24.000 --> 01:20:27.000
Es gibt ein paar Easter Eggs bei uns zu finden, das ist eines davon.

01:20:27.000 --> 01:20:29.000
Man muss dazu vielleicht sagen, ich weiß nicht,

01:20:29.000 --> 01:20:31.000
ob wir das schon mal erwähnt haben, das gab es schon,

01:20:31.000 --> 01:20:34.000
bevor es überhaupt die erste Zeile Code für unsere Seite selbst gab.

01:20:34.000 --> 01:20:40.000
Das habe ich an dem Abend, wo wir uns den Namen auch drauf festgelegt haben,

01:20:40.000 --> 01:20:42.000
habe ich das glaube ich daheim noch gebastelt.

01:20:42.000 --> 01:20:44.000
Ja.

01:20:44.000 --> 01:20:47.000
Es war auch in einer ganz anderen Schriftart und alles Mögliche,

01:20:47.000 --> 01:20:49.000
das haben wir noch mehrfach umgebaut.

01:20:49.000 --> 01:20:51.000
Aber es hat es reingeschafft.

01:20:51.000 --> 01:20:53.000
Das ist auch der Grund, warum das ii klein geschrieben ist.

01:20:53.000 --> 01:20:55.000
Weil sich das jemand schon mal gefragt hat.

01:20:55.000 --> 01:21:03.000
Ja, es ist Visual Candy und dafür muss man halt eben,

01:21:03.000 --> 01:21:05.000
und ja, wir haben auch dafür gesorgt, dass es am Ende noch,

01:21:05.000 --> 01:21:08.000
weil das ist wichtig, wenn man jetzt einzelne Buchstaben rappt,

01:21:08.000 --> 01:21:11.000
wenn man auf so eine Idee kommt, dann muss man schon dafür sorgen,

01:21:11.000 --> 01:21:13.000
dass das auf dem Screenreader noch halbwegs vernünftig lesbar ist.

01:21:13.000 --> 01:21:15.000
Wir haben dem Ding dann noch ein ARIA-Label gegeben,

01:21:15.000 --> 01:21:17.000
damit es eben wieder funktioniert.

01:21:17.000 --> 01:21:20.000
Weil ansonsten kriegst du einzelne Buchstaben vorgelesen,

01:21:20.000 --> 01:21:22.000
wenn du die rappst in einem Span oder es ist egal,

01:21:22.000 --> 01:21:24.000
in welchem Tag du die rappst.

01:21:24.000 --> 01:21:26.000
Das sollte man sich gut überlegen.

01:21:26.000 --> 01:21:28.000
Ich habe noch einen anderen Real-Life-Anwendungsfall.

01:21:28.000 --> 01:21:30.000
Oh.

01:21:30.000 --> 01:21:32.000
Auch wieder von dieser Buchungsgeschichte.

01:21:32.000 --> 01:21:35.000
Und zwar gibt es das Buchungsformular in zwei Varianten.

01:21:35.000 --> 01:21:39.000
Einmal direkt eine Reservierung und einmal ist es nur eine Anfrage.

01:21:39.000 --> 01:21:42.000
Und dementsprechend sind manche Texte in dem Formular dann anders.

01:21:42.000 --> 01:21:45.000
Aber ich wollte jetzt nicht das komplette Formular duplizieren,

01:21:45.000 --> 01:21:47.000
weil es macht ansonsten wirklich genau das Gleiche,

01:21:47.000 --> 01:21:49.000
nur mal mit mehr und mal mit weniger Daten.

01:21:49.000 --> 01:21:52.000
Und deswegen sollte auch der Button einen anderen Text haben.

01:21:52.000 --> 01:21:55.000
Und dann gibt es da drin einfach zwei Spans,

01:21:55.000 --> 01:21:57.000
und die haben jeweils eine Klasse.

01:21:57.000 --> 01:21:59.000
Und je nachdem, was das übergeordnete Formularelement

01:21:59.000 --> 01:22:01.000
für ein Data-Attribut hat,

01:22:01.000 --> 01:22:04.000
wird es mit CSS eben das eine oder das andere ausgeblendet.

01:22:04.000 --> 01:22:06.000
Oder eingeblendet.

01:22:06.000 --> 01:22:10.000
Ja, für diesen Fall, da gibt es ja 25 Millionen Lösungen,

01:22:10.000 --> 01:22:14.000
wie man das machen kann, dass man den Text von einem Button ändert,

01:22:14.000 --> 01:22:16.000
abhängig vom State.

01:22:16.000 --> 01:22:18.000
Und ich bin immer hin- und hergerissen.

01:22:18.000 --> 01:22:21.000
Da würde ich mir einen Standard für wünschen.

01:22:21.000 --> 01:22:23.000
Dafür würde ich mir einen Standard wünschen,

01:22:23.000 --> 01:22:25.000
weil ich mache es manchmal so.

01:22:25.000 --> 01:22:28.000
Es gibt zwei Elemente, wie du gerade beschrieben hast.

01:22:28.000 --> 01:22:30.000
Manchmal mache ich es mit Data-Attributen,

01:22:30.000 --> 01:22:32.000
dass der Text getauscht wird.

01:22:32.000 --> 01:22:34.000
Und damit Content-Attribute.

01:22:34.000 --> 01:22:37.000
Das ist aber auch blöd, weil wenn man mit ARIA-Live arbeitet,

01:22:37.000 --> 01:22:40.000
das heißt, man möchte, dass der Screenreader live mitkriegt,

01:22:40.000 --> 01:22:42.000
dass sich was ändert auf der Seite.

01:22:42.000 --> 01:22:45.000
Dann geht es aber nicht, wenn man es auf dem Element selbst vergibt,

01:22:45.000 --> 01:22:47.000
sondern es muss der Wrapper sein.

01:22:47.000 --> 01:22:50.000
Aber wenn ich jetzt den Button nehme und dem ARIA-Live gebe,

01:22:50.000 --> 01:22:53.000
und da zwei Elemente drin habe, dann würde das funktionieren.

01:22:53.000 --> 01:22:55.000
Dann wäre das nämlich der Wrapper.

01:22:55.000 --> 01:22:57.000
Das ist ein Pain in the butt.

01:22:57.000 --> 01:23:00.000
Wie oft habe ich solche Konstrukte schon gebaut?

01:23:00.000 --> 01:23:02.000
Und jedes Mal überlege ich, wie mache ich es jetzt?

01:23:02.000 --> 01:23:04.000
Das wäre, glaube ich, auch anders.

01:23:04.000 --> 01:23:06.000
Dafür hätte ich gerne einen Standard.

01:23:06.000 --> 01:23:08.000
Das wäre ein Webstandard, den ich gerne hätte.

01:23:08.000 --> 01:23:10.000
Und zwar changing content von ...

01:23:10.000 --> 01:23:12.000
Ja, sich ändernde Texte von einem Element

01:23:12.000 --> 01:23:15.000
und halt im Zweifelsfall vom Button, aber gerne auch andere.

01:23:15.000 --> 01:23:17.000
Wie mache ich das?

01:23:17.000 --> 01:23:19.000
Zwischen verschiedenen States hin- und herschalten,

01:23:19.000 --> 01:23:21.000
dass ich da mir keine Gedanken mehr drum machen muss.

01:23:21.000 --> 01:23:23.000
Das wäre schön.

01:23:23.000 --> 01:23:25.000
Das war nur der kleine Ausschweif.

01:23:25.000 --> 01:23:28.000
Beim Ausschweifen sind noch kurz der Nachtrag zu Samp.

01:23:28.000 --> 01:23:31.000
Also Samp überraschenderweise 0,0 Prozent.

01:23:31.000 --> 01:23:35.000
Und sogar das KBD-Element hat immerhin 0,1 Prozent.

01:23:35.000 --> 01:23:40.000
Ja. Na gut. Danke fürs Nachschauen.

01:23:40.000 --> 01:23:43.000
Vielleicht noch einen kurzen Nachtrag zum Span-Element.

01:23:43.000 --> 01:23:49.000
Was noch ein Anwendungsfall ist, der mir noch eingefallen ist dazu,

01:23:49.000 --> 01:23:52.000
ist zum Beispiel, wenn ich bestimmte Wörter

01:23:52.000 --> 01:23:54.000
in einer anderen Sprache auszeichnen möchte,

01:23:54.000 --> 01:23:57.000
also das Lang-Attribut irgendwo dran klatschen möchte,

01:23:57.000 --> 01:24:00.000
dann brauche ich ja natürlich irgendeinen Element,

01:24:00.000 --> 01:24:02.000
mit dem ich das mache.

01:24:02.000 --> 01:24:04.000
Und in dem Fall möchte ich ja wahrscheinlich

01:24:04.000 --> 01:24:06.000
keine andere Semantik haben,

01:24:06.000 --> 01:24:09.000
sondern einfach nur sagen, das ist jetzt in einer anderen Sprache.

01:24:09.000 --> 01:24:11.000
Dafür eignet sich das auch.

01:24:11.000 --> 01:24:13.000
Also immer dann, wenn ich einen Rapper brauche,

01:24:13.000 --> 01:24:16.000
einen Inline-Rapper, der keinerlei semantische Informationen,

01:24:16.000 --> 01:24:19.000
keine weiteren semantischen Informationen enthält,

01:24:19.000 --> 01:24:23.000
dann ist das Span-Element deine Freundin.

01:24:23.000 --> 01:24:26.000
Spannend, würde ich sagen.

01:24:26.000 --> 01:24:30.000
Nicht schlecht, nicht schlecht.

01:24:30.000 --> 01:24:33.000
Okay, bevor ich mir jetzt den Mund komplett fusselig rede,

01:24:33.000 --> 01:24:35.000
nee, das mache ich jetzt noch kurz.

01:24:35.000 --> 01:24:37.000
Die Fusseln kommen gleich raus.

01:24:37.000 --> 01:24:40.000
Ich habe noch zwei, aber die gehören zusammen.

01:24:40.000 --> 01:24:43.000
Nämlich das Sub und das Sub-Element.

01:24:43.000 --> 01:24:45.000
Das Sub-Woofer-Element.

01:24:45.000 --> 01:24:47.000
Yo, Sub.

01:24:47.000 --> 01:24:49.000
Und das Sub, ach so, Moment.

01:24:49.000 --> 01:24:52.000
Ach so, und das Sub ist das Stand-Up-Paddling-Element.

01:24:52.000 --> 01:24:54.000
Das kennt man.

01:24:54.000 --> 01:24:56.000
Genau.

01:24:56.000 --> 01:25:00.000
Und das Sub-Woofer- und das Stand-Up-Paddling-Element.

01:25:00.000 --> 01:25:02.000
Also hier, bitteschön.

01:25:02.000 --> 01:25:04.000
Nein, natürlich, das ist Quatsch.

01:25:04.000 --> 01:25:07.000
Es geht um Sub-Script und Super-Script.

01:25:07.000 --> 01:25:09.000
Und das sind Elemente,

01:25:09.000 --> 01:25:13.000
die früher auch nur für Styling eigentlich waren.

01:25:13.000 --> 01:25:19.000
Nämlich um Text tiefgestellt oder hochgestellt darzustellen.

01:25:19.000 --> 01:25:22.000
Und letzten Endes sind sie eigentlich heute

01:25:22.000 --> 01:25:26.000
auch für nichts wirklich anderes da.

01:25:26.000 --> 01:25:29.000
Beispiele wären zum Beispiel Texttiefstellen,

01:25:29.000 --> 01:25:31.000
also das Sub-Element.

01:25:31.000 --> 01:25:35.000
Zum Beispiel chemische Formeln,

01:25:35.000 --> 01:25:38.000
wo zum Beispiel die Zahlen tiefgestellt sind.

01:25:38.000 --> 01:25:43.000
Hier die Beispiele in der MDN C8H10N4O2.

01:25:43.000 --> 01:25:46.000
Angeblich ist das die Strukturformel für Koffein.

01:25:46.000 --> 01:25:48.000
Habe ich gerade gelernt.

01:25:48.000 --> 01:25:51.000
Da habe ich auch gedacht, das muss doch was Nerdiges sein.

01:25:51.000 --> 01:25:54.000
Und ja, natürlich ist es was Nerdiges.

01:25:54.000 --> 01:26:00.000
Sollte aber nur aus typografischen Gründen verwendet werden.

01:26:00.000 --> 01:26:05.000
Und es hat tatsächlich dann eigentlich keine richtige Semantik.

01:26:05.000 --> 01:26:08.000
Das ist dann so, da steht viel Text,

01:26:08.000 --> 01:26:10.000
aber letzten Endes wird nur erklärt,

01:26:10.000 --> 01:26:13.000
dass man es nur aus typografischen Gründen verwenden soll.

01:26:13.000 --> 01:26:15.000
Ich wüsste auch gar nicht,

01:26:15.000 --> 01:26:17.000
wie man es verwenden haben will.

01:26:17.000 --> 01:26:19.000
Ich sage ja C8H10N4O2.

01:26:19.000 --> 01:26:24.000
Ich sage ja nicht tiefergestellt 8H, tiefergestellt 10.

01:26:24.000 --> 01:26:26.000
Also statt hoch 3, tief 3.

01:26:26.000 --> 01:26:28.000
Ja, tief 8.

01:26:28.000 --> 01:26:30.000
C, tief 8, H, tief 10.

01:26:30.000 --> 01:26:32.000
Genau, und du sprichst es schon an.

01:26:32.000 --> 01:26:37.000
Hochzahlen, das Sub-Element, also das Stand-up-Paddling-Element,

01:26:37.000 --> 01:26:42.000
das ist tatsächlich für Hochzahlen oder sowas gedacht.

01:26:42.000 --> 01:26:46.000
Also gibt es ja in verschiedenen Varianten.

01:26:46.000 --> 01:26:50.000
Oder, was auch noch ein beliebtes Beispiel ist,

01:26:50.000 --> 01:26:56.000
sind englische Daten, also The Fifth oder sowas.

01:26:56.000 --> 01:27:00.000
Da wird ja oft nicht einfach das TH hintendran geschrieben,

01:27:00.000 --> 01:27:03.000
sondern so ein bisschen kleiner hochgestellt.

01:27:03.000 --> 01:27:06.000
Also Ordinalzahlen, heißt das, glaube ich, auf schlau.

01:27:06.000 --> 01:27:08.000
Genau, ganz korrekt, Ordinalzahlen.

01:27:08.000 --> 01:27:10.000
Also das 3rd mit 3rd und sowas dann.

01:27:10.000 --> 01:27:13.000
Ich eigentlich wollte aber jetzt unsere Zuhörerschaft

01:27:13.000 --> 01:27:15.000
damit nicht überfordern.

01:27:15.000 --> 01:27:18.000
Jetzt habe ich auch noch alle beleidigt, Entschuldigung.

01:27:18.000 --> 01:27:20.000
Nein, ich habe das auch gelesen.

01:27:20.000 --> 01:27:22.000
Aber ja, danke für den Hinweis.

01:27:22.000 --> 01:27:24.000
Ähm, genau.

01:27:24.000 --> 01:27:27.000
Eigentlich habe ich damit jetzt schon alles gesagt.

01:27:27.000 --> 01:27:29.000
Vielleicht noch ein ...

01:27:29.000 --> 01:27:31.000
Ja, da wäre jetzt noch interessant,

01:27:31.000 --> 01:27:34.000
weil wir gerade gescherzt haben hier bei tief 5, tief 10.

01:27:34.000 --> 01:27:37.000
Wie ist es denn mit, also wird das jetzt irgendwie

01:27:37.000 --> 01:27:39.000
E gleich mc² oder so?

01:27:39.000 --> 01:27:42.000
Oder heißt das dann wirklich E gleich mc²?

01:27:42.000 --> 01:27:44.000
Äh, oh.

01:27:44.000 --> 01:27:47.000
Ausgesprochen. Also das wäre jetzt interessant.

01:27:47.000 --> 01:27:50.000
Aber ich weiß nicht, ob da so was da steht.

01:27:50.000 --> 01:27:52.000
Das ist eine sehr gute Frage.

01:27:52.000 --> 01:27:54.000
Da würde ich tippen, bei solchen Sachen

01:27:54.000 --> 01:27:57.000
kommt es wahrscheinlich auf den Screenreader an.

01:27:57.000 --> 01:28:00.000
Aber das kann ich dir tatsächlich jetzt auswendig sagen.

01:28:00.000 --> 01:28:02.000
Da die Anwendungsfälle ja divers sind,

01:28:02.000 --> 01:28:05.000
kann man da eigentlich gar nichts einheitlich sagen.

01:28:05.000 --> 01:28:07.000
Ja, das will man ja auch nicht.

01:28:07.000 --> 01:28:09.000
Also pass auf, ich bin jetzt niemand,

01:28:09.000 --> 01:28:12.000
der den Screenreader im Daily-Business benutzt.

01:28:12.000 --> 01:28:15.000
Ich nutze ihn nur zum Testen, in Anführungsstrichen.

01:28:15.000 --> 01:28:17.000
Aber das relativ häufig.

01:28:17.000 --> 01:28:19.000
Meiner Erfahrung nach ist es so,

01:28:19.000 --> 01:28:21.000
dass Screenreader Wörterbücher haben

01:28:21.000 --> 01:28:24.000
und versuchen anhand von bestimmten ...

01:28:24.000 --> 01:28:27.000
Ja, da stehen dann quasi bestimmte Formulierungen drin,

01:28:27.000 --> 01:28:29.000
wenn eine bestimmte Zeichenfolge kommt,

01:28:29.000 --> 01:28:31.000
was das wahrscheinlich ist.

01:28:31.000 --> 01:28:34.000
Ich hatte jetzt zum Beispiel vorhin den Fall,

01:28:34.000 --> 01:28:36.000
mit meiner Demo,

01:28:36.000 --> 01:28:39.000
das habe ich mir im Screenreader vorlesen lassen,

01:28:39.000 --> 01:28:41.000
die Demo von Q.

01:28:41.000 --> 01:28:44.000
Und da ist ein Steve Jobs Zitat drin.

01:28:44.000 --> 01:28:47.000
Und interessanterweise, in dem Augenblick,

01:28:47.000 --> 01:28:50.000
als ich die Stimme umgestellt habe auf Deutsch,

01:28:50.000 --> 01:28:53.000
oder das mir halt auf Deutsch habe vorlesen lassen,

01:28:53.000 --> 01:28:55.000
da steht am Ende

01:28:55.000 --> 01:28:57.000
bla, bla, bla, bla,

01:28:57.000 --> 01:29:00.000
the people that actually do, Punkt.

01:29:00.000 --> 01:29:03.000
Und was der deutsche Screenreader vorgelesen hat,

01:29:03.000 --> 01:29:05.000
war hier, actually Donnerstag.

01:29:05.000 --> 01:29:07.000
Ah, das ist witzig.

01:29:07.000 --> 01:29:09.000
Mein Navi sagt zum Beispiel,

01:29:09.000 --> 01:29:12.000
wenn ein Straßenschild kommt mit Karlsruhe-Haxfeld,

01:29:12.000 --> 01:29:15.000
und das ist ja oft abgekürzt als K.A. Haxfeld,

01:29:15.000 --> 01:29:17.000
oder Stuperich-Dudensee.

01:29:17.000 --> 01:29:20.000
Ich meinte, das können wir ja mal für Haxfeld machen.

01:29:20.000 --> 01:29:22.000
Mein Navi ist aber auf Englisch.

01:29:22.000 --> 01:29:25.000
Dann kommt der immer, Kiloampere Haxfeld.

01:29:25.000 --> 01:29:27.000
Ja, genau.

01:29:27.000 --> 01:29:30.000
Das ist zumindest so, wie ich's kenne.

01:29:30.000 --> 01:29:32.000
Screenreader haben Wörterbücher

01:29:32.000 --> 01:29:34.000
und die versuchen dann, zu erraten.

01:29:34.000 --> 01:29:36.000
Ich nehme jetzt mal an,

01:29:36.000 --> 01:29:39.000
sowas E ist gleich mc², könnte ich mir vorstellen.

01:29:39.000 --> 01:29:42.000
Dass er dann mc² dann tatsächlich sagt auf Englisch.

01:29:42.000 --> 01:29:44.000
Oder generell, wenn eine 2 oben steht.

01:29:44.000 --> 01:29:47.000
Bei den Ordinalzahlen dann septem auf Französisch

01:29:47.000 --> 01:29:50.000
und seventh auf Englisch, dass er dann schlau genug ist.

01:29:50.000 --> 01:29:52.000
Aber wahrscheinlich erkennt er nicht,

01:29:52.000 --> 01:29:55.000
dass das hochgestellt ist, würde ich jetzt mal tippen.

01:29:55.000 --> 01:29:57.000
Deswegen ist er drauf angewiesen.

01:29:57.000 --> 01:30:00.000
Wenn jetzt einfach nur irgendwo eine 2 hinten dran steht,

01:30:00.000 --> 01:30:03.000
zweifle ich jetzt, dass es das erkennen würde.

01:30:03.000 --> 01:30:06.000
Aber bitte, falls ihr da andere Erfahrungen gemacht habt

01:30:06.000 --> 01:30:10.000
mit Screenreadern und es besser wisst als ich,

01:30:10.000 --> 01:30:14.000
dann bitte gern mal Bescheid sagen, weil das ist superspannend.

01:30:14.000 --> 01:30:16.000
Das würde mich auch interessieren.

01:30:16.000 --> 01:30:20.000
Da gibt's ganz oft in Demos oder in Tests, die ich gemacht hab,

01:30:20.000 --> 01:30:22.000
vor allem interessant ist es dann,

01:30:22.000 --> 01:30:26.000
wenn Menschen mir beim Accessibility-Screenreadertest

01:30:26.000 --> 01:30:28.000
zuschauen und zuhören.

01:30:28.000 --> 01:30:30.000
Und ich deren Tools teste,

01:30:30.000 --> 01:30:33.000
mir fällt so was meistens schon gar nicht mehr auf.

01:30:33.000 --> 01:30:35.000
Weil ich sag, ja, das kommt vor,

01:30:35.000 --> 01:30:37.000
dass so komische Sachen vorgelesen werden.

01:30:37.000 --> 01:30:39.000
Aber meistens kann ich halt,

01:30:39.000 --> 01:30:42.000
weil ich jetzt schon öfter ein Screenreader gehört hab,

01:30:42.000 --> 01:30:44.000
ich hör das schon gar nicht mehr.

01:30:44.000 --> 01:30:48.000
Ich denk dann so, haja, da hat er jetzt wieder was Falsches erkannt.

01:30:48.000 --> 01:30:51.000
Aber Menschen, die zum ersten Mal ein Screenreader hören,

01:30:51.000 --> 01:30:53.000
denen fällt es sofort immer auf.

01:30:53.000 --> 01:30:56.000
Und die sagen immer, was hat er denn da gesagt?

01:30:56.000 --> 01:30:58.000
Ja, was, wieso denn?

01:30:58.000 --> 01:31:00.000
Also, mir fällt's oft gar nicht mehr auf.

01:31:00.000 --> 01:31:02.000
Ich so denk, haja, okay, gut,

01:31:02.000 --> 01:31:04.000
es versucht jetzt halt irgendwie da zu raten.

01:31:04.000 --> 01:31:06.000
Und dann hat's jetzt halt mal falsch geraten.

01:31:06.000 --> 01:31:09.000
Aber da hat tatsächlich dann schon mal jemand gesagt,

01:31:09.000 --> 01:31:11.000
weil da ging's irgendwie um Markennamen,

01:31:11.000 --> 01:31:13.000
irgendwas, was mit der Marke zu tun hatte,

01:31:13.000 --> 01:31:16.000
was der Person so wichtig war, dass sie gesagt hat, nee,

01:31:16.000 --> 01:31:19.000
da müssen wir jetzt ARIA-Label einbauen dafür.

01:31:19.000 --> 01:31:21.000
Weil das können wir auf keinen Fall zulassen,

01:31:21.000 --> 01:31:24.000
dass der Screenreader das an der Stelle falsch ausspricht.

01:31:24.000 --> 01:31:27.000
Und hat gesagt, nee, geht nicht, das muss richtig ausgesprochen werden.

01:31:27.000 --> 01:31:30.000
Da gibt's jetzt ein ARIA-Label, wo das dann so reingeschrieben wird,

01:31:30.000 --> 01:31:32.000
wie ich will, dass das ausgesprochen wird.

01:31:32.000 --> 01:31:34.000
Das hab ich tatsächlich auf unserer Seite,

01:31:34.000 --> 01:31:36.000
also von meiner Firma gemacht.

01:31:36.000 --> 01:31:39.000
Das ist so ein eigenes gestricktes System, was wir da haben.

01:31:39.000 --> 01:31:41.000
Und da wird automatisch das Wort,

01:31:41.000 --> 01:31:43.000
also 4-8-Design, unser Firmenname,

01:31:43.000 --> 01:31:46.000
auf der deutschen Seite tatsächlich wird sichergestellt,

01:31:46.000 --> 01:31:49.000
dass das 4-8-Design ausgesprochen wird.

01:31:49.000 --> 01:31:53.000
Während wir auf Englisch halt 48-Design sagen.

01:31:53.000 --> 01:31:56.000
Und das wird da unterschieden, je nachdem, welche Sprache gewählt ist.

01:31:56.000 --> 01:31:58.000
Ich seh's gerade.

01:31:58.000 --> 01:32:00.000
Ist da ein anderes Label drin, 48-Design,

01:32:00.000 --> 01:32:02.000
dann auch mit dem englischen Lang Tag,

01:32:02.000 --> 01:32:05.000
damit das auch wirklich auf Englisch dann ausgesprochen wird,

01:32:05.000 --> 01:32:07.000
wenn's denn funktioniert.

01:32:07.000 --> 01:32:10.000
Und halt wirklich auch 48-Design und nicht Fear Act Design.

01:32:10.000 --> 01:32:14.000
Damit eben unser Firmenname als Brand, als Marke,

01:32:14.000 --> 01:32:16.000
da richtig ausgesprochen wird.

01:32:16.000 --> 01:32:19.000
Ja, nice. Not bad.

01:32:19.000 --> 01:32:24.000
Also, aber damit bin ich fertig mit Zopp und Zopp.

01:32:24.000 --> 01:32:26.000
Gut.

01:32:26.000 --> 01:32:28.000
Und gebe zurück ins Funkhaus.

01:32:28.000 --> 01:32:30.000
Jetzt wird's nämlich auch Zeit.

01:32:30.000 --> 01:32:36.000
Wir kommen nämlich zum Time Element.

01:32:36.000 --> 01:32:40.000
Und da gibt's jetzt ein bisschen mehr dazu zu sagen.

01:32:40.000 --> 01:32:43.000
Weil da auch wieder was dabei war, was ich so noch nicht kannte.

01:32:43.000 --> 01:32:45.000
Also, ich kannte das Time Element,

01:32:45.000 --> 01:32:48.000
und ich hab das auch schon mal irgendwo bei irgendeinem,

01:32:48.000 --> 01:32:50.000
ich glaub, auch bei unserer Webseite,

01:32:50.000 --> 01:32:52.000
weil wir haben da ja auch News,

01:32:52.000 --> 01:32:54.000
und da wird das dann auch irgendwie mit Markup,

01:32:54.000 --> 01:32:56.000
wann das veröffentlicht wurde und so, dargestellt.

01:32:56.000 --> 01:32:58.000
Und es ist eigentlich nicht nur Time.

01:32:58.000 --> 01:33:01.000
Also, eigentlich könnte das korrekterweise DateTime heißen.

01:33:01.000 --> 01:33:05.000
Aber es gibt ein DateTime-Attribut auf Time.

01:33:05.000 --> 01:33:08.000
Gut, und auch ein Datum ist ja im Endeffekt nichts anderes

01:33:08.000 --> 01:33:11.000
als ein Zeitpunkt in diesem komischen Konstrukt,

01:33:11.000 --> 01:33:13.000
das wir Menschen Zeit nennen.

01:33:13.000 --> 01:33:16.000
Und dementsprechend kann ich in dem DateTime-Attribut

01:33:16.000 --> 01:33:19.000
auch Daten, also ein komplettes Datum,

01:33:19.000 --> 01:33:23.000
Jahreszahl, Monat, Tag, oder auch nur eine Uhrzeit,

01:33:23.000 --> 01:33:27.000
oder so einen kompletten String mit hinten dran,

01:33:27.000 --> 01:33:30.000
dieses Z für Zulu, Timecode,

01:33:30.000 --> 01:33:33.000
oder sogar irgendwelche mit Bindestrich getrennt,

01:33:33.000 --> 01:33:37.000
vierstellige oder mit jeweils zweistellig,

01:33:37.000 --> 01:33:40.000
mit Doppelpunkt getrennt, die Uhrzeit noch mal,

01:33:40.000 --> 01:33:44.000
als, na, sag schnell, also GMT-Abweichung zum Beispiel.

01:33:44.000 --> 01:33:48.000
Ja, bitte diese UTC-Abweichung angeben.

01:33:48.000 --> 01:33:52.000
So, und damit lässt sich halt ein maschinenlesbarer Zeitstempel

01:33:52.000 --> 01:33:54.000
in irgendeiner Form hinterlegen.

01:33:54.000 --> 01:33:57.000
Ich glaub, ich hab schon gefunden, was da verrückt ist.

01:33:57.000 --> 01:34:00.000
Genau, auf ndn gibt's nämlich eine ganze Auflistung hier,

01:34:00.000 --> 01:34:03.000
Valid DateTime Values, also eine einfache Jahreszahl geht.

01:34:03.000 --> 01:34:06.000
Das geht auch eine Jahreszahl und einen Monat, aber kein Datum.

01:34:06.000 --> 01:34:09.000
Also in diesem 4-2-2 mit Bindestrich getrennt Konstrukt,

01:34:09.000 --> 01:34:11.000
diese ISO-Zeit.

01:34:11.000 --> 01:34:15.000
Da geht sogar ein jahresloser Datumstring,

01:34:15.000 --> 01:34:19.000
also 11 minus 18 ist zum Beispiel erlaubt.

01:34:19.000 --> 01:34:22.000
Das ist natürlich für Amerikaner wieder verwirrend,

01:34:22.000 --> 01:34:24.000
weil die jetzt 1811 schreiben würden.

01:34:24.000 --> 01:34:25.000
Aber ...

01:34:25.000 --> 01:34:27.000
Aber endlich, endlich hat man jemand ...

01:34:27.000 --> 01:34:30.000
Nee, die Amis machen ja, nee, die schreiben ja 1118.

01:34:30.000 --> 01:34:32.000
Genau, wir schreiben 18.11.

01:34:32.000 --> 01:34:35.000
Also in dem Fall ist es sogar für die Amis richtig.

01:34:35.000 --> 01:34:37.000
Und ich find ja, diese ISO-Darstellung

01:34:37.000 --> 01:34:40.000
ist für mich sowieso die einzig wahre Datumsangabe,

01:34:40.000 --> 01:34:41.000
also dieses ...

01:34:41.000 --> 01:34:44.000
Du meinst jetzt hier 2011 minus, bla, minus.

01:34:44.000 --> 01:34:45.000
Genau.

01:34:45.000 --> 01:34:47.000
24 minus 07 minus 17 für heute, ja?

01:34:47.000 --> 01:34:50.000
Und genau, mit Minus, das ist aus meiner Sicht die Wahrheit.

01:34:50.000 --> 01:34:52.000
Genau, dann ist es nämlich, weil dann,

01:34:52.000 --> 01:34:55.000
wenn ich's mit Slash mach, kann's auch wieder sein,

01:34:55.000 --> 01:34:57.000
hab ich jetzt Datum oder Monat zuerst, ne?

01:34:57.000 --> 01:34:59.000
Oder Anascore liest sich nicht so gut, find ich.

01:34:59.000 --> 01:35:01.000
Also ich finde, das ist die einzig wahre ...

01:35:01.000 --> 01:35:03.000
Ja, da weiß jeder, was gemeint ist.

01:35:03.000 --> 01:35:05.000
Und dann gibt's hier interessanterweise auch

01:35:05.000 --> 01:35:08.000
Valid Weekstring, also 2011 minus W47.

01:35:08.000 --> 01:35:11.000
Also, die Kalenderwoche kann ich sogar markieren.

01:35:11.000 --> 01:35:15.000
Ich kann hinten noch hinter eine Uhrzeit mit Punkt und drei Stellen

01:35:15.000 --> 01:35:18.000
kann ich die Hundertstelsekunden noch mit angeben.

01:35:18.000 --> 01:35:21.000
Nee, was sind's? Tausendstelsekunden sind's dann, oder?

01:35:21.000 --> 01:35:24.000
Ja, jedenfalls Bruchteile von Sekunden mit angeben.

01:35:24.000 --> 01:35:26.000
Zettelhundertstel, tausendstel, ja.

01:35:26.000 --> 01:35:30.000
Dann, ja, also dieses ISO-Ding eben mit einem T dazwischen

01:35:30.000 --> 01:35:33.000
und Z hinten oder nicht, oder mit Leerzeichen getrennt,

01:35:33.000 --> 01:35:35.000
Datum und Uhrzeit, das geht alles.

01:35:35.000 --> 01:35:38.000
Dann hab ich schon gesagt, diese Global Date-and-Time-String

01:35:38.000 --> 01:35:41.000
mit Zeitzone, so. Und jetzt gibt's noch was.

01:35:41.000 --> 01:35:44.000
Jetzt kommt das, was ich auch noch nie gesehen hab.

01:35:44.000 --> 01:35:49.000
Das ist jetzt hier als Beispiel angegeben, PT4H18M3S.

01:35:49.000 --> 01:35:51.000
Oh, pass auf, darf ich raten?

01:35:51.000 --> 01:35:52.000
Mhm.

01:35:52.000 --> 01:35:54.000
Ach, warte mal, Moment, Duration.

01:35:54.000 --> 01:35:58.000
Dann bin ich raus, weil PT, ich hab grad an Pacific Time gedacht.

01:35:58.000 --> 01:35:59.000
Nee.

01:35:59.000 --> 01:36:01.000
Aber das ergibt ja keinen Sinn.

01:36:01.000 --> 01:36:03.000
Zeitzone brauch ich ja für Duration nicht.

01:36:03.000 --> 01:36:05.000
Aber es sind vier Stunden?

01:36:05.000 --> 01:36:08.000
Es gibt einen eigenen Abschnitt dafür in einem HTML-Standard.

01:36:08.000 --> 01:36:11.000
Es sind vier Stunden, 18 Minuten, drei Sekunden.

01:36:11.000 --> 01:36:12.000
Genau.

01:36:12.000 --> 01:36:14.000
Aber was heißt das PT?

01:36:14.000 --> 01:36:16.000
Ich verlinke auch den HTML-Standard dazu.

01:36:16.000 --> 01:36:19.000
Was ist ein valider Duration-String?

01:36:19.000 --> 01:36:23.000
Also, es beginnt immer mit dem Capital Letter P.

01:36:23.000 --> 01:36:26.000
Und dann eins oder mehr von den folgenden,

01:36:26.000 --> 01:36:30.000
nämlich entweder direkt ASCII-Zahlen,

01:36:30.000 --> 01:36:33.000
gefolgt von einem Capital Letter D.

01:36:33.000 --> 01:36:36.000
Das ist dann einfach die Anzahl an Tagen.

01:36:36.000 --> 01:36:39.000
Ah, ich, ich, okay, das ist das Format.

01:36:39.000 --> 01:36:42.000
Also zwölf Tage wären dann P, zwölf D.

01:36:42.000 --> 01:36:47.000
Oder der Capital Letter T, wahrscheinlich für Time.

01:36:47.000 --> 01:36:51.000
Und dann gefolgt von einem oder mehreren

01:36:51.000 --> 01:36:56.000
der folgenden Subkomponenten in genau dieser Reihenfolge.

01:36:56.000 --> 01:36:59.000
Aber ich kann auch was weglassen davon.

01:36:59.000 --> 01:37:03.000
Und zwar Capital Letter, also wieder ASCII-Digits,

01:37:03.000 --> 01:37:05.000
gefolgt vom Capital Letter H.

01:37:05.000 --> 01:37:07.000
Ist dann die Anzahl an Stunden.

01:37:07.000 --> 01:37:12.000
Oder ASCII-Digits gefolgt vom Letter M für Minuten.

01:37:12.000 --> 01:37:17.000
Oder ASCII-Digits, die die Nummer an Sekunden angeben.

01:37:17.000 --> 01:37:20.000
Optional, gefolgt von einem Punkt zur Abtrennung

01:37:20.000 --> 01:37:26.000
der Fractions of a Second, der Sekundenbruchteile.

01:37:26.000 --> 01:37:29.000
Und zwar eins, zwei oder drei Digits.

01:37:29.000 --> 01:37:34.000
Und dann gefolgt von dem Capital Letter S für Sekunden.

01:37:34.000 --> 01:37:36.000
Das ist ja geil.

01:37:36.000 --> 01:37:37.000
Ja.

01:37:37.000 --> 01:37:38.000
Das ist ja geil.

01:37:38.000 --> 01:37:41.000
Und das ist ein, für Angaben von Zeitdauer,

01:37:41.000 --> 01:37:44.000
ein standardisierter, äh, Dings.

01:37:44.000 --> 01:37:46.000
Aber dann geht's noch weiter.

01:37:46.000 --> 01:37:48.000
Das hab ich jetzt gerade erst gesehen.

01:37:48.000 --> 01:37:49.000
Es gibt noch, äh,

01:37:49.000 --> 01:37:51.000
one or more duration of time components.

01:37:51.000 --> 01:37:53.000
Da ist nämlich noch so eine Note dazwischen.

01:37:53.000 --> 01:37:55.000
Deswegen hab ich das gar nicht dazugeordnet.

01:37:55.000 --> 01:37:56.000
Aber da gibt's noch mehr.

01:37:56.000 --> 01:37:58.000
Also irgendwie White Spaces.

01:37:58.000 --> 01:38:00.000
Dann noch mal ASCII-Digits.

01:38:00.000 --> 01:38:03.000
Scaled by the duration time component scale.

01:38:03.000 --> 01:38:04.000
Boah, keine Ahnung.

01:38:04.000 --> 01:38:05.000
Ähm, ja.

01:38:05.000 --> 01:38:09.000
Also man kann's auch noch mehr verkomplizieren.

01:38:09.000 --> 01:38:12.000
Jetzt, also ich hatte gerade tatsächlich den Fall,

01:38:12.000 --> 01:38:16.000
dass es ein Eingabefeld gibt,

01:38:16.000 --> 01:38:19.000
wo ein Zeitraum angegeben werden sollte.

01:38:19.000 --> 01:38:20.000
Also genau das, ne?

01:38:20.000 --> 01:38:21.000
Also Duration.

01:38:21.000 --> 01:38:24.000
Nicht Startdatum, Enddatum,

01:38:24.000 --> 01:38:26.000
sondern tatsächlich drei Stunden, vier Stunden,

01:38:26.000 --> 01:38:27.000
drei Stunden, 30 Minuten.

01:38:27.000 --> 01:38:29.000
Da könnte ich einfach mal vorschlagen,

01:38:29.000 --> 01:38:31.000
dass man dieses Format eintragen muss.

01:38:31.000 --> 01:38:34.000
Ja, und wenn du das Parsing dann nämlich implementieren willst,

01:38:34.000 --> 01:38:37.000
dann geht's nämlich in dem nächsten Abschnitt runter.

01:38:37.000 --> 01:38:39.000
The rules to parse a duration string are as follows.

01:38:39.000 --> 01:38:41.000
Und dann wird genau aufgeschlüsselt.

01:38:41.000 --> 01:38:42.000
Das ist der Input.

01:38:42.000 --> 01:38:45.000
Und dann wird quasi hier so als Pointer schrittweise vorgegangen.

01:38:45.000 --> 01:38:47.000
Wenn man dann auf das trifft,

01:38:47.000 --> 01:38:49.000
dann das, dann das, dann das, dann das.

01:38:49.000 --> 01:38:51.000
Das kannst du jetzt kopieren.

01:38:51.000 --> 01:38:54.000
Dann kannst du jetzt in den Cloud-AI und den Chat-GPT reinklopfen

01:38:54.000 --> 01:38:56.000
und sagen, schreib mir die Implementierung

01:38:56.000 --> 01:38:58.000
in JavaScript zum Beispiel.

01:38:58.000 --> 01:39:00.000
Und dann mal gucken, wer es besser macht.

01:39:00.000 --> 01:39:01.000
Oh Mann.

01:39:01.000 --> 01:39:03.000
Mach ich vielleicht bis zum nächsten Mal.

01:39:03.000 --> 01:39:06.000
Aber das muss ich mir echt mal, das find ich echt spannend.

01:39:06.000 --> 01:39:09.000
Also das, ich hab mit allem gerechnet, was davor war.

01:39:09.000 --> 01:39:11.000
Ich hätte jetzt nicht auf dem Schirm gehabt,

01:39:11.000 --> 01:39:14.000
dass man tatsächlich Wochen, Wochennummern angeben kann.

01:39:14.000 --> 01:39:17.000
Also, ja, Kalenderwoche.

01:39:17.000 --> 01:39:20.000
Okay, find ich jetzt aber auch nicht überraschend.

01:39:20.000 --> 01:39:23.000
Vielleicht bis zur tausendstel Sekunde gehen kann.

01:39:23.000 --> 01:39:25.000
Hätte ich jetzt auch nicht gedacht,

01:39:25.000 --> 01:39:27.000
aber find ich jetzt auch nicht überraschend.

01:39:27.000 --> 01:39:29.000
Aber das hab ich noch nie gesehen.

01:39:29.000 --> 01:39:32.000
Also wirklich, hier steht PT4H18M3S.

01:39:32.000 --> 01:39:34.000
Und man denkt erst mal so, was?

01:39:34.000 --> 01:39:37.000
Ja, und das ist da halt wirklich auch natürlich, logischerweise.

01:39:37.000 --> 01:39:39.000
Man macht sich halt nur nie Gedanken drüber,

01:39:39.000 --> 01:39:42.000
wenn es einen Standard dafür gibt, der das genau definiert.

01:39:42.000 --> 01:39:45.000
Und der auch definiert, wie man das Ganze auswertet.

01:39:45.000 --> 01:39:49.000
Wenn man maschinell irgendwelche Zeitdauern auswerten will,

01:39:49.000 --> 01:39:51.000
klar, dann kann man das so machen.

01:39:51.000 --> 01:39:53.000
Wobei ich mich halt frage,

01:39:53.000 --> 01:39:58.000
warum nicht einfach die Anzahl der Millisekunden als Timestamp,

01:39:58.000 --> 01:40:00.000
die vergangen sind?

01:40:00.000 --> 01:40:02.000
Es ist natürlich besser lesbar,

01:40:02.000 --> 01:40:05.000
also es ist auch für den Menschen besser lesbar.

01:40:05.000 --> 01:40:08.000
Weil ohne das zu wissen, hast du gleich richtig gelesen,

01:40:08.000 --> 01:40:11.000
HMS, war klar, was das bedeutet.

01:40:11.000 --> 01:40:13.000
Vielleicht ist das das Argument dafür,

01:40:13.000 --> 01:40:16.000
dass man's nicht einfach per Timestamp macht.

01:40:16.000 --> 01:40:18.000
Oder bei einem Timestamp weißt du nie,

01:40:18.000 --> 01:40:21.000
ist das in Tausendstelsekunden oder sind's die reinen Sekunden.

01:40:21.000 --> 01:40:24.000
Das ist ja auch bei JavaScript immer die Geschichte.

01:40:24.000 --> 01:40:26.000
Ja, aber es gibt einen Standard dafür.

01:40:26.000 --> 01:40:29.000
Und wer weiß, vielleicht braucht's mal jemand.

01:40:29.000 --> 01:40:32.000
Aber ich muss da jetzt ganz kurz noch mal reingehen.

01:40:32.000 --> 01:40:34.000
Weil ich jetzt eine Frage hab.

01:40:34.000 --> 01:40:38.000
Weil ich hab ja gesagt, ich hab jetzt tatsächlich diesen Fall gehabt,

01:40:38.000 --> 01:40:41.000
dass ich Code gereviewt hab, wo so was gebraucht wurde.

01:40:41.000 --> 01:40:44.000
Nämlich eine Timeduration, die eingegeben wird.

01:40:44.000 --> 01:40:46.000
Wie würdest du das lösen?

01:40:46.000 --> 01:40:49.000
Ich möchte das noch in einem bestimmten Format haben.

01:40:49.000 --> 01:40:51.000
Also, wie würdest du ...

01:40:51.000 --> 01:40:54.000
Also, wir müssen jetzt auch nicht tief reingehen.

01:40:54.000 --> 01:40:57.000
Aber ich hätte halt das Date-Time ...

01:40:57.000 --> 01:41:02.000
Nee, warte mal, das Input-Type Date funktioniert an der Stelle nicht.

01:41:02.000 --> 01:41:04.000
Selbst wenn ich sage ...

01:41:04.000 --> 01:41:06.000
Oder Input-Type Time funktioniert nicht,

01:41:06.000 --> 01:41:08.000
weil das hat immer Bezug auf den Tag.

01:41:08.000 --> 01:41:10.000
Also, Time ist tatsächlich 24 Stunden.

01:41:10.000 --> 01:41:13.000
Ich kann da nicht mehr als 24 Stunden eintragen,

01:41:13.000 --> 01:41:16.000
weil sich das auf ein Datum tatsächlich bezieht.

01:41:16.000 --> 01:41:19.000
Ich will ja aber eigentlich nur eine Duration haben.

01:41:19.000 --> 01:41:22.000
Weil ansonsten wäre das Time genau das Richtige.

01:41:22.000 --> 01:41:24.000
Weil ich hab da dann so eine Auswahl

01:41:24.000 --> 01:41:27.000
und kann sagen, so viele Stunden und so viele Minuten.

01:41:27.000 --> 01:41:30.000
Aber du willst vielleicht auch 48 Stunden zulassen.

01:41:30.000 --> 01:41:32.000
Weil du in Tagen nicht unbedingt ...

01:41:32.000 --> 01:41:36.000
Ja, gut, da bleibt im Endeffekt nur, normale Inputs zu nehmen.

01:41:36.000 --> 01:41:39.000
Und es dann am Ende so zu verursachen, wie du's ...

01:41:39.000 --> 01:41:42.000
Oder sagen wir mal, ein Input-Type Number zumindest,

01:41:42.000 --> 01:41:45.000
den du dann wiederum irgendwie begrenzen kannst

01:41:45.000 --> 01:41:47.000
auf mindestens null und Maximum.

01:41:47.000 --> 01:41:50.000
Keine Ahnung, falls du ein Maximum hast.

01:41:50.000 --> 01:41:52.000
Ja, also, da gibt's keine Standardlösung.

01:41:52.000 --> 01:41:54.000
Und ja, Time-Picker, Date-Picker,

01:41:54.000 --> 01:41:57.000
das ist auch jetzt grad wieder bei diesen Buchungsdingen

01:41:57.000 --> 01:41:59.000
genau so ein Thema.

01:41:59.000 --> 01:42:02.000
Ich hab das jetzt mit den Standard-Date-Time-Pickern gebaut.

01:42:02.000 --> 01:42:05.000
Also, Time brauch ich sowieso nicht, es geht nur ums Datum.

01:42:05.000 --> 01:42:07.000
Aber wir wissen von dem anderen Projekt,

01:42:07.000 --> 01:42:09.000
über das ich's ja schon öfter hatte,

01:42:09.000 --> 01:42:11.000
dieses Corona-Testergebnis-Ding,

01:42:11.000 --> 01:42:13.000
dass da dann das Kundenfeedback kommt.

01:42:13.000 --> 01:42:16.000
Oh, ich muss ja, um mein Geburtsdatum anzugeben,

01:42:16.000 --> 01:42:19.000
muss ich ja irgendwie 23.000 Mal auf Zurück klicken,

01:42:19.000 --> 01:42:22.000
bis ich im Jahr 1900 was weiß ich was lande.

01:42:22.000 --> 01:42:26.000
Weil die Leute nicht wissen, dass man auf die Jahreszeit klicken kann.

01:42:26.000 --> 01:42:30.000
Weil das einfach bei Android scheiße gelöst ist, muss man so sagen.

01:42:30.000 --> 01:42:34.000
Und vielleicht bei anderen Betriebssystemen auch nicht optimal ist.

01:42:34.000 --> 01:42:36.000
Und das ist ja auch ein Start und Ende.

01:42:36.000 --> 01:42:39.000
Ich will ja sagen, von dann bis dann will ich das buchen.

01:42:39.000 --> 01:42:43.000
Das heißt, im Bestfall muss ich solche Sachen implementieren wie,

01:42:43.000 --> 01:42:45.000
na ja, wenn ich ein Startdatum gewählt hab,

01:42:45.000 --> 01:42:49.000
dann kann das Enddatum logischerweise nicht hinter dem Startdatum liegen.

01:42:49.000 --> 01:42:53.000
Und eigentlich will ich das gar nicht in zwei Feldern ausfüllen müssen,

01:42:53.000 --> 01:42:56.000
sondern ich will da draufklicken, und dann soll sich was öffnen,

01:42:56.000 --> 01:43:00.000
und dann krieg ich gleich zwei Monate quasi nebeneinander dargestellt,

01:43:00.000 --> 01:43:02.000
und ich kann das Startdatum wählen,

01:43:02.000 --> 01:43:05.000
ich klicke auf den Zeitmonat, und dann kann ich das markieren

01:43:05.000 --> 01:43:08.000
und krieg vielleicht sogar in dem Kalender dann blau hinterlegt

01:43:08.000 --> 01:43:10.000
den Zeitraum, wo ich mich befinde.

01:43:10.000 --> 01:43:13.000
Und das geht halt alles mit den Standardelementen nicht.

01:43:13.000 --> 01:43:15.000
Das heißt, was ich machen werde, ist,

01:43:15.000 --> 01:43:17.000
im Hintergrund liegen zwar diese Felder,

01:43:17.000 --> 01:43:20.000
und jetzt sagen wir mal, es kommt ein Client drauf,

01:43:20.000 --> 01:43:22.000
der kein JavaScript kann.

01:43:22.000 --> 01:43:25.000
Gut, der kann das ganze Ding per Ajax sowieso nicht abschicken,

01:43:25.000 --> 01:43:28.000
aber der hätte dann zumindest die Felder da.

01:43:28.000 --> 01:43:31.000
Oder ein Screenreader kann's eben auch wirklich

01:43:31.000 --> 01:43:34.000
die entsprechenden semantischen Felder ausgeben.

01:43:34.000 --> 01:43:36.000
Aber was passiert ist, wenn ich da draufklicke,

01:43:36.000 --> 01:43:38.000
öffnet sich nicht der Standard,

01:43:38.000 --> 01:43:41.000
sondern, das werde ich jetzt morgen noch implementieren,

01:43:41.000 --> 01:43:44.000
es geht ein Popover auf, allerdings kein wirkliches Popover,

01:43:44.000 --> 01:43:47.000
weil Popover-Unterstützung auch noch nicht so doll ist,

01:43:47.000 --> 01:43:50.000
aber halt irgendwie ein Overlay, ein Diff oder wie auch immer.

01:43:50.000 --> 01:43:53.000
Was würdest du da machen? Das ist ein guter Punkt.

01:43:53.000 --> 01:43:56.000
Was würde man in dem Fall für so ein Overlay nehmen?

01:43:56.000 --> 01:43:58.000
Was für ein Overlay?

01:43:58.000 --> 01:44:00.000
Visuell sieht's aus wie ein Textfeld dann,

01:44:00.000 --> 01:44:03.000
aber eigentlich öffnet's ein Overlay mit so einem Kalender-Budget.

01:44:03.000 --> 01:44:06.000
Ist das etwas, was die Seite blockieren soll?

01:44:06.000 --> 01:44:08.000
Es ist kein Dialog.

01:44:08.000 --> 01:44:10.000
Du könntest ein Dialog-Element nehmen.

01:44:10.000 --> 01:44:13.000
Nee, ja gut, im Endeffekt ist es ein Dialog,

01:44:13.000 --> 01:44:15.000
ohne ein Model zu sein, ja.

01:44:15.000 --> 01:44:17.000
Könnte man schon so sagen.

01:44:17.000 --> 01:44:19.000
Dialog muss nicht Model sein.

01:44:19.000 --> 01:44:22.000
Und ja, Popover wäre wahrscheinlich das Richtige.

01:44:22.000 --> 01:44:25.000
Popover wäre genau das Richtige, was ich eigentlich dafür bräuchte.

01:44:25.000 --> 01:44:28.000
Popover, Dialog, Dialog kannst du auch nehmen,

01:44:28.000 --> 01:44:31.000
musst nicht die Seite blockieren, das kannst du selbst bestimmen.

01:44:31.000 --> 01:44:34.000
Aber hätte den Vorteil, dass es eben für Screenreader

01:44:34.000 --> 01:44:37.000
entsprechend mit dem Fokus das gleich richtig macht, ne?

01:44:37.000 --> 01:44:39.000
Ja, Fokustrap und genau.

01:44:39.000 --> 01:44:42.000
Wahrscheinlich werde ich dann ein Dialog-Element nehmen,

01:44:42.000 --> 01:44:45.000
weil Dialog-Unterstützung ist ja jetzt relativ gut.

01:44:45.000 --> 01:44:48.000
Ja, die ist ziemlich gut, und du kriegst da alles andere ...

01:44:48.000 --> 01:44:50.000
Das ist halt besser als ein Diff,

01:44:50.000 --> 01:44:53.000
und ich muss noch gucken, dass der Fokus dann am Ende stimmt.

01:44:53.000 --> 01:44:56.000
Ja, genau, also da werde ich dann leider halt wieder auch,

01:44:56.000 --> 01:44:59.000
obwohl's tolle, schöne Standard-Elemente gibt,

01:44:59.000 --> 01:45:02.000
werde ich was anderes nutzen, weil einfach nicht gewährleistet ist,

01:45:02.000 --> 01:45:05.000
dass die Leute verstehen, wie das funktioniert.

01:45:05.000 --> 01:45:08.000
Und da gibt's halt einfach fertige Libraries für solche Datenauswahl,

01:45:08.000 --> 01:45:12.000
die einfach erprobt sind, die gut aussehen und gut funktionieren

01:45:12.000 --> 01:45:14.000
und für den User einfach eindeutig sind.

01:45:14.000 --> 01:45:17.000
Also, ob man jetzt bei Booking.com oder sonstigen Buchungsdingern,

01:45:17.000 --> 01:45:20.000
du hast da nie einen Standard-Browser-Picker,

01:45:20.000 --> 01:45:23.000
sondern immer eigentlich irgendwelche Lösungen mit ...

01:45:23.000 --> 01:45:26.000
Ich kann wirklich ein Datum, also einen Zeitraum auswählen,

01:45:26.000 --> 01:45:30.000
und das ist halt das, was ich bei Reiseanfragen brauche und will.

01:45:30.000 --> 01:45:32.000
Ja, ja.

01:45:32.000 --> 01:45:35.000
Gut. Das war genug Zeit.

01:45:35.000 --> 01:45:37.000
Ich glaub, die Zeit ist jetzt rum.

01:45:37.000 --> 01:45:39.000
Ich glaub auch. Ich glaub auch.

01:45:39.000 --> 01:45:42.000
So, jetzt kommt noch eine Überraschung,

01:45:42.000 --> 01:45:44.000
also etwas, was mich überrascht hat

01:45:44.000 --> 01:45:47.000
und mich erst mal ein bisschen überfahren hat,

01:45:47.000 --> 01:45:49.000
nämlich das U-Element.

01:45:49.000 --> 01:45:51.000
Das U-Element ist nämlich auch so was,

01:45:51.000 --> 01:45:53.000
was irgendwie umgewidmet wurde.

01:45:53.000 --> 01:45:55.000
War nämlich ja mal Underline.

01:45:55.000 --> 01:45:57.000
Und Achtung, es heißt jetzt ...

01:45:57.000 --> 01:45:59.000
Ich lese das jetzt einfach mal vor,

01:45:59.000 --> 01:46:02.000
weil ich will euch daran teilhaben lassen, an meinem Schmerz.

01:46:02.000 --> 01:46:06.000
So, es heißt jetzt, und ich lese auch gleich den ersten Absatz noch aus der MDN dazu vor,

01:46:06.000 --> 01:46:10.000
the unarticulated annotation element.

01:46:10.000 --> 01:46:14.000
Und dann, the U-HTML element represents a span of inline text,

01:46:14.000 --> 01:46:17.000
which should be rendered in a way that indicates

01:46:17.000 --> 01:46:21.000
that it has a non-textual annotation.

01:46:21.000 --> 01:46:24.000
This is rendered by default as a simple solid underline,

01:46:24.000 --> 01:46:27.000
but may be altered using CSS.

01:46:27.000 --> 01:46:30.000
So, ich hab den Satz erst mal gar nicht verstanden,

01:46:30.000 --> 01:46:33.000
was die mir da sagen wollen, und dann hab ich mir das Beispiel angeguckt

01:46:33.000 --> 01:46:35.000
und hab gesagt, ah ja, okay, gut.

01:46:35.000 --> 01:46:37.000
Jetzt kann ich mir ungefähr vorstellen,

01:46:37.000 --> 01:46:40.000
was ihr meint mit non-textual annotation,

01:46:40.000 --> 01:46:43.000
weil das ist das eigentlich, worauf es am Ende hinausläuft.

01:46:43.000 --> 01:46:48.000
Das Beispiel, und sie haben, glaub ich, auch wirklich nur das eine Beispiel hier genannt,

01:46:48.000 --> 01:46:53.000
wofür das verwendet werden soll, ist zum Beispiel spelling errors.

01:46:53.000 --> 01:46:57.000
Also, ich möchte sagen, da ist irgendwie was,

01:46:57.000 --> 01:47:02.000
und es soll aber nicht irgendwie mit Text ergänzt werden.

01:47:02.000 --> 01:47:06.000
Genau, also es ist jetzt keine Abbreviation oder so was zum Beispiel, ne?

01:47:06.000 --> 01:47:10.000
Genau, es gibt keine Info dazu, keine textliche Info dazu,

01:47:10.000 --> 01:47:13.000
um was es sich handelt, sondern nur eine visuelle.

01:47:13.000 --> 01:47:16.000
Und in dem Fall haben wir vorne Underline, muss aber nicht sein,

01:47:16.000 --> 01:47:19.000
könnte auch irgendwas anderes sein, und in dem Fall haben sie diese,

01:47:19.000 --> 01:47:22.000
es gibt ja mittlerweile in CSS diese schönen anderen Underlines,

01:47:22.000 --> 01:47:25.000
irgendwie, ich weiß gar nicht, wie die heißt, wavy oder so was.

01:47:25.000 --> 01:47:27.000
Oder squiggly, oder so was, ja.

01:47:27.000 --> 01:47:30.000
Squiggly, squiggly, squiggly warm Underline, man kann ja auch die Underline-Farbe ...

01:47:30.000 --> 01:47:33.000
Wavy, ja, Text Decoration Wavy Underline.

01:47:33.000 --> 01:47:36.000
Genau, man kann ja mittlerweile viele verschiedene,

01:47:36.000 --> 01:47:39.000
also Text Decoration Underline gibt's mittlerweile viele coole Sachen,

01:47:39.000 --> 01:47:42.000
die man damit machen kann, es ist nicht mehr einfach nur ein Strich,

01:47:42.000 --> 01:47:44.000
man kann auch sagen, wie dick soll die sein,

01:47:44.000 --> 01:47:46.000
das ist ja unabhängig von der Schriftgröße,

01:47:46.000 --> 01:47:48.000
man kann auch einen Abstand definieren,

01:47:48.000 --> 01:47:51.000
ist aber jetzt alles gar nicht mehr Thema.

01:47:51.000 --> 01:47:55.000
Also das ist das einzige Beispiel, also es ist sehr abstrakt mit,

01:47:55.000 --> 01:47:58.000
ich möchte den Text irgendwie hervorheben, dass da ist irgendwas,

01:47:58.000 --> 01:48:01.000
aber es hat nichts mit, ich würde das nicht mit weiterem Text verknüpfen,

01:48:01.000 --> 01:48:03.000
oder keine Erklärung dazu schreiben.

01:48:03.000 --> 01:48:05.000
Guck mal, interessant, hier unten steht nämlich,

01:48:05.000 --> 01:48:08.000
weil ich gerade Abbreviation als Gegenbeispiel genannt habe,

01:48:08.000 --> 01:48:10.000
aber hier steht, to provide textual annotations,

01:48:10.000 --> 01:48:13.000
as opposed to the non-textual annotations created with you,

01:48:13.000 --> 01:48:16.000
use the Ruby element.

01:48:16.000 --> 01:48:21.000
Das heißt, das ist auch für textuelle Annotationen gedacht,

01:48:21.000 --> 01:48:24.000
abseits von, es sind jetzt chinesische Schriftzeichen,

01:48:24.000 --> 01:48:28.000
sondern ich könnte theoretisch da vielleicht auch andere Dinge reinpacken.

01:48:28.000 --> 01:48:32.000
Vielleicht sogar, vielleicht könnte ich da eine Liste reinpacken,

01:48:32.000 --> 01:48:36.000
je nachdem, ob man das mit Position fixt oder wie auch immer,

01:48:36.000 --> 01:48:41.000
eine Liste an Vorschlägen zum Beispiel für die Textkorrektur

01:48:41.000 --> 01:48:43.000
könnte ich da vielleicht reinpacken.

01:48:43.000 --> 01:48:45.000
Weiß ich nicht, ob das funktioniert.

01:48:45.000 --> 01:48:49.000
Was da auf jeden Fall auch noch steht, ist, dass es in den meisten Fällen,

01:48:49.000 --> 01:48:52.000
wenn man denkt, dass man das U-Element verwenden könnte,

01:48:52.000 --> 01:48:54.000
dass man es nicht verwenden sollte,

01:48:54.000 --> 01:48:56.000
sondern dass man sich erst mal überlegen sollte,

01:48:56.000 --> 01:48:59.000
ob es andere Elemente gibt, die vielleicht besser passen,

01:48:59.000 --> 01:49:03.000
so wie em, b, mark, strong, side oder i.

01:49:03.000 --> 01:49:07.000
Und i ist ja auch so ein komisches, umgewidmetes Element.

01:49:07.000 --> 01:49:10.000
Auch das Ruby-Element kommt hier wieder vor.

01:49:10.000 --> 01:49:12.000
To provide textual annotations as proper ...

01:49:12.000 --> 01:49:15.000
Ja, genau, da steht auch, das mit Ruby-Element soll man verwenden.

01:49:15.000 --> 01:49:19.000
Ja, also, wie gesagt, der Spelling Error ist das Einzige,

01:49:19.000 --> 01:49:21.000
was Ihnen hier einfällt.

01:49:21.000 --> 01:49:23.000
Ja, gut.

01:49:23.000 --> 01:49:26.000
Ich wäre jetzt, glaube ich, gar nicht auf die Idee gekommen,

01:49:26.000 --> 01:49:28.000
das U-Element einzusetzen.

01:49:28.000 --> 01:49:30.000
Ich weiß gar nicht genau, was passiert,

01:49:30.000 --> 01:49:33.000
wenn ich einen Text mache mit Markdown, gibt's das überhaupt?

01:49:33.000 --> 01:49:35.000
Ich bin mir nicht sicher. Egal.

01:49:35.000 --> 01:49:38.000
Wahrscheinlich findet man gar keinen sinnvollen Anwendungsfall mehr,

01:49:38.000 --> 01:49:41.000
außer genau diesen. Aber dafür kann man es ja verwenden.

01:49:41.000 --> 01:49:44.000
Das kommt ja vielleicht tatsächlich ab und zu mal folgen,

01:49:44.000 --> 01:49:46.000
so eine Rechtschreib-Korrektur.

01:49:46.000 --> 01:49:49.000
Es ist aber auf jeden Fall kein Unterstreichungselement mehr.

01:49:49.000 --> 01:49:52.000
Man soll es auf jeden Fall auch nicht einfach so

01:49:52.000 --> 01:49:54.000
mit normaler Unterstreichung verwenden.

01:49:54.000 --> 01:49:56.000
Das ist natürlich wieder ein Styling-Ding.

01:49:56.000 --> 01:49:58.000
Oder man soll, Sie weisen noch drauf hin,

01:49:58.000 --> 01:50:01.000
man soll nichts unterstreichen, was kein Link ist.

01:50:01.000 --> 01:50:04.000
Außer man nimmt so eine Squiggly Line oder so was.

01:50:04.000 --> 01:50:06.000
Das kann ich ganz gut unterscheiden.

01:50:06.000 --> 01:50:08.000
Aber normalerweise sind ...

01:50:08.000 --> 01:50:10.000
Link ist einfach ...

01:50:10.000 --> 01:50:15.000
Oder der Style für Links ist einfach eine Unterstreichung.

01:50:15.000 --> 01:50:18.000
Und es wäre schräg oder misleading,

01:50:18.000 --> 01:50:22.000
wenn man die Unterstreichung für was anderes verwendet.

01:50:22.000 --> 01:50:24.000
Das ist tatsächlich eine Information.

01:50:24.000 --> 01:50:26.000
Da denkt man so, das liegt ja auf der Hand.

01:50:26.000 --> 01:50:29.000
Aber es gibt durchaus Leute, die auf Webseiten das machen.

01:50:29.000 --> 01:50:31.000
Und ich klicke dann da drauf wie ein Depp.

01:50:31.000 --> 01:50:33.000
Und es passiert nichts.

01:50:33.000 --> 01:50:35.000
Es ist mir durchaus schon passiert.

01:50:35.000 --> 01:50:37.000
Also bitte lasst das.

01:50:37.000 --> 01:50:39.000
Nur Dinge unterstreichen, die Links sind.

01:50:39.000 --> 01:50:42.000
So.

01:50:42.000 --> 01:50:45.000
Dann komm ich jetzt, glaub ich, schon zu meinem Letzten.

01:50:45.000 --> 01:50:47.000
Und dann kommt noch eines von dir.

01:50:47.000 --> 01:50:48.000
Ja.

01:50:48.000 --> 01:50:51.000
Wir hätten hier noch das Var-Element, V-A-R.

01:50:51.000 --> 01:50:53.000
Es hat nichts mit ...

01:50:53.000 --> 01:50:56.000
Ist das nicht der virtuelle Irgendwas-Referee?

01:50:56.000 --> 01:51:00.000
Da ist der, glaub ich, auch so irgendwie bei der EM.

01:51:00.000 --> 01:51:02.000
Schon wieder vergessen.

01:51:02.000 --> 01:51:06.000
Der dir dann sagt, dass du mit einem kleinen Zeh im Upsides warst.

01:51:06.000 --> 01:51:11.000
Übrigens auch eine verrückte Erfindung, wie ich finde.

01:51:11.000 --> 01:51:14.000
Wie hieß es, das Ball-EKG oder so?

01:51:14.000 --> 01:51:15.000
Ja, ja, ja.

01:51:15.000 --> 01:51:20.000
Ja, verrückte Zeiten, in denen wir leben.

01:51:20.000 --> 01:51:26.000
Das Variable-Element ist eigentlich in erster Linie da,

01:51:26.000 --> 01:51:29.000
um Variablen eines mathematischen Ausdrucks

01:51:29.000 --> 01:51:32.000
oder Variablen, wenn ich bei mir ...

01:51:32.000 --> 01:51:35.000
Ich schreib einen Text über Programmieren.

01:51:35.000 --> 01:51:38.000
Variablen zu markten und da zu sagen,

01:51:38.000 --> 01:51:40.000
das ist jetzt eine Variable.

01:51:40.000 --> 01:51:43.000
Üblicherweise stellt der Browser das dann kursiv dar.

01:51:43.000 --> 01:51:46.000
Aber das ist natürlich, wie schon immer gesagt,

01:51:46.000 --> 01:51:49.000
man sollte es nicht für den Style machen,

01:51:49.000 --> 01:51:53.000
sondern eben für die semantische Auszeichnung an der Stelle.

01:51:53.000 --> 01:51:56.000
Es ist auch was, wo ich sage, ja, ich kann mir vorstellen,

01:51:56.000 --> 01:51:59.000
es kommt bestimmt auch aus dieser wissenschaftlichen Ecke,

01:51:59.000 --> 01:52:01.000
wie du vorhin schon angesprochen hast.

01:52:01.000 --> 01:52:04.000
Wenn du jetzt viel mathematische Sachen machst

01:52:04.000 --> 01:52:07.000
oder tatsächlich über Programmieren schreibst,

01:52:07.000 --> 01:52:10.000
das ist jetzt nicht so ungewöhnlich für mich,

01:52:10.000 --> 01:52:13.000
dann kommt man da vielleicht schon mal drauf,

01:52:13.000 --> 01:52:15.000
dass man das verwenden könnte.

01:52:15.000 --> 01:52:18.000
Ich habe das bewusst noch nie im Einsatz gesehen irgendwo.

01:52:18.000 --> 01:52:21.000
Es kann zum Beispiel in SEMP vorkommen

01:52:21.000 --> 01:52:24.000
oder auch in Code wäre so ein logischer Ort,

01:52:24.000 --> 01:52:27.000
wo sowas dann drin vorkommen könnte.

01:52:27.000 --> 01:52:30.000
Ja, es hat auch keine ARIA-Role oder so.

01:52:30.000 --> 01:52:33.000
Ja, also Variablen im VAR-Element,

01:52:33.000 --> 01:52:36.000
das ist tatsächlich genau das,

01:52:36.000 --> 01:52:39.000
was man annehmen würde, was es sein könnte.

01:52:39.000 --> 01:52:42.000
Also natürlich der Videoassistent.

01:52:42.000 --> 01:52:45.000
Genau, das war es, oder?

01:52:45.000 --> 01:52:48.000
Heute habe ich es irgendwie in den Übergang.

01:52:48.000 --> 01:52:51.000
Jetzt kommt noch ...

01:52:51.000 --> 01:52:54.000
Ups, ich habe es schon abgehakt.

01:52:54.000 --> 01:52:57.000
Dabei kommt es erst noch.

01:52:57.000 --> 01:53:00.000
Genau, the Line Break Opportunity Element.

01:53:00.000 --> 01:53:03.000
Damit kann ich dem Browser sagen,

01:53:03.000 --> 01:53:06.000
an der Stelle könntest du, wenn der Platz zu eng wird,

01:53:06.000 --> 01:53:09.000
doch einfach das Wort mittendrin umbrechen.

01:53:09.000 --> 01:53:12.000
Das heißt, es ist quasi ein Zero-Width-Space.

01:53:12.000 --> 01:53:15.000
Also es steht sogar hier auch auf UTF-8-codierten Seiten,

01:53:15.000 --> 01:53:18.000
verhält sich das genauso wie ein Zero-Width-Space.

01:53:18.000 --> 01:53:21.000
Und das hat nämlich noch eine Implikation.

01:53:21.000 --> 01:53:24.000
Nämlich, weil wir es vorhin

01:53:24.000 --> 01:53:27.000
auch über BD-Reihenfolgen hatten.

01:53:27.000 --> 01:53:30.000
Normalerweise, wenn das jetzt zwei komplett getrennt sind,

01:53:30.000 --> 01:53:33.000
kann man in den BD-Reihen folgen.

01:53:33.000 --> 01:53:36.000
Da kann man in den BD-Reihen folgen.

01:53:36.000 --> 01:53:39.000
Normalerweise, wenn das jetzt

01:53:39.000 --> 01:53:42.000
zwei komplett getrennte Wörter wären,

01:53:42.000 --> 01:53:45.000
also z.B. ich mache einen Span außenrum,

01:53:45.000 --> 01:53:48.000
aber kein Leerzeichen dazwischen,

01:53:48.000 --> 01:53:51.000
dann würde sich auch die Reihenfolge ändern,

01:53:51.000 --> 01:53:54.000
wenn der BD-Text jetzt von rechts nach links läuft z.B.

01:53:54.000 --> 01:53:57.000
Und da ist hier das Beispiel, wenn ich hier 1, 2, 3 komme,

01:53:57.000 --> 01:54:00.000
und dann ein WBR-Tag oder eben so ein Zero-Width-Space habe,

01:54:00.000 --> 01:54:03.000
4, 5, 6, und der wird nicht in zwei Zeilen gebrochen,

01:54:03.000 --> 01:54:06.000
dann würde normalerweise man erwarten,

01:54:06.000 --> 01:54:09.000
dass da eben 4, 5, 6, 1, 2, 3 steht,

01:54:09.000 --> 01:54:12.000
weil eben die Flussrichtung eine andere ist.

01:54:12.000 --> 01:54:15.000
Aber es bleibt trotzdem 1, 2, 3, 4, 5, 6.

01:54:15.000 --> 01:54:18.000
Und ja, das ist vielleicht gut zu wissen,

01:54:18.000 --> 01:54:21.000
wenn man irgendwie mit arabischen Schriften

01:54:21.000 --> 01:54:24.000
oder mit sonst allem, was nicht von links nach rechts läuft, zu tun hat.

01:54:24.000 --> 01:54:27.000
Was es allerdings nicht macht,

01:54:27.000 --> 01:54:30.000
ist automatisch ein Trennungsstrich.

01:54:30.000 --> 01:54:33.000
Dafür benutzt man das UndSci,

01:54:33.000 --> 01:54:36.000
die HTML-Entity UndSci,

01:54:36.000 --> 01:54:39.000
die halt sagt,

01:54:39.000 --> 01:54:42.000
na ja, wenn du nebeneinander passt, dann machst du nix,

01:54:42.000 --> 01:54:45.000
dann bist du eben auch so ein Zero-Width-Space.

01:54:45.000 --> 01:54:48.000
Aber falls nicht,

01:54:48.000 --> 01:54:51.000
dann kannst du an der Stelle so ein Trenn-Bindestrich einfügen.

01:54:51.000 --> 01:54:54.000
Ja.

01:54:54.000 --> 01:54:57.000
Ich musste grad total lachen,

01:54:57.000 --> 01:55:00.000
als ich die MDN-Demo gesehen hab

01:55:00.000 --> 01:55:03.000
und gesehen hab, was für ein Wort sie da verwenden,

01:55:03.000 --> 01:55:06.000
um das Beispiel zu zeigen.

01:55:06.000 --> 01:55:09.000
Es ist ein deutsches Wort in der englischen MDN,

01:55:09.000 --> 01:55:12.000
und zwar Fernstraßenbau-Privatfinanzierungsgesetz.

01:55:12.000 --> 01:55:15.000
Wobei ich mich da dann schon frage,

01:55:15.000 --> 01:55:18.000
was für einen Sinn das macht, das ohne Bindestrich zu trennen.

01:55:18.000 --> 01:55:21.000
Weil sie haben da beide Beispiele drin.

01:55:21.000 --> 01:55:24.000
Also einmal mit WBR, Fernstraßen-WBR, Bau-WBR,

01:55:24.000 --> 01:55:27.000
und dann steht das noch mal mit der UndSci-Entity.

01:55:27.000 --> 01:55:30.000
Und es gibt dieses Gesetz tatsächlich,

01:55:30.000 --> 01:55:33.000
falls ihr euch das fragt.

01:55:33.000 --> 01:55:36.000
Nein!

01:55:36.000 --> 01:55:39.000
Abgekürzt als F-S-T-R-Priv-Fin-G.

01:55:39.000 --> 01:55:42.000
Na ja, dann nimmt man doch einfach das.

01:55:42.000 --> 01:55:45.000
Dann weiß doch jeder, was gemeint ist.

01:55:45.000 --> 01:55:48.000
Ja, aber es würde tatsächlich keinen Sinn machen,

01:55:48.000 --> 01:55:51.000
das nicht zu trennen.

01:55:51.000 --> 01:55:54.000
Oder man überlässt es einfach dem Browser

01:55:54.000 --> 01:55:57.000
und sagt hier mit CSS.

01:55:57.000 --> 01:56:00.000
Überbau und Finanzierung von Bundesstraßen durch Private.

01:56:00.000 --> 01:56:03.000
Also eine Sache, die vielleicht noch ganz interessant ist,

01:56:03.000 --> 01:56:06.000
der Yahoo-Style-Guide empfiehlt.

01:56:06.000 --> 01:56:09.000
Der Yahoo-Style-Guide, was ist das?

01:56:09.000 --> 01:56:12.000
Keine Ahnung, ich habe nicht draufgeklickt.

01:56:12.000 --> 01:56:15.000
Aber dass man URLs vor jeglicher Punktuierung,

01:56:15.000 --> 01:56:18.000
sprich ein Slash oder ein Punkt,

01:56:18.000 --> 01:56:21.000
mit WBR versieht.

01:56:21.000 --> 01:56:24.000
Damit man, wenn das umbricht,

01:56:24.000 --> 01:56:27.000
nicht denkt, dass die URL da zu Ende wäre.

01:56:27.000 --> 01:56:30.000
Also dass dann der Slash automatisch

01:56:30.000 --> 01:56:33.000
in die nächste Seite mit umbricht.

01:56:33.000 --> 01:56:36.000
Oder ein Punkt eben, damit der nicht am Ende steht

01:56:36.000 --> 01:56:39.000
und du denkst, da ist jetzt der Text zu Ende.

01:56:39.000 --> 01:56:42.000
Also der Yahoo-Style-Guide-Link,

01:56:42.000 --> 01:56:45.000
der zeigt aufs Webarchive auf eine Seite aus dem Jahre 2012.

01:56:45.000 --> 01:56:48.000
Und die Frage ist,

01:56:48.000 --> 01:56:51.000
wie oft hast du URLs einfach als URL im Text

01:56:51.000 --> 01:56:54.000
und nicht als Ahref mit einem Text?

01:56:54.000 --> 01:56:57.000
Gar nicht so selten.

01:56:57.000 --> 01:57:00.000
Dann musst du in deiner Umgebung dafür sorgen,

01:57:00.000 --> 01:57:03.000
dass das automatisiert URLs in Text mit WBR versieht

01:57:03.000 --> 01:57:06.000
an den entsprechenden Stellen.

01:57:06.000 --> 01:57:09.000
Oh ja.

01:57:09.000 --> 01:57:12.000
Wenn du es richtig machen willst.

01:57:12.000 --> 01:57:15.000
Dann kannst du ...

01:57:15.000 --> 01:57:18.000
Eigentlich sind wir jetzt damit auch am Ende vom Thema.

01:57:18.000 --> 01:57:21.000
Ich bastle nebenher noch ein bisschen was,

01:57:21.000 --> 01:57:24.000
weil mich das keine Ruhe gelassen hat mit dem Ruby-Ding.

01:57:24.000 --> 01:57:27.000
Das zeige ich dir dann gleich.

01:57:27.000 --> 01:57:30.000
Und speichere es auch als Code-Pen.

01:57:30.000 --> 01:57:33.000
Aber dann kannst du schon mal weitermachen,

01:57:33.000 --> 01:57:36.000
weil du hast ja jetzt als Nächstes noch einen Punkt.

01:57:36.000 --> 01:57:39.000
Und ich drücke mal aufs Knöpfchen.

01:57:39.000 --> 01:57:42.000
Das Geil-Teil.

01:57:42.000 --> 01:57:45.000
Geil-Teil.

01:57:45.000 --> 01:57:48.000
So, ja.

01:57:48.000 --> 01:57:51.000
Geilo-Teilo.

01:57:51.000 --> 01:57:54.000
Ich habe immer ein bisschen Angst,

01:57:54.000 --> 01:57:57.000
wenn ich über AI rede,

01:57:57.000 --> 01:58:00.000
dass dann gleich der Mob mit den Fackeln kommt

01:58:00.000 --> 01:58:03.000
und sagt, das ist doch alles Mist.

01:58:03.000 --> 01:58:06.000
Und früher war alles besser.

01:58:06.000 --> 01:58:09.000
Es gibt auch gute Argumente dagegen.

01:58:09.000 --> 01:58:12.000
Und auch dieses ganze ...

01:58:12.000 --> 01:58:15.000
Leute benutzen einfach den Text aus dem Internet,

01:58:15.000 --> 01:58:18.000
um ihre Algorithmen zu trainieren.

01:58:18.000 --> 01:58:21.000
Es hat alles seine Probleme.

01:58:21.000 --> 01:58:24.000
Aber ich will auch trotzdem damit rumspielen können.

01:58:24.000 --> 01:58:27.000
Und das mache ich auch.

01:58:27.000 --> 01:58:30.000
Ich habe jetzt gerade die Tage rumgespielt,

01:58:30.000 --> 01:58:33.000
weil ich mir gedacht habe, ich bin so faul,

01:58:33.000 --> 01:58:36.000
dass die Texte nicht automatisch einsortiert werden.

01:58:36.000 --> 01:58:39.000
Ich möchte z.B. automatische Dateinamengenerierung

01:58:39.000 --> 01:58:42.000
auf Basis des Inhalts eines PDF-Dokuments haben.

01:58:42.000 --> 01:58:45.000
Und zwar interessanterweise genau nach dem Schema,

01:58:45.000 --> 01:58:48.000
worüber wir vorhin gesprochen haben, das Zeitschema.

01:58:48.000 --> 01:58:51.000
Dieser ISO-Standard.

01:58:51.000 --> 01:58:54.000
Vier Ziffern Jahreszahl minus zweimal Monat minus zweimal Tag.

01:58:54.000 --> 01:58:57.000
Und dann underscore eine kleine Mini-Zusammenfassung dessen,

01:58:57.000 --> 01:59:00.000
was in dem Fall ist.

01:59:00.000 --> 01:59:03.000
Und da habe ich mir gedacht, na ja, wie kann ich das machen?

01:59:03.000 --> 01:59:06.000
Ein Large-Language-Model könnte das doch vielleicht für mich lösen.

01:59:06.000 --> 01:59:09.000
Und da die Inhalte der Dokumente,

01:59:09.000 --> 01:59:12.000
die ich da verschlagworten, verfeilnahmen möchte,

01:59:12.000 --> 01:59:15.000
jetzt eher privat sind,

01:59:15.000 --> 01:59:18.000
möchte ich das nicht an ChatGPT schicken.

01:59:18.000 --> 01:59:21.000
Möchte ich einfach nicht.

01:59:21.000 --> 01:59:24.000
Und dann habe ich nach Lösungen geguckt,

01:59:24.000 --> 01:59:27.000
wie kann ich denn jetzt sowas lokal bei mir laufen lassen,

01:59:27.000 --> 01:59:30.000
was jetzt auch auf dem M2 MacBook Air läuft.

01:59:30.000 --> 01:59:33.000
Weil üblicherweise so Machine-Learning-Sachen,

01:59:33.000 --> 01:59:36.000
die laufen ja oft nur richtig gut,

01:59:36.000 --> 01:59:39.000
wenn man eine dicke Grafik hat und viel Strom,

01:59:39.000 --> 01:59:42.000
ein kleines Kraftwerk und sowas hat.

01:59:42.000 --> 01:59:45.000
Und ich habe jetzt nach einer Lösung gesucht,

01:59:45.000 --> 01:59:48.000
die ich vielleicht über eine API ansprechen kann.

01:59:48.000 --> 01:59:51.000
Mein Ziel war, einen macOS-Shortcut zu haben.

01:59:51.000 --> 01:59:54.000
Am Ende ist das große Ziel tatsächlich,

01:59:54.000 --> 01:59:57.000
dass ich eine Datei scanne,

01:59:57.000 --> 02:00:00.000
sie in einen bestimmten Ordner reinläuft.

02:00:00.000 --> 02:00:03.000
Der Watcher dann darüber sieht,

02:00:03.000 --> 02:00:06.000
ah, da ist eine neue Datei und das dann vollkommen automatisch

02:00:06.000 --> 02:00:09.000
in den richtigen Ordner sortiert und den richtigen Feilnamen vergibt.

02:00:09.000 --> 02:00:12.000
Oder halt, dass sich da was ausdenkt auf Basis des Inhalts.

02:00:12.000 --> 02:00:15.000
Soweit bin ich noch nicht.

02:00:15.000 --> 02:00:18.000
Aber ich habe auf jeden Fall den Teil schon gebaut,

02:00:18.000 --> 02:00:21.000
der den Feilnamen generiert auf Basis des Inhalts.

02:00:21.000 --> 02:00:24.000
Und dafür habe ich halt eben jetzt

02:00:24.000 --> 02:00:27.000
ein Large-Language-Model gebraucht, dem ich eben sagen kann,

02:00:27.000 --> 02:00:30.000
hey, ich brauche einen Feilnamen nach folgendem Schema.

02:00:30.000 --> 02:00:33.000
Und bitte, falls eine Rechnung ist,

02:00:33.000 --> 02:00:36.000
schreib bitte Rechnung irgendwie noch vorne dran.

02:00:36.000 --> 02:00:39.000
Und bitte schreib noch das Datum vorne ran,

02:00:39.000 --> 02:00:42.000
falls du ein Datum findest.

02:00:42.000 --> 02:00:45.000
Und mein Geburtsdatum ist nicht das Datum,

02:00:45.000 --> 02:00:48.000
falls du das finden solltest in irgendwelchen Dokumenten,

02:00:48.000 --> 02:00:51.000
das würde auch nicht im Feilnamen vorkommen,

02:00:51.000 --> 02:00:54.000
weil das wäre auch Quatsch für mich,

02:00:54.000 --> 02:00:57.000
wenn ich das als wichtige Information daraus sammeln würde.

02:00:57.000 --> 02:01:00.000
Und dann mach mal.

02:01:00.000 --> 02:01:03.000
Und habe dann halt nach etwas gesucht, wo ich das hinwerfen kann,

02:01:03.000 --> 02:01:06.000
inklusive des Texts oder des Inhalts von dem PDF.

02:01:06.000 --> 02:01:09.000
Und bin auf Olama gestoßen.

02:01:09.000 --> 02:01:12.000
Das gibt es schon eine ganze Weile.

02:01:12.000 --> 02:01:15.000
Und Olama ist so eine Art Rapper,

02:01:15.000 --> 02:01:18.000
für aktuelle Large-Language-Models,

02:01:18.000 --> 02:01:21.000
die man frei verwenden kann.

02:01:21.000 --> 02:01:24.000
Für die Command-Line erst mal.

02:01:24.000 --> 02:01:27.000
Bietet aber auch eine API an.

02:01:27.000 --> 02:01:30.000
Und das mache ich folgendermaßen.

02:01:30.000 --> 02:01:33.000
Ich installiere das.

02:01:33.000 --> 02:01:36.000
Das geht aber nicht nur auf Mac,

02:01:36.000 --> 02:01:39.000
das geht auch auf anderen Betriebssystemen.

02:01:39.000 --> 02:01:42.000
Das gibt es auch für Linux und für Windows.

02:01:42.000 --> 02:01:45.000
Also wer sich davon erhofft,

02:01:45.000 --> 02:01:48.000
dass er dann klickgebunden im Browser ein schönes Web-Interface hat,

02:01:48.000 --> 02:01:51.000
das ist das nicht.

02:01:51.000 --> 02:01:54.000
Es ist erst mal für die Command-Line und als API.

02:01:54.000 --> 02:01:57.000
Und dann kann ich z.B. sowas machen,

02:01:57.000 --> 02:02:00.000
wie ich starte da ein Model drin.

02:02:00.000 --> 02:02:03.000
Ich muss halt wissen, wie die Models heißen,

02:02:03.000 --> 02:02:06.000
die angeboten werden.

02:02:06.000 --> 02:02:09.000
Da gibt es eine Liste auf der Webseite.

02:02:09.000 --> 02:02:12.000
Also z.B. Gemma 2, das ist von Google.

02:02:12.000 --> 02:02:15.000
Lama 3, das ist glaube ich von Meta, also Facebook.

02:02:15.000 --> 02:02:18.000
Es gibt aber auch noch viele weitere,

02:02:18.000 --> 02:02:21.000
die für verschiedene Anwendungsfälle optimiert sind.

02:02:21.000 --> 02:02:24.000
Wie Mistral und keine Ahnung, wie sie alle heißen.

02:02:24.000 --> 02:02:27.000
Da steht immer dann dabei, wofür sie optimiert sind,

02:02:27.000 --> 02:02:30.000
wie groß sie sind, wann sie zum letzten Mal geupdatet wurden.

02:02:30.000 --> 02:02:33.000
Was ich dann eigentlich nur machen muss,

02:02:33.000 --> 02:02:36.000
wenn ich das Olama installiert habe,

02:02:36.000 --> 02:02:39.000
ich stelle Olama run, dann den Model-Namen.

02:02:39.000 --> 02:02:42.000
Sofern es noch nicht installiert ist, lädt das mir runter.

02:02:42.000 --> 02:02:45.000
Das kann eine Weile dauern.

02:02:45.000 --> 02:02:48.000
Die sind ja immer ein paar Gigabyte groß.

02:02:48.000 --> 02:02:51.000
Und dann habe ich tatsächlich so einen Text-Prompt.

02:02:51.000 --> 02:02:54.000
Und dann kann ich da mal was reintippen.

02:02:54.000 --> 02:02:57.000
Was soll ich da reintippen? Wir probieren es mal aus.

02:02:57.000 --> 02:03:00.000
Ich habe jetzt dieses Lama 3-Model am Laufen.

02:03:00.000 --> 02:03:03.000
Du könntest die, die wir vorhin hatten,

02:03:03.000 --> 02:03:06.000
auch auf Deutsch machen.

02:03:06.000 --> 02:03:09.000
Du kopierst einfach die Anleitung rein.

02:03:09.000 --> 02:03:12.000
Was, die Anleitung?

02:03:12.000 --> 02:03:15.000
Du sagst, implementiere mir in JavaScript das und das.

02:03:15.000 --> 02:03:18.000
Äh, warte mal. Was war es noch mal?

02:03:18.000 --> 02:03:21.000
Bei Time.

02:03:21.000 --> 02:03:24.000
Das habe ich in HTML-Standard verlinkt.

02:03:24.000 --> 02:03:27.000
Und unten, wenn du runterscrollst,

02:03:27.000 --> 02:03:30.000
dann the rules to pass a duration string.

02:03:30.000 --> 02:03:33.000
Was mich da dran überzeugt hat,

02:03:33.000 --> 02:03:36.000
ich habe ja vorhin gesagt, ich habe eher fachbrüstige Maschinen,

02:03:36.000 --> 02:03:39.000
also ganz ohne Lüfter und so, MacBook Air.

02:03:39.000 --> 02:03:42.000
Und trotzdem, je nach Model, muss man dazu sagen,

02:03:42.000 --> 02:03:45.000
dieses Lama 3-Model, es antwortet extrem schnell.

02:03:45.000 --> 02:03:48.000
Also ich tippe jetzt mal ein, tell me a joke.

02:03:48.000 --> 02:03:51.000
Man kann es auch auf Deutsch machen, es spricht auch Deutsch.

02:03:51.000 --> 02:03:54.000
Moment, jetzt warte ich kurz.

02:03:54.000 --> 02:03:57.000
Da braucht er jetzt interessanterweise relativ lange.

02:03:57.000 --> 02:04:00.000
Gut, das ist ja auch sehr viel Text.

02:04:00.000 --> 02:04:03.000
Und jetzt kommt schon die Antwort zurück.

02:04:03.000 --> 02:04:06.000
Jetzt hat er mir hier ...

02:04:06.000 --> 02:04:09.000
Das ist jetzt schon fertig.

02:04:09.000 --> 02:04:12.000
Why couldn't the bicycle stand up by itself?

02:04:12.000 --> 02:04:15.000
Because it was too tired.

02:04:15.000 --> 02:04:18.000
Too tired.

02:04:18.000 --> 02:04:21.000
Ist gar nicht so schlecht.

02:04:21.000 --> 02:04:24.000
Jetzt schreibe ich mir noch another one.

02:04:24.000 --> 02:04:27.000
Und jetzt ist er schon da.

02:04:27.000 --> 02:04:30.000
Schon fertig getippt.

02:04:30.000 --> 02:04:33.000
Also das ist wirklich fast so schnell wie Chat GPT.

02:04:33.000 --> 02:04:36.000
Wenn man jetzt natürlich viel Inhalt reinpackt,

02:04:36.000 --> 02:04:39.000
so was wie ich packe jetzt den kompletten Inhalt

02:04:39.000 --> 02:04:42.000
von irgendeinem großen PDF da rein

02:04:42.000 --> 02:04:45.000
und dass er mir mal den Fallennamen daraus generiert,

02:04:45.000 --> 02:04:48.000
dann geht es natürlich nicht so schnell.

02:04:48.000 --> 02:04:51.000
Dann hatte ich jetzt bei einem größeren PDF mit drei, vier Seiten,

02:04:51.000 --> 02:04:54.000
wo es bis 20 Sekunden dauert, bis dann der Fallenname zurückkommt.

02:04:54.000 --> 02:04:57.000
Aber es scheint relativ effizient zu rendern auch bei mir hier,

02:04:57.000 --> 02:05:00.000
weil man sieht auch, die CPU langweilt sich dabei die ganze Zeit.

02:05:00.000 --> 02:05:03.000
Es wird alles auf der GPU gemacht.

02:05:03.000 --> 02:05:06.000
Und das ist das, was ich vorher mit anderen Experimenten hatte,

02:05:06.000 --> 02:05:09.000
dass dann mir quasi der Rechner eingefroren ist,

02:05:09.000 --> 02:05:12.000
weil es versucht hat, alles auf der CPU zu machen.

02:05:12.000 --> 02:05:15.000
Das OLAMA scheint ganz gut optimiert zu sein,

02:05:15.000 --> 02:05:18.000
zumindest auf dem Mac, dass die Sachen auf der GPU laufen.

02:05:18.000 --> 02:05:21.000
Das ist irgendwie nett.

02:05:21.000 --> 02:05:24.000
Und wie gesagt, es gibt auch eine API,

02:05:24.000 --> 02:05:27.000
wo du dann auf localhost.xy kannst du Requests hinschicken

02:05:27.000 --> 02:05:30.000
und kriegst dann die Antwort zurück,

02:05:30.000 --> 02:05:33.000
wahlweise als Stream, wahlweise als kompletter Text.

02:05:33.000 --> 02:05:36.000
Wie du willst, gibt es viele verschiedene Optionen.

02:05:36.000 --> 02:05:39.000
Ziemlich einfach zu bedienen.

02:05:39.000 --> 02:05:42.000
Das war genau das, was ich in meinem Fall

02:05:42.000 --> 02:05:45.000
für den macOS Shortcut gebraucht habe.

02:05:45.000 --> 02:05:48.000
Ich schicke da einfach den Inhalt hin und dann kriege ich das zurück.

02:05:48.000 --> 02:05:51.000
Das wartet dann auch brav, bis die API antwortet.

02:05:51.000 --> 02:05:54.000
Und dann wird die Datei umbenannt.

02:05:54.000 --> 02:05:57.000
Ich war echt erstaunt,

02:05:57.000 --> 02:06:00.000
wie wenig Aufwand

02:06:00.000 --> 02:06:03.000
der Rechner da offenbar betreiben muss,

02:06:03.000 --> 02:06:06.000
dass so was bei mir jetzt lokal läuft.

02:06:06.000 --> 02:06:09.000
Krass.

02:06:09.000 --> 02:06:12.000
Ich weiß, die Models sind unterschiedlich anspruchsvoll.

02:06:12.000 --> 02:06:15.000
Das Google-Model verursacht deutlich mehr Last.

02:06:15.000 --> 02:06:18.000
Ich habe keine Ahnung, ob die Antworten dann besser sind.

02:06:18.000 --> 02:06:21.000
Habe ich jetzt nicht ausprobiert.

02:06:21.000 --> 02:06:24.000
Mir ging es ja um einen relativ simplen Anwendungsfall.

02:06:24.000 --> 02:06:27.000
Ich wollte mir von dem Ding jetzt nichts programmieren lassen.

02:06:27.000 --> 02:06:30.000
Ich sage nur, hier habe ich einen Text.

02:06:30.000 --> 02:06:33.000
Mach mir bitte einen String draus in dem Format

02:06:33.000 --> 02:06:36.000
und versuche folgende Sachen zu extrahieren.

02:06:36.000 --> 02:06:39.000
Datum und so was.

02:06:39.000 --> 02:06:42.000
Und dann habe ich in folgender Programmiersprache folgendes Problem.

02:06:42.000 --> 02:06:45.000
Sowas habe ich damit noch nicht gemacht.

02:06:45.000 --> 02:06:48.000
Finde ich ziemlich cool.

02:06:48.000 --> 02:06:51.000
Läuft schnell, läuft gut.

02:06:51.000 --> 02:06:54.000
Wenn man mal damit rumspielen und ausprobieren will,

02:06:54.000 --> 02:06:57.000
dann ist das echt gut.

02:06:57.000 --> 02:07:00.000
Man darf keine Angst vor der Command Line haben.

02:07:00.000 --> 02:07:03.000
Das ist eine der Voraussetzungen.

02:07:03.000 --> 02:07:06.000
Vor 10 Jahren hätte ich das Ding nicht so freudig angefasst wie jetzt.

02:07:06.000 --> 02:07:09.000
Jetzt finde ich es super, dass es auf der Command Line funktioniert,

02:07:09.000 --> 02:07:12.000
weil man damit ganz viele verrückte Sachen machen kann.

02:07:12.000 --> 02:07:15.000
Oder dass es eine API hat.

02:07:15.000 --> 02:07:18.000
Kann man mal mit rumspielen.

02:07:18.000 --> 02:07:21.000
Ich will eigentlich keine Kommentare haben von wegen,

02:07:21.000 --> 02:07:24.000
AI ist doch alles scheiße, die brauche ich nicht.

02:07:24.000 --> 02:07:27.000
Aber falls jemand schon mal damit rumgespielt hat

02:07:27.000 --> 02:07:30.000
und noch etwas anderes Verrücktes gebaut hat oder sagt,

02:07:30.000 --> 02:07:33.000
da musst du aufpassen, das Modell ist gut für das.

02:07:33.000 --> 02:07:36.000
Was ist das, was wir vorhin nicht gemacht haben?

02:07:36.000 --> 02:07:39.000
Werbung haben wir nicht gemacht.

02:07:39.000 --> 02:07:42.000
Vielleicht holen wir das jetzt gleich nach.

02:07:42.000 --> 02:07:45.000
Dann machen wir es als Zwischendings,

02:07:45.000 --> 02:07:48.000
bevor ich noch mal einen Nachtrag habe.

02:07:48.000 --> 02:07:51.000
Mit meinem Geil-Teil bin ich fertig.

02:07:51.000 --> 02:07:54.000
Schreibt mal, ob ihr sowas auch schon verwendet habt.

02:07:54.000 --> 02:07:57.000
Was ihr da für Erfahrungen gemacht habt, würde mich interessieren.

02:07:57.000 --> 02:08:00.000
Wir gucken uns das bestimmt auch im Stream noch mal an.

02:08:00.000 --> 02:08:03.000
Dann kommt jetzt Werbung.

02:08:03.000 --> 02:08:06.000
Dann mache ich jetzt ganz kapitalismusgeil erst den Marker

02:08:06.000 --> 02:08:09.000
für den Einschub und starte dann die Werbung.

02:08:09.000 --> 02:08:12.000
Sehr gut.

02:08:12.000 --> 02:08:15.000
Bitte schön.

02:08:15.000 --> 02:08:18.000
Hey, hey du, schön, dass du da bist.

02:08:18.000 --> 02:08:21.000
Na, öfter hier?

02:08:21.000 --> 02:08:24.000
Dir gefällt, was du hörst?

02:08:24.000 --> 02:08:27.000
Und du magst es am liebsten werbefrei und unabhängig?

02:08:27.000 --> 02:08:30.000
Dann freuen wir uns sehr

02:08:30.000 --> 02:08:33.000
über ein paar Euro in unserem digitalen Strumpfband

02:08:33.000 --> 02:08:36.000
unter www.bwsi.de.

02:08:36.000 --> 02:08:39.000
Auf www.bwsi.de

02:08:39.000 --> 02:08:42.000
findest du noch ca. 69 weitere Wege,

02:08:42.000 --> 02:08:45.000
uns zu supporten.

02:08:45.000 --> 02:08:48.000
Wir danken dir.

02:08:48.000 --> 02:08:51.000
Wir danken dir.

02:08:51.000 --> 02:08:54.000
Und jetzt habe ich noch einen Einschub.

02:08:54.000 --> 02:08:57.000
Ich habe was gebastelt nebenher so ein bisschen.

02:08:57.000 --> 02:09:00.000
Man hat es kaum gehört.

02:09:00.000 --> 02:09:03.000
Man hat es kaum gehört.

02:09:03.000 --> 02:09:06.000
Ich habe einen Link zu einem Pen gepostet.

02:09:06.000 --> 02:09:09.000
Da kannst du vielleicht mal draufklicken.

02:09:09.000 --> 02:09:12.000
Installiere ich mir da jetzt ein Virus?

02:09:12.000 --> 02:09:15.000
Ja, klar.

02:09:15.000 --> 02:09:18.000
Okay, gut.

02:09:18.000 --> 02:09:21.000
Dann klicke ich drauf.

02:09:21.000 --> 02:09:24.000
Dann klicke ich drauf.

02:09:24.000 --> 02:09:27.000
Das dauert lange zu laden. Warum eigentlich?

02:09:27.000 --> 02:09:30.000
Vielleicht, weil das Olama noch läuft bei mir.

02:09:30.000 --> 02:09:33.000
Und zwar habe ich mich das jetzt vorher nicht losgelassen.

02:09:33.000 --> 02:09:36.000
So irgendwie, dieses hier ist was falsch geschrieben.

02:09:36.000 --> 02:09:39.000
Und das Ruby-Element nutzen, um da irgendwie dann

02:09:39.000 --> 02:09:42.000
Korrekturvorschläge drin anzuzeigen.

02:09:42.000 --> 02:09:45.000
Und das musste ich jetzt einfach mal schnell

02:09:45.000 --> 02:09:48.000
in einem Code-Pen umsetzen.

02:09:48.000 --> 02:09:51.000
Also ich habe da den Satz, das ist flasch geschrieben.

02:09:51.000 --> 02:09:54.000
Und als Vorschläge sollen da falsch und flasche erscheinen.

02:09:54.000 --> 02:09:57.000
Sodass ich dann draufklicken kann und das wird korrigiert.

02:09:57.000 --> 02:10:00.000
Und dafür habe ich jetzt das Ruby-Element genutzt.

02:10:00.000 --> 02:10:03.000
Weil ja da standen für textuelle Annotations.

02:10:03.000 --> 02:10:06.000
Und da würde ich Korrekturvorschläge zu dem Wort tatsächlich

02:10:06.000 --> 02:10:09.000
dazuzählen, kann man das benutzen.

02:10:09.000 --> 02:10:12.000
Und zwar, und deswegen kommt es ja heute auch in der Episode drin vor,

02:10:12.000 --> 02:10:15.000
wenn ich das richtig verstanden habe,

02:10:15.000 --> 02:10:18.000
und ich habe nichts Gegenteiliges in der MDN gefunden,

02:10:18.000 --> 02:10:21.000
Ruby, RT und dieses Ersatzelement, das sind doch alles Inline-Elemente.

02:10:21.000 --> 02:10:24.000
Dann sollte es doch kein Problem sein,

02:10:24.000 --> 02:10:27.000
die in ein Block-Element zu setzen.

02:10:27.000 --> 02:10:30.000
Korrekt?

02:10:30.000 --> 02:10:33.000
Ja.

02:10:33.000 --> 02:10:36.000
Wenn ich, das funktioniert, wenn ich einfach nur links in das HTML-Feld

02:10:36.000 --> 02:10:39.000
im Code-Pen-Editor den Satz reinschreibe,

02:10:39.000 --> 02:10:42.000
funktioniert das problemlos.

02:10:42.000 --> 02:10:45.000
Aber sobald ich ein P drumrum rappe,

02:10:45.000 --> 02:10:48.000
geht komplett der ganze Style verloren von dem Ruby.

02:10:48.000 --> 02:10:51.000
Dann ist es nämlich, dann ist es eine UN-Liste für die Vorschläge,

02:10:51.000 --> 02:10:54.000
die ich da reingesetzt habe.

02:10:54.000 --> 02:10:57.000
Es ist plötzlich alles umgesetzt, es ignoriert komplett die CSS-Regeln.

02:10:57.000 --> 02:11:00.000
Dann habe ich geguckt über Inspect, warum ist das so?

02:11:00.000 --> 02:11:03.000
Und es ist, weil es dann im Browser,

02:11:03.000 --> 02:11:06.000
im DOM, wenn ich mir das anschaue,

02:11:06.000 --> 02:11:09.000
über das Inspect-Tool,

02:11:09.000 --> 02:11:12.000
das Ruby-Element,

02:11:12.000 --> 02:11:15.000
beziehungsweise doch, das ist innerhalb von dem P.

02:11:15.000 --> 02:11:18.000
Ich dachte nämlich, das setzt irgendwie außerhalb.

02:11:18.000 --> 02:11:21.000
Ah, nee, weil ich ein ul-Element drin habe.

02:11:21.000 --> 02:11:24.000
Das ist das Problem.

02:11:24.000 --> 02:11:27.000
Das habe ich gerade auch gedacht, du hast ja noch ein Block-Element reingepackt.

02:11:27.000 --> 02:11:30.000
Ich habe das ul, das ist ja der Block.

02:11:30.000 --> 02:11:33.000
Macht aber nix, macht ja keinen Unterschied,

02:11:33.000 --> 02:11:36.000
weil es im DOM ja trotzdem anders angeordnet wird.

02:11:36.000 --> 02:11:39.000
Okay, das heißt, das Problem ist, ich darf da drin keine Liste verwenden,

02:11:39.000 --> 02:11:42.000
weil das dann tatsächlich eine,

02:11:42.000 --> 02:11:45.000
weil das dann eben ein Block-Element ist.

02:11:45.000 --> 02:11:48.000
Das heißt, ich könnte es aber so basteln,

02:11:48.000 --> 02:11:51.000
dass diese Liste halt keine Liste ist, halt semantisch dann schon wieder blöd.

02:11:51.000 --> 02:11:54.000
Und könnte es einfach so irgendwie

02:11:54.000 --> 02:11:57.000
wie eine Liste quasi darstellen untereinander.

02:11:57.000 --> 02:12:00.000
Das würde gehen, ja, macht Sinn.

02:12:00.000 --> 02:12:03.000
Aber dann könnte ich tatsächlich dieses Ruby-Dings benutzen,

02:12:03.000 --> 02:12:06.000
um zu sagen, wenn ich da draufklicke,

02:12:06.000 --> 02:12:09.000
das müsste ich halt wahrscheinlich dann leider per JavaScript machen,

02:12:09.000 --> 02:12:12.000
weil, oder warte mal, wie kann ich dem,

02:12:12.000 --> 02:12:15.000
na doch, ich kann doch dem,

02:12:15.000 --> 02:12:18.000
ich könnte dem Ruby ein Tab-Index geben,

02:12:18.000 --> 02:12:21.000
dann ist es fokussierbar, ne?

02:12:21.000 --> 02:12:24.000
Ja.

02:12:24.000 --> 02:12:27.000
Tab-Index gleich null kann ich machen, ne?

02:12:27.000 --> 02:12:30.000
Dann ist es fokussierbar,

02:12:30.000 --> 02:12:33.000
aber hat keine besondere Reihenfolge.

02:12:33.000 --> 02:12:36.000
Richtig, so war das doch, oder?

02:12:36.000 --> 02:12:39.000
Und dann könnte ich sagen, das Ruby-UL ist standardmäßig.

02:12:39.000 --> 02:12:42.000
Ja, aber etwas fokussieren, mit dem ich nichts tun kann,

02:12:42.000 --> 02:12:45.000
ist halt Käse.

02:12:45.000 --> 02:12:48.000
Ja, kann ich ja aber. Ich kann ja was tun.

02:12:48.000 --> 02:12:51.000
Ich kann ja eben dann auswählen, also ich sag jetzt mal,

02:12:51.000 --> 02:12:54.000
Display, das seht ihr jetzt natürlich nicht,

02:12:54.000 --> 02:12:57.000
Display none, und könnte jetzt sagen,

02:12:57.000 --> 02:13:00.000
aber wenn ich das Ruby-Element fokussiert hab,

02:13:00.000 --> 02:13:03.000
dann Display block.

02:13:03.000 --> 02:13:06.000
Das ist schon hacky.

02:13:06.000 --> 02:13:09.000
Speicherst du das gerade alles auf?

02:13:09.000 --> 02:13:12.000
Nee, ich probier's grad erst mal auf, bevor ich sag, ja, tatsächlich, es geht.

02:13:12.000 --> 02:13:15.000
Aber ich möchte natürlich nicht block, soll ja inline sein, logischerweise, inline.

02:13:15.000 --> 02:13:18.000
Inline-Element. Ja, das geht tatsächlich.

02:13:18.000 --> 02:13:21.000
Speicher mal.

02:13:21.000 --> 02:13:24.000
Ich speicher's gleich noch hier.

02:13:24.000 --> 02:13:27.000
So, jetzt speicher ich.

02:13:27.000 --> 02:13:30.000
Ich krieg das dann auch in die Shownotes kopiert.

02:13:30.000 --> 02:13:33.000
So, jetzt kannst du nochmal laden.

02:13:33.000 --> 02:13:36.000
Jetzt kannst du nämlich auf das flaschgeschriebene Wort draufklicken.

02:13:36.000 --> 02:13:39.000
Und dann geht das auf.

02:13:39.000 --> 02:13:42.000
Okay, ja.

02:13:42.000 --> 02:13:45.000
Was dann passiert, das wird ja sowieso per JavaScript passieren.

02:13:45.000 --> 02:13:48.000
Und dass du das dann anklicken kannst.

02:13:48.000 --> 02:13:51.000
Allerdings ist das halt auch wieder,

02:13:51.000 --> 02:13:54.000
das ist ja auch wieder überhaupt nicht accessible.

02:13:54.000 --> 02:13:57.000
Wahrscheinlich, ne?

02:13:57.000 --> 02:14:00.000
In dem Fall wäre wahrscheinlich ein Popover oder zumindest ein Dialog,

02:14:00.000 --> 02:14:03.000
der dann automatisch wieder den Fokus erhält und so,

02:14:03.000 --> 02:14:06.000
wäre natürlich die bessere Lösung.

02:14:06.000 --> 02:14:09.000
Oder ich müsste es per JavaScript machen, dass es eben nicht der Fokus ist,

02:14:09.000 --> 02:14:12.000
sondern dass es bei Fokus, weil ich weiß nicht,

02:14:12.000 --> 02:14:15.000
Popover fände ich tatsächlich genau das Richtige an der Stelle.

02:14:15.000 --> 02:14:18.000
Also so vom Gefühl her.

02:14:18.000 --> 02:14:21.000
Aber ich fand's einfach mal interessant,

02:14:21.000 --> 02:14:24.000
weil ja angeblich die semantisch richtige Lösung eben wäre,

02:14:24.000 --> 02:14:27.000
das Ruby Element zu nutzen, weil es eine textuelle Anmerkung,

02:14:27.000 --> 02:14:30.000
Annotation zu diesem Wort ist.

02:14:30.000 --> 02:14:33.000
Interessant, ja.

02:14:33.000 --> 02:14:36.000
Das könnte man jetzt natürlich versuchen.

02:14:36.000 --> 02:14:39.000
Also erstmal müsste man das ul wieder loswerden.

02:14:39.000 --> 02:14:42.000
Wie der Browser das ...

02:14:42.000 --> 02:14:45.000
Einfach nur, damit das Ruby Element weiter verbreitet wird.

02:14:45.000 --> 02:14:48.000
Ja, genau.

02:14:48.000 --> 02:14:51.000
Fand ich einfach mal interessant. Wie gesagt, poste ich rein.

02:14:51.000 --> 02:14:54.000
Man müsste das noch ein bisschen umbauen, damit es tatsächlich funktioniert,

02:14:54.000 --> 02:14:57.000
ohne das Block-Element im Line-Element.

02:14:57.000 --> 02:15:00.000
Aber hat mich jetzt gereizt, einfach mal damit zu basteln.

02:15:00.000 --> 02:15:03.000
Jetzt schmiert mir grad irgendwie der Chrome ab.

02:15:03.000 --> 02:15:06.000
Das ist doch keine gute Idee. Ah, jetzt.

02:15:06.000 --> 02:15:09.000
Genau.

02:15:09.000 --> 02:15:12.000
Ja, so viel als Einschub noch dazu.

02:15:12.000 --> 02:15:15.000
Und dann kommt jetzt ...

02:15:15.000 --> 02:15:18.000
... das Ende.

02:15:18.000 --> 02:15:21.000
Yeah!

02:15:21.000 --> 02:15:24.000
Das hat geklappt.

02:15:24.000 --> 02:15:27.000
Allerdings.

02:15:27.000 --> 02:15:30.000
So, heute haben wir wieder abgelehnt.

02:15:30.000 --> 02:15:33.000
Ich dachte noch, es wird eine ganz kurze Folge.

02:15:33.000 --> 02:15:36.000
Da, finde ich, hätten wir uns die eine oder andere Spende verdient.

02:15:36.000 --> 02:15:39.000
Ich wollte es nur noch mal sagen.

02:15:39.000 --> 02:15:42.000
Katsching!

02:15:42.000 --> 02:15:45.000
Katsching.

02:15:45.000 --> 02:15:48.000
Ende-Dschingel hast du extra reingeschrieben.

02:15:48.000 --> 02:15:51.000
Ja, Ende-Dschingel habe ich reingeschrieben, weil wir noch den Einschub hatten,

02:15:51.000 --> 02:15:54.000
aber es schon in dem End-Dings drin war.

02:15:54.000 --> 02:15:57.000
Aber wir haben ihn ja nicht vergessen.

02:15:57.000 --> 02:16:00.000
Und da ist alles gut.

02:16:00.000 --> 02:16:03.000
Bestellt das Poster.

02:16:03.000 --> 02:16:06.000
Das ist auf jeden Fall das Allerwichtigste,

02:16:06.000 --> 02:16:09.000
was ich vorhin angeteasert habe in unserem Merch-Shop.

02:16:09.000 --> 02:16:12.000
Wir freuen uns über Bewertungen.

02:16:12.000 --> 02:16:15.000
Das wollte ich noch mal sagen.

02:16:15.000 --> 02:16:18.000
Ich hab gesehen, bei Spotify haben wir auch mittlerweile ein paar Bewertungen.

02:16:18.000 --> 02:16:21.000
Bewertet uns gern bei Spotify.

02:16:21.000 --> 02:16:24.000
Bewertet uns gern bei Apple oder bei allen möglichen anderen.

02:16:24.000 --> 02:16:27.000
Ja.

02:16:27.000 --> 02:16:30.000
Wir haben dich lange nicht mehr genutzt.

02:16:30.000 --> 02:16:33.000
Deswegen drückt auf die Glocke.

02:16:33.000 --> 02:16:36.000
Genau, drückt auf die Glocke.

02:16:36.000 --> 02:16:39.000
Drückt einfach auf irgendeine Glocke.

02:16:39.000 --> 02:16:42.000
Egal, wo ihr eine findet, drückt einfach mal drauf.

02:16:42.000 --> 02:16:45.000
Guckt, was passiert.

02:16:45.000 --> 02:16:48.000
Bewertet uns gerne bei allen möglichen Podcast-Portalen.

02:16:48.000 --> 02:16:51.000
Schaut mal bei uns im Stream vorbei.

02:16:51.000 --> 02:16:54.000
Unter twitch.tv.

02:16:54.000 --> 02:16:57.000
Da streamen wir in mehr oder weniger regelmäßigen Abständen.

02:16:57.000 --> 02:17:00.000
Einmal die Woche, manchmal zweimal die Woche.

02:17:00.000 --> 02:17:03.000
Das ist noch ein bisschen laberiger als hier.

02:17:03.000 --> 02:17:06.000
Da darf man aber auch mitchatten und mitreden.

02:17:06.000 --> 02:17:09.000
Da haben wir Technik-Themen.

02:17:09.000 --> 02:17:12.000
Wir gucken uns manchmal Videos gemeinsam an,

02:17:12.000 --> 02:17:15.000
die wir dann aufblasen auf extreme Längen.

02:17:15.000 --> 02:17:18.000
Wir coden gemeinsam.

02:17:18.000 --> 02:17:21.000
Wir schauen uns alle möglichen technischen Sachen zusammen an.

02:17:21.000 --> 02:17:24.000
Das lohnt sich meiner Meinung nach.

02:17:24.000 --> 02:17:27.000
Zumindest für ein paar Leute, die immer dabei sind,

02:17:27.000 --> 02:17:30.000
lohnt es sich auf jeden Fall.

02:17:30.000 --> 02:17:33.000
Haben wir alles abgedeckt?

02:17:33.000 --> 02:17:36.000
Nix mehr, haben wir alles abgedeckt.

02:17:36.000 --> 02:17:39.000
Seid ihr alle gedeckt jetzt?

02:17:39.000 --> 02:17:42.000
Alle sind gedeckt.

02:17:42.000 --> 02:17:45.000
Dann sagen wir bis bald.

02:17:45.000 --> 02:17:48.000
Wir sehen uns beim nächsten Mal.

02:17:48.000 --> 02:17:51.000
Auf Wiedersehen.