Auch mal aus dem Raster ausbrechen

In der letzten Woche wurde ich von unserem Designer mal wieder vor eine zunächst scheinbar nicht umsetzbare Aufgabe gestellt. Aber was ist schon unmöglich? 😉

Die Designvorgabe lautete, dass ein Container, der über ein Template in eine bestehende Seite und damit in einem vorgegeben „grid“ eingebunden wird, eine andere „background-color“ über das komplette Browserfenster erhalten sollte. Weiterlesen





Mit Font-Size Elemente skalieren

Benötigt man ein Interface-Element in verschiedenen Größen auf einer Website so kann dies schnell zu einer Vielzahl von CSS-Deklarationen und viel Fummelarbeit führen. Der folgende kleine Trick kann helfen, auch von Elementen mit komplexen Layout, schnell und einfach Varianten für Größen zu erstellen. Weiterlesen


Flexbox im Responsive Webdesign

Was ist Flexbox?

Flexbox ist eine Möglichkeit mit CSS3 Layouts zu gestalten. Im Grunde genommen ist es die erste richtige Möglichkeit mit CSS Layouts zu erzeugen, wenn man bedenkt das floats nie für das Gestalten von Layouts gedacht waren und sich nur mit Work-Arounds benutzten lassen (clearfix, ..). Neben Flexbox gibt es auch CSS3 Grid Layouts, aber diese sind im produktiven Einsatz aufgrund des schlechten Browser-Supports bisher uninteressant. Konzentrieren wir uns also darauf für was man Flexbox im Alltag benutzen kann 🙂 Weiterlesen


3D Modelle mit CSS mit Tridiv

Dank CSS3 und der Hardwarebeschleunigung ergeben sich mit CSS immer mehr Möglichkeiten. Eine davon sind 3D Modelle. Heute stelle ich euch einen Online Editor vor mit dem ihr euch ganz einfach eure eigenen 3D Modelle zusammen bauen könnt. Das ist kann ein sehr guter Einstieg in die Materie sein.

Weiterlesen


Material Design für Websites mit Googles Material Design Lite

material

Mit Material Design hat Google eine einheitliche Designsprache geschaffen, die alle Produkte des Unternehmens übergreift. Dabei wird von Farb-Guides bis zu Animationen eine ganze Menge abgedeckt. Nachdem die Spezifikationen für Material Design von einigen Frontend-Entwicklern für z.B. Bootstrap umgesetzt wurden, oder diese ein komplett neues Framework auf der Material Design Basis schufen, fühlte sich Google nun angehalten ein eigenes Framework zu veröffentlichen. Der Grund: Google waren die Interpretationen nicht genau genug an die Specs angepasst und man wollte im Zusammenarbeit mit dem original Material Design Team etwas Offizielles der Öffentlichkeit bieten. Dabei ist Material Design Lite entstanden.

Weiterlesen


Responsive Overlays

Ihr wollt responsive Overlays bauen und braucht eine gute Grundstruktur? Ich zeige euch heute wie ihr diese Grundstruktur schnell erstellt und sie auch bei größen Inhalt gut zu bedienen bleibt.

Weiterlesen