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.