Monday, 30 September 2013

Does Your UX Suck? Principle #7: Headings are important to creatures other than People

Intro 
Headings are important signposts to people to visually navigate a site and find the information quickly. Headings should operate like flags to the reader, remember searchers are operating like hungry beasts on your site scanning your headings to find a possible answer to their question. The headings should be visually distinct, direct and if possible keep it short, but SEO has added to the importance of headings and they are now of interest to more than just human readers, so I want to talk about the text on a website in general, not just headings now to shed light on all the purposes text has on a website and who's responsible for text in a web relationship. Why? Not many people want the job of writing content for their site and without it the job can't start or finish. If it's taken up by somebody they often put their heart and soul into it to make it just right, so when the time comes to hand over the text to the Developer, it can then be difficult to see the text unravelled, deconstructed and apparently unappreciated. Writers are usually only focused on human audiences for their text, this post sheds light on the demands on the text from the web side, the text not only has to read, it has to WORK. It has a function beyond conveying meanings to humans and no matter how sincere and well written the text is, if it doesn't fulfil it's web functions, it's unlikely to receive a significant human audience anyway.  

Who's responsible for Generating Content?
You are. When building a new website, you'll be called on by your web developer to supply content about your business and products, this is normal. Content means images, graphics and text and this can be a surprise to some clients. When it comes to text, there is nobody better than you, perhaps only your staff, who can come up with relevant subjects for content as you know your industry, your unique selling points and your customer's needs best. Often, there is an expectation that the web developer supplies content and this expectation can extend to logos, video, images, policy documents, everything. This isn't the case: graphic designers do logos, video editors do video, photographers do photography. In the case of text for your website, I assure you your Web Developer probably isn't a qualified copywriter. Copy writing is a distinctly different skill than web development. The Web Developer's area is the structure of your website itself and it's functionality, so the job of generating content is yours unless you are willing to incur the cost of hiring a Copywriter.

Meandering organically in web development is called Disorganisation
One of the first task a web developer will do when starting your job is to understand the content you want on your site and create a navigation system for it. If the Developer is held up waiting for you to supply a overview of the content you want on your site, they can't be assured that the work they're doing is realistic. Meandering organically through web development is costly, so you should expect your web developer to lead the process and request content by certain times. Expect a limit to reworkings and expect a point when new ideas simply can't be included, idea generation is for the early stages of the website planning and once coding gets underway it will be restricted, probably by constraints of the Navigation and especially when developing a responsive site that goes to phone.

Once your text is written, the Developer will allocate it to a page within the navigation and a box within the structure of the page. Days of coding to format the text to the look of your branding will ensue and then the reshaping of the text can begin for the non-human audience. You see, a SEO specialist will be making sure that Spiders find your words and phrases in all the likely hangouts that spiders like to go.

What's a Spiders doing on my site?
As you can imagine, trawling the far corners of the internet for sites to read and catalogue is a huge job for a search engine. Google says they have found 30 trillion URLs on the web and they crawl over 20 billion pages on a typical day. To do the job of reading and cataloguing all this information, Google created a little robot called ‘Googlebot’. Each search engine has one of these little robots and in SEO they’re called Spiders, Crawlers or Bots.

Spiders don't read like humans do. When the text is finished it may not even be what you would consider grammatically correct writing and certainly not what a good creative writing course would tell you to do for human readers. The conventions of good writing are not the same when writing for spiders, for example, the words we really need spider to see will be shown to spiders more than once, so it's not advisable to find an interesting variety of descriptive language as you would for humans, repetition is key when it comes to a spider. Headings, usually signposts to readers, are an opportunity for Spider bait. In some cases the use of grammar may inhibit spider from seeing a series of words we call key phrases, so grammar is ditched for the sake of rank.

Conclusion
So you see, there are demands and pressures on your text from all sides on the web. For text to perform and bring in the readers, it needs to convey something interesting, look attractive, convey which order its to be read, but above all and first text needs to be findable by a spider. It really is a process, the words you generate are fed into the cycle raw and are refined and added to, to come out the other side highly functioning. Now that you know I hope you are able to enjoy the process of your website development a whole lot more and get that text to your Developer quickly, knowing that they are going to change it considerably and really do appreciate your effort. In fact, they couldn't do it without you.

Saturday, 28 September 2013

Does Your UX Suck? Principle #6: Links Are Consistent & Easy to Identify

Links must be easily identified and their look should be consistent throughout the document, but does a hyperlink have to be the default of blue and underlined these days for readers to know it's a hyperlink?  No. These days any element given emphasis to stand out from the other components on the page is expected to be linked. Let me example what I'm saying right here: hyperlinks don't have to be blue or underlined. Any element can be given emphasis to attract a reader's attention and today's readers test for interactivity, looking for small clues like the hand cursor to indicate the presence of a hyperlinked element. The upside of this for web designers is that links can be within the colour scheme of the website and therefore harmonious to their surrounds and the readers flow inside the document.

Older UX checklists advise to limit hyperlinks so as not to distract the reader, but the value of hyperlinks to Google's understanding of your website is well known by SEO strategists. Many of the top ranking SEO companies have over 1000 links on their websites. In the past the links have contributed to the authority of the website and it's credibility, but Google warns that things have changed and link farming is frowned upon. Websites risk being demoted by Google in future if the links are found to be pointless. Still, sites with heaps of links are achieving a higher page authority and a higher rank than those without, so Snap2's Local Bizz Refresh steadily adds quality links to websites, both inbound and outbound links, and seeks out links of real value to your audience.


Wednesday, 25 September 2013

Does Your UX Suck? Principle #5:The number of buttons needs to be reasonable.

