Website Design

For long time now, I have been playing around with the newest bleeding edge web technologies, such as client side javascript MVC frameworks (angularjs), new pre-compiler languages (coffeescript) and combination of both (spinejs). It was fun while playing. But in the end, nothing presentable came out. My repositories were all just experimental stuff.

Finally I found a real reason for a project. A motivation to change something. I am a candidate for the local city council for a ecologic party, that was co-founded by my father-in-law, more than twenty years ago.

And our party (defenitely!) needs a new homepage. So I volunteered to make one. With pleasent anticispation I searched for good looking starter templates. I wanted a green/ecological one. Shall I go with the big solution and setup a whole wordpress site, or would some static HTML pages be enough.  No wordpress would be complete overengeneering for this case. So I thought about HTML editors. Mmhh of course, there is Adobee Dreamweaver, but >600$  is just not the right price tag for ~20 member party as we are. Ok, one could still obtain the tool through other channels (you know *G*) but this time I wanted to go with open source tools only.

So I started digging, and found KompoZer, an open source multi platform WYSIWYG HTML editor that also works on Mac OS X. And it really rocks! HTML and Design SplitView, CSS editing support and publishing via FTP – everything a webdevloper needs. And then I stumbeled upon a webdeveloper’s gem: Tincr is a Chrome extension that automatically refreshes a page in Chrome, whenever the HTML or any related resource of the page (JS, CSS, images, …) changes.

I really fealt like beeing in the flow. Had the template up and running in KompoZer. Changing texts was a breeze. And the changes immidiately showed up in Chrome. But hey, what’s that? Suddenly the page design is completely screwed. What happend? What did I do worng? I found out that the page design is broken everytime I changed any CSS via KompoZer.

After some diff-ing of CSS files I learned that KompoZer completely loads a CSS file. If it doesn’t understand some modern CSS statements (like rounded-borders), then it ignores them. But when saving changed CSS it only saves back what it understood. And leaves out the rest :-(

So back to basics and Text Editor. But actually that’s not to bad. In the end I always re-edited the created HTML anyway. I am currently testing Texstatic as a programming editor on mac. And it works quite well. And comined with Tincr and the Chrom developer view web developping is quite fun. Tincr can even autosave changes to the CSS that you do in the Chrome developer pane!