Slides from my talk about my theory behind responsive design and development. I've not included notes and the slides are shared purely for the links as mentioned in the talk
15. why?
“day by day, the number of devices, platforms,
and browsers that need to work with your site grows.
responsive web design represents a fundamental shift
in how we’ll build websites for the decade to come.”
- Jeffrey Veen
what the heck is rwd
Friday, 24 May 13
16. but!
“...responsive web design is not only
about adjustable screen resolutions and
automatically resizing images/videos...”
Friday, 24 May 13
18. design
go back to the basics for:
• content hierarchy
• wireframes
• in browser, illstr, phtoshp or frwrks
• images / scripts / fonts
Friday, 24 May 13
19. design
content is king
relative typography
consider all screen sizes
button sizes / sausage fingers
strip out extra content and ‘designy’ crap
don’t make the site look like a native, iPhone/Android,
application...please :)
Friday, 24 May 13
20. a bit of development
• frame works
• html5/css3
• font scaling - rem, em, pixel, scaling-pixel,
<meta name="viewport" content="width=device-width, initial-scale=1">
• video’s/images
• SASS / LESS
• media queries - css/js
• vertical media queries
• preview on mobile devices not just in browser
Friday, 24 May 13
21. some links
• basic responsive grid - my custom rwd grid
• skeleton - wordpress and basic html
• bootstrap - i hate it (waaay too much bloat)
• the bricks - flat design psd/ai elements
• isotope - slightly cheating but works :)
• style guide(s)
• navigation show down
Friday, 24 May 13
22. reading material
• smashing magazine: mobile books/articles
• a list apart / responsive-design
• http://www.abookapart.com
• reactive web design
• saraproft
Friday, 24 May 13
23. what we’ve covered
• what is responsive web design
• where it’s used: now and the future
• why?
• design
• development
Friday, 24 May 13
24. please ... feel free to find me:
• twitter : #scriptedpixels
• facebook: www.facebook.com/scriptedpixels
• portfolio: www.scriptedpixels.co.uk
• linkedIn : uk.linkedin.com/in/kambanwait
any of these: ?
Friday, 24 May 13