life, web development and everything
The topic of automatic visual testing returns to me like a boomerang.
There are a lot of tools for automatic testing of the back-end (unit tests, integration tests, etc...) in every programming language you can possibly imagine. They even have the whole methodology of Test Driven Development. For testing the front-end we have Selenium or Ruby based Watir, but still all they test is the functionality of the web application or a website, and not the visual look of it.
I'd like a tool, that will automagically tell me, if my web application still looks how it was intended to look. I need to know if my CSS refactoring didn't break the whole thing somewhere on a page I don't even look at, when I'm manually clicking.
Is it really possible to automate visual testing? And if it is, will it be useful?
Humans are really complicated beings. Relations between humans are even more complicated...
A while ago I've written an article about my small genealogy project. After quite fast implementation of data gathering tools (thanks to django admin panel) I got a little stuck with trying to visualize family tree.
Last week Chris Coyier blogged about those CSS “Ah-ha!” moments, when you realise how cool and powerful stylesheets are. On the same day I had one of my CSS "O RLY?" moments. This one was all about inline-block value of the display property.
In every family there is such a time when someone starts to looking into family roots. It seems that it's that time for my family, as my father created lots of paper sheets with quite random pack of names and lines joining them.
He asked:
Bartek, maybe you will write some app to organize this thing, keep it all together? In few months I'll forget who is who on this papers.
What could I answer?
Yeay! Why not! Seems like fun.
But, as once I was told that good programmer is a lazy programmer. So as a lazy programmer I started with googling some genealogy software and on-line family trees :)
That was a busy weekend. It all started with a little inscape play with the blog's logo...
When it came to the logo I thought it would be nice to get a cool .com domain for this site but of course such names as bodybuilding.com or even bodybuildingblog.com where already registered. After hours of meditations and throwing far away thoughts like bodybuildinggeek.com I finally came to itsabodybuildingblog.com.
Then I added some basic layout... and basic layout quickly turned into typography fun and positioning magic. After another hours of sitting inside styles.css, after being called stupid and maniac by my fiancée for few times I was kinda satisfied with what I see on my screen.
It's not surprising that whole satisfaction just burned out when I launched IE6... Another hour or two of debugging and fixing and ...
Voilà!
I guess I'm not ashamed any more to show this babe to the world.
Last time we where discussing semantic mark-up of blog's home page. With all this knowledge we can smoothly move forward and mark up the page with full article contents and visitors' comments.
The process will be very similar to one we used for home page, so if you haven't read previous article, please do it as it will be really helpful. If you already been there don't hesitate and read on :)
When you start to build a website and you have a general idea about content it will contain, you very often move on to designing the visual part of it and later this visualisation gets marked up into (X)HTML styled with CSS. It's not a bad way to do it, but in such process in most cases mark-up gets focused much more on the visual part of the design than on semantic meaning of the content.
That's why the process of building a website should be split into clear steps. I'm just testing such iteration approach while creating this blog and I'll document every step in further posts. Marking up the home page is the first one to go.
General concept of this blog was growing in my mind since months and when I finally decided to start writing it I found it really hard to find a place in the web that will give me everything I wanted...
HAI
CAN HAS STDIO?
VISIBLE "HAI WORLD!"
KTHXBYE