Friday Design: Creating Webpage Banners with a Consistent Theme

Happy Friday, dear readers! I hope the week has treated you well and that you remain healthy and have a relaxing weekend to look forward to. Today I want to share a design tip that will help you keep a consistent theme while saving you time. And we could all use a little more efficiency in our design work, couldn’t we? I know I can as I look towards the starting of the next academic term and juggling everything life seems to be throwing at us now (in addition to our graphic design work!).

Over this summer, we revised and cleaned up our online Exhibits LibGuide. There used to be many (many) disparate guides to past exhibits, but thanks to one of my colleague’s careful and patient work, they are all now collocated. This makes it much easier for viewers to find all our past exhibits and makes the backend work much easier, too.

Once this was done, while the organization of our exhibit pages on the LibGuide were functional, we didn’t have an coherent visual theme to link together our top landing pages for the guide itself, as well as past and current exhibits. This wouldn’t do for a guide that was all about exhibits where we expect good visuals. So I created three banners for these pages, which sounds like a lot of work, but once I created the first one, I used it as a basis to tie together the theme with the other two.

Here’s the first banner for the homepage of the LibGuide:

Online Banner for exhibit LibGuide that says Library Exhibits

I chose images, type, and colors that worked together to create a coherent theme. The theme was to express exhibits and the diversity of our campus community that inspires us. I sampled colors in the photographs for the font colors and the background color. With this done, I decided to use the same layout for the other two banners, but change out one image in each.

This is the past exhibit banner:

Online Banner that says Past Exhibits

And this is the current exhibits banner:

Online banner that says Current Exhibits

Notice how they maintain the overall theme through the same use of color palette, fonts, and layout, but have unique images used, too. This makes the banners more visually interesting, yet maintains coherency across the landing pages.

This design “trick” enables us to both maintain a consistent theme and inject some fun, visual interest into the banners. It also allowed me to create three banners in only a little more time than it would take me to create one because I wasn’t trying to reinvent theme and layout for each of them.

I hope this design example is helpful and useful for when you are considering how to design or revamp banners or implement design themes on your LibGuides, webpages, or other multiple page documents.

I hope you have a lovely, restful, and safe weekend. I’ll be back again with more design thoughts to save you time and hopefully provide new insights for your library graphic design work.

Allons-y, dear friends!