WEBVTT

NOTE
Podcast: Wo wir sind ist vorne.
Episode: A11Y I18N FTW! WTF?
Publishing Date: 2020-03-29T16:17:26+02:00
Podcast URL: https://wowirsindistvorne.show
Episode URL: https://wowirsindistvorne.show/a11y-i18n-ftw-wtf/

00:00:00.000 --> 00:00:20.020
 Herzlich Willkommen bei wo wir sind ist vorne Frontend Fakten Frotzelein

00:00:20.020 --> 00:00:24.100
 der Late Night Frontend Talkshow rund um Webdesign und Entwicklung.

00:00:26.960 --> 00:00:35.720
 Es reden sich um Head und Kragen, HTML-Fundamentalist Moritz Gießmann und Javascript-Jongleur Konstantin Groß.

00:00:51.000 --> 00:00:56.200
 Hallo und herzlich Willkommen zur vierten Ausgabe von wo wir sind ist vorne.

00:00:56.200 --> 00:01:00.880
 Zweiter Anlauf, das möchte ich jetzt nicht verschweigen aufgrund technischer Probleme.

00:01:01.760 --> 00:01:08.000
 Genau, wir praktizieren in dieser Folge wieder Physical Distancing, also so wie es sich jetzt gerade gehört.

00:01:08.000 --> 00:01:13.880
 Wir machen die Folge wieder remote, so wie die letzte und vielleicht stoßen wir einfach mal an.

00:01:13.880 --> 00:01:14.460
 Was meinst du?

00:01:14.460 --> 00:01:15.380
 Jawohl.

00:01:15.380 --> 00:01:17.780
 Also, zum Wohl.

00:01:17.780 --> 00:01:19.900
 Bei mir klingt es heute etwas anders.

00:01:19.900 --> 00:01:22.520
 Ich bin heute mal auf Weißwein umgestiegen.

00:01:23.000 --> 00:01:28.660
 Ja, und ich habe wieder ein Brooklyn Lager, also was heißt wieder, das hatten wir irgendwann schon mal.

00:01:28.660 --> 00:01:31.860
 Der Konstantin hat mir das dankenswerterweise mal geschenkt.

00:01:31.860 --> 00:01:37.380
 Und ich habe noch eine Flasche davon gefunden und bevor sie schlecht wird, werde ich sie jetzt mir einverleiben.

00:01:37.380 --> 00:01:40.780
 Und damit sage ich vielleicht einfach schon mal Jingle up.

00:01:45.280 --> 00:01:53.060
 Ja, jetzt neu auch mit Jingle.

00:01:53.060 --> 00:01:55.820
 Yeah, sehr gut.

00:01:55.820 --> 00:01:58.100
 Ja, was hat uns beschäftigt die letzten zwei Wochen?

00:01:58.100 --> 00:02:01.340
 Ich glaube, man kann sich's denken, das, was alle zurzeit gerade beschäftigt.

00:02:01.340 --> 00:02:07.180
 Und wir hatten ursprünglich auch geplant, vielleicht was zu dem Thema zu machen, besonders zum Thema Homeoffice.

00:02:07.180 --> 00:02:10.040
 Deswegen hatten wir auch auf Twitter mal ein bisschen vorgefühlt.

00:02:10.340 --> 00:02:16.580
 Aber wir haben uns jetzt gedacht, auf allen Kanälen bläst es gerade zu dem Thema und deswegen lassen wir das sein.

00:02:16.580 --> 00:02:20.060
 Ich werde trotzdem jetzt in der Retro eine Kleinigkeit dazu sagen.

00:02:20.060 --> 00:02:27.040
 Erstmal finde ich es spannend, dass durch die Krise jetzt alles Mögliche möglich wird, was vorher angeblich gar nicht ging.

00:02:27.040 --> 00:02:29.020
 Also eben das Thema Homeoffice.

00:02:29.020 --> 00:02:36.260
 Aber mir sind auch so ein paar Sachen aufgefallen, als ich so Newsartikel darüber gelesen habe, wie sich technisch auch so ein paar Sachen entwickeln.

00:02:36.880 --> 00:02:44.660
 Und zwar sind das zwei Artikel von der Washington Post und von der New York Times, die ich entsprechend auch verlinken werde in den Shownotes.

00:02:44.660 --> 00:02:53.440
 Also es sind zwei Artikel von der Washington Post, einer von der New York Times, wo die Verbreitung der Pandemie so ein bisschen visualisiert wird und zwar ziemlich cool visualisiert wird.

00:02:54.100 --> 00:02:57.720
 Und ich habe das gesehen und das hat mir echt gut gefallen, wie das gemacht ist.

00:02:57.720 --> 00:03:03.880
 Also im Endeffekt ein One-Pager und man scrollt da durch und dann sieht man die Ansteckung visualisiert durch Punkte und so weiter.

00:03:03.880 --> 00:03:07.220
 Und habe natürlich dann auch mal geguckt, wie das technisch so umgesetzt ist.

00:03:07.220 --> 00:03:10.940
 Jetzt nicht im Detail, welche Libraries die einsetzen oder so, aber erst mal geguckt.

00:03:10.940 --> 00:03:15.560
 Okay, es ist mit SVG, es ist mit Canvas gemacht und das fand ich einfach cool zu sehen.

00:03:16.820 --> 00:03:19.980
 Das ist eine ziemlich erfreuliche Entwicklung, weil es doch heutzutage immer noch so ist.

00:03:19.980 --> 00:03:28.020
 Also ich gucke immer wieder bei Webseiten in den Quellcode rein und ins Netzwerktab von den DevTools und gucke mal so an, was die so treiben.

00:03:28.020 --> 00:03:35.520
 Und ganz oft sieht man noch, dass Grafiken, die eigentlich perfekt geeignet werden für SVG, trotzdem noch als Rastergrafiken umgesetzt werden.

00:03:35.520 --> 00:03:44.180
 Also irgendwelche Logos vor allem oder auch irgendwelche Diagramme oder so, die dann klassischer Fall eigentlich für SVG werden, werden immer noch als Grafik umgesetzt.

00:03:44.180 --> 00:03:52.840
 Und von daher, dass Canvas und SVG, wir hatten es ja das mal ja auch über WebGL und Canvas, dass das jetzt zur Einzug hält, ist wirklich eine erfreuliche Entwicklung.

00:03:53.920 --> 00:04:05.540
 Und ich habe das Gefühl, dass der deutsche Bereich da wie so oft aber noch ein bisschen hinterherhängt, also auf Spiegel, Online oder Fokus oder sonstigen deutschen Nachrichtenseiten wird sowas klassisch immer noch als Video eingebunden.

00:04:05.540 --> 00:04:11.740
 Hat vielleicht aber auch den Hintergrund, dass die Leute da gerne noch ein, zwei Werbespots vorschalten, um ein bisschen was dran zu verdienen.

00:04:12.180 --> 00:04:22.120
 Aber so insgesamt finde ich das einen erfreulichen Trend, ja, dass sowas interaktiv, auch man kann dann da irgendwelche Regler und sowas einstellen und also finde ich super, dass sich da was tut.

00:04:22.120 --> 00:04:37.020
 Und an der Stelle noch eine kleine Eigenwerbung, ich habe da selber was damit gebastelt, werde ich auch in die Shownotes packen, habe ich jetzt gerade erst gestern live gestellt auf unserer Firmenseite, wo ich die Fallzahlen von Karlsruhe so ein bisschen visualisiere.

00:04:37.020 --> 00:04:50.380
 Nicht ganz so fancy, wie das die Washington Post und New York Times machen, sondern einfach nur in Chartform, aber da habe ich einfach mal ein bisschen mit dran rumgespielt, weil ich das ganz interessant fand, das mal auf Stadt- und Landkreisebene nachzuverfolgen.

00:04:50.380 --> 00:05:01.240
 Und umgesetzt natürlich das Ganze mit Vue.js und mit Vue.Apex.Charts, was ich auch verlinken werde, natürlich war für mich die Wahl klar als Vue.Fanboy.

00:05:02.520 --> 00:05:13.940
 Genau, dann noch eine andere Sache, um schon wieder vom Thema Corona mal wegzukommen, die Wikimedia Foundation will für ihre UI-Überarbeitung in Zukunft auch auf Vue setzen.

00:05:13.940 --> 00:05:22.300
 Da gab es ein RFC, also Request for Comments, das jetzt abgeschlossen ist und der Vorschlag, so wie es ausschaut, akzeptiert wurde.

00:05:22.980 --> 00:05:30.960
 Das hatte wohl ein bisschen eine Kontroverse ausgelöst, ob jetzt nicht vielleicht Web-Components sinnvoller wären und React war auch im Gespräch.

00:05:30.960 --> 00:05:32.100
 Darf ich kurz Zwischenfragen?

00:05:32.100 --> 00:05:34.120
 Also es kann sein, ja, natürlich, sowieso.

00:05:34.120 --> 00:05:41.700
 Wikimedia, was geht es da wirklich dann um die Oberfläche für Wikipedia oder worum geht es genau?

00:05:41.700 --> 00:05:56.640
 Also Wikimedia, die Wikimedia Foundation ist ja der Verein, der hinter diesen ganzen Wikipedias steht, den internationalen und auch noch diversen anderen Softwareprojekten, aber es geht tatsächlich darum, um Features im Frontend für die Bearbeiter.

00:05:58.060 --> 00:06:00.840
 Und das soll eben jetzt mit Vue umgesetzt werden.

00:06:00.840 --> 00:06:02.300
 Also das ist jetzt beschlossen.

00:06:02.300 --> 00:06:03.780
 Aktuell ist da noch ziemlich viel Shake gemacht.

00:06:03.780 --> 00:06:05.180
 Ja, beschlossen.

00:06:05.180 --> 00:06:16.040
 Also wie gesagt, die RFC ist abgeschlossen, aber es hat da Kontroversen gegeben, wie das immer natürlich so ist, wenn solche Vorschläge kommen und wäre das nicht besser und das nicht besser.

00:06:16.700 --> 00:06:31.180
 Also vielleicht wird es auch nochmal gekippt, es soll wohl auch so sein, dass es zunächst mal für kleinere Funktionen als Fallstudie quasi eingeführt wird und man schaut, wie das so funktioniert und dann erst großflächig überall ausgerollt werden soll oder vielleicht eben halt auch nochmal gekippt.

00:06:31.180 --> 00:06:32.280
 Bleibt abzuwarten.

00:06:32.280 --> 00:06:37.280
 Hast du da tiefere Informationen, also was die genau damit machen wollen?

00:06:37.280 --> 00:06:42.760
 Also wollen die jetzt Wikipedia zur großen Single-Page-Application umbauen oder geht es da mehr so um Library?

00:06:43.020 --> 00:06:49.260
 Also ich habe irgendwie mein statisches HTML noch und tue Vue.js da rein, um bestimmte Sachen interaktiv zu machen.

00:06:49.260 --> 00:06:56.600
 Also wenn ich das richtig verstanden habe, dann sollen tatsächlich auch die Inhalte nachgeladen werden quasi.

00:06:56.600 --> 00:07:02.620
 Also für das entsprechende Device zum Beispiel, für Mobile muss ich weniger laden als für Desktop.

00:07:02.620 --> 00:07:10.100
 Also es soll wohl schon die komplette Oberfläche aufgebaut werden, aber so tief bin ich da in der Tiefe nicht drin in dem Thema.

00:07:11.140 --> 00:07:17.500
 Wie gesagt, erstmal werden es nur kleinere Funktionalitäten sein, um eben JQuery abzulösen, was da oftmals noch im Einsatz ist.

00:07:17.500 --> 00:07:22.300
 Also da geht es eher um die Menüs und was weiß ich was für Funktionalitäten.

00:07:22.300 --> 00:07:29.440
 Ja, aber bleibt spannend und habe mich natürlich als View-Verfechter gefreut, dass da die Entscheidung drauf gefallen ist.

00:07:29.440 --> 00:07:30.920
 Verstehe, cool.

00:07:30.920 --> 00:07:32.320
 Coole Sache.

00:07:32.820 --> 00:07:37.960
 Und dann habe ich noch eine kleine Kleinigkeit, die doch wieder indirekt mit Corona ein bisschen zu tun hat und zwar Affinity.

00:07:37.960 --> 00:07:38.780
 Sagt dir das was?

00:07:38.780 --> 00:07:42.840
 Ja, ja, ganz dunkel.

00:07:42.840 --> 00:07:51.020
 Das ist eine Alternative zu Photoshop, Illustrator und InDesign von Adobe, wenn man es auch mal aussprechen möchte.

00:07:51.020 --> 00:07:58.680
 Und die haben jetzt im Zuge dieser Pandemiekrise 50 Prozent auf ihre Produkte gegeben.

00:07:59.340 --> 00:08:04.080
 Also das ist jetzt keine Werbung hier, soll es kein Product Placement sein, aber ich fand das eine ganz coole Aktion.

00:08:04.080 --> 00:08:17.100
 Es gibt ja viele solche Aktionen, also auch Microsoft hat irgendwelche Kommunikationssoftware, ich glaube dieses Skype Business oder Skype Meeting zur Verfügung gestellt, um den Leuten jetzt über die nächsten Monate so ein bisschen hinweg zu helfen.

00:08:17.760 --> 00:08:29.920
 Und das ist mir eben heute unter die Finger, unter die Augen gekommen, dass es das gibt und ich hatte schon länger mal vor, mich eventuell von dieser Creative Suite von Adobe zu verabschieden, weil es halt doch einfach auch ins Geld geht, so monatlich.

00:08:29.920 --> 00:08:38.680
 Und ich so häufig, weil ich ja eigentlich kein Grafiker bin, sondern halt reiner Entwickler, aber ab und zu halt doch mal was mitmache, lohnt sich das für mich eigentlich nicht.

00:08:39.140 --> 00:08:44.680
 Und das fand ich eigentlich eine ganz coole Aktion, also wie gesagt, da gibt es gerade 50 Prozent auf alle Produkte, es gibt eine 90-Tage-Testphase.

00:08:44.680 --> 00:08:53.440
 Ja, einfach schön zu sehen, dass Unternehmen da jetzt auch so ein bisschen Solidarität zeigen, aber man darf natürlich auch nicht vergessen, ist natürlich auch ein Werbeeffekt.

00:08:53.440 --> 00:08:59.320
 Natürlich erhoffen sich die Leute, dass am Schluss hinten dran was hängen bleibt und dass die Leute sagen, ja finde ich cool und mache ich mit.

00:08:59.320 --> 00:09:04.260
 Genau das Gleiche bei diesen Kommunikationstools, die jetzt da erstmal kostenlos sind für anderthalb Jahre.

00:09:04.260 --> 00:09:12.780
 Oder auch die Aufnahmesoftware, mit der wir ja aufnehmen, Reaper, gibt es jetzt auch eine Lizenz, die irgendwie, weiß ich auch nicht, glaube ich, 90 Tage oder so gültig ist.

00:09:12.780 --> 00:09:15.380
 Ja, irgendwie bis Juni oder Juli oder so, ja.

00:09:15.380 --> 00:09:20.920
 Natürlich erhoffen sich die Hersteller, das ist ja natürlich jetzt nicht reiner Goodwill, sondern natürlich erhoffen sich die Hersteller was davon.

00:09:20.920 --> 00:09:25.380
 Aber ist ja auch okay, also sie könnten es auch einfach nicht machen und ja, fand ich ganz nett.

00:09:25.380 --> 00:09:26.600
 Ja.

00:09:26.600 --> 00:09:28.040
 Das war's von mir.

00:09:28.040 --> 00:09:28.520
 Dankeschön.

00:09:28.520 --> 00:09:33.740
 Ja, das ist übrigens, das ist eine ganz gute Überleitung, jetzt muss ich auch vielleicht noch was zu Corona sagen.

00:09:34.260 --> 00:09:38.440
 Aber mehr so zu dem, wie man jetzt arbeitet, weniger zu der Sache an sich.

00:09:38.440 --> 00:09:45.600
 Passt jetzt ganz gut, weil ich habe jetzt gemerkt, nachdem ich jetzt viele Videokonferenzen habe in letzter Zeit,

00:09:45.600 --> 00:09:52.160
 beziehungsweise Audio-Videokonferenz mit Video ausgeschaltet, witzigerweise, dass am Ende nur noch Audio durchgeht,

