kulturbanause Blog

Responsive Design, WordPress, Konzeption, HTML, CSS, JS & UX/UI …

Tools


Responsinator – mobile Viewports simulieren

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

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

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

Stylesheets aus HTML-Markup generieren: Bear CSS

Die meisten Webdesigner werden beim Coding einer Seite ähnlich vorgehen. Sofern nicht direkt ein Template (z.B. Boilerplate) zum Einsatz kommt, schreibt man zunächst das HTML-Markup. Wenn die HTML-Struktur steht, wird die CSS-Datei angelegt und alles über das Stylesheet gestaltet.
Wenn auch ihr Websites nach diesem Muster umsetzt, kann Bear CSS euren Workflow spürbar beschleunigen.

Beitrag zu Ende lesen

Welche HTML5-Features kann ich heute schon nutzen? HTML5 please!

HTML5 und CSS3 bieten uns umfangreiche und spannende neue Funktionen, nur leider ist man sich häufig nicht sicher welcher Browser welchen Befehl wie interpretiert. Vor einiger Zeit habe ich euch bereits das Tool Can I Use vorgestellt, mit dem ihr prüfen könnt ob ein Befehl unterstützt wird und ob ihr Vendor-Prefixes benutzen müsst. HTML Please ist ein weiteres Tool dieser Art. Auch hier gebt ihr einen Befehl ein und erhaltet Informationen über die Einsatzmöglichkeiten. Im Gegensatz zu vielen anderen Diensten findet ihr hier jedoch auch sehr detaillierte Informationen über notwendige Fallbacks, Polyfills oder Prefixes.

Beitrag zu Ende lesen

CSS-Dokumente perfekt strukturieren: ProCSSor

Wer als Webdesigner im Team mit anderen Entwicklern arbeitet, hat sicher schon die ein oder andere Diskussion zum Thema Code-Design geführt. Insbesondere bei der Strukturierung von CSS-Code können die Meinungen stark auseinander driften. Sollen die CSS-Eigenschaften nun untereinander oder nebeneinander geschrieben werden? Gehören Leerzeilen zwischen die Eigenschaften oder soll vielleicht sogar alles in einer Zeile geschrieben werden? Und wo ist der beste Platz für öffnende und schließende Klammern?
Damit jeder Entwickler arbeiten kann wie es ihm am besten gefällt wurde der Online-Dienst ProCSSor ins Leben gerufen.

Beitrag zu Ende lesen