Should designers be able to code their designs?

No.

But then again it isn’t that cut and dry. I think that there are a very small number of designers that might just be able to get away with it, but they are a minority in the geek world. There’s a reason people like Andy Clarke and Elliot himself are respected so well, because they are skilled and motivated enough to keep on top of design and code. For the majority of us we should specialise in design, front end development (HTML and CSS) or back end development. I also still think there’s a place for pure JavaScript developers (reducing the reliance on jQuery and other frameworks to optimise code).

So should designers know how to code?

Yes.

Learn how designs are laid out, learn how positioning works, learn about floats, browser bugs and the deficiencies of Internet Explorer (and Safari, Chrome, Opera and Firefox for that matter). There should be no excuse for providing designs that are an absolute nightmare to build, but it doesn’t mean you have to be able to build them yourself. If you know the limitations of the technology you can both design to their limitations and think about ways to get round that and make your awesome designs work.

Which brings about an interesting point, the best way to learn HTML and CSS is just to do it, so if you ask the question again, the answer might be different.

Should designers be able to code their designs?

Yes. But don’t let them build the production site.

Why not then, if they can? The intricacies and time spent on testing and debugging is a start, but I also spend a lot of time keeping up to speed on how Google looks at my code, mobile development, I’m still getting to grips with HTML5 and CSS3, I’m work hard on optimising code, and if I had to do all of that and design sites I build I would let myself down in one area. Not to mention I am not a designer, I do code, that is my passion and so I’m sticking to it and not learning design or keeping on top of design to be able to do both.

You could well apply the same principle to the difference between a front end developer and a back end developer, but I’ve got work to do!

My review which I recorded in January made it onto the podcast number 198, and as it was the author presenting the review, it became a lot funnier than I had ever planned!

In my opinion I believe a wireframe should simple layout exactly what information should be displayed on a page and define the importance of that information, in relation to the rest of the content.

With this idea in mind, a wireframe does not necessarily have to provide any sort of guide to the actual layout of a page. There isn’t really anything wrong with this for a simple contact page wireframe:

That will provide the main information required by a wireframe, and producing this format for every page to be developed should meet the designers needs.

However one point above is always missed, producing a wireframe for every page. Without doing this you are not creating an information architecture for a designer to follow, resulting in questioning why wirframes for any pages were created at all.

The same problem applies to wireframes that incorporate some form of layout:

Example wireframe - courtesy of http://totheweb.com

Creating a wireframe for every page becomes even more important with this wireframe style, in my opinion. Creating this type of wireframe for only a small number of pages during the information architecture stage of a web site process results in designers feeling restricted to make all pages following the same layout. Often the content will lend itself to a completely different layout, which means it needs its own wireframe and if not it should be easy to create another wireframe based on what has already been created.

One other thing I often find missing from wireframes are annotations. Visual representation is fine, but if you really want to let a client or designer know what you plan for the page, it needs to be annotated well. The annotations let the wireframe make sense and are vital to communicating the user experience. A poorly annoted wireframe wil result in poorly communicated ideas and will very probably hinder the final user experience.

So that’s what I think about wireframes, feel free to correct me if you think I’m wrong, or to add to this because wireframes are such an important part of the web development process that I think anyone involved in the industry should input into how wireframes can help ease the pressure on project management, information architecture, design and development.

So here it is, the blog on the dreaded subject of email marketing from a my point of view, why we hate it, how we can make it work, what people can do to make our lives easier and campaigns more efficient and effective.

Why don’t I like building emails?

This is simple. We love accessible, semantic, standards based code. We do not like going back to techniques used over 10 years ago. We have to use out of date layout techniques and the code is long winded, complicated and boring to produce. It wouldn’t be so bad if we could use the same HTML and CSS standards we use for web sites, but unfortunately it isn’t an option. Not if you want your campaigns to include the creative idea that you are so sure will work, at least. And this doesn’t look like changing anytime soon.

If you haven’t seen the problems with Microsoft Outlook 2007 using Microsft Word to render emails, then the internet is full of disgruntled people. Actually, I’ll help you with that. Don’t get me started on Lotus Notes.