00:09:52.660 --> 00:10:01.080
 oft auch aus Performance-Gründen, habe ich gemerkt, dass es extrem wichtig ist, wenn man jetzt zum Beispiel ein Meeting macht, wo jeder seinen Status abgibt.

00:10:02.620 --> 00:10:05.860
 Sonst haben wir immer so ein Token rumgegeben, das geht jetzt natürlich nicht.

00:10:05.860 --> 00:10:17.680
 Wir sehen uns dann teilweise auch gar nicht, das heißt, es ist extrem wichtig, dass man irgendwie, dass nicht die Stille ausbricht, dann nachdem einer fertig ist und man sich dann überlegt, wer ist denn jetzt eigentlich als nächstes dran und was kommt jetzt als nächstes.

00:10:18.060 --> 00:10:29.180
 Kann ich nur empfehlen, entweder genau das machen, was Konstantin gerade gemacht hat, sagen, ich bin fertig, aber am allerbesten ist, derjenige, der gerade gesprochen hat und fertig ist, sucht den Nächsten raus, der dran ist.

00:10:30.060 --> 00:10:47.280
 Ich meine, gut, bei uns zu zweit stellt sich die Frage nicht, aber wenn man zu viert, zu fünft, zu zwölft, also das habe ich jetzt selbst noch nicht erlebt, aber ich habe es von Kollegen gehört, die irgendwie zu zwölft im Call sind, dann da ist es, glaube ich, extrem hilfreich, wenn man dann schon genau weiß, wie es dann weitergeht.

00:10:47.280 --> 00:11:17.160
 Also das kann ich jetzt, kann ich auf jeden Fall empfehlen, dass man, dass man das macht, hilft auf jeden Fall weiter, aber ich meine, naja, es gibt jetzt, es gibt auch viele, viele Tools jetzt, die irgendwie aus dem Boden sprießen, der Konstantin hat es gerade schon angesprochen, beziehungsweise man entdeckt jetzt Dinge neu, gerade mit, man möchte gemeinsam zum Beispiel irgendwie an einer Code-Basis arbeiten und, naja, Pair-Programming ist irgendwie eine coole Sache, wenn man irgendwie nebeneinander am Platz sitzt, kann ich auf jeden Fall

00:11:17.160 --> 00:11:47.040
 nur empfehlen, geht nur gerade nicht und dann sucht man mal, vielleicht gibt es da ja was, dass man irgendwie gemeinsam coden kann, ich meine, gemeinsam Dokumente und Spreadsheets editieren und bearbeiten, das geht irgendwie schon ganz gut über beispielsweise Google-Produkte, aber für Code im Speziellen war mir jetzt, ich glaube, bei CodePen gibt es irgendwie so ein Pro-Feature, weiß ich nicht genau, habe ich nie getestet, aber vielleicht wäre es ja cool, wenn es was gibt, in den Editor integriert,

00:11:47.040 --> 00:12:12.880
 mit dem man tagtäglich arbeitet und bei uns, naja, wir arbeiten, glaube ich, nicht im Team alle mit VS Code, aber die meisten und dafür gibt es wohl schon seit 2017, habe ich gesehen, ein relativ cooles Plugin, das nennt sich VS Code Live Share und funktioniert so, dass ich, also beide Seiten oder, ich glaube, es geht sogar zu mehr als zu zweit, wir haben es bisher nur zu zweit getestet,

00:12:14.080 --> 00:12:39.440
 installieren sich dieses Plugin, dann sagt einer, ich möchte meine Session share und gibt, dann fällt da hinten einen Share-Link raus, den gebe ich weiter an die Leute, die ich dabei haben will und dann haben die tatsächlich in ihrem VS Code, sehen die, was ich sehe, man sieht den Cursor von dem anderen, beide können drin rumtippen, man sieht auch, wenn man jetzt noch eine Kommandozeile offen hat oder so,

00:12:39.440 --> 00:12:46.400
 auch die ist geshared, da kann man dann aber extra nochmal einstellen, darf der andere da auch was reinschreiben oder nicht, weil das ist natürlich theoretisch

00:12:46.400 --> 00:12:55.260
 eher, naja, eine Sicherheitslücke, die man da aufmacht, wenn der andere in die eigene Kommandozeile was reinschreiben darf, aber auch das kann man machen.

00:12:55.920 --> 00:13:05.880
 Und da haben wir dann mit Call nebenher, also Audio Stream nebenher, haben wir eine Menge schon jetzt gemeinsam gecodet und das ist echt eine coole Geschichte.

00:13:06.060 --> 00:13:16.760
 Also ich würde sogar sagen, da sind wir schon relativ nah dran am, oder wie soll ich sagen, am Pair-Programming sind wir relativ nah dran damit.

00:13:16.760 --> 00:13:25.600
 Wir haben uns sogar überlegt, ob wir das vielleicht auch nicht mal so im Büro machen sollen, weil das irgendwie einfacher ist, als zwei Tastaturen an einen Rechner anschließen.

00:13:25.960 --> 00:13:45.300
 Also das ist eine echt richtig coole Geschichte, kann ich empfehlen. Ein Kollege von mir hat sich das auch mal ganz, ganz, naja, security-technisch angeschaut, will ich jetzt, wäre jetzt übertrieben, aber er hat mal geschaut, wie die Daten da ein bisschen rumgeschickt werden und wie da die offizielle Aussage von Microsoft dazu ist, zu diesem Plugin.

00:13:45.300 --> 00:13:52.940
 Also ich meine, man muss natürlich auch gucken, wenn man jetzt irgendwie Code hat, den man vielleicht jetzt nicht mit der Öffentlichkeit sharen will, wo wird der denn da drüber geschickt?

00:13:52.940 --> 00:13:58.120
 Also ich meine, der muss ja dann irgendwie durch irgendeine Verbindung über irgendeinen Server, muss der ja von A nach B geschickt werden.

00:13:58.120 --> 00:14:03.200
 Und das scheint zumindest so weit Microsoft es sagt, alles in Ordnung zu sein.

00:14:03.200 --> 00:14:07.480
 Allerdings, ob man sich darauf verlassen kann, da kann man jetzt mal drüber streiten.

00:14:07.480 --> 00:14:14.360
 Aber auf jeden Fall eine coole Idee, funktioniert wirklich gut und macht Spaß, da gemeinsam zu coden.

00:14:15.300 --> 00:14:22.340
 Zweiter, kurzer Teil, was ich noch sagen wollte, vielleicht hört man es, ich hoffe, man hört es.

00:14:22.340 --> 00:14:24.220
 Ich habe ein neues Mikrofon.

00:14:24.220 --> 00:14:28.660
 Der Konstantin hatte ja in der letzten Folge ein neues Mikrofon und hat das da vorgestellt.

00:14:28.660 --> 00:14:32.800
 Ich habe jetzt mal ein neues und hoffe, dass es jetzt ein bisschen besser klingt als vorher.

00:14:32.800 --> 00:14:35.560
 Damit bin ich fertig.

00:14:35.560 --> 00:14:40.560
 Alles klar, ich auch und damit kommen wir zur...

00:14:40.560 --> 00:14:41.740
 Falsch.

00:14:41.740 --> 00:14:44.560
 Damit kommen wir zur...

00:14:45.300 --> 00:14:48.340
 Die Property der Woche.

00:14:48.340 --> 00:14:52.960
 Ja, alles heute ein bisschen verquer technisch.

00:14:52.960 --> 00:14:58.440
 Okay, die Property der Woche ist eigentlich heute eine API der Woche.

00:14:58.440 --> 00:15:04.400
 Es geht um diverse Build-Ins in JavaScript, also Language Features.

00:15:05.100 --> 00:15:09.660
 Die vereint sind unter Intel, I-N-T-L-Punkt.

00:15:11.560 --> 00:15:19.760
 Das sind Features, mit denen man Internationalization betreiben kann.

00:15:19.760 --> 00:15:28.280
 Also Internationalisierung nicht nur im Sinne von Sprache, auch von Nummernformatierung.

00:15:28.280 --> 00:15:34.080
 Da gibt es verschiedene Unter-Properties, von denen ich mir jetzt mal drei rausgesucht habe,

00:15:34.380 --> 00:15:35.520
 die ich kurz vorstellen will.

00:15:35.520 --> 00:15:40.120
 Ich habe eine kleine Demo dazu gebastelt auf CodePen, die ich natürlich auch verlinken werde.

00:15:40.120 --> 00:15:46.160
 Und das wären Date-Time-Format, Number-Format und Plural-Rules.

00:15:47.220 --> 00:15:54.280
 Und mit Date-Time-Format kann man, wie der Name sagt, Datum formatieren und Uhrzeit formatieren.

00:15:55.060 --> 00:15:56.900
 Da kann man in der Demo ein bisschen mit rumspielen.

00:15:56.900 --> 00:15:59.360
 Ich weiß nicht, habe ich die in Strello gepostet?

00:15:59.360 --> 00:15:59.800
 Ich glaube nicht.

00:15:59.800 --> 00:16:01.780
 Das heißt, du kannst das jetzt gerade gar nicht rumklicken.

00:16:01.780 --> 00:16:02.240
 Nee, ich habe sie noch nicht gesehen.

00:16:02.240 --> 00:16:04.120
 Egal, aber du kannst das dir mal anschauen.

00:16:04.120 --> 00:16:08.240
 Da kommt am Schluss dann auch der Code raus, zu dem, was man sieht.

00:16:08.240 --> 00:16:11.480
 Und da kann man verschiedene Locals wählen.

00:16:11.480 --> 00:16:19.220
 Also Englisch fürs Vereinigte Königreich, Englisch für Vereinigte Staaten, Deutsch Österreich, Deutsch Deutschland.

00:16:19.220 --> 00:16:22.040
 Und entsprechend ändert sich dann das Datum.

00:16:22.940 --> 00:16:28.700
 Number-Format kann automatisch Währungen entsprechend formatieren und darstellen.

00:16:28.700 --> 00:16:33.040
 Also mit Tausender-Trendzahl, entsprechendes Währungs-Icon.

00:16:33.040 --> 00:16:37.640
 Das heißt, ich übergebe diesen Short-Code, diesen ISO-Code, EUR für Euro zum Beispiel.

00:16:37.640 --> 00:16:41.280
 Und es formatiert dann automatisch ein Euro-Zeichen hintendran oder vorne dran.

00:16:41.280 --> 00:16:45.360
 Fun Fact, in Österreich steht das Euro-Zeichen vor dem Betrag.

00:16:45.360 --> 00:16:47.200
 In Deutschland steht es hinter dem Betrag.

00:16:47.200 --> 00:16:48.020
 Wusste ich auch nicht.

00:16:48.020 --> 00:16:49.820
 Doch, kann man auch in der Demo sehen.

00:16:49.820 --> 00:16:52.180
 Deswegen habe ich das Deutsch- und Österreichisch auch mit aufgenommen.

00:16:52.660 --> 00:16:57.660
 Und auch für das Daytime-Format, weil man in Österreich ja Jänner sagt statt Januar.

00:16:57.660 --> 00:17:00.680
 Und ich glaube, das wird bei ganz vielen Seiten nicht berücksichtigt.

00:17:00.680 --> 00:17:07.100
 Die denken, naja, mit Deutsch stecken wir ja Deutsch-Österreich und Deutschland-Österreich und Teile der Schweiz ab.

00:17:07.100 --> 00:17:09.440
 Aber es gibt ja doch so kleine, feine Unterschiede.

00:17:09.440 --> 00:17:14.000
 Und damit kann man auch diese Unterschiede theoretisch berücksichtigen, wenn man das möchte.

00:17:14.840 --> 00:17:17.460
 Und der dritte Punkt, das sind die Plural-Rules.

00:17:19.720 --> 00:17:23.620
 Beispiel habe ich da das Wort Podcast im Singular und Podcast im Plural.

00:17:23.620 --> 00:17:26.540
 Wenn ich Null habe, ist es im Deutschen auch Podcasts.

00:17:26.540 --> 00:17:30.120
 Ein Podcast ist Podcast und ab zwei aufwärts ist es wieder Podcasts.

00:17:30.120 --> 00:17:31.580
 Im Englischen funktioniert es genauso.

00:17:31.580 --> 00:17:34.500
 Und das funktioniert auch in vielen europäischen Sprachen so.

00:17:34.500 --> 00:17:37.760
 Oder vom Lateinischen und Germanischen abstammenden Sprachen so.

00:17:38.320 --> 00:17:41.380
 Das Arabische hat aber zum Beispiel sechs verschiedene Plural-Formen.

00:17:41.380 --> 00:17:47.060
 Ich weiß nicht, ob man da auch von Plural dann spricht oder ob das wieder irgendeinen linguistischen Fachbegriff hat.

00:17:47.060 --> 00:17:50.220
 Jedenfalls gibt es da eine Klassifizierung.

00:17:50.220 --> 00:17:57.400
 One, two, also zero, one, two, many, few, many und other.

00:17:58.540 --> 00:18:03.300
 Und über die Plural-Rules kann ich mir das zurückgeben lassen anhand von der Zahl.

00:18:03.300 --> 00:18:06.060
 Also ich übergebe als Parameter die Zahl, die ich habe.

00:18:06.060 --> 00:18:11.380
 Also Standardfall im Web wäre statt Podcast wahrscheinlich eher irgendwie Beiträge.

00:18:11.380 --> 00:18:14.840
 Und dann habe ich eben einen Beitrag oder x Beiträge.

00:18:14.840 --> 00:18:18.520
 Und fürs Arabische, wenn ich das berücksichtigen will, kann ich das auch entsprechend machen.

00:18:18.520 --> 00:18:24.300
 Normalerweise würde man sowas serverseitig machen beim Rausrendern und entsprechend vielleicht den Wert schon.

00:18:24.300 --> 00:18:28.000
 Oder man würde sich eine Library nehmen wie Moment.js, die das Ganze berücksichtigen kann.

00:18:28.000 --> 00:18:30.860
 Aber das funktioniert auch direkt im Browser.

00:18:30.860 --> 00:18:34.520
 Und zwar auch schon wieder erstaunlich lange und mit einer recht großen Abdeckung.

00:18:34.520 --> 00:18:38.260
 Die ist allerdings nicht für die ganze Internalization.

00:18:38.260 --> 00:18:40.080
 Ich kann dieses Wort nicht aussprechen.

00:18:40.080 --> 00:18:43.060
 Internationalization API.

00:18:43.060 --> 00:18:44.140
 Darfst du es auch auf Deutsch sagen?

00:18:44.140 --> 00:18:45.580
 Internationalisierung.

00:18:45.580 --> 00:18:47.320
 Die Internationalisierungs-API.

00:18:47.320 --> 00:18:50.560
 Die ist nicht einheitlich, die Abdeckung.

00:18:50.560 --> 00:18:54.800
 Sondern jedes Feature von dieser API hat eine unterschiedliche Abdeckung.

00:18:54.800 --> 00:18:57.320
 Datetime-Format mit über 94%.

00:18:57.320 --> 00:18:59.200
 Gibt es schon seit Firefox 29.

00:18:59.200 --> 00:19:01.000
 Das ist immerhin 2014.

00:19:01.000 --> 00:19:03.060
 Chrome 24 sogar seit 2012.

00:19:03.060 --> 00:19:05.440
 Und sogar IE11 kann das Ganze.

00:19:05.440 --> 00:19:10.180
 Dieselbe Abdeckung gibt es auch für Number-Format.

00:19:10.180 --> 00:19:14.720
 Und bei den Plural-Rules, was man vielleicht auch nicht ganz so häufig brauchen würde,

00:19:15.320 --> 00:19:21.220
 sind es 87%, Firefox 58 2018 und Chrome 63 von 2017.

00:19:21.220 --> 00:19:25.340
 Und Edge erst mit Chromium, also nicht mal in den vorherigen Edge-Versionen.

00:19:25.340 --> 00:19:31.540
 Das heißt, so ganz reich für den Produktiveinsatz ist es vielleicht noch nicht.

00:19:31.540 --> 00:19:35.600
 Aber es gibt natürlich auch entsprechend Polyfills dafür.

00:19:36.460 --> 00:19:39.800
 Einmal Intel.js, werde ich natürlich verlinken.

00:19:39.800 --> 00:19:46.540
 Und Core.js, was man ganz häufig hat, oder was es zumindest gibt, weiß nicht wie häufig das eingesetzt wird,

