Tips on Website UX: Images and Graphics

January 8, 2021  |   Branding, Design, Websites

Tips on Website UX - Images and Graphics

There are numerous ways to include images in your website. Today’s web development technology allows the integration of illustrations and vector graphics, in addition to the ability to blend photographic images with the background using pure CSS5.

Before diving deep into advanced techniques, it’s important to know the basic principles of website graphic design and website UX (user experience) design. The three principles which will be discussed here should be used to ground all the creative and innovative power of web design into practical and functional terms.

Every Image Has A Purpose

1. Every Image Has A Purpose

The common maxim of design is that nothing more should be added than necessary, and that less is better.

This is true of image placement. Images are more than just for decoration. Like the website copy that delivers information with language, images are also means for communication.

If two different images deliver the same message, even if they are different and ‘looks great’ on the page, it’s best to eliminate one of them. Better still, if you want to retain the number of images, simply choose a new image that tells a different story.

Images don’t have to be photographs. They can be vector illustrations, infographics, charts, and perhaps a way to label various sections of the page. Write words inside an image frame to emphasize the text content such as in a quote block, aside, or even a call-to-action.

Images Should Blend Within The Context

2. Images Should Blend Within The Context

The context of the web page is the topic. Various topics will evoke certain emotions to the visitor.

The web copy alone may describe the overall tone of the page, but if the added image represents the wrong emotions, this can create a more confusing user experience.

This is what many web designers should be careful about. Even a selection of color and shape in a vector graphic design can be misinterpreted, which then leads to a conflict between the intended tone and the overall content message.

Images are powerful — much more powerful than copy. Designers study ways to increase the productivity of users by incorporating carefully designed symbols. An image that accompanies an extremely short description can often be more informative than highly descriptive copy with no image (or the wrong image).

Unoptimized images

3. Optimize Every Image

Images can potentially take up a lot of memory and thus significantly impact page loading time.

Once the images have been optimized for load speed, they must still be optimized for search engines.

Search engines are continually pushing for a more accessible web browsing experience. If possible, add an alt text attribute to each image that is part of the content. It’s not necessary to do this for all forms of graphic design, especially if they are used simply for decoration. Most images used in the content, however, are likely to require alt text.

We Can Help You Improve Your Website UX

The greatest challenge in UX website graphic design is not in the use of software and technology. Rather, it’s the decision-making, in deciding whether to include each line, shape, and color into a web page, and thinking about how that will affect the overall user experience.

Island Media has years of experience with web design projects. The resulting web designs boost brand recognition and credibility, making it easier to make great first impressions to customers online.

Get in touch with us

Get in touch with us

    This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.