Visual Identity Design for Responsive Web

Visual Identity Design for Responsive Web

Sunghyun Ryoo Kang (Iowa State University, USA) and Debra Satterfield (California State University – Long Beach, USA)
DOI: 10.4018/978-1-5225-7598-6.ch135

Abstract

Responsive web design, which works for multiple screen sizes and devices, has changed the web ecosystem. However, maintaining a strong and consistent visual identity in a responsive web design is challenging because of the nature of its flexible or liquid layout and navigation. The purpose of this chapter is to identify design strategies for managing the visual identity of a site, the placement of images, and navigation methods that work consistently across the framework of responsive websites and devices.
Chapter Preview
Top

Background

Responsive Web Design

To create a successful responsive web design, a layout that can easily be customized for different screen sizes is key (Voutilainen, Salonen, and Mikkonen, 2015). According to Voutilainen, Salonen, and Mikkonen, it is important to consider “proportion-based grids and flexible images, where element sizing takes place using relative units instead of absolute ones, and CSS3 media queries, where different styles can be used for different devices (2015).” Since the web page layout is liquid and flexible, the exact structure of the layout would not be an element that can be used to maintain the web site identity. Using images and design elements that can be modified using CSS media queries and script language while still maintaining the essence of the visual characteristics of the site are essential to a successful responsive web design.

Complete Chapter List

Search this Book:
Reset