HTML5Tutorial

Ich find’s ja immer wieder total hammer, was die Cracks da draußen in den Weiten des Internets so alles entwickeln und online zur Verfügung stellen. Heute bin ich über ATARI arcade gestolpert, eine Art Online-Videospiel-Halle, in der man acht Games, darunter auch echte Super-Klassiker wie Breakout oder Pong, direkt im Browser spielen kann.

Und dies sind die zockbaren Spiele:

• Missile Command
• Pong
• Super Breakout
• Yars‘ Revenge
• Asteroids
• Centipede
• Combat
• Lunar Lander

Und wieder mal wurde, diesmal von ATARI, hiermit ein tolles Showcase geschaffen, das aufzeigt, was mit HTML5, CSS3 und JavaScript möglich ist und dass diese Technologien Flash nicht allzu sehr nachstehen.

Kostenlose Website Templates gibt es im Internet wie Sand am Meer. Möchte man seine zukünftige Website jedoch auf der Basis der aktuellsten Webtechnologien wie HTML5 und CSS3 erstellen, kann die Suche nach einem geeigneten Template schon ein wenig länger dauern. Muss sie aber nicht, denn hier gibt es eine Liste von zehn aktuellen und kostenlosen HTML5 / CSS3 Templates.

1. Night Club
 

Das Night Club Template hat, wie der Name schon vermuten lässt, einen coolen und dunklen Look, der es für die Verwendung einer Website für eine Disco o.ä. eignen lässt. Außer den reinen Template-Files kann man auf der Website auch noch die passende Photoshop-Datei herunterladen, um etwaige grafische Modifikationen sehr einfach vornehmen zu können. Read more »

WordPress ist das weitest verbreitete CMS für Blogs und bietet über zahlreiche Plugins und eine Menü-Engine die Möglichkeit, es darüber hinaus als CMS für klassische Websites oder sogar Communities einzusetzen. Durch diese Vielfältigkeit und die damit verbundenen steigenden Nutzerzahlen hat sich um WordPress eine riesige Community aufgebaut, die ständig für Nachschub an tollen und schicken Themes oder Templates sorgt. (Auch dieser Blog verwendet natürlich WordPress.)

Für viele Leute, die in nächster Zeit vorhaben, einen Blog zu starten oder einem bestehenden Blog ein neues Aussehen zu geben, könnte sich die Frage stellen, ob die zukünftige Site gleich in der zukunftsträchtigen HTML5 / CSS3 Technik umgesetzt werden sollte. Und für viele ist das neben einer generell technischen auch eine Kostenfrage, da der Markt an qualitativ hochwertigen kostenfreien HTML5 WordPress Themes noch sehr übersichtlich ist.

Deshalb gibt es hier für all diejenigen, die sich für den Schritt in Richtung Zukunft mit einem HTML5-basierten Template entschieden haben, eine kleine Liste von sieben kostenfreien und guten WordPress Designs.

1. Yoko

Yoko ist ein frisches und umfangreich ausgestattetes Theme von den Machern vom Smashing Magazine. Es unterstützt die wichtigsten Browser, hat für ältere ein Fallback implementiert und ist dank CSS3 Media Queries für Geräte mit verschiedensten Displaygrößen geeignet. Über eine Theme-Options-Seite lassen sich die wichtigsten Parameter bequem über’s Backend pflegen. Außerdem bietet das Theme verschiedene Post-Formate (aside, gallery, image, video, link and quote), optionale Submenüs, ein Social Media Widget für die wichtigsten Netzwerke und geschachtelte Kommentare.
Hier geht’s zur Download-Seite.

Read more »

Designmodo hat eine tolle Liste mit HTML5-basierten Websites zusammengestellt. Darunter sind viele alte Bekannte aber auch ein paar schmucke neue Websites. Schaut’s euch an.

45 Examples of Websites Designed with HTML5 von Designmodo

Jeder Designer, der mit Photoshop arbeitet kennt sie: die Ebenenstile. Ebenenstile ermöglichen es, eine Kombination verschiedener Ebeneneffekte wie Schatten, Kontur oder Farbüberlagerung als Paket abzuspeichern, um später auf sie zurückgreifen zu können. Felix Niklas hat das User Interface dieser Photoshop-Funktion nun für ein eigenes Projekt übernommen, einen grafischer CSS3 Editor namens Layer Styles.

Photoshop-User werden damit sofort zurecht kommen, aber auch für Nutzer anderer Grafikprogramme ist die Funktionsweise im Prinzip selbsterklärend – per Schieber und Checkboxes können verschiedene Effekte ausgewählt und deren Parameter angepasst werden. Das Ergebnis des erstellten CSS-Stils kann sofort in einer kleinen Vorschau betrachtet werden und per Klick auf „CSS Code“ am linken unteren Bildschirmrand bekommt man den dazu passenden CSS Code ausgespuckt. Wirklich sehr gelungen!

Grafischer CSS Editor Layer Styles