HTML Email Standards

Every couple of months or so, developers at work have to rebuild some HTML email templates and turn to my team and ask the inevitable question, “Do we have HTML email standards?”.

“They aren’t complete” is my usual answer as I flashback to my last attempt at painfully coding up an HTML template and trying to figure out the best format for maximum consistency across the multitude of email clients.

The next step is to usually forget it ever happened and move on to something else. In the end all of us developers usually end up collecting half complete, partially working templates that hibernate on our local drives and never really see the light of day.

I am relieved to see someone finally confronting those demons and starting some definitive email standards documentation in one central repository as well as developing some great testing and benchmarking for current email clients.

Brought to you by Fresh View, Luke Stevens and Mark Wyner. These guys have kicked off a project that will hopefully raise awareness of the need for web standards and accessibility in email and to also try to change things on the email client developers side…

The Email Standards Project works with email client developers and the design community to improve web standards support and accessibility in email.

Awesome work guys, head on over to the Email Standards Project and show your support for this great project.

Comments (1)

Alt text and form buttons set as images

There is something I always used to forget, and I didn’t realise this until a website I developed in the past was the recipient of a very comprehensive, postmortem accessibility review.

I am quite pleased to say the majority of the results were decent. The pedantic standardista in me had in fact hacked up the correct semantic code and anticipated most potential problems that might be encountered when users browse my website using alternate methods.

One thing that completely slipped passed me while coding this website though, was using alt attributes when coding form buttons set as images.

What do I mean?

Search form with images turned on
Foxsports search with images turned on

A sighted user will be able to see clearly where the submit button is and how to complete the search functionality displayed above on this website.

Search form with images turned off
Foxsports search with images turned off

A user with images disabled would not know where the submit button was to complete the search functionality above.

This example above is using Internet Explorer 6. Firefox will show the button in a usable format, but the point here is to make this button work for everyone.

How to solve this?

Simple, using the alt attribute when coding your input type=”image” elements in your forms.


<input type="image" src="⁄images⁄go.gif" value="go" alt="Submit" ⁄>

Another method is to use the button element, this way you would probably automatically use the alt attribute as you would be inserting a plain image element within the button element.


<button type="submit"><img src="⁄images⁄go.gif" alt="Submit" /></button>

Why am I bringing up something so obvious?

Or is it? I have probably audited almost twenty websites since then, combing markup for web standards compliance and accessibility or SEO hiccups… and one thing that consistently gets overlooked is this exact problem.

I am not talking about CSS newbies here either. Most of the websites are high quality, but it just seems this little issue keeps slipping through the cracks. Once you notice it once though, you won’t do it again.

Comments (15)

My Facebook Story

I find it interesting that at times, we as web professionals, get so involved in minute details of code, design and the usability of websites that we lose sight of the bigger picture. Often I think it would be nice to forget this detailed knowledge I have of the online space and be able to view the web as most others do, day to day.

It also amuses me that some technologies are dismissed simply because they go mainstream quickly, or are just mainstream at all. Alienation of an emerging technology or web 2.0 fad… but you often have to wonder just what keeps so many people returning again and again?

This post is not about Facebook suicide pacts or pissing on about how useless Twitter is. This is simply one of my Facebook stories.

In 1999 I travelled Europe for one year on my own. I arrived in Cork, Ireland and met an American guy named Brendan. We bonded over a few beers and ended up moving to the next town of Killarney where we continued to hike all day, drink Guinness all night. Rinse and repeat for the next 6 days.

We parted ways after Killarney, only to meet in the town of Galway for a final meeting in a pub before he was to head back to America and I was to push on to the mainland of Europe. I would safely say that Brendan and I clicked, and that we would be friends for life , even after this relatively small amount of time that we had known each other.

Almost 9 years later we had talked a few times on Hotmail, which I keep only for those friends I still know or hear from occasionally from that year in Europe. Hotmail is inconsistent at the best of times nowadays, with people migrating over to Gmail or just by chances your emails get binned by the useless Hotmail spam filters.

I have been on Facebook for less than a year, and I found Brendan on there somewhere along the way. We had brief contact, I followed his photos and wrote on his wall. Nothing too groundbreaking, but it was a connection.

Then Brendan mentioned he was coming to Sydney, which I noted after receiving a Facebook message. I replied back and told him my details to get in touch and almost instantly received a reply. Frequent messages bounced back and forth, before finalising plane times, pub locations and other important details.

