I am a big fan of the Seinfeld television show. To me, the show epitomizes middle class America comedy in a way no other sitcom has ever managed to do.

In one particular episode, for some reason that I can’t recall, Kramer decides he’s at the time in his life to go without underwear. In a particularly funny scene with Jerry and Elaine, Kramer announces to the world that “I’m out there Jerry and I’m loving every minute of it!”. Free at last, free at last.

What does all this have to do with website design you might ask? Well, read on and let me tell you the rest of the story.

Free at Last from Internet Explorer 6.0

While developing a new website I was faced with the standard task of breaking down the CSS and XHTML code to insert the necessary hacks to make Internet Explorer 6.0 behave. As we all know, IE 6.0 does not comply with web standards and presents nightmare scenarios for web designers who feel they should continue to support this outdated piece of software. The original version of IE 6.0 was released in 2001, making it almost nine years old. Heck, IE 7.0 has been released for a couple years now and IE 8.0 is the current production browser from Microsoft.

I don’t know what came over me, but as I delved into the code and begin to write my IE 6.0 hacks I had a revelation: Enough is Enough. I am through with IE 6.0. I will no longer support it, code for it, or otherwise let it enter into my life as a web developer.

What a breath of fresh air. I immediately felt free from the bounds of some unseen master who has been imposing his will on me for years now. But no more. Finished. Done. Ended. Complete.

I’m Out There World and I’m loving Every Minute of It!

My best wishes to those who continue to use Internet Explorer 6.0. Your trusted friend will continue to serve you in some fashion, but not well I am afraid. Good luck and good riddance!

As for me, it’s time to move past the “boxers” or “briefs” stage of my life. It feels great being “out there”!

As most of you know, I strive to develop websites that conform to currently accepted web design standards. I write my code to be valid both via the CSS file and the XHTML markup.

Although it takes a bit more time to design a website to conform to these standards, it always seemed like the right way to design a website. It also feels good when your product is pronounced to be Valid by the various validation tools.

I stumbled upon a website today that appears to me to be the least valid website I have ever seen. Bar none. As of today, there are 2017 validation errors when the XHTML is checked. Wow. That’s a lot of errors.

Can you find a website with more errors than this one has? That’s the challenge for today!

[eof]

P.S.
Just to balance things out, the University of California Spanish & Portugese Department is one of the most valid websites I have ever seen. The good folks over at Accessites.org highlighted the UC Spanish & Department website over a year ago.

How’s that for contrast?

One of the basic features of most websites is some type of navigation indicator to identify what page you are currently browsing. Although this can take the form of a fairly complicated breadcrumb indicator, the most frequent implementation of this feature is simply to draw attention to the navigation link by highlighting it differently with your CSS file.

Don’t you think it’s time to extend this same feature to the WordPress category navigation links? Read on to find out how!

The Typical WordPress Theme Navigation Structure

Most websites that use WordPress for the backend have a sidebar or other area of the site which displays a series of navigation links for each of the blog categories. This link list is displayed by use of the wp_list_categories() function. When the visitor chooses one of these links, they are taken to an archive of blog posts that have been tagged under a particular category. Most blogs have quite a few category assignments, and as a rule these category links make up a significant portion of the overall navigation.

An example of this can be seen right here at 1955 Design. Follow this link to articles written in my portfolio category. Notice that in the right sidebar, under the Categories tab, you will see that the title for this category is now colored a shade of orange and is italicized as well. Neat feature, at least to me.

How to Highlight the Category Navigation Link

Wouldn’t it be nice if the rather lengthy list of category navigation links could be highlighted so that the visitor can see that they are visting a category archive and are not on the main blog index or a static blog Page? It can be done!. WordPress adds the CSS class named current-cat to the list markup which surrounds the active category link. By controlling the styling of that class in your CSS file, it is possible to visually indicate to your site visitor that they are currently browsing a category archive.

Here’s my CSS:

#sidebar ul.li_smaller li.current-cat a {
	padding:0px 5px 0px 0;
	font-variant:normal;
	background-image:url(i/nav_current.jpg);
	background-repeat:no-repeat;
	background-position:left center;
	background-color:#5B5C9D;
}

The image shown at the top of this post indicates how 1955 Design implements this feature. As you can see, the current category link takes on a different background color to serve as an indicator to the visitor. If you actually scroll down the left sidebar and choose the Accessiblity category link, you will see how this indicator actually changes that link to the highlighted color when you are viewing the Accessiblity category archive list.

Is this the Eighth Wonder of the World?

Hardly. It’s just one in a series of WordPress enhancements that I have learned of recently. I think it’s a neat feature that is very often overlooked by theme developers. In fact, of the thousands of WordPress blogs that I have visited, I have only seen this feature implemented one time – by Mike Cherim over at GreenMethods.com. I discovered this WordPress feature while studying Mike’s new webiste. As usual, Mike is on the cutting edge of WordPress design. Thanks Mike!

[eof]

Apparently there are many web users who do not know how to utilize some of the accessibility features of their browsers. Are you one of them?

For example, it seems as though some users don’t know how to resize the text on their browsers for easier reading while web surfing. A handy article on this issue has been written by Ian Lloyd at Accessify.com. Ian has even created a video to show you how easy changing text size is. If you cannot or do not want to watch the video, I have posted a transcript of that video as provided by Mike Cherim at Green-Beast.com. Take a look at how simple it is to make your web browsing easier on the eyes!

If you are finding it difficult to read some text when viewing a web site you can resize the text up and down to suit your needs. However, by default web browsers — for example Internet Explorer and Firefox — do not make it obvious that you can do this; effectively they hide these useful controls.

Using Internet Explorer, otherwise known as IE, you can change the font size by selecting the View menu item and then selecting the Text Size option — you have 5 size settings to pick from. This is useful to know and once you select this setting, it is remembered for all web sites that you visit.

A better option is to place a text resize control permanently on your toolbar. To do this, press your right mouse button on the toolbar area to bring up the contextual menu and choose ‘Customize’. A list of available toolbar buttons appears on the left. Scroll down to the Text icon and then select ‘Add’. You can also change the display of the icons while you’re hear, just in case you find the toolbar icons a little small too. Once you hit the close button, you’ll see a Text Size control there, making it much easier to change the size.

If you are using IE 7, the process is much the same — right click on the toolbar, but you need to select ‘Customize Command Bar’ then ‘Add or Remove Commands’

In Firefox, you can increase the font size in a similar way to Internet Explorer. Unlike IE, you are not limited to 5 sizes (that being two notches up and two notches down from the default).

Unfortunately Firefox does not provide a toolbar icon for text resizing, even if you choose to customise. However, Patrick Lauke from the University of Salford has created an extension that creates a set of buttons that you can add to your toolbar. Simply go to the Firefox Extensions page and search for the ‘Text Size Toolbar’, or go to tinyurl.com/2ztudx. Once you’ve installed the extension and restarted Firefox, right click on your toolbar and choose customise. There you will find the resize buttons which you can drag and drop on to your toolbar.

There are other ways that you can change text size on a web page. If you have a mouse with a scroll wheel, simply hold down the CTRL key — or the command key if you are a Mac user — and move the scroll wheel up and down. For Firefox users, hold down the CTRL key and press the plus (+) and minus (-) keys. Finally, if you are using Internet Explorer 7, you can hold down the CTRL key and press the plus or minus keys which will zoom the whole page in and out of view.Ian Lloyd

Ian has asked everyone to help spread the word…so consider the word spread by this post. Please do the same if you have a blog or other means to do so.

[eof]

I have been determined to learn to design accessible websites so that all users, regardless of their disability or hardware, can have access to the sites that I build.

My design skills and my accessiblity skills have increased dramatically in the past year, I am proud to say, and I can now pump out a pretty accessible website.

There are many resources that I have utilized to broaden my knowledge about accessible web design. However, nobody has been a greater help to me than Mike Cherim at accessites.org. Mike has gone out of his way to spend quite a bit of his valuable time helping me become more sensitive to accessibility, and I thank him for it.

Mike has posted a great article entitled “Why Bother with Web Accessiblity“. It’s a terrific overview explaining why any and all web developers need to build accessible websites. Thanks again, Mike, for more helpful hints and great observations.