00:19:46.540 --> 00:19:52.880
 in Bubble-Build-Chains, wo das für Polyfills genutzt wird, hat es absichtlich nicht integriert aufgrund des Umfangs.

00:19:52.880 --> 00:19:55.840
 Also es ist wohl doch recht umfangreich, diese ganzen Locals zu integrieren.

00:19:56.460 --> 00:19:58.760
 Und zu den Locals noch ein Wort.

00:19:58.760 --> 00:20:05.260
 Die Unterstützung von den verschiedenen Sprachen ist abhängig vom System und vom Client, was der mitbringt.

00:20:05.260 --> 00:20:09.500
 Und es gibt leider keine Möglichkeit, sich alle verfügbaren Locals auflisten zu lassen.

00:20:09.500 --> 00:20:10.840
 Das hatte ich nämlich versucht.

00:20:10.840 --> 00:20:18.360
 Ich kann nur überprüfen, ob ein gegebenes Locale oder ein Array von Locales, welche davon unterstützt werden.

00:20:19.360 --> 00:20:20.480
 Finde ich ein bisschen schade.

00:20:20.480 --> 00:20:24.340
 Wäre ganz cool irgendwie für die Demo gewesen, dass ich da alle auflisten kann und man alle auswählen kann.

00:20:24.340 --> 00:20:26.940
 Aber das funktioniert nicht.

00:20:26.940 --> 00:20:28.420
 Ja, und das war es eigentlich auch schon.

00:20:28.420 --> 00:20:29.760
 Kennst du die API?

00:20:29.760 --> 00:20:31.700
 Ich kannte die nicht, nee.

00:20:31.700 --> 00:20:36.940
 Die Plural Rules sind eigentlich wahrscheinlich sogar das, was ich jetzt am häufigsten,

00:20:36.940 --> 00:20:39.080
 weil du gerade gesagt hast, das brauchen wir vielleicht nicht so oft.

00:20:39.080 --> 00:20:39.660
 Okay.

00:20:39.660 --> 00:20:47.120
 So von den Projekten, die ich so vom Rohr habe, ist das wahrscheinlich die, die ich am häufigsten brauchen würde.

00:20:47.460 --> 00:20:56.380
 Weil das kommt wirklich ständig vor, dass man ein Wort in mehreren Sprachen, in Plural und Singular irgendwie haben will.

00:20:56.380 --> 00:21:01.940
 Also ich habe selten irgendwie Euro-Beträge oder sowas.

00:21:01.940 --> 00:21:04.920
 A Date-Time-Format, ja, auf jeden Fall.

00:21:04.920 --> 00:21:06.900
 Aber wahrscheinlich tatsächlich Plural.

00:21:06.900 --> 00:21:08.000
 Plural ist echt häufig.

00:21:08.000 --> 00:21:09.820
 Ja, mit Datum habe ich häufig zu tun.

00:21:09.820 --> 00:21:12.180
 Deswegen meinte ich, dass ich das andere nicht so häufig brauchen würde.

00:21:12.180 --> 00:21:13.120
 Aber ja, du hast recht.

00:21:13.120 --> 00:21:15.820
 Natürlich, klar, ist das auf jeden Fall hilfreich.

00:21:15.820 --> 00:21:20.220
 Also es hat ja auch nicht jeder häufig mit Internationalisierung zu tun.

00:21:20.220 --> 00:21:26.220
 Also jetzt in meinem Fall, was wir so machen, ist eigentlich immer mindestens zweisprachig.

00:21:27.380 --> 00:21:35.920
 Aber ich weiß auch, dass es gibt wohl viele Web-Developer da draußen, die das eigentlich nicht machen müssen, weil die bauen einsprachige Firmen-Webseiten oder irgendwie sowas.

00:21:35.920 --> 00:21:37.480
 Da kommt das eher selten zum Einsatz.

00:21:37.480 --> 00:21:38.840
 Ja.

00:21:39.840 --> 00:21:45.860
 Okay, aber coole Geschichte auf jeden Fall, kannte ich nicht, werde ich auf jeden Fall mal mehr anschauen demnächst.

00:21:45.860 --> 00:21:47.740
 Freut mich, wenn ich dir auch mal was Neues erzählen kann.

00:21:47.740 --> 00:21:48.600
 Ach, ständig.

00:21:48.600 --> 00:21:48.960
 Sehr schön.

00:21:48.960 --> 00:21:50.460
 Kannst mal ein bisschen wieder Demo spielen.

00:21:50.460 --> 00:21:52.500
 Genau.

00:21:52.500 --> 00:21:54.180
 Gut, dann.

00:21:54.180 --> 00:21:56.280
 Dann kommen wir vielleicht gleich zum Thema.

00:21:56.520 --> 00:21:59.440
 Aber zuvor gibt's noch kurz Werbung.

00:21:59.440 --> 00:22:00.060
 Werbung.

00:22:00.060 --> 00:22:02.180
 Ich wurde gefeuert.

00:22:02.180 --> 00:22:05.780
 Mit Atemhilfe hätte ich Trennung vorbeugen können.

00:22:05.780 --> 00:22:08.820
 Quält dich Schnarchen?

00:22:08.820 --> 00:22:12.380
 Diese Atemhilfe stellt den Lärm ein.

00:22:15.980 --> 00:22:17.860
 Störst du andere mit Schnarchen?

00:22:17.860 --> 00:22:20.500
 Mit Schlafhilfe kein Lärm mehr.

00:22:20.500 --> 00:22:24.260
 Verursacht Schnarchen Herzanfall?

00:22:24.260 --> 00:22:27.220
 Mit Schlafhilfe gegen Gefahren.

00:22:27.220 --> 00:22:30.240
 Schnarchst du noch?

00:22:30.240 --> 00:22:33.920
 Mit Atemhilfe Lärm schnell weg.

00:22:33.920 --> 00:22:35.200
 Abmelden hier.

00:22:35.200 --> 00:22:38.260
 Schnarcht dein Partner unerträglich?

00:22:38.260 --> 00:22:41.160
 Ich zeige eine sichere Methode.

00:22:44.160 --> 00:22:46.120
 Von der Partnerin verlassen.

00:22:46.120 --> 00:22:49.280
 Hätte ich sie nur getragen.

00:22:49.280 --> 00:22:52.300
 Lerne etwas davon.

00:22:52.300 --> 00:22:58.920
 Zu Risiken und Nebenwirkungen lesen Sie die Dokumentationen oder fragen Sie Ihren Systemadministrator.

00:22:58.920 --> 00:23:02.060
 Ja, Wahnsinn, diese Dramatik am Schluss, oder?

00:23:02.060 --> 00:23:04.640
 Da leitet man richtig mit.

00:23:04.640 --> 00:23:09.280
 Also auch das wieder eine tatsächlich echte Spam-Mail, die ich so in meinem Posteingang hatte.

00:23:09.280 --> 00:23:13.100
 Und wir hatten es gerade eben auch noch davon, bevor wir die Aufnahme gestartet haben.

00:23:13.620 --> 00:23:20.620
 Spam-Spot, Atemhilfe, ist jetzt vielleicht gerade ein bisschen doppeldeutig, aber es geht ja zum Glück nur um Schnarchen.

00:23:20.620 --> 00:23:22.000
 Ja, Schnarchen, schrecklich.

00:23:22.000 --> 00:23:26.840
 Und damit kommen wir eigentlich auch schon zum Thema und wir haben leider immer noch kein Jingle fürs Thema, aber vielleicht beim nächsten Mal.

00:23:26.840 --> 00:23:27.880
 Vielleicht beim nächsten Mal.

00:23:27.880 --> 00:23:32.500
 Ich hatte schon ein paar Ideen, ich habe schon ein paar Sachen ausprobiert, aber noch ist es nicht so weit.

00:23:33.360 --> 00:23:38.240
 Ich will ja vielleicht auch nicht, dass der Jingle dann so klingt wie jeder andere Themen-Jingle.

00:23:39.000 --> 00:23:40.200
 Deswegen gibt es noch keinen.

00:23:40.200 --> 00:23:42.000
 Aber wer weiß, vielleicht kommt irgendwann noch einer.

00:23:42.000 --> 00:23:47.960
 Das Thema der Woche ist Web Accessibility Basics.

00:23:49.160 --> 00:23:51.940
 Das ist eins meiner Lieblingsthemen generell, Web Accessibility.

00:23:51.940 --> 00:23:59.280
 Und ich will da jetzt nicht so extrem in die Tiefe gehen, sondern einfach mal so ein paar Tipps zum Mitnehmen.

00:24:00.340 --> 00:24:08.820
 Weil, naja, man könnte jetzt sagen, naja, so Web Accessibility Basics, die hat irgendwie jeder schon drauf oder da kennt sich irgendwie jeder schon aus.

00:24:08.820 --> 00:24:15.820
 Die Wahrheit ist, mag sein, aber es hält sich offenbar keiner dran, selbst wenn die Leute das irgendwie wissen.

00:24:15.940 --> 00:24:19.820
 Also ich würde es zum Beispiel von mir nicht behaupten, dass ich mich damit jetzt großartig auskenne.

00:24:19.820 --> 00:24:25.860
 Ich musste bisher tatsächlich, ich versuche schon so Basics, die man so landläufig kennt, umzusetzen.

00:24:25.860 --> 00:24:30.800
 Aber ich würde von mir nicht behaupten, dass ich auch nur ansatzweise halber Profi wäre.

00:24:30.800 --> 00:24:31.320
 Naja.

00:24:31.320 --> 00:24:35.360
 Deswegen bin ich froh, dass du heute darüber berichtest, weil da kann ich auch noch richtig was davon lernen.

00:24:35.780 --> 00:24:47.360
 Ja, ich hoffe, also es ist neben tatsächlich Fachwissen oder Fachkenntnis, weil die haben tatsächlich viele, ist es auch ein Appell, es zu tun.

00:24:47.360 --> 00:24:49.560
 Also sich auch ein bisschen um Accessibility zu kümmern.

00:24:49.560 --> 00:24:57.340
 Aber bevor ich jetzt schon richtig einsteige, möchte ich mal kurz noch erklären, warum sollte man sich überhaupt ein bisschen damit beschäftigen?

00:24:57.340 --> 00:25:01.120
 Oder warum sollte man sich überhaupt mit Accessibility auseinandersetzen?

00:25:01.120 --> 00:25:04.620
 Naja, ich glaube, wir sind uns alle einig.

00:25:05.000 --> 00:25:14.240
 Wir wollen ein Web für alle, also möglichst viele Leute sollen unsere Webseiten oder Web-Apps, die wir bauen, benutzen können.

00:25:14.240 --> 00:25:19.620
 Oftmals werden da halt Leute mit bestimmten Einschränkungen vergessen.

00:25:19.620 --> 00:25:25.520
 Also ich meine, der Klassiker, worüber dann immer geredet wird, wenn man über Web-Accessibility redet, sind beispielsweise Blinde.

00:25:25.520 --> 00:25:34.520
 Für die ist es auch eine besondere, da muss man sich schon ein bisschen auskennen oder einige Best-Practices beachten, wenn man Webseiten für Blinde optimieren will.

00:25:35.000 --> 00:25:47.340
 Aber es ist auch, man muss noch dazu sagen, es gibt ja verschiedene Arten von Behinderung und was viele vergessen ist, es gibt ja auch sowas wie temporäre Behinderung.

00:25:47.580 --> 00:25:57.820
 Also was, wo ich vielleicht nur eine Zeit lang eingeschränkt bin, weil ich mich irgendwie verletzt habe, muss ich mal irgendwie eine Augenklappe tragen oder ich kann gerade keine Maus benutzen, weil ich mir den Arm gebrochen habe.

00:25:58.320 --> 00:26:06.600
 Oder ich bin, der einfachste Fall ist, ich bin irgendwie gerade draußen unterwegs, schaue auf mein Handy und die Sonne scheint mir aufs Display.

00:26:06.600 --> 00:26:15.940
 Also auch das ist quasi schon eine temporäre Behinderung, weil da wäre es dann vielleicht gut, wenn das, was ich benutze gerade einen hohen Kontrast hat zum Beispiel.

00:26:16.700 --> 00:26:19.340
 Also alleine schon die Sonne auf dem Display kann eine Behinderung sein.

00:26:19.340 --> 00:26:23.840
 Permanente Behinderung, ich glaube, da muss ich nicht näher darauf eingehen.

00:26:23.840 --> 00:26:28.120
 Naja, klar, ich meine, es gibt Leute, die haben Probleme mit ihren Augen oder mit ihren Ohren.

00:26:31.920 --> 00:26:38.920
 Behinderung gibt es natürlich auch, da kann man natürlich auch was machen und dann am Ende natürlich noch motorische Behinderung.

00:26:38.920 --> 00:26:40.060
 Genau.

00:26:40.060 --> 00:26:50.060
 Aber ich will gar nicht so sehr darauf eingehen, ich wollte nur mal kurz motivieren und sagen, naja, jeder ist irgendwann mal behindert, spätestens im Alter, aber auch manchmal sogar im Alltag.

00:26:52.340 --> 00:27:17.260
 Um so ein bisschen theoretischen Rahmen noch zu spannen, es gibt für Web Accessibility auch tatsächlich Regeln, die festgeschrieben sind, die empfohlen werden, dass man sich daran hält und das sind, ich gehe jetzt mal auf die deutschsprachigen Regeln, auf die deutsche Gesetzgebung mal nicht so tief ein, weil die da teilweise ein bisschen merkwürdige Sachen sich vorstellen oder die denken, sie müssen ja ihr eigenes Ding machen.

00:27:17.260 --> 00:27:23.840
 Ich empfehle die Web Content Accessibility Guidelines, WCAG, WCAG, sich mal durchzulesen.

00:27:23.840 --> 00:27:39.360
 Die sind aktuell, glaube ich, wenn ich es richtig weiß, in der Version 2.1 und da gibt es auch deutsche Übersetzungen dafür und es gibt auch, teilweise sind die Dokumente manchmal ein bisschen kompliziert geschrieben, wie man es von Standards oft so kennt, damit auch wirklich jeder Fall abgedeckt ist.

00:27:39.360 --> 00:27:56.680
 Es gibt aber auch einige Dokumente, wo das mal so in, oder einige Übersetzungen sozusagen, wo das mal in vernünftige deutsche Sprache gebracht wurde oder auch in einfach verständliche englische Sprache, wo man dann auch an Beispielen sehen kann, wie man jetzt die einzelnen Sachen umzusetzen hat.

00:27:57.220 --> 00:28:08.400
 Genau, aber kommen wir mal jetzt tatsächlich auch ans Eingemachte Basics, technische Dinge, die ihr tun könnt, damit eure Seiten ein bisschen zugänglicher sind.

00:28:08.960 --> 00:28:12.900
 Und als ersten Punkt habe ich da semantisches HTML verwenden.

00:28:12.900 --> 00:28:15.520
 Das hilft in jedem Fall.

00:28:15.520 --> 00:28:23.440
 Also das hilft nicht nur dem Blinden mit seinem Screenreader, der nämlich dann erkennen kann, welches Element ist denn jetzt überhaupt was.

00:28:23.440 --> 00:28:30.640
 Ich habe hier eine Überschrift, ich habe hier einen Button, ich habe hier verschiedenste semantische Elemente, Main und so weiter.

00:28:32.240 --> 00:28:37.820
 Das hilft nicht nur dem, sondern das hilft dir natürlich auch der Suchmaschine, die versucht irgendwie zu erkennen, was denn auf eurer Seite abgeht.

00:28:37.820 --> 00:28:46.500
 Also semantisches HTML verwenden, überleg dir bei dem HTML Element oder wenn du HTML schreibst, was ist das Ding eigentlich oder was für eine Funktion erfüllt das?

00:28:46.500 --> 00:28:57.780
 Und dann vielleicht mal nachschauen und nicht immer nur Diffs und Spans verwenden, sondern auch vielleicht mal Header, Footer, Listenelemente, Paragraph und so weiter.

00:28:59.540 --> 00:29:06.120
 Der nächste Punkt ist, für Nicht-Text-Content sollte immer eine Textalternative bereitstehen, wenn es möglich ist.

00:29:06.120 --> 00:29:17.160
 Das hat den Grund, dass auch zum Beispiel ein Screenreader, also ein Bildschirmvorleseprogramm, ein Bild oder so irgendwie im Kontext noch erklärt bekommt.

