Slides badge

Types of website graphics

Learning Intentions

  • Understand how graphics are used on website

  • Be able to identify where graphics could be used on a website

Success Criteria

  • I can provide example of how graphics can be used on websites
  • I can use graphics on websites in different ways

Images and the web

  • Websites often include a huge number of graphics across different pages
  • The most common uses of graphics on a website are:
    • Logos
    • Banners
    • Corporate identity
    • Visual interest
    • Promoting products and services
    • Sprites/glyphs
    • Galleries and slideshows

Logos

  • The most obvious use for a graphic is with logos.
  • A logo gives a website its own unique brand and is used to represent a company through a visual image that can easily recognised.
  • On a website, logos normally appear towards the top or top-left of the website.

Banner images

  • A banner image is an image that rolls across the whole width of the website viewport, or at least across the content section of the viewport.
  • These are often used to draw attention to that part of the website straight away.

Corporate identity

  • Corporate identity is very important across a website
  • Graphics can help to reinforce this identity alongside other design elements such as colour and theme.

Visual interest

  • A visual interest is something that draws attention to something.
  • In terms of a website and graphics on a website, this is sometimes a large picture that draws the users attention over to something else.
  • For example, clicking on these images will take the user to a page with more information about the products.

pROMOTING PRODUCTS

  • In a similar fashion to the way that images can be used as a visual interest, they can be used to promote products.
  • Often the images will showcase the actual product but in interesting ways, such as a person using it or, as Apple does it, in a way which shows off their devices (such as showing the slimness of their devices)

Sprites/glyphs

  • A sprite is a collection of images put into one image and they are used to make navigating a website easier by giving visual clues as to what the user requires.
  • These are often very simple and straight to the point.

Photo galleries

  • Photo galleries show off many pictures in one compact form, allowing many images to show in one go.
  • As well as standard, static photo galleries, some websites employ a dynamic photo slideshow.
  1. Identify and describe four different uses for graphics
  2. Find examples of each of the four different types of graphics that you provided for 1. on current websites

Graphics on websites

Presentation Overview
Close
JB
Types of website graphics
© 2020 - 2024 J Balfour
10:22 | 29-04-2024
Join Live Session
Start Remote
Save Progress
Slideshow Outline
Presenter Mode
Widget Screen
Canvas Controls
Random Selector
Timer
Volume Meter
Binary Converter
Python Editor
Show Knox 90
Provide Feedback
Help
!
Keywords
    DragonDocs Management
    Random selector
    Sections
      Binary conversion
      Denary to binary conversion
      Binary to denary conversion
      Feedback 👍
      Accessibility

      Apply a filter:

      Dark Mode
      Bold Text
      ×
      All slideshow files