242 lines
14 KiB
HTML
242 lines
14 KiB
HTML
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
|
|
<head>
|
|
<meta http-equiv="X-UA-Compatible" content="IE=8;" />
|
|
<meta name="twitter:card" content="summary_large_image">
|
|
<meta name="twitter:site" content="@NLM_NIH">
|
|
<meta name="twitter:title" content="The PubReader View: A New Way to Read Articles in PMC. NLM Technical Bulletin. 2012 Nov–Dec">
|
|
<meta name="twitter:description" content=" The NLM Technical Bulletin is your source to stay informed about NLM products and services.">
|
|
<meta name="twitter:image" content="https://www.nlm.nih.gov/pubs/techbull/images/nlm_tech_bulletin_graphic_twitter.jpg">
|
|
<meta property="og:url" content="https://www.nlm.nih.gov/pubs/techbull/tb.html" />
|
|
<meta property="og:type" content="article" />
|
|
<meta property="og:title" content="The PubReader View: A New Way to Read Articles in PMC. NLM Technical Bulletin. 2012 Nov–Dec" />
|
|
<meta property="og:description" content="The NLM Technical Bulletin is your source to stay informed about NLM products and services." />
|
|
<meta property="og:image" content="https://www.nlm.nih.gov/pubs/techbull/images/nlm_tech_bulletin_graphic_facebook.jpg" />
|
|
<link type="text/css" href="/pubs/techbull/styles/reset.css" rel="stylesheet" />
|
|
|
|
<link type="text/css" href="/pubs/techbull/styles/technicalBulletin.css" rel="stylesheet" />
|
|
<!--Call jQuery-->
|
|
<script src="//assets.nlm.nih.gov/jquery/jquery-latest.min.js"></script>
|
|
<script src="//assets.nlm.nih.gov/jquery/jquery-migrate-latest.min.js"></script>
|
|
<script src="/pubs/techbull/scripts/techbull.js" type="text/javascript" language="javascript"></script>
|
|
<!--[if lte IE 8]>
|
|
<script type="text/javascript" src="/scripts/PIE.js"></script>
|
|
<![endif]-->
|
|
<link type="text/css" href="/pubs/techbull/styles/print.css" rel="stylesheet" media="print"/>
|
|
<title>The PubReader View: A New Way to Read Articles in PMC. NLM Technical Bulletin. 2012 Nov–Dec</title>
|
|
<link rel="schema.DC" href="http://purl.org/dc/elements/1.1/" title="The Dublin Core metadata Element Set" />
|
|
<meta name="DC.Title" content="The PubReader View: A New Way to Read Articles in PMC" />
|
|
|
|
<meta name="DC.Publisher" content="U.S. National Library of Medicine" />
|
|
<meta name="DC.Date.Issued" content="2012-12-10" />
|
|
<meta name="DC.Date.Modified" content="2013-07-18" />
|
|
<meta name="NLMDC.Date.LastReviewed" content="2013-07-18" />
|
|
<meta name="NLM.Contact.Email" content="nlmtechbull@mail.nlm.nih.gov" />
|
|
<meta name="DC.Type" content="Newsletters" />
|
|
<meta name="NLM.Permanence.Level" content="Permanent: Stable Content" />
|
|
<meta name="NLM.Permanence.Guarantor" content="U.S. National Library of Medicine" />
|
|
<meta name="DC.Rights" content="Public Domain" />
|
|
<meta name="DC.Language" content="eng" />
|
|
|
|
|
|
<meta name="DC.Subject.Keyword" content="PubReader" />
|
|
<meta name="DC.Subject.Keyword" content="PubMed Central" />
|
|
|
|
<!-- Google Tag Manager -->
|
|
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-MT6MLL');</script>
|
|
<!-- End Google Tag Manager -->
|
|
</head>
|
|
<body>
|
|
<!-- Google Tag Manager -->
|
|
<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-MT6MLL" height="0" width="0" style="display:none;visibility:hidden" title="googletagmanager"></iframe></noscript>
|
|
<!-- End Google Tag Manager -->
|
|
<div class="skipnavigation"><a title="Skip the navigation on this page" href="#skipnav" class="skipnavigation">Skip Navigation Bar</a></div>
|
|
|
|
<div>
|
|
|
|
<div class="header">
|
|
<img src="/pubs/techbull/images/tb_logo_113.jpg" alt="National Library of Medicine Technical Bulletin" title="National Library of Medicine Technical Bulletin" /><img src="/pubs/techbull/images/nlm_masthead_113.jpg" alt="National Library of Medicine Technical Bulletin" title="National Library of Medicine Technical Bulletin" usemap="#nlm_masthead_113" />
|
|
</div>
|
|
|
|
<div class="search_box">
|
|
<form method="get" action="//vsearch.nlm.nih.gov/vivisimo/cgi-bin/query-meta" target="_self" name="searchForm" class="searchForm">
|
|
<label class="displaynone" for="search">Search</label>
|
|
<input name="query" id="search" type="text" class="search-input inactive" size="50" onfocus="this.value=''" value="Search here for NLM Technical Bulletin articles" aria-label="Search NLM Technical Bulletin">
|
|
<input type="hidden" name="v:project" value="technical-bulletin">
|
|
</form>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="nav">
|
|
<!--Open drop-->
|
|
<ul class="topnav">
|
|
<li class="currentissue"><a href="//www.nlm.nih.gov/pubs/techbull/current_issue.html">Current Issue</a> <img class="separator" src="/pubs/techbull/images/whitelinetransparentbackground.gif " alt=""/></li>
|
|
<li class="archive"><a href="//www.nlm.nih.gov/pubs/techbull/back_issues.html">Previous Issues</a> <img class="separator" src="/pubs/techbull/images/whitelinetransparentbackground.gif " alt=""/></li>
|
|
<li class="about"><a href="//www.nlm.nih.gov/pubs/techbull/about.html">About</a> <img class="separator" src="/pubs/techbull/images/whitelinetransparentbackground.gif " alt=""/></li>
|
|
<li class="staycurrent"><a href="//www.nlm.nih.gov/pubs/techbull/stay_current.html">Stay Current <img class="emaillogo" src="/pubs/techbull/images/email_20px.gif" alt="E-Mail Sign Up" style="margin-top: -4px;"/> <img class="rsslogo" src="/pubs/techbull/images/rss_20px.gif" alt="RSS Feed" style="margin-top: -4px;"/></a></li>
|
|
</ul>
|
|
<!--Close drop-->
|
|
</div>
|
|
<div class="body">
|
|
<a id="skipnav" name="skipnav"></a>
|
|
<div class="syndicate">
|
|
<p class="tableOfContents"><strong>Table of Contents: <a href="/pubs/techbull/nd12/nd12_issue_cover.html">2012 NOVEMBER–DECEMBER No. 389</a></strong></p>
|
|
<p class="prevnext"><span class="buttons">
|
|
<span class="previous"><a href="nd12_medlineplus_mobile.html">Previous</a></span> <span class="next"><a href="nd12_training_ncbi_application.html">Next</a></span>
|
|
|
|
</span></p>
|
|
<hr class="hr1" />
|
|
<h1 class="articleH1">The PubReader View: A New Way to Read Articles in PMC</h1>
|
|
<p class="tbyearmonth">Lipman D. The PubReader View: A New Way to Read Articles in PMC. NLM Tech Bull. 2012 Nov-Dec;(389):e7.</p>
|
|
<div class="articleactions">2012 December 10 <span class="status">[posted]</span>
|
|
|
|
|
|
|
|
</div>
|
|
<div class="articleParagraph">
|
|
|
|
<p>
|
|
Why is it that we can spend hours reading emails, news articles, blogs, and abstracts on our computers but when it comes to a scientific article, many of us choose to print it out? Perhaps it is because we generally do not read straight through an article. Instead, we often glance back at a table, figure, or paragraph to clarify what we have just read. The more complicated the article, the more likely we are to flip back and forth while reading it. Printed articles typically break the content into two columns per printed page which, together with embedded figures and tables, provides convenient physical and visual landmarks for facilitating this form of reading.
|
|
</p>
|
|
|
|
<p>
|
|
The most common way that a scientific paper appears on the Web is as a single long page that you read by scrolling through vertically. Without the landmarks of multiple columns and separate pages, however, once you scroll back to look at, for example, an earlier figure, you often have to hunt around for the spot where you stopped reading.
|
|
</p>
|
|
|
|
|
|
<p>
|
|
Another common presentation format is a PDF, which displays the pages on your screen exactly as they appeared, or would appear, on the printed page. If your display is large enough, you might get one or even two pages on the screen. With smaller screens however, such as a laptop or tablet, when you shrink the page to fit the screen the text is too small to read. Zooming in so that the words are readable means you are back to the problem of scrolling around through the article. Either way, it can be difficult to keep your train of thought as you work through the paper. These problems are compounded when you try to read through an article on one of the new tablets with a 7-inch screen.
|
|
</p>
|
|
|
|
<p>
|
|
To address these problems, NCBI has developed a new presentation style that we call PubReader, an easier way to use your Web browser to read articles in PubMed Central on your desktop, laptop, or tablet computer. Like a printed paper, PubReader breaks an article into multiple columns and pages to improve readability and navigation. PubReader can expand a page to whatever fits on your screen — with multiple columns on a desktop monitor or a single column page on a small tablet. It will even switch to two columns if you rotate the tablet to a landscape view. When you adjust the font size or change the size of the browser window, page boundaries and columns are adjusted automatically (see <a href="#fig1">Figure 1</a>).
|
|
</p>
|
|
|
|
|
|
<a name="fig1"></a>
|
|
|
|
|
|
<div class="figure" style="width: 754px;"> <img src="graphics/pubreader_fig1.png" alt="Screen capture of citationcontext menu." title="Screen capture of citation context menu" width="752" height="550" /><br /> <strong>Figure 1: Full PubReader screen showing first page of an article with the journal banner.</strong></div>
|
|
|
|
|
|
<p>
|
|
The PubReader presentation offers a variety of common options for moving between pages:
|
|
</p>
|
|
|
|
<ul>
|
|
<li>Use the PageUp, PageDown, RightArrow, LeftArrow keys on a keyboard.</li>
|
|
<li>Tap or click in the right or left margin to turn a page.</li>
|
|
<li>Use finger swipes on a touch device.</li>
|
|
<li>Use a progress bar at the bottom of the screen to jump across the page range.</li></ul>
|
|
<p>
|
|
There is an image strip at the bottom of the page with thumbnails of all figures and tables in the article so that you can pop up an earlier figure/table and then close it in an instant without losing your place in the article. This same feature works with inline figures, tables and citations as well. PubReader has a number of other features to improve your reading experience, which you will discover as you use it in <a href="//www.ncbi.nlm.nih.gov/pmc/">PMC</a>. You can read more about the PubReader view at <a href="//www.ncbi.nlm.nih.gov/pmc/about/pubreader/">//www.ncbi.nlm.nih.gov/pmc/about/pubreader/</a> or you can try it directly by clicking on the new "PubReader" link for an article in a PMC search result list. The PubReader presentation only works in relatively recent versions of Web browsers. See the list of <a href="//www.ncbi.nlm.nih.gov/pmc/about/pr-browsers/">supported browsers</a>.
|
|
</p>
|
|
|
|
|
|
<p>
|
|
We have some ideas of features we would like to add over the coming months and we would especially welcome your ideas for improving PubReader. To send feedback click on "Write to the Help Desk" in the footer of the <a href="//www.ncbi.nlm.nih.gov/pmc/">PMC</a> homepage.
|
|
</p>
|
|
|
|
|
|
<h2>
|
|
The Technical Details
|
|
</h2>
|
|
|
|
<p>
|
|
The PubReader view is implemented in the same way as the traditional PMC article display, only using features and functions that are available in the latest versions of the underlying technologies, HTML5 and CSS3. To create the PubReader display, we start with the XML version of an article and use XSLT to convert it to an HTML document. Then we add in CSS and Javascript to implement the formatting, paging, navigation, and text reflowing. The entire article is loaded into a Web browser as a single HTML page. The browser handles paging and other functions locally, giving the flexibility described above without sacrificing efficiency and speed.
|
|
</p>
|
|
|
|
<p>
|
|
The CSS and Javascript code used to create the PubReader display is available from the NCBI repository on GitHub: <a href="https://github.com/NCBITools/PubReader">https://github.com/NCBITools/PubReader</a>. Anyone can use or adapt this code to display journal articles or other content that is structured as an HTML5 document.
|
|
|
|
</p>
|
|
|
|
</div>
|
|
<p class="articleParagraph">
|
|
|
|
|
|
|
|
By
|
|
|
|
|
|
David Lipman<br />
|
|
National Center for Biotechnology Information<br />
|
|
|
|
|
|
|
|
|
|
</p>
|
|
</div>
|
|
<div class="footer">
|
|
<p class="footerLeft"><span class="footerissn"><strong>ISSN 2161-2986 (Online)</strong> Content not copyrighted; freely reproducible.</span><br/>
|
|
<a href="/">National Library of Medicine</a> 8600 Rockville Pike, Bethesda, MD 20894
|
|
<br/>
|
|
<a href="//www.nlm.nih.gov/socialmedia/index.html">Connect with NLM</a>,
|
|
<a href="//www.nlm.nih.gov/web_policies.html">Web Policies</a>,
|
|
<a href="//www.nlm.nih.gov/careers/jobopenings.html">Careers</a>,
|
|
<a href="//www.nlm.nih.gov/accessibility.html">Accessibility</a>,
|
|
<a href="//www.usa.gov/" id="anch_34">USA.gov</a>,
|
|
<a href="//www.hhs.gov/vulnerability-disclosure-policy/index.html">HHS Vulnerability Disclosure</a>
|
|
<br/>
|
|
|
|
<a href="//www.nih.gov/">NIH</a>,
|
|
<a href="https://www.hhs.gov/">HHS</a>,
|
|
<a href="//www.nih.gov/institutes-nih/nih-office-director/office-communications-public-liaison/freedom-information-act-office">FOIA</a>,
|
|
<a class="supportLink" href="//support.nlm.nih.gov?from=" target="_blank">NLM Support Center</a>
|
|
|
|
</p>
|
|
|
|
<p class="footerRight">
|
|
<strong>Last updated:</strong> 18 July 2013</p>
|
|
</div>
|
|
</div>
|
|
<map id="nlm_masthead_113" name="nlm_masthead_113">
|
|
<area shape="rect" alt="NLM Technical Bulletin" coords="1,15,396,45" href="//www.nlm.nih.gov/pubs/techbull/tb.html" title="NLM Technical Bulletin" />
|
|
<area shape="rect" alt="National Library of Medicine" coords="0,47,203,62" href="//www.nlm.nih.gov/" title="National Library of Medicine" />
|
|
<area shape="rect" coords="207,47,396,62" href="//www.nih.gov/" alt="National Institutes of Health" title="" />
|
|
</map>
|
|
<!--*****************************Content end*******************************-->
|
|
<script src="/scripts/support.js"></script>
|
|
<script src="/core/nlm-notifyExternal/1.0/nlm-notifyExternal.min.js"></script>
|
|
</body>
|
|
</html>
|
|
|