Web standards for page authors
The following standards are for authors creating content for approval to be published on Hampshire County Council websites. It ensures the quality and accessibility of content on the web.
There are additional standards for editors, developers and contractors.
If you have any questions about the standards or how they apply to your pages please contact the Corporate Web Team.
All web standards are mandatory. Your page will be rejected for publication if you do not follow these standards.
Web address standard
Web addresses must be short and meaningful to the visitor
Web addresses must remain static to prevent broken links and retain ranking in search engines
Web addresses must be in lower case, contain no spaces or punctuation
More details on web address standards
Web addresses should be short, meaningful and memorable. This makes it easier to print the URL, read it out over the telephone and use in radio and media advertising.
When naming web pages you must use lower case with no punctuation or spaces. Underscores should not be used as this can cause confusion when links are underlined (on web pages, in emails and other electronic documents).
The name must be meaningful, so use real names rather than abbreviations or code. It should also be unambiguous when spoken and easy to type. This will make your web page address (URL) more memorable and easier to direct people to.
URLs (web addresses) must remain stable so they remain reliable to link to, feature well in search engines and are memorable to the user. Changing the names of established web pages is discouraged and may be refused.
Redirecting URL's is possible, please contact your web manager to arrange this if required.
Web pages that appear in print must not be the format www3.hants.gov.uk. Please contact the ·Corporate Web Team for information on setting up a redirect.
How to apply the standard
Use customer language. Think about what words people might use to find your page.
Do not use Council specific phrases, jargon, abbreviations or acronyms.
Try reading out your URL to someone – see if they can tell what the page is about from the URL alone.
You can make your web address easier to read by using hyphens, try not to overuse these.
Simple, clear URL's
When printing, advertising, promoting your URL please use top level pages rather and ensure these are up to date with the information you need to be found.
Page title standards
Every page must have a unique page title.
Page titles must be meaningful to the customer.
Page titles must be short preferably less than 70 characters long.
Why do we have these standards?
Page titles are an important navigation aid and are there to help get your content found by letting users know what can be found on the page.
The page title appears in several places:
in the bar at the top of your browser
in the results listings of search engines
in a browser's history list of recently visited web pages
in a browser's bookmarks/favourite list
In many of these locations, long titles will be cut short for example:
Google only displays the first 64 characters of a title
using your browser's history to return to a page that you looked at earlier can be difficult if you can't see the full title
A good title that clearly conveys what a page is about will improve the page's placing in search engine results
Using the same title for different pages causes problems when looking for pages in search results, history lists and bookmarking/favourites menus
This standard is mandatory for usability and accessibility reasons.
How to apply the standards
Use customer language. Think about what words people might use to find your page. Include these in your title.
Do not use Council specific phrases, jargon, abbreviations or acronyms.
Try reading your title to someone – see if they can tell what the page is about from the title alone.
Do not use 'Welcome to Mypage/Homepage'.
If you need to shorten a long title:
decide which words are essential to describe the content of the page. Try rephrasing the title to include just these words.
consider whether you could split the title and have part of the it as the first heading on the page.
Bad examples of page titles:
Sir George Staunton Country Park Joint Committee Meetings, minutes, agenda and report for the 21 march 2013
How to improve the bad ones.
Adoption - adopt a child in Hampshire
Eclipse - Gosport and Fareham rapid bus service
Search Hampshire's Museums Collections
Staunton Country Park Joint Committee - March 21 2013
Good examples of page titles:
Hampshire school holidays and school term dates
Hampshire school admissions - apply online
Find my nearest waste recycling centre in Hampshire
Contact Hampshire County Council
Heading web standard
All content must be structured using Heading styles.
The first heading on a page must be Heading 1.
All sub titles must then use heading styles in sequence
Make headings short and clear
All customers use headings to navigate web pages,headings elements should convey document structure Use informative headings so that users can scan a page quickly for information rather than reading it in detail.
Visually-impaired users who use assistive technologies (eg screen readers) rely on heading tags to navigate through web pages. It's important that headings are used in the correct way and that headings are not created by styling text to look like headings.Avoid slang, jargon and specialised meanings of familiar words. Use customer language, words that are commonly used.
There are 4 levels of headings, they appear on the page:
Content must been written in Plain English (clear, concise, active, personal, avoid jargon)
Large blocks of bold or upper case text must not be used.
Italic or underlined text must not be used.
Spelling and grammar must be correct.
Content must be accurate. It must not be out of date.
Scrolling or moving text must not be used.
Content should be able to be read and understood by an average 14 year old.
You must explain acronyms when you use them
Plain English should always be used. Editors and authors should ensure that text is short simple sentences and that they write it with their intended audience in mind and avoid jargon. Hantsweb is intended to be used by everyone, overseas visitors will benefit from simple language as this is easier to understand.
Sentences should generally be no more than 15 – 20 words.
Paragraphs should generally be no more than 3 - 4 sentences.
Avoid jargon and unnecessarily complicated words
Use active sentences and personal terms (I, we, you etc).
Write your web pages from a user perspective and take advantage of working in a different kind of media to a printed page. Do not simply reproduce hardcopy leaflets that may contain inappropriate expressions such as 'see page 2 of this leaflet for further information' or 'see overleaf…'
Scanning printed text for publication on the web using optical character readers is a straightforward process and increasingly common. However, you should review the text carefully after scanning for conversion errors (for example 'b' and 'd' reversal) and to strip out inappropriate 'Text'.
- No pop up or new windows
- Links within the main body must have a standard appearance
- Link text must make sense when taken out of context, do not use 'click here' and avoid using raw URLs as a link
- Links must not use the same link text for different link destinations on the same page
- Do not link to Hantsnet pages (intranet) from Hantsweb (internet)
- All redirects must be approved by your web manager
No 'Pop up' or new windows
Some web sites cause a pop up window (often used for adverts) to appear or create hyperlinks that cause a new browser window to be opened when a specific hyperlink is accessed. This is not permitted. When creating hyperlinks to other web pages - either within Hantsweb, Hantsnet or on an external web site - the hyperlink must never open a new browser window. This breaks the functionality of the back button, confuses visitors and can be especially troublesome for screen readers.
Links must have a standard appearance
In the web page content (main body) links must use the standard corporate default settings for colour and appearance. If using a sidebar as part of web page navigation you may provide more dynamic links. These links must be recognisable as links and readable before using them e.g. before you place your mouse on them. They must work if scripting is switched off. The style and format must be consistent throughout your collection.
Link text must make sense when taken out of context
Users tend to scan web pages so use link text that is clear, easy to read, relevant and concise.
Using raw URLs or ‘click here’ or 'more' as link text, or any similar words or phrases (here, read more, further details, etc) is one of the most common examples of bad practice. A user should click on a link because that is where they want to go, not to find out where it goes.
A good piece of link text is one that is meaningful when taken out of context. For example:
- The BBC homepage is always up to date. To look at it click here.
- Hantsweb is the Council’s public facing website, click here.
- Click here to contact the Web Services Team.
- The BBC homepage is always up to date.
- Hantsweb is the Council’s public facing website.
- Contact the Web Services Team.
When people read a webpage they will instinctively scan for the links in the page. Example B makes it very easy to identify quickly where the links will take you. Example A forces you to read the entire sentence before you know where you are going.
Screen readers have the ability to present the page simply as a series of links, so that the navigation is read separately from the content of the page.. If text links on your page use phrases such as 'click here', 'full story' and 'read more' they tell the user nothing about the content behind.
Within a page the same text must never be used for links to different pages.
Email mailto links should be formatted as follows: firstname.lastname@example.org. This ensures that if users do not have their email software configured with their browser they have the opportunity to cut and paste the address into another package. Also, when a page is printed, the email address will appear in full.
Search engines pay a lot of attention to links. The text on links tells users and search engines very useful information about the linked to URL and also provides information about the scope and nature of
the website through building a picture of related information.
Links must not use the same link text for different link destinations
The same link text cannot be used for different link destinations. For example: Contact us can only go to one destination. In Hantsweb's example to the corporate contact us page. On your site you cannot use contact us for your team's page as this has already be used on the page. You can instead use contacts or contact the team.
A broken link is when the site you are pointing to either changes address or no longer exists. Links have to be kept up to date and must be reviewed regularly. Also, be aware, if you are deleting a page, that there may be many links pointing to your web page. Please let your web manager know if you are removing a web page.
Do not link to Hantsnet pages (intranet) from Hantsweb (internet)
Caution - A link from a Hantsweb page to a Hantsnet page will show a log in screen to the HPA page and all external visitors to Hantsweb will be unable to access these pages.
- Video, sound and Flash files must only be used to enhance your website. The site must be functional without these files.
- When linking to a multimedia download you must provide the size of the file, file type and details of estimated download times.
- Multimedia files must not run on a continuous loop. Users must be given the facility to halt the loop if required.
- File type must be .flv
- Resolution should be maximum 550px wide by a proportionate height (to fit Hantsweb template)
- Both audio and video files can act as an excellent means of conveying information as long as alternatives are provided. Therefore, all audio and videos files must have a transcript published in HTML
- Every image must have relevant alternative text
- Graphical information (e.g. charts) must also be available in html format
- Graphics must not be used to replace text or as page or section headings.
- Clip art must not be used
- Total size of a single graphic embedded in a page must not exceed 50KB
- Total size of a single web page (including graphics and text) must not exceed 120KB
- Animated images should not be used without prior authorisation from the Corporate Webmaster
- If you have to use a large graphic link to it via a 'thumbnail'
- Banner images must be approved by departmental web editors
Alternative text and images containing useful information
You must always use alternative text on all images. Alternative text enables visitors who are not able to view the graphics (they might have graphics turned off, they might be using a text only browser or they could be using a screen reader) to make sense of the information it is providing. It is important to make the alternative text sensible and descriptive.
Do not use text as graphics. Use of a graphic containing text may be appropriate where you're reproducing a logo, such as the County Council's official logo. Using graphics for page or section headings is bad practice breaks accessibility standards.
Images as links must also be provided with a text alternative - images must never be the sole means of linking/navigation.
Graphs and charts can be produced in graphic format but this information must also be provided in text.
Image quality and types
Clip art is not permitted in Hantsweb - any use of clip art will be removed from your page. Clip art, such as that found in Microsoft Word or available from many web sites, can look unprofessional and is often not relevant.
Specially commissioned professional/high quality collections of graphics and art work are permitted.
Animated graphics should not be used. In extreme cases there may be exceptions to this, please contact the Corporate Webmaster with your requirements.
All images to be displayed on a web page must be saved as JPG or GIF format as appropriate, as they are the most common supported formats.
Image size and download times
Large graphics will cause pages to download very slowly. The total size of a single graphic embedded within a web page must not exceed 50KB.
It is essential that a graphic is resized using appropriate tools and not 'squashed' by changing its display attributes (height/width) in the HTML code.
If you have to use a large graphic (over 50KB) then you must link to it from your web page using a reduced version known as a thumbnail.
Images of people
Please also see the standards specifically about images of people.
Banner images for Hantsweb
- Banner images will be controlled and approved by departmental web managers
- All banner images must be saved with the prefix banner-
- All banner images must be saved as a subtype – banners – in Web Publishing
- Banner images must be 1024x108 pixels in size
- Banner images must be single photographs or graphics that have been designed to be a banner - no montage. All photographs and graphics must be high quality and designed for purpose
- Before you start to collect personal data you must contact your department's data processing coordinator.
- All forms collecting personal data must be approved by your data processing coordinator before going live.
- All forms must include a link to a privacy statement.
- All forms must identify who the form is being sent to.
- All fields should be mandatory unless they are marked as optional.
All forms must conform with data protection laws. To ensure your form meets the requirements all forms must be approved by your departmental data processing coordinator before going live.
Privacy Statement (fair obtaining statement)
Every form must include a privacy statement. This lets the user know what will happen to any personal information they supply. A corporate privacy statement has been produced that informs the user that information given will not be passed to any third parties. If this statement fits your requirements then you are welcome to link it.
If your form has differing requirements that are not covered within our privacy statement you should create your own statement. For example if the information is passed onto any third parties, even within Hampshire County Council or information is to be kept on a database the user must be made aware of this and what happens to the information. If there is sensitive information to be entered in the form and it is not in a secure environment, for example monetary details when applying for grants etc., let the user know.
Before the form and privacy statement go live please contact your departmental data protection officer.
Do not rely only on colour or an asterisk (*) to indicate required fields as this means little to screen readers and magnifiers. You can use colour or asterisks to indicate required fields, however they must be in addition to text. For example,
Enter your name * (Required):
The recommended method is to request only required information - ask yourself why you are requesting information that is not required - in this case the text 'optional' could be inserted in front of the fields that are not required eg
Enter your address (Optional).
Some forms may use scripts/programs - the forms must work on unsupported scripts browsers.
You must inform the user where the form is being sent so the user has somewhere to address any queries. A team name or job title must be used instead of naming an individual.
- All information must be provided in plain HTML pages.
- Alternative formats can be provided in addition to HTML pages, not instead of them.
- The file format and size must be included in the link text.
- A link must be provided to the standard download page if a plug-in is required.
Document downloads of information can only be provided when they are supplementing information provided in an HTML format. Downloaded information must not be the only source that visitors to Hantsweb and Hantsnet pages can view. This will ensure the maximum amount of visitors have access to the information provided.
Where documents are to be made available to download they should be provided in:
- Portable Document Format (PDF), (the preferred format for offering a printable version of information)
- MS-Word or Rich Text Format, (for word processing documents)
- MS-Excel, (for spreadsheets)
- PowerPoint, (for presentations)
Using these formats ensures that the maximum amount of people have access to the information provided. The file format and file size must be specified in the link text.
3MB is maximum document size of any type that can be uploaded in the Content Management System. For advice on uploading larger files, please contact the Web Services Team
All files must be Anti-Virus scanned before being uploaded to Hantsweb or Hantsnet pages. If the file is stored on the I: or F: drive in Hantsnet prior to being uploaded it will have been scanned.