Be KreaTief

Als ich mit dem Schreiben von Blogger Templates angefangen habe, habe ich das alles hauptsächlich im Blogger Editor selbst gemacht. Das einzige wofür ich HTML und meinen Editor auf dem Computer benutzte, waren meine "Skizzen", die im Grunde eigentlich Box-Modelle waren.
Seit diesen Anfängen habe ich nun schon so viele Templates geschrieben, dass ich ziemlich schnell feststellte, wie ungünstig das war. Ich begann damit Prototypen in HTML und CSS zu schreiben, die schon etwas mehr Style hatten.
Mittlerweile bin ich so weit, dass ich nicht einmal mehr die schlussendliche Funktionalität im Blogger Editor schreibe, sondern nur noch teste, ob das auch wirklich so ausschaut, wie ich mir das vorstelle.
In diesem Tutorial soll es darum gehen, wie man am besten einen Prototypen für ein responsives Blogger Template schreibt. Diese Vorgehensweise kann genauso gut auf andere Seiten angewendet werden. So mache ich es, wenn ich WordPress Themes schreibe, genauso.

Dies ist der erste Teil meiner Prototypen-Serie. Diese Methode verwende ich für einfache Templates, bei komplexeren, verwende ich Methode zwei, die so bald wie möglich folgt.

When I first started writing blogger templates I wrote most of it in the Blogger Editor itself. The only time I took out my editor and wrote pure HTML was when I wrote my "Sketches" which were basically models of my overall look.
Since those beginnings I wrote a lot of templates and found out pretty fast how flawed this whole workflow was. I started writing prototypes that had most of the basic styling already in it.
Now I am at a point where I write everything in my editor. A prototype that basically already looks like the end result and the blogger template with all the functionality, that only lands in the Blogger Editor to be tested if everything works out.
In this tutorial I want to go over writing a prototype which which our stylesheet and markup will be done. This workflow can also be used for other CMS' as well. That's how I do it if I write a WordPress Theme as well.

This is the first part of my prototyping series. I use this method for simple templates, when working on more complex templates, I will be using method two, which will follow as soon as possible.


Read More