Openness für alle und der Wandel zu Voice

CSS Grid, Accessibility & SEO: 7 Take-aways vom ersten Tag der Webinale & IPC 2018
Keine Kommentare

Die International PHP Conference Spring 2018 und Webinale sind eröffnet! Wir berichten für euch von den Schwesterkonferenzen aus Berlin. Die Top-Themen des ersten Hauptkonferenztags: SEO-Trends, CSS Grids und barrierefreies Internet.

Take-away #1: Openness is winning!

Eröffnet wurde die Webinale von Program Chair Sebastian Meyen, der im prall gefüllten Keynotesaal den Siegeszug der offenen Web-Entwicklung nachzeichnete. Einerseits scheint es momentan im Web die Bewegung zu geben, viele Dinge kritischer zu sehen also noch vor 5 Jahren: Privacy, DSGVO, Accessibility, Developer Ethics sind hier einige Stichworte, die auch auf der Webinale & IPC eine tragende Rolle spielen.

Andererseits beobachten wir ein Siegeszug offener Prinzipien – nicht selten als Reaktion auf diese kritischere Haltung – , wenn beispielsweise Apple in seiner jüngsten Keynote den Safari Browser ankündigt, der zukünftig das Tracking persönlicher Daten blockiert.

Wenn Microsoft in einem spektakulären Deal diese Woche GitHub erwirbt, kann das ebenfalls als Commitment für eine offene Software-Entwicklung gedeutet werden. Und Besucher der IPC haben seit jeher PHP als offenes System verstanden und gepflegt. Auch sie sehen sich durch den Erfolg von Open Source bestätigt, den Sebastian Meyen mit dem Slogan auf den Punkt bringt: Openness is winnig, and so is PHP!

Am ersten Tag der Konferenz lag der Schwerpunkt dann allerdings gar nicht so sehr auf klassischem PHP sondern eher auf den neusten Trends in Sachen Web-Tech: CSS Grids, Voice-Assistenten und SEO spielten hier eine große Rolle.

Take-away #2: Webdesign-Trend 2018 = CSS Grid

Viele Weblayouts wurden bisher mit den beschränkten Mitteln geschrieben, die CSS zur Verfügung hatte. Die neuen CSS Grid Layouts bieten dagegen völlig neue Gestaltungsmöglichkeiten und erlauben nun z. B. individuelle Raster nicht nur für Seitenlayouts, sondern auch auf Komponentenebene. Doch kann man man CSS Grid in der Produktion schon verwenden? Na klar, und wie! Die aktuellen Versionen der großen Browser unterstützen jetzt das neue CSS-Layoutsystem, und viele alte „Framework-Krücken“ kann man sich jetzt endlich sparen. Der ausgewiesene CSS-Kenner Sven Wolfermann zeigte in seiner Session, dass CSS Grids die einfachste native Art ist, flexible Layouts mit CSS zu erstellen. Trotzdem muss man sich natürlich erst einmal mit der neuen Grid Terminologie vertraut machen: Bei 18 neuen CSS Properties und einigem anderen nützlichen Zubehör gibt es für die CSS-Entwickler einiges zu lernen.

Auf anschauliche Art und Weise zeigte Sven Wolfermann zunächst anhand eines einfachen Beispiels, wie leicht flexible Layouts nun zu erstellen sind. Es besteht immer die Möglichkeit, dass Zellen sich implizit im gesetzten Rahmen bewegen, oder dass man diese explizit im Rahmen zuweist. Zellen können sich dank CSS Grid nun auch problemlos überlappen. Geht das alles zu schnell? Natürlich kann man auch seine bestehenden Seiten mit CSS Grid langsam umbauen oder auch ein Bootstrap-Grid mit CSS Grid responsive nachbauen. Wie sagte Sven Wolfermann so schön: „We don´t need a Framework – Grid is a Framework“!

Take-away #3: Grid oder Flexbox? Beides!

Auch Jonas Hellwig, kulturbanause®, befasste sich mit dem CSS Grid – das Thema hat am ersten Tag der Webinale & IPC Spring 2018 für großes Interesse gesorgt und ist wohl einer der Trends dieses Jahres. Hellwig befasst sich allerdings nicht alleine mit der Frage, wie ein Layout im Grid aussehen kann, sondern auch damit, ob man sich eigentlich zwischen CSS Grid und CSS Flexbox entscheiden muss.

Die Antwort fiel klar aus, wie der Speaker im Rahmen einer Live-Coding-Session demonstrierte: Nein! Wer das Grid für übergeordnete Layoutelemente verwendet und darin für einzelne Komponenten auf Flexboxes setzt, bekommt das beste aus beiden Lösungen und kann besonders flexibel damit arbeiten.

Mit dem Grid können sich außerdem auch Entwickler am Designen versuchen, die bisher kein Händchen dafür hatten. Timo Korinth bot in seiner Session einen „Grundkurs für Nicht-Designer“ und legte ein eindringliches Plädoyer für passendes Licht und Schatten, ausreichenden Whitespace und gute Schriften ein.

Take-away #4: Photoshop ist tot – es lebe der Filzstift!

Wer am Design arbeitet, redet dabei natürlich über das User Interface: UI First – diesen Slogan hat man schon oft gehört. Was es in der Praxis heißt, das User Interface ins Zentrum eines Webprojekts zu stellen, erfuhren wir von den UI Engineers Dennis Reimann und Jan Persiel. Und dabei ging es zentral um Dekonstruktion. Zu Beginn mit Photoshop ein Layout entwerfen, das dann feierlich zur Umsetzung an das Entwicklerteam übergeben wird – so geht es eben gerade meist schief!

