Alle Beiträge von Sven Wolfermann

Artikel Responsive Workflow

Lange nix gehört von dir

Es war lange ruhig gewesen hier im Blog und ich kann auch nicht versprechen, dass sich das jetzt wieder ändern wird. Themen über die man bloggen könnte gibt es genug, so ist es nicht, aber mir hat in den letzten Monaten absolut die Zeit gefehlt (sadpanda). Erschwerend kam noch hinzu, dass ich der Seite auch längst einen neuen responsiven Anstrich verleihen wollte. Dazu bin ich leider auch noch nicht gekommen. Ich bin zu sehr mit Aufträgen und Schulungen beschäftigt, dass dafür Zeit blieb. Und Familie hab ich auch, die wollen mich auch ab und zu auch sehen. Ihr kennt das. Da ich aber an allen Ecken und Enden was zu Responsive Webdesign erzähle, hat es mich umso mehr geärgert, dass mein Blog noch im 2008er Design war – ich wollte auch nix über Responsive Webdesign im alten, fixen Layout veröffentlichen.

Anfang der Woche hab ich dann ein WordPress-Update gemacht und dabei das neue responsive Default-Theme gesehen. Na klar, ich hätte das Theme lieber selbst erstellt, aber wie eingangs bereits erwähnt, fehlt mir aktuell absolut die Zeit. Deshalb hab ich das jetzt übergangsweise aktiviert (und werde es nach und nach noch ein wenig pimpen). Morgen wird es einen neuen Artikel geben, der mir schon länger unter den Nägeln brennt.

Heute hatte ich auch die neue T3N im Briefkasten, da gibt es einen Artikel von mir über den “Responsive Workflow” zu lesen. Im Wesentlichen ist das inhaltlich der Vortrag “Responsive Webdesign Process“.

Also, danke fürs dran bleiben und stay tuned!

flattr this!

The Responsive Webdesign Process

Bei der TYPO3 Conference (T3CON12DE) in Stuttgart hatte ich die Gelegenheit einen Vortrag über den neuen Prozess in Responsive Webdesign Projekten zu sprechen. Meiner Meinung nach muss sich bei RWD Projekten der Workflow vom üblichen “Waterfall” Prinzip zu einem iterativen Prozess ändern. Einen Großteil der Arbeit in Responsive Webdesign Projekten sehe ich eher in konzeptionellem Bereich, als in der Programmierung selbst. Vielleicht ist auch mal ein ausführlicher Artikel zum Thema notwendig, hier aber erstmal die Slides: http://maddesigns.de/rwd-process/

flattr this!

Sass & Compass Introduction

Meine Workshop-Slides “Modern Frontend Development with Sass & Compass” sind nun online verfügbar.

Der drei Stunden Workshop, den ich bei den TYPO3 Developer Days in München gegeben habe, habe ich am letzten Samstag auch nochmal beim TYPO3camp Stuttgart wiederholt. Im Workshop ging es um die ersten Schritte mit Sass & Compass, sowie die hilfreichsten Features vorzustellen und einen Ausblick auf die neue Sass Version 3.2 zu geben.

Bei Fragen, pingt mich gern auf Twitter dazu an, kommentiert hier im Blog oder schreibt mir eine E-Mail

flattr this!

IE9 border-radius right-to-left (direction: rtl) Bug

Wer schon mal Layouts für arabische Websites umgesetzt hat, kennt sicherlich das HTML-Attribut “dir“, das man z.B. im body-Tag einfügen kann um die Leserichtig des Dokuments von links-nach-rechts auf rechts-nach-links zu ändern. In CSS ist die Anweisung “direction” dafür zuständig. Für beide Möglichkeiten kann man die Werte “rtl” (right-to-left) oder “ltr” (left-to-right) sowie “auto” angeben.

Hat man im Layout, runde Ecken (border-radius) nur an einer Seite, z.B. rechts abgerundet, dann sind im IE9 die Ecken allerdings links abgerundet. Der IE9 dreht von sich aus die runden Ecken im RTL-Modus um. Das ist zwar nett vom IE9, aber nicht richtig und auch nicht immer gewollt. Bei gleichmäßig abgerundeten Ecken kann man den Bug natürlich nicht nachvollziehen, deshalb fällt er selten auf. Weiterlesen

flattr this!

Livereload – ein Browser Refresh Tool

Wer kennt es nicht… man entwickelt in der IDE oder noch besser geeignet für Frontend-Entwicklung im Texteditor Sublime Text 2 und switcht dann zum Browser um die Änderungen anschließend zu überprüfen. Dazu muss man im Browser ein Reload durchführen. Livereload ist ein kleines aber sehr hilfreiches Tool für Mac (Windows in Beta-Status) was diesen Prozess beschleunigt.

Livereload erkennt Änderungen im Projektordner beim Speichern einer Datei. Ein Browser-Plugin für Chrome (oder Firefox, Safari, Mobile Safari) führt dann umgehend im Hintergrund den Refresh/Reload durch. Das erspart natürlich einige Tastenanschläge/Mausklicks. Auf größeren Bildschirmen ist es praktisch, wenn man die beiden Fenster parallel positioniert und dann die Änderung am HTML oder CSS direkt im Blick hat.
Weiterlesen

flattr this!

Das große Weihnachtsgewinnspiel – Tag 24 im CSS3 Adventskalender 2011

…im Webstandard Blog.
Großartige Preise haben uns www.galileo-videotrainings.de, www.galileo-press.de, www.addison-wesley.de, www.oreilly.de und www.webstandards-magazin.de zur Verlosung an die Leser des CSS3 Adventskalender zur Verfügung bestellt.

Was man muss tun, um gewinnen zu können?!

…wird im Webstandard-Blog erklärt: Das große Weihnachtsgewinnspiel

Allen Teilnehmern viel Spaß, Glück & natürlich auch Erfolg!

flattr this!

Compass & SASS – CSS3 Adventskalender Tag 17

Natürlich beschäftigt sich der diesjährige CSS3 Adventskalender auch mit dem Thema SASS & Compass. Was SASS & Compass so effizient macht beim Schreiben von CSS hat Mathias Schäfer (molily) bereits sehr umfassend im Webkrauts-Adventskalender-Artikel “Effiziente CSS-Entwicklung mit Sass und Compass” (Teil 1, Teil 2) gezeigt.

Neue Techniken bringen natürlicherweise auch viel Diskussion mit sich. Und nur weil man einen Pre-Processor wie SASS verwendet, schreibt man nicht automatisch besseres CSS. Es muss schon ein gewisses Verständnis von CSS vorhanden sein, damit SASS, LESS, Stylus, Closure und MyNewCssPreProcessor™ auch effizient eingesetzt werden kann.
Weiterlesen

flattr this!