It's no secret, the rapid growth of mobile has made site owners sit up and pay attention, as a result responsive and adaptive have become the buzzwords of the moment. Avoid the common pitfalls of building mobile optimised websites and rediscover the lost art of building sites for users. Read more: http://snipi.co/l/0:1lZAlbCDaYEE

1. Justin Taylor - Managing Director
@JustinGraphitas
design for mobile
responsive or adaptive
who cares?

2. @JustinGraphitas
responsive
or
adaptive

3. @JustinGraphitas
responsive

4. @JustinGraphitas
adaptive

5. @JustinGraphitas
so which
is best?

6. @JustinGraphitas
mobile stats

7. @JustinGraphitas
2012201120102009
mobile internet
usage

8. @JustinGraphitas
mobile search with
local intent
almost half

9. @JustinGraphitas
of online sales for
mothers day from mobileSource: Westminister eForum 2012 - The future of mobile

10. @JustinGraphitas
£13billionmobile sales in 2013
Source: Bloomberg – http://graphit.as/13billion

11. @JustinGraphitas
and thats just

12. @JustinGraphitas
ever
fastest
mobile isthe
growing
platform

13. @JustinGraphitas
what we know
about mobile
users

14. @JustinGraphitas
users browse with intent
users are less tolerant
can’t find what they are
looking for they’re off!

15. @JustinGraphitas
responsive
or
adaptive
who cares?

16. @JustinGraphitas
users don’t
care about
technology

17. @JustinGraphitas
users care about
finding info
quickly and easily

18. @JustinGraphitas
nhsdirect.nhs.uk

19. @JustinGraphitas

20. @JustinGraphitas

21. @JustinGraphitas
click to call
not enabled

22. @JustinGraphitas
<a href="tel:111“>Call 111</a>

23. @JustinGraphitas

24. @JustinGraphitas

25. @JustinGraphitas

26. @JustinGraphitas

27. @JustinGraphitas

28. @JustinGraphitas

29. @JustinGraphitas

30. @JustinGraphitas

31. @JustinGraphitas
<?php
require_once '../Mobile_Detect.php';
$detect = new Mobile_Detect;
if($detect->isMobile() ) {
//redirect to mobile site
header ('HTTP/1.1 301 Moved Permanently');
header ('Location: http://m.mobilesite.co.uk/');
}else{
//load site normally
}
?>
https://code.google.com/p/php-mobile-detect/
http://detectmobilebrowsers.com/

32. @JustinGraphitas
www.skinnyties.com www.worldwildlife.org www.bbc.co.uk
www.tb-groupe.fr www.subway.co.uk www.graphitas.co.uk
:)

33. @JustinGraphitas
5 tips in
5 mins

34. @JustinGraphitas
design from
a consumers
perspective
tip
1

35. @JustinGraphitas
establish users intent
cut the clutter
circumstances of user
viewing site
required outcome

36. @JustinGraphitas
target your
most popular
devices
tip
2
HT: Aleyda Solis @alyeda

37. @JustinGraphitas
analytics > audience > mobile > devices

38. @JustinGraphitas
analytics > audience > mobile > devices

39. @JustinGraphitas
Opera Mobile Emulator
http://www.opera.com/developer/mobile-emulator

40. @JustinGraphitas
enhance UX
with mobile
specific html
tip
3
<meta name=
”format-detection”
content=
”telephone=no”><input
autocapitalize=

41. @JustinGraphitas
click to call view desktop site
click to sms
disable auto correct
on name fields
disable automatic
detection of numbers
location services
use relevant keyboard

42. @JustinGraphitas
put usability
first
3
1
2
tip
4

43. @JustinGraphitas
put consumers
requirements first
THEN worry about these things
responsive
dynamic servingparallel serving
adaptiveSEO

44. @JustinGraphitas
tip
5
think like a
consumer
HT: Dave Trott @davetrott

45. @JustinGraphitas
think like a consumer
...NOT like the client

46. Justin Taylor
@JustinGraphitas
thank you
www.graphitas.co.uk
www.slideshare.net/JustinGraphitas