Web Guidelines for Content Editors & Creators Page Elements

HTML Elements

Page title / header

The page title appears at the top of the browser window and is the text that appears in search engine results. The WordPress template builds the correct page title based on each page’s header. Page titles must conform to University policy, and follow the form of Title of Page – Department or Service – The University of Iowa Libraries.  Use common capitalization rules (i.e., don’t use ALL CAPS).

Header tags

Heading tags are indicators of section headings and subheadings within a document, not just as formatting elements. Screen readers in particular may just scan a page for appropriate H1, H2 and H3 elements. The Libraries’ template includes an H1 tag (usually “The University of Iowa Libraries”) and an H2 tag (the header).  If necessary, use H3-H6 in your content.  These tags can be styled differently in the style sheets.

Lists

HTML lists – <ul>, <ol>, and <dl> – also convey a hierarchical content structure. Each of these has rules regarding their use as well. Unordered lists should be used when there is no order of sequence or importance. Ordered lists suggest a progression or sequence. Definition lists should be used explicitly for presenting a structure for definitions. As with heading, lists should be used correctly and for the right purposes. Unordered and ordered lists should always contain list items. Definition lists must always have definition descriptions. Empty lists are incorrect HTML. Lists should never be used for merely indenting or other layout purposes. Nested lists should be coded properly. [from WebAIM]

Forms

Ensure forms are keyboard accessible, logical, and easy to use [from WebAIM]

Miscellaneous

Avoided deprecated tags and attributes: http://www.tutorialspoint.com/html/html_deprecated_tags.htm

Opening links in a new window/tab should be avoided.

Use the <p> paragraph tag to separate paragraphs instead of multiple breaks (e.g. <br /><br />). This encloses blocks of text within their own structural elements. Some screen readers are able to jump from <p> to <p> but not <br />  to <br />.

Do not underline words that are not hyperlinks, as they are often mistaken for links. Use bold or italics to draw attention to key words or phrases.