Alle Artikel mit dem Schlagwort: CSS3

Responsive Webdesign von Kopf bis Fuß

Veröffentlicht von Alexander Plaum

Wenn ich den Terminus „Media Queries“ in den Raum werfe, wissen wohl zunächst nur routinierte Webentwickler, was gemeint ist. Der mit diesem Konzept verbundene Überbegriff ist allerdings derzeit in aller Munde: Responsive Webdesign. Hier geht es (grob gesagt) darum, eine Website so zu bauen, dass sie auf das Gerät reagiert, mit dem sie betrachtet wird, also eine „Response“ liefert. Diese Reaktion zeigt sich vor allem daran, dass Navigationsleisten, Spalten und Textfelder immer genau die richtige Größe haben. Vorbei die Zeit, als z.B. Seiten von Nachrichtenportalen auch auf dem Mobiltelefon sture 1000 Pixel breit waren und nur per Horizontal-Scroll- und Zoomorgien gelesen werden konnten. Grundlage für das Responsive Webdesign sind die neuen Webstandards HTML5 und CSS3 (vor allem letzteres). Grundlage für den Umgang damit ist u.a. unser neuer Head-First-Titel „Mobiles Web von Kopf bis Fuß“. Das Probekapitel zu Media Queries & Co. haben wir frisch ausgekoppelt: Mobiles Web von Kopf bis Fuß from O’Reilly Verlag

I can’t believe it’s just CSS: Faszinierender Vortrag, bäriges Buch

Veröffentlicht von Alexander Plaum

Wenn die Website bunt und abwechslungsreich bzw. grafik- und animationsorientiert sein soll, dann kommt man um JavaScript, WebGl oder Canvas nicht herum, oder? Stimmt gar nicht. Mit der nötigen Portion Kreativität, Bastelbereitschaft und Ehrgeiz gelingen auch mit CSS3 spektakuläre Effekte. In welche Richtung man dabei denken sollte, erklärt Webdesigner und -entwickler Chris Ruppel von Four Kitchens aus Austin in diesem Video, das Sie ausnahmsweise extern betrachtet müssen, da es hier nicht eingebettet werden kann. Besonders faszinierend finde ich die scheinbar endlosen (und ziemlich komplexen) Manipulationsmöglichkeiten beim guten, alten div-Element. In diesem Zusammenhang beachte man v.a. die im Vortrag vorgestellten 3D-Miniaturstädte, die ausschließlich mit CSS realisiert wurden. Hier ist natürlich eine Menge „Mental Origami“ vonnöten: Wer es zunächst etwas bodenständiger möchte bzw. nach praktischen Lösungen für immer wiederkehrende Design-Probleme sucht, wirft derweil einen Blick in unser Bärenbuch. Soeben ist eine neue, komplett überarbeitete Fassung erschienen: Christopher Schmitt und Jørgen W. Lang versorgen orientierungbedürftige Webdesigner darin mit 150 (!) bewährten CSS-Rezepten. Die Lektüre sorgt nicht nur für die Auffrischung von Basics und die Einführung in fortgeschrittene Techniken, …

„Es ist nur eine Frage der Zeit, bis HTML5 von den meisten Browsern unterstützt wird.“ – Ein Interview mit Stefan Fröhlich

Veröffentlicht von Viviane Kramer

HTML5 und CSS3 gewinnen in der Webprogrammierung immer mehr an Bedeutung – und das zu Recht. Denn schließlich bieten beide viele Neuerungen, die das Programmieren weiter vereinfachen werden. Doch was genau macht HTML5 und CSS3 so besonders? Zu diesem Thema hat uns Stefan Fröhlich, der Übersetzer des Buchs „HTML5 & CSS3„, Frage und Antwort gestanden. HTML5 ist in aller Munde – obwohl es noch nicht von allen Browsern unterstützt wird. Warum fasziniert es dennoch so viele Entwickler? Und warum sollte man sich gerade jetzt damit beschäftigen? Es ist nur eine Frage der Zeit, bis HTML5 von den meisten Browsern unterstützt wird. Außerdem werden viele Funktionen von HTML5 und CSS3 bereits auf unzähligen Websites verwendet. Da sich meist mit nur wenigen Zeilen Code ermitteln lässt, ob die einzelnen Features von der jeweiligen Kombination aus Betriebssystem und Browser unterstützt werden, ist es zudem auch relativ einfach, entsprechende Ausweichlösungen bereitzustellen. Auf diese Weise können Entwickler schon heute Websites mit HTML5 und CSS3 erstellen. Und können diese Hilfsmittel mit der zunehmenden Unterstützung durch die jeweiligen Browser Schritt für Schritt …

Was ist CSS3?

Veröffentlicht von Viviane Kramer

CSS steht für „Cascading Style Sheet“, was übersetzt in etwa „hintereinander geschaltete Gestaltungsvorlage“ bedeutet. Stylesheets sind für die Gestaltung einer Website zuständig – und das ganz unabhängig von der Seitenstruktur, die mithilfe von HTML beschrieben wird.  Mit Cascading Style Sheets können alle Elemente einer Website zentral gesteuert werden: mit ihrer Hilfe lassen sich die Größe von Überschriften, Abstände zwischen Textabschnitten, die verwendeten Schriftarten und sogar Hintergrundbilder festlegen – und auch rasch anpassen oder ändern. Darüber hinaus dienen sie auch dazu, die Inhalte für verschiedene Ausgabemedien – wie zum Beispiel Computer, Smartphones oder zum Drucken – so aufzubreiten, dass sie gut lesbar dargestellt werden können. Ein anschauliches Beispiel dafür, wie unterschiedlich eine Website mittels CSS gestaltet werden kann, bietet der CSS Zen Garden. Hier finden sich hunderte Versionen ein und derselben Website, die Webdesigner weltweit entwickelt und dem Projekt beigesteuert haben. So lässt sich eindrucksvoll erleben, wie eine Website allein durch Anklicken einer Designvorlage ihr Aussehen verändert. Das Web ist ein dynamisches Gebilde, und auch die Technologien, auf denen es basiert, ändern sich. CSS 2.1 war …