Kategorie: HTML5

Wichtige Seiten zu HTML5 und CSS3

13. September 2012 /

In meinem letzten Projekt fiel mir genau wie in meiner letzten Schulung auf, dass vielen Kollegen der Überblick über wirklich hilfreiche und wichtige Links fehlt. Insbesondere der Umgang mit CSS3 und HTML5 erfordert das ständige Nachschlagen nach Browsersunterstützung und der Suche nach passenden Alternativen.

Es ist zudem aber auch wichtig, inhaltlich am Ball zu bleiben. Dafür benötigen wir inspirierende und gerne auch informative Artikel. Die gibt es in der gewünschten Güte und Qualität (leider) nur im englischsprachigen Web. Ich gebe hier mal eine Übersicht der mir besonders wichtigen Referenzen und Informationsseiten. Diese Übersicht ist nicht komplett, nur auf das Wesentliche eingedampft. Ich bin überzeugt, dass jeder an moderner Webentwicklung Interessierte diese Auswahl in seinen Bookmarks haben sollte.
Weiterlesen

HTML5, bitte

23. Januar 2012 /

Entwickelt man seine Seiten mit modernen Webtechniken, also mit HTML5 und CSS3, kommt man immer an den Punkt, an dem einzelne Browser die jeweiligen Techniken nicht unterstützen. Und das betrifft bei weitem nicht nur den IE. Nun kann man das zwar ignorieren, es gelingt aber nicht immer. Zum einen möchten doch die meisten Kunden auch etwas von der neuen Seite haben und nutzen dabei doch nicht immer einen modernen Browser. Zum anderen gibt es selbstverständlich auch Techniken, die nicht nur einfach Deko sind – wie runde Ecken, Verläufe und Schatten. Wenn man ein visuelles Element auf 3D-Transforms aufbaut, weil man gerne die aktuellste Technik nutzen will, bekommt man ausserhalb der aktuellen Chrome nur extrem seltsame Ergebnisse.
Weiterlesen

Linkfutter 12

8. November 2011 /

Michael Grosch hat auf dem letzten Nürnberger Webmontag einen Vortrag über Webfonts gehalten. Die Präsentation gibt einen knappen Überblick über das Thema.

Josh Vogt legt eine tolle Schnellreferenz über die unterschiedlichen CSS-Selektoren vor. Die Bedienung ist toll. Die meisten Informationen sind auf den ersten Blick versteckt, was die ganze Angelegenheit übersichtlicher macht.

Neal Grosskopf stellt einen „nth-child Visual Calculator vor. In einem dazugehörigen Artikel erklärt er die dahinterstehende Logik. Allerdings finde ich das Tool von Lea Verou interessanter, denn es beherrscht noch mehr dieser modernen und pfiffigen Selektoren.

Für alle an Spielen interessierten Entwickler könnte der Artikel von Rob Hawkes interessant sein, in dem er die Entwicklung eines Multiplayer-Games mit WebSockets und node.js beschreibt.

Vortrag über HTML5 und CSS3

19. Oktober 2011 /

Letzte Woche war ich fleissig. Nachdem ich erst in Mainz auf der Webtech über Best Practices und über YAML4 sprach, fuhr ich auf Einladung des SAE Instituts nach Berlin. Auf der dortigen SAE Alumni Convention sprach ich dann über moderne Webentwicklung mit HTML5 und CSS3. Dank eines Abspracheproblems wurde mein Talk als englischsprachig angekündigt. In Unkenntnis, ob diese Version denn gebraucht würde, habe ich meine Folien einmal auf Deutsch und einmal auf Englisch erstellt. Sie sind wieder bei Slideshare erhältlich.
Weiterlesen

HTML5-Standardwerk zieht um

5. Oktober 2011 /

Es ist schon ein seltsames Stück, das sich aktuell in einer kleinen Ecke des Internet abspielt. Mark Pilgrim, von vielen geschätzter Autor einiger Bücher, löscht alle seine Seiten, seinen Twitter-Account, seinen github-Account. CSS-Großmeister Eric Meyer ruft dies auf den Plan und er sucht mit anderen nach Pilgrim. Sowohl online als auch offlien (mittels Polizei) wird nach ihm gesucht.

Ergebnis der Suche: Mark Pilgrim lebt. Warum er keinen Bock mehr auf seine Onlineaktivitäten hat und was das alles soll, klärt sich bislang nicht. Lange Rede, kurzer Sinn: die immer wieder empfehlenswerte Onlinequelle „Dive into HTML5“ existiert unter zwei neuen Adressen. Also: Bookmarks ändern! Ausserdem gibt es für „Dive into Python 3“ eine neue Adresse und der github-Account mit den Inhalten der beiden Dokumente ist wieder online. Zusätzlich sind beide Werke auch bei Jonathan Neal zugänglich.

Fehlermeldungen bei HTML5-Formularen

21. Juni 2011 /

Eine der tollen Neuerungen von HTML5 sind m.E. die eingebauten Formularvalidierungen. Aber so ganz astrein sind die Dinger noch nicht umgesetzt.
In Chrome – ich habe gerade Version 14 im dev-Branch laufen – hängt die Fehlermeldung irgendwo tief unten. Wenn ich das Fenster verbreitere, wandert die Fehlermeldung nach rechts.
Im Firefox 4 ist die Fehlermeldung prima platziert.
Und in Opera ist es am Unterhaltsamsten. Aus meinem „aaaa“ macht Opera im URL-Formularfeld ein „http://aaaa“ und versucht die Seite zu erreichen, aber ohne anschließende Fehlermeldung. Wenn ich in ein Formularfeld für Telefonnummern in Opera ein paar Buchstaben eingebe, bekomme ich ebenso keine Fehlermeldung.
Ich habe dieses Verhalten mit der sehr empfehlenswerten Testsuite von wufoo getestet.

Kann man HTML5 schon nutzen?

2. Juli 2009 /

Jens Meiert und nun auch offiziell Google empfehlen ja aus Performancegründen die Nutzung der HTML5-DTD. Man spart dadurch ein paar Zeichen. Es gibt aber auch ernstzunehmende Debatten, ob man HTML5 schon nutzen kann und wenn ja, wie.

Bruce Lawson schreibt in Sitepoint ganz klar: „Yes, You Can Use HTML 5 Today!„. Molly Holzschlag hat sich angeschaut, welche Bestandteile von HTML man denn heute schon in welchem Browser nutzen oder nicht nutzen kann. Die leider ungefärbte Tabelle (die es auch als gefärbtes PNG gibt), hat Eric Eggert freundlicherweise eingefärbt. So erfaßt man die Aussage der Tabelle einfacher.

Neben Peter Kröners deutschsprachiger Einführung in HTML5 und seiner Betrachtung von Canvas gibt es auch eine lohnende englischsprachige Einführung in HTML5. Bei Letzter merkt man übrigens, warum es klasse sein kann, eine Internetseite auszudrucken. Ich finde Seite sehr schwer lesbar. Die Kontraste sind schlecht und die blauen Links glühen richtig auf dem schwarzen Hintergrund.

Eine Anlaufstelle für Fragen rund um HTML5 scheint sich bei HTML5Doctor zu bilden. Ich bin gespannt, ob die ähnlich nützlich werden, die CSS3.info. Und wer schonmal ein paar Praxisbeispiele sucht, dem kann bei HTML5Demos geholfen werden.

Sehenswert sind auch die beiden Präsentationen über Canvas von Martin Kliehm, die es bei Slideshare gibt.

Die hier präsentierten Links sind nur ein Ausschnitt. Ich sammele auch in Zukunft bei delicious empfehlenswerte Links zu HTML5.