00:29:17.500 --> 00:29:33.260
 Also ich weiß nicht, ob das jemand mitbekommen hat, ich weiß nicht, wann war das, vor eineinhalb Jahren oder so irgendwann oder vor zwei Jahren, war mal eine Engine bei Instagram und bei Facebook kaputt, sodass die Bilder nicht mehr ausgespielt wurden.

00:29:33.700 --> 00:29:41.260
 Was dann alle plötzlich gesehen haben in ihren Apps und auf den Webseiten, waren die Alternativtexte, die Facebook dazu automatisch generiert.

00:29:41.260 --> 00:29:46.860
 Also soweit würde ich jetzt nicht gehen, dass jeder so einen Algorithmus bei sich implementieren muss, das automatisch erkannt wird.

00:29:46.860 --> 00:29:57.460
 Was auf Bildern zu sehen ist, das braucht man glaube ich nur, wenn man Content-heavy-Website hat, wo viel User-Generated-Content hochgeladen wird.

00:29:57.460 --> 00:30:03.640
 Aber generell, wenn ihr irgendwas habt, was kein Text ist, sollte eine Text-Alternative bereitgestellt werden.

00:30:03.640 --> 00:30:14.980
 Ein schlechtes Beispiel dafür, oder nee, ein interessantes Beispiel dafür, ein interessantes Problem bei der Stelle sind zum Beispiel Captures.

00:30:14.980 --> 00:30:19.180
 Weil da möchte man eigentlich gar nicht als Text irgendwo stehen haben.

00:30:19.180 --> 00:30:20.440
 Wäre kontraproduktiv.

00:30:20.440 --> 00:30:25.640
 Was genau drinsteht, da gibt es dann meistens Audio-Captures, aber die sind auch sehr schwer hörbar.

00:30:25.640 --> 00:30:27.160
 Ich weiß nicht, wer das schon mal versucht hat.

00:30:27.460 --> 00:30:29.160
 Naja, also ich schweife ab.

00:30:29.160 --> 00:30:41.040
 Generell zu sagen, nutzt Alt-Attribute bei Bildern oder macht auch irgendwie bei Videos oder allgemein interaktiver Content eine Text-Alternative, wäre immer eine gute Idee.

00:30:41.040 --> 00:30:46.300
 Kannst du da noch was dazu sagen zu guten und schlechten Alt-Texten?

00:30:46.300 --> 00:30:54.700
 Weil ich glaube, da gibt es auch qualitativ große Unterschiede, was denn da überhaupt rein sollte, was denn auch hilfreich ist für nicht sehende Personen zum Beispiel.

00:30:55.500 --> 00:31:00.500
 Ja, also ich glaube, ich habe da mal in der Präsentation eine Unterscheidung gemacht.

00:31:00.500 --> 00:31:08.720
 Ich glaube, es gibt so drei, mir fallen jetzt gerade spontan drei verschiedene Kategorien ein, in die man ein Bild stecken kann.

00:31:08.720 --> 00:31:11.040
 Je nachdem schreibt man dann was anderes rein.

00:31:11.040 --> 00:31:17.060
 Also das Einfachste ist, du hast eine Schmuckgrafik, die überhaupt gar keinen Zweck erfüllt im Inhalt.

00:31:17.060 --> 00:31:27.860
 Da machst du einfach ein leeres Alt-Attribut rein, weil das hat man sehr, sehr, sehr selten heutzutage, weil man ganz viel, was man früher mit Schmuckgrafiken gemacht hat, mit CSS macht.

00:31:28.160 --> 00:31:34.120
 Aber vielleicht habt ihr ja tatsächlich irgendwo noch eine Grafik auf der Seite, die überhaupt gar keine inhaltliche Relevanz hat.

00:31:34.120 --> 00:31:37.120
 Da ist es okay, das Alt-Attribut leer zu lassen.

00:31:37.120 --> 00:31:41.780
 Aber laut HTML-Standard, zumindest der letzte Stand, den ich habe, muss es auf jeden Fall drin sein.

00:31:41.780 --> 00:31:46.080
 Wenn ihr einen Image-Tag irgendwie auf der Seite habt, dann muss auf jeden Fall ein Alt-Attribut drin sein.

00:31:46.160 --> 00:31:47.980
 Wie gesagt, es darf unter Umständen leer sein.

00:31:47.980 --> 00:31:58.000
 Dann gibt es Funktionsgrafiken, also zum Beispiel ein Icon, das ein Menü öffnet oder sowas.

00:31:58.000 --> 00:32:03.720
 Da sollte dann möglichst drinstehen, oder ich meine, ja doch, das ist schon der klassische Fall.

00:32:03.720 --> 00:32:08.460
 Da sollte dann möglichst drinstehen, die Aktion, die ich auslöse, wenn ich da draufklicke.

00:32:08.460 --> 00:32:13.580
 Also üblicherweise sollte das ja dann auch ein interaktives Element sein, also ein Button oder ein Link.

00:32:14.160 --> 00:32:17.740
 Also wenn es jetzt tatsächlich ein Menü öffnet, also irgendwie ein Dropdown oder sowas,

00:32:17.740 --> 00:32:23.200
 dann sollte das auf jeden Fall normalerweise kein Link sein, weil ein Link hat normalerweise immer ein Ziel.

00:32:23.200 --> 00:32:29.940
 Und in dem Fall wäre das Ziel ja dieselbe Seite, beziehungsweise einfach nur ein Dropdown öffnen wäre eigentlich dann trotzdem ein Link.

00:32:29.940 --> 00:32:35.860
 Egal, also der Text, der da drinsteht, sollte die Aktion beschreiben, die ausgelöst werden soll.

00:32:35.860 --> 00:32:39.680
 Und dann gibt es noch Inhaltsgrafiken.

00:32:39.680 --> 00:32:43.200
 Also was wäre da jetzt ein gutes Beispiel?

00:32:43.300 --> 00:32:48.320
 Ich habe halt einen Text und da ist irgendwie ein Bild mit drin zur Erklärung.

00:32:48.320 --> 00:32:50.940
 Und da sollte dann möglichst das Bild beschrieben werden.

00:32:50.940 --> 00:32:52.980
 Was ist auf dem Bild denn zu sehen?

00:32:52.980 --> 00:32:57.360
 Ah genau, mir fällt noch eine Kategorie gerade ein.

00:32:57.360 --> 00:33:03.360
 Und zwar, das gibt es tatsächlich auch immer noch, Bilder, die Text enthalten.

00:33:03.360 --> 00:33:07.760
 Die sollten am besten als Alternativtext einfach den Text haben.

00:33:07.760 --> 00:33:17.320
 Also wenn ich jetzt irgendwie ein Logo habe, auf dem ein Text zu sehen ist oder irgendwie ein anderes Bild, auf dem ein Text zu sehen ist, dann einfach nur den Text reinschreiben.

00:33:17.760 --> 00:33:19.340
 Aber da dürft ihr mich auch gerne korrigieren.

00:33:19.340 --> 00:33:24.540
 Also ich spreche mich zwar immer mal wieder mit, jetzt gerade mit Blinden ab, weil das für die sehr wichtig ist.

00:33:25.040 --> 00:33:31.660
 Aber da lasse ich mich auch gerne korrigieren, weil ich habe zwar eine Rot-Grün-Schwäche, aber ich bin nicht auf Screenreader angewiesen.

00:33:31.820 --> 00:33:35.520
 Also falls ihr, falls ich jetzt irgendwie Quatsch erzählt habe, bitte dann mal in die Kommentare schreiben.

00:33:35.520 --> 00:33:37.320
 Genau.

00:33:37.320 --> 00:33:41.120
 Habe ich damit die Bilder ausreichend erklärt oder hast du dazu noch Fragen?

00:33:41.120 --> 00:33:42.220
 Ja, auf jeden Fall.

00:33:42.220 --> 00:33:42.620
 Danke.

00:33:42.620 --> 00:33:43.900
 Sehr gerne.

00:33:44.900 --> 00:33:49.140
 So, das Nächste, das liegt mir sehr, sehr am Herzen, weil das ganz oft vergessen wird auf Seiten.

00:33:49.140 --> 00:33:56.740
 Also ich habe irgendwann mal gedacht, jetzt ist der Moment gekommen, also so vor zwei Jahren oder so gab es so einen Accessibility-Hype.

00:33:56.740 --> 00:34:01.440
 Und da dachte ich so, jetzt hat es sich durchgesetzt, jetzt ist es im Mainstream angekommen.

00:34:01.440 --> 00:34:05.980
 Aber trotzdem treffe ich immer wieder auf Seiten, die das falsch machen.

00:34:07.260 --> 00:34:13.280
 Und zwar, wenn ihr Formularelemente habt, gebt denen immer ein Label.

00:34:13.280 --> 00:34:14.760
 Immer, immer, immer.

00:34:14.760 --> 00:34:17.760
 Also Input, Type, Hidden, okay, da vielleicht nicht.

00:34:17.760 --> 00:34:30.640
 Aber ansonsten, wenn ihr irgendwie Inputs habt, Radio-Buttons, Checkboxen, Text-Areas, immer, immer ein Label mit dazu, das auch damit korrekt verknüpft wird.

00:34:30.640 --> 00:34:33.140
 Also einfach nur die Anwesenheit eines Labels reicht nicht aus.

00:34:33.140 --> 00:34:40.160
 Also ich muss entweder das Input-Element in das Label reintun, dann ist es automatisch verknüpft.

00:34:40.160 --> 00:34:51.500
 Oder ich kann es per ID, also ich gebe dem Input-Element eine ID und dem Label das Vorattribut mit der ID drin, dann werden die automatisch miteinander verknüpft.

00:34:52.760 --> 00:35:03.580
 Genau, das ist extrem wichtig, weil wenn ich das nicht mache, dann habe ich unter Umständen den Fall, dass ich auf die Seite gehe, dann steht da, dann kriege ich vorgelesen im Screenreader Eingabefeld.

00:35:03.580 --> 00:35:06.900
 So, ja, was soll da jetzt rein?

00:35:06.900 --> 00:35:07.580
 Keine Ahnung.

00:35:07.580 --> 00:35:10.160
 Deswegen immer das Label dazu packen.

00:35:10.320 --> 00:35:21.900
 Also manchmal ist es ja auch, sagt der Designer, ich will jetzt hier kein Label haben oder da soll jetzt kein sichtbares Label sein aus irgendwelchen Gründen, weil es sich aus dem visuellen Kontext vielleicht erschließt, was da rein soll.

00:35:21.900 --> 00:35:22.800
 Das gibt es so Fälle.

00:35:24.380 --> 00:35:26.400
 Auch da bitte ein Label-Element hin.

00:35:26.400 --> 00:35:38.660
 Im allerschlimmsten Fall kann man auch ARIA-Label verwenden als Attribut auf dem Input-Feld oder so, aber im besten Fall habt ihr ein Label und man kann sowas ja auch ganz easy mit CSS verstecken.

00:35:38.660 --> 00:35:45.320
 Der nächste Punkt wäre Fokus, visueller Fokus.

00:35:45.320 --> 00:35:54.180
 Fokus-Styles werden ganz oft vergessen oder Fokus wird irgendwie ausgeblendet, sodass man irgendwie, also in Firefox war so der Klassiker immer so eine gepunktete Linie,

00:35:54.280 --> 00:35:59.040
 um Link beispielsweise oder auch um Button, wenn der Fokus auf das Element geht.

00:35:59.040 --> 00:36:10.320
 Das wird oft in vielen Frameworks ganz gern ausgeschaltet, weil der Designer möchte das nicht so haben oder sieht irgendwie nicht so hübsch aus, aber das sollte man auf keinen Fall machen.

00:36:10.320 --> 00:36:15.040
 Also wenn der Style nicht gefällt, den kann man anpassen.

00:36:15.040 --> 00:36:19.100
 Zum Beispiel finde ich das Bootstrap, das ganz nett gelöst hat, da könnt ihr ja mal reinschauen.

00:36:19.100 --> 00:36:23.920
 Die machen das, glaube ich, mit Box Shadow.

00:36:24.180 --> 00:36:25.840
 Ich bin mir jetzt gerade nicht sicher.

00:36:25.840 --> 00:36:28.940
 Ich glaube, die machen das mit Box Shadow.

00:36:28.940 --> 00:36:34.980
 Also man kann das echt hübsch machen und man kann es auch interaktiv machen, sodass man auch sieht, wo der Fokus über die Seite flitzt.

00:36:34.980 --> 00:36:38.880
 Auf jeden Fall ist immer wichtig, dass ich sehe, was hat denn den Fokus.

00:36:40.380 --> 00:36:45.400
 Eine ganz einfache Möglichkeit, das zu machen ist, ihr habt wahrscheinlich Hover-Styles schon auf allem Möglichen drauf.

00:36:45.400 --> 00:36:48.800
 Nehmt einfach die doch auch für den Fokus.

00:36:48.800 --> 00:36:53.960
 Es ist zwar noch cooler, wenn man einen extra Fokus-Style hat, sodass man einen Unterschied erkennen kann zwischen Hover und Fokus.

00:36:54.600 --> 00:36:59.320
 Aber ein Fokus-Style, der aussieht wie Hover, ist besser als kein Fokus-Style.

00:36:59.480 --> 00:37:10.280
 Das hilft auch nicht nur Leuten, die die Tastatur benutzen, die auf die Tastatur-Nutzung angewiesen sind, sondern das hilft eigentlich jedem, wenn man weiß, wo gerade der Fokus auf der Seite ist.

00:37:10.280 --> 00:37:12.180
 Also stellt es euch vor wie ein Cursor.

00:37:12.180 --> 00:37:17.900
 Ich wollte gerade sagen, ich bin selbst jemand, der gerne mal die Tastatur auch benutzt statt der Maus.

00:37:17.900 --> 00:37:23.680
 Und da stößt man bei vielen Seiten dann doch schnell an die Grenzen, weil man gar nicht sieht, wo man sich jetzt gerade aktiv bewegt.

00:37:23.680 --> 00:37:25.000
 Also wirklich ein wichtiger Punkt.

00:37:25.000 --> 00:37:30.240
 Ich erinnere mich noch an ein Stück gemeinsamer Geschichte von uns, Konstantin.

00:37:30.240 --> 00:37:36.180
 Als wir mal in einem Rechner saßen, wo keine Maus dran war, weil die irgendjemand geklaut hatte.

00:37:37.540 --> 00:37:47.400
 Und genau in diesem Fall hast du dann ein großes Problem, wenn du nicht siehst, wo dein Tastaturfokus ist, weil du versuchst irgendwie den Rechner zu navigieren, aber hast keine Chance, wenn du nicht siehst, wo gerade dein Fokus ist.

00:37:47.400 --> 00:37:51.860
 Also das ist, finde ich, eine extrem wichtige Sache.

00:37:51.860 --> 00:37:59.540
 Also ich meine, alle von den Sachen, die ich jetzt hier irgendwie erzähle, finde ich extrem wichtig, weil es sind nur die größten Klopper.

00:37:59.540 --> 00:38:03.800
 Es gibt natürlich noch viel mehr, was man tun kann, als das, was ich jetzt erzähle.

00:38:05.100 --> 00:38:08.400
 Genau, nächster Punkt, falls du dazu keine Fragen mehr hast.

00:38:08.400 --> 00:38:10.080
 Nee, alles gut von meiner Seite.

00:38:10.080 --> 00:38:11.220
 Farbkontraste.

00:38:11.220 --> 00:38:20.420
 Dazu gibt es auch ein ganz geiles Tool von Lea Verroux, so ein Kontrastchecker, contrast-ratio.com.

00:38:20.420 --> 00:38:24.100
 Genau, also Farbkontraste.

00:38:24.100 --> 00:38:29.500
 Ich meine, jeder war bestimmt schon mal auf einer Seite und hat sich gedacht, Mensch, ich kann den Text irgendwie kaum lesen, obwohl er vielleicht groß genug ist.

00:38:30.060 --> 00:38:40.020
 Es ist wichtig, dass der Farbkontrast hoch genug ist und dafür gibt es auch tatsächlich Werte, die vorgeschlagen werden in den Web-Content-Accessibility-Guidelines, die man sich einfach ausrechnen kann.

00:38:40.020 --> 00:38:43.040
 Auch zum Beispiel auf der Seite contrast-ratio.com.

