Animation, Templates, Typographie

7 geniale HTML5-Helfer

Zeit sparen mit dem Starterset

Typische Buttons und Grafiken können bei HTML Kickstart einfach in die eigene Website eingebaut und angepasst werden.
Typische Buttons und Grafiken können bei HTML Kickstart einfach in die eigene Website eingebaut und angepasst werden.
Foto: Stefan von Gagern

HTML Kickstart von 99lime.com ist eine Art Grundausstattung für das moderne Webdesign. Es bietet so genannte Building Blocks, also Bausteine für die eigene Website, die sich aber dennoch frei gestalten lassen und auch von Hardcore-Entwicklern gerne genutzt werden. In einem kostenlosen Download, den bereits über 115.000 Webdesigner genutzt haben, sind unter anderem Buttons, Icons, Farben, Stile, Listen, Menüs, Tabellen-Templates, Tooltips und CSS-Stile für Typografie enthalten. Alles liegt im typischen HTML5-Stil vor und ist komplett an das eigene Design anpassbar. Dank nützlicher Kleinigkeiten, wie einem Icon für die Verknüpfung mit Twitter, lässt sich wertvolle Entwicklungszeit sparen. Die üblichen Funktionalitäten wie Slideshows oder interaktive Menüleisten lassen sich so schnell umsetzen. Die Technik dahinter ist blitzsauber: Javascript, HTML 5 und CSS 3 versprechen Kompatibilität zu den großen Browsern. Zudem ist die Installation einfach: Paket herunterladen, in das Root-Verzeichnis des Website-Entwicklungsordners kopieren, fertig.

HTML5 Video im Handumdrehen

Der VideoJS-Player zeigt auf seiner Homepage, wie leicht er anzupassen und einzubetten ist.
Der VideoJS-Player zeigt auf seiner Homepage, wie leicht er anzupassen und einzubetten ist.
Foto: Stefan von Gagern

Video.js ist ein frei erhältlicher und verwendbarer Videoplayer, der auf Javascript basiert. Schon die Startseite zeigt, wie einfach sich seine Optik anpassen lässt. Die Position des Abspielbuttons beispielsweise wird über Schieberegler festgelegt, die Farbgebung über Auswahlpaletten eingestellt. Auch die Anwendung ist einfach: Quellcode herunterladen und auf dem eigenen Sever hosten oder ein Skript für die gehostete Variante in die eigene Seite einbauen. Mit dem HTML5-Video-Tag können dann Videos eingebettet werden und laufen dann in allen Browsern - nicht nur denen, die HTML5-Video unterstützen. Designer können gewohnte CSS-Stylesheets für die Optik verwenden. Responsive Design wird ebenso unterstützt wie optimiertes Webdesign fürs Retina Display.