Web Design News 25/05/10

Paul Boag

This week: Things I discovered at Future of web design, google open source web fonts, using flash to fill in the gaps and choosing the right image.

Future of web design

I don’t normally write about the conferences I attend. However, I did want to share a little bit about this years FOWD.

The Carsonified conferences are normally good but this year was exceptional. The speakers were brilliant, the venue was stunning and they even fed us at lunch!

However, that is not why I want to write about it here. My reason for mentioning it is because we was told about four websites that maybe of interest to you.

  • Think Vitamin Membership – Announced at FOWD and launching next month, Think Vitamin membership is a direct competitor to Lynda.com. At less than $1 a day membership you get access to a growing library of web tutorials, 4 online conferences a year, live Q&A sessions with leading figures in the web community and discounted ticket prices to Carsonified events.
  • Text Captcha – One of the speakers at FOWD was Robin Christopherson who among other things talked about the accessibility problems of Captcha. As an alternative he suggested Text Captcha which requires the user to complete a simple logic question before submitting information to your site. What is so nice about Text Captcha is that it has an API you can use to integrate thousands of possible questions into your site.
  • Fire Query – Another great tool came from Remy Sharp. It is an addon to Firebug called Fire Query. Fire Query is a tool designed to help develop in jQuery. It has some great features and if you work with jQuery it is definitely worth checking out.
  • CSS generator – The final tool was recommended by Dan Cederholm and is invaluable if you want to start using some of the more advanced CSS properties. Essentially it provides a GUI that generates code for CSS gradients, shadows and transforms.


Google open source web fonts

Without a doubt the biggest story of the week is the fact Google has teamed up with Typekit to launch the Google Font API.

The arrival of Google in an already crowded marketplace including the likes of Typekit, Fontdeck and Fonts.com is another boost for web fonts.

What makes Google’s approach unique is that they are focusing on open source fonts. This means the service is entirely free and does not have to rely on Javascript. You just link to the font and away you go as you can see from the example below…

Embedding fonts is easy!

Although their font directory currently only consists of 18 fonts I am sure this will grow quickly. Also with Google’s reputation for speed and robustness some of the concerns over relying on a third party service are reduced.

Web fonts are still far from perfect with issues over download size and anti-aliasing. However, the more companies we see enter this space the faster we will see the service mature. Its good to see Google adding their weight to web typography.

Choosing imagery

Choosing the right imagery for a website can be a significant challenge for web designers. It is even harder for website owners who do not have design training. However, both groups select imagery for websites on a regular basis and their decisions have a significant affect on how users perceive the site.

Image of a website missing a key image

Fortunately the Web Designer Depot is here to help with a post entitled “Avoid Perfect Photo Syndrome.”

The aim of the post is to help us overcome the problem of finding that perfect image. According to the post this problem is two fold…

a lack of ideas and a glut of art

First it helps you overcome a lack of ideas by focusing you on what it is you wish to communicate. It then refines this through experimentation and work association. Finally it encourages us to be original by doing something unexpected and think beyond our first impressions.

When dealing with the glut of imagery available online it focuses on narrowing the field by looking at shape, colour, tone and focus.

For website owners this post is a great introduction to the design principles behind image selection. For web designers it is more of an encouragement to experiment and try rather than endless searching for the perfect image. The post ends with these wise words…

Choosing images doesn’t always have to be hard. Trouble usually comes when you hunt for that one “perfect” image.

Lacking images is akin to having writer’s block. Sometimes the cure is to stop worrying and start experimenting.

Flash, filling in the gaps

I want to finish today by mentioning a great post by Jonathan Snook about the changing role of Flash.

This post is focused purely at the web design community so if you are a website owner you can probably skip this one.

However, if you are a designer or developer I would certainly recommend it. It is possible the most balanced, down to earth and pragmatic assessment of the role of Flash I have read.

It begins with a history lesson, explaining why Flash was needed in the first place. Jonathan explains that Flash exists to fill the gaps that HTML, CSS and Javascript could not…

Between then and now they’ve managed to offer useful features such as cross-domain requests, local storage, binary sockets, multi-file uploads, and shared objects. On the animation front, there are 3D effects, inverse kinetics, and pixel bending. On the streaming side, there is support for multiple codecs, full-screen playback, and dynamic streaming. Flash also allows for screen, audio, and webcam capturing, as well as peer-to-peer connections.

He then points out that developments in the W3C technologies and improved browser support has started to make some of these jobs redundant. However as he points out…

HTML5 just doesn’t have the same breadth of features as Flash. That’s not to say browsers won’t get there someday. It’s just not there, yet.

The thrust of his argument is really summed up in the last two paragraphs…

As web developers, we should choose the best tools and technology for the job. To do otherwise—out of ignorance or some duty to “web standards”—is a disservice to the clients and customers we serve.

Right now, HTML5 is slowly becoming a viable alternative to Flash for a greater variety of situations. However, Flash will continue to fill in the gaps for years to come because it continues to solve problems that web developers have and that can’t be solved with any other client-side technology.

Its hard to argue with that. I am however glad that I need to turn to Flash less and less.