davydavy.de

Moin :) Eine wirklich tolle Seite die ich euch vorstellen möchte:

Es geht um encycolorpedia.de

Dort gibt es wunderbar detaillierte Infos zum Thema Farben und ist daher für nette Spielereien zu verwenden.
Zum Beispiel um die Invertierten Versionen der Hauptfarben der eigenen Website zu nutzen, also die gegenteiligen Farben des jeweiligen Farbraumes

Zusätzlich habe ich noch herausgefunden das meine Hintergrund-Farbe der "Raven Black / Pearl" Lackfarbe von Audi entspricht...
Nicht hilfreich aber trotzdem interessant.
So würde meine Page mit invertierten Hauptfarben aussehen:
davydavy.de

Nicht schön aber selten!

Viel Spaß mit encycolorpedia.de !

PS: Um andere Stylings zu laden bitte JavaScript/jQuery nutzen. Es macht keinen Sinn die index.html Pages in zwei Versionen zu pflegen. Das habe ich nur auf die Schnelle so umgesetzt da ich das Invert-Styling auf keinen Fall behalten oder als Alternative anbieten will.
Wenn ihr über die Suchmaschine eurer Wahl nach "CSS Style Switch" sucht, findet ihr genug Code-Snipsel um das relativ professionell umzusetzen.

Servus :) Etwas was ich zuvor noch nicht umgesetzt habe, jedoch absolut Sinn macht:

Bezeichnende ID´s verwenden.

Und zwar nicht nur hinsichtlich des jeweiligen DOM Bereich (passend zu header, nav, main, footer etc.), sondern auch hinsichtlich der Nutzung der ID´s.
Zum Beispiel für den sichtbaren/visuellen "Head" Bereich der Website nutze ich die ID "css-header". Somit ist eindeutig das diese ID primär für das Styling per CSS angesprochen wird.

Wird mit einer ID jedoch eine Funktion in JS angesprochen, ist es gut die ID mit "js-..." zu beginnen.

Weitere Abstufungen sind möglich, etwa wenn per JS oder jQuery ein Styling vorgenommen wird oder eine ID für CSS-Styling und eine Function genutzt wird.
In meinen Augen sind diese weiteren Abstufungen aber nur bedingt sinnvoll. Wenn es komplexer wird, sind entsprechende Kommentare im Code unverzichtbar.

Yes! Die neue Website ist online :)

Erstes Validation-Ergebnis nach mehreren Tagen Arbeit und einigen Design/Struktur-Änderungen = 0 Warnings, 2 Errors (hatte ein Leerzeichen zuwenig und ein closing div zuviel) :)

Was habe ich daraus gelernt? Mehrere verschiedene Designs in z.B. Powerpoint "aufmalen" bevor man in die Umsetzung geht.
Erfahrung mitgenommen: Nicht überall anwendbare CSS Styles auch nicht für die gesamte Page bauen und dann versuchen "Ausnahmen" zu definieren, sondern Klassen definieren und die einsetzen wenn man sie braucht.
Eben genauso wie CSS eigentlich auch genutzt werden sollte :)

Die letzten Wochen habe ich beim Front-End Web Developer Programm von W3Cx eine kleine Pause eingelegt und mir den Kurs "Responsive Website Basics" der University of London gegönnt und erfolgreich abgeschlossen.

Mein persönliches Fazit:
Nach den ersten drei Lessions war die Spannung weg und es wurde eher schleppend. Das ändert sich jedoch mit dem Kursmaterial ab der dritten Woche ziemlich stark und der Kurs nahm an Fahrt auf. Insbesondere für Anfänger kann ich den Kurs ausdrücklich empfehlen.

Für alle die bereits Erfahrung mit HTML,CSS und JS haben empfehle ich lieber die Kurse des W3C. Auch hier wird zwar mit den Basics begonnen, aber man kann schnell viel Hintergrund-Wissen erhalten da eben viel mehr auf Details eingegangen wird.

• Responsive Website Basics
• W3Cx MOOCS

Inzwischen habe ich zwei weitere Zertifikate erworben und arbeite gerade an Nr.4 und Nr.5 um das Programm "Front-End Web Developer" by W3C abzuschliessen. Im April/Mai sollte ich diese abgeschlossen haben.
Dann geht´s an die Spezialisierung der Hong Kong University of Science and Technologie zum Full-Stack Web Developer.
Darauf freue ich mich schon sehr! Die Spezialisierung habe ich mir bereits etwas genauer angesehen (7 Tage Probe-Abo). Herausfordernd, aber sehr spannend.

Die nächsten Wochen werde ich etwas zu meinen persönlichen Highlights aus den bisherigen Kursen schreiben. Zusätzlich arbeite ich gerade an einer neuen Version von davydavy.de.

Die HTML Media API ist inzwischen ziemlich umfangreich.
Hier kann ich sowohl die Dokumentation der WHATWG in ihrem "HTML Living Standard" Dokument empfehlen als auch diese tolle Page des W3C.
Über letztgenanntes lassen sich auch einige Video Element Attribute direkt testen.

• WHATWG Media Elements
• HTML5 Video Element

Das Grundgerüst aller Websites wird mittels HTML, CSS und JavaScript entwickelt.
Diese wichtigen Basis-Fähigkeiten will ich mir also unbedingt so gut wie möglich aneignen. Und warum nicht gleich diese Fähigkeiten direkt über das World Wide Web Consortium erlangen?

Was ist das W3C? Auszug aus Wikipedia:
"Das World Wide Web Consortium (kurz W3C) ist das Gremium zur Standardisierung der Techniken im World Wide Web. Es wurde am 1. Oktober 1994 am MIT Laboratory for Computer Science in Cambridge (Massachusetts) gegründet. Das W3C ist eine Mitgliedsorganisation. Gründer und Vorsitzender ist Tim Berners-Lee, der als Erfinder des World Wide Web gilt. Das W3C entwickelt technische Spezifikationen und Richtlinien in einem ausgereiften, transparenten Prozess, um maximalen Konsens über den Inhalt technischer Protokolle, hohe technische und redaktionelle Qualität und Zustimmung durch das W3C und seine Anhängerschaft zu erzielen."

Daher bin ich seit einigen Wochen dabei eine Weiterbildung zum "Front-End Web Developer by W3C" zu machen.
5 Kurse müssen hierzu erfolgreich absolviert werden. Ein jeder davon mit 4-6 Modulen und den dazugehörigen "Prüfungen". Am ende eines jeden Kurses muss eine Abschlußprüfung abgelegt werden. Den ersten Kurs "HTML5 and CSS Fundamentals" habe ich nun erfolgreich abgeschlossen.