00:38:44.400 --> 00:38:54.680
 Da trage ich einfach meine zwei Farben ein, also meine Textfarbe und meine Hintergrundfarbe und dann kriege ich da ganz einfach einen Wert ausgerechnet und dann kriege ich gesagt, ja, passt oder passt nicht.

00:38:56.120 --> 00:39:11.260
 Interessant an der Stelle, glaube ich, ist noch zu sagen, es ist manchmal gar nicht so einfach, verschiedene Kontraste hinzukriegen, gerade weil zum Beispiel es auch einen Wert gibt für, wie sehr sollte der Kontrast zwischen Linkfarbe und Textfarbe sein.

00:39:11.260 --> 00:39:17.600
 Und wenn du dazu dann noch eine Hintergrundfarbe hast, dann hast du nämlich schon drei Variablen in der Geschichte, die irgendwie zueinander passen müssen.

00:39:18.360 --> 00:39:22.100
 Also geht alles, aber ist gar nicht so einfach, das hinzukriegen.

00:39:22.100 --> 00:39:29.620
 Ich glaube, der Klassiker ist, wenn du jetzt überhaupt gar kein CSS auf der Seite hast, dann sollten die Farben alle passen, weil die sind ziemlich krass.

00:39:29.620 --> 00:39:36.820
 Ich weiß nicht, ob das jemand, ob man das irgendwie heutzutage noch kennt, Seiten komplett ohne CSS, wie die aussehen.

00:39:36.820 --> 00:39:39.980
 Die Standard-Styles von den Browsern sind ja da durchaus interessant.

00:39:39.980 --> 00:39:44.980
 Genau, vielleicht noch eine kleine Ausschweifung an der Stelle.

00:39:47.240 --> 00:39:56.940
 Was man da dann sieht und was viele Seiten nicht implementieren, beziehungsweise rausoptimieren, viele CSS-Frameworks, ist der Visited-Status von Links.

00:39:56.940 --> 00:40:00.620
 Ich weiß nicht, Konstantin, setzt du das ein, Visited?

00:40:00.620 --> 00:40:03.800
 Tatsächlich inzwischen eigentlich kaum noch.

00:40:03.800 --> 00:40:11.980
 Ja, früher hat man das irgendwie, eben zu Zeiten, als es noch nicht viel CSS gab und alles eigentlich schwarz-weiß war, hat man irgendwie immer geguckt, dass die Links schön aussehen.

00:40:11.980 --> 00:40:12.680
 Das war so das Ding.

00:40:12.680 --> 00:40:15.680
 Aber heute, ja, Visited eigentlich tatsächlich kaum noch.

00:40:16.120 --> 00:40:19.360
 Ja, und Active, finde ich, wird auch viel zu selten verwendet.

00:40:19.360 --> 00:40:25.940
 Also Visited, ich weiß nicht, ob es jeder weiß, ich erkläre es nochmal kurz, Visited sind Links, auf denen ich schon mal war, also die ich irgendwie schon mal geklickt habe.

00:40:26.200 --> 00:40:35.680
 Aber ich glaube, das wird tatsächlich auch gemacht, ich muss gar nicht auf den Link selbst geklickt haben, sondern ich muss nur das in meinem Browser-Verlauf drin haben, dass ich da schon mal drauf war auf der Seite.

00:40:36.120 --> 00:40:40.620
 Und Active ist genau der Zustand in dem Augenblick, wo ich gerade die Maustaste runterklicke.

00:40:40.620 --> 00:40:54.260
 Das ist auch was, was ich finde, was viel zu selten gemacht wird, weil damit, ich finde, es macht einem ein gutes Gefühl, wenn man gerade sieht, ich klicke da jetzt gerade drauf, der Button wird gerade reingedrückt, der Link wird irgendwie gerade, der verändert sich, weil ich gerade drauf drücke.

00:40:54.740 --> 00:40:59.160
 Das hat Facebook in seinem Redesign, was jetzt gerade ganz neu ist, irgendwie auch ganz nett gemacht.

00:40:59.160 --> 00:41:03.700
 Leider nicht an allen Stellen, man sieht schon, dass da viele Teams am gleichen Interface arbeiten.

00:41:03.700 --> 00:41:11.480
 Ist leider nicht ganz konsistent, aber ich finde es cool, weil da drückt sich, glaube ich, der Hintergrund von dem Button.

00:41:11.580 --> 00:41:14.740
 Ich muss gerade noch mal kurz gucken, bevor ich jetzt Quatsch erzähle.

00:41:14.740 --> 00:41:22.620
 Ja, also während du guckst, vielleicht noch ein kurzer Einschub, weil du gerade gesagt hast, Webseiten ohne CSS gibt es nicht mehr.

00:41:22.620 --> 00:41:33.880
 Man kann in Firefox zumindest, wenn man auf Alt klickt, dann kommt dieses Menü wieder, Datei bearbeiten Ansicht, was ja jetzt standardmäßig versteckt ist, kann man auf Ansicht, Webseitenstil, kein Stil klicken.

00:41:33.880 --> 00:41:38.300
 Und dann sieht man die Webseite tatsächlich so, wie Gott sie schuf, ohne CSS.

00:41:38.300 --> 00:41:46.980
 Und ich mache das tatsächlich ganz gerne, wenn ich was komplett neu entwickle, dass ich mir die Seite in dem Zustand mal anschaue.

00:41:46.980 --> 00:41:53.500
 Und das hat jetzt nicht mit Accessibility unbedingt was zu tun, sondern eigentlich eher so in Richtung SEO.

00:41:53.500 --> 00:42:01.480
 Man sieht da, wie das Dokument aufgebaut ist und sieht, ob man semantisch das Ganze sinnvoll strukturiert hat.

00:42:01.480 --> 00:42:11.520
 Und das schadet auf jeden Fall nicht, das mal so zu sehen, wie es zum Beispiel auch irgendwelche Crawler oder irgendwelche anderen Clients, die nur Textbasiert sind, wie die das sehen.

00:42:11.520 --> 00:42:14.420
 Finde ich immer ganz nett, das mal so anzuschauen.

00:42:14.420 --> 00:42:19.820
 Gibt es wahrscheinlich auch in Chrome, den habe ich jetzt gerade nicht offen, kann ich nicht gucken, aber bin ich mir sicher, dass es da auch funktioniert.

00:42:19.820 --> 00:42:23.500
 Ja, du hast mir jetzt quasi schon was vorbeggenommen, aber das macht nichts.

00:42:23.500 --> 00:42:27.660
 Es kommt nämlich am Ende tatsächlich nochmal genau der Tipp, also von wegen nur SEO.

00:42:27.660 --> 00:42:29.720
 Nein, dass es für viele Sachen ist, kann es gut sein.

00:42:30.060 --> 00:42:34.840
 Was ich jetzt gerade nachgeschaut habe, ist, ich weiß nicht, ob das jeder mitbekommen hat, viele mögen ja auch Facebook nicht.

00:42:34.840 --> 00:42:45.440
 Ich mag es eigentlich auch nicht mehr, aber ich finde ganz interessant gerade, was die so layoutmäßig so machen, weil die haben jetzt gerade ein Redesign, zumindest die Desktop-App oder die Desktop-Web-App wurde redesigned.

00:42:46.380 --> 00:42:51.120
 Und da haben die das so gemacht mit dem Active-Status.

00:42:51.240 --> 00:43:13.260
 Also der Klassiker ist, ich habe da ganz viele Icons, auf die ich klicken kann und die kriegen eine Background-Color oder die werden gehighlighted, wenn ich drüber hover und wenn ich draufklicke, dann wird die Farbe geändert und der Hintergrundfarbe, der Hintergrundrahmen, wenn man so möchte, das sind oft Kreise, nicht alle.

00:43:13.260 --> 00:43:21.920
 Manche sind rechteckig, manche sind Kreise, aber jetzt in dem Fall habe ich einen Kreis, also Icon mit Kreis förmig im Hintergrund, wird dann ein bisschen kleiner.

00:43:21.920 --> 00:43:26.380
 Also die Farbe ändert sich und wird ein bisschen kleiner und das gibt einem so ein Gefühl, als ob man jetzt was reingedrückt hat.

00:43:26.720 --> 00:43:35.940
 Und das finde ich eigentlich immer ein ganz, ganz gutes Gefühl, wobei das jetzt, ich weiß nicht, hat das jetzt was mit Accessibility zu tun, kann man jetzt drüber streiten, aber wir sind ja gerade ein bisschen ausgeschweift.

00:43:35.940 --> 00:43:47.080
 Wir waren ja eigentlich bei Farben gerade und wenn wir schon bei Farben sind, dann gibt es noch einen weiteren Punkt zu den Farben, nämlich verständlich ohne Farbe.

00:43:47.720 --> 00:43:53.880
 Also erst habe ich gesagt, ihr achtet auf eure Farben, also achtet auf eure Kontraste, wobei das nicht unbedingt Farben sein muss, kann ja auch schwarz-weiß sein.

00:43:53.880 --> 00:43:57.720
 Jetzt sage ich, es soll aber auch ohne Farbe verständlich sein.

00:43:57.720 --> 00:44:06.140
 Um da mal ein Beispiel zu bringen, ist, es gibt oft Seiten, die Fehlermeldungen anzeigen, beispielsweise bei Formularen.

00:44:06.140 --> 00:44:15.400
 Ich habe irgendwie was Falsches eingetippt oder ich habe ein Feld leer gelassen oder da ist irgendwie, keine Ahnung, ich habe Penis reingeschrieben, es hätte aber Vagina drinstehen müssen oder so.

00:44:16.400 --> 00:44:20.220
 Genau, und dann schicke ich das ab und dann sagt mir das Map, du hast hier einen Fehler.

00:44:20.220 --> 00:44:38.280
 Wenn ich jetzt zum Beispiel hingehe und dann das Feld einfach nur rot um Rande zum Beispiel, also das Eingabefeld, dann kann unter Umständen sein, dass ich das nicht erkenne, ich als jemand mit Rot-Grün-Schwäche, also als Rot-Grün-Schwächling habe ich jetzt gerade mal erfunden,

00:44:40.220 --> 00:44:55.820
 dass ich das nicht erkenne, weil, naja, Rot um Randen, vielleicht ist das gerade das Rot, das ich irgendwie schlecht sehe und dann fällt mir gar nicht auf, dass da irgendwie jetzt ein Fehler ist oder, naja, steht irgendwo, es ist ein Fehler aufgetreten, aber ich sehe dann gar nicht unter Umständen, wo.

00:44:56.540 --> 00:45:13.880
 In dem Beispiel würde sich dann anbieten, vielleicht noch ein kleines Achtung-Icon oder sowas nebendran zu tun, damit ich auf jeden Fall sehe, wo jetzt irgendwie gerade ein Problem vorliegt, weil das funktioniert im besten Falle, also das sollte natürlich auch rot sein, aber das funktioniert auch, wenn es nicht rot ist, weil ich sehe, was da passiert.

00:45:14.980 --> 00:45:28.320
 Genau, das ist eine Sache, das ist total eigennützig für mich, weil ich tatsächlich schon öfter an den Fall gestoßen bin, dass das Farbsehen in einer gewissen Qualität vorausgesetzt wird, die ich dann nicht liefern kann.

00:45:28.320 --> 00:45:36.480
 Wobei ich glaube, meine Rot-Grün-Schwäche ist noch relativ schwach im Vergleich zu dem, was für andere Farbfehlsichtigkeiten es noch so gibt.

00:45:36.480 --> 00:45:47.740
 Also da gibt es einiges und es gibt da, soweit ich weiß, auch interessante Tools mittlerweile in Browsern integriert, wo man sich die Seite dann entsprechend bestimmter Farbfehlsichtigkeiten anzeigen lassen kann.

00:45:47.740 --> 00:45:48.640
 Es gibt da auch Tools.

00:45:48.640 --> 00:46:03.000
 Also das ist auf jeden Fall echt interessant, weil man sich da als durchschnittlich Sehender natürlich überhaupt gar keine Gedanken drüber macht und ich meine, kann man jetzt auch niemandem vorwerfen, weil klar, man weiß ja gar nicht, was für Betroffene überhaupt wichtig ist.

00:46:03.000 --> 00:46:10.840
 Also das jetzt, wie du das jetzt erzählst, auf Basis deiner Rot-Grün-Schwäche ist schon interessant, weil man sich da vorher überhaupt keine Gedanken drüber macht.

00:46:10.840 --> 00:46:24.500
 Ja, ich biete mich da auch immer an. Also ich bin auch immer der, der meckert, wenn er was bei anderen sieht, was sie gebaut haben, wo ich dann sage, naja, okay, ich kann das jetzt an der Stelle, wie soll das denn funktionieren?

00:46:24.500 --> 00:46:30.580
 Und ich kann es nachvollziehen, dass es sehr schwer ist, sich in was reinzuversetzen, ein Problem, was man selbst nicht hat.

00:46:30.580 --> 00:46:37.440
 Deswegen, also falls jemand seine Seite mal auf Rot-Grün-Schwäche testen will, da stelle ich mich auch gern zur Verfügung.

00:46:37.440 --> 00:46:39.580
 Kann man mich gerne irgendwie bei Twitter oder so anschreiben.

00:46:39.580 --> 00:46:51.540
 Genau, nächstes Thema, falls du dazu keine Frage mehr hast, gehe ich weiter zu, naja, ich habe auf Englisch write descriptive links.

00:46:53.100 --> 00:46:58.560
 Link-Texte, die erklärend sind zum Inhalt, versuche ich das jetzt mal so zu übersetzen.

00:46:58.560 --> 00:47:01.100
 Was ist damit genau gemeint?

00:47:01.100 --> 00:47:12.800
 Es hilft einem zum Beispiel, wenn ich jetzt im Screenreader unterwegs bin, gar nichts, wenn ein Link heißt, klick hier oder mehr oder so.

00:47:12.960 --> 00:47:25.280
 Vor allem, wenn dieser Link mehrfach auf der Seite auftaucht, also ich habe zum Beispiel eine News-Seite mit ganz vielen angerissenen News-Artikeln, also kurzen Anreißern, wo hinter jedem steht mehr als Link-Text.

00:47:25.780 --> 00:47:28.160
 Dann, naja, das sagt mir erst mal gar nichts.

00:47:28.160 --> 00:47:37.420
 Also man sollte so multiple, also mehrfach denselben Link-Text auf der Seite sollte man vermeiden und man sollte im besten Falle sagen, was erwartet mich denn jetzt ganz genau?

00:47:37.700 --> 00:47:44.220
 Also ich kann natürlich einen mehr Link anbieten, wenn er sich aus dem visuellen Kontext erschließt, ist das auch für den Sehenden okay.

00:47:45.000 --> 00:47:55.600
 Aber ich sollte vielleicht noch einen unsichtbaren Text, also einen für die Sehenden unsichtbaren Text mit reinpacken, der dann sagt, naja, wo gehe ich denn jetzt genau hin?

00:47:55.600 --> 00:48:04.180
 Also ich erinnere mich auch, dass ich mal sowas in eine Mail-Liste eingebaut habe von einer Mail-Applikation, wo dann der Betreff nochmal vorgelesen wurde.

00:48:04.180 --> 00:48:09.380
 Also zur Mail-Doppelpunkt-Betreff, dann war das irgendwie eindeutig.

00:48:09.380 --> 00:48:11.960
 Also überlegt euch genau, was ihr in eure Links reinschreibt.

00:48:12.300 --> 00:48:20.380
 Also im Falle von Artikeln, was du jetzt gesagt hast, wäre dann zum Beispiel die Überschrift nochmal aufgreifen und sagen, den Artikel so und so weiterlesen zum Beispiel.

00:48:20.380 --> 00:48:21.620
 Genau, genau.

00:48:21.620 --> 00:48:35.520
 Und wenn ich nicht komplett falsch liege, dann liegt das daran, weil Screenreader-User oftmals gar nicht den kompletten Content durchnavigieren, sondern wirklich von Link zu Link zum Beispiel springen, um zu gucken, wo man hin, wo man landen kann. Ist das richtig?

00:48:35.520 --> 00:48:41.340
 Korrekt, also es gibt da verschiedene Arten, rumzuspringen, rumzunavigieren im Content.

00:48:42.100 --> 00:48:45.280
 Also ich meine, der Klassiker ist, das kannst du auch mit deiner Tastatur ganz normal machen.

00:48:45.280 --> 00:48:51.840
 Wenn du Tab drückst, dann siehst du schon, wo du hinspringst, nämlich zu allen interaktiven Feldern, was in dem Fall auch Links und Buttons sind.