It isn’t our fault animated gifs don’t always work. Flash can’t be used. Hell, even background images don’t work. These points ARE NOT OUR FAULT. But it still provides a hot topic of discussion between designers/concept teams and us developers. Trust my judgement, look at how long I’ve been doing this, we do actually know what we are doing, although maybe you and your great idea are more important than everyone seeing it as intended. Or doesn’t that defy the point altogether.

There are hundreds of different software, webmail and operating system combinations for us to work to. If you want your campaign to work in even 80% of them. Please listen to my advice, not just try to replicate your print campaign in an email. They are completely different mediums.

What works?

Again, simple things.

Keep your text to standard web fonts. Don’t rely on background images. Don’t ask for Flash or an animation. Keep the layout simple. The fewer images the better. Yes we can code so things will degrade gracefully, but if the client views the email in their inbox (compared to the signed off HTML file they viewed in a browser) with missing design elements they liked, it won’t be your fault, it will be mine. So please just make the designs possible in all clients.

Unless of course you have stats showing 100% of your recipients use an email client that supports animated gifs or background images – but first of all that is unlikely to be available, let alone likely to ever happen!

Even so what people don’t seem to understand is that everything doesn’t have to happen in an email. We have awesome tools in jQuery, Flash, and even simple HTML/CSS that can impress and prompt customer action better than an email. So a well thought out simple email to get people to somewhere showcasing the creative concept and getting customers interacting will work better than trying to contain everything in someone’s inbox. I find that a simple concept to understand. Why can’t others!

In the words of Columbo…

Just one more thing, if I can get on with building sites because I don’t have complicated email discussions going back and forwards, I will be happier. Of course sites are what I love, so if emails could disappear completely I’d appreciate it.

Resources

Finally, here are some good email resources, not that you’ll probably read them anyway. All are from Campaign Monitor, because they are good.

• Microsoft takes email back 5 years
• CSS support in emails
• Designing the Campaign monitor newsletter

• Front End Developer
• Web Author
• Client Side Developer
• Web Designer
• Web Producer
• Web Programmer
• User Interface Developer
• Digital Strategist
• Web Manager
• Digital Developer

What do any of these mean? For my part, I believe that Front End Developer covers all the bases. Web developer will cover front and back end work and server side (or back end) developer will work for,  you guessed it, server side developer.

I don’t know if it is because of the young age of the industry, or if people are trying to create the most impressive sounding titles for themselves or their staff, or if it is HR not understanding what somebody does.

Why would this worry me? I worry because I currently have the title Senior Web Author. What I don’t want is people to read that who has a different definition of the role and immediately discount me from anything that I may suit. If I were offered the role today I wouldn’t expect to be heavily involved in HTML/CSS and Javascript development, but I would think that an author would be more involved in content authoring.

The same works the other way, I may be looking for a role and find that I completely miss my perfect job because it was advertised as a “web designer” role. Would I expect designers to build code? Not nowadays.

This specificity us geeks now show may be a direct contributor to the current job title confusion. Back in the early days a web designer will probably have had to build the site they design, but with technologies needing such attention, people really need to specialise as early as possible. The old saying “jack of all trades and master of none” applies a great deal in our industry.

Of course a lot of companies (including my employers GyroHSR*) are still trying to determine the best structure for their digital department, the job title situation may get worse rather than better, but I hope that anywhere I have influence we can set the following roles, all that should be needed in a web site development process, especially the small to medium builds I am involved with:

• Project Manager
• User Experience/Information Architect
• Web Designer
• Front End Developer
• Server Side Developer

And User Experience/Information Architect and Front End developer roles are the ones I look out for. How better to start trying to select something new when you know the organisation has similar structure ideas to mine.

Please comment if you have any job titles I missed, or any suggestions for jobs I might look out for I would normally skip in the listings!

* I had NOTHING to do with our terrible web site, by the way

Goodbye styles and background images, hello tables (my old friend) and broken emails.

There may be all sorts of reasons behind the move, be it a reaction to Microsoft not being allowed to bundle Internet Explorer with Windows 7 or the official Microsoft view that using Word offers the most powerful email composition tools for Outlook users. This is flawed by tha fact that recipients will require Outlook to view the emails properly, and with only 7% of the market this punishes Outlook users in my opinion. I see no reason why a corporation such as Microsoft can’t allocate the resources to create an email client that provides powerful authoring and rendering of emails, using email standards.

