Webdesign

(Kostenlose) Services

Stitches: Kostenloser CSS-Sprite-Generator (auch zum Selberhosten)

30. März 2015
von
Stitches: Kostenloser CSS-Sprite-Generator (auch zum Selberhosten)

Bei der Entwicklung von Websites gilt ja bekanntlich: Je weniger Dateien geladen werden müssen, desto besser ist das für die Ladegeschwindigkeit und den Seitenaufbau. Daher werden gerade Icons und andere vor allem kleine Grafiken oftmals nicht als Einzeldateien angelegt, sondern als Sprite. Dabei werden mehrere Grafiken in einer Bilddatei zusammengefasst. Die Erstellung eines Sprites per Hand erfordert etwas Arbeit. Die Grafiken werden in einer Bilddatei angeordnet....

Design

Flickity: Schicke Galerien auf allen Geräten – responsiv und mit Gestensteuerung

28. März 2015
von
Flickity: Schicke Galerien auf allen Geräten – responsiv und mit Gestensteuerung

Es gibt zahlreiche Lösungen, um Galerien per JavaScript zu realisieren. Mal überzeugt die Bedienung nicht, mal ist der Funktionsumfang eher bescheiden. „Flickity“ hingegen ist ein zeitgemäßes JavaScript-Framework für Galerien, welches nicht nur am Desktop funktioniert, sondern auch für Mobilgeräte bestens geeignet ist. Die Galerie ist responsiv und lässt sich sowohl per Maus als auch per Gesten bedienen – bei Bedarf auch per Tastatur. Dank CSS3 kann man...

Boilerplates & andere Tools

Voll im Trend: 9 Material Design Frameworks für moderne Webseiten

27. März 2015
von
Voll im Trend: 9 Material Design Frameworks für moderne Webseiten

Google hat mit seinem für Android entwickelten Material Design einen der größten Design-Trends der letzten Zeit angestoßen. Nach langer Zeit sieht Android endlich gut aus. Viele meinen, dass das Design mittlerweile mit iOS gut mithalten kann. Doch nicht nur mobile Apps werden heute in Material Design umgesetzt, auch immer mehr Webseiten nutzen das neue Design. Um das Design gut und ansprechend umsetzen zu können, kann man...

Cartoons

Cartoon: Wenn Webdesigner Metzger wären [#008]

23. März 2015
von
Cartoon: Wenn Webdesigner Metzger wären [#008]

Wenn man als Webdesigner/-entwickler arbeitet, muss man sich ein dickes Fell anschaffen. Das gilt vor allem dann, wenn man freiberuflich unterwegs ist. Schafft man das nicht, ist langfristig die geistige Gesundheit in Gefahr. Ich bewege mich seit Anfang der Neunziger in dieser Branche und habe in dieser Zeit die ulkigsten Kunden kennenlernen dürfen. Mein Rezept für den Erhalt des Verstandes ist: Lachen. Ich weigere...

Design

Webdesign: Transparenz als Gestaltungselement (mit Best Practices)

21. März 2015
von
Webdesign: Transparenz als Gestaltungselement (mit Best Practices)

Transparenz ist mittlerweile ein großer Trend im Webdesign, nachdem der überwiegende Teil der Browser diese auch darstellen kann. Transparente Teile einer Website werden entweder eingesetzt, um Akzente zu setzen oder den Fokus auf einen bestimmten Bereich zu lenken. Dieses können etwa Bilder, aber auch Textpassagen sein. Leider kann man bei der Entwicklung von Webseiten mit transparenten Effekten einiges falsch machen. Daher zeigen wir Ihnen...

Design

HTML5 und CSS3: So machen Sie Ihre Website fit für hochauflösende Displays

16. März 2015
von
HTML5 und CSS3: So machen Sie Ihre Website fit für hochauflösende Displays

Als Apple vor einigen Jahren anfing, seine iPhones, iPads und MacBooks mit hochauflösenden Displays – den sogenannten Retina-Displays – auszustatten, hat das zu einer deutlichen Verbesserung der Darstellungsqualität geführt. Einzelne Pixel sind auf diesen Displays nicht mehr als solche zu erkennen. Mittlerweile sind hochauflösende Displays längst keine Besonderheit mehr. Vor allem aktuelle Mobilgeräte sind schon in der Mittelklasse hochauflösend. Während viele Apps für Mobilgeräte...

Apps

Retrospektive #5: 90 kostenlose Design-Ressourcen für mobile Layouts

15. März 2015
von
Retrospektive #5: 90 kostenlose Design-Ressourcen für mobile Layouts

Intelligente Navicons, schicke Slide-out-Menüs, starke Hintergründe, sowie eine generell weit durchdachtere Ausnutzung der nur sehr begrenzt verfügbaren Bildschirmfläche machen das Design für mobile Geräte aus. So gut wie die Konzepte mobil funktionieren, so gut sind sie übertragbar auf das konventionelle Design für den Desktop – wenn auch nur zufällig. Wie so oft, setzen sich gute Lösungen auch dort durch, wo man sie ursprünglich nicht...

JavaScript & jQuery

Ich dreh am Rad: Wheelnav.js erlaubt kreisrunde Navigationsmenüs

6. März 2015
von
Ich dreh am Rad: Wheelnav.js erlaubt kreisrunde Navigationsmenüs

Eine Navigation muss nicht immer horizontal oder vertikal angeordnet sein. Sie kann sich durchaus auch mal im Kreis drehen. Besonders einfach geht das mit der Javascript-Bibliothek Wheelnav.js. Diese erlaubt es, Menüs kreisförmig anzuordnen. Auswahlen tätigt man durch Drehen. Wheelnav.js basiert auf Raphaël.js, welches das Zeichnen von SVG-Grafiken per Javascript ermöglicht. Kickstart: Bibliotheken einbinden und Elemente auszeichnen Bevor es losgeht, müssen Wheelnav.js und Raphaël.js in ein...

(Kostenlose) Services

10 kostenlose Tools fürs Schriftdesign: So erstellen Sie Ihre eigene Schriftart

4. März 2015
von
10 kostenlose Tools fürs Schriftdesign: So erstellen Sie Ihre eigene Schriftart

Schriftarten sind ein sehr kraftvoller, individueller Weg, um Inhalte darzustellen. Sie haben direkten Einfluss darauf, wie wir Inhalte wahrnehmen und interpretieren. Typografie ist heutzutage sehr beliebt, auch und gerade im Zusammenspiel mit responsivem Webdesign, für das ganz eigene Regeln gelten. Es gibt eine Unzahl von freien Fonts online, denken wir nur an das mittlerweile sehr groß gewordene Google Fonts Verzeichnis mit seinen (zur Zeit)...

JavaScript & jQuery

HTML5: Screen-Orientation-API – Bildschirm drehen mit JavaScript

27. Februar 2015
von
HTML5: Screen-Orientation-API – Bildschirm drehen mit JavaScript

Über Media Queries kann man das Aussehen einer Website abhängig machen von der Bildschirmorientierung eines Smartphones oder Tablets. Doch gelegentlich kann es vorkommen, dass eine Website nur für eine ganz bestimmte Orientierung vorgesehen ist – Portrait oder Landscape. Bei nativen Apps lässt sich für diesen Fall ein Format vorgeben. Dann wird die App unabhängig von der tatsächlichen Ausrichtung des Gerätes ausschließlich in dem Vorgabemodus dargestellt. Mit...