00:48:51.840 --> 00:48:53.000
 Ja, also genau.

00:48:54.060 --> 00:48:55.120
 Da siehst du dann auch schon.

00:48:55.120 --> 00:48:59.440
 Aber nur dann, wenn entsprechend auch ein Style gesetzt ist, das ist wieder genau der Knackpunkt.

00:48:59.440 --> 00:49:07.380
 Genau, und nur dann kann ich es auch sehen. Also als Sehender hilft mir das auch nur, wenn da entsprechend der Fokus-Style gesetzt ist. Aber da sehe ich dann auch schon, wie ich da rumspringe.

00:49:07.520 --> 00:49:16.840
 Also Screenreader-Nutzer oder allgemein die Screenreader bieten normalerweise auch noch weitere Möglichkeiten zum Springen auf den Seiten an.

00:49:16.840 --> 00:49:24.820
 Also ich bin mir jetzt nicht sicher, ob ich alle weiß. Ich kenne aber noch eine weitere und zwar, was auch beliebt ist, ist zu Überschriften zu springen.

00:49:25.160 --> 00:49:34.740
 Also ich kann, also ich glaube, da kann man dann sogar auch auswählen, nur zu Überschriften, erster Ebene, zweite Ebene und so weiter. Aber von Headline zu Headline springen ist auch beliebt.

00:49:34.740 --> 00:49:37.460
 Und dafür gibt es Shortcuts, die die Screenreader bereitstellen.

00:49:37.460 --> 00:49:43.020
 Genau, also es gibt da verschiedene Möglichkeiten oder es gibt sehr viele Möglichkeiten, wie navigiert wird.

00:49:43.020 --> 00:49:49.080
 Von daher ist erklärende Texte immer, sind immer eine gute Idee.

00:49:49.080 --> 00:49:54.440
 Also ich glaube, also die meisten Sachen, die ich hier aufgreife, sind für alle eine gute Idee und nicht nur für die einzelne Gruppe.

00:49:54.560 --> 00:49:58.780
 Weil ich finde ja, Accessibility ist in den meisten Fällen auch einfach Usability.

00:49:58.780 --> 00:50:19.760
 Also es geht nicht nur darum, bestimmte Leute nicht auszuschließen, sondern das ist zwar auch sehr wichtig, aber der normale Nutzer in Anführungsstrichen, der ohne Einschränkungen irgendwie was benutzt, hat normalerweise in vielen Fällen auch was davon, wenn diese Best Practices umgesetzt werden.

00:50:22.220 --> 00:50:28.440
 Genau, der nächste Punkt, Video und Audio sollten Texte haben.

00:50:29.380 --> 00:50:38.400
 Also man sollte im besten Falle sollte es für Video und Audio Textdescriptions geben.

00:50:38.400 --> 00:50:40.220
 Jetzt fällt mir gerade das Wort nicht ein, Untertitel.

00:50:40.220 --> 00:50:40.700
 Genau.

00:50:40.700 --> 00:50:45.460
 Das gibt es bei Video, wenn ich es richtig weiß, bei HTML Video gibt es dafür sogar einen Standard.

00:50:45.460 --> 00:50:49.600
 Das habe ich jetzt selbst noch nie implementiert, aber dafür gibt es was, auch mit Timecodes.

00:50:50.540 --> 00:50:52.660
 Was wir jetzt nicht machen...

00:50:52.660 --> 00:50:53.740
 TTML glaube ich, oder?

00:50:53.740 --> 00:50:54.080
 Ja.

00:50:54.080 --> 00:50:55.920
 Moment, was hast du gesagt nochmal?

00:50:55.920 --> 00:50:57.080
 TTML.

00:50:57.080 --> 00:50:58.700
 Ja, ich glaube, das war es.

00:50:58.700 --> 00:51:01.740
 Habe ich im Zusammenhang mit Untertiteln schon mal gehört.

00:51:01.740 --> 00:51:04.580
 Genau, es gibt auf jeden Fall einen Standard, wie gesagt, implementiert habe ich den noch nicht.

00:51:04.580 --> 00:51:17.600
 Ist auf jeden Fall eine gute Sache und zum Beispiel so Plattformen wie YouTube, die bieten ja mittlerweile auch schon Auto-Captioning an, also die versuchen automatisch herauszulesen.

00:51:17.700 --> 00:51:22.760
 Aber wie gesagt, dafür braucht man dann auch wieder einen großen Machine-Learning-Algorithmus, der irgendwie den Text erkennt.

00:51:22.760 --> 00:51:25.320
 Aber sowas ist, glaube ich, mittlerweile sogar erschwinglich.

00:51:25.320 --> 00:51:27.800
 Gibt es auch für Podcasts, habe ich schon gehört.

00:51:27.800 --> 00:51:33.000
 Ausprobiert auch noch nicht, aber ist auf jeden Fall eine gute Ergänzung.

00:51:33.000 --> 00:51:39.920
 Also was dahinter steckt ist, der Content sollte halt von möglichst jedem begriffen werden können.

00:51:39.920 --> 00:51:45.360
 Das heißt, jemand, der gehörlos ist, könnte dann in dem Fall auch von dem Content profitieren.

00:51:46.060 --> 00:51:47.640
 Also gerade von Audio-Inhalten.

00:51:47.640 --> 00:51:55.460
 Ein Punkt, der mir am Herzen liegt, weil ich da schon oft Grabenkämpfe ausführen musste, ist Pinch und Zoom.

00:51:55.460 --> 00:52:04.640
 Also die Zoom-Funktionalität auf Seiten wird gerne mal ausgeschaltet, um nervige Browser-Bugs auf mobilen Geräten zu umgehen.

00:52:04.640 --> 00:52:14.900
 Weil man da immer mal wieder, also es gab schon einige Browser-Bugs in der Vergangenheit oder Ungenauigkeiten, Unschärfen, die man mit Zoom-Deaktivieren los wurde.

00:52:15.320 --> 00:52:22.560
 Aber ich kann davon auf jeden Fall nur abraten, weil jeder nimmt das Web auf eine andere Weise wahr.

00:52:22.560 --> 00:52:37.500
 Wenn ich die Möglichkeit jemandem nehme, eine Seite zu zoomen und damit meine ich jetzt explizit mobile Geräte, also die, wo ich sowieso, naja, die Pinch- und Zoom-Geste irgendwie so was ganz Normales ist.

00:52:37.500 --> 00:52:39.620
 Da sollte das auf jeden Fall funktionieren.

00:52:41.540 --> 00:52:42.740
 Ich bin mir jetzt nicht sicher.

00:52:42.740 --> 00:52:45.140
 Habe ich gerade mal spaßeshalber nebenher gecheckt.

00:52:45.140 --> 00:52:47.980
 Auf unserer Seite haben wir tatsächlich nicht deaktiviert, zum Glück.

00:52:47.980 --> 00:52:49.580
 Also man kann da lustig reinzoomen.

00:52:49.580 --> 00:52:53.600
 Aber ich erinnere mich auch tatsächlich selber, dass ich sowas schon eingesetzt habe.

00:52:53.600 --> 00:52:58.160
 Ist allerdings jetzt auch schon einige Jahre her, dass das nötig war.

00:52:58.160 --> 00:53:01.560
 Da war das mit den Mobilgeräten auch noch nicht so weit verbreitet.

00:53:01.780 --> 00:53:03.820
 Und da gab es tatsächlich noch diverse Bugs.

00:53:03.820 --> 00:53:10.660
 Aber ich würde fast behaupten, mag natürlich sein, dass ich da falsch liege, dass man so einen Hack heute gar nicht mehr braucht.

00:53:11.440 --> 00:53:14.280
 Und wenn, dann macht man was falsch, dann sollte man überdenken, was man da gerade tut.

00:53:14.280 --> 00:53:15.360
 Ja, ich glaube auch.

00:53:15.360 --> 00:53:19.180
 Also ich habe jetzt in letzter Zeit das auch nicht mehr so häufig gesehen.

00:53:19.180 --> 00:53:22.300
 Immer dann, wenn ich es gebraucht habe, hat es funktioniert.

00:53:22.300 --> 00:53:25.580
 Ich hoffe, dass sich das jetzt vielleicht auch mal durchgesetzt hat.

00:53:25.580 --> 00:53:28.020
 Wobei ich da vielleicht noch eine Einschränkung bringen möchte.

00:53:28.020 --> 00:53:32.640
 Also jetzt aus heutiger Sicht, wenn man jetzt eine Web-App baut, die sich so verhalten soll wie eine native App.

00:53:32.640 --> 00:53:36.660
 Also die Progressive Web-App, quasi die Twitter-Web-App.

00:53:36.740 --> 00:53:37.600
 Da kann ich nicht zoomen.

00:53:37.600 --> 00:53:39.220
 Und das ist vielleicht sogar auch okay so.

00:53:39.220 --> 00:53:45.740
 Dann möchte, dann sollte die aber so gebaut sein, beziehungsweise, ja, sollte der Browser, den ich dafür verwende, so sein,

00:53:45.740 --> 00:53:54.680
 dass wenn ich die Systemschrift anpasse in der Größe oder ich glaube in Firefox auf Android kann ich auch im Browser die Schriftgröße anpassen,

00:53:54.680 --> 00:53:59.060
 dann sollte die sich da in jedem Falle auch vergrößern oder verkleinern.

00:53:59.620 --> 00:54:12.420
 Also die Möglichkeit gibt es auch, weil ich meine, nicht jede App kann es oder normalerweise das Verhalten von Apps, von native Apps auf dem Mobilgerät ist ja nicht, dass ich da zoomen kann.

00:54:12.420 --> 00:54:19.220
 Also nur bestimmte Sachen, also beispielsweise Bilder oder so, wenn ich die da habe, aber alles andere, das Interface lässt sich ja normalerweise nicht zoomen.

00:54:19.660 --> 00:54:27.260
 Aber dann muss irgendwie die Möglichkeit gegeben sein, dass ich die Schriftgröße über das System verändern kann, was bei native Apps normalerweise, wenn die vernünftig gebaut sind, der Fall ist.

00:54:27.260 --> 00:54:32.740
 Und wie gesagt, in Firefox für Android, das ist mein Hauptbrowser, mein mobiler, da geht das auch.

00:54:32.740 --> 00:54:35.940
 Also da kann ich auch die Schriftgröße verändern und dann verändert sich es auf der Seite.

00:54:35.940 --> 00:54:38.980
 Also das sollte ich auf keinen Fall irgendwie unterbinden, dass das geht.

00:54:39.800 --> 00:54:45.800
 Also falls es wirklich sehr App-mäßig sein sollte, dann auf jeden Fall die Möglichkeit zulassen, dass der Text vergrößert wird.

00:54:45.800 --> 00:54:52.400
 Genau, dann kommen wir auch schon zum letzten Punkt von den Sachen, die ich empfehle.

00:54:53.580 --> 00:54:56.100
 Ich habe jetzt viele, viele Dinge genannt.

00:54:56.100 --> 00:55:08.460
 Manchmal kommt man an den Punkt, wo man nicht alles so umsetzen kann, wie es die Best Practices sind, weil ich habe hier irgendwie ein Framework vorgegeben und ich darf da die Elemente nicht verändern.

00:55:08.460 --> 00:55:16.000
 Und es müssen jetzt alles Spans sein und ich darf keine Ahnung, keine Links nehmen oder keine Buttons oder keine Headlines oder irgendwie sowas.

00:55:17.420 --> 00:55:29.400
 Für den Fall und eigentlich auch nur für den Fall gibt es dann, oder in den meisten Fällen nur für den Fall, gibt es Y-Area, also Web Accessibility Initiative, Accessible Rich Internet Applications.

00:55:29.400 --> 00:55:43.980
 Da gibt es eine Menge Standards, beziehungsweise hauptsächlich funktioniert das in Attributen und teilweise auch ein bisschen mit JavaScript, womit ich dann den Elementen wieder Semantik geben kann, auch wenn sie diese quasi verloren haben.

00:55:44.600 --> 00:55:51.860
 Also ich kann damit zum Beispiel mir ein Konstrukt bauen aus Spans, das wieder so funktioniert oder sich so verhält tatsächlich wie ein Button.

00:55:51.860 --> 00:55:56.460
 Also oder das zumindest vom Screenreader so erkannt wird wie ein Button.

00:55:56.460 --> 00:56:03.360
 Ich kann damit einem Diff eine Headline-Ebene geben oder sowas, wenn das unbedingt sein muss.

00:56:03.360 --> 00:56:13.100
 Aber eigentlich sollte man das nur im allerschlimmsten Fall, wenn ich gar nichts an der HTML-Semantik, in der Original-HTML-Semantik verändern darf, einsetzen.

00:56:14.240 --> 00:56:18.600
 Aber da gibt es einige interessante Sachen, die man damit machen kann.

00:56:18.600 --> 00:56:21.620
 Da komme ich vielleicht auch noch kurz auf den Endgegner zu sprechen.

00:56:21.620 --> 00:56:30.480
 So das Schwierigste, was ich mal versucht habe, Screenreader Accessible zu machen, war ein Suchfeld mit Autocomplete und Suggest.

00:56:32.240 --> 00:56:36.360
 Wer dafür Best Practices hat, der darf sich auch gerne mal bei mir melden.

00:56:36.360 --> 00:56:44.400
 Ich habe mir die Zähne daran ausgebissen, es hat dann am Ende geklappt, sodass dann auch irgendwie halbwegs vernünftig was vorgelesen wurde und auch die Vorschläge da waren.

00:56:44.400 --> 00:56:46.440
 Aber das fand ich dann schon relativ schwierig.

00:56:46.940 --> 00:56:53.480
 Da kommt man dann auch um ARIA-Attribute nicht drumherum, wenn man das vernünftig machen will.

00:56:54.780 --> 00:56:56.720
 Zumindest bin ich nicht drumherum gekommen.

00:56:56.720 --> 00:56:57.920
 Vielleicht gibt es einen coolen Weg.

00:56:57.920 --> 00:56:59.520
 Dann bitte auch mal in die Kommentare.

00:57:01.220 --> 00:57:06.680
 Genau, so und dann bin ich mit den Best Practices, die man machen soll, schon am Ende.

00:57:06.680 --> 00:57:15.020
 Würde jetzt aber noch ein paar Tests, die man machen kann, um seine Seite zu testen, noch erzählen.

00:57:15.020 --> 00:57:19.100
 Und zwar der erste ist, also so Dinge, die man einfach mal ausprobieren soll.

00:57:19.100 --> 00:57:23.660
 Der erste ist, einfach mal die Seite auf 200% zoomen im Browser und gucken, was passiert.

00:57:25.040 --> 00:57:30.560
 In vielen Fällen funktioniert es, je nachdem, wie man sein CSS verwendet hat.

00:57:30.560 --> 00:57:36.800
 Falls da was kaputt geht oder irgendwelche Sachen dann unsichtbar werden, dann sollte man vielleicht da an der Stelle nochmal nachjustieren.

00:57:36.800 --> 00:57:43.840
 Der nächste ist Check Keyboard Navigation, also einfach mal mit der Tastatur versuchen zu, nur mit der Tastatur versuchen zu navigieren.

00:57:43.840 --> 00:57:48.260
 Die Maus einfach mal links liegen lassen oder rechts, je nachdem, ob ihr Links- oder Rechtshänder seid.

00:57:48.260 --> 00:57:53.200
 Einfach mal nur versuchen, mit der Tastatur durch eure Seite zu navigieren und zu schauen, wie kommt ihr zurecht.

00:57:53.200 --> 00:58:02.000
 Seht ihr alles, seht ihr den Fokus, seht ihr, was gerade aktiv ist, könnt ihr alles, könnt ihr jedes Menü zum Beispiel auch mit Enter oder mit Leertaste öffnen.

00:58:02.000 --> 00:58:07.280
 Funktioniert die Escape-Taste, kann man damit tatsächlich auch geöffnete Dinge schließen und so weiter.

00:58:07.280 --> 00:58:13.980
 Das nächste, das ist hart, das ist anstrengend und das habe ich auch mal versucht für einen Tag durchzuhalten.

00:58:13.980 --> 00:58:19.760
 Ich habe es, glaube ich, nicht ganz geschafft, nämlich einen Screenreader benutzen und den Monitor dabei tatsächlich ausschalten.

