by Adobe Digital Publishing Suite Team

 Comments (3)

Created

November 1, 2012

By Teresa Demel

Rodale Publishing has established itself as a leader in designing magazines for the small screen. They have already launched Men’s Health, Women’s Health, and Best Life on the iPhone, showing their commitment to being widely available to readers across some of the most popular devices.

This app of the week video compares the iPad and iPhone versions side-by-side, so that you can see for yourself how they adapted the layout to include the same great content on a smaller screen. The difference in layout is not just based on size, but also on use case. When people are reading content on the iPhone, they are looking for smaller bits of “snackable” information. The layout allows readers to scan across articles, and then read more deeply about an eye-catching topic.

Careful Balance of Images and Text
As a general rule, Rodale uses a minimalist approach to page layout on the iPhone. Readers will either see text or images on the pages, but will rarely see both. As an example, this video shows a how-to article on the Sun Salutation yoga pose. The iPad article shows all 10 poses on a single page, with the description text adjacent to the images. On the iPhone, this layout would be completely illegible. Rodale redesigned it so that readers can either toggle between the poses, and then click on a button to open up the description. This is incredibly clear and allows readers to focus their attention on one thing at a time.

Color Coding Cues
The DPS-based Table of Contents is color coded to delineate between sections.

  • Style & Beauty – Yellow
  • Fitness – Blue
  • Food – Green

This color coding is not just in the icons, but also on the article pages. When I’m reading a print magazine, I can tell where I am based on the page numbers and the footer of the publication. As an iPhone reader, where real estate is smaller, the color frames are clues for where I am in the context of the larger magazine.

While the following app of the week video outlines a few tricks used by Rodale, download the Women’s Health app from iTunes to experience more methods for conveying information on a small screen.

Watch the Women’s Health app of the week video

COMMENTS

  • By Anthony - 1:10 AM on November 2, 2012   Reply

    Hasn’t this been app of the week before?

  • By Digital Magazines - 3:32 AM on November 6, 2012   Reply

    Wow good information ! Nice Blog Thanks

  • By Adobe Digital Publishing - 6:35 AM on November 6, 2012   Reply

    Hi Anthony,

    We had Men’s Health on iPhone as an app of the week. They are designed by the same people, so there are similar layout choices. I’m glad you’re following them!

ADD A COMMENT

 
http://blogs.adobe.com/digitalpublishing/2012/11/app-of-the-week-womens-health-on-iphone-and-ipad.html
blogs.adobe.com
crawl=CC-MAIN-2013-20
19537
application/http; msgtype=response
sha1:7HYVLZZJ2LS4QBTRJX3WN7UOJ42JPXIL
<urn:uuid:0911690f-53b5-4b3e-a449-a75807e36c51>
2013-06-19T10:30:07Z
67.222.101.124
sha1:CB6RA6JB3IC6T62MJB755ALP4CSDMDOM
<urn:uuid:f28b0e09-292b-41d5-91c4-f97960942702>
http://blogs.adobe.com/digitalpublishing/2012/11/app-of-the-week-womens-health-on-iphone-and-ipad.html
response
<urn:uuid:c077692f-9534-4762-b6e4-0a79cfd39d57>
robots: classic
hostname: ip-10-60-113-184.ec2.internal
software: Nutch 1.6 (CC)/CC WarcExport 1.0
isPartOf: CC-MAIN-2013-20
operator: CommonCrawl Admin
description: Wide crawl of the web with URLs provided by Blekko for Spring 2013
publisher: CommonCrawl
format: WARC File Format 1.0
conformsTo: http://bibnum.bnf.fr/WARC/WARC_ISO_28500_version1_latestdraft.pdf