Responsive Website Design Tips

1. Responsive Website Design
www.emonde.co.uk

2. Responsive Website Design
In simple terms, a responsive website design uses
“media queries” to figure out what resolution of device
it’s being served on. Flexible images and fluid grids then
size correctly to fit the screen.

3. Tips for responsive website design
Media Queries
Use Templates
Flexible Grids
Flexible Images

4. Media Queries
Media queries, along with other techniques such as
flexible grids and flexible images, are integral to
responsive web design.
Media queries allow a developer to apply CSS to a
webpage based on device parameters, such as display
height, display width, device orientation and screen
resolution.

5. Use Templates
Making use of a template is the first bit of advice that
any expert in responsive web design would give you.
Templates make it much easier for designers who are
learning the tricks and trade of this type of web
designing.

6. Flexible Grids
A grid layout combined with relative values such as %
or em (as opposed to absolute values such as pixels),
is known as a flexible grid and allows the developer to
create web pages that can easily scale up and down.

7. Flexible Images
Images are one of the most important parts of any
website design.
In order to make the images of the website more
adaptable to the changing resolution requirements it is
advisable to use flexible imagery techniques like
context-aware image sizing.
The use of this technique will allow you to save multiple
sizes of an image.

8. Contact Us
www.emonde.co.uk