Wo wir sind, ist vorne, Folge 56. Heute geht's ganz kurz. Versprochen. Herzlich willkommen bei Wo wir sind, ist vorne. Frontend-Fakten-Frotzeleien. Der Late-Night-Frontend-Talkshow rund um Webdesign und Entwicklung. Es reden sich um Head und Kragen, HTML-Fundamentalist Moritz Gießmann und JavaScript-Jongleur Konstantin Groß. Hallihallo Hallöhle. Hallo. Erinnerst du dich noch? Was? An die Spinat-Werbung mit Verona Poth. Nee, tatsächlich nicht.
Passt ganz gut zu Retro, weil heute wird's hauptsächlich Retro geben und dein DJ-Set wird Retro. Und deswegen dachte ich, steig ich an die Anruhe ein. Das wird vor allem auch richtig schlecht, aber es wird auch Retro. Deswegen ist es ja richtig geil. Ja, es war heute alles ein bisschen anders geplant, aber es gibt heute, damit wir nicht noch länger euch hier auf glühenden Kohlen sitzen lassen, weil ich weiß, dass ihr uns alle ganz doll vermisst habt und ganz arg drauf gewartet habt.
Also es hat tatsächlich schon jemand gemeint, wann gibt's dann mal endlich wieder eine Folge extra in den Stream gekommen, um zu gucken, wann's mal wieder eine neue Podcast-Folge gibt. Und damit wir euch nicht enttäuschen, gibt's jetzt eine kurze Folge. Eigentlich wollten wir mit unserem HTML-Gedöns mal weitermachen und das kommt auch noch, versprochen, weil wir haben auch schon Leute nachgefragt. Und auf Grid warten die Leute und das kommt alles noch.
Aber heute gibt's einfach einen Zwischenruf. Und wir melden uns, dass wir wieder da sind. Eine Property gibt's auch noch. Und genau. Hast du was zu trinken? Ja, ich hab hier, ich hab hier Clubomato. Gar nichts, nichts Unspektakuläres. Also nichts Spektakuläres. Gar nichts Unspektakuläres. Aber ich schüttel sie gerne, die ist leider schon offen, aber ich schüttel sie gerne noch mal so ein bisschen, damit wir noch ein kleines Geräusch haben. Also warte.
Ich hab auch nichts Unspektakuläres. Ich hab auch nichts Unspektakuläres. Ich hab Fritz Spritz Biotraubenschorde. Boah, das klingt gut. Oh, zeig mal, zeig mal. Ah, das ist so eine violette Flasche. Schön. Also wenn ihr sehen könntet, was der Konstantin da für ein Flaschenöffner hat. Das ist ja ein ... Okay, gut, er verschwendet jetzt erstmal alles. Aber der Flaschenöffner, das ist so einer, mit dem du auch so Gläser aufmachen kannst. Wir haben so ein Gummig am Rand und so zack.
Und sieht super verrostet aus. Ich weiß nicht, ob das jetzt nur so ... Der ist von meiner Oma noch. Das ist ein Wahnsinnsgerät. Ich glaub, damit kannst du auch Einbrecher fernhalten und so. Das ist von Schießend, ja. Und Eispickel und das ist, glaub ich, alles ... Ja, da kannst du, guck mal hier, da ist ein Dorn dran. Da kannst du Löcher reinmachen, damit das dann so klackt. Löcher in die Einbrecher. Löcher in die Einbrecher notfalls auch.
Genau, ja, also da kannst du auch Frisbee mitspielen, glaub ich, und als Boomerang verwenden. Ich glaub, auch damit kannst du den Mount Everest besteigen. Wahrscheinlich, wahrscheinlich. Also von innen. Deswegen hab ich den. Lass uns den Mount Everest von innen besteigen. Ich mach jetzt noch hier ein bisschen Rabatz und hoffe, dass es bei mir jetzt nicht so arg schäumt, weil ich muss jetzt echt aufpassen, weil ich hab extra ein bisschen geschüttelt, weil sie ...
Uh. Ja, nicht, dass du das gleiche Problem hast wie ich. Nee, ich warte jetzt noch kurz. Okay. Ja, gut, also, ja, mach mal Retro, oder? Genau, heute ist kurz, ohne Thema, aber mit Retro und mit Property und mit Geilteil. So, nochmal ganz kurz. Sehr schön. Damit ihr Geilteil haben wir auch. Ja. Dann nicht lang schnacken. Ja, der erste Punkt ist ein bisschen so der Internationalität gewidmet.
Und zwar, weil jetzt in letzter Zeit, also, es hat angefangen, glaube ich, so mit der Beyond-Tallerrand, wo wir rausgefunden haben, dass jemand von den Philippiden uns hört, aber jetzt irgendwie auch noch jemand aus Schweden und Österreich weiß ich auch und Schweiz weiß ich auch. Und ich hab mich mega gefreut. Und Spanien. Also, Spanien war auch, hab ich sonst noch was vergessen? Schreibt uns mal. Genau, schreibt uns mal einen Kommentar unter diese Folge.
Ich bin noch ein bisschen verschnupft, ich glaube, man hört es noch ein bisschen. Schreibt uns einen Kommentar unter diese Folge, wenn ihr uns aus einem Land hört, außer Deutschland, was wir jetzt noch nicht genannt haben. Das würde uns sehr, sehr interessieren. Also, einfach total toll, das mitzukriegen, dass wir HörerInnen in so vielen verschiedenen Bereichen der Erde haben. Und dass uns die Statistik auch nicht anlügt, ne?
Wir haben das ja schon gesehen, also, Philippinen tauchte da auf und Spanien tauchte da auf. Und ich sage, das kann doch nicht sein. Das ist nicht viel, aber es sind immer so ein paar Prozentchen. Das sind alles Bots. Aber ihr seid gar keine Bots. Ja, aber auch so Geo-IP-Sachen, ich halte das auch für so halb so, ja, das ist, glaube ich, meistens auch so. Aber es ist der Philippinen, Spanien, das hat schon, das war schon echt. Ja, verrückt, ne?
Also, das freut mich und dich, glaube ich, auch sehr. Und wir würden gerne noch mehr von euch hören, wo kommt ihr her? Das würde mich auch interessieren, wenn jemand von euch nicht Deutsch-Muttersprachler ist und uns zuhört, um vielleicht Deutsch zu lernen, also irgendwie tekaffin und versucht, Deutsch zu lernen. Also, schreibt uns mal. Schreibt uns mal so in die Kommentare, wer ihr seid, weil ihr kennt uns, wir kennen euch noch nicht. Deutsch lernen mit Provisen ist vorne.
Ich habe jetzt bei dem letzten Treffen geändert, aber erzählt doch mal was über euch. Ich habe tatsächlich auf diese Art versucht, ein bisschen Englisch zu lernen oder habe das eine Zeit lang mir reingezogen. Und zwar habe ich damals gehört, Borg World, vielleicht kennt es noch der eine oder die andere. War auch ein Web-Development-Podcast von Paul Borg. Ich weiß nicht, ob ich das noch richtig ausspreche. Das ist schon sehr, sehr, sehr lange her. Ich weiß gar nicht, ob es den noch gibt.
Ich muss gerade mal kurz googeln. Und das war halt so, ich konnte damals schon so ein bisschen Englisch, halt so Schulenglisch, aber das war halt dann so richtig britisch. Und das war dann so für mich komplett neu. Und ich erinnere mich noch, dass ein Kollege zu mir meinte, Mensch, irgendwie so, wenn du irgendwie noch die Sprache besser lernen willst, dann musst du einfach irgendwie Serien reinziehen oder Podcasts hören in der Sprache. Und ich habe gesagt, hey, wie soll das gehen?
Ich verstehe da kein Wort. Wenn ich da miteinander spreche, hat er gemeint, das musst du einfach nur eine Weile durchziehen. Immersion oder Immersion ist das Stichwort, also eintauchen. Also einfach nur die Sprache auf dich reinprasseln lassen, weil wenn man mal genau überlegt, ist es genau so, wie kleine Kinder auch ihre Muttersprache lernen. Also einfach möglichst viel in dieser Sprache baden. Es ist so verrückt.
Ich konnte das damals nicht glauben, weil ich habe Bauer World gehört und habe wirklich so jedes zwanzigste Wort verstanden. Und das in einem Podcast, der sich mit meiner Profession beschäftigt, wo ich gedacht habe, da verstehe ich irgendwie mehr. Aber ich fand, es war für mich damals unfassbar schwer zu verstehen. Aber es ist tatsächlich so, wenn man sich dem aussetzt für eine Weile, irgendwann kommt man rein. Irgendwann kommt man immer tiefer rein und sagt, ah, stimmt das?
Und in dem Zusammenhang, ah, vielleicht meint er das, ah, der spricht das so aus. Also das kann ich nur extrem empfehlen, wenn man irgendwie eine Sprache lernen will, dass man sich der einfach aussetzt, auch wenn man es nicht versteht zunächst. Man kommt da dann irgendwie langsam rein. Also ich glaube nicht, dass es funktioniert, wenn man gar keine Vokabeln kennt in der Sprache. Da sollte man schon ein bisschen Grundwissen haben.
Dann braucht man zumindest irgendwie Bilder, glaube ich, dazu, damit man das verknüpfen kann. Aber genauso habe ich auch früher Star Trek Next Generation geschaut. Da war mein Englisch auch noch deutlich schlechter, habe ich am Anfang auch nichts verstanden. Aber ich kannte das Star Trek auf Deutsch. Das war nämlich schon mal ein Vorteil. Also das heißt, so ein paar Worte, so spezifische Worte, die kannte man.
Und dachte, ah, okay, das klingt irgendwie so ähnlich, das ist wahrscheinlich das. Und dann, nachdem du irgendwie 20 Folgen geschaut hast, bist du dann total drin irgendwie. Und ja, also schreibt uns, um es nochmal kurz zu machen, schreibt uns mal, wo ihr herkommt, von wo aus ihr uns hört. Das würde mich sehr interessieren. Ja. Gut, ich habe gerade eben schon angesprochen, Treffen, dass wir beim Treffen das geändert haben so ein bisschen, dass nur ihr uns kennt und wir euch nicht.
Und es gibt noch ein nächstes Treffen, das jetzt geplant ist. Und zwar in Karlsruhe. Und das hat Bugs Bunny hat das initiiert, einer unserer Stream-Zuschauer. Und wir würden uns freuen, wenn ihr am 27.05., das ist ein Samstag, also wenn der Podcast erscheint, vermutlich eine Woche später. Oder ein bisschen weniger, das ist jetzt ein bisschen knapp, aber wir hoffen, dass trotzdem noch ein paar vielleicht kommen.
Und wir packen euch den Link in die Shownotes, wo ihr euch einfach in so eine Liste eintragen könnt. Also notfalls sind wir auch zu dritt, ist auch kein Problem, aber wäre natürlich schön, wenn wir noch ein paar mehr kommen würden. Wenn ihr irgendwie in der Nähe von Karlsruhe wohnt oder auch mal Lust habt, irgendwie für einen Samstagabend herzufahren, dann tragt euch gerne eine eigene Liste.
Oder nutzt das nochmal die Gelegenheit für einen Tagesausflug nach Karlsruhe. Karlsruhe ist sehr schön. Jetzt seitdem die ganzen Baustellen in der Innenstadt auch nicht mehr so, ah, da kommen jetzt wieder neue, gell. Ja, ja, verkaufs nicht so gut, also. Seitdem die U-Bahn fertig ist, ist es auch wieder sehr schick hier und irgendwie mal ein bisschen flanieren. Es gibt zwar keine Läden mehr, aber. Es gibt nur noch Fressläden, es gibt keine, ja, egal.
Nee, es stimmt, es steht viel leer tatsächlich in der Fußgängerzone mittlerweile, weil da kommt bestimmt irgendwas nochmal rein. Und außerdem kommt ihr hauptsächlich wegen uns. Aber das Schloss ist sehr schön, der Schlossgarten ist schön, der Zoo, der Stadtgarten ist sehr schön. Also es gibt schon auch viele schöne Ecken. Genau, also Karlsruhe ist schon eine schöne Stadt und vielleicht wird das ja auch ein schöner Sommertag.
Würde mich jetzt nicht wundern, bei dem Datum so irgendwie so Ende Mai könnte ein schöner Sommertag werden. Also lohnt es sich vielleicht auch einfach mal für ein Wochenende herzukommen oder so und dann kommt ihr einfach uns auch mal besucht. Und genaue Infos gibt es natürlich dann noch über die diversen Kanäle, wann und wo, beziehungsweise das Wann wissen wir eigentlich auch schon.
Wir wollten ins Hotel Santo, die haben eine gute Cocktailbar und genaue Uhrzeit und so weiter, das kriegt ihr dann über diverse Kanäle mit. Genau, also Mastodon, Twitter vielleicht auch noch. Es wird auf jeden Fall in dem Dokument, da werden wir es auch reinschreiben. Also da werden die genauen Daten auch dann drinstehen. Genau. Dann, schon wieder da.
Dann müsst ihr euch zu dem Dokument nochmal, das ist so auf dem Etherpad basierendes Ding, da müsst ihr euch nicht anmelden oder irgendwas, das ist einfach so ein Dokument, da könnt ihr einfach euch reinschreiben und gut ist, ganz easy. Okay, dann haben wir gleich das nächste Treffen. Genau, und zwar, ja, nicht nur Treffen, sondern auch, wir machen da was.
Und zwar sind wir, das haben wir auch schon angekündigt, aber im Podcast glaube ich noch nicht, wir sind auf der Gulaschprogrammiernacht dieses Jahr, auch in Karlsruhe. Das ist eine Veranstaltung, wer sie nicht kennt, die geht vier Tage lang, ist im ZKM hier, das Zentrum für Kunst und Medien. Und ist ein relativ großes Ding, es gibt sehr viele Parallelveranstaltungen auch, was sind es denn hier, eins, zwei, drei, vier, fünf, sechs, sieben, acht Tracks.
Krass, aber es ist alles so ein bisschen, es ist teilweise auch zeitversetzt, teilweise parallel und es ist einfach irgendwie, ja, ist auch nicht so, dass man jetzt da strikt von vorne bis hinten dabei sein muss, sondern man pickt sich mal was raus, ach, das klingt interessant. Und es gibt auch so ein Hacking-Space und es ist auch draußen und es gibt Gulasch natürlich, deswegen heißt es den Gulaschprogrammierner.
Vielleicht muss man dazu sagen, dass das vom Chaos Computer Club in Karlsruhe organisiert ist von Entropia. Also es ist eine Chaos-Veranstaltung, wer den Chaos Communication Congress kennt, das ist so ähnlich, nur in eine deutliche Nummer kleiner und um Spenden wird gebeten, aber es kostet, glaube ich, auch keinen Eintritt. Genau, also kostenlos gibt es sogar, ist sogar das Bahnticket mit drin, also Hin- und Rückfahrt an jedem der Konferenztage mit der Bahn.
Also innerhalb von Karlsruhe, logischerweise, also ÖPNV oder Bus. Genau, und da geht es alles mögliche, hier geht es um LED-Strips, Everywhere for Everyone ist ein Ding und irgendwelche mit Raspberry Pi was und Elektronik-Design, also es ist schon sehr technisch, genau. Und wir sind da auch, Samstagabend, am 10. Juni. Samstagabend 20.45 Uhr. Samstagabend 20.45 Uhr, aktuell, vielleicht schiebt sich's nochmal.
Genau, dieser Fahrplan, der ändert sich auch vielleicht nochmal, er hat sich schon mindestens einmal geändert. Schaut einfach nach, wo wir sind, ist vorne in dem Bahn, da findet ihr uns schon. Wir haben es mal genannt, War Wars, A New Scope. Best of, wo wir sind, ist vorne live. Auch lange gesessen an dem Titel. Ja, lange an dem Titel gesessen und dafür hatten wir dann keine Zeit mehr vorzubereiten, was wir da eigentlich machen.
Aber wir haben tatsächlich uns vorgenommen, so ein kleines Best of zu machen, auch vielleicht ein paar Demos zu zeigen, aber gleichzeitig auch eine Podcast-Folge da dann aufzunehmen, die dann auch veröffentlicht wird. Der Fokus wird allerdings mehr auf, wir sind auf einer Bühne liegen und wir sind da bei einer Veranstaltung. Das heißt, ich bin mir nicht so sicher, ob der Podcast dann wirklich für Menschen, die nicht vor Ort sind, so super entertaining wird, vielleicht schon.
Muss man einfach mal gucken, was das dann wird. Ich habe schon solche Podcasts von anderen Formaten gehört, wo ich dann so dachte, die sind alle betrunken. Wie soll ich denn jetzt das ertragen, ohne auch betrunken zu sein? Und dann habe ich mich betrunken und dann ging's. Ich habe zumindest die Hoffnung, dass wir den Applaus dann nicht vom Soundboard einspielen müssen. Achso, das müssen wir noch drauf. Ja, wer weiß, vielleicht aber die Buh-Rufe, die kommen vielleicht dann auch.
Oder dass wir die überspielen müssen, mal gucken. Genau, wir machen ein buntes Potpourri an lustigen Sachen, wo wir uns auch überlegt haben, so ein bisschen Browser kaputt spielen, so was passt zu einem Chaos-Event-Hacking, passt da dazu. Müssen wir mal schauen, was wir in dieser Richtung schon gemacht haben. Ein paar Demos zeigen, wo der Moritz versucht hat, irgendwie alles kaputt zu machen, erfolgreich. Das habe ich ja eigentlich, so richtig habe ich es ja noch nie geschafft.
Ja, aber schön bunt war es zumindest. Schön bunt war es, schön bunt war es, genau. Hat nicht geklappt, aber schön bunt war es. Das wäre auch ein T-Shirt-Spruch. Punkt, Punkt, Punkt, aber schön bunt war es. Oder auch, hat nicht geklappt, aber schön bunt war es. Sehr gut. Ja, da würden wir uns extrem freuen, wenn ihr da kommen würdet. Also, wie gesagt, das ist am 10. Juni, Samstag, den 10. Juni, um 20.45 Uhr zur Primetime im blauen Salon. Zumindest ist das jetzt derzeit auf dem Plan.
Das ist einer dieser Vortragsräume, da kommt ihr einfach vorbei und ja, genau. Habt Spaß und treffen wir uns auch noch. Und man trifft sich danach und davor dort, genau. Ja, und dann, wir bleiben auch bei der GPN noch kurz, weil du machst ja auch noch was.
Ja, wir hatten ja, das war ja auch, glaube ich, im Podcast, haben wir auch darüber gesprochen, ich habe mich für ein DJ-Set beworben bei der GPN, weil das ging auch, die haben nicht nur einen Call for Papers, die haben auch so einen Call for DJs oder so, weiß ich nicht, ob man das so nennt, ob das so hieß, gehabt.
Und ich habe schon seit vielen, vielen Jahren immer mal wieder gedacht, das wäre doch geil, mal aufzulegen, aber nicht irgendwas, sondern halt so 90er-Euro-Dance-Trash-Kram, einfach weil ich dafür ein Herz habe. Also, und andere würden das nennen Guilty Pleasures oder sowas wie, ja, das darf man sich ja nicht trauen, zu sagen, dass man sowas gut findet. Ich finde es total gut, ich habe da mega Spaß dran und genau, habe ich mich da beworben.
Und trotz, dass ich das noch nie gemacht habe, darf ich tatsächlich da auflegen. Allerdings ist da der Slot nicht ganz so Premium. Das ist dann Donnerstags, also den 8. Juni, das ist allerdings ein Feiertag. Ja, Feiertag, da könnt ihr alle kommen. Da könnt ihr alle kommen. Draußen beim Gulasch, also bei der Küche, von 15 bis 17 Uhr gibt es von mir Trash-90er-Euro-Dance und Guilty Pleasure.
Musik. Und wer sich nichts darunter vorstellen kann, das ist dann irgendwie so Blümchen, Backstreet Boys, Celine, Spiers. Genau, so, NSYNC und was sonst noch mir so einfällt an merkwürdiger Musik aus dieser Zeit oder vielleicht auch noch Älteres oder irgendwie mitkrölbares, wofür man sich so ein bisschen schämt, aber das ist dann einfach okay. Das ist der Safe Space für die Guilty Pleasures. Ihr dürft da hinkommen und da dürfen alle dann mitmachen. Genau, da freue ich mich extrem drauf.
Ich habe keine Ahnung, das wird wahrscheinlich alles total schief gehen, weil ich das noch nie gemacht habe. Ich habe mich jetzt im Vorfeld schon ein bisschen mit DJ Software und wie macht man denn sowas eigentlich? Und natürlich auch mit Hardware auseinandergesetzt und habe dann entschieden, nee, ich kaufe mir jetzt keine Hardware dafür. Ich habe mir schon so oft Hardware gekauft, die ich am Ende dann nur einmal verwendet habe oder so.
Diesmal bleibt es da tatsächlich irgendwie bei Audio Interface, was ich ja eh schon habe, Maus und Laptop und das soll es dann auch gewesen sein. Und genau. Ich bin sehr gespannt. Ich freue mich drauf. Ja, und ich erst. Ich hoffe, dass ich, ich hoffe, dass das irgendwie halbwegs irgendwie über die Bühne bringen. Aber es ist ja, wenn man sich ein bisschen mit Audio Technik schon auskennt, glaube ich, ist es nicht von Schaden. Und dann schauen wir mal, was passiert.
Im Zweifelsfall bewirft mich die Küche da mit Essen. Ich habe gehört, wenn die Küche glücklich ist, ist das super. Und die Leute, die da in der Schlange stehen zum Essen und wenn die nicht happy sind, dann drehen die einem Saft ab oder so. Ich weiß nicht genau. Okay, ich habe noch einen richtigen Retro-Punkt. Eigentlich haben wir ja gesagt, wir sprechen hier drüber, was wir so gemacht haben in letzter Zeit. Das war jetzt eigentlich eine Future-Retro.
Genau, das war alles nur so Ankündigungszeug und gar keine Retro. Aber es sind Dinge, die passiert sind, die wir dann ankündigen wollten. Jedenfalls habe ich im Stream schon mal gesagt, ich habe nachgefragt, ob ich meine Ideen habe. Weil ich möchte gerne so einen kleinen Service bauen. Geht so ein bisschen um Mental Health und so. Das haben wir, glaube ich auch, ich weiß nicht, ob ich es hier schon mal auch besprochen habe im Zuge der BT-Conf.
Und ich will aber die Daten gar nicht speichern. Ich will mich gar nicht um DSGVO kümmern wollen und ich will auch gar keine Daten haben. Also das sind ja auch teilweise dann wirklich persönliche Daten, wenn man so einen Mental Health Diary dafür, die will ich gar nicht haben. Ich will die gar nicht zu Geld machen und ich brauche die nicht. Ich habe da gar kein Interesse dran. Und jeder soll eigentlich seine Daten haben.
Und dann kam mir so die Idee, warum nicht so, jeder hat eigentlich schon so sein Cloud Storage, warum das nicht irgendwie einbinden. Und habe dann geguckt, gibt es da APIs? Ja, die gibt es. Dropbox, Google Drive, theoretisch auch iOS, iCloud. Wenn man denn Lust hat, da irgendwie Geld zu bezahlen, was ich nicht habe. Aber genau. Und habe dann mal geguckt, geht es da nicht was? Und ich habe irgendwie nichts gefunden, wo man so out of the box sagen kann, hier verknüpft das.
Und deswegen habe ich die Idee gehabt, das selber irgendwie so als Library zu schreiben. Habe da auch schon ein bisschen mit rumprogrammiert. Also so, dass du im Endeffekt sagst, okay, verknüpft das mit der Dropbox, verknüpft das mit Google Drive. So wie man es kennt von manchen Apps, die das machen, die ihre Daten da speichern. Aber halt gedacht für Web-Apps und für so, oder PWAs.
Und damit ich halt gar keinen, ich brauche keine gescheite Datenbankinfrastruktur und Firebase und schlag mich tot. Weil wie gesagt, ich will die Daten gar nicht haben. Und dann habe ich mal angefangen, mich so ein bisschen einzulesen. Dropbox-AP, Google Drive-AP. Und das läuft ja alles über OAuth. Ich habe übrigens auch einen Vortrag bei der Rudash-Programmier-Nacht darüber. Und das ist ja dieses, ja, meld mich an mit diesem Konto.
Also mit Google anmelden, mit Facebook anmelden, mit Twitter anmelden, man kennt es ja. Und darüber authentifiziert man das. Also man klickt dann da drauf, ja, bitte verlinken. Dann fragt einen das, okay, die App möchte bitte auf dein Dropbox-Konto zugreifen. Mit den Rechten möchtest du das autorisieren? Dann klickt man ja und dann, ne, also, naja, OAuth brauche ich, glaube ich, nicht erklären, ne? Und, äh. Weiß jeder, wie es funktioniert.
Ja, nicht andere Hut, aber ich meine, man kennt das ja eigentlich inzwischen von allen Anbietern. Wenn nicht, habe ich es jetzt kurz im Rissen. Genau. Aber jetzt zur technischen Implementierung. Eigentlich müsste man doch denken, so eine API, straightforward, und das gibt ein SDK, und das SDK übernimmt einem alles. Und ich sage einfach nur, okay, trigger die Authentifizierung, sobald die Authentifizierung da ist, äh, macht das, äh, führt das Callback aus und fertig.
Das wäre so meine Wunschvorstellung, wie das Anbinden von solchen APIs funktioniert. Und ich weiß aus leidlicher Erfahrung, dass das nicht so ist. Äh, ich habe mich so oft schon mit der PayPal, ähm, API mich rumgeärgert, weil ich versucht habe, die selber anzubieten und halt nicht irgendeinen fertigen Zahlungsprovider. Und dann sind die, die Sandbox-Server, äh, sind langsam und Dinge funktionieren einfach nicht so wie in der Anleitung.
Und dann dachte ich, okay, aber das ist vielleicht ja nicht das Maß aller Dinge, andere machen das bestimmt besser. Und so auf den ersten Blick sah jetzt Dropbox, ähm, auch deutlich verständlicher aus. Ähm, aber im Endeffekt ist es halt auch wieder, es gibt dann ein Dropbox-SDK, da muss man erstmal gucken. Es gibt irgendwie eins natürlich, äh, das dann irgendwo fremd gehostet ist und es gibt eins, das kann ich über NPM installieren.
Und dann funktionieren aber teilweise die Einbindungen von dem, äh, von dem Gehosteten und das von dem NPN, äh, NPM wird, ähm, wird anders angesprochen. Und dann findest du Code-Beispiele für das eine und es funktioniert dann aber mit dem anderen nicht und umgekehrt. Und, äh, und außerdem ist es halt nicht so, dass das SDK für dich alles abnimmt, sondern das SDK, was das eigentlich nur rappt, sind die, ähm, die, die REST-Requests.
Ähm, aber diese ganze Sache mit, okay, du leitest dann dahin und wenn du dann zurückgeleitet wirst, dann hängt da ein Query-Parameter an der URL an, wo dann dieser, äh, Auth-Token drin ist, äh, den du dann wiederum verwenden kannst. Ähm, äh, Refresh-Token vielleicht noch dabei, den du dann verwenden kannst, um einen neuen Auth-Token zu, äh, zu generieren.
Und, also ich hätte halt zumindest erwartet, dass das Auslesen aus der, aus dem Query-Parameter, dass, dass ich einfach irgendwie ein Callback zurückbekomme und da steht dann drin, das ist jetzt dein Auth-Token. Aber nein, ich muss tatsächlich, die haben da eine eigene Util-Library sich geschrieben für die Examples alleine schon, wo ich denke, dann packt's doch einfach ins SDK rein.
Aber nein, ich muss das Parsen aus dem, aus dem Parameter dann selber übernehmen und, und den ganzen Kram halt, was ich wo hinschicke und das, dann, das Refresh-Token hat eine Ablaufzeit und dann muss ich da drauf achten. Wenn das abgelaufen ist, muss ich's wieder mit hinschicken, damit ich den neuen Auth-Token bekomme und so weiter und so fort.
Und das ist so nervig, ich weiß gar nicht, also haben die Leute kein Interesse, dass man das Zeug einbindet, weil dann würden sie's, glaub ich, einfacher machen. Und mit Google Drive fang ich erst gar nicht an. Also wer schon mal bei Google-Diensten irgendwas versucht hat mit API-Keys und so, das ist immer ein Graffel, überhaupt so rauszufinden, welches jetzt der richtige ist und du hast dann diese Konsole da und dann gibt's verschiedene Authentifizierungsmöglichkeiten.
Aber ich hab's jetzt zumindest so weit, dass ich Dropbox verknüpfen kann und ich kann Dateien hochladen, ich kann Dateien runterladen, ich kann sogar einen Sync-Request, also läuft dann im Hintergrund mit einem Timeout von fünf Minuten oder was, läuft ein Request und das beendet sich quasi erst, wenn eine Dateiänderung festgestellt wurde.
Und nach Ablauf starte ich halt ein neues Request und so kann ich dann halt wirklich auch live synken, das funktioniert, also wirklich, ich speichere die Datei auf dem Computer und dann krieg ich im Browser drei Sekunden später, wenn das gesynkt ist, ein Aktualisierungs-Icon angezeigt und dann wird's automatisch gesynkt.
Und das Ziel ist halt, warum mach ich das überhaupt, man könnte auch sagen, man speichert sich einfach die Sachen irgendwie als JSON-Objekt in der JSON-Datei auf dem Rechner ab, aber ich will das ja gesynkt haben zwischen den Devices, das ist der eigentliche Grund, warum ich diese ganze Geschichte überhaupt mach.
Und das funktioniert jetzt soweit und ich hab jetzt vor, das in eine Library zu packen, hab sogar auch schon einen lustigen, coolen Namen dafür, den ich aber jetzt noch nicht verrate, damit mir keiner den NPM-Platz wegschnappt. Und wenn das soweit ist, dann, ja, werd ich's hier auch nochmal vorstellen. Also eine Library für diesen Zugriff?
Für einfach verschiedene Anbieter, also erstmal Dropbox und Google Drive, weil ich die halt einfach ohne was zu zahlen selber nutzen kann, wo du einfach nur deine, deine, dein Client, nee, Client-ID heißt das, was man sich da mal anlegen muss für jede App oder App-ID, mal manchen, die man da einfach nur reinhängt als Konfiguration und dann sagst du, okay, speicher mir die Settings, lade mir die Settings, synk die Settings und dann hast du die automatisch da drin.
Ich hab gerade mal nach iCloud geguckt, weil da hattest du ja auch irgendwie schon mal geschaut und hab jetzt ein, weiß nicht, wie gut es funktioniert und ob es, warte mal, ist das noch maintained, da sieht so aus. Ja, es gibt ein GitHub-Projekt, das heißt iCloud-RP und das ist auch ein NPM-Package, NPM-Install-Apple-iCloud und das scheint das zu machen irgendwie, das scheint so ein Rapper genau das zu sein.
Ja, aber vermutlich brauch ich halt auch wieder so einen Dev-Zugang, um das überhaupt testen zu können, ne? Da steht, dass das in-official iCloud-RP ist und das weiß ich nicht, vielleicht brauchst du es gar nicht. Kannst du mir gerne mal schicken, dann schau ich mir das mal an. Ja, keine Ahnung, ohne Garantie, ich hab noch, das war jetzt, der hat nur ganz schnell mal ergoogelt, ich schick's dir tatsächlich jetzt direkt.
Ich tue es auch mal in die Shownotes, dann kann man ja, das der Vollständigkeit halber, warte mal, ist es natürlich jetzt in der falschen Liste. So, zack, jetzt ist es richtig. Genau, kannst ja mal gucken, das sieht irgendwie schon vielversprechend aus, irgendwie mit Login und keine Ahnung, ob man dafür dann nochmal extra einen Key braucht. E-Mail und Passwort ein. Ja, da wird's halt dann schwierig, weil das Passwort will ich eigentlich auch nicht speichern.
Das Passwort von irgendwelchen Dritt, achso, die willst du eigentlich gar nichts. Also, die User müssten dann, ich müsste ja den Username und das Passwort dann im Local Storage, im Klartext speichern. Ja, das will man natürlich nicht. Nee, das kann ich nachvollziehen. Eigentlich willst du ja nur so eine, auf so einen Knopf drücken zur Authentifizierung, so wie man das kennt von anderen, von diversen Services.
Ja, diese O-Ausgeschichten, damit du halt nur einen Token speicherst und nicht irgendwelche Zugangsdaten. Genau. Ja. Naja. Okay, gut. Genau, aber wie gesagt, also da bin ich jetzt gerade dran. Ah, schöne Idee. Ja, hätte ja funktionieren können. Gut. Das war's. Okay, dann ist die Redco durch. Mit, mit, mit, mit, mit die. Die Property der Woche. Ja, wir kriegen es einfach nicht hin. Mit der Dramatik.
Es ist vielleicht einfach, vielleicht muss man den Jingle ändern, damit wir es hinkriegen. Wir machen der Property der Woche einfach und dann kann ich sagen, mit der Property der Woche. Aber dann, wenn du das, dann werde ich es anders sagen. Aber dann musst du es aber, dann musst du es aber immer sagen vorher, weil sonst ergibt es überhaupt gar keinen Sinn. Nee, nee, wir lassen das so. Jetzt kommt der Property der Woche.
Ja, Property der Woche und zwar was, ganz, ganz heißer Scheiß hier, ähm, hast du nämlich gestern im Stream, ähm, angesprochen. Da hast du so einen Artikel geteilt von Chrome Developers, so, äh, neue CSS-Sachen, äh, die da auf dieser IO-Konferenz, äh, irgendwie vorgestellt wurden. Und wir haben rausgefunden, wir haben einen Großteil davon tatsächlich schon hier im Stream, äh, im Podcast, ähm, auch schon zumindest mal angekratzt.
Und so zwei, drei Sachen waren dabei, wo wir tatsächlich dachten, na, okay, das ist so neu, das haben wir noch nicht besprochen. Aber teilweise auch noch in keinem Browser unterstützt. Also der Artikel heißt, what's new in CSS and UI, IO, 2023 Edition von Chrome Developers. Nur zur Vollständigkeit halber, kommt aber auf jeden Fall auch in die Show Notes. Genau, kommt auch in die Show Notes.
Und, ähm, eine Sache habe ich mir jetzt rausgepickt, die ich dann heute mir mal angeschaut habe, und das ist die Pop-Over-API. Und die erinnert, wenn man das so das erste Mal sieht, sehr stark an das, äh, Dialog-Element. Aber der entscheidende Unterschied ist, dass diese Pop-Overs, ähm, also so Dialogs haben oft dann einfach irgendwie, ne, ist ein Text drin und du hast dann, also was man früher mit einem Alert vielleicht gemacht hat, und du hast dann Buttons und kannst dann Dinge bestätigen.
Und es ist halt, äh, farblich abgehoben, ähm, und überlagert die Seite und dann musst du es schließen, wenn du es weghaben willst. Und diese Pop-Over, die sind ähnlich, aber standardmäßig, oder nicht nur standardmäßig, sondern generell schließen die, wenn du außerhalb irgendwo hinklickst. Also das sind dann Sachen, die nicht, ähm, die, die, die User-Attention so komplett da drauf lenken sollen und du kommst da gar nicht mehr raus.
Also das ist eben kein Model, sondern es ist einfach nur ein, ein Overlay, das auch standardmäßig nicht irgendwie, äh, eine Hinterlegung hat.
Nicht so ein Background, der alles überlagert, ähm, kann man aber auch machen, sondern es ist eben, also als Beispiel hatten die einen Kalender und du klickst dann drauf und dann hast du, oder du sagst irgendwie einen neuen, neuen Eintrag hinzufügen und dann hast du so ein, äh, ein Fensterchen, wo du dann Advent, äh, Event-Title eingeben kannst, Zeit und so weiter. Oder, ähm, also für sowas wäre das zum Beispiel gedacht.
Wobei ich mir dann denke, äh, will ich das, dass man das wegklicken kann, ohne die Änderungen zu speichern? Eigentlich würde ich da vielleicht auch eher einen Dialog erwarten. Aber gut, es gibt das jedenfalls. Und der Chrome unterstützt das seit, äh, 113, glaube ich. Ähm, und das heißt, es ist, äh, ich weiß gar nicht, äh, was die aktuelle Chrome-Version ist. Ähm, ich glaube, das ist noch 112. Und das andere ist dann Dev-Channel oder, oder, äh, Canary-Channel.
Hm, mein Brave ist jetzt gerade auf Chromium 113. Ah, dann könnte es da vielleicht sogar schon funktionieren. Dann öffne ich einfach mal, also vorhin, äh, Der sagt mir jetzt gerade, er ist 113, was, Achtung, Achtung, lange Nummer, 113.0.5672.92. Dann scheint es, äh, dann scheint es erst bei der Update 114 zu funktionieren, weil die 113, wenn wir hier, Ähm, die macht es noch nicht. Ähm, ich habe nämlich eine Demo gebastelt.
Hm. Die könnt ihr euch dann im, äh, Chrome-Canary- oder Dev-Bild anschauen, weil in den, äh, Hauptbilds funktioniert es noch nicht. Ähm, und da ist einfach ein kleiner Button. Ich beschreibe es jetzt mal für die, die keinen, äh, Canary drauf haben, ein kleiner Button und da klicke ich drauf und dann öffnet sich so ein, so ein Pop-Over eben, so eine zentrierte, äh, Mitteilung.
Ähm, die habe ich dann farblich noch ein bisschen hinterlegt. Ähm, warte mal, jetzt muss ich selber erstmal den Canary hier öffnen. Und ich habe da so ein bisschen gezeigt, was, was da alles, äh, möglich ist. Aha, nice. Ähm, was das Styling angeht, aber auch, was man mit Add-Support-Query, ähm, als Feature-Detection machen kann, um dann eventuell noch ein JavaScript-Fallback zu schaffen.
Und es gibt, äh, auch per JavaScript natürlich die Möglichkeit, es zu detecten, also indem ich sage, äh, if not, also auf Ausrufzeichen Toggle-Popover in Document.body, weil jedes HTML-Element, ähm, Element in der Seite, und dazu gehört ja auch das Body-Element, hat eben einen, äh, eine Toggle-Popover-Methode, wenn der Browser das unterstützt. Und dadurch kann ich per JavaScript auch programmatisch diese, äh, diese Popover triggern.
Ah, warte mal. Ah, ich glaube, ich habe jetzt, äh, Moment, ich habe, ich habe die falsche Demo gerade aufgemacht. Ich habe gerade, das war gerade gar nicht deine. Sehe ich gerade. Ah ja, jetzt habe ich deine. Ah, das ist ja nice. Cool. Natürlich in pink.
Und das schließt sich halt eben, wenn ich außerhalb hinklicke, oder ich habe einen, einen Button drin, ähm, der das dann schließt. Und, äh, verknüpfen kann ich Buttons, ähm, und diese Popovers mit Popover-Target-Attribut. Und da ist dann eine ID drin, und die ID entspricht dann zum Beispiel einem Diff, oder was auch immer, äh, was dann das Attribut Popover hat. Ähm, und dann, äh, also das Diff hat eine ID, und die ID ist in, äh, dem Popover-Target von dem Button.
Das ist ja nice. Und das Element selbst braucht eben nochmal einen Popover-Attribut. Da reicht also tatsächlich einfach nur HTML, ich muss einfach nur ein Button-Element haben mit einem Popover-Target, was eine gültige ID ist, und das reicht schon, um das zu, um das zu eröffnen. Ja, das Element mit der ID braucht eben noch das Popover-Attribut, damit es auch wirklich ein Popover ist.
Okay, ja, genau. Aber das, das, das, das ist doch mega fancy. Ist das geil? Ist das geil? Also ich hab's jetzt gerade offen in Chrome Canary, und, äh, das ist, das ist so cool, weil das, das wollte man schon immer so einfach haben. Was gibt es für wahnsinnige JavaScript-Libraries, die versuchen, dieses Verhalten nachzubilden? Ähm, nein, nachzubilden, ne, die, die halt das machen, das ging halt nicht anders die ganze Zeit.
Also find ich super abgefahren. Also jetzt, wo ich, wo ich's ja ausprobiere und, äh, grad so ein bisschen Hands-on mach, das ist ja total cool. Ähm, und die andere Demo, ähm, die da noch dabei ist, ich nehm's jetzt mal nicht vorweg.
Genau, ich hab nämlich in diesem Artikel, äh, da war nämlich noch, da ging's, da war noch was mehr, was man machen kann. Also nicht einfach nur, ich hab das Ding standardmäßig zentriert in der Seite, sondern ich will das ja vielleicht auch positionieren, relativ zu dem Element, wo ich draufklicke. Und das hab ich dann versucht, selber zu basteln und hab dann irgendwann, äh, aufgehört zu versuchen, zu, zu verstehen so genau und hab mir dann lieber deren Demo nochmal genauer angeguckt.
Deswegen hab ich dann auch die Demo einfach verlinkt, statt es jetzt selber noch bei mir reinzukloppen. Da kommen nämlich gleich mehrere neue Sachen, die es so in der Art noch nicht gab bisher in CSS, äh, kommen da zum Tragen. Und zwar kann ich dem, ähm, dem Pop-Over-Element, kann ich ein CSS-Attribut geben, das heißt Position minus Fallback. Und dann ist da drin was, was aussieht wie ein Custom-Property, also in dem Fall minus, minus, top, minus, then, minus, bottom.
Und das definiere ich aber wie ein, ähm, äh, Animation, also Keyframe mit add Position minus Fallback und dann eben dieses Keyword minus, minus, minus, top, then, bottom. So, und da drin ist gleich die nächste Neuerung, da gibt's nämlich einen Try-Block, also add Try und geschweifte Klammern draußen rum.
Und diese Try-Blocks, äh, Blöcke werden der Reihe nach abgearbeitet und es wendet die Regeln da drin auf das Pop-Over-Element an und guckt, passt das Pop-Over-Element, äh, in diesem Zustand überhaupt in den Viewport oder steht das irgendwo raus. Und falls es nicht in den Viewport passt, nimmt es den nächsten Try-Block, also es ist so ein bisschen wie Try-Catch oder wie If-Else-Abfragen verschachtelt, nur in CSS.
Und in diesen Try-Blocken, also es ist jetzt wieder, ohne, ohne das zu sehen, ist es wieder so blöd, das alles zu beschreiben, also Demo angucken. Ähm, und da drin ist noch was Neues, das ist die dritte, äh, Neuerung, nämlich eine CSS-Funktion namens Anchor. Und da kann ich dann als, ähm, Attribut übergeben, Top, Bottom, Center, ähm, oder auch Left und Right und kann das dann wiederum nutzen, um das Left, Top, Right, Bottom Attribut zu setzen.
Und so funktioniert das dann eben, dass ich sage, ähm, okay, ordne dieses Pop-Over zentriert mittig, also mittig und unten, also Anchor, äh, Bottom für, für, für, für Bottom oder Anchor Top, je nachdem, wo ich's haben will. Und dann eben Left, Anchor, Center, ähm, und dann ordnet sich das so an, dass es oben drüber steht, über diesem, so ein Fragezeichen-Button in dem Fall, oder eben, wenn das nicht klappt, dann ordne es unten drunter an.
Und sogar mit Calc noch in dem Fall, mit nem Spacing, das da irgendwie in der Custom-Property gespeichert ist, also es ist schon echt krass, das ist schon, das sieht schon nicht mehr aus wie CSS.
Ich würde, ich glaube, ich wollte, ich möchte eine Vorhersage treffen, äh, korrigiert mich genau, ihr dürft, ich werde das bei der nächsten Folge schon vergessen haben, dass ich die gemacht habe, das heißt, äh, wenn ich, wenn irgendwann jemand sagt, ha, der hatte doch nicht recht, äh, dann müsst ihr nochmal auf diese Folge verweisen und mir dann Bescheid sagen.
Ich treffe jetzt die Vorhersage, das wird so, also ich find's funky, dass das alles geht mit CSS, aber ich glaube, das wird so nicht in den Standard kommen. Das ist so weit weg von CSS, wie ich's kenne, also so viel Neues auf einmal, ähm, ich find's saugeil, dass das geht, ich glaube aber, ich hab so ein Gefühl, das wird so nicht in den Standard kommen, das wird nochmal, das wird nochmal eine andere Notation bekommen.
Ich will grad mal gucken, äh, der Draft, ähm, ich find nicht mal den richtigen Draft dazu, ist das jetzt tatsächlich so ein, Chrome macht einfach mal, Chrome macht irgendwie mal was. Es kann sein, dass es keinen gibt, oder das ist halt, ja. Ich finde, ich finde gerade keinen Overdraft. Kann es sein, dass das von OpenUI kommt, ich glaub, das war doch in diesem, also da gibt's auf jeden Fall einen, einen Artikel dazu.
Ah, doch, guck mal, hier, HTML-Spec, äh, WattWG, Popover, 6.0, äh, LastUpdate, 17 May. Also doch, das scheint schon da, da so verankert zu sein. Na ja, gut, Drafts kann ja jeder schreiben. Ja, gut. Popover-Attribute. Ja, auch mit diesem AddTrial find ich da gar nichts dazu. CSS-Attribute, äh, finde man tatsächlich auch nur in diesem, in Zusammenhang mit diesem Position-Fallback, CSS-Anchoring. Ah ja, okay, hier, W3, oje.
Kann das sein, dass das einfach, das könnte sein, dass das unterschiedliche Standards sind, die da dann zusammenkommen und die unabhängig voneinander, glaub ich, erstmal laufen, aber die, wenn wir zusammenspielen sollen.
Weil ich meine, man könnte ja jetzt zum Beispiel dieses Popover-Ding ohne, äh, dieses Funky-Positioning schon mal mit reinnehmen und sagen, na ja, das hat jetzt halt so eine Basis-Funktionalität, äh, und dann später kannst du halt dieses Funky-Positioning mit diesem Trial noch machen. Also dieses Anchor-Positioning kann ich sagen, das ist ein Editor-Draft. Sprich, da kann sich noch viel ändern. Ja. Ja.
Also ich bin sehr gespannt. Ich finde das, ich finde das eine saugeile Funktionalität. Ähm, ich hätte das gerne, weil das, das würde so viel, das würde so viele Probleme lösen, die derzeit mit, mit Heavy-Java-Skript erschlagen werden. Wenn das eine Browser-Standard, äh, wenn es dafür einen Browser-Standard gäbe, das finde ich wirklich fantastisch.
Und eins habe ich aber noch nicht ganz verstanden. Und zwar dachte ich, na, wenn ich jetzt dieses Fragezeichen-Icon in der Demo einfach mehrfach untereinander kopiere, dann würde ich erwarten, und sag mir mal, ob ich da falsch liege, dass die Popovers, die dann aufgehen, auch immer relativ zu dem Button, ähm, positioniert sind, den ich benutzt habe, um das Popover aufzuklappen. Und das tut's aber nicht.
Also es geht immer an der gleichen Stelle oben auf. Und das macht für mich irgendwie schon wieder keinen Sinn, weil ich mir denke, na, aber das ist doch genau dafür gedacht, dass es relativ zu dem Opener aufgeht, oder? Ähm, kann das sein, dass die Kalkulation von der Position, das immer an der Richter, an derselben, nee, das soll ja eigentlich relativ zu dem... Deswegen hab ich ja diesen Anchor. Und das ist was, was ich noch nicht verstehe.
Ich hab's auch schon versucht mit, äh, indem ich dann die IDs, myTooltyp2 und 3 genannt hab und entsprechend die Targets geändert hab. Und auch dann? Ja, aber auch das hat nichts gebracht. Na, dann ist das vielleicht einfach noch buggy. Ich hab diese Position Fallback-Rule sogar dann dupliziert und umbenannt, aber es ist immer an der gleichen Stelle und irgendwie widerspricht das doch genau dem, was ich, warum ich so eine Anchor haben möchte. Ja, weird.
Ja. Na, das ist vielleicht einfach nur kaputt. Ja. Aber jedenfalls, äh, da tut sich vieles Neues und, äh, noch eine andere Geschichte, die werde ich vielleicht nächstes Mal dann als Property der Woche machen, ähm, die, die mit Scrolling zu tun hat und die wir mal in einer, äh, unserer CSS-Wunschfolgen, ähm, mal geäußert haben. Und da werde ich mal, das werde ich mir als nächstes mal anschauen und dann werde ich da vielleicht drüber sprechen. Aber das war's jetzt, äh, zu dieser Property.
Gut, dann kommt jetzt vielleicht, äh, vielleicht. Werbung, oder? Ja, kann auch machen. Ich glaube, jetzt kommt, ich glaube, jetzt kommt Werbung. Hey, hey du, schön, dass du da bist. Na, öfter hier? Dir gefällt, was du hörst und du magst es am liebsten werbefrei und unabhängig? Dann freuen wir uns sehr über ein paar Euro in unserem digitalen Strumpfband unter www.siv.de slash spende. Auf pwsev.de slash unterstützen findest du noch circa 69 weitere Wege, uns zu supporten.
Wir danken dir. Oder, um es mit anderen Worten zu sagen. Wenn euch der Podcast gefällt, dann spendet Ken. Jetzt geht's aber ab hier, weil wir, irgendwann gibt's einen Podcast, der nur noch aus Jingles besteht und wir sagen gar nichts mehr. Wir drücken nur noch Knöpfe und lassen die AI für uns reden. Genau, stimmt, da fällt mir gerade ein, bei AI für uns reden lassen. Apple hat was angekündigt, das ist jetzt gar nicht das Geilteil, aber das ist ein zusätzliches Geilteil.
Apple hat zwar irgendwie gerade, warte mal, heute oder gestern, egal wenn ihr den Podcast hört, in der vergangenen Woche, Global Accessibility Awareness Day und dazu haben sie einige neue Accessibility Features angekündigt.
Und wenn ich's jetzt ganz dunkel in meinem Kopf noch richtig habe, haben sie tatsächlich ein Feature angekündigt, dass für Menschen, die ihr Sprechvermögen verlieren, dass sie, bevor das passiert, also wenn du irgendwie eine Behinderung hast, die irgendwie langsam fortschreitet und du immer schlechter sprechen kannst, dass du vorher deine Stimme aufnehmen kannst, also so eine gewisse Zeit lang bestimmten Text ablesen und dass du die dann quasi, also so eine AI trainierst, die dann später,
spricht wie du. Also Service gibt's ja schon, aber dass sie das jetzt quasi direkt integrieren, krass.
Genau, das wäre dann, glaube ich, tatsächlich integriert, also so geplant, wenn ich's richtig finde, also es ist noch nicht genau, stand, glaube ich, noch nicht dabei, wann sie das, wo genau wie veröffentlichen, aber soll wohl, glaube ich, für iOS irgendwie kommen und dann könntest du tatsächlich dein Handy sprechen lassen wie du und ja, ich weiß, das ist jetzt an sich keine neue Technologie, also es gibt ja auch irgendwie schon … Also relativ neu, aber …
Ja, ich weiß nicht, dass die Körper, die keine echten sind, wo man halt irgendwie eine AI trainiert hat mit der bestimmten Stimme und es dann eben so klingt, aber dass das dann tatsächlich irgendwie irgendwo in ein Betriebssystem integriert ist, das wäre mir zumindest neu und die Idee finde ich mega fangier. Ja, stimmt, stimmt, extra Spezialgeilteil, was jetzt gar nicht auf der Liste stand, was mir jetzt aber bei AI noch eingefallen ist, finde ich ziemlich cool.
So, geil Teil Nummer zwei hat auch was mit Barrierefreiheit zu tun und zwar wurde vor einer Weile jetzt mittlerweile schon erneut die WebAIM Million veröffentlicht, also das ist eine Auswertung von WebAIM, das sind die, die dieses Wave Accessibility Tool, das kennt vielleicht der eine oder die andere, bereitstellen. Die machen eine Auswertung über die Top eine Million Websites, wie barrierefrei die sind.
Das ist natürlich jetzt keine echte Auswertung im Sinne von, da sitzen echte Menschen, die das testen. Da werden natürlich nicht alle Fehler gefunden, nicht alle Probleme, aber halt eben, es taugt schon ganz gut, so eine automatische Auswertung, um so einen groben Überblick über die Landschaft zu kriegen. Also, wie barrierefrei ist denn das Web? Da gibt es einen schönen Artikel dazu, der relativ lang ist und ausführlich, wo sie die Methode beschreiben.
Also, wie gesagt, die testen das mit dem Wave Tool, die ganzen Seiten werden da getestet und dann gibt es am Ende ein Ranking und du kannst, genau, also das heißt, die Seiten werden in der Reihenfolge gebracht und da gibt es dann sowas wie zum Beispiel, Also, ich glaube, das Hauptranking-Kriterium ist dann eben Barrierefreiheitsprobleme pro HTML-Element.
Ja, also, da wird dann so ein Wert draus errechnet, so ein Prozentwert, alle wie viele HTML-Elemente habe ich denn eins, wo irgendwie ein Problem drin auftaucht. Und dann, da das eine Million Webseiten sind, was eine Menge ist, haben die auch so ein kleines Suchformular, wo man dann seine eigene Seite eintragen kann und gucken kann, ob die da mit drin ist. Und dann suchst du danach und dann kriegst du das Ergebnis für deine Seite und kannst sehen, auf welchem Rank du bist.
Und darüber habe ich tatsächlich, und das hat mich gewundert, das, warte mal, jetzt muss ich gerade mal gucken, ob das noch, warte mal, ist da meine Seite noch mit drin? Weil, ich habe darüber tatsächlich mal Accessibility-Probleme auf meiner Webseite gefunden. Genau, also, die machen das übrigens schon seit 2019. Jedes Jahr aufs Neue, also 2019, 2021, 2022 und 2023 gibt es jetzt Wert.
Das heißt, du hast jetzt schon fünf Jahre hintereinander, wo du dann auch gucken kannst, wie entwickelt sich denn sowas. Das finde ich total interessant. Und ich war 2022, war ich mit meiner persönlichen Webseite, also moritzgiesemann.de, auf Rang 372.223. Und ich habe gedacht, Moment mal, wieso, wieso?
Und dann habe ich tatsächlich mit dem Wave-Tool dann meine Seite nochmal getestet und gesagt, scheiße, das stimmt, da habe ich ja tatsächlich noch echt ein Problem, was ich vorher nicht auf dem Schirm hatte. Habe es gefixt und jetzt habe ich null Error-Density, was ziemlich gut ist und bin auf Rang 14.000 von einer Million.
Ich finde es ja schon verrückt, dass meine Seite da überhaupt drin auftaucht, weil, dass meine Seite, auf der wirklich fast kein Inhalt ist, unter der Top-Million, ich weiß auch nicht genau, das habe ich jetzt gar nicht nachgeschaut, wie man, welche, eine Million Webseiten die auswählen da. Du bist schon am tippen und gucken, ob der. Ja, ich will. Mal gucken, ja. Hier, Side-Looker.
Das eignet sich, also wenn ihr, wenn ihr in einer Firma arbeitet und ihr braucht, ihr wollt mal schöne Zahlen haben zur Barrierefreiheit, weil ihr den Managern erklären wollt, dass das doch alles Mist ist und dass man da was machen muss, dann nehmt doch mal diesen Fünf-Jahres-Verlauf her von eurer Webseite, die da dann, wenn ihr in einer größeren Firma arbeitet, auf jeden Fall mit drin auftauchen wird in dieser Million. Fand ich auf jeden Fall sehr schön.
Ich konnte da bei bestimmten Produkten mal nachvollziehen oder bei bestimmten Webseiten mal nachvollziehen, wie war denn der Verlauf? Ist es besser geworden? Ist es schlechter geworden? Gab es vielleicht ein Jahr, wo speziell irgendwie es viel besser oder viel schlechter geworden ist? Da sieht man dann, da gab es neue Releases von der Seite oder vielleicht eine Klage, dass man was barrierefreier machen muss oder so. Auf jeden Fall da auf jeden Fall mal reingucken.
Aber auch der Artikel dazu, wo sie so ein bisschen erzählen, wie sie die Auswertung gemacht haben, was sie so rausgefunden haben, was sind so übliche Fehler, die gefunden werden. Wird das Web barrierefreier oder wird es irgendwie schlechter? Also da gibt es eine Menge interessanter Zahlen. Ich finde den Artikel super. Auf jeden Fall da mal reingucken.
Ich hatte auch mal auf Mastodon so einen kleinen Thread gemacht, wo ich so ein bisschen reingeschrieben habe, was ich so an interessanten Sachen aus dem Artikel rausgezogen habe. Aber schaut einfach mal selbst rein. Lohnt sich. Und wie gesagt, in das Suchfeld gern auch mal eigene Webseite eintragen und mal schauen, ob sie mit drin ist. Und dann könnt ihr mal gucken, wo ihr gelandet seid in diesem Ranking. Genau. Das war das Geilteil Nummer zwei.
Ich finde nur, also manchmal merkt es hier Sachen an, die sind irgendwie, ah, weil wir das über einen Shadow gemacht haben. Okay, das fällt ihm dann nicht, ja. Very low contrast. Ist 4-8-Design drin? Ja, ja. Sind irgendwie auf Rang 500.000. Ja, schön in der Mitte. Das ist doch gar nicht so schlecht. Error Density von 4,63 Prozent. Das ist nicht so schlecht. Weil, also ich meine, klar, wir will mal null haben.
Aber Seiten, die ich mir heute angeguckt habe, die waren mehr so bei 6 bis 10 Prozent Error Density. Also ihr seid da mit 4 schon, das ist schon natürlich nicht super, aber es ist schon ganz okay. Und auch in der Liste Top Error Types Detected, da sind nur zwei Sachen drin. Das ist schon ganz okay. Cool. Könnt ihr natürlich noch mal gucken. Ja, ja, klar. Nee, werde ich jetzt auf jeden Fall auch angehen, jetzt wo ich so ein cooles, einfaches Tool habe.
Genau. Und dieses Wave-Tool, das gibt es auch als Browser-Plugin. Was da cool ist, ist, dass man das direkt, ohne dass man ein Plugin installieren muss, direkt analysieren kann. Bei jedem Link oder bei jeder Seite, also in jeder Auswertung von jeder Seite, die da drin ist, gibt es direkt einen Link. Analyze, in dem Fall halt, also Domain Name using Wave.
Und dann kommst du tatsächlich auf eine Seite, wavewebm.org, und dann wird da die Seite tatsächlich reingeladen, ohne dass du ein Plugin oder irgendwas installieren musst. Genau, und dann kriegst du da die Errors angezeigt. Ich habe nur zwei. Okay, Contrast-Errors werden da extra behandelt. Genau.
Mir ist da auch aufgefallen, also ich habe so ein bisschen die Methode angezweifelt, weil ich interessante Sachen damit gefunden habe, aber ich wurde überzeugt, dass es vielleicht doch richtig ist. Weil das meckert, das ist sehr, sehr streng, das Tool. Das meckert zum Beispiel auch Sachen an, die vielleicht in dem aktuellen Zustand der Seite überhaupt gar kein Accessibility-Problem darstellen.
Also zum Beispiel hat das angemeckert, habe ich in einer Auswertung gesehen, Input-Felder, die kein Label haben, die aber überhaupt nirgends dargestellt werden, die Display-Nanen haben, also die überhaupt gar nicht irgendwie verwendet werden. Das heißt, ein Screenreader oder Tastatur ignoriert die komplett.
Und das ist ja an sich auch dann, also so aus Barrierefreiheitssicht, wenn das jetzt nur benutzt und sichergestellt ist, dass diese Inputs nie verwendet werden, dann ist das komplett wurscht. Weil die sind weg, die sind nicht vorhanden. Also das hat es zum Beispiel angemeckert. Kann man jetzt darüber streiten, ob das jetzt zu streng ist oder nicht, aber es ist auf jeden Fall ein guter Reminder. So von wegen, überleg dir gut, brauchst du das wirklich?
Bist du dir sicher, dass das nie, also ich bin ja auch jetzt nicht derjenige, der die Seite geschrieben hat oder den Code geschrieben hat. Ja, auf jeden Fall, guckt mal rein, testet mal. Es sind auf jeden Fall spannende Ergebnisse. Und vielleicht findet ihr noch was, was ihr fixen könnt. Ja. Sehr gut. Haben wir es schon. Dann kommt jetzt. Das Ende. Ja, Mensch, unter einer Stunde, das ist doch echt gut für uns. Das ist doch kurz, ne? Haben wir doch versprochen. Ja, stimmt.
Guck mal, eine Stunde brauchen wir also ungefähr für einfach nur unser reguläres Gelaber. Das heißt, die GPN kriegt auch voll. Da brauche ich mir keine Sorgen, da finden wir schon genug. Ja, jetzt genau, also gucken wir mal. Die nächste Folge wird hoffentlich wieder ein bisschen inhaltsreicher. Und dann sind aber auch schon irgendwie demnächst wieder Ferien, wo ich dann weg bin. Müssen wir mal gucken. Also aber drei Wochen dürfen wir es nicht wieder dauern lassen, bis sie rauskommt.
Ne, da kommt noch mal. Also wir werden auf jeden Fall mit dem HTML-Gedöns noch weitermachen. Das ist versprochen. Die HTML-Serie wird fortgesetzt. Okay. Ja, ich habe auch sonst nichts weiter. Keine Soundcloud zu verkaufen. Keine Soundcloud zu verkaufen. Achso, habe ich was zu verkaufen? Ja, vielleicht noch eine ... Ach nee, ich weiß nicht. Wollte ich darüber reden? Ich rede lieber nicht drüber. Okay. Alles klar. Mensch, dann warst du es jetzt. Dann warst du es.
Bis zum nächsten Mal. Ja, bis zum nächsten Mal. Macht's gut. Macht's gut. Ciao. Ciao. Ciao. Untertitelung des ZDF für funk, 2017