Responsive web design workshop

Two-day hands-on workshop on designing for mobiles.

Arpan CJ

@arpancj

Responsive Modules

Submitted May 24, 2013

Creating Responsive self-contained modules of related content

Outline

  • Responsive Content: * a flexible article module (eg: http://thegreatdiscontent.com/) with:
    • title
    • body
    • author + metadata
    • blockquotes
    • images + captions
    • footnotes
  • Slideshow: A responsive slideshow with images, captions & links (requires JS & jQuery), with element animated individually & at different speeds (eg: http://www.ideadevice.com )
  • Forms: Designing fieldsets, legends, labels, errors & hints to be responsive
  • Tables: Optimizing tabular content for mobiles.

Speaker bio

I’ve been a web designer & developer for the last 9 years. For the last couple years, I have focused on on cross-device UI design, specifically in creating web sites & web apps that work well across various screen sizes & resolutions.

Comments

{{ gettext('Login to leave a comment') }}

{{ gettext('Post a comment…') }}
{{ gettext('New comment') }}
{{ formTitle }}

{{ errorMsg }}

{{ gettext('No comments posted yet') }}

Hosted by

Meta Refresh is an umbrella forum for conversations about different aspects of design and product including: UX and interaction design CMS, content management, publishing and content marketing Information architecture more