FAO Web guide: Guidelines

Web Guide home 1. Introduction 2. Web publishing basics 3. Planning 4. Content collection 5. Design 6. Construction 7. Testing 8. Launch 9. Maintenance 10. Writing for the Web Resources 1.1 FAO and the Internet: What is an FAO Web site? 1.2 Quality criteria of Web sites 1.3 An introduction to Web accessibility at FAO 1.4 Electronic publishing at FAO 2.1 Content quality 2.2 Roles in Web publishing 2.3 Web site quality clearance and continuity 2.4 Policy and legal matters 2.5 Language coverage policy 2.6 Web site traffic monitoring 2.7 Static and dynamic content 2.8 Really Simple Syndication (RSS) 2.9 Social Media Guidelines 2.10 Current server structure at FAO 3.1 What and (who) is the site for and what is it about?3.2 Define the Web site subject scope 3.3 Define your audience 3.4 Identify resources 3.5 How to track and share planning decisions 4.1 Developing a content inventory 4.2 FAO content repositories 4.3 Metadata 5.1 Review user needs 5.2 Defining information architecture 5.3 Prepare interface design 5.4 Define technical implementation 5.5 Tracking design implementation 6.1 Management of files/naming 6.2 HTML and coding 6.3 Use of style sheets 6.4 Graphics 6.5 Conversion of electronic documents 6.6 Language encoding 6.7 Link management 6.8 Printable pages 6.9 Providing access to search 6.10 Domains, URLs and aliases 6.11 Tools 7.1 Testing approaches 7.2 How to use the test environment 8.1 Launch checklist 8.2 Promotion 9.1 Quality assurance and routine checking 9.2 Update procedures for Web sites 9.3 Web usage analysis 9.4 Evaluation of Web sites 10.1 Writing a page of text 10.2 Organizing your text on the page 10.3 How to optimize content for search engines 10.4 How to write feedback, error messages 10.5 Quotations 10.6 Non-discriminatory language Checklists Acronyms Newsletter Guidelines Policies Procedures Web resources Tag cloud Contacts 2.3a Data ownership 2.3b Regulation of access to servers 2.3c Clearance of Web sites by OCP 2.4a Country names, flags and maps 2.4b The fao.org domain, subdomains and root directories 2.4c Use of FAO emblem and logos 2.4d Politically sensitive material 2.6a FAO Web sites: the user perspective 2.6b How to gather user information: user research 2.6c Designing for the user 2.6d Page size and downloading 2.7a Static content 2.7b Dynamic content 2.7c Content Management Systems (CMS) 2.9a FAO and Facebook 2.9b FAO and Flickr 2.9c FAO and Google+2.9d FAO and LinkedIn 2.9e FAO and SlideShare 2.9f FAO and Twitter 2.9g FAO and Wikipedia 2.9h FAO and YouTube 4.3a What is metadata?4.3b Why embed metadata in Web pages?4.3c How to embed basic metadata in the HTML head section 4.3d How to create or improve current metadata 4.3e FAO standards for encoded metadata 4.3f Metadata, search engines and their robots 5.2a Identify Web pages and subject categories 5.2b Define navigation 5.2c Define metadata and search requirements 5.3a Corporate visual identity 5.3b Web site design usability principles 6.1a How to use the FTP server 6.2a HTML and XHTML 6.2b Browser compatibility 6.2c New windows and pop-ups 6.2d JavaScript 6.2e HTML title and metadata tags 6.3a CSS and Web accessibility 6.3b Cascading Style sheets (CSS) and browser compatibility 6.4a Graphic formats 6.4b Use of images on the Web 6.4c Photos 6.5a Converting Word documents into PDF 6.6a Guidelines for language encoding 6.6b Multilingual interfaces 6.7a Linking files across languages 6.7b Links to the FAO home page, FAO copyright and AskFAO 6.7c Absolute and relative links 6.7d Avoid spamming on e-mail addresses 6.8a How to prepare print-safe Web pages using CSS 6.8b Other ways of preparing print-safe Web pages 6.11a Recommended editing tools for Web site construction 6.11b Graphics, document and conversion tools 9.1a Maintaining quality 9.1b Content freshness
	Web Guide > webguide > Resources > Guidelines
	All Web Guide guidelines Guidelines are recommended course of action in support of a set of principles and specific to a particular area. It provides advice to assist in accomplishing a given task. 1.2 Quality criteria of Web sites There are some simple objective indicators of the quality of information on Web sites that can help frame general guidelines. For instance, quality can be judged in terms of accuracy, timeliness, usability and retrievability of the contents of a Web site. 2.2 Roles in Web publishing New technology has changed some of the traditional roles involved in producing and disseminating Web information. Depending on the size and complexity of the site to be built (and maintained), one person may perform multiple roles. The list on page 2.2 Roles in Web publishing can help ensure that all needed skills and responsibilities are represented on the Web site development team. 2.5 Language coverage policy A Web site being launched should be available in at least three FAO languages. However, as requested by Member Nations, it is recommended to publish the Web site in all six FAO languages. See the FAO Web Quality Assurance Checklist for more information. Minimum current guidelines for language policy To comply with Member Nations' request that all Web sites be published in all FAO languages, staff should ensure that the Web site's home page (at least) is translated into the six languages. This is also so that the metadata record for the site can be included in the FAO search engine, the Information Finder. 2.6a FAO Web sites: the user perspective For a Web site to be successful and useful it is highly important to identify the target users and their requirements. 2.6b When should you conduct user research? Web site projects should be based on information derived from user research. Critical points at which to conduct user research are: Gathering initial requirements. Prototyping. Monitoring the success of a Web site. Validating the introduction of a key feature or area. Evaluation. 2.6c Designing for the user When you plan and design a Web site, focus on what your intended users want to do with the information on your site, not only on what you want to say. For example, one way to serve your users is to avoid structuring your site like an organigram of your service or division. Identify what users want to obtain from your site and what problems they are likely to solve with the information you offer. Organize the information according to their objectives 2.6d Page size and downloading While there is no standard assumed for the connection speed of target users, it is current practice to keep file sizes as low as possible to allow for reasonable download speeds. It is recommended to keep the home page under 60 KB (including all associated elements) and other HTML pages under 100 KB. 3.4 Identify resources Developing the budget is usually the task of the Web site sponsor and/or the Web site manager, or whoever is managing the project. Three often-overlooked issues in planning include: ensuring that FAO-specific information management, technology and Web design requirements are correctly included in the terms of reference (TOR) of external consultants and suppliers; budgeting for translation; and Web quality and accessibility compliancy. 4.1 Developing a content inventory A content inventory is useful in the planning stage of the development of a Web site. Collecting (and auditing) information about the content of your Web site will streamline the definition of the information architecture, the interface design and the technical requirements for implementation. 4.2 FAO content repositories - Selecting and sharing document and files A content repository is a store of different types of items (e.g. documents, bibliographical records and images). Typically, they come with an administration/user interface that allows users to contribute, manage and share the items. There are several repositories in FAO that can be used to manage content for Web sites and systems. Some of these repositories can be used to manage the entire workflow for releasing content on the Web. 4.3c How to embed basic metadata in the HTML 'head' section Each metadata tag has a different purpose, but the overall objective of metadata on the Web is to facilitate discovery, retrieval and use. Descriptive information about each Web page is to be included in the "head" section, i.e. the title (mandatory), keywords, description, author and other information. The metadata should be in the language of the Web page. 4.3e FAO standards for encoded metadata Metadata standards promote a consistent manner in which metadata is created, managed and exchanged. They are mutually accepted guidelines developed by professions, industries and/or national and international standard-making bodies. These standards are both human and machine-readable to allow automatic processing and creation of value-added services. 5.1 Review user needs Before starting to design your Web site (based on the data collected and the decisions made during the planning and content collection and preparation phases), you should review the needs of the intended users of your Web site. 5.2a Identify Web pages and subject categories A Web site is a combination of Web pages grouped loosely into subject categories that are normally displayed as a menu. 5.2b Define navigation It is important that your site is easy to navigate. Consistency and predictability are the key. A user should be able to drill down for information and find their way back through the levels easily and intuitively. Disorientating your users is guaranteed to send them away from your site. 5.2c Define metadata and search requirements Information architecture is about organizing information, whether this is visible in the design of Web pages (and their navigation) or not. It also implies the use of metadata to guarantee that the information can be found. Metadata is commonly defined as data about data. Broadly, this means information about a document and its content. The primary purpose of metadata is to improve resource discovery through keywords, descriptions, author, etc. 5.3 Prepare interface design You should only begin to think about the graphic design of the site once you have identified and gathered content, understood the scope and message of your Web site and defined the information architecture (specifically the navigation). 5.3a Corporate visual identity Designers and developers are asked to use the following minimum parameters for FAO Web pages: 1,000-pixel fixed-width, except where the nature of the content calls for a liquid page blue identification / navigation column at left, including the corporate identity area in the top left corner link to FAO Home as the first item in the left menu search area shown on the FAO homepage -- this must not be altered, except when a dual search is employed -- that is, the ability to search either “All FAO” or “This site” gray language selection bar -- graphically identical to that of the FAO homepage -- should always be present at the very top of the page. No other language selection buttons or links should appear on the page. Within the gray bar, the text should be aligned left, approximately even with the text in the blue title bar just beneath. When a Web page is available in a limited number of languages, only the available languages should be shown in the language selection bar. Language options should appear in alphabetical order as determined in English. See guidelines on language policy for more information blue title bar just below the language selection bar, with the recommendation that the title bar text be general enough to cover a group of pages, and that page headlines do not simply repeat the text in the blue title bar. In special situations, such as a high-level event, the blue title bar may be omitted. For more information: FAO-Communication@fao.org blue page footer, including links to Contact, Privacy policy, Fraudulent emails notice, and Copyright information Arial body font, left justified Arial bold headlines and subheads, left justified minimal use of capital letters in title bar, headlines, subheads, captions and navigation 5.3b Web site design usability principles Colour Colours can affect the usability of your Web site. Reading on a computer monitor can be difficult, so make sure your colour choices do not force the reader to squint! Most commercial Web sites use a white background with black text. Dark text on a light background offers the highest contrast and is the easiest to read. Finding text colours that contrast strongly with the background is important. If you deviate from this, make sure you have a good reason. 5.4 Define technical implementation At FAO, there are a number of ways of producing Web sites using different technologies and tools based on approved standards. Obviously, the choice depends on the type of site you are creating (static, dynamic or hybrid) and the kind of information you want to display (text, maps, statistics, photos etc.). 5.5 Tracking design implementation During the design stage, work can be quite creative involving brainstorming and occasional iterations. Things can change at a rapid pace, and in some cases, decisions are made implicitly. Documenting final agreements (what has been done and why) is important to communicate progress to the Web site sponsors (for review and clearance) and to the team, particularly those who will be involved in development and construction. Each one of the design steps can produce its own deliverables, which need tracking. 6.2a HTML and XHTML The HyperText Markup Language (HTML) is designed for the presentation of information on the World Wide Web, using a Web browser. HTML evolved from the need to share documents on the Internet and render them meaningfully on different browser platforms. It was originally created by Tim Berners-Lee when he was working on the first concepts of the Web at CERN in the late 1980s. XHTML (Extensible HyperText Markup Language) is almost identical to HTML 4.01 - it consists of all the elements in HTML 4.01 combined with the syntax of XML. XHTML is a stricter and cleaner version of HTML. 6.3 Use of style sheets Cascading Style Sheets (CSS) describe how documents are presented on screen or in print. When combined with structural markup language such as HTML, XHTML, or XML, the CSS provides Internet browsers with the information that enables them to present all the visual aspects and elements of a Web document. Thus, by using CSS, it is possible to separate out document presentation from document content. 6.4b Use of images on the Web Not all graphic formats are suitable for the Web. The most commonly used formats are GIF and JPEG, as they are supported by all browsers and can produce images and photos with a very small file sizes. 6.5 Conversion of electronic documents Converting electronic documents into other formats is not always an easy task. The most common procedure is to convert a Word document into PDF, which is an easy step if you have Acrobat Distiller (part of the full Adobe Acrobat package) or CutePDF (a free tool that converts Word documents into simple PDF files). 6.5a Converting Word documents into PDF This is the easiest procedure. You can do it with CutePDF or Adobe Acrobat. 6.6a Guidelines for language encoding - What is character encoding? Character encoding is the organization of a set of numeric codes that represent all meaningful characters (single letter, digit, space, punctuation, etc.) of a script system in memory. Each character is stored in memory as a number (e.g. A = 65). When a user enters characters, the user's key strokes are converted to character codes. When the characters are displayed on the screen, the character codes are converted to the glyphs of a font. In most character encoding standards, the character set changes to represent the language being used, so the upper-level characters may include symbols, accented Roman letters, Cyrillic or other characters, depending on the character encoding chosen. For example, the character Ó in the Macintosh Standard Roman Character Set is in the same code point (205) as the equal sign (=) in Windows extended ASCII encoding. 6.6b Multilingual interfaces One Web page cannot refer to more than two different character sets at the same time. Therefore, the only way to correctly display various languages on the same Web interface is to use Unicode, particularly if there are Asian languages or Arabic. 6.7d Avoid spamming on e-mail addresses There are some basic options to avoid receiving spam through your online FAO e-mail address. Unfortunately, for accounts like Webmaster@fao.org (and others published on the Internet), it is probably too late to prevent spam. For new accounts, there are options worth implementing. 6.8a How to prepare print-safe Web pages using CSS Most of the problems of incorrectly printed Web pages are associated with the use of HTML tables. Therefore, it is recommended to limit the width in these tables to 600 pixels, which is the maximum area needed to print safely on an A4 page (portrait orientation). If the tables in a Web page need to have a fixed width exceeding 600 pixels, alternative style sheets (CSS) could be used, one for the screen and one for printing purposes. 6.8b Other ways of preparing print-safe Web pages If you are using a content management system, the system can be configured to produce a print-friendly version of the page. In this case, make sure that each Web page contains a link to the print-friendly version. If your Web site is developed using dynamic pages such as ASP and you want only a selected area of the Web page printed, you can do so by enclosing the area in a special tag named <sp> (and </sp> to close the section) and including two special ASP files in the folder of your current Web site (printlink.asp and print.asp). 6.11a Recommended editing tools for Web site construction Dreamweaver Adobe Dreamweaver is an editing tool that is used at FAO to build Web sites and develop applications. It includes CSS designer, cross-browser validation, inline image editing and MS Office cut and paste. TopStyle TopStyle is a CSS/XHTML/HTML Editor. UltraEdit UltraEdit is an HEX, HTML, PHP, Java and JavaScript text editor. XMLSpy Altova XMLSpy is the industry standard XML development environment for modelling, editing, debugging, and transforming all XML technologies, then automatically generating runtime code in multiple programming languages. 6.11b Graphics, document and conversion tools Adobe Photoshop Adobe Photoshop software is an image editing tool which graphic designers use to create images such as banners or to prepare photos for publication on a Web site. Adobe Acrobat Adobe Portable Document Format (PDF) is the standard for secure, reliable electronic document distribution and exchange. The software is used throughout FAO for the publication of online documents. Adobe PDF files look exactly like original documents and preserve the fonts, images, graphics and layout of any source file - regardless of the application and platform used to create it. GIMP GIMP - which stands for the GNU Image Manipulation Program - is a software graphics editor with very similar capabilities and many of the same features to Photoshop. GIMP offers a full range of editing tools and is free for anyone to download. 8.1 Quality assurance before release Before release, ensure that your Web site has been thoroughly reviewed and is consistent with the FAO House Style and the FAO Web Quality Assurance Checklist. 8.2 Promotion Guideline It's great to have a new Web site, now you have to publicize it! Promoting your site with partners and external audiences is just as important as promoting it within FAO. Search engines count the number of times a page is linked to by other sites when they rank an entry on the results page. There are several easy ways of promoting your site that do not require large budgets or hours of labour. 9.1a Maintaining quality and accessibility Links Ensure internal and external links continue to work (use link checking software to automate this) and are up to date, e.g. e-mail addresses are correct and the copyright link uses the current year. If you have renamed, moved or deleted your Web pages, use URL redirection. A redirect prevents users from receiving an error (when they visit a page that no longer exists) by automatically transferring the user to another page. 9.1b Content freshness Review the validity of your content, e.g. last updated dates and contact details. Ensure news and events pages, recent publication lists, forthcoming meetings, site maps, etc, are kept up to date and archives maintained. Having a contact e-mail address can be helpful so that visitors to your site can provide feedback if they spot errors or out of date information. 9.3 Web usage analysis Web Usage Analysis is provided by CIOK and in this context refers to the usage of FAO owned Web sites by the global Web user community. CIO monitors the Web site and generates automated reports from the logs of the Web servers and maintains and configures Google Analytics profiles. To request statistics for your site, including specific directories or any special requirements your site may have (e.g. aliases, redirects and multiple locations), contact: web-stats@fao.org. Statistics on visits, visitors, top pages etc. can help you understand what visitors do on your Web site, help you spot its strengths and weaknesses, and take any needed action to improve the site, information and service for your visitors. From traffic analysis you can also obtain data on the types of computer and browser your visitors used to access your site. 9.4 Evaluation of Web sites The evaluation of the use of a Web site is an important and often overlooked step. It helps to identify areas of the Web site to adapt to the intended users. A number of methods of evaluation can be used - they can highlight different aspects of the user experience. Deciding which to use may be determined by the resources available for both evaluation and the subsequent re-design.