This week Paul and Marcus are joined by Ben Henick author of an excellent article about standards found on the List Apart website. Together they have a frank and open discussion about the downsides of designing with standards.
First of all let me apologise to those of you who were expecting this week’s show to be about online communities. Due to sickness and too much work I didn’t have time to prepare everything I wanted to cover. So instead of giving you second best I thought I would bring forward my interview with Ben.
I know a number of you are sick of me talking about standards but I am sure that this week’s show will be a pleasant change. Instead of me waffling on about the benefits of standards we take a look at the problems faced by web designers when moving across to tableless design.
Payment gateways, secure transitions, order fulfilment. Ecommerce can be a confusing subject. In this week’s show we are joined by Eric and Ben from the eBiz Vodcast.
With Ben and Eric being almost as talkative as myself and Marcus, I am not even going to try to document all that we covered. The main topic for this week’s show was basically an introduction to setting up of an ecommerce site. We looked at some of the more confusing aspects such as payment gateways, fulfilment and credit card transactions. However, we also reviewed shopping cart software and discussed the top 10 things that make or break an online shop.
To learn more about ecommerce I highly recommend you subscribe to the EBiz Vodcast. Ben and Eric are excellent presenters that are both informative and entertaining. If you enjoy Boagworld you will love their show.
Product information can make or break an ecommerce site. In this week’s show we look at the usability of ecommerce sites and in particular how you display your products.
Recently I have been reading Jakob Nielsen’s book “Prioritizing Web Usability”. Although I don’t always agree with everything Jakob says this is an invaluable resource and I strongly recommend that you consider buying it.
I have just finished the chapter on product information for ecommerce sites. What he had to say on the subject was so good that I thought I would share some of it with you.
We cover:
Pricing – What to display and how to display it
Common Questions – Ensuring you address FAQs on subjects like delivery, returns and security
Product descriptions
Layering product information so as not to overwhelm users
Product imagery
After sales support
Supporting articles on your products and the benefits these provide you as a website owner
Later in the show we also discuss some of the comments about ecommerce usability made, in the boagworld.com forum. Unfortunately we couldn’t cover all of the issues discussed so if you would like more detail visit the ecommerce thread on our message board.
In the news
There are some very interesting stories in the news this week. Probably the biggest story is the possibility that Google intend to by YouTube. For more information on this acquisition check out TechCrunch’s report. However, more interest to me are two stories found on the BBC website. The first is a report stating that people are more concerned about net crime than being burgled. This remarkable report emphasises the need to reassure users continually about the privacy and security of their personal information. The second article exposes the fact that despite people being more tech-savvy than ever before, they are still left confused by the mass of technical jargon online.
Review
Finally, we review an easy to implement ecommerce system called Shopify. Although not quite as straightforward as RightCart it does have considerably more features and is definitely worth checking out if you are considering a small scale ecommerce website. For a more complete rundown of the different ecommerce packages available read the ecommerce software thread on our forum.
This week on boagworld.com we talk to Dustin Diaz about Javascript libraries, discuss other web design podcasts, launch our web design forum and help you get started with Microformats.
This week saw an announcement by Microsoft and the BBC that they are exploring ways of developing [the BBCs] digital services. As you can see the announcement is somewhat lacking in details. However, this is potentially a huge development and could lead to some interesting online services.
Searching rich media
This year’s demo conference saw pluggd announce an amazing new feature that allows you to search inside of podcasts. This is symptomatic of a growing movement to ensure that rich media content is searchable. Other players in this space include Veotag and Podzinger.
Questions and comments
This week’s show included two excellent audio questions from listeners.
The first was about the open source forum software I mentioned a few weeks back called Vanilla. This led to a discussion about running online communities, the integration of Vanilla and my hopes for the new boagworld forum.
The second question was about what other podcasts I would recommend. Below are the list of the one’s I mentioned on the show. However, you can find a more comprehensive list of web design podcasts by going here.
The main feature today is an interview with Dustin Diaz
about Javascript libraries. Javascript is becoming increasingly important as web designers produce ever more powerful web applications. But, how do Javascript libraries fit in? Do they enable rapid development or are they simply a crutch for those that can’t be bothered to learn the language?
Review
There are so many great website applications around these days, many of which allow you to add their functionality to your own site through web services and APIs. The problem is that it is hard to discover what exactly is available. This week on boagworld we review three sites that help you do exactly that:
We all want better listings for our sites on Google, but search engine optimisation often appears to be a dark art and a morally murky area. In this show, we explore the issue and provide some practical advice.
Google accounts for over 49% of all searches and has one of the most complex and closely guarded search algorithms. It is not surprising therefore that your website ranking on Google can be a subject of much pain and frustration.
Ranking criteria
The exact nature of how Google ranks websites is largely unknown. However, it is generally accepted that the following items are a major contributing factor:
The age of your domain name
The amount of content available to the search engines
The amount of websites linking to your website and their popularity
The information architecture of your website
The quality of a page build
The relevancy to the end user
Page Ranking
A broad-brush indication of your rating is Google’s Page Rank. This numerical value provides some idea of your success in search rankings. There are numerous ways of viewing your page ranking but probably the simplest is to install the Google Toolbar.
Page Indexing
Another important factor in ranking your site is the accessibility of your content to Google. Google can only list your pages if it can access them. You can easily find out how much of your site is indexed by typing the following into Google:
Site:yourDomain.com
This won’t return every page as it will consider some pages duplicates. To see all pages click on the link at the bottom of the results.
Inbound Links
Of course probably the most significant factor in your page ranking, is still inbound links. The quantity and quality of links are crucial in how well your site is rated. You can view how many sites link to you by entering the following into Google:
Link:yourDomain.com
What does Google look at?
So when Google visits your site, what exactly is it looking for? Well, Google pays particular attention to the following elements on your pages:
The page title
The body content
Your meta tags
Headings
The naming and destination of links
Of course Google cannot index everything. It struggles with some content and cannot access others at all. Below is a list of the more troublesome elements. Although these elements can be used on a site you should not rely on a search engine being able to fully index them:
Images
PDF documents
Flash
Multimedia content
SEO Good Practice
Understanding how Google works is one thing, improving your listing is quite another. Below are is a list of good practices I have picked up while researching the show. These should go a long way to helping you improve your sites placement. However, ultimately search engine is a specialist area and you may wish to consider outsourcing this work if you are able.
Identify a list of keywords to focus on. Keep it short and specific. Trying to ranking highly on lots of broad phrases will prove impossible.
Endeavour to include keywords in your page URLs. Look at the address for this page. Notice that it repeats the title of the article. Does your site do this or does it have incomprehensible URLs?
Use Heading Tags and keeping the H1 tag for the page title rather than the title of the site.
Make sure that every page has real content rather than lists of links. I recommend at least 50 words per page.
Wherever possible using keywords in your links (both in the body of the page and within navigation).
Separate your content from your design by using CSS based layout.
Make sure any Javascript you use is unobtrusive and degrades nicely.
Ensure that meta data (keywords and descriptions) is unique to each page and not generic across the whole site.
Remember that content only accessible after submitting a form is invisible to Google.
Wherever possible, link to other content within your own site using consistent link descriptions.
Ensure all images have an alt attribute (alt tag).
Make sure your site has a sitemap.
Look at your competition and analysis what SEO steps they are taking.
Conclusion
Improving your ranking on Google can be a slow and frustrating experience. It is not unusual for a website to take 4 months to be fully listed and even longer if it is a new domain. Even more frustrating is the fact that Google keeps much of its algorithm a closely guarded secret, which means that much of what we know about improving rankings is educated guesswork. Despite that, we cannot ignore Google. They are a dominant force in the marketplace and search engine listings are a vital component of any online marketing strategy.
On this 50th episode of boagworld.com we turn the tables allowing you the listener to set the agenda. Based entirely on listener submitted questions we cover the future of boagworld, top tips for podcasting, working with javascript libraries and whether tables and web standards can be combined.
Thanks to everybody who sent in questions for the show and thanks too to all of you who have support boagworld over the last 50 episodes. Both myself and Marcus have been overwhelmed by the encouragement and feedback we have received. It is our hope that the next 50 episodes will see the show grow and include more of what you guys have to say, rather than our endless waffle. We really want to build up the comments and questions segment of the show as well as adding a decent forum to this site. So, if you have a question, comment or request for the show then send us an MP3 file through Odeo:
What about you? What would you like out of the show? What should we be covering? What needs changing? What should we be sure to keep? Let us know by posting a comment.
The d.construct web conference was awesome. Anytime you get to meet up with other web developers and discuss the future of the web, it is sure to be an inspiring experience. Add to that a great line up of speakers and it is guaranteed to be a memorable day.
I went to the conference knowing very little about web services and with some real concerns about their viability in a real business environment. However, a day spent chatting with other developers and listening to the speakers, not only educated me but also made me very excited about the potential.
I spent most of the day interviewing, however only a fraction are used on the show. Audio quality was a constant battle and background noise a real issue. However, there is loads of great stuff and I have tried to piece it together in such a way that it introduces you to the potential of web services as well as providing you with a sense of the day.
Next week’s show going to be entirely based on user submitted questions and comments. To take part simply send your question or comment to [email protected] or submit an audio comment via the odeo website. Remember, your question can be on anything you want, from web design to Marcus’ pop career! We look forward to hearing from you.
What are the technical considerations you need to take into account before building your new website? Understanding things like the technical constraints faced by your users or inherent in your hosting environment, helps to define the functionality of your site.
Techno buster: RSS
Every site you visit these days seems to have those little orange RSS buttons. But what is RSS, how does it work and why should you consider adding an RSS feed to your site? Listen to this week’s podcast to find out more or check out the following post on web feeds.
Main feature: Technical considerations
In this weeks show we look at three main areas for consideration when developing a new site:
The technical constraints faced by users
The hosting environment where your website will reside
The integration with other business systems
Technical constraints faced by users
Probably the biggest set of technical constraints imposed on us when developing a website comes from our target audience. Factors like; the browsers used, available plugins, screen resolution, JavaScript support and bandwidth, all affect how a site is designed and built. Understanding the technical environment your users work in will dramatically alter the way you approach a web project.
Hosting environment
If you have an existing hosting platform for your site that cannot be altered, this will significantly change how your site is built. Different hosting environments support different sever side languages and databases. Also things like bandwidth capacity and streaming media services can impact whether you are able to provide rich media on your site or not.
Business systems
Integrating your website into existing business systems can be problematic. Whether you are endeavouring to tie your site into stock control / accounting systems, or ensuring it is compatible with legacy databases, backend integration can be a time consuming (and expensive process). However, if it is not properly addressed, poor integration can lead to data inconsistencies and a lot of re-keying of data.
Web resources: Backup and recovery
In response to a listener’s question, the team discuss tactics and tools to handle backup and recovery of websites and data. In particular, two tools were mentioned:
CVS
CVS is a file recovery and version control systems that can be used to manage changes to your site. As well as preventing one developer overwriting another’s work, it also allows you to rollback your website to any previous incarnation. However, be warned, this does not handle database recovery.
Groove
Although this is not strictly a backup or recovery tool, it is still invaluable if you have a distributed network of developers working on a project. By using peer-to-peer technology, it can ensure that all development files associated with a website are backed up over multiple locations. It has some great project management facilities too.
As you have probably gathered by now I am in the process of redesigning the new Headscape website. As part of it a lot of thought has been given to our approach to accessibility. This is what we have come up with.
We really wanted to demonstrate through our web presence that a site could be both visually appealing and accessible.
We wanted to show that flash could be used on a site without making it inaccessible. We wanted to show that a content management system could ensure a site remains accessible even when used by people with no coding knowledge. Finally, we wanted to make the world a happier, more loving place!
Did we achieve all of this, probably not!
The trouble is that most web designers agree web accessibility is important but few can agree on the best way of making a site accessible. That is mainly because it is still an evolving area and new ways to improve accessibility are being found all the time. As of now, we believe that the techniques used on this site are some of the best but no doubt, this will be out of date in a matter of weeks!
So what is the approach we have adopted?
Flash
A quick word on flash before we move on to things that are more important. Some hard line accessibility zealots will no doubt disapprove of our use of flash on this site. However, we believe that if used correctly flash and accessibility can sit comfortably side by side. Whenever we have used flash we have ensure it is accompanied by a clearly marked description and alternative ways of accessing the same information it provides.
WAI guidelines
If you are bothering to read this page, you have probably already heard of the WAI guidelines which layout three levels of accessibility. This site has been designed to be level three compliant (the highest level), with one notable exception.
Use relative rather than absolute units in markup language attribute values and stylesheet property values.
In short, this means that everything should be scalable. That includes fonts and layout. Although in our default style, we have made the body text scalable, the rest of the interface is not. It was our feeling that, after experimenting with both scalable and elastic sites, complying with this checkpoint would undermine the design. This would jeopardise our first objective, which was to show sites could be both accessible AND visually appealing. Obviously, this decision is a subjective one, but it should not be interpreted as a lack of commitment to people with a visual impairment and who require the ability to resize text. We have just chosen to solve the problem in another way (see below).
Low vision version
Because we have largely conformed with the WAI guidelines and built the site using web standards we are hopefully that users of speech browsers will not encounter any serious problems. Of course, you can make no guarantees as speech browser have more options than you can shake a stick at, and it is possible one of these will screw up the site.
However, there is a much larger group of visually impaired people, which do not use speech browsers, but do require an enhanced interface. One option is to make all the fonts on your site resizable as explained above, but this fails to tackle some of the other issues faced by visually impaired users. We have therefore introduced a low vision style for the site that is designed specifically to meet these users’ needs without compromising the default user interface.
No doubt some of you reading this page are thinking; "but hang on, doesn’t this fly in the face of RNIB policy on web accessibility?" This refers to a statement on the RNIB site that says:
At RNIB, we recommend against providing a text only version as much as possible, simply because being treated differently can reinforce the feeling of marginalisation that someone with a disability experiences.
However, we are not talking about a separate text only version of the site that quickly becomes out of date because it is poorly maintained. What we have done is create a secondary interface to the same content designed specifically for a visually impaired audience. They are accessing exactly the same content, simply displayed in a way that suits them.
98.4% of Web users can experience Macromedia Flash content without having to download and install a player. Over 4 million homes now access the web via broadband with 40,000 new ones connecting each week. Rich Media Ads receive 5 times higher click through rates than traditional online ads. With figures like these perhaps it is time I started taking Flash seriously.
The problem with Flash
My problem is that I don’t like Flash. Or more to the point, I don’t like the way people use Flash. Also despite Macromedia’s assurances I still have serious concerns about its accessibility. However if I am truthful I think my biggest problem is ignorance. I used Flash in the early days and soon concluded that it was great for novelty animation but not much else. Well the product has since evolved and I have only recently returned to it in order to revaluate its potential.
Flash and advertising
Flash has seen its largest success in the world of online advertising and has, in conjunction with PPC advertising, revived the flagging market. Users that had become banner blind were recaptured with the TV like qualities of Flash. Flash could engage the viewer through exciting moving images and the use of high levels of interaction.
Flash has the potential to provide considerably more information on a product than a traditional banner ad without asking the user to leave the current web page they are viewing. Take for example the recent Kill Bill advert that has been short listed for the 4th Annual EyeBlaster Creative Awards. This advert not only promoted the film but allowed the user to view a gallery of images, all from within the ad itself. Another short listed advert allowed the user to play a scratch card style game while other ads even contain streaming video.
Lessons to be learnt
Of course we don’t all have large online marketing budgets to splash around on buying ad space. However that doesn’t mean we cannot learn some valuable lessons from the use of flash in online advertising.
We know that flash is a powerful ‘attention grabber’ and that the vast majority of users can view the plugin. We know the an increasing number of users have broadband access that allows the use of bandwidth intensive features such as streaming video.
With all of these things in mind perhaps it is time to look at Flash as a way of pushing traffic to key parts of our sites whether it is promoting certain products or focusing a user on a specific call to action.
Flash also allows us to demonstrate and explain complex concepts in an easier to understand and more engaging fashion. If a flash advert can allow a user to engage in an interactive scratch card game why cannot it also be used to allow users to interact with your products virtually or take part in an e-learning application. From streaming video presentations to interactive product demonstrations Flash opens up endless possibilities for your site that transcend simple text and imagery.
If you are interested in discussing how Flash could benefit your site or you are interested in running a rich media campaign then click here to email me now.