A guide to good web style for content for SEO - workshop

Originally written for People & Planet

version 0.5.1 - 2014-11-02 - latest version of this document at http://mbharris.co.uk/static/goodwebstyle.html

Why am I doing this?

• Well you've bothered to write a web page and you want to convey information to people who might be interested in it, so you ought to do yourself and them a favour and make it accessible for them to read.
• You want to make it easy for people who don't know about your web page to be able to find it. You want to promote what you do and your campaigns. So you need to also make the page accessible to search engines such as Google.
  Making your site search engine-friendly is called Search Engine Optimisation or SEO for short.

Important things to consider for both SEO, accessibility and readability

Search engines like Google index pages based on a number of criteria, there are techniques that will make your page more popular. Funnily enough some of these criteria are useful to us as a guide as to whether the content is accessible to people with disabilities, such as those who are blind or hard of sight. Here's a list of them (some of which are based on what Google has to say on the subject):

• Have a good domain name to use as your web site address. So, for example, www.peopleandplanet.org is a good one, www.p-and-p.org is not. Your domain name should be easy to read and easy to relay through speech and spell. If you're looking to promote your site through marketing, it should ideally contain the principal keywords that people might search for.
• Make sure the page title (that's the bit that is displayed at the top of your web browser's window) says clearly what it is about and is pithy. So don't bother saying Welcome to the People & Planet web site for example as 'Welcome', 'to', 'the', 'web' and 'site' are not really giving us any useful information.
• Make a site with a clear hierarchy (page structure) and text-based (rather than image-based) links. Every page should be linked to from at least one static text-based link.
• Consider offering a sitemap to your users with links that point to the important parts of your site. If the sitemap is larger than 100 or so links, you may want to break the sitemap into separate pages.
• Create a useful, information-rich site and write pages that clearly and accurately describe your content. Remember that pith is good and verbiage is bad
• Keep your content fresh and updated so that people keep coming back.
• Think about the words users would type to find your pages and make sure that your site actually includes those words within it.
• Try to use text instead of images to display important names, content or links. The Google crawler doesn't recognise text contained in images.
• Make sure that all your images have alternative text (called alt attributes) that are descriptive and accurate.
• Check for broken links and HTML that is well-formed and validates. Additionally, make sure your content is accessible by using an accessibility checker, this will also help you comply with legislation, such as the Disability Discrimination Act (DDA) of 1999 (note, recently replaced by the 2010 Equality Act).
• Check the speed of your site and act on recommendations.
• Keep the links on a given page to a reasonable number (fewer than 100).
• Make sure that your spelling and grammer are accurate (although sometimes it pays to have common mistake or variations in the same page - e.g. prorata, pro-rata and pro rata)
• Rather than keywords tags, use your keywords free-flowing in the text and often occuring, also it helps to use the stem variations, such as environment, environmentalism, environmentalist, etc.

Some frequent issues that arise on web pages that affect the user experience, and possibly the search engine optimisation

• Headings where there shouldn't be (using headings to draw attention or to shout)
• Too many images on a page for the sake of making it look pretty.
• Too many boxes on the page creating confusing content.
• Titles of pages and news articles could be punchier.
• Too many dense blocks of text (can be off-putting for readers).
• Important content below the fold (i.e. you need to scroll the browser window down in order to read it)

Appendix A: Some useful links

• W3C Web Accessability Guidelines: http://www.w3.org/WAI/intro/wcag.php
• Google's Webmasters/Site owners help: http://www.google.co.uk/support/webmasters/bin/answer.py?hl=en-uk&answer=35769

Appendix B: What is HTML?

• You don't need to worry about it, just that it exists.
• It's what the majority of web pages are written in (they could also be just images, Flash videos, or simply plain text.
• It stands for Hyper-Text Markup Language.
• The markup is where you use special codes in the text (called tags in HTML parlance) to give parts of the text special meaning.
• For example, to make something appear bold we enclose it inside some tags: >strong<bold>/strong<
• Your web browser (Firefox, Chrome, Safari, Opera, IE, etc.) shows you the result of applying the markup tags to the text, rather than all the tags themselves.
• You can see all the gobbledy-gook by choosing to View Source from the View menu - that's in Firefox, it might be different for the browser you're using.
• It's governed by an organisation called the World-Wide-Web Consortium (o W3C for short) and has a very, very wordy specification for it. There are many different versions, the latest is 5, but most web pages are written in HTML 4.01.

Revision history:

version 0.5.1: 2014-11-02 - made HTML5 compliant version 0.5: 2012-04-23 - removed old P&P-specific stuff to make it more general version 0.4: 2010-11-09 - created static content examples and provided WAI accessibility links
version 0.3: 2009-08-07 - revised links & added appendices
version 0.2: 2009-08-05 - for intern training workshop
version 0.1: 2009-05-27 - original training session

Valid HTML5