Nearly 8 Million Downloads on the counter. Those are the unofficial results so far from Mozilla as people around the world downloaded the newest release of their browser - Firefox 3.

There were a few blunders. As I pointed out yesterday and CNN later reported, the traffic to Mozilla’s download sites was so intense that it took down their servers for approximately 2 hours at the beginning of the release as 9,000 copies a minute were downloaded. After 5 hours they had delivered as many copies of Firefox 3 as Firefox 2 got in the entire first day of it’s launch - 1.6 million.

Article: Firefox fans celebrate release of new browser

When the sites did become available it was difficult to tell where to download the new release as the pages still prominently displayed Firefox 2, with a link to Firefox 3’s release candidates. So I, as well as many others, downloaded the latest release candidate - RC3.

But aside from the technical fumbles the day went brilliantly. A good show of marketing might on Mozilla’s part. Now Mozilla’s webpages are updated, proudly showcasing their newest work - Firefox 3.

For those who mistakenly downloaded RC3 before the page was updated do not fear, as apparently RC3 was re-released as Firefox 3, and hopefully Mozilla will include downloads of that as part of their numbers in the final attempt at the world record.

Article: Firefox 3 Identical to RC3

8 Million Downloads! Good job, Mozilla.

It is officially Download Day for Mozilla Firefox 3, your chance to help set a world record for most software downloads in a single day by downloading Mozilla’s Firefox 3 official release.

Or it would be your chance, if it didn’t appear as though Mozilla’s websites are down. I’m attempting to upgrade my browser, but have yet to get either GetFirefox.com or SpreadFirefox.com to load. Meanwhile, Mozilla.com/ appears to be working but it is slow and does not seem to be updated as of yet.

Today is Firefox Download Day, but Mozilla’s servers appear to be taking the beating of a lifetime so be forewarned it could take you a bit to get through to a download site.

Good luck, Mozilla, apparently the internet is with you!

I wrote about Download Day a little over a week ago and now the folks at Mozilla have recieved 1 Million pledges to support their attempt at a record number of downloads that will correspond with the general release of Firefox 3.

This is 1 fifth of their goal to get 5 million downloads on Download Day. Considering that some of the pledges own more than one computer, and figuring in for future pledges as well as downloads not pledged, it may be entirely plausible that Mozilla will reach their goal.

If you have not yet pledged to download Firefox 3 on Download Day then please consider doing so.

Edit: Firefox Download Day is scheduled for Tuesday, June 17th.

If you have looked on any site about design in the past couple years you will hear the cries from the purists who shout ‘Tables are Evil. Do not use tables for design! Everything must be in positioned divs.‘

This, however, is not entirely true. Ok, it’s not true at all. Tables are great. They have uses. The only proof I need for this is that tables as of HTML 5.0 are not deprecated. Well, not entirely deprecated.

The deal is this. In web design the common practice is to put your design in a table. It’s easy, simple, and gets the job done. A common two column site would look like this.

<table width=”770″ height=”100%” cellpadding=5 cellspacing=0 bgcolor=”#FFF”>
<tr>
<td colspan=2><h1>My site’s name</h1></td>
</tr>
<tr>
<td width=”140″>
<br><a href=”LINK”>Link Text</a><!– the rest of this is the side column
</td>
<td width=”*”>
<p>This is my content. I talk here and put my ad copy and stuff here.
</td>
</tr>
</table>

Now, there are a few things wrong with that code right off the bat without it even being a table.

1. There is, and never has been, a height attribute for a table. If I’m wrong and once upon a time there was a height attribute for tables it has been long gone ages ago. Internet explorer will parse it as if there were, but any HTML compliant browser will say ‘uh, what are you doing?‘. You simply can’t put height in a table.
2. While on the subject of the height attribute, it has been deprecated for all tags that did at one time support it. So no matter what, anywhere, in any design it is now considered bad form to put a height attribute in the tag. You are supposed to put it in the CSS.
3. The same applies to the width. Tables did at one time support width but this is deprecated now. It works fine, as any designer will tell you. Deprecation simply means you are no longer supposed to do it. That goes for the width attribute in the TD tag as well as in the TABLE.
4. If this is an XHTML document the 2 in the colspan must be in quotation marks (”). It won’t be compliant without them.
5. Cellspacing, Cellpadding, and Bgcolor all all deprecated. The idea behind all this deprecation is that you are now supposed to use CSS to do the bulk of your designing. They all work fine, as browsers are meant to be backwards compatible, but if you are looking to maintain standards then don’t use them.

Those all aside, this table, as a whole, is deprecated. Not the tags, the tags are fine. It’s using tables to layout your website that is deprecated. In the defining for HTML 5.0 there is a note.

HTML RFC

we need some editorial text on how layout tables are bad practice and non-conforming

W3, the organisation that developes and maintains the HTML standards, has adopted DIV tags as the standard for marking up a website. Why? Standards, accessibility, and above all else - Design. It’s what the div was created for.

The proper use for DIV is a block element designed for containing elements. According the the HTML 5.0 RFC.

