Parallax Scrolling in Web Design - History

This chapter delves into the history and evolution of parallax scrolling in web design. You will also learn about basics of scrolling.

Introduction

Let us look at the word Scroll. In olden days, to send a message to other people who are located at a great distance, handwritten scrolls were used. These scrolls looked like below.

Imagine the action of the person who is holding the scroll. To read the content in full, the person would have to scroll and roll it further.

The use of these scrolls was also for maintaining a record text or decisions. Over the time, the use of scroll increased as it was prepared from different writing materials such as papyrus, parchment and paper.

Fast forward to the technology era, as the computers evolved, processing and storing very large documents, tables and images became possible. Sometimes the data was so much so that the screen size was just not sufficient to present the data to the user. When the data to be displayed was larger than the size of window or display area, the data would remain hidden. This called for an approach of expanding the screen area.

Some options to achieve expansion of screen are listed below −

• Increasing the screen size
• Using scrolling
• Reducing the data size

Increasing the screen size meant rise in the cost as well as the space required for the computer. This was not a feasible option as computers were expensive in their initial days.

Next option was to reduce the data size. The data would be represented by some text or picture or tables. While it might be feasible to condense data for text and tables, it was not always possible for pictures to be condensed or reduced in size. This would mean compromising the quality of picture. Hence the second option was also ruled off.

Third option, which is the most popular option nowadays was to Scroll. Scrolling was viewed as moving a hidden portion of data selectively inside the available display area.

Considering the feasibility of the solution in terms of cost and space, scrolling became a popular method of presenting the data on the computer screens. This acceptability was further extended to other modern age displays, such as mobile screens and showing the film credits, as well.

Scrolling Basics

To achieve scrolling and to move the content displayed on the screen, there can be a vertical scroll bar or a horizontal scroll bar or both. The operation of scrolling can be done by using a scroll mouse or clicking on one of these buttons on the scroll bar.

A Vertical Scroll Bar as available in Google Chrome is shown below.

A Horizontal Scroll Bar is shown below −

Evolution of Scrolling

In the earlier days of computers, the scroll bars shown above were readily visible and a user would have to click on any of the directions to move the screen in that particular direction. Note that in those times, Mouse did not have a scroll wheel to achieve the capability of scrolling.

Due to the recent development in web design, the scroll bar is assumed to be present all the time and a user is assumed to have a mouse with scrolling capabilities.

While it is the functionality which made browsing easier for the computer users, it extended beyond the computers to the mobile devices to achieve the same functionality with a simple touch and drag in a specific direction on the screen.

Along with the usual screen direction scrolling, there came a need to drag and drop items across the screens. Nowadays, many multi-tasking people working in the software industries prefer multiple displays. This involves moving a task or application from one screen to the other by dragging and dropping a particular window.

At the same time, along with the basic scrolling, sometimes the user may need to see beyond the current windows size to drop an item. When a particular item is dragged from a place, one needs to see beyond the limited windows size to drop the item at a specific location.

Scrolling mechanism finds its use in such scenario. The user moves the item selected in a specific direction and the scrolling mechanism automatically kicks in without needing to scroll down the wheel explicitly.

This mechanism is more comfortable for people working with graphics design and photo editing.