Responsive Web Design

Simple example of responsive web design below.

The photos show how the menu for this website appears in full on a standard computer screen, but as a 'hamburger' bar on a mobile device. In between size screens, such as a tablet, shows some of the menu and a 'More' button for items not fitting across the screen. Options will depend on where you build your website (Content Management System and theme, or your ability to code).

Some websites will have a fixed header (known as a 'sticky' header) for people visiting on a computer screen so that contact details and menu options can be seen at all times, but will select for the header to be minimal or vanish completely (a 'transparent' header) for mobile website visitors.

This will all be tested and final tweaks can be made to suit your business needs.

Menu showing at top of page on computer screen

Menu showing on top of page on tablet

Menu showing at top of page on mobile phone

Another popular option at present is to embed videos from social media such as You Tube as a background to some text. With some CMS, you can choose not to show videos from You Tube to save customer's data allowance if they open your website on a mobile. They could choose a photo or block colour as an alternative if they don't want the text to be lost to mobile viewers. Complete sections can be added or deleted and font sizes can be altered to suit the device audience.