The website must contain a precise and meaningful "title tag", a page title. This is based on the following:
- The title is displayed on the title bar of the browser window.
- The title is used when setting a bookmark (or favourite).
- The file title is shown in the browser in the list of pages previously searched.
- Many search engines offer the title as a hyperlink.
- Search engines use the content of the title for their search.
- Website users often only read the first words and should therefore have enough information about the website.
Equally important is the choice of precise and meaningful titles. The content should be summarised in the title, helping users to find the information needed. According to Nielsen, titles should not be longer than 60 characters.
Source and further information:
"Prioritizing Web Usability" by Jakob Nielsen/Hoa Loranger and
http://www.useit.com/alertbox/weblogs.html,
http://www.usability-now.com/suchmaschinenoptimierung/.
text id wqm_detailedreporttitlebadpagetitlesdescriptionatresultcode8 not found
HTML is a mark-up language used to create websites, and is independent of platforms.
"HTML is not a programming language, since HTML does not allow to, say, control a robot, set a variable or programme a game." (Quelle)
The display of invalid or incorrect documents depends on the software reading them (browser, roboter, screenreader, etc; see above). However, the display will vary greatly depending on the software, and this can lead to errors, often without the knowledge of the website manager, since it is impossible to test the website against all updates of all the software.
Non validated HTML source text can cause high costs, especially if it causes the software to look for an error or if the functionality and therefore the user experience is impacted.
Further information:
The validity of the HTML source text can be checked with a so-called 'validator'.
Examples:
Further information
http://blog.antikoerperchen.de/beitrag/28/validierung-wozu-warum-valider-html-code-wichtig-ist.html
Acronyms:
HTML: HyperText Markup Language
The tested website appears to use XHTML, but the source text contains errors. Use the Qualidator SiteAnalyzer to find the errors on your site. Please note that it is not sufficient to validate the homepage only. To optimise access it is necessary that all pages are validated, so that display errors in various browsers can be avoided.
Pop-ups tend to annoy web users, as they appear suddenly and cannot be controlled. In addition, many users associate pop-ups with untrustworthy gambling and porn sites. User-friendly websites should therefore not include pop-ups, with the following exception: a print-preview of a page displayed as a pop-up.
Source:
"Prioritizing Web Usability" by Jakob Nielsen/Hoa Loranger
Further information:
http://www.usability.ch/Alt_nav/Alertbox/NJ_20041206.htm
The tested website is coded to display pop-ups.
Not all visually impaired people make use of technical support to navigate on the internet. The feature to increase fonts is an important element to ensure that all information of the website can be read by all users. Even people who are not visually impaired need to increase the font sometimes. At the same time, an increasing number of older people surf the web; they too need a feature to increase the font. To this purpose, it is important to define the font size not in pixel, but in percentage or "em".
Source and further information:
"Prioritizing Web Usability" by Jakob Nielsen/Hoa Loranger
The font on the tested website cannot be increased and defined with the automated browser feature "Text Size".
When clicking on a link, web users expect to see the new page in the existing window. Most users lose control if there are several windows open, are unable to navigate back with the back function and get lost. At the same time, and this is particularly true for old computers, the system can get overloaded and crash if too many browser windows open. If new windows open but are not seen by the user, the perception is that the website does not work properly. Experienced users who want to open new windows know how to do this by using the function "Open (link) in New Window", or with similar comands.
There is one important exception to this rule: files in .PDF or other Office format can be opened in new windows. Users know to close them to return to the original window. In this case, users should be informed that a new window opened, and they should be given the opportunity to save the file.
Technical hint: For XHTML Strict in particular, there is the possibility to send a .PDF file with ContentType "application/pdf" and HTTP Header content-disposition: attachment; filename=filename.pdf, since there is no target attribute. This test does not take it into account yet, but this is a feasible solution.
Source and further information:
"Prioritizing Web Usability" by Jakob Nielsen/Hoa Loranger
At least one Office file was found which did not open in a new window.
Separating design and structure of the website carries great advantages. The sharper the distinction, the more independent the two areas are. A lack of such a distinction is also called a "spaghetti mark-up" or a "tag-soup" (from the term "HTML tag").
Nowadays it is easy to save colours, type fonts, design images and to a large extent even the layout of the website in CSS files (CSS = Cascading Style Sheet).
Further information:
http://www.style-sheets.de/guide/grundlagen/warum_css
http://www.vorsprungdurchwebstandards.de/theory/retro-coding/
Hint for IT technicians: "Code" does not refer to javascript, but to HTML source.
The tested website contains spaghetti mark-up; morevover, it is not or not fully defined in CSS Format.
The titles need to be ordered in a sytematic and logical way, i.e. there can be no jump going from h1 toi h6. In addition, the first title must be h1.
Further information:
http://www.vorsprungdurchwebstandards.de/theory/retro-coding/
(Chapter: "Semantisch strukturiertes HTML" = "Semantically structured HTML)
text id wqm_detailedreportheadingscorrectorderdescriptionatresultcode8 not found
The logical connection between definition and form field is missing if the form fields lack an explicit title.
This means that in the instance of a linear form, it is not apparent which definition belongs to which fiels. This is why the element LABEL was introduced with the attribute for, allowing the explicit definition for form fields.
Using the element LABEL allows Screen-Readerusers in particular to view the definition of the form field directly in the form field itself.
Source:
http://www.barrierefreies-webdesign.de/knowhow/formulare/label.html. Further information can be found in the W3C accessibility guidelines (12.4 Associate labels explicitly with their controls, Guideline 12, Accessibility Guidelines for Web Content 1.0, W3C recommendations 5th May 1999http://www.w3c.de/Trans/WAI/webinhalt.html) und http://de.selfhtml.org/html/formulare/strukturieren.htm.
Form fields on the tested website do not contain correct labels.
This test result is available for registered users and Premium Members.
More than two thirds of the test results will be available to you once registration has been successfully completed.
To have full access to the test results, and to be notified about changes in quality of the observed website, please register and upgrade to Premium Membership.
Register now free of charge
A potential warning has been identified.
Alternative text is displayed if an image cannot be downloaded or if the mouse pointer is moved over the image*. The alternative text is on one hand important for visually impaired visitors, using an audio tool to read the content of the website and the alternative text of images.
On the other hand, alternative text can also be recognised by search engines. Alternative text needs to be phrased in a meaningful manner, though it should not be a detailed description of the image.
Further information:
http://www.bjoernsworld.de/html/alt-text.html
http://webdesign.crissov.de/alt-Text#Start
* Internet Explorer shows alternative text as a tooltip if the mouse pointer is rested on the image. This is not prohibited but it can annoy page authors. It does also indicate that the alt-attribute refers to this tooltip, which is wrong. Should you want to add a descriptive tooltip to your images, make use of the attribute "title".
Quelle: http://de.selfhtml.org/html/grafiken/einbinden.htm#referenz
The tested website contains undefined alternative text. This needs to be specified as "empty", especially for images which are not part of the visible content.
Older web projects were often designed with so-called "empty images" (i.e. images without content, used as placeholder). This technique is now outdated and should be replaced with CSS features such as "Padding" and "Margin". This allows an increased performance of the website, as well as a strict separation between design and content, and an abstraction of the design from the structure.
Further information:
http://seybold.jan-andresen.de/05killer.php
The tested website contains blank images.