IE6-IE9: 10 years

10 years is a lot. In the Web, 10 years is quite a lot. IE6 was one of the best browsers when it hit the market in 2000-2001. Then it slowly started to transform itself into a brake for new technologies on the Web. While all other browsers (Mozilla, Mozilla Firefox, Opera, Safari, and now Chrome) were adopting new technologies at a fast pace and improving their rendering of web pages, IE6 remained un-changed.

IE6-7-8-...9!

Microsoft now say that IE6 is history. And that IE9 (that officially was released today and is available for all users of Windows Vista and Windows 7) is much better.

We’ll see! :)

Typeface vs. Font

TYPEFACE:

A typeface is a single set of characters that share stylistic unity. A typeface usually comprises an alphabet of letters, numbers, punctuation and diacritical marks.

FONT:

Old school typographers defined a font as a complete character set of a particular typeface in one size. When type made the leap to the digital realm, a font became an electronic file that rendered the typeface in all sizes.

(via FontShop)

It’s so nice someone can explain the difference so clearly and simply! :)

[ PDF ]

Anonymous Pro – an interesting font for coders

If you write code (HTML, XHTML, CSS, JS, PHP, etc.), then the Anonymous Pro monospaced font may be of some interest to you. It’s intended for coders and developers/designers (the 0, of course, is crossed;-) and it includes Cyrillic characters.

Anonymous Pro font

You can download it for free from here:

www.ms-studio.com/FontSales/anonymouspro.html

But my personal preference for a monospaced font is Consolas. As far as I know, this new font by Microsoft can be downloaded for free, too; Consolas is readable and suitable for all kinds of code — in my case, I most often see XHTML and CSS code blocks in it:)

“Jeffrey Zeldman is now following you on Twitter”

…or how Twitter can be actually of some use;-)

{ Some drafts in my blog were hidden really deep, so… ;-) }

{ This story developed somewhere in July 2009… }

Twitter is an amazing… media? Social network? Means for ultra-fast transfer of news, wisdom, stupid things and “important” things like “I am drinking coffee now”? Something like IRC, but with an option for SMS, filtering, search, etc.?

Twitter is all of this simultaneously! :-)

Jeffrey Zeldman's hat…I am a Web designer and (partially) a geek, so it was very interesting for me to follow the discussion in two of the latest publications of Jeffrey Zeldman:

www.zeldman.com/2009/07/02/xhtml-wtf/
www.zeldman.com/2009/07/07/in-defense-of-web-developers/

…where the consequences of discontinuing the work on the XHTML 2 standard, and what will happen with XHTML 1.0, HTML 4.01, as well as with the new HTML 5, were passionately discussed.

At some point, in the Zeldman’s website, a strange bug appeared (in Firefox 3/Win): somewhere around 3/4 of the page with his last post and the numerous comments below, the content suddenly was disappearing (screenshot). Without a reason. The page itself was validating perfectly and there were no problems with the encoding or the HTML/CSS code.

Jeffrey noticed the problem, too, and was trying to solve it for quite a long time. The assumption that a problematic pingback with UTF-16 encoding was the culprit, was not confirmed.

I tried to investigate, too, out of curiosity, without any positive results, though.

Finally, I assumed that there’s a CSS bug in the rendering engine of Firefox/Win which (maybe) can be fixed with some new CSS rule. One of the readers of Zeldman’s blog mentioned that he tried to check something with Firebug, so I quickly made a test page + CSS file with the rule which (supposedly) was fixing this issue; then I tested in Firefox 3.0.11/WinXP. The problem was gone! :-)

Only one line fixed the problem for Firefox:

div#wrapper {
overflow: visible;
}

Then I’ve spent some more time to test in detail if the change did not affect any other popular browser (Opera 9.6, Safari 4, Chrome 2, IE7, IE6) and finally, I wrote to Zeldman, proposing him the fix for Firefox.

Zeldman replied:

@optimiced Will try as soon as I’m back on my feet. Thanks wise one.

Soon after that, Zeldman implemented the fix, and the design was fixed! :-)

Unfortunately, the fix introduced a new bug — the background of the page was “flashing” for a second or two on each page load because overflow: visible caused the background of the element #wrapper to load with a little delay (before: overflow: auto).

Well, after some more thought invested, I and another reader suggested two additional simple CSS solutions, which at a later stage proved to play very well together and fixed the “flashing problem” in all browsers — Firefox and Safari included! :-)

Last (but not least), I would like to say that Jeffrey Zeldman is a cool dude! After the whole story with the CSS bugs in Firefox and the red background flash was over, Jeffrey thanked me personally and added me to his Twitter list, and then promised to send me the new (third) edition of his popular book about Web Standards, as a present! (I think that somewhere in the CSS on zeldman.com there are some more acknowledgments hidden;-)

It’s always nice to communicate with such people, even if with messages only 140 characters long! ;-)

So, I am pleased to say, too: “Jeffrey, thank you!” :-)

