This is an example of the full-size responsive design. The top banner and bottom banner are the only two images that change between full-size, tablet, and mobile sizes when scaled down. The other images/buckets shift right then down when the screen size is scaled down.
This is an example of the tablet responsive design. The top banner and bottom banner are the only two images that change between full-size, tablet, and mobile sizes when scaled down. The other images/buckets shift right then down when the screen size is scaled down.
This is an example of the mobile responsive design. The top banner and bottom banner are the only two images that change between full-size, tablet, and mobile sizes when scaled down. The other images/buckets shift right then down when the screen size is scaled down.
gLike
Responsive Web Design

Each week, I make updates to our homepage to keep it fresh. Since we are on a responsive template, I have to make sure to make graphics for each display size ranging between full-site and mobile. In addition, I have to make sure the HTML code is correct for all sizes before updating. These are just a few examples of the sizes I create for each homepage update.

Samantha Mongan
Lead Graphic & Technical Designer Houston, TX