23
Christopher Jones – 31.08.2015 Planning your Responsive Website

Planning your Responsive Website

  • Upload
    signale

  • View
    207

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Planning your Responsive Website

Christopher Jones – 31.08.2015

Planning your Responsive Website

Page 2: Planning your Responsive Website

Topics

• Why is responsive design important?

• What is a responsive website?

• Three areas to take your next wordpress website to the next level

Page 3: Planning your Responsive Website

Why is responsive design important?

Page 4: Planning your Responsive Website

2012 Prediction

Page 5: Planning your Responsive Website

Accessibility

Page 6: Planning your Responsive Website

Which leads to turnover

“Australians spent $17.3 billion on online retail in the 12 months”

03 August 2015NAB Online Retail Sales Index

Link: business.nab.com.au/nab-online-retail-sales-index-june-2015-12306/

Page 7: Planning your Responsive Website

What is a Responsive Website?

Page 8: Planning your Responsive Website

Devices

Page 9: Planning your Responsive Website

Smart PhonesTabletsLaptopsDesktop

Page 10: Planning your Responsive Website

Breakpoints

320x480 480x320 768x1024 1024x768 1680x1050

Smart Phones Tablets Laptops Desktops

Page 11: Planning your Responsive Website

Example

Page 12: Planning your Responsive Website

Three areas to take your next wordpress

website to the next level

Page 13: Planning your Responsive Website

1Readability

Page 14: Planning your Responsive Website

Text & Buttons

Smart Phones This is my content text on the smart phone, to avoid reader squinting and to make it easier to orientate I use a larger font size.

Bigger Buttons

Desktop My content text on a desktop can be smaller, visitors on desktops are also more comfortable with longer text.

Smaller Buttons

Page 15: Planning your Responsive Website

2Content Selection

& Location

Page 16: Planning your Responsive Website

Example

Page 17: Planning your Responsive Website

Example

Page 18: Planning your Responsive Website

Example

Page 19: Planning your Responsive Website

3Interactivity

Page 20: Planning your Responsive Website

Mouse verses Hand

Page 21: Planning your Responsive Website

MenusScrolling

HoverMultimedia

Forms

Page 22: Planning your Responsive Website

What’s happening tomorrow?

Page 23: Planning your Responsive Website

31.08.2015

Christopher [email protected]

www.signale.com

@signaledesign