Tools

Die Entwicklung moderner Websites wird immer komplexer und ohne die unzähligen Tools und Scripte würde die Umsetzung eines Projekts noch länger dauern. Gerade für lästigen Aufgaben werden praktische Tools entwickelt um dem Webdesigner unter die Arme zu greifen. Eine umfangreiche Liste aller uns bekannten Tools findest du übrigens auf Best Webdesign Tools.

Gridpak – Responsive Grid Generator

gridpak-responsive-grid-generator

Mit Gridpak wurde ein neues, sehr hilfreiches Tool zur Erstellung von flexiblen Gestaltungsrastern veröffentlicht. Gridpak bietet im Gegensatz zu anderen Tools dieser Art keine vordefinierten Raster sondern unterstützt Webdesigner dabei eigene flexible Gestaltungsgrundlagen zu erstellen.
Neben der Gesamtbreite des Rasters, der Anzahl an Spalten, sowie dem Innen- Außenabstand könnt ihr mit Gridpak individuelle Breakpoints festlegen. Diese Breakpoints werden anschließend über CSS3 Media Queries angesprochen.

Beitrag zu Ende lesen

Browser-Statistik + Multi-Screen-Raster: 978 Grid System

grid-system-978-responsive

Hilfsmittel für Responsive- bzw. Multi-Screen-Design schießen ja im Moment wie Pilze aus dem Boden. Ich zeigt euch hier so viele davon weil ich der Meinung bin, dass man nur dann das beste Tool finden kann wenn man auch eine Auswahl hat. Und abgesehen davon sind die Vorlieben und Anforderungen sehr individuell und man muss ganz einfach schauen welches Tool einem persönlich den Workflow am ehesten erleichtert.
Das 978 Grid System bietet ein flexibles Raster mit fünf vordefinierten Breakpoints. Mindestens genauso interessant sind jedoch die Browser-Statistiken die das Entwicklerteam als Grundlage für die sechs Breakpoint zu Rate gezogen hat.

Beitrag zu Ende lesen

CSS-Sprites online erstellen – Spritepad

spritepad-logo

Moderne Websites kommen um den Einsatz von CSS-Sprites nicht mehr herum. Um die Performance einer Seite zu verbessern, gehört die Technologie längst zu den Basics. Leider ist es zeitaufwändig und lästig eine Sprite zu erstellen: Zunächst müssen die gewünschten Grafiken auf der Arbeitsfläche positioniert werden, anschließend werden die Abmessungen und Koordinaten in das CSS-Dokument übernommen.
Spritepad vereinfacht (wie auch andere Tools) die Arbeit mit Sprites. Im Gegensatz zu allen anderen mir bekannten Online-Anwendungen funktioniert jedoch bei Spritepad alles genau so wie man es sich wünscht.

Beitrag zu Ende lesen

Responsinator – mobile Viewports simulieren

responsinator

Der Responsinator ist ein weiteres Tools zur Simulation von Viewports für responsive Websites. Wie auch bei den meisten anderen Diensten gebt ihr eine URL ein und erhaltet als Ausgabe die Ansicht der verschiedenen mobilen Endgeräte wie iPhone, Android oder Kindle. Innerhalb der Geräte lässt sich die Website zusätzlich scrollen, so dass ihr sowohl den Falz beurteilen, als auch die vollständige Website überprüfen könnt.

Beitrag zu Ende lesen

Flexible jQuery-Slideshow mit Generator: Rhinoslider

rhinoslider-logo-icon

Vor einiger Zeit bin ich auf einen neuen jQuery-Slider aufmerksam gemacht worden den ich euch in diesem Beitrag kurz vorstellen möchte: Den Rhinoslider. Im Gegensatz zu vielen anderen Slidern lässt sich der Rhinoslider unkompliziert und sehr flexibel individualisieren und überzeugt darüber hinaus durch einen Online-Generator mit Live-Preview.

Beitrag zu Ende lesen

Bugfixing für CSS-Resets: CSS Decompactor

css-reset

Die meisten Webdesigner werden in ihrem Stylesheet einen sog. CSS-Reset verwenden. Dieser Codeabschnitt zu Beginn des Dokuments, normt die unterschiedlichen Grundeinstellungen verschiedener Browser und erleichtert dadurch die Arbeit mit CSS enorm. Wenn allerdings einmal etwas nicht funktioniert, kann es schwierig werden herauszufinden welche Eigenschaft des Resets den Fehler verursacht hat. Der Decompactor hilft.

Beitrag zu Ende lesen

Lokale Bildkompression für Windows und Mac

image-optim-png-gauntlet

Ich habe euch in den vergangenen Monaten diverse Online-Tools zur Kompression von Grafiken vorgestellt, und die Dienste in einem Artikel sogar miteinander verglichen. Heute stelle ich zwei Programme vor, die euch ebenfalls die Bildkompression abnehmen, aber lokal auf eurem Rechner installiert werden. Was die Vor- und Nachteile einer lokalen Anwendung sind, möchte ich in diesem Artikel kurz beschreiben.

Beitrag zu Ende lesen