This issue has been going on my nerves for quite some time, and i finally decided to write a coherent post about it in order to educate mostly Mac Designers and Developers, but to clarify things for the Windows users as well.

For no other reason except my own laziness to reproduce this on my own, i will use as example Simplebits.com website, home of one of the nice people making really nice things.

Lets get this show on the road, shall we?

First, the basic statistics; at this moment Mac covers less than 5% of internet's population. 90% is dominated by Windows machines, most of them (73%) running Windows XP. The rest is Linux and some freaky systems with too complicated names.

With that in mind, lets see how my browser renders this beautiful Simplebits site. Simplebits uses Helvetica as primary font, degrading to Arial if client's browser cannot render Helvetica. As a reminder, Macs come with Helvetica installed by default - all Macs have it. Windows do not have Helvetica installed by default!

Simplebits CSS section:

However, i, as any other designer, have Helvetica installed, so by browser will use that vector data and attempt to render the screen as follows:

Simplebits as i see it:

From this we clearly see what is wrong. Font is pixelated, kerning is screwed, and small fonts are unreadable.

If i use Firebug to remove Helvetica from CSS, leaving just Arial, things quickly get really good:

Firebug edited CSS:

Simplebits in Arial:

Now, for some explanation.

Windows XP by default uses "Standard" method for rendering fonts, meaning that only fonts of 16 pixels size and up will be anti-aliased, smaller than that will be left pixelated. I have Helvetica installed, so my browser will not jump to Arial, and will attempt to render Helvetica in small pixel size. Helvetica was never designed (of course) to be rendered on screen pixels and therefore it is impossible for it to look good under this conditions. Mac browser fonts get anti-aliased by default, and i am not even sure if you can turn it off.

Windows default factory settings:

Cleartype turned on:

If i turn the Cleartype rendering on, but remember - this is the feature that almost noone uses as it is hard as hell to find it buried deep into menus and submenus, then the Helvetica gets rendered with anti-aliasing, looking cuter than ever.

Simplebits with anti-aliased Helvetica:

In defense of Mac, not many people on Windows have Helvetica installed, meaning that this problem hits mostly designers with Helve installed whose browsers will not jump to second-on-the-list font. Microsoft's safe font list can be found here, and i would suggest to cross-reference that list with Mac safe list when designing sites in order to achieve real Bulletproof design.

Please keep in mind that this post is for educational purposes only. Simplebits site was used only because it was convenient and easier to use existing material.

If you were wondering what the hell were we up to for the past 6 months, the answer is: SplinQ.

So, what is SplinQ about?

SplinQ in it's essence is a window-shopping site collecting data from, at this moment, 420 stores for over half a million products. Registering at SplinQ will enable you that whatever item you decide to buy via SplinQ, SplinQ gives you half the revenue that site gets. There are no virtual points involved, no coupons, no imaginary items, you receive only hard cash.

On top of the basic idea, SplinQ includes socializing features enabling people to communicate, generate and share wish-lists, and do all sorts of neat tricks on the site.

Full development log and show-reel of SplinQ will be available further down the road, where we will explain our combat versus this beast, tactics we used in defeating European non-standardized database delivery, functionalities we had to utilize to strike in the heart, sharpening stones we had to obtain to sharpen our Photoshops and whatever-software-coders-use, and shields we had to manufacture to make the servers impenetrable.

SplinQ is an ongoing project, so don't be caught off guard when we release V.2.0 of this magnificent beast.

Today we spent few hours debugging search for friends functionality on one of our new projects. To make story short, we had one really complex fulltext search query. Interestingly enough, I was searching for my self (seven) in database, and I was unable to find ANY reference to user seven.

Empty set (31 ms):
SELECT * FROM t WHERE MATCH (name_nick ) AGAINST ('seven*' IN BOOLEAN MODE);

1 rows fetched (47 ms):
SELECT a FROM t WHERE name_nick like '%seven%';

1 rows fetched (47 ms):
SELECT * FROM t WHERE name_nick RLIKE '[[:<:]]seven[[:>:]]';

Be hold! MySQL Full-Text Stopwords.

You can get over this, by modifying mysql stopwords and recompiling from source (myisam/ft_static.c holds them), but I would rather not do that for now. We had to use fulltext search because like was just too damn slow for 5000+ users.

There is chance that this problem is to be fixed in future and it's been tracked as initiative to remove Natural Language Full-Text Search limitations from boolean mode. Until then, if you want to be my friend... search for Neven! :)

Dubrovnik is one of the most beautiful cities in the world. It is protected by UNESCO due to it's immense heritage, beautiful palaces, stone walls surrounding it, and all that kind of neat stuff that tourists love. Dubrovnik is the only city that was featured on CocaCola bottles - many tourism orientated cities tried that, only Dubrovnik was able to do it.

Enough with the history, it is confession time now. We made a huge mistake, on an otherwise awesome site for one of the Dubrovnik's hotels - Hotel Petka.

Classified case 012: The Ubrovnik incident.

While designing the page, we had a cool idea to use image replacement for the first letter in the sentence on the homepage. It looks nice, and has that old school feeling.

What we failed to realize is that markup for this was not done as it should have been done:

As you can see, letter D is missing from markup as it was visually replaced with image of letter D. This, of course, means nothing to Google, and the site was placed dramatically low on Google. Page 4 to be precise.

On a grand scale from 1 to FAIL, this ranks at about eleven.

Good thing is that if you Google for "hotel ubrovnik" you get Petka first. Not a big comfort, but still, eh ...

In any case, we are fixing this and hoping that Google will reindex the site and give it it's deserved position.

UPDATE: less than 6 hours after i wrote this post, Google crawled us, and now this post is rated first, pushing Petka to second place if you search "hotel ubrovnik".

Sebastian Bergmann posted pretty cool set of benchmarks on his blog. It's funny to see almost 2300% increase in speed from PHP 3.0.18 to PHP 5.3 :)

Last few days something is incredible wrong with broadband in Croatia. Most likely our beloved T-COM upgraded some nasty firmware on their routers. Anyways, we can't go to Google or any of his services. Weirdest thing. How this affects us in unbelievable and it just proofs how you get used to good things. It feels like I lost a leg or something. I even caught my self typing into firefox google search bar "why I can't go to google?", and waiting for response... :)

There is also really nasty side-effect of this google/tcom connection failure. All reachable web sites that use Google Analytics javascript tracking code are broken too!