kulturbanause Blog

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


Individuelle Arbeitsbereiche aus Photoshop CS4/CS5 heraus exportieren oder importieren

Innerhalb von Photoshop existieren seit Version CS2 die so genannten Arbeitsbereiche. Ein Arbeitsbereich fasst eine individuelle Zusammenstellung von Bedienfeldern, Tastaturkürzeln und Menüeinträgen zusammen und erleichtert es so Photoshop an die eigenen Bedürfnisse anzupassen. Neben einigen Standard-Arbeitsbereichen, die mit Photoshop zusammen ausgeliefert werden, habt ihr auch die Option eigene Arbeitsbereiche zu definieren.
Leider ist es nicht möglich aus Photoshop heraus Arbeitsbereiche zu exportieren oder zu importieren. Insbesondere wenn ihr an verschiedenen Rechnern arbeitet, ist die fehlende Exportfunktion ein echtes Manko. Mit einem kleinen PS-Script ist dieses Problem Vergangenheit.

Beitrag zu Ende lesen

Mobile Websites online testen: Media Query Previewer für iPhone und iPad

Media Queries und Responsive Web Design sind die aktuellen Buzzwords der Webdesign-Szene. Gemeint ist damit eine Website, die mithilfe der CSS-Technik "Media Query" für unterschiedliche Ausgabemedien und Displaygrößen optimiert wurde. Da die mobile Web-Nutzung rasant zunimmt, muss eine zeitgemäße Website auch auf Smartphones und Tablet-PCs eine gute Figur machen.
Wie ihr eine Website für iPhone, iPad & Co. optimiert, habe ich in einem früheren Artikel bereits beschrieben. Nun möchte ich euch ein Online-Tool vorstellen, mit dem sich die Darstellung auf iPhone und iPad simulieren lässt.

Beitrag zu Ende lesen

WordPress-Dashboard: Individuelle Widgets hinzufügen / Standard-Widgets löschen

Das WordPress-Dashboard zeigt dem Benutzer eine Übersicht verschiedener, häufig verwendeter WordPress-Funktionen. Neben einer kurzen Statistik finden sich hier unter anderem die letzten Beitragsentwürfe, eingehende Links fremder Websites und die letzten Kommentare. Für Kundenprojekte ist diese Übersicht häufig nicht brauchbar: es werden zu viele unverständliche bzw. überflüssige Informationen dargestellt. Statt dessen fehlt ein individuelles Widget um den Kunden in der Administrationsoberfläche willkommen zu heißen.

Code-Snippets anzeigen

Externe Links in die Facebook-Fanpage einbinden

Facebook ist bekannt dafür Unmengen an Daten und Verlinkungen zu sammeln, jedoch nur sehr eingeschränkt und unübersichtlich Daten wieder preiszugeben oder sich in der Sammelwut einschränken zu lassen. Unter anderem ist es nicht möglich einen Link aus der Navigation einer Facebook-Fanpage auf die eigene Website zu setzen. Zumindest nicht ohne Hack.
Mit einer Zeile JavaScript und einem individuellen iFrame-Tab lässt sich der Besucher nämlich trotzdem weiterleiten.

Beitrag zu Ende lesen

Media Queries Showcase

Webdesign-Showcases, Galerien und Pseudo-Awards gibt es mittlerweile ja einige im Web. Nun habe ich einen neuen - zur Abwechslung einmal sehr sehenswerten - Showcase kennengelernt. MediaQueri.es listet Websites, die mithilfe von CSS3 Media Queries umgesetzt wurden. Besonders gut gefällt mir die puristische Darstellung der Web-Galerie. Wenig Klicken, keine Werbung, keine Thumbnails. Einfach nur die Seiten. Nice!

Beitrag zu Ende lesen

Social Media Icons als Webfont und Vector

Ich bin kein großer Fan von Artikeln, in denen Unmengen von Social Media Icons zum Download angeboten werden. Selbst wenn ein Icon-Set noch so schön gestaltet ist, so passt es in meinen Augen selten hundertprozentig ins Layout und muss häufig noch angepasst werden. Viel brauchbarer ist eine solide Ausgangsbasis, die sich schnell und einfach individualisieren lässt.
Mit JustVector Social Icons hat Alex Peattie nun genau diese Basis geschaffen und stellt 150 monochrome Social Icons als Vector und als Webfont (!) zur Verfügung.

Beitrag zu Ende lesen

Online Grid-Generator für Photoshop und Illustrator

Der Einsatz von Gestaltungsrastern (Grids) ist aus dem modernen Webdesign nicht mehr wegzudenken. Um in der Layoutphase mit Rastern arbeiten zu können, stehen zwei Optionen zur Verfügung. Entweder greift man auf ein vordefiniertes Grid-System wie beispielsweise 960.gs zurück, oder man berechnet sich ein eigenes Raster. Ich persönlich bevorzuge die Arbeit mit einem selbst erstellten Raster, da ich so alle Inhalte der Website bestmöglich berücksichtigen kann.
Nicolaj Kirkgaard Nielsen hat nun einen Online-Grid-Generator für Photoshop und Illustrator entwickelt, der alle Funktionen abdeckt, die ich bei der Arbeit mit Gestaltungsrastern benötige.

Beitrag zu Ende lesen