Corunet. El blog

Writing CSS is good fun, but analyzing an html document to find how the page is structured us, at the very least, tiring. If you have ever had to write CSS for a blog or CMS template, you already know how time-consuming is to find every ID and CLASS in a large document. We’re going to write a simple script that takes an HTML file as input and gives us two things:

• First, some CSS and Javascript to generate a visual structure with all the names like the one that can be seen at the top image (and a javascript only version!!).
• Second, a CSS file without any rules, but with every ID and class in the document.

Let’s go:
(más…)

Sometimes I wish I could do things that were easily done with table-based layouts but quite hard using just CSS.
Following a couple of posts in a CSS related Spanish mailing list (Ovillo), a guy called Zafonic showed me how to use negative margins and positive paddings to make equal sized columns. With a couple javascript functions, I patched it to fill the full browser window. Let’s see how…
Update: Error in code solved. Thanks to the testers (más…)

Today, all the code for creating clickmaps has been uploaded to sourceforge and made public under a GPL license. You can find it at http://sourceforge.net/projects/clickmaps

Thanks to jerret, the code now uses RMagick calls and it’s usable with logs sporting more than ten thousand clicks per page.

After the interest shown about the clickmaps / heatmaps articles, I’ve decided to gather all the information into an easy to use system. What we are going to make is a complete solution that allows collecting, analyzing and showing the click information our users give us. Now, it works in web pages not center aligned and is quite a bit more robust. Read on… (más…)

NOTE: This post has been improved at The definitive heatmap
There is not much documentation about creating heat maps. I haven’t been able to find an open source solution that, giving the coordinates, creates a heat map like those shown in Etre blog
In the last post (part 1, part 2) we got a list of click positions in a web page, but the result is easy to improve.

(más…)

In the first part of Zero budget eye tracking, we wrote a small script to keep track of the clicks in a web page. A couple of days after, we already have some information to analyze. Keep on reading to know how… (más…)

Eye tracking is quite expensive. The hardware and software have astounding capabilities, but sometimes it’s hard to justify the expenditure. But there is a technique that can imitate it until certain point. You can find where your users are clicking using just a bit of javascript and server side programming. Find out how… (más…)