At last weekend’s “Publishing Text in a Digital Age” workshop, there was (understandably!) a lot of discussion about the potential benefits of born-digital editions over traditional print volumes. One thread that came up again and again was the legacy of the codex and book design in web editions. E.g. Should digital editions imitate book pagination? Does a table of contents have a place in a search-friendly web version? An index? This sort of thing.
This conversation reminded me of an experiment with page layout that I used for my (always in-progress) Tin Latin Reader. I call it jPharr—a portmanteau of jQuery and Pharr—as in Clyde Pharr, from whose student reader of the Aeneid I took the idea.
Pharr designed the layout each page to include the following three sections from top to bottom: 1. the text of the poem, 2. vocabulary, and 3. assorted notes on the texts.
The pros and cons of Pharr’s design are concisely presented in E.F. DeHoratius’ review (Classical Journal 96 , p. 211) of B.W. Boyd’s edition of Aeneid 10 and 12—a book designed (literally) to supplement Pharr’s coverage of the first six books:
“Proponents of Pharr’s edition praise its compactness of text, notes, and vocabulary, formulated to ease the inexperienced or secondary-school reader into Vergil’s extensive poetic lexicon. Detractors of Pharr’s text, however, claim that the very visible vocabulary system that garners so much praise provides those inexperienced readers for whom it was expressly designed and with whom it is so often used too great a crutch to lean on.”
jPharr is a page layout that imitates a traditional book. Yet it does so in a way that allows the biggest design criticism to be overcome while losing no utility. It is an overall conservative move from print to web, in the sense that it has only one major change. At the same time, this one change gives the student reader a powerful sense of control over their learning, i.e. how much vocabulary help, how much grammar help they do or do not need.
Pharr saw his own method as a pedagogical (and psychological!) improvement, writing that “the old system involves not merely a great waste of time, but it necessitates continual interruption in the continuity of the student, hindering or even preventing concentration upon the work at hand and thus making for bad mental habits.” (C. Pharr. 1998. Vergil’s Aeneid: Books I-VI. Waukonda, Il., p. x)
jPharr adds a bit of refinement to this progress, allowing for less interruption and more concentration because it removes distraction, or even just the temptation of distraction, when necessary. Where Pharr spoke highly of the support material being “constantly before” the student, I’d like to think that he would see the added benefit in having the material instead constantly available to student. For this reason, I’d like to think of jPharr as a simple yet successful experiment.
To add this functionality to your own web page:
- Download the latest version of Multi Open Accordion from https://code.google.com/p/jquery-multi-open-accordion/downloads/list. Unzip and add to your web directory. (Make sure you also put the jQuery and jQuery UI scripts in this directory.)
- Add the following lines to your HTML:
- Place all of the content that you want to be collapsible in a <div> tag with the id equal to multiOpenAccordion:
<div id=”multiOpenAccordion”> … </div>
- Place the title of each section, e.g. “Vocabulary”, in an <h3> tag:
- Place each section you want to collapse in a <div> tag:
<div> … </div>
You can see an example of the proper markup for Sections 3 through 5 under the “Markup” section at https://code.google.com/p/jquery-multi-open-accordion/.
This is only one example of a web layout that imitates traditional book design, while leveraging the technological advantages of displaying content dynamically. Along these lines, I think there are many other interactions and effects in the jQuery UI that could be used in a similar fashion. More experiments to follow!