Now this never happened with any of my Hotmail contacts from Europe, but Facebook has suddenly created an almost real time connection to many of these non-web contacts I have that would never respond to simple email.

This Sunday I will be sitting in a bar with this buddy from America (now living in Japan), that I met in Ireland almost 9 years ago. What’s really interesting is that I have been following his life to some extent for the last year via Facebook imagery, updates, wall writings and other absurd app-fuelled connections that make me feel like I know what his life has been about for the last year.

I know of his trips to Utsumi beach on the weekend and wonder about the Gajin parties in Tokyo… but there will still be lots of catching up to do over many pints on a Bondi patio.

This is my personal, social review of a web 2.0 ‘fad’. No technical audit, usability research or professional critique of interface design. Minor annoyances aside (vampire bite anyone?) what is your social, web 2.0 app doing for you?

What’s your story?

Comments (6)

SEU, Search Engine Useless

Lately I have been asked again and again, “What can I do to improve my rankings in Google?”. This is a bit of a loaded question, but one I always attempt to answer when I am dealing with anything search related.

I usually begin with a quick glance at the website using the 30 second test, a skim of the source code to view the semantics of the HTML and then check out the basic structure of the document and a few other technical bits here and there.

In most instances this process is just a formality as the real answer is usually quite obvious, Search Engine Useless content, or SEUs. Content that is invisible to the search engines that you are just throwing away, usually without being aware of the real consequences.

This content may be semantic and validate by W3C standards, it could even be fully accessible in some instances, but to search engines it means nothing. Search Engine Useless (SEU) content is something that plagues our industry and drives people to inquire, “Why isn’t my website getting exposure?”

Listed below are some of the most common offenders.

Iframes

Usually used on a website where you need to quickly pull in a 3rd parties content without the bother of dealing with server-side implementations. Stemming from quick deals established by sales departments that have little or no communication with developers or just the job that had to get out the door with no fuss.

The interesting thing is most of this content I encounter is very useful and engaging to the users, which would bring in relevant referral traffic if you could only expose the content.

Flash

Flash can be fully accessible when developed correctly with the new tools available over the last couple of years. It can even aid in screenreader detection in some instances, improving accessibility for websites.

Yet this accessibility, which would usually aid search engine optimisation efforts, will do nothing to help search engine spiders crawl Flash content.

The <embed> or <object> elements are the SEU offenders in this instance. Hiding good content in a plug-in that cannot be crawled by search engines. Alternate content can be offered, using great standards compliant techniques, but is rarely executed in a truly efficient or consistent manner.

AJAX

Often developed with improved interfaces for content delivery to users, but AJAX and JavaScript still tend to be used as blankets to cover content from search engines.

HIJAX has been coined as an accessible and searchable way of exposing content to the users (and search engines) but most current Web 2.0 implementations tend to ignore this idealistic technique of development.

Video and Audio

Engaging and a great way to present content but you won’t see it turn up in the search engine result pages unless you are going through Google Video. Transcripting is a great alternative but I have yet to see a corporation excited about this solution.

Lack of Content

If you don’t actually produce original content and lots of it… that could be strategy to think about. This is a problem I deal with regularly. No, FAQs and Terms & Conditions don’t count.

Why Can’t We Fix This?

It’s the bottom line that pushes these blind spots in content out to the users. It’s sales, advertising and marketing having to make targets each month without having a well thought out process to be able to implement things efficiently and being able to slow down and provide minimum standards for development on large, public websites.

It’s about SEO being the buzzword for quick results, until someone suggests long term solutions to make a real difference and solve the real problem and suddenly you don’t hear the topic brought up at meetings so much anymore.

We know the technical solutions, so why aren’t they being implemented? Well, it’s just easier to implement this way. No fuss, no problems with technical implementation or developers adding further bottlenecks to a deal that had to be out yesterday.

The Solutions Right Now

Education is always a big factor in reducing SEUs littering our industry. Slowly suggesting how to rebuild these SEU elements next time they redesign, rework or just have time to factor some of these elements that are hurting chances at returning great search results.

Having these methods and techniques as a slow mantra to be repeated at every opportune moment. This can slowly find it’s way into future builds and into future project plans without people even realising it.

One last solution is the optimisation of the actual page the SEU is embedded on. Optimising the usual page titles, meta-data and semantic headers that surround these elements. Also thinking about adding items such as introduction paragraphs, tags for users to contribute descriptive data and captions, summaries and anything else that may be relevant to the user.