00:58:20.180 --> 00:58:29.900
 Weil nur, wenn ich nicht sehe und nur höre, kann ich auch wirklich merken, funktioniert meine Seite jetzt tatsächlich mit Screenreadern oder nicht.

00:58:29.900 --> 00:58:36.100
 Ist jede Funktion, die ich irgendwie haben will, auch, wird die mir auch vernünftig vorgelesen, sodass ich sie benutzen kann.

00:58:36.780 --> 00:58:44.520
 Da gibt es zum Beispiel, Voice-Over ist, glaube ich, auf Apple-Geräten, ich glaube, auf dem Mac ist es auch, Voice-Over ist einfach schon mit dabei.

00:58:44.520 --> 00:58:52.240
 Windows hat in den aktuellen Windows 10-Versionen auch schon einen Screenreader mit eingebaut.

00:58:52.240 --> 00:58:57.660
 Der heißt auf Deutsch, wenn man Windows auf Deutsch hat, Sprachausgabe, glaube ich, einfach, kann man ganz einfach anschalten.

00:58:58.240 --> 00:59:07.400
 Es gibt natürlich auch noch, was viele benutzen, NVDA, kostet nichts, ist Open-Source, soweit ich weiß, könnt ihr euch installieren, ist für Windows.

00:59:07.400 --> 00:59:10.760
 Auf Android ist auch schon was mit eingebaut, da heißt das...

00:59:10.760 --> 00:59:12.800
 Wollte ich gerade sagen, Talkback auf Android.

00:59:12.800 --> 00:59:13.960
 Talkback, genau, danke.

00:59:13.960 --> 00:59:18.640
 Genau, habe ich nämlich, ich habe gerade kurz mal nebenher gegoogelt, weil ich mir nicht mehr sicher war, wie man es aktiviert.

00:59:18.640 --> 00:59:24.360
 Beide Lautstärketasten gleichzeitig drücken für drei Sekunden, dann wird es automatisch angeschaltet.

00:59:24.360 --> 00:59:26.920
 Oder man kann es natürlich auch in den Geräteeinstellungen aktivieren.

00:59:26.920 --> 00:59:32.240
 Habe ich tatsächlich auch schon gemacht, um es zu testen, weil ich wollte nämlich gerade sagen, wenn man jetzt irgendwie die Ausrede hat,

00:59:32.240 --> 00:59:36.280
 dann muss ich da erst Software installieren und einrichten und das dauert viel zu lang.

00:59:36.760 --> 00:59:45.380
 Also, wenn man ein Android-Gerät hat oder wie du auch gerade gesagt hast, auch iOS-Geräte, es gibt eigentlich keine Ausrede, das nicht mal zumindest zu probieren, spaßeshalber.

00:59:45.380 --> 00:59:49.000
 Ja, dabei noch eine kleine Warnung.

00:59:49.000 --> 00:59:56.560
 In einigen Fällen, also gerade bei Touch-Geräten, verändert sich die Bedienung durch Anschalten des Screen-Readers häufig auch.

00:59:56.560 --> 01:00:03.940
 Da muss man dann, also der kleine Tipp, falls Scrollen nicht mehr geht, versucht es dann mal mit zwei Fingern.

01:00:03.940 --> 01:00:07.580
 Falls irgendwas antippen nicht mehr geht, versucht es mal mit einem Doppeltab.

01:00:07.580 --> 01:00:17.840
 Auf jeden Fall, wie gesagt, die Bedienung kann sich ein bisschen verändern dadurch, weil, naja, wenn ich zum Beispiel mit dem Finger über das Display gehe,

01:00:17.840 --> 01:00:23.300
 möchte ich damit nicht gleich dann Sachen aktivieren, weil eventuell nutze ich den Screen-Reader ja, weil ich gar nichts sehen kann.

01:00:23.300 --> 01:00:27.520
 Also muss ich erst mal vorgelesen bekommen, was ist denn an der Stelle irgendwie gerade unten drunter.

01:00:27.920 --> 01:00:29.520
 Also deswegen verändert sich da die Bedienung.

01:00:29.520 --> 01:00:36.800
 Was ich sehr interessant finde, ich weiß nicht genau, wie das bei iOS ist, aber bei Android, glaube ich, gibt es auch einen Sound für Scrollen.

01:00:37.700 --> 01:00:49.440
 Also der mir wirklich in Form von einem Ton, der immer höher oder tiefer wird, sagt, wie weit bin ich denn jetzt schon Richtung Ende gescrollt?

01:00:49.440 --> 01:00:51.760
 Hast du das gerade an bei dir, Konstantin?

01:00:51.760 --> 01:00:52.180
 Kannst du das mal kurz testen?

01:00:52.180 --> 01:00:55.820
 Nee, ich habe das nicht angemacht, aber ich, ja, ich habe das auch schon gehört, ja.

01:00:55.820 --> 01:01:06.440
 Also das ist wirklich verrückt, da wünsche ich mir manchmal, ich wüsste das, ich hätte das auch so, weil, weil ich dann einfach hören kann, ohne hinzugucken, wie weit kann ich jetzt noch runterscrollen.

01:01:06.440 --> 01:01:09.420
 Das ist natürlich bei Infinite Scrollen ein bisschen witzlos, aber ja.

01:01:09.420 --> 01:01:12.160
 Genau, so.

01:01:12.160 --> 01:01:17.080
 Ich habe es jetzt gerade mal angemacht, vielleicht kann ich es kurz demonstrieren.

01:01:18.780 --> 01:01:19.940
 Man hört es aber, glaube ich, nicht.

01:01:19.940 --> 01:01:25.500
 Nee, schade, lässt sich jetzt nicht so wirklich demonstrieren, aber wir glauben es dir jetzt alle.

01:01:25.500 --> 01:01:25.820
 Ja, genau.

01:01:25.820 --> 01:01:32.760
 Einfach in den Einstellungen mal anschalten und dann hilflos sich melden, weil man nicht mehr weiß, wie man es wieder ausschalten kann.

01:01:32.760 --> 01:01:40.440
 Genau, nächster Punkt und vorletzter Punkt damit zum Testen ist, in Chrome gibt es schöne Accessibility Audits.

01:01:40.440 --> 01:01:45.760
 In Chrome generell, was ich empfehlen kann, ist da in den DevTools der Audit-Tab.

01:01:45.840 --> 01:01:52.800
 Da kannst du auch noch ganz viele andere Sachen testen, also Performance, Progressive Web App und keine Ahnung und so weiter.

01:01:54.240 --> 01:02:07.320
 Aber eben auch Accessibility, da steht auch dann schon direkt dabei, nur weil du jetzt in Chrome im Accessibility Audit 100 Punkte hast, heißt das noch lange nicht, dass deine Seite accessible ist.

01:02:07.320 --> 01:02:09.840
 Man kann da auch ganz gut und clever drum herum arbeiten.

01:02:10.900 --> 01:02:15.540
 Aber es gibt einem schon eine ganz gute Vorstellung davon, was man denn da eigentlich gemacht hat.

01:02:15.540 --> 01:02:24.420
 Also das erinnert, das sagt einem zum Beispiel, du hast hier jetzt mehrfach den gleichen Link-Text verwendet oder dein Kontrast ist hier an der Stelle nicht so gut.

01:02:24.420 --> 01:02:29.020
 Also diesen Audit über eine Seite drüber laufen zu lassen, ist in jedem Fall eine gute Sache.

01:02:29.020 --> 01:02:35.700
 Und es ist einfach nur ein Häkchen mehr bei den anderen Audits, die man sowieso drüber laufen lassen sollte, um zu gucken, ob die Performance passt oder SEO oder sowas.

01:02:37.300 --> 01:02:44.080
 Auf jeden Fall eine gute Idee, das mal zu machen und das kostet eigentlich nichts, außer irgendwie eine halbe Minute Zeit.

01:02:44.080 --> 01:02:50.740
 Und der letzte Punkt ist, das hat der Konstantin vorhin schon vorweggenommen, einfach mal CSS ausschalten.

01:02:51.920 --> 01:02:55.640
 Einfach mal CSS ausschalten und anschauen, wie sieht denn die Seite dann aus?

01:02:55.640 --> 01:02:58.460
 Gibt die Struktur noch Sinn, die ich da habe?

01:02:58.460 --> 01:03:02.700
 Kann ich irgendwie, ist irgendwie noch alles da, was da sein soll?

01:03:02.700 --> 01:03:04.840
 Ist die Reihenfolge immer noch gut?

01:03:04.840 --> 01:03:07.520
 Könnte ich das im Notfall so immer noch benutzen?

01:03:07.520 --> 01:03:12.960
 Ich finde das ein ganz, ganz guter Test, um rauszufinden, habe ich denn jetzt hier kompletten Bullshit gemacht?

01:03:13.140 --> 01:03:18.540
 Ist meine Semantik vielleicht auch irgendwie gut oder habe ich da irgendwie noch Fehler?

01:03:18.540 --> 01:03:25.740
 Habe ich denn die richtigen Elemente verwendet für mein Formular oder ist das dann jetzt irgendwie alles ganz komisch geworden oder so,

01:03:25.740 --> 01:03:31.620
 weil ich irgendwelche komischen Formular-Widgets verwendet habe, wo ich gar nicht genau weiß, was da unten drunter tickt oder so?

01:03:31.960 --> 01:03:35.100
 Also einfach mal CSS ausschalten, das öffnet einem die Augen.

01:03:35.100 --> 01:03:45.300
 Damit bin ich am Ende mit den Tests und wollte noch darauf hinweisen, alles, was ich jetzt heute gesagt habe oder fast alles, was ich gesagt habe,

01:03:45.300 --> 01:03:48.480
 ist auch auf meinem Accessibility-Cheat-Sheet zu finden.

01:03:48.480 --> 01:03:50.780
 Den Link habt ihr dann später in den Shownotes.

01:03:51.860 --> 01:04:00.300
 Das habe ich vor eineinhalb Jahren oder vor knapp zwei Jahren habe ich das mal gemacht, weil ich der Meinung war,

01:04:00.300 --> 01:04:06.760
 naja, so diese Basissachen, die sollte es irgendwie in leicht einfach konsumierbarer Form mal irgendwie geben.

01:04:06.760 --> 01:04:16.620
 War da für mich auch eine schöne Gelegenheit, mal mit CSS-Grid ein bisschen rumzuspielen und mal mit merkwürdigen Einheiten,

01:04:16.620 --> 01:04:18.880
 sowas wie Zentimeter habe ich da verwendet.

01:04:18.880 --> 01:04:21.320
 Also ihr könnt euch auch gerne mal den Code anschauen, den gibt es auch auf GitHub.

01:04:21.320 --> 01:04:25.500
 Ja, das ist so ein bisschen meine Spielwiese gewesen.

01:04:25.500 --> 01:04:29.060
 Das Ding hat auch einen Dark-Mode und ja, einfach mal angucken.

01:04:29.060 --> 01:04:32.460
 Das ist was, was man sich auch schön ausdrucken kann und irgendwie neben dem Rechner hängen kann.

01:04:32.460 --> 01:04:35.100
 Da sind die Sachen in ganz kurz und knapp drauf.

01:04:35.100 --> 01:04:40.020
 Und noch ein bisschen Selbstbeweihräucherung an der Stelle.

01:04:40.020 --> 01:04:45.500
 Das hat damals auch ein bisschen Aufmerksamkeit bekommen über Twitter und das ist auch bei Reddit empfohlen worden.

01:04:45.500 --> 01:04:47.600
 Also gar nicht mal von mir, sondern von anderen Leuten.

01:04:48.000 --> 01:04:49.160
 Da waren ein paar Leute drauf.

01:04:49.160 --> 01:04:51.940
 Ich sage jetzt mal keine Zahlen, aber das haben ein paar Leute gesehen damals.

01:04:51.940 --> 01:04:54.120
 Ja, genau.

01:04:54.120 --> 01:05:00.120
 Also wie gesagt, wenn ihr die ganzen Tipps nochmal zusammengefasst haben wollt, die könnt ihr euch auf dem Cheatsheet anschauen.

01:05:00.120 --> 01:05:04.920
 Das gibt es auf meiner Homepage und das in den Shownotes.

01:05:06.680 --> 01:05:10.960
 Ja, damit bin ich mit meinem Thema am Ende. Hast du noch Fragen, lieber Konstantin?

01:05:11.320 --> 01:05:14.380
 Nee, also Fragen habe ich so direkt jetzt keine mehr dazu.

01:05:14.380 --> 01:05:16.820
 Aber ich fand es sehr interessant, das ganze Thema.

01:05:16.820 --> 01:05:21.220
 Man beschäftigt sich nämlich, wenn man nicht muss, leider auch nicht von sich aus damit.

01:05:21.220 --> 01:05:26.380
 Es ist ja so, dass Behörden-Websites müssen ja gesetzlich accessible sein.

01:05:26.380 --> 01:05:33.280
 Und wenn man jetzt nicht gerade Behörden als Auftraggeber hat, dann wird man nicht dazu gedrängt, sich damit zu beschäftigen.

01:05:33.620 --> 01:05:34.840
 Und das ist eigentlich sehr schade.

01:05:34.840 --> 01:05:47.800
 Also eigentlich sollte man versuchen, sich eben genau diese Basics, das ist jetzt kein Hexenwerk, was wir jetzt heute gelernt haben, genau diese Basics auf jeden Fall mal drauf zu schaffen und zu versuchen, die auch wirklich in jedem Projekt umzusetzen.

01:05:48.060 --> 01:05:50.120
 Egal, ob das jetzt extra bezahlt wird oder nicht.

01:05:50.120 --> 01:06:00.860
 Aber so für die Große, wenn man in die Tiefe gehen möchte und das Ganze richtig gut machen möchte, dann ist, glaube ich, halt echt das Problem, wer bezahlt das?

01:06:00.860 --> 01:06:10.600
 Wenn ich den Mehraufwand nicht gezahlt bekomme, dann kann ich das aus reinem Gutwillen natürlich tun und da extra Zeit investieren, aber wer macht das schon?

01:06:10.780 --> 01:06:23.780
 Also da müsste das Bewusstsein geschaffen werden, nicht nur bei Behörden, sondern auch bei Firmen einfach generell und bei Auftraggebern, dass man sich dem Thema Accessibility annimmt, weil es ist wichtig.

01:06:23.780 --> 01:06:32.480
 Dazu habe ich noch zwei Punkte, ganz kurz. Also Behördenseiten, nur weil die das sein müssen, heißt das noch lange nicht, dass die das sind.

01:06:32.480 --> 01:06:33.200
 Gut, klar.

01:06:33.200 --> 01:06:42.760
 Also ich habe mir auch schon mal überlegt, es wäre eine unmoralische Art, Geld zu verdienen, wäre Behördenseiten sich zu suchen, davon gibt es eine Menge.

01:06:42.760 --> 01:06:49.140
 Also es müssen ja nicht unbedingt nur Behörden sein, sondern alle, die irgendwas mit Öffentlichkeit, mit öffentlichem Dienst und so zu tun haben.

01:06:49.140 --> 01:06:55.800
 Also zum Beispiel auch Asten oder sowas von Universitäten und so, die müssen das eigentlich auch machen.

01:06:57.440 --> 01:07:08.780
 Wer unmoralisch unterwegs sein will, ein bisschen Geld verdienen will, der schreibt die einfach an, von denen er gefunden hat, dass sie nicht zugänglich sind und sagt, naja, ich kann euch das zugänglich machen, mir müsste es übrigens gesetzlich sein.

01:07:08.780 --> 01:07:15.280
 Oder man kann sich da noch viel schlimmere Sachen ausdenken, ich will jetzt niemanden zur Erpressung ermutigen, aber es wäre für die Sache vielleicht eine gute.

01:07:16.320 --> 01:07:32.040
 Gut, als Betroffener kann man es abmahnen, also ganz klar, wenn ich als Betroffener da in die Röhre schaue, also das war jetzt auch gerade wieder, jetzt kommen wir doch nochmal kurz zu Corona, ist jetzt gerade so ein Thema Gehörlose, dass die Informationen bekommen in diesen Krisenzeiten.

01:07:32.040 --> 01:07:39.920
 Und da ist es ganz häufig so, dass obwohl es eigentlich sein müsste, solche Informationen nicht mit Gebärdensprachdolmetscher übertragen werden.

01:07:39.920 --> 01:07:44.740
 Und das geht halt eigentlich nicht, wenn es gesetzlich vorgeschrieben ist.

