5 Must-have Websites für angehende Web-Developer

Als Web-Entwickler gibt es gewisse Dinge, die man tun «muss», wenn man Websites erstellen will. In diesem Blog-Beitrag zeigt Alex Kereszturi fünf dieser Dinge und stellt zu jedem Thema eine Website vor, die ihm bei der Bewältigung der Herausforderungen hilft.

AutorAlex Kereszturi
Datum03.03.2016
Lesezeit5 Minuten

Als Web-Entwickler gibt es gewisse Dinge, die man tun «muss» – naja, jedenfalls, wenn man Websites erstellen will. In diesem Blog-Beitrag möchte ich fünf dieser Dinge kurz ansprechen und zu jedem Thema eine Website vorstellen, die mir bei der Bewältigung der Herausforderungen hilft.

Ein Webentwickler muss tun, was ein Webentwickler tun muss: die Aufgabenliste

Die fünf Dinge, die ich heute etwas genauer unter die Lupe nehmen werde, sind:

  1. Up-to-date bleiben: Was gibt es Neues?
  2. Anwendbarkeit abschätzen: Wo und wie lässt sich das Neue überhaupt (schon) anwenden?
  3. Wissen aneignen: Wo finde ich technische Details und Spezifikationen?
  4. Prüfen, wie es aussieht: Sieht es gut aus?
  5. Auswirkungen im Auge behalten: Wie reagieren Suchmaschinen auf meine Änderungen?

1. Up-to-date bleiben

Es gibt viele Sites im Internet, die sich mit News und/oder Tutorials zum Thema Webdesign anpreisen. Ich möchte aber gerne Informationen aus erster Hand. Ich möchte kurz und bündig wissen, was der aktuelle Stand der Entwicklungen im Bereich der Web-Technologien HTML & CSS ist. Diese Informationen erhalten ich am besten an der Quelle. Also dort, wo HTML und CSS ausgearbeitet, spezifiziert und als Standard verabschiedet werden: beim W3C dem «World Wide Web Consortium» unter https://www.w3.org/blog/news/

Ohne Werbung und grossen Schnickschnack erfahre ich im Post vom 28. Januar 2016, dass die ersten Arbeitsentwürfe zu «Micropub» und «ActivityPub» (was auch immer das ist) veröffentlicht wurden. Selbst zwei Wochen nach dem 28. Januar ist die Ausbeute einer Google-Suche nach «Micropub» eher bescheiden – obschon mich auch die Idee von Bier-Schenken in Kleinstgrösse irgendwie fasziniert.

Schnappen wir uns ein Beispiel, mit dem wir weiterarbeiten können: Der W3C-Blog berichtete am 19. November 2015, dass der «HTML Canvas 2D Context» als Standard verabschiedet wurde. Klingt spannend – vor allem, weil ich bestimmt schon seit drei Jahren den HTML-Canvas in meinen Kursen zeige. Aber ok, seit November 2015 darf man ihn nun sozusagen auch «offiziell» verwenden.

2. Anwendbarkeit abschätzen

Bevor ich nun wie ein Wilder loslege und wo immer möglich mit dem Canvas-Element arbeite, will ich erst einmal wissen, ob und wo er überall (schon) unterstützt wird. Dazu surfe ich auf die Website caniuse.com und suche nach dem Begriff Canvas:

Was ich da sehe, gefällt mir ganz gut: Alle gängigen Browser in ihren aktuellen Versionen unterstützen das Canvas-Element. Nur Opera Mini scheint etwas Mühe mit Animationen zu haben. Damit kann ich leben.

Wichtiger Tipp:
Auf www.caniuse.com lohnt es sich, die Tabs (unterhalb der Browser-Übersicht) zu studieren.

  • In «Notes» finden sich oft wichtige Kurz-Hinweise
  • In «Sub-features» werden einzelne Merkmale separat untersucht
  • «Known-Issues» liefert bekannte Bugs und andere Herausforderungen
  • «Resources» verweist auf Seiten im WWW zum Weiterlesen

Nun gut, das Canvas-Element scheint gut unterstützt zu sein, machen wir uns nun etwas schlauer zum Thema.

3. Wissen aneignen

Im Tab «Ressources» auf caniuse.com (siehe oben) finden sich schon recht viele gute Quellen, um sich ins Thema HTML-Canvas zu vertiefen. Mir persönlich gefällt aber auch http://www.w3schools.com/ sehr gut. Ich finde dort nämlich nicht nur eine Einführung in das Thema als Tutorial, sondern auch eine übersichtliche Referenz zum schnellen Nachschlagen. Zudem kann ich die gezeigten Beispiele gleich live über den «Try it yourself»-Button ausprobieren.

So kann ich etwas über das Canvas-Element lernen und auch jederzeit nachschlagen, was es so alles gibt.

4. Prüfen, wie es aussieht

Irgendwann habe ich dann ein Projekt umgesetzt, in dem ich das Canvas-Element verwendet habe. Jetzt geht es darum, herauszufinden, ob ich das auch wirklich richtig gemacht habe. Da ich in meinen Blog-Beiträgen immer wieder auf den Validator des W3C verweise, möchte ich dieses Mal nicht nur meinen Code auf Validität prüfen, sondern auch einmal das Visuelle prüfen. Ich stelle mir die Frage: «Wie sieht meine HTML-Seite als Ganzes – also von oben bis unten an einem Stück – aus?». Darum surfe ich schnell auf www.url2png.com/#testdrive und gebe dort meine URL ein.

5. Auswirkungen im Auge behalten

Um hier nicht eine komplette Abhandlung darüber zu eröffnen, wie und was ich jetzt alles zum Thema SEO (Suchmaschinenoptimierung) tun und überprüfen könnte, halte ich mich kurz: Mit einem Verweis auf www.searchenginegenie.com/seo-tools.html, wo ich Suchmaschinen-Tools finde, soweit das Auge reicht, möchte ich diesen Beitrag schliessen. Interessiert Sie eines davon im Detail, schreiben Sie mir das doch unten via Kommentar.


Über den Autor

Alex Kereszturi

Alex Kereszturi ist Web Solution Developer der ersten Stunden, Trike-Fahrer und Hobby-Psychologe. Als einer der ersten «Webpulisher SIZ» und als «Adobe Certified Instructor» entwickelt er seit seinem 15. Lebensjahr Lösungen für das WWW, Mobilgeräte und andere Lebenslagen. Er ist seit über 14 Jahren Kursleiter bei Digicomp, liebt das Sein in der Natur und setzt bei seinen Schulungen auf einen guten Mix aus Information, Praxisübungen und Unterhaltung. Als Inhaber und CEO führt er die Smilecom GmbH als ein kleines aber feines Software-Entwicklungs-Unternehmen und immer wieder ein turbulentes Familienleben mit drei Töchtern.