* * *

Ah, and finally, why did I start this blog post with the question, what exactly is Twitter?

Because, after using Twitter for at least a few years, I can say that Twitter allows quick, precise communication in a new way. Comments in blogs, feedback forms, emails, allow us to communicate, too, but Twitter is something different. Something, which I cannot define precisely, but something, which fulfills its purpose and is also fun!

This is why you can (still) find me on Twitter (but you won’t probably find me on Facebook)… and, you can find me on my personal blog, of course! ;-p

W3C HTML icons (by Veerle Pieters), PNG+alpha

I wrote recently about some very nice HTML icons which Veerle Pieters created and released for free.

W3C HTML icon from Veerle, PNG

Unfortunately, the icons were in JPG format, which restricted their possible uses (they were also released in MacOS icon type, but this format cannot be used in the Web, obviously).

To my deligh, after a few commenters (including myself;-) asked for a PNG+alpha version, Veerle most happily shared it with us, too! :-)

You can download the icons from her website and/or from here (the distribution of the icons is absolutely free and unlimited, as well as their use):

download all icons in one ZIP archive, PNG+alpha

Cool! :-)

New W3C HTML icons (from Veerle)

Veerle just released a set of great looking HTML icons:

W3C HTML icon from Veerle, variant 1

W3C HTML icon from Veerle, variant 2

W3C HTML icon from Veerle, variant 3

W3C HTML icon from Veerle, variant 4

If you are a Mac user (and Web designer), then you maybe use the Markup Validator S.A.C. — this app is a stand-alone version of the W3C Markup Validator. The new icons from Veerle could replace the default icon of this application in your MacOS X dock.

the icons (compared)On the left you can see the current icon of the Markup Validator S.A.C. You may compare it with the variants that Veerle has made. Personally, I like her design of the icons much more! :-)

Plus, she is releasing the icon set for free to the community!

Unfortunately, the icon set is available for Mac users only. It’s a pity, because I think that these icons could be used in many more ways… Of course, you can use the JPG variants (which are high quality), but without the optional alpha transparency, which is available in the PNG format only…

If you want to use any of the icons on MacOS X, a link for download is available in the Veerle’s blog post:

http://veerle.duoh.com/blog/comments/a_new_icon_for_markup_validator_s.a.c/

(There you will also find instructions, how you can change the icon of Markup Validator S.A.C. in the dock of MacOS X.)

As to the JPG variants, you can copy them manually from Veerle’s blog, or download them as one ZIP file, which I made for my own convenience (as the icons are released for free):

download all icons in one ZIP archive, JPG format

Finally, what can I say? Another great design from Veerle! :-)

[UPDATE] Same icons, but in PNG+alpha file format. Cool! :)

XHTML 1.0 vs. HTML 4.01 (or HTML 5)?

If you are a professional Web designer and create HTML/CSS code by hand for living, then you might be interested in the fact that Dave Shea switched from XHTML 1.0 to HTML 4.01.

It’s a fact that:

1) Lately, the HTML 5 standard gains up in speed.

2) XHTML 2.0 probably will never become a successor to XHTML 1.0. In fact, XHTML 2.0 probably will never exist at all.

3) Quite a few prominent Web designers and CSS/HTML coders are abandoning XHTML 1.0 and go back to HTML 4.01 (some of them even experiment very seriously with HTML 5).

What HTML standard for documents do you prefer? And am I the only one who (still) prefers XHTML 1.0 over HTML 4.01? :-)

It followed the interesting discussion at mezzoblue — I managed to read almost all of the comments there!

But, sometimes, it is not very clear to me as to where & why are going the Web Standards, guided by W3C.

After HTML 3.2, HTML 4.01 came, then the XHTML 1.0 standard was adopted, and now HTML 5 is developed? There’s almost no logic behind the versioning; plus, we have first the HTML language (which, in turn, derived from SGML), then W3C decided that it would be a great idea to combine XML + HTML (and so, XHTML 1.0 was ‘born’), and finally, they turn back to the idea of ‘pure’ HTML, and in the new standard (HTML 5), the ‘X’ is missing…

Read more

What MySQL collation to choose: utf8_unicode_ci or utf8_general_ci?

I was searching for some time the answer to the following question:

What’s the difference between utf8_unicode_ci and utf8_general_ci (MySQL collations)?

I have almost no knowledge in PHP/MySQL, so I have read with the great interest the following info:

http://forums.mysql.com/read.php?103,187048,188748#msg-188748

Generally speaking, it looks like the difference between these two collations is not too big; also, it appears that utf8_unicode_ci is more precise, and utf8_general_ci is faster.

I suppose also that if you plan to write in more than one language and/or to write in a language other than US/UK English, then utf8_unicode_ci is the better choice to make — for example, the German letter “ß” will be correctly sorted near “ss” (this won’t hapen, if you use utf8_general_ci collation). There are other differences, too, so drop a look at the article, if the topic interests you! :-)