01:07:44.740 --> 01:07:55.240
 Oder es ist halt auf irgendwelchen Kanälen, man setzt dann voraus, die Leute können das ja online nachschauen, das setzt jetzt wiederum voraus, dass jeder Gehörlose auch Internetzugang haben muss.

01:07:55.240 --> 01:07:57.720
 Was einfach nicht sein kann, dass man das voraussetzt.

01:07:57.720 --> 01:07:58.920
 Auch heute nicht.

01:07:58.920 --> 01:08:11.940
 Ja, da gab es auch, weiß ich nicht, ich glaube letztes Jahr einen Fall in den USA mit einer Pizzalieferkette, die verklagt wurde von einem Blinden, der gesagt hat, ich kann keine Pizza bestellen bei euch auf der Webseite.

01:08:11.940 --> 01:08:20.420
 Und da ist, glaube ich, das hat ziemlich viel Aufruhr gesorgt, weil die haben nämlich verloren den Prozess und ich glaube, die mussten am Ende relativ viel Geld bezahlen.

01:08:20.420 --> 01:08:23.940
 Da ist es mal so ein bisschen in die Medien auch gekommen, so eine Geschichte.

01:08:23.940 --> 01:08:26.200
 Aber ich habe noch einen kleinen Tipp, was man machen kann.

01:08:26.200 --> 01:08:36.300
 Also wenn man jetzt sagt, naja, ich habe jetzt, ich kann es mir jetzt nicht leisten, da immer drauf zu gucken oder wenn ich es nicht bezahlt kriege, dann habe ich vielleicht keine Zeit dafür.

01:08:36.780 --> 01:08:46.240
 Ich empfehle an der Stelle, um so ein paar Basics irgendwie richtig zu haben, nutzt ein Framework dafür, wo das schon fest mit eingebaut ist.

01:08:46.240 --> 01:08:52.720
 Also zum Beispiel, also ich weiß jetzt nicht, ob ich jetzt sagen würde, Bootstrap ist ein Accessible Framework.

01:08:53.160 --> 01:09:00.340
 Aber bei Bootstrap wurde schon an vielen Stellen drauf geschaut, dass das auch mit der Tastatur vernünftig bedienbar ist und dass es Screenreader Texte gibt.

01:09:00.340 --> 01:09:02.640
 Man muss es nur noch richtig verwenden.

01:09:02.640 --> 01:09:06.180
 Aber in der Doku ist es meistens schon mit drin bei verschiedenen Komponenten.

01:09:06.180 --> 01:09:08.720
 Ich hatte jetzt gerade heute die Dropdown Komponente zum Beispiel.

01:09:08.720 --> 01:09:14.520
 Die ist, wenn man sie richtig so einbaut, wie Bootstrap das vorgibt, ist sie Accessible.

01:09:14.660 --> 01:09:17.920
 Also für Screenreader wunderbar zu benutzen, als auch für Tastatur.

01:09:17.920 --> 01:09:24.760
 Und im Zweifel, wenn ich jetzt kein Bootstrap einsetzen will, sondern irgendwie was eigenes, dann baut es doch einfach da mal ein.

01:09:24.760 --> 01:09:36.220
 Also ich meine, es ist, glaube ich, nicht zu viel verlangt, sich mal einen Tag vielleicht hinzusetzen, falls man ein eigenes Framework hat und sich mal versuchen, genau die Stellen rauszusuchen und am eigenen Framework das dann einfach mal zu verbessern.

01:09:36.220 --> 01:09:41.500
 Dann habe ich einmaligen Aufwand und muss das einfach in Zukunft nur noch Copy-Pasten.

01:09:41.620 --> 01:09:47.980
 Natürlich kann ich nicht alles mit Framework und Copy-Paste erschlagen, aber die schlimmsten Sachen vielleicht schon.

01:09:47.980 --> 01:09:56.860
 Oder zumindest habe ich dann Stellen im Code, die mich daran erinnern, ah ja, wenn ich da das jetzt so mache, dann muss ich jetzt nur noch hier das eine machen und dann bin ich schon viel zugänglicher.

01:09:56.860 --> 01:10:00.740
 Also in dem Fall würde ich auf jeden Fall sagen, versucht es mal mit Framework.

01:10:00.740 --> 01:10:03.300
 Das wird euch auf jeden Fall helfen und Arbeit abnehmen.

01:10:04.700 --> 01:10:11.740
 Da gibt es nicht viele Frontend-Frameworks, wo ich sagen würde, dass sie wirklich accessible sind oder dass da viel drauf geachtet wurde.

01:10:13.740 --> 01:10:33.360
 Ja, aber ich glaube, irgendwo bei GitHub gibt es, muss ich den Link nochmal raussuchen, packen wir vielleicht auch in die Shownotes, hat mal jemand sich die Mühe gemacht, so eine Tabelle aufzuschreiben, wo die ganzen Frameworks, die ganzen Frontend-Frameworks aufgelistet sind und wie die seiner Meinung nach Accessibility-mäßig dastehen.

01:10:33.960 --> 01:10:35.620
 Das ist vielleicht eine ganz gute Anlaufstelle.

01:10:35.620 --> 01:10:39.580
 Ja, damit wäre ich am Ende mit dem Thema.

01:10:39.580 --> 01:10:42.120
 Dann kommt jetzt das...

01:10:42.120 --> 01:10:44.280
 Das Geil-Teil.

01:10:44.280 --> 01:10:47.320
 Geil-Teil.

01:10:47.320 --> 01:10:48.160
 Yeah.

01:10:48.160 --> 01:10:59.500
 Und das Geil-Teil ist heute ganz kurz und knackig, ist eigentlich nur ein Link und es geht um einen Film von 1996, Space Jam.

01:11:00.300 --> 01:11:04.160
 Jetzt, je nachdem, wie unsere Altersgruppe verteilt ist, kennen den vielleicht manche gar nicht.

01:11:04.160 --> 01:11:16.120
 Das war ein Realfilm, gemischt mit Animationen, Michael Jordan in der Hauptrolle und die Looney Tunes, also Bugs Bunny, falls jemand mit Looney Tunes nichts mehr anfangen kann.

01:11:17.040 --> 01:11:20.360
 Ich weiß schon gar nicht mehr genau, um was es ging.

01:11:20.360 --> 01:11:23.900
 Ich habe den ungefähr 1996 auch zum letzten Mal gesehen.

01:11:23.900 --> 01:11:26.220
 Ich glaube, so toll war er gar nicht.

01:11:26.220 --> 01:11:33.660
 Aber, was für uns toll ist, es gibt die Webseite noch, spacejam.com, die Original-Webseite.

01:11:34.420 --> 01:11:41.040
 Da kann man mal drauf gehen und sich nochmal anschauen, wie Webseiten 1996 aussahen.

01:11:41.040 --> 01:11:46.700
 Alles schön mit großflächigen Hintergrundbildern gekachelt und grelle Farben.

01:11:46.700 --> 01:11:49.120
 Ein paar bewegte GIFs sind auch dabei.

01:11:49.120 --> 01:11:50.700
 Ganz wichtig, Frames natürlich.

01:11:50.700 --> 01:11:57.640
 Es funktioniert, glaube ich, an manchen Stellen schon nicht mehr so ganz, aber so im Großen und Ganzen existiert diese Seite noch.

01:11:58.060 --> 01:12:01.160
 Und das macht einfach mal Spaß, sich sowas mal wieder anzuschauen.

01:12:01.160 --> 01:12:15.440
 Und ich finde es cool, dass Warner Brothers, die für den Film verantwortlich sind, tatsächlich die Seite in all den Jahren, mittlerweile über 25 Jahre fast, knapp, online gelassen hat, dass man sich das anschauen kann.

01:12:15.440 --> 01:12:18.660
 Ein paar Veränderungen wurden wohl eingebaut, so Disclaimer-Links und so.

01:12:18.660 --> 01:12:22.760
 Die Seite läuft auch unter HTTPS, das war mit Sicherheit 1996 auch noch nicht so.

01:12:22.760 --> 01:12:27.360
 Aber so im Großen und Ganzen kann man da so ein bisschen einen Zeittunnel betreten.

01:12:27.520 --> 01:12:29.900
 Ja, kleiner Disclaimer an der Stelle von meiner Seite.

01:12:29.900 --> 01:12:32.740
 Ich kann sie bei mir gerade nicht öffnen, ich weiß nicht genau warum.

01:12:32.740 --> 01:12:37.180
 Vielleicht kann sie jemand anderes ja auch nicht öffnen, dann haben wir das gleiche Problem, warum auch immer.

01:12:37.180 --> 01:12:41.300
 Dann in die Wayback-Maschine, web.archive.org.

01:12:41.300 --> 01:12:42.980
 Ah, ja, genau. Gute Idee.

01:12:42.980 --> 01:12:46.980
 Ja, ich glaube, damit sind wir am Ende.

01:12:46.980 --> 01:12:49.020
 Ich glaube, dann sind wir heute schon am Ende.

01:12:49.020 --> 01:12:54.180
 Ja, es wird wohl noch eine Weile so weitergehen, wie ich die Sache einschätze, mit dem Remote aufnehmen.

01:12:54.660 --> 01:13:00.900
 Wir haben, glaube ich, heute irgendwie zwischendrin zweimal Probleme gehabt, mindestens mit Komplettaussetzern.

01:13:00.900 --> 01:13:03.940
 Du musst noch mal neue ansetzen, wird man wahrscheinlich im Schnitt nicht hören.

01:13:03.940 --> 01:13:09.300
 Aber so generell nimmt dieses Remote aufnehmen schon ein bisschen von der Dynamik raus.

01:13:09.380 --> 01:13:10.240
 Das ist ein bisschen schade.

01:13:10.240 --> 01:13:12.520
 Man kann einfach nicht mehr so aufeinander reagieren.

01:13:12.520 --> 01:13:17.160
 Aber ich hoffe, dass es trotzdem Spaß macht, zuzuhören und vor allem interessant ist.

01:13:17.660 --> 01:13:18.620
 Ja, das hoffe ich auch.

01:13:18.620 --> 01:13:23.920
 Und an der Stelle müssen wir natürlich noch mal einen kleinen Werbeblock einschieben, jetzt ganz ohne Jingle.

01:13:23.920 --> 01:13:30.760
 Bewertet uns bei iTunes oder bei deinem Podcast-Portal.

01:13:30.760 --> 01:13:36.740
 Bewerten, weitererzählen natürlich den Freunden bei Social Media teilen, wenn ihr sowas benutzt.

01:13:36.740 --> 01:13:42.180
 Gerne bei Twitter auch mal unsere Tweets zu der Folge retweeten oder so.

01:13:42.240 --> 01:13:43.400
 Da würden wir uns sehr drüber freuen.

01:13:43.400 --> 01:13:44.400
 Ja.

01:13:44.400 --> 01:13:47.660
 Ich glaube, wir müssen ein bisschen schimpfen mit den Hörern auch.

01:13:47.660 --> 01:13:52.280
 Wir haben das ja jetzt schon am Ende jeder Sendung gesagt und darum gebeten, dass auch Kommentare hinterlassen werden.

01:13:52.280 --> 01:13:55.880
 Wir haben genau einen Testkommentar bekommen, sogar ohne Inhalt.

01:13:55.880 --> 01:13:57.960
 Na doch, da stand Test drin.

01:13:59.240 --> 01:14:00.580
 Da stand doch Test drin.

01:14:00.580 --> 01:14:05.960
 Es war jedenfalls eine E-Mail-Adresse, die testen sollte, ob Wordpress das auch tatsächlich anerkennt.

01:14:05.960 --> 01:14:12.520
 Ja, jedenfalls, da müssen wir doch mal hier den Zeigefinger erheben und sagen, hey, kommentiert, bewertet.

01:14:12.520 --> 01:14:14.940
 Es darf ja auch Kritik sein.

01:14:14.940 --> 01:14:18.720
 Wir wollen ja nicht nur hören, ihr seid so toll und das ist der beste Podcast überhaupt.

01:14:18.720 --> 01:14:19.720
 Auch wenn er das ist.

01:14:19.720 --> 01:14:21.380
 Den Anspruch stellen wir ja auch gar nicht.

01:14:21.380 --> 01:14:22.660
 Ja, das ist selbstverständlich.

01:14:24.400 --> 01:14:30.060
 Aber wir akzeptieren auch gerechtfertigte Kritik und möchten einfach mal ein bisschen Feedback einholen.

01:14:30.060 --> 01:14:33.480
 Wir können uns nur verbessern, wenn man uns auch darauf hinweist, was wir besser machen können.

01:14:33.480 --> 01:14:39.440
 Jetzt könnte man natürlich annehmen, wenn wir kein Feedback und keine Kritik kriegen, dass vielleicht keiner uns zuhört.

01:14:39.440 --> 01:14:43.080
 Aber unsere Statistiken sagen was anderes, muss ich dazu sagen.

01:14:43.080 --> 01:14:49.220
 Außer das sind alles nur irgendwelche komischen Roboter, die von allen möglichen IPs auf der Welt unseren Podcast runterladen.

01:14:49.220 --> 01:14:50.900
 Also wir haben schon einige Hörer gehabt.

01:14:50.900 --> 01:14:53.520
 Das weiß ich auf jeden Fall aus der Statistik.

01:14:53.860 --> 01:14:56.300
 Und vielleicht meldest du dich mal.

01:14:56.300 --> 01:14:57.180
 Bitte melde dich.

01:14:57.180 --> 01:14:57.800
 Dich?

01:14:57.800 --> 01:14:59.480
 Also du, der einzige Hörer.

01:14:59.480 --> 01:15:03.220
 Du, der Hörer mit den 500 IPs.

01:15:03.220 --> 01:15:04.740
 Melde dich.

01:15:04.740 --> 01:15:06.380
 Melde dich bei uns.

01:15:06.380 --> 01:15:11.900
 Du kriegst dann auch ein Bier demnächst vielleicht.

01:15:11.900 --> 01:15:13.400
 Ja, so ein Sechserbier machen wir locker.

01:15:13.400 --> 01:15:18.380
 Oh, jetzt müssen wir jetzt für den ersten Kommentar gleich ein Sechserbier raushauen.

01:15:18.380 --> 01:15:18.800
 Ich hoffe nicht.

01:15:18.800 --> 01:15:21.200
 Das könnten wir doch eigentlich machen, oder?

01:15:22.360 --> 01:15:23.140
 Ich meine, das ist einer.

01:15:23.140 --> 01:15:25.540
 Das ist nur der Erste, der das kriegt.

01:15:25.540 --> 01:15:27.480
 Sonst, also das ist ja, kriegen wir schon hin.

01:15:29.420 --> 01:15:30.320
 Ich glaube, es ist jetzt.

01:15:30.320 --> 01:15:31.180
 Das wird sich eh keiner melden.

01:15:31.180 --> 01:15:36.680
 Warten wir es ab, warten wir es ab.

01:15:36.680 --> 01:15:37.700
 Dann gucken wir, was wir machen.

01:15:37.700 --> 01:15:39.140
 So machen wir es.

01:15:39.420 --> 01:15:42.240
 Ja, dann bin ich jetzt auch schon am Ende.

01:15:42.240 --> 01:15:43.360
 Ich bin auch am Ende.

01:15:43.360 --> 01:15:44.160
 Auch geistig.

01:15:44.160 --> 01:15:52.640
 Ist jetzt durch die ganze Technik jetzt auch ein bisschen spät geworden und irgendwie ist es anstrengend, der Alltag.

01:15:52.640 --> 01:15:56.640
 Auch wenn man denkt, man hat mehr Zeit, aber irgendwie auch doch nicht.

01:15:56.640 --> 01:16:01.000
 Gerade so mit Kind daheim ist doch irgendwie die Zeitaufteilung nicht so flexibel, wie man das gerne hätte.

01:16:01.000 --> 01:16:02.640
 Nun gut.

01:16:02.640 --> 01:16:03.300
 Nun gut.

01:16:03.560 --> 01:16:07.480
 Wir machen so weiter, wie wir es jetzt gemacht haben und sehen uns nächste Woche wieder.

01:16:07.480 --> 01:16:08.020
 Bis dann.

01:16:08.020 --> 01:16:08.920
 Bis dann.

01:16:08.920 --> 01:16:09.240
 Ciao.

01:16:09.240 --> 01:16:39.220
 Bis dann.