kulturbanause Blog

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


WordPress-Widgets mit individuellen CSS-Klassen und IDs auszeichnen

Mit den Widgets von WordPress lässt sich eine Website sehr einfach individualisieren und erweitern. Selbst das simple Text-Widget ermöglicht durch die Eingabe von HTML-Markup recht umfangreiche Anpassungen. Ärgerlich in diesem Zusammenhang ist lediglich, dass Widgets keine individuelle ID besitzen und daher auch nicht gezielt angesprochen werden können. Mit folgendem Mini-Snippet erweitert Ihr Widgets um die fehlenden Angaben.

Beitrag zu Ende lesen

CSS-Code aus Photoshop exportieren. Verschiedene Lösungen im Vergleich.

Auch wenn der moderne Workflow nicht mehr so linear verläuft wie noch vor ein paar Jahren (Design → Coding), wird Photoshop für Webdesigner immer interessanter. Zwar werden mittlerweile viele Grafiken über CSS3 realisiert, doch gestalten lässt es sich in Photoshop einfach besser. Und seit Version 13.1 exportiert Photoshop auch CSS-Code. Ich möchte euch in diesem Beitrag verschiedene Lösungen vorstellen, mit denen sich Photoshop-Grafiken in CSS3-Code umwandeln lassen.

Beitrag zu Ende lesen

Flexible Ribbons mit CSS

Ribbons sind im Web ein sehr beliebtes Gestaltungselement und die Umsetzung mit CSS hat einige Vorteile. Einerseits eignet sich die CSS-Grafik für den Einsatz auf hochauflösenden Displays (HiDPI, Retina), andererseits kann dem Ribbon eine flexible Breite in Prozent zugewiesen werden. Das Zielelement kann somit im Responsive Webdesign verwendet werden und passt sich flexibel der Displaybreite an.

Beitrag zu Ende lesen