The number of buttons needs to be reasonable, but what is a reasonable number of buttons?
The buttons of your navigation are generated by your content. It's essential that the content be well  organised into pages and the full Navigation system be well planned and easily distinguished. It is likely that you will end up with 2 or 3 navigation systems leading visitors around your site. The Primary Navigation needs to be visible above the fold. Standard names of primary navigation buttons are Home, About, Contact, Services, perhaps FAQs, Portfolio and a variety of others depending on the industry behind the website and shouldn't comprise any more than 7 buttons in total.

Why only 7?
Too many buttons never really was an issue for websites until the proliferation of mobile devices. The Nav systems you create on a standard website will need to adjust to work on a small screen device too, as your site will at some point become responsive. The primary Nav menu needs to be accessible from anywhere on the page. For touch devices, nav buttons become more and more problematic as the screen gets smaller, because there simply isn't the room for buttons as well as viewing area.

If you're committed to the idea of super light sites, an unreasonable number of pages isn't to your advantage either. Complex sites are heavier in MB and Google prefers super light sites. When the site components shuffle for the phone screen size, unreasonable amounts of information will need to be weeded out anyway.

Saturday, 21 September 2013

Does Your UX Suck? Principle #4: Company Logo Is Prominent and Company Information available.

The position of the Logo
Below the fold is the area below the view area. To get "below the fold" means scrolling down after the page has finished loading. A few years ago designers were making page heights specific to monitors sizes and it was not good form to make people scroll, left, right or down, but responsivity (websites that go to phones and tablets) and the many various screen sizes that websites must now perform on, have changed all that. The latest websites are built to scroll in every direction.

So the conversation about what is appropriate for positioning 'below the fold'  has become an important feature of UX. It is agreed that below the fold is NOT considered a prominent area, which seems an obvious thing to say, but I have had clients want to move their company logo from top-right to below the fold. The company logo should be placed in the prime real estate of a webpage, that's the top. Keep in mind that Google can't read image Banners, so you'll see less and less of them on the net now. With the release of HTML 5, which is the standard about to be released by the World Wide Web Consortium (W3C), the structure of the page is being given specific tag names that Google is geared to watch out for. If your logo is an image it should be named in a SEO friendly manner and be siting where Google expects to find it, top. The logo image will not be a banner, the image length will only span the width of the logo and the extra space will allow other important company text.

Webfonts are a very exciting development for future websites. Websfonts are a library of funky fonts which allow designers to build text based logos on a webpage, rather than image based ones. This will be great for SEO as Googlebot will be able to read a logos content, but Webfonts aren't stable yet and can drop back to a plain old default. Logos should look the same where ever they show up and most companies would not like the idea of their logo changing it's style on an older browser. If you would like to see a webfont in action visit Snap2 SEO, our major headings and our logo is webfont, 'Matiz'. I allow webfont in my logo because I am more interested in Google's ability to read my business name. It's ok with me if it drops back to the default font of Arial on some older browsers.

UX gurus agree the Main Navigation needs to be above the fold also. The main Navigation buttons are the primary access points to the rest of your site, there may also be Secondary Navigation. The Primary Navigation needs to be obvious from the get go and that's above the fold. The Secondary Navigation is ok to put below the fold.

What should be 'Below the Fold'?
I've seen sites with so much top real-estate given to paid advertising that you couldn't distinguish the company logo, it was swamped by other company's advertising. For your logo to have Prominence your logo has to stand out from the surrounds. Google will wonder about your Credibility if he sees paid advertising above the fold, so advertising definitely should go below the fold and should never be near your own logo.

Company Information can go 'Below the Fold' The Company Info which includes the address or contact details can go below the fold, in fact, usability experts suggest that it helpful to have it on the bottom of every page. More lengthy company information can go on the About page and usually gives a visitor the complete story of the company, all they need to know about the company, the staff and even their commitment to quality.

Wednesday, 18 September 2013

Does Your UX Suck? Principle #2: Legibility of Text for All your visitors

Colour of Text
“Dark-gray on light-gray may seem stylish” says Dr. Peter J. Meyers1 , but due to browsers rendering colour unreliably, websites with poor contrast between text and background may be risky for legibility of your site. Dr. Meyers also suggests that font sizes should err on the side of too big and the recommended starting point is 16pts.
You know at least 1 in 10 men are colour blind and poor contrast is an issue for sufferers of colour blindness, so your choice for text colour and backgrounds needs to be made carefully. For visitors to your site, clicking on buttons you can't read can be a frightening experience.

Access
Be aware that sight-impaired visitors use ALT tags to read your site, it's an industry standard and law that sites be accessible to vision impaired folk, so Alt tags need to be included on your site. An Alt tag is visible to sighted readers, you've all seen a yellow tool tip like label appear with the name of the image when you place you cursor over the image on your site. Vision Impaired can set their computer to speak the Alt tag label.
 Insist your designers follow standard and insist on Alt tags.

Standards
More interestingly though, missing Alt tags indicate that your site probably isn't being "validated", either. Validation is a process used to eradicate errors in the code of your site. When you test a website for validation, you eradicate known issues that cause browsers to mess up your site. If your site was "validated" before release, missing Alt tags would set off alerts throughout, and many other more important errors would be highlighted and fixed before release. Expect that your site should be Validated and a company who doesn't care about Validation isn't providing you with a professional product.

1. Dr. Meyers, P.J. 2012. Usereffect, Strategic
Web Usability: 25-point Website Usability Checklist.
Retrieved 23-9-12. http://www.usereffect.com/
topic/25-point-website-usability-checklist