Web Design is not Print Design: Key Differences

One mistake people often make with their first website is to treat it as they would print media. Both involve creating effective layouts and the use of design elements but there are also some major differences. Let’s take a look.

Print Design versus Web Design

What else makes Web Design different?

1. Web Page Elements

   The web designer’s main job is to get visitors the information they want.  Precise placement of elements on a web page goes against the nature of HTML.

2. Responsive Design

   In the old days, before smartphones and iPads became popular, web designers created fixed width pages. Nowadays, web designers utilize responsive layouts in their designs, which further distinguishes web design from print design.

   

   Responsive websites adjust the flow of elements on a web page to fit the size of any mobile device. The content on a site becomes fluid. Text, columns, images and videos will resize according to the device and screen size. In addition, web designers must take “touch screens” into consideration when designing their layouts.

3. Above and Beyond the Fold

   The concept of “above the fold” began long ago with newspapers and how were folded when they hit the newsstands. Only the top half of the newspaper was visible.

   

   “Above the fold” also became a popular term in web design, referring to the portion of a web page visible without scrolling or clicking.

   In the old days, when screens were similar in size, web designers tried to show the most important content above the so-called fold so that visitors didn’t have to scroll down.

   Scrolling wasn’t a common practice back then. Website visitors were more comfortable with clicking on links  and going from page to page. With the introduction of the iPhone in 2007, though, everything changed. First, scrolling became a natural “intuitive” action for a smartphone user with a touchscreen, similar to a computer user with a mouse.

   

   Besides scrolling becoming intuitive, the dimensions of the fold today are not consistent. Instead, they vary from one device to another. The “fold” is in an entirely different place on a phone and a tablet. It also depends on whether visitors are holding their device in landscape or portrait orientation. Today, the content that is above the so-called fold doesn’t have to contain everything important. It just needs to be convincing enough to keep the visitor scrolling.

4. Fonts

   A print designer can use any font in existence, but a web designer has some limitations. Websites, typically, draw fonts from what is available on the visitor’s computer. Because of this, in the old days, web designers tended to use universal “web-safe” fonts such as Verdana, Arial, Times and Georgia.

   With the introduction of web fonts in 1998, web designers were no longer so limited. They could start using “custom fonts” not available on the visitor’s computer and still  be sure their design remained consistent.

   

   Then along came Google Fonts. Web designers can now look through Google’s extensive catalog for open source designer web fonts and integrate them into any web page.

5. Colors

   Back in the early days of the internet, web designers were concerned with “web-safe” colors. Many computer screens back then had 8-bit color displays. But today computer screens have much higher resolutions so the range of colors in use has also exploded.

   Color remains an essential part of both print and web design. If you’re thinking about building your own website, you will want to incorporate a web design color palette. Web designers typically work with the RGB Color Model  because it represents the same colors used in computer screens. The CMYK Color Model, on the other hand, is the recommended color system for printed materials such as business cards and brochures. RGB uses light to mix colors on screen while CMYK uses ink to mix them on paper.

6. Images

   Images must be optimized for the web. Web designers have to consider carefully what images they’d like to use and be considerate of those viewers who may have a hard time loading them or seeing them. A site that is 100% graphics will would be easy to lay out, but it would take forever to load.

7. HTML

   When a web designer creates a web page, they are writing in a specific language (HTML). Web designers must be proficient in HTML and CSS. They need to understand how a web page is put together, how it is delivered to a web browser, how it behaves and also how it is used by real people. Websites are more like dynamic documents that can be continually improved, which is a great advantage over printed documents.