kulturbanause Blog

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


Vom Design zum responsive Design: Responsive Grid System

Das Responsive Grid System ist eine Zusammenstellung von CSS-Klassen die euch helfen eine Website um ein flexibles Raster zu ergänzen und die Seite somit für Smartphones und Tablets zu optimieren. Das System lässt sich auch noch nach der Gestaltungs- oder Coding-Phase anwenden und zudem muss die Anzahl der Rasterspalten nicht global für die gesamte Seite festgelegt werden. Ein interessanter Ansatz.

Beitrag zu Ende lesen

Komfortable Form-Validierung ohne Änderungen am HTML-Code: jQuery Walidate

jQuery Walidation Logo / Icon

Um Website-Formulare auf Fehleingaben zu prüfen existieren unzählige Validierungs-Plugins und Tools. Leider sind viele dieser Tools kompliziert zu implementieren und erfordern zudem Anpassungen am HTML-Quellcode des Formulars.
Wenn das Formular allerdings dynamisch generiert wird oder über ein Plugin erstellt wurde, ist es häufig nicht möglich den HTML-Code anzupassen. Hier eilt das jQuery-Plugin „jQuery Walidate“ zur Hilfe und ermöglicht die Validierung bestehender HTML-Formulare ohne Änderungen am Quellcode vornehmen zu müssen. Neben einer einfachen Integration des Plugins in die Website stehen umfangreiche Funktionen wie individuelle Fehlermeldungen etc. zur Verfügung.

Beitrag zu Ende lesen

CSS-Verläufe aus Bildern generieren: CSS Gradient Finder

Mit dem Online Tool „CSS Gradient Finder“ könnt ihr auf CSS basierende, lineare Farbverläufe auf Grundlage eines Bildes automatisch erstellen lassen.
Per Drag & Drop könnt ihr eine Grafik mit dem entsprechenden Verlauf in das Tool laden, anschließend erhaltet ihr als Ausgabe den entsprechenden CSS-Quellcode inkl. der verschiedenen Vendor-Prefixes für die unterschiedlichen Browser.

Beitrag zu Ende lesen

Tabellen im Responsive Webdesign

Wer schon einmal eine Website mit tabellarischen Inhalten für mobile Endgeräte optimieren musste weiß: Tabellen und responsive Webdesign passen nicht gut zusammen. Ich spreche hier natürlich nicht von Tabellen die für das Layout missbraucht wurden (es dürfte klar sein, dass Tabellen NIE im Layout verwendet werden) sondern von Inhalten die in Form eine Tabelle abgebildet werden sollen. Solche Tabellen eignen sich nicht gut für die Darstellung auf einem kleinen Bildschirm und werden recht schnell unübersichtlich.
Ich möchte euch in diesem Beitrag verschiedene Lösungsansätze für Tabellen im Responsive Design vorstellen und die jeweiligen Vor- und Nachteile aufzeigen.

Beitrag zu Ende lesen

Responsify.it – Responsive Grid Template

Mit dem Online-Tool Responsify.it könnt ihr ein umfangreiches Template als Grundlage für eine responsive Website erstellen. Über die Eingabemaske lassen sich verschiedene Breakpoints sowie die Anzahl der Spalten und der Abstand zwischen den Spalten einstellen. Die Wahl zwischen einem prozent- und einem pixelbasierten Raster habt ihr allerdings nicht, das Raster basiert immer auf flexiblen Spalten (was ja auch die schönere Variante ist).

Beitrag zu Ende lesen

Warum Google+ für Unternehmen so wichtig ist

Im heutigen Gastbeitrag erklärt Annina von twago warum Unternehmen sich mit Google+ beschäftigen sollten und wo der Vorteil der Plattform gegenüber Facebook & Co. liegt.

An Google+ scheiden sich die Geister: Während die einen von einer „Geisterstadt“ sprechen, sehen die anderen in diesem sozialen Netzwerk die Zukunft.
Doch warum sollte ein Unternehmen den Schritt tun und ein Profil auf Google+ anlegen? Haben wir nicht schon alle genug mit der Betreuung von Facebook Profilen, Twitter, Pinterest und diversen zusätzlichen Blogs zu tun? Brauchen wir wirklich noch mehr Social Media?
Die Frage muss sich wohl letztendlich jedes Unternehmen selbst beantworten. Trotzdem gibt es einige gute Gründe warum Google+, das erst seit Ende Juni 2011 existiert, für ein Unternehmen wichtig ist und warum Google+ auf jeden Fall bei der Entscheidung bedacht werden sollte. Dabei ist der erste und wichtigste Aspekt so einfach wie offensichtlich zugleich: Google.

Beitrag zu Ende lesen