How to use visuals and video on a corporate website

Published at Tuesday 27 June 2006.

The internet as a communication channel differs considerably from paper channels, such as a brochure or an annual report. The internet offers tremendous possibilities to enrich content with visual elements (image and video). How can you effectively integrate these elements in a corporate website? We will provide you with best practices.

In order to enrich the information on a corporate website, Jungle Rating distinguishes the following possibilities:

  1. Visual display of text information (tables, charts, graphs)
  2. Interlacing text with pictures and visuals
  3. Integrating rich internet functionalities into a webpage
  4. Using video fragments on a webpage

This newsletter will cover the first two possibilities.

Only relevant usage

Integrating these elements in a corporate website will only increase the effectiveness of the website, if the elements truly have an added value to the text or information. The visual elements should never be distracting from, but always supporting the information. Then, they will enrich, support or draw attention to the text.

The difficulty of screen reading

There is a distinct difference in how a person’s eyes focus on paper vs. a computer screen. Visitors will be likely to read information in small chunks, rather than long sessions. They will take more breaks, to rest and refresh their eyes. This is because eye strain and other forms of physical fatigue occur more quickly when reading from a monitor.

Research has shown that:

  • Reading from a monitor screen requires 17% more effort than reading from paper
  • Reading from a monitor is 25% slower than from paper
  • Visitors do not like reading very long texts form the screen
  • Screen-readers do not like to wait for downloading and neglect advertisements, banners and uninteresting visual information
  • Screen-readers are geared towards ‘visuality’. Headers and (functional) visuals will catch their eye first

Sources: Nielsen (1995) and University of Guelph, Canada (2005)

As the research shows that visuals are likely to catch the visitor’s eye, companies do have the ability to influence the way a visitor ‘reads’ or scans a web page. Visuals will draw the visitor’s attention and can enrich or support text.

How to effectively use visuals on a corporate website?

When a company wishes to show facts or figures, an explanation in text can be rather restricting. Visualisation of these facts can help make them tangible for visitors. Consider making use of tables, bulleted lists, illustrating drawings, or charts. In the following cases visuals do not distract visitors from the message, but actually strengthen the message:

Chemical company BASF starts with illustrating its Strategy in the About section. Only after having presented the visual representation of the Strategy, the elements are being described in text.

BASF Strategy in brief

On the page ‘Total at a glance’, Total presents its facts in a surveyable manner through the use of bulleted lists. Placing the main issues in bold improves the legibility even more.

BASF Total at a glance webpage

Effectively interlacing text with images

Usability studies by Jungle Rating have shown that text pages that are interlaced with visuals appeal to website visitors. Visitors are triggered to read the page, and are not being scared off, because of a large surface of text.

However, pictures only have an added value if the picture is truly illustrating to the subject. Obvious stock photos will be perceived as commercial and irrelevant and will not be noticed or might annoy the visitor.

The higher in page hierarchy, the more pictures and visuals a visitor expects. A home page or landing page needs more visuals and less text, while visitors on a deeper content page expect more and longer texts.

ABN AMRO introduces its services on the homepage with illustrating images:

ABN AMRO illustrating images

Both Unilever and Roche , in order to improve the legibility.

Unilever interlace text pages with images

Roche interlace text pages with images

Keep the following in mind:

  • Use ‘real’ photos (e.g. of own employees), not stock photos
  • Make the photos underline your company message
  • Use images in a standardised way, on a fixed page location
  • The higher in the website hierarchy, (e.g. homepage / landing page) the more images can be used

Comments

No comments were found for this article. Please add a comment below.

Post your comment

*

*

*
This helps ensure that a person, not an automated program, posts a message
Please type the numbers from the picture in the textbox

Is the image unclear to you? Click here to change it

Article informations

2668 times viewed, 0 reactions

Rate this article

[1 ratings]

Article Options