Chapter 7. Adding graphics in the browser with CSS

This chapter covers

  • Using CSS as a design tool
  • Maintaining proportions in a responsive site
  • Adding responsive media
  • Using icon fonts in your design
  • Using SVG in modern sites

It was tempting to title this chapter “Designing in the Browser” because we’re now at what might commonly be referred to as a “detail design” phase. We’ve already designed the site, and we’ve discussed the user interface, content, visual brand, and identity; everything is ready for us to start crafting a more detailed presentation layer.

In chapter 2 we used Photoshop to create a presentation layer for our site (figure 2.8). This showed designers how to take their typical workflow and apply it to mobile ...

Get The Responsive Web now with the O’Reilly learning platform.

O’Reilly members experience live online training, plus books, videos, and digital content from nearly 200 publishers.