Real World Responsive Design

Real World Responsive Design

Real World Responsive Design

This one-day, hands-on workshop is for those that are ready to start building responsively or are having trouble integrating responsive techniques into their workflow. They’re convinced of the benefits of a fluid, device agnostic web and believe in mobile first as a best practice, but need a helping hand in breaking free of old build habits.

This workshop will make the connection between best practice and actual workflow through a mixture of tutorials, examples, exercises, discussion and pair programming that will be crafted to make the connection between responsive best practices and real-world projects. Together we’ll begin the day with a static site design and work through the day so you can take home HTML and CSS that translates the design into a device-agnostic responsive page that will load in whatever browser you desire. In the process we’ll explore the intersection of best practice and project compromise in a way that will make it easier for us all to make better decisions as we continue to build the responsive web.

Topics Covered

  • Planning a responsive build from a pre-existing design
  • Converting a static design to a fluid web page
  • Writing lightweight and modular CSS
  • Mobile first techniques (and how to apply them to non-mobile first projects
  • Crafting device agnostic breakpoints
  • Responsive design beyond browser width
  • Making better-informed compromises
  • Tools that make hand-crafting responsive sites easier

Required Preparation for Attendees

You should bring a laptop that can open and work with PSD files and has a web text editor such as Coda or Sublime Text. You should have a working understanding of HTML and CSS and know the basics of writing media queries to adjust your page designs.

Mike Gibson
Mike Gibson
Lead Designer
Table XI
Mike is the lead designer at Table XI. He enjoys semantic markup, modular CSS and long-walks on a moonlit beach.
July 2024