« June 2007 | Main | August 2007 »

July 30, 2007

Web Trend Map for 2007

It's a subway map of the 200 most successful websites on the web, ordered by category, proximity, success, popularity and perspective. In theory it demonstrates the relationship between various sites and ideas, with a strong focus on Web 2.0. The Web Trend Map is based on the Tokyo metro map.

iA_WebTrends_2007_2_sm.gif

July 22, 2007

DIV versus Table and CSS vs. XHTML, Compliancy. Debate?

Debate? Who wants to debate? I have work to do. Web designers and developers all have plenty of work and at the end of the day if progress is not made then you haven't accomplished anything or, do you have something you can be proud of?

This is all coming to you from having only slept four hours after a 24 hour work day, 14 hours of which were spent dealing with cross browser compatibility and the complexities of CSS.

table-versus-div.png


This is not a new issue for me as I personally have been battling it for years. Until now ignoring CSS has worked for me as I felt it not mature enough for prime time or a worth the investment of my time. Now, with the introduction of "Web 2.0" the need for standards compliance is now on the fore front of web site development and CSS can no longer be ignored.

To this day I hand code all of my HTML and instead of writing <table> I find that <div> can be just as handy. Warning: CSS can also be a complete waste of time and a loss of your 14 hour sprint to get ahead. Can't XHTML and CSS get along?

Edit-X is currently rebooting our corporate web site and a portion of this project is moving from XHTML to CSS. I can not even begin to explain what a struggle this has been, although I am sure plenty of you have similar stories to share.

We have always had browser compatibility issues but not quite like this before. There is nothing like spending 2 hours on something seemingly small only to load another browser and find that none of your efforts were worthwhile and you’re not done until its cross platform compatible. Another two hours later you have something you can be proud of. Reloading never felt so good.

So is this what we are left with? We get a nifty looking site that we can be proud of? I don't know about you but I prefer profitably to being proud any day. I am having a hard time wrapping my head around the amount of time it takes to build a CSS compliant site versus a perfectly equal XHTML site which both looks the same, acts the same and indexes keywords the same. I hear others claim that file size is an issue. Give me a break, none of my customers care about dial up users. Ok, ok so the code is cleaner when you view source. I only ask you which source? Take a look at that CSS file. You have only moved the amount of code to another, hidden, location.

It’s the same looking at someone else’s tables from 12 months ago as looking at someone’s CSS from one month ago. Editing others code is always a problem. Neither CSS nor XHTML can fix that, only good commenting. Speaking of commenting how about that <!-- IE HACK --> throughout your CSS or <-- Opera FIX -->. They call it a hack because it is a hack and hacks are not a standard.

I am not here to bash CSS as it has been very valuable for us all of these years in doing what it was initially designed to do, a single location to make global site adjustments. But now using it to define every single pixel location of every object and the overall structure of the whole site? Have we gone too far? Created too many options? There are so many options that the browsers can't agree on thousands of parameters versus of a few hundred indifferences in years past.

Designers and Developers need to understand that it is not the need of the designer to communicate the artistic vision or the developer to have access to the object or code more efficiently as the issue. The problem is not the need to have full control or only getting a roughly similar display between browsers. CSS is a great concept and its development and growth are certainly necessary. The browsers interpretation of the options is what ruins everything and always has. See, Browser War. I will save this topic for another blog entry.

We have to magically take one piece of code, prepare it for two completely separate interpreters (browsers) with multiple versions and have them all display it the same to the end user. That’s like taking an Adobe Creative Suite 3 PSD and trying to open it in Photoshop 7.0, Photoshop 6.0 some other comparable photo editor maybe Photo Impact and its various versions and viewing your design file in tact. All of this while being compliant with standards and delivering the project on time and on budget, which is impossible, no doubt.

How many times have you bid a site revision at one hour thinking it could be done in CSS quickly and it took you three? Did you ask the customer to compensate you for your additional time? How often does this happen? Start keeping track, you will be surprised.

Let’s say you’re my customer and you want a bid for a new five page static site for SEO link building. I ask you if you want XHTML or CSS compliant code. You say, what's the difference? I tell you that CSS is double the time and that means double the cost. Which do you choose? Of course that depends on the purpose of your project but for most, they will take the cheaper option. Why shouldn't they?

This isn't about old school or new school, right or wrong, designers versus developers or CSS versus XHTML. It is about the differences in web browsers and knowing when to use XHTML within your CSS. If you can get something done quicker using a <table>, DO IT, DO IT. Sure beats float left and float right for a three column layout.

I will leave you with the fact that CSS and XHTML are here to stay and CSS is no doubt the future and provides more control than XHTML. CSS also has a long way to go and the number browser compatibility issues are on the rise. Use your head and save yourself some time and frustration. XHTML is more stable and has seniority in web development. At the end of the day you must accomplish something to show progress and deliver your projects on time and on budget. Do you want to build web sites to be proud of them or make a profit?

Here are the links I used in my research...

http://blogs.vertigo.com/personal/willa/Blog/Lists/Posts/Post.aspx?ID=5

http://www.decloak.com/Dev/CSSTables/CSS_Tables_01.aspx

http://www.stopdesign.com/articles/throwing_tables/

http://www.imarc.net/communique/view/76/div_vs_table_battle_2k6

http://csscreator.com/node/7509

http://www.webmasterworld.com/forum83/9319.htm

http://forums.digitalpoint.com/showthread.php?t=49097

http://blogs.vertigo.com/personal/willa/Blog/Lists/Posts/Post.aspx?ID=5

http://www.sitepoint.com/forums/showthread.php?threadid=224227

http://www.sitepoint.com/article/tables-vs-css

http://www.sitepoint.com/forums/showthread.php?t=171791&highlight=css+versus+tables

Keywords: div vs table, div versus table, css vs xhtml, css versus xhtml