How to Arrange Content
Format your text and images for the web.
Web users are on a mission to find the information they need. Studies show they skim the left side of the page keying in on headings. Solution? Shape your content with your visitors in mind — make it easy to skim, and easy to digest. Many of these best practices also improve accessibility, reducing barriers for all of your visitors.
Avoid Crowding the Page
Introductory copy should be 150 words or less. Deeper pages with more information will necessarily be longer. Print content tends to be a lot longer than is readable on the web, so shorten it and/or divide it into several pages.
Keep Your Content Left-Aligned
This makes the content easier to skim - especially if you use headings. Centering text throws off a reader's natural left to right flow.
Don't Overuse Bold or Italics
If too much is emphasized, nothing stands out. If you have a topic you want to bold within your page, try adding a heading about the topic instead.
Don't Underline Text
Visitors often mistake underlined text for links. This leads to confusion and reduces the impact of what you were trying to highlight.
Use Heading5 and Heading6 to Organize Content
Whenever you can organize your page content into topical sections, use the Heading5 format to add meaningful section titles. Heading6 can also be used for additional organization into sub-sections. Those using screen readers and other assistive technology have the ability to navigate webpages by headings. Using the available headings gives hierarchical structure to your content, especially if it is lengthy. Note that Headings 1-4 are not available to you as they are reserved for structural elements within the page templates.
Use Bulleted Lists and Links to Break up Longer Content
These also help users skim the page to find exactly what they are looking for. Content links allow a user to move from page to page with a simple glance — which accomplishes your goal of drawing them further into the site.
Don't Copy and Paste Directly from Word
Microsoft Word isn't designed for creating web content. The William & Mary website contains styles to control fonts, sizes and colors. Copying from other programs like Word can insert extraneous code that makes your webpage inconsistent. If you draft text in Word, use Edit >> Paste as text in Cascade, or first copy into a plain text editor (like Notepad) then copy into Cascade.
Use Quality Images
Photos can be a powerful tool to engage users and help tell your story. Equally so, poor quality images can turn users off and distract from your content. Take the time to select and edit your images for quality and proper size before uploading to Cascade. We offer a few image editing tools. Once an image is placed on a page, use one of the image formats to align your images within the content.
Don't Incorporate Non-Cascade Web Elements
Cascade provides consistent design, allowing you to focus on the content. Web objects such as external widgets and animated graphics created by other sources can make the W&M website look unprofessional and detract attention from your content. They also compete with other design elements and photography on the page. If you are unsure how to accomplish your goals using the available Cascade tools, contact your Web Manager for assistance. We're here to help.
Keep Your Balance — Don't Overdo the Right-Hand Column
With many features available, it's easy to get carried away. However, the right-hand column of your page should not be longer than the content area. Tip: listboxes in use can be shortened by limiting them to display 3, 2 or even 1 item at a time.
Style Your Tables
Tables are appropriate to display data in a digestible format. Learn how to work with tables, including the tablespecial style. This custom style should be applied to all tables in Cascade — it makes the data easier to read, compliments the website's design and improves usability on mobile devices.
