There are different strategies for meeting market demand for suitable content presentation on the wide variety of digital devices in use today. One strategy is to make the web pages "responsive" so that web page layout changes when the content is accessed with devices of different screen dimensions. Another strategy, practiced by Atypon, is to serve "adaptive" web content that is customized for specific types of devices, taking into account screen size, user controls, and user behavior. In this presentation, we explain the differences between adaptive and responsive web design and share important information to help publishers assess their own strategies.

1. Responsible Design
A Pragmatic Approach to Website Design
For Multiple Devices
Jonathan Hevenstone
Senior VP, Business Development
Atypon
STM Annual US Spring Conference
May 1, 2014

2. Desktops and printed PDFs are still king
but mobile is on the rise
Graphic: IDG Global Solutions
Most researchers still read e-journals on computers or printouts but they are
increasingly using devices to grab a citation, do a search, or go from an alert to a
new article.

3. Publishers should present their content
optimally for each device
Screenshots: Taylor & Francis Online, powered by Atypon’s Literatum
Desktop Tablet Phone
Compare these three views of a journal page from Taylor & Francis Online, which is
powered by Atypon’s Literatum platform. Literatum serves a unique layout that adapts
for each device and the way it is used.

4. Two web design approaches to consider
Graphic: Digital Broadcasters “Responsive Web Design vs Adaptive Web Design
vs Separate Mobile Sites”
1
With Responsive Web Design, the layout changes according to the device’s screen size.

5. 2
Two web design approaches to consider
Graphic: Digital Broadcasters “Responsive Web Design vs Adaptive Web Design
vs Separate Mobile Sites”
Adaptive web design takes into account the device’s screen size, user controls
(ie. mouse vs touch vs voice) and differences in activities (ie. whether users are
more likely to be reading or searching).

6. There is a lot of talk about
Responsive Web Design
Graphic: IDG Global Solutions

7. Adaptive Web Design? Not so much
Graphic: IDG Global Solutions
But what’s the difference?
And which approach is better?

8. Responsive Web Design
RWD can make a single site design work on multiple devices
Graphic: The Boston Globe December 10, 2011
Desktop Tablet Phone

9. But one layout doesn’t fit all
Content order may need to vary, which is harder
to do with responsive CSS than with adaptive coding
Graphic: Scott Abel, thecontentwrangler.com
Webinar: “Mobile Devices and the Need for Adaptive Content” March 10, 2014

10. Elevating Responsive Web Design
with “progressive enhancement”
Start with the smallest page design and then add more elements for
larger viewports.
Progressive enhancement requires lots of time and planning.

11. “It’s not just about layout anymore: a
responsive redesign will raise challenges with
your current design, development, and
publishing processes.”
- responsivewebdesign.com
Progressive enhancement gets even more challenging
when you come to scholarly publishing, where users
prefer PDFs or full text on a large screen.

12. Atypon primarily follows an adaptive
approach, though we use responsive web
design when appropriate.
“Adaptive content automatically responds
to the screen size and orientation of
any device, but goes further by
displaying relevant content that takes
full advantage of the specific
capabilities of the device being used.”
Charles Cooper
The Language of Content Strategy
Graphic: Scott Abel, thecontentwrangler.com
Webinar: “Mobile Devices and the Need for Adaptive Content” March 10, 2014

13. Graphic: Skyrocket Blog, October 23, 2013

16. “If you need to choose
between your designer and
your user, pick the user”

17. Literatum for Mobile: AWD in Action
Screenshots: Taylor & Francis Online, tablet mode
Mobile access to Literatum-powered websites
on Android and iOS phones and tablets

18. We recommend a pragmatic approach
Mobile access to Literatum-powered websites
on Android and iOS phones and tablets
Graphic: Blue Polo Interactive
We leverage Adaptive Web Design principally but we also use aspects of
Responsive Web Design or any other method when appropriate.
Stay focused on delivering the best possible experience to the end user.

19. Think “Responsible Web Design”
and take into account the user’s
full range of needs

20. Deciding when to change your strategy
Graphic: Eyemaginetech Blog, “Free Mobile Strategies Guide for Catalogers” Nov 7, 2013
Consider the following:
1.Are all users getting the
content that is best suited
to their needs at the
moment of access?
2.Is unnecessary content
being delivered to any users?
3.Are you providing the right interaction for the user’s “input device”?
4.Is the user authenticated, recognized, and provided with feedback
that is appropriate, whichever device is being used?

21. Thank You
About your speaker:
Jonathan Hevenstone
Senior VP, Business Development
Atypon
Social Media: @Atypon on Twitter