The div element represents nothing at all. It can be used with the class, lang/xml:lang, and title attributes to mark up semantics common to a group of consecutive elements.

Basically, DIV does what a table cell used to do. By use of CSS it can be positioned where it is meant to be and because it is free of a table’s framing it can be easily repositioned and placed elsewhere, changed, or removed.

However the freedom of a DIV, unfortunately, also leaves the it open for massive abuse. Many designers have replaced masses of nested TABLES with masses of nested DIVs. Bad design is not changed simply by using a different tag.

The overall skope of this though is that TABLE is not to be used for laying out content in a website. That isn’t the table’s purpose. There are other uses for tables and I want you to know that you don’t have to be afraid to use a TABLE. The only thing you need to know is when to use it.

Purists will cry ‘do not use tables,’ and so many fledgling designers will take this and run with it to the point that the meaning is lost. If you hear someone say that, they’re wrong. The correct saying that you will hear experienced designers say is more simple, accurate, and to the point.

Tables are used for tabular data.

It’s that simple. The hard part is figuring out what tabular data is. Do I use a table for this, or that? To determine this you have to ask youself what data you are printing and how that data is to be represented. For instance, a list of people would be best placed in a list.

• SuperMan
• SpiderMan
• BatMan

<ul>
<li>SuperMan</li>
<li>SpiderMan</li>
<li>BatMan</li>
</ul>

But what about a list with corresponding data? That, ultimately, would be best for a table.

<table style=”border: 1px #000 solid; padding: 1px;”>
<tr style=”text-align: center; font-weight: bold;”>
<td>Superhero</td>
<td>Powers</td>
<tr style=”text-align: center; font-weight: normal;”>
<td style=”border: 1px #AAA dashed; padding: 2px;”>Superman</td>
<td style=”border: 1px #AAA dashed; padding: 2px;”>X-Ray Vision, Flight, Super Strength</td>
</tr>
<tr style=”text-align: center; font-weight: normal;”>
<td style=”border: 1px #AAA dashed; padding: 2px;”>SpiderMan</td>
<td style=”border: 1px #AAA dashed; padding: 2px;”>Shoots Webs, Climbs Walls, Can sense danger.</td>
</tr>
<tr style=”text-align: center; font-weight: normal;”>
<td style=”border: 1px #AAA dashed; padding: 2px;”>BatMan</td>
<td style=”border: 1px #AAA dashed; padding: 2px;”>Awesome gadgets, super rich, has a butler</td>
</tr>
</table>

The same holds true for something like a calendar. The HTML code for the calendar here at Foponet is in a table. A calendar is clearly tabular data. Always.

Now for the reason I write this post. Antonio Lupetti of Woork wrote recently about how to layout a form using CSS rather than tables. In his post he stated he usually used tables for this but some readers of his blog wanted to know how to use CSS.

Article: Clean and pure CSS FORM design

Now, I have to hand it to Antonio, his code for the CSS Form is clean and beautiful. It’s a real piece of art, and I recommend you check it out, but forms are also tabular data. You can use them there without fear, although I might take a note from Woork and try out a CSS version is some designs.

A table is basically a box with rows and columns. The general rule is this. If your data is a row then use a block element like a P (paragraph) or a BLOCKQUOTE (blockquote). If your data is a column then use a list like UL or OL. But if you’re trying to lay out data in a way that resembles a table - with rows and columns - then use a table. Just don’t use a table to layout your entire site. It’s bad form.

Google, like the link is even necessary, has apparently changed their favicon suddenly and shockingly, and it’s a rather interesting look into the power of branding.

A favicon is a 16×16 pixel image saved in a special icon format with the extension .ico. When uploaded to a site, typically the main directory, it will be shown in browser address bars and tabs and becomes a brandable mark for that site. Typically a company would use their logo, or part of it, to reinforce the logo brand such as what Google has done. For ages, Google’s favicon has been nearly as iconic as their logo. The trademark uppercase G from their logo with a colored border.

As Ionut Alex Chitu notes on the GoogleSystem Blog (not affiliated with Google):

Google’s new favicon is less cheerful and comforting, but it makes a lot of sense: the small g is a symbol for infinity (∞). A googol (10¹⁰⁰) is just a poor approximation for the huge amount of information that needs to be indexed, organized and made useful by Google.

Will this hurt Google? No, probably not.

In fact it will probably be some great publicity for a time as people sit up and take notice, writing blog posts such as this one to reinforce the Google brand. It goes to show that there is a power to branding beyond the subliminal reinforcement. When you’re as big as Google, you can mess with it, and by doing so you tug on that reinforcement of the brand and get into peoples heads - as well as getting some great, cheap advertising out of the deal.

Yes, when you are as big as Google you can nonchalantly mess with people’s heads. That is the power of a good brand.

Just don’t make the mistake Coca Cola did and change your formula. That, definately, is a recipe for disaster.

Update: Google has finally posted a public message about their new favicon on their official Blog. The includes a nice sampling of the designs they considered for the new favicon as well as an allusion to Dr. Suess.

Article:One Fish, Two Fish, Red Fish, Blue Fish

Technorati Tags: Google, Favicon, Marketing, Branding