Reimann und Persiel empfehlen deshalb das Lagerfeuer: Designer und Entwickler müssen sich gemeinsam um ein Projekt scharen und in enger Abstimmung, in kleinen Schritten ein gemeinsames Verständnis für das geforderte UI finden. Komponenten-basiertes Vorgehen, in dem zum Beispiel Styletiles den großen Layoutentwurf ersetzen, können hier ein Mittel sein. Diese Layout-Komponenten werden dann von Entwicklern in Code gegossen, mit der Zeit entsteht auf diesem Wege vielleicht sogar eine Pattern-Library, die Projekt-übergreifend eingesetzt werden kann.

Mockup-Tools, Prototyping und das weiße Blatt Papier, auf das jeder Stakeholder in einem Workshop mal schnell seine Ideen kritzeln kann, führen hier eher zum Erfolg als das Design am Profi-Tool, von dem erwartet wird, dass es pixelgenau im Web umgesetzt wird.

Take-away #5: SEO funktioniert doch

Genauso wichtig wie flexible, responsive und schön gestaltete Webseiten sind natürlich auch die entsprechenden Inhalte. Doch wie kann man Google am besten mitteilen, dass diese auch gut im Netz gefunden werden? SEO-Päpste gibt es ja zuhauf, und leider hat bisher noch keiner den heiligen Gral der SEO-Optimierung gefunden.

Doch nun gibt es eine neue heiße Spur, wie Google Inhalte bewertet und wie die jeweiligen Auswirkungen auf das Ranking aussehen. Unter dem Motto „Was Du von Suchmaschinen über SEO lernen kannst“, zeigte der Performance-Marketing-Experte Thomas Mindnich in seiner Session einen vielversprechenden Ansatz, wie man seine Seite mit Inhalten füttern kann, die Google auch tatsächlich gut rankt. Mindnich spannte den Bogen von strukturierten Daten über Korrelationsanalysen bis hin zur Untersuchung der Term-Gewichtung.

Fazit: Ohne ein Verständnis der Grundlagen der Suchmaschinen-Technik geht im Bereich SEO nichts. Und die haben sich seit 10, 20 Jahren eigentlich nicht verändert.

Take-away #6: SEO funktioniert anders

In Sachen SEO tut sich aber dennoch so einiges – heute werden Suchergebnisse nicht mehr in der gleichen Form angezeigt wie früher. Ganz im Gegenteil: Wo lange Jahre wichtig war, in die Top 10 der Google-Suchergebnisse zu kommen, um auf Seite 1 zu landen, finden sich heute erst einmal Snippets, Shopping-Angebote und lokale Suchergebnisse über den anderen Inhalten. Aber dabei bleibt immerhin noch das grafische Element der Ergebnisseite der Suchmaschine erhalten. Was ist aber mit Voice-Interfaces, die ja immer beliebter werden? Hier muss SEO neu gedacht werden.

Darüber sprach Matthäus Michalik (Claneo) in seiner Session und erklärte, dass auf dem Voice-Assistenten nur noch das erste Suchergebnis zählt. Um da rein zu kommen, geht es nicht mehr darum, besonders viele Keywords strategisch klug zu platzieren, sondern vor allem darum, spezifische Phrasen zu verwenden, die tatsächlich in der sprachgesteuerten Suche genutzt werden.

Statt „Kochzeit Eier“ müsste also eine SEO-Optimierung für Voice-Assistenten auf die Frage ausgerichtet sein: „Wie lange braucht ein weichgekochtes Ei?“.

Doch auch damit ist die Entwicklung auf dem SEO-Gebiet noch lange nicht beendet. Nach Voice kommt nämlich natürlich noch die künstliche Intelligenz und damit die nächste disruptive Welle im Nutzerverhalten!

Take-away #7: Accessibility für alle!

Ein weiteres wichtiges Thema des Tages war das der Accessibility – das Web ist für alle da! Zumindest in der Theorie. In der Praxis sieht das oft anders aus, wie gleich zwei Speakerinnen im Rahmen des Konferenztags erläuterten. Elle Waters, Simply Accessible, Inc., ging darauf ein, dass Barrierefreiheit im Netz in den USA bereits einklagbar ist und auch die EU einen ersten Schritt in diese Richtung gegangen ist. In diesem Jahr tritt eine EU-Verordnung in Kraft, die zumindest öffentliche Stellen dazu verpflichtet, ihre Webauftritte barrierefrei zu gestalten. Aus ihrem Berufsalltag weiß Waters allerdings auch, dass Barrierefreiheit für bestehende digitale Angebote zwar erst einmal mit einem großen Aufwand verbunden ist, oft allerdings auch dazu beiträgt, die Codebasis sauberer zu gestalten und das Angebot für alle Nutzer angenehmer zu machen.

Auch Laura Kalbag befasste sich in ihrer Keynote damit, dass Accessibility im Netz für alle Anwender wichtig ist. Statt viele Worte über diese Keynote zu verlieren, wollen wir an dieser Stelle aber nur schon einmal ankündigen, dass wir euch diese Keynote im Laufe des heutigen Tages online verfügbar machen werden. Schaut also einfach später noch einmal vorbei!

 

 

Unsere Redaktion empfiehlt:

Relevante Beiträge

Hinterlasse einen Kommentar

Hinterlasse den ersten Kommentar!

avatar
400
  Subscribe  
Benachrichtige mich zu:
X
- Gib Deinen Standort ein -
- or -