• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Responsive Design Lessons
 

Responsive Design Lessons

on

  • 600 views

This is a short presentation on some lessons and tips I've learnt through some of my first responsive design projects.

This is a short presentation on some lessons and tips I've learnt through some of my first responsive design projects.

This talk is from a Pecha Kucha night at UX Brisbane.

Statistics

Views

Total Views
600
Views on SlideShare
599
Embed Views
1

Actions

Likes
1
Downloads
19
Comments
0

1 Embed 1

http://dschool.co 1

Accessibility

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Responsive Design Lessons Responsive Design Lessons Presentation Transcript

    • My Lessons from Responsive Design DAN NAUMANN
    • Responsive Design Responsive web design (RWD) is a web design approach aimed at crafting sites to provide an optimal viewing experience ... across a wide range of devices http://en.wikipedia.org/wiki/Responsive_web_design
    • Responsive Design http://www.kareyhelms.com/2012/08/new-work-plbsearch/
    • Frameworks
    • Frameworks http://usablica.github.io/front-end-frameworks/compare.html
    • Wireframes (Process)
    • Wireframes (Process) http://www.divshot.com/
    • Browser vendors x Versions x Screen sizes Testing
    • Testing http://responsivenews.co.uk/post/56884056177/wraith
    • Responsive Images
    • Bandwidth? Responsive Images Javascript? Attributes? Same image? <picture>?
    • Mobile First http://themes.elmastudio.de/nori/
    • Mobile First Focus content and features Post processing
    • Rems Rems = Root ems
    • Rems Relative sizing without the problems of ems
    • Rems 12px 13px 14px
    • Rems Any dimensions! Fonts, padding, etc.
    • Patterns http://getbootstrap.com/2.3.2/
    • Patterns http://bradfrostweb.com/ Brad Frost
    • Dan Naumann @danielnaumann Thank you!