It’s just small steps, but these can help to slowly eliminate one SEU at a time.

Comments (9)

Target is the new SOCOG?

Sometimes I read blog articles that just make me smile, and this continues today with each article I have been reading about the class action lawsuit against U.S. retailer Target. Being one who often attempts to build business cases for accessibility to a room of suits, this has been a long time coming.

I have recently had to build one of these business cases for a company-wide guidelines website at the large company I work, involving standards in search engine optimisation, web accessibility and web development best practice.

I have no problems projecting potential earnings for increased traffic for SEO enhancements, and I also can give a fair estimate of the potential savings gained by more efficient workflows that occur when developers have standards and code libraries to work from at the start of a project.

Where my argument gets a bit thin is when I am still forced to quote the legendary SOCOG vs Bruce Maguire lawsuit to justify my arguments on why all of our websites should be accessible. Even I had to admit that, from a business perspective, this seemed a one off and the probability of getting sued by a customer are quite slim. I continue to push ahead with this example anyway as it’s the only concrete example we have that really hits home with Australian corporations.

Target’s situation opens those doors for us all to start pushing once again. The “you could get sued” can now turn into a “when we do get sued” with just a fresh taste of reality backing it. New numbers can be crunched and that is what makes things happen in larger companies and moves accessibility concerns up the ladder of priorities.

Even better, is the fact that this is now not limited to government websites under California law. Every private commercial website running under this jurisdiction will have to closely pay attention to the voice of many disabled users attempting to use the web, just as we do everyday.

Why should SEO be the only reason I can get things done on my company websites? I currently use SEO to push my accessibility and web standards agendas, but imagine in the near future if I could use the word accessibility in the same threatening (or perhaps we should say persuading) context?

Accessibility would move one step closer to pushing through that checklist mentality (which I don’t even think it’s entirely reached yet) and begin it’s journey into more mainstream awareness and user testing with disabled users would just become another part of the web design process.

It’s an interesting stage in accessibility and I think we really needed this one. Companies will not do things because it is right, that just doesn’t cut it with the bottom line. It has to be a legal mandate with financial consequences for these incentives to begin to cut into the large corporations and the mainstream.

Comments (1)

Is SEO Evil? - Web Directions Presentation

I recently just did a presentation on Is SEO Evil? at Sydney’s annual Web Directions South. The presentation seemed to go alright and I receieved some good feedback and questions afterwards on the topic, so I am quite happy with the overall results.

The slides alone might not make to much sense right now, but I hope to get some time to record some audio and sync them up if I can figure out a good way to do it. Slideshare and the new Keynote sound like they may support these features, so I will have a go and see what I can come up with.

It was a great experience presenting at Web Directions. I have attended all four conferences in the past and can credit these conference as a large influence on my conversion from hacking up table-base layouts to web standards advocacy… so it was quite humbling to be able to attend this year on the other side of the podium alongside so many of the web industries finest speakers.

I used a lot of Flickr photos for this slideshow, so I have attempted to attribute them all in the list below. See you at the next event.

Flickr photos used in presentation
Health.1 by mdumlao98
barcelona sagrada familia - kaneda99
Evil Emperor - toolmantim
Parc des Bastions - chaidealo
Day 254 - Rafa from Brazil
fragb_73p_hst_f - Vijñ?na
My Great Grandfather Tomi?! - Yonker
Touchdown - toddsmithdesign
Mac Keyboard - Digital Explorer
Bob and Doug McKenzie - Sherlock77
Peligro indefinido / undefined danger - Antonio Martinez
Hopscotch - kentsmudger
Rubik - Paulgi
Blurry Train - phil h
Wiener Wagon - d53wood
Lego - barbus22
Comparing - The Department
Rainbow T’s - Cayusa
Al abordaje mis muchachoooooos!!! - .mauro!
Silhouette - kevinthoule
Ice Cream - kara c
Donovan & The Dude Part 2 - Fen Branklin
the pain of youth - gleddy
pentagram pizza - shawnwall
Can you dig it? - Melbourne WSG
Hawaii Con - ken mccown
ROBOC - nachap
List - ofbedbugsandbadhabits
Ladybird Traffic Jam - Random Images from The Heartland
Traffic Jam - Curzio
Unique - Irina / Ruri
Normandy - quinonesanibal
The Crowd Goes Nuts - Dylan + Hip
If you are on fire… - superlocal
VW Genius - Baby Skinz

Comments (1)

« Previous entries · Next entries »