The Email Standards Project, Campaign Monitor (I love you guys!) and Newism have initiated a campaign, http://fixoutlook.org/, to try and highlight the problems to Microsoft, so lets all hope they listen.

Alternatively the sooner I get away from having to worry about building HTML emails, the better.

Addition: the Microsoft response

Microsoft have provided a response to the campaign on their MSDN blog which expands on a number of points I raised. In the comments I pointed out that HTML is not an email standard, and Microsoft correctly state “There is no widely-recognized consensus in the industry about what subset of HTML is appropriate for use in e-mail for interoperability“. This is my view too but of course it doesn’t make my day job any easier.

I agree that many using Word to compose rich emails will find that the easiest and most powerful method – but it still relies on the recipient using a client expecting Word formatted HTML.

Finally, if Microsoft would please prove to me that “Word has always done a great job of displaying the HTML which is commonly found in e-mails around the world” I’d appreciate it, because I think that is absolute bollocks and my professional experience backs that up.

Molly Holzschlag on stage at FOWD 2009 - Flickr image from user: vectorfunk

The conference day was in the rather big Kensington Town Hall, which was nice, having met up with Natalie from BluHalo and the @fhoke lads the sessions got underway.

After Ryan Carson introduced the day and told us what we needed to know, there was an impromtu talk from Danny Somekh which looked at applying the agile development model to web sites. Quite interesting, if a little under prepared due to being such a late addition.

Next Jim Coudal of Coudal Partners (http://www.coudal.com/) talked about how the creative process seems to focus on taking a constant and applying variables to it, using the Booking Bands game as an example. Booking Bands says combine a band and a book to make something amusing. I’ve come up with “Oliver’s Twisted Sister” and “The Bloodhounds of the Baskervilles gang”. To do this he emphasised most would take either a band and cycle through the books you know, or vice versa. He also highlighted a short attention span isn’t necessarily a bad thing for creativity.

Next was Meagan Fisher from SimpleBits on the Mobile Web. Not really anything new, but it was interesting and good to know the leaders in web geekery are promoting and fighting for the same things as I am.

Brett Welch (of www.goodbarry.com was good) was next and was really fun. He talked about the business side of our work – the following points sticking with me:

• Talk about the clients business
• Design is a commodity
• Are you worth it?
• Try to join the dots not build from new
• Sell your expertise not a product

He had a way to remember the process, involving Busta Rhymes. Business, Understand, Strategy, Targets, Actions. The end result should be effective and repeat business.

Mark Boulton (http://www.markboulton.co.uk/) was next talking about typography for the web. He made some good points, being a very intelligent bloke:

• Typography can be frustrating on the web
• Design bridges author and reader concept ideas
• Use smart defaults and push people with the ability to influence design to make correct decisions
• Make people think they are being creative
• Use a typography cascade
• Check the Vista defaults for more fonts to use
• sIFR is a pain in the arse (my personal favourite)

The next speaker was slightly different as he had a companion to help him. Who is a guide dog. Because Robin Christopherson is completely blind.

Robin (of http://www.abilitynet.org.uk/) demonstrated the difficulties that blind and users with other disabilities find whilst using the internet. He pointe4d out that a lot of disabled users use a mobile version of a site as it is simpler, that captcha is not viable, gave some tips on making things easier for your users and was overall very impressive. This is something I will take back to the office and push for better accessibility in our sites.

Mike Kus speaking - Flickr Image by vectorfunk

Mike Kus from Carsonified was up next talking about design. His slides are up at http://www.slideshare.net/mikekus/graphic-design-the-forgotten-web-standard A good talk with a good video at the end. Not really my bag though – design and stretching design legs. One good point he made was to to harness the power of the copy you are designing for and think about the copy to inspire rather than dictate.

Sabrina Dent then spoke about the Stalinist web design model. Something that I always have trouble with. Its fine to say no all the time – but I struggle when it comes down to saying the words! Sabrina backed this up with the reasons why and so it might help me say no more often. Sabrina’s blog is at http://www.sabrinadent.com/

Finally Molly Holzschlag (www.molly.com) ran through the future of web standards, covering HTML5, XHTML, Compat mode in IE8, SVG, Canvas, RDFa, Microformats and a lot more besides. Really good and perfect for what I went to FOWD for.

I will cover the workshop content in another blog – after I have conveyed the message I took away to all the good folks at GyroHSR, hopefully changing something for the better too.

It might have been a few months since I blogged, as I was rebuilding my site from the ground up, however I recently decided to maintain WordPress as my blogging platform – so I can add blogs without having to re-build the databases later… leaving about 5 months of blogging to do.

I’ll write and back date some blogs I have, including the 3 capitals bike ride and the triathlons, but some other summer news is below.

Promotion
Earlier this year I was promoted to the role of Senior Web Author, or Senior Front End Developer. About time too, say Dan and I, but now I have the title I will have to apply myself to the title more that previously – when we seemed to be doing the role without the title. I also need to start looking at my next role, and how I can progress further without becoming a management type person. I’m not ready for management roles yet!

Training
I’ve just got a training schedule and it is painful! I will stick to it as much as physically possible and see how much I can improve in triathlon next year, because there is a chance I could get well under 2:30 olympic distance, or maybe even represent GB in the amateur age group world champs. Not likely, but I’ll have to have a go.

Published
I recently wrote a blog entry for BluHalo about when should we stop supporting Internet Explorer 6.

Work wise, I’ve also started an email review system for Virgin Atlantic – which is going relatively well. I’m looking forward to completing the whole system and making it simple to update and making a system that can be used for other clients as well. I don’t think the Virgin system would work for all, due to the complexity of the dynamic content, but there is definitely something there we could sell. As much as I hate it, dynamic content does work.

Next year’s cycle challenge
I better get started on this soon, and get some fund-raising started if this is to come to fruition – but I hope next year to cycle from John O’Groats to Land’s End. Approximately 1,000 miles in 10 days I hope, but I’ll go as quick as I can! I’ll need cycle sponsorship, some support vehicle cost cover, some equipment sponsorship and fund-raising for an as yet undecided charity.

Movember
This was a mistake. I’ve joined our Movember team at work, where you grow a moustache to support male health issues, such as prostrate cancer.

I’ll blog about the danger of reply all that helped me raise most of my fund-raising later.

So other blogs are on the way, so keep an eye open!

It has been a fun few weeks! Last week I went to see Velvet Revolver, the super group made up of members from Stone Temple Pilots, Guns ‘n’ Roses and Wasted Youth, and afterwards in the private bar met Slash and Scott Weiland. Both seemed bloody nice chaps, although Weiland appeared to be the only person in the UK allowed to smoke indoors at the gig. Now that’s power.

I was extremely disappointed that while writing this I found that Velvet Revolver have parted company with Scott Weiland, Slash citing his “increasingly erratic behaviour” as the reason! Well I never!

Slash was a bloody nice chap too. And my f**king God was he good on guitar! Unbelievable in fact.

The Friday after the gig was my first sponsorship deadline, which I just about reached, with the rest on its way. Great news – I am definitely cycling to Amsterdam and Brussels in June then!! Hoorah! Speaking of which I did my first training ride on Saturday – only 20 miles, but it’s a start. This weekend I will do 40 miles and then the following weekend I will try all the way to Deal to see mother and Grandad!

The final update is possibly the best bit – for me anyway. Up there with meeting Slash! I was in .net magazine! Now it was only readers sites, but the site Griff designed for www.challengebee.org, that I built over a couple of nights a few months ago is one of the sites featured on page 18. Nice screen shot, blurb that I wrote and picture of me and the Griff. I am proud! Next up is writing a decent article for the mag, which I am sure I could do!! I’ll scan and upload to this post asap! Probably tomorrow!

So just after receiving an email asking why a complicated HTML email didn’t work in Outlook 2007 and explaining that since it uses Word to render HTML it was never going to display everything right. Obviously some people just don’t understand this.

However with almost perfect timing I got an email from xBox Live (Microsoft run) with the disclaimer above shown right at the top! Yes, Microsoft themselves are suggesting you read the HTML email in a browser rather than their own email client!

“Read this issue online if you can’t see the images or are using Outlook 2007″

Now I accept that Microsoft may be correct in that HTML should not have been used for emails at all, emails should be plain text, end of. However if you are then going to support HTML partially, whilst using HTML emails in your own marketing, with a disclaimer against your own product, something is very wrong somewhere! Anyway, all the clients I work for won’t pay for plain text emails, therefore HTML emails kind of keep me in a job!

Anyway, I found this amusing, hope you do too.