Eileen Fisher
Annual reports – when they are done right – can be a great marketing tool showcasing your nonprofit. I cover nonprofit annual reports quite a bit, and thought I would share how this nonprofit went about creating both a print and online version of their annual report. This step by step description will give you some new ideas, save you time and money, and take some of the guesswork out of designing yours should you decide you like the approach, which converts the report into a simple, user-friendly, online version. ~Kivi
Guest Post By Eileen Fisher of Reconstructionist Rabbinical College
When you offer a major publication both print and online, you want to have it all. You want the VIP audiences of your nonprofit to hold a beautiful book in their hands. You want your wider audience online to get interactive features and the ideal view: immediately readable pages that show off the complete design (not a static PDF they must load and scroll through). And you want those pages to be part of your website—so that when you promote your publication, your traffic spikes. Many popular online publication products use Flash—incompatible with Apple products. And older users may have trouble adjusting to these products’ interfaces and sorting through their viewing options. But creating an HTML version from scratch would take days of work. Read: expensive.
Sam Cohen
What to do? At RRC, the rabbinical seminary of Reconstructionist Judaism, we found an ideal solution for our annual report with the help of our Drupal developer, Sam Cohen. Sam’s approach truly does let us have it all—and requires only a minimal number of hours from him and some careful forethought from our graphic designer, Amy Pollack. Here’s how to follow our model…
Amy Pollack
1. Start by designing the print version. “The designer has complete freedom,” Amy says. There are just a couple of things you need to anticipate. Because each page will appear in the same proportions on screen, use a horizontal format—which minimizes the unused space on each side. Do not put any text or art in the bottom inch of the pages; include only elements that can either be part of the online footer (such as page numbers) or can be eliminated online (such as your plug for the online version). Complete your print PDF as usual.
2. Now start the elements that will go into the second PDF, for the online version. The first step for the designer is the footer. Ours contains forward and back arrows, page numbers, and a combined return to table of contents and publication ID (“Back to RRC report contents”). On the opening pages of our main stories, we added “Share this report.” We used Facebook only, reflecting our audience.
3. Add links to extra features—video, audio, additional web pages—compiled by the editorial team, and tweak the page designs as needed. Also remove any text that isn’t relevant online.
4. Swap in the online footer. Then designer and editor should consult to alter the page flow if necessary. Remember that each page will come up in full-screen view. For instance, it made sense for us to place a fundraising ask on the inside front cover in print; it appeared on a spread with the table of contents. But the same piece did not make sense online as the next stop after people viewed the cover. We made the TOC the second page (and edited it to reflect the new page order).
5. Add markup to make “maps” of where live links will appear. Amy simply underlines, knowing that the team will want to adjust styles later on, when we view the draft online. This completes the online version in layout. Now the designer produces a PDF; this is what Amy gives Sam.
6. Provide the developer with a list of all the hyperlinks organized by page. As editor, I do this part. It’s the complement to the image maps.
7. Begin constructing the online version. The developer creates a large JPG image of each complete page from the PDF, embeds the image in an HTML page and adds the live links using image maps. Sam creates a basic HTML template for all the pages, so the links for navigation don’t have to be added over and over again.
8. Add share tools and—very important—add metatags for SEO. As your developer will remind you, search engines can’t read art images. We used our Facebook descriptions to double as metatag text.
9. Allow some time at this point for the editorial team to proof and tweak, paying special attention to readability and flow. Adjust the design of the interactive elements so that they shine on screen.
10. Once the editorial team has finalized, the online version goes live, and it’s time to promote! Amy designed a branded email banner that plays off the graphic theme from our cover, and we publicized our top stories in email blasts to two segments. For our VIPs who would receive copies later in print, we characterized the online version as a special, interactive preview.
What’s different about this method? The key is that it uses HTML in a different way—each page is a large JPG image. This approach wouldn’t have been possible until recently, Sam says, because those JPGs would have taken too much time to load using dial-up connections. People have long embedded a JPG of a flier or invitation in an email body, he points out, and what we do takes that old technique and steps it up: “Taking advantage of the fact that most of our audience now has high-speed Internet, we use that technique for our entire publication.”
As the editor, I couldn’t be happier. We achieve a great online version using only about a half day extra of Amy’s time and at most a full day of Sam’s. This technique is so easy, it’s no problem to add new elements. This year we debuted not only the branded e-blasts and the sharing tools but also a reader survey—both in print and online, using Survey Monkey. Even with a small team, this was all very manageable, thanks to this smart, simple process.
Eileen Fisher is the Assistant Vice President for Communications at Reconstructionist Rabbinical College providing creative and administrative direction. She is an experienced writer and editor who has always specialized in work for nonprofit organizations. Previous to her work for RRC, she reported and edited stories on policy, practice and marketing in K-12 education. She received a B.A. in English literature and dance at Oberlin College and did graduate coursework in arts administration at Drexel University. She is happy to be working on behalf of future spiritual leaders at RRC.
