After almost four years in hibernation, I've resurrected this blog, as I refocus the site to tackle web development, social media and emerging trends in the digital publishing world.

Is this flood of social media, Facebooking, Tweeting, AJAX and what-have-you overhyped? You bet. The backlash is already underway, but if you're a professional in this space, it behooves you to at least try to stay on top of it all, and if you can't, you've got to at least fake it, right?

So with that in mind, we relaunch in the hopes not of developing any sort of following, but simply to chronicle the developments as they happen and keep track of points of interest along the way. Lofty aspirations, no?

I suppose a redesign that integrates some key components of the modern-day web is in order as well. One thing at a time.

Labels: Facebook, social-media, twitter, web-standards

Molly Holzschlag drops some knowledge on what to expect as the browser shifts from the desktop to the palmtop, if you will. And no need for shades, because it sounds like the future ain't to bright for front-end developers.

The crux of the issue: The varying flavors of XHTML (specifically, XHTML-MP and XHTML Basic) supported by various handheld devices, and the lack of consistent implementation of those standatds (sound familiar?) in said devices. Just when you thought browser testing was about to die, it's really just begun.

And now we're wondering: Has anyone assembled a handheld device browser testing lab? Will there be a way to emulate these browsers on the desktop to streamline the process? When will clients start asking for this stuff?

Labels: mobile, web-standards, XHTML

I've been writing HTML/XHTML for the last decade or so, since a college internship. I taught myself the basics back in the mid-90's with the help or a friend and one of those "Learn HTML in 24 hours" books. It probably was something more like 10 hours before I really felt like I "knew some HTML". And the idea of making a website that anyone in the world could visit was fascinating to me being a journalism major at the time. Cutting out the middleman and becoming your own publisher was pretty spectacular to me.

I've literally been feeding myself on the proceeds of my markup ever since.

The coolest part about this is that despite spending so much time mastering web development skills, there's always something new to learn, a new approach to take or a better way to build your site. First it was Photoshop. Then it was JavaScript and CSS. And despite no real training in programming, and not really having the brain of a programmer, I learned some PHP. Then I took on ASP and ColdFusion. I was into Flash for about a year or so. Then back into CSS. Then I took up interest in accessibility. And before I knew it, I had to learn C#/.Net, and in the process, joined it with Web Standards to take my skills to the next level.

But after doing a code review today on a standards-based client site today, I realized just how satisfying it is to know that I've poured the last decade of learning into the templates I've just produced. I think that's pretty cool. Sometimes I have to remind myself that just because I read blogs of developers who really are professional site builders like myself, the fact of the matter is that it's still a rare breed of website developers who've been in the game this long and who are actually using web standards.

Labels: CSS, Flash, web-standards, XHTML

I know that browser statistics can be misleading, but after looking at some numbers from a few clients, and checking out the publicly available numbers from outposts like Browser News, thecounter.com and webreference, it appears that Internet Explorer 5.x is taking its last gasps of breath, and could be all but dead within a year. And given the differences in IE 5.0 and 5.5's box model, as well as the red-headed step child known as IE 5.2 Mac, that last gasp will be a breath of fresh air for standrads-loving, browser-testing web developers everywhere.

If you haven't checked lately, Netscape 4.7 seems to be checking in at a fraction of a percent these days, which is comforting for standardistas like myself. Now were just waiting patiently for IE 5.x to kick the bucket. Last year, a combination of the various IE 5 flavors was clocking in around 12-13%, and just a year later, the number is looking like something around 4% and dropping steadily.

If that pace continues, IE 5.x will be all but dead by next fall, and who knows, IE 7 might even be released by then.

Of course, we realize that these sites are somewhat skewed toward the web professional audience, but a review of some recent client site logs reveals similar numbers. And with that in mind, remember that your own site logs are always the best browser statistics for your site.

Labels: browsers, IE-5, IE-7, Netscape, web-standards

A staple of website layout since the mid 90s, the <table> tag gets a bad name these days in Web Standards circles, because it was never intended to be used to build layouts. Tables are meant for -- surprise! -- organizing tabular data, whether you want to publish Danny Ainge's career statistics or mutual fund returns. Sadly, 90% of the tables on the Internet are being used for layout in a day and age when they're just no longer necessary.

When it comes to tables and Web Standards, there's more to know besides "don't use them for layout." Specifically, not enough webmasters know that there are simple ways to make their tabular data instantly more accessible and understandable to users of alternative browsers. Make a habit of implementing these lesser-known attributes and powerful secondary tags to make your tables accessible. Check out the sample code below:

   
<table summary="This table lists all of the vehicles 
impounded by the Hazzard County Sherriff's Department.">
<caption>Impounded Cars - Hazzard County Sherriff's Department</caption>
<thead>
 <tr>
      <th scope="col" abbr="Make">AUTOMOBILE MAKE</th>
         <th scope="col" abbr="Model">AUTOMOBILE MODEL</th>
         <th scope="col" abbr="Year">Yr.</th>
         <th scope="col" abbr="Color">COLOR/DESCRIPTION</th>
 </tr>
</thead>
<tbody>
 <tr>
      <td>Dodge</td>
         <td>Charger</td>
         <td>1969</td>
         <td>Orange</td>
 </tr>
</tbody>
</table>   
    
   

Code breakdown:

• summary="" attribute - The summary attribute should be listed last in the opening table tag, and it's used to give a user a description of the content of the table. The summary isn't intended to be displayed by traditional browsers, but it will be read aloud by screen readers when they enter the table. Also, remember to add a period to the end of your table summary; this will cause most screen readers to pause briefly before beginning to read the content of the table.
• <caption> tag - If you want to display a brief description of your information to visual clients, the little used <caption> tag offers a semantic solution rather than just printing regular text or headers with your table. The caption tag should immediately follow the opening <table> tag, but can be displayed before or after the table with some CSS magic.
• <th> tag - Always mark table headers with the semantic <th> tag. By default, most browsers will center and bold content placed in a <th> cell, but remember, CSS is your friend. And keep in mind that the <th> tag should only be used to denote an actual table heading. Using <th> simply to provide bold and centered style to a table cell is semantically incorrect, and your colleagues will giggle at you behind your back. Not good times. Apply a class to a standard <td> instead.
• scope="" attribute - No longer reserved for oral hygiene, scope will make your breath fresh and your tables more accessible. By adding a scope attribute to a <th>, you provide context to the table header. The two basic attribute values are "col" (column) and "row", and these values specify whether your header cell relates to data that runs down a column or across a row.
• abbr="" attribute - "abbr" is an abbreviation for -- get this -- "abbreviation". Use it to either abbreviate a long table header name, or conversly, to explain an abbreviated table header name.
• <thead>, <tbody> and <tfoot> - These three seldom used tags are optional, but they will help you clearly define the structure of your table mark-up, and they're also considered good form. And as an added bonus, you can use them to isolate specifc cells and groups with CSS.

As with all tips, and especially when it comes to dealing with screen readers, your mileage will vary with these techniques, as the onus lies upon screen reader software to properly interpret your markup. While JAWS 6 seems to be pretty reliable, the prohibitive cost of screen reader software may mean that your users are browsing your content with outdated programs.

These are just the basics to keep in mind, but these tactics will instantly make your tables more accessible. For further information about making tables acceessible, see the W3C's HTML specification.

Labels: accessibility, semantic-code, tables, web-standards