Web Standards, Accessibility & More

Here are some awesome web development resources I’ve come across lately:

• 110+ Massive WordPress Video Tutorial Collection
• HTML, CSS, PHP and jQuery Killer Tutorials
• 10 Cool Things We’ll Be Able To Do Once IE6 Is Dead
• Alltop – All the info you need for Web Design

I recently updated my personal home page at dennislembree.com (I like to call it a “vanity” site). It’s my usual minimalistic, user-friendly, standards-based, accessible design, and I’m liking it.

Changes include removing the bio, organizing in three categories, and a fresh appearance. Check it out and leave me some feedback if you’d like.

The new web page renders wonderfully in the good standards-compliant browsers (Firefox, Safari, Opera and Chrome), but IE has a couple issues of course (peek-a-boo and left margins on unordered lists). I fixed the IE7 issue and one of two IE6 issues. I’m feeling thankful for conditional comments!

I was very pleasantly surprised to learn that Web Axe, my podcast and blog on web accessibility, has been nominated for .net magazine’s 2008 Best of the Web awards. It’s in the “Podcast of the Year” category, the sixth category down the list. After voting narrows the candidates to three (voting ends October 13), a panel of judges decides on the winners who will be announced in December.

If you listen to Web Axe and like it (or even if you don’t!), you can vote for Web Axe on the Best of the Web site.

Here’s a quote from .net magazine about the contest:

The .net Awards celebrate the best in web design and development. The 14 categories for 2008 range from Design Agency of the Year and Podcast of the Year through to the Infamy Award – a chance to name and shame those ruining your web experience.

I attended the An Event Apart conference in San Francisco (AEASF08) this week, a pretty well known conference “for people who make web sites”, mostly designers and developers. I had the pleasure of speaking to Eric Myer and Derek Featherstone which was way cool. I took the Caltrain from Sunnyvale on the first day and drove all the way up from Cupertino on the second day (found early-bird parking for only $10!). There’s a nice Flickr AEASF08 album which has pictures of people, venue (The Palace Hotel), and the delicious food.

Here are some tidbits from the conference:

• Empathy for the user is what a designer needs most.
• The average headings sizes from nine CSS frameworks from H1 to H6 were (in em): 2.33, 1.8, 1.45, 1.25 1.11, 1.05
• Use visual weight (through size, color, texture, etc) to create a hierarchy of elements on a web page which creates meaning for the user.
• Modern web design (like jazz music) is about creating frameworks where users (musicians) can improvise and participate.
• Pixel/em value make more sense when using the 62.5% method (body font size).
• “Progressive disclosure” is a new term which refers to progressive enhancement used with hiding/showing content.
• Eric Myer discusses debugging in CSS and his CSS reset file.
• Web accessibility checklists are only a starting point.
• Google was lazy in not making Google Map controls keyboard accessible.
• “Math is easy; design is hard.”

If AT&T wants me to switch my cable services, AT&T’s web site should support my browser (Firefox 3)! They want me to use crappy IE. Last I checked browser usage, IE is down to around 55%, so that’s a lot of non-IE users they’re deterring. Please AT&T, implement web accessibility practices and use web standards! The customer must be able to use whatever web browser he chooses.

So I’ve become familiar with questions that tech companies ask when interviewing candidates for web developer positions in “Silicon Valley” in California. So if you’re interviewing, you should prep yourself for the following interview questions that always seem to come up:

• What JavaScript libraries have you used? (And for YUI, which seems to be popular, which components have you used?)
• What’s the difference between “if (a==x)” and “if (a===x)”?
• Have you developed CSS for different browsers and versions? What are some examples of issues you’ve had? (i.e. box model)
• How do you keep up on web technology? (books, blogs, etc.)
• Use this text editor to properly properly markup this form from memory (with XHTML, CSS, JavaScript).
• Use this text editor to properly properly markup this table from memory (with XHTML).
• What’s the difference between “visibility:hidden” and “display:none”?
• What’s the difference between using var inside and outside of a JavaScript function? (or an exercise involving this)
• How would you write the HTML and CSS for a standard three-column layout with header and footer?

Guess what? Adobe’s Dreamweaver CS4 Beta is available! And I’m just getting used to CS3! New features include:

• Live View
• Code Navigator
• CSS best practices
• Code hinting for Ajax and JavaScript frameworks
• HTML data sets
• Photoshop Smart Objects
• Subversion integration
• AIR support
• New user interface