Usability Tips For Websites

Published on 30 Jun 2013 at 9:20 pm.
Filed under Google,Social Media,Web stuff,writing.

Web page usability tips to help your users to get the most out of your site. These tips will help small business owners maximize their ROI.

Usability Tip: Social Media Sharing Thumbnail Images

It’s well-known that a picture will make your page stand out when shared on social media networks. Facebook, LinkedIn, and Google+ will scan your page for images to display a thumbnail with the link. Twitter will also do this if you’re approved for Twitter Cards. Each network follows the Open Graph Protocol. Except for Twitter, they will scan your page and try to figure things out if those tags are not used. Each network has different rules for what size images work best.

• Facebook requires an image that is at least 200×200 and less than 1500×1500. This was a recent change in their documentation. Until recently Facebook looked for images that were 50×50. They also needed an aspect ratio of 3:1. The aspect ratio is no longer listed in their documentation. I would still recommend you keep it in mind.
• Google+ requires an image be 100×120 and the aspect ratio cannot exceed 3.
• LinkedIn requires an image be at least 80×150. LinkedIn will always display your picture as 180×110. Try to keep that ratio.
• Summary Twitter Cards requires an image be at least 60×60. Images greater than 200×200 are re-sized and cropped to 200×200.

Facebook, LinkedIn, and Twitter all cache requests for one week. Google+ honors cache-control directives just like a web browser would. Facebook’s Debugger (formerly called Lint) allows you to clear their cache. The Twitter Card Validator (usually) clears the Twitter cache.

LinkedIn does not offer a cache clearing mechanism at this time. The only way around this is to append a query string to the URL for the page (e.g. “?try=first”). Because of this I would recommend all of your images try to keep in line with LinkedIn’s 180×110 ratio. I’m hopeful that this will change in the future. They are the go-to place for listing your employment skills and experience. If they can’t find quality developers, who can?

Usability Tip: Avoid Opening New Windows

I know I’m going to get some internal flack for saying this — it is the top most web design debates — but simply don’t open external links in new windows. Top user interface and usability researchers agree that you should place users in control. A PhD thesis has been successfully defended showing that users naturally have trouble returning to items that they have visited before. Government reports show that a disabled back button can result in confusion and frustration for users.

The user interface experts have one exception to this rule. This exception is for PDF and other non-web documents because users forget they’re in a web browser and accidentally close the browser window. That is why the government report I linked to earlier opened in a new window.

Usability Tip: Bold and Bulleted Content

Did you find yourself drawn to the four bulleted items in the first tip? How about the headlines and the line about LinkedIn caching earlier? You’re not alone. A ClickTale study found that bold words and bulleted content draw attention. Even more so than the content above the fold! These points are so strong that they found that it caused users to re-engaged with the content after attention waned.

This post was originally published as Usability Tips for Websites for Brand Builder Websites.