Webby Books: Interactive Content Within a Universal Design

Published in:

A National Symposium

November 16–17, 2018

Stetson University
Miami, Florida

What is a Webby Book?

The legal casebook — staple reading for law students for over a century — has hardly changed in format over that period. Despite the rise of the internet, which has revolutionized the ways that most of us now obtain information, the casebook remains largely unchanged. While legal publishers tout their e-books as innovations, these merely mirror in electronic form what is already available in hard copy. Indeed, these e-books still use hard copy page numbers!

This is selling both students and professors short. The internet makes it possible for e-books not merely to replicate hard copy books, but to go further and provide a functionally superior teaching medium. As a law professor with an interest in computer software, I have responded to this challenge by founding, building, and designing webby-books.com, which publishes Webby Books (a.k.a. web e-books): law books as websites.

A Webby Book is a textbook or casebook re-envisioned as a self-contained website. With a dedicated Webby Book for each class, the book is transformed into a forum for active and interactive learning. Webby Books work well on all devices with an internet connection, including tablets and smartphones. They are cost efficient and environmentally friendly. And they obviate the need for students to carry bulky and heavy books across campus!


Students and professors can comment on and ask questions about any passage in the text simply by adding a comment right by the text itself. A simple bubble indicates to other readers that a comment has been left there; clicking on that bubble enables other readers to read the comment and respond to it. This allows other students and the class professor to join the discussion. Each comment also triggers an email to the whole class, with a hyperlink to the comment, so everyone can keep up and remain fully informed about the discussion. Readers can find and join in the conversation just by clicking on the hyperlink.

The embedded discussion aids the professor in gauging student comprehension of the material. It also makes it easier for the professor to address student questions because they are posed right alongside the relevant text.

Multiple-choice quizzes for every chapter provide opportunities for formative assessment of students, while numerous longer questions (including both discursive questions and hypotheticals) can be used for practice essays or (as I use them) as the basis of classroom teaching. Broader discussion takes place in a built-in forum, where participants can hyperlink to specific paragraphs in the text. (Such hyperlinks to paragraphs may also be used in emails, handouts, and assignments.) Again, all readers receive an email whenever someone has started — or made a new contribution to — a forum discussion. This email contains a hyperlink that, when clicked, will take readers straight to the relevant contribution.

There is an interactive quiz about each chapter, which provides immediate formative assessment for the student. Webby Books do not store the results of quizzes, so professors never know of a student’s score, and there is no limit to the number of times a student may take each quiz. For readers who use the Chrome browser, it is even possible to turn a Webby Book into an audio book. This has proved useful to readers who like to study while driving.

Perhaps the most popular feature of Webby Books, however, is the infinitely-scalable flowcharts and tables that summarize different areas of the law. These charts can be viewed in any browser, because Webby Books do not use Adobe Flash.

Budgetary and page-size constraints that limit the usefulness of charts in hard-copy publications do not exist online, so these diagrams are in full color and are of whatever size is appropriate. Moreover, every graphic can be enlarged almost infinitely without loss of definition, allowing students not only to walk through issues, but also to focus on different elements as appropriate. Every table and chart may be downloaded and printed out for hard-copy usage. Many students say these charts form the basis of their exam preparation.

Principles of Universal Design

None of these features would be enough, however, if Webby Books were available only to those with good vision and motor control. One of the most significant features of Webby Books is that they are built according to the principles of universal design (UD). This means that Webby Books cater for readers with a variety of disabilities, including blind readers and those with dyslexia or color-blindness, and so meet the requirements of the Americans with Disabilities Act (ADA).

According to the Center for Universal Design (CUD, 1997) at North Carolina State University, universal design is: “The design of products and environments to be usable by all people, to the greatest extent possible, without the need for adaptation or specialized design.”

The CUD has established seven principles of UD to provide guidance in the design of products and environments, namely:

  1. Equitable use: the design is useful and marketable to people with diverse abilities.
  2. Flexibility in use: the design accommodates a wide range of individual preferences and abilities.
  3. Simple and intuitive: use of the design is easy to understand, regardless of the user’s experience, knowledge, language skills, or current concentration level.
  4. Perceptible information: the design communicates necessary information effectively to the user, regardless of ambient conditions or the user’s sensory abilities.
  5. Tolerance for error: the design minimizes hazards and the adverse consequences of accidental or unintended actions.
  6. Low physical effort: the design can be used efficiently, comfortably, and with a minimum of fatigue.
  7. Size and space for approach and use: appropriate size and space is provided for approach, reach, manipulation, and use regardless of the user’s body size, posture, or mobility.

As will now be explained, Webby Books score highly in meeting these requirements.

Colors and Fonts

Perhaps the first feature to strike any new user of a Webby Book is its color scheme. Unlike so many websites, Webby Books do not have white backgrounds. This is deliberate. A white background means that naked light is being shone direct from the reader’s device into his or her eyes. No-one would normally choose to do this, and it is the major reason for many people, who work on computers all day, complaining that they suffer from headaches and migraines.

While brief visits to a website with a background should do no lasting harm, Webby Books are intended to be used for hours at a time by students and professors. To mitigate the problem caused by backlit screens shining white light direct into the reader’s eyes, Webby Books have a color scheme with a default background color of beige. This drastically reduces the amount of glare experienced by each reader.

This color has also been shown to offer significant benefit to some readers with dyslexia. For those with more severe dyslexia, Webby Books offer another option. Developer Abbie Gonzalez has created a special font, designed to assist readers with dyslexia, called OpenDyslexic. Webby Books have been designed so that, if a reader simply installs the OpenDyslexic font on his or her device, then any Webby Book will use that font automatically instead of the Webby Book’s default font.

For readers who would like to reduce glare to an absolute minimum, Webby Books offer another setting that utilizes a “reversed” color scheme. This means that the background is black and the text is in lighter colors. This is a typical choice for tech professionals. Additionally, Webby Books also offer a grayscale option, where all the colors are transformed into shades of gray. This can be particularly useful to readers who have certain types of color-blindness.

Finally, Webby Books offer a simple means of enlarging or decreasing the size of the font. While this may be done using the standard technique of pressing Ctrl + + or Ctrl + -, that method may mean that the Webby Book is enlarged in a way that causes some elements to disappear off-screen, and so necessitate inconvenient scrolling. The built-in font enlargement and reduction buttons, by contrast, change only the size of the font, and do not change the overall on-screen dimensions of the Webby Book.

Special Controls

Another feature that makes Webby Books universally accessible is that they can be navigated entirely by using a keyboard instead of touch or a mouse. This means that those using screen readers and those without the fine motor control necessary to use a mouse can still read a Webby Book.

The W3C Working Group (W3C, 2018) has established a set of universal conventions that set out specific functions to be assigned to particular keys — especially the tab, arrows, space bar, and enter keys. Webby Books have been built to adhere closely to these specifications.

The same document also spells out what code, invisible to sighted readers, should be used to have websites “talk” to screen readers to explain to a user in words what a sighted reader would discern from visual clues. Again, Webby Books are careful to adhere to these best practices. Together, the assignment of keyboard controls and the use of special, invisible code enables blind users and others who do not use touch or a mouse for navigation to do such things as complete the signup form, set or change a password, navigate the menu and table of contents, peruse the FAQs, take a multiple-choice test, and comment on the text or in the discussion forum. It is even possible for such users to run a search, with the list of hits being read out by the screen reader software.

Access and Shortcuts

Add commentClick or touch paragraph, then press c.
See comment(s)Click or touch comment bubble icon.
Close comment(s)Press Escape, or click or touch comment bubble icon.
Go to a footnoteClick or touch footnote number in text.
Return to the text from a footnoteClick or touch footnote number in sidebar or footer.
Go to the next pageClick or touch arrow on right, or swipe left, or click or touch breadcrumb at top or bottom of page.
Go to the previous pageClick or touch arrow on left, or swipe right, or click or touch breadcrumb at top or bottom of page.
Go to a specific chapterIn the Table of Contents in the left-hand sidebar, clicking or touching an arrow next to the title of a Part will make the titles of Chapters within that Part appear.Clicking or touching Part or Chapter titles themselves will take you to a list of all the pages within that Part or Chapter.
Go to a specific pageIn the Table of Contents in the left-hand sidebar, clicking or touching an arrow beside a Chapter title will make the titles of pages within that Chapter appear.Clicking or touching a page title will take you to the page itself.
Obtain the URL for a specific paragraphHover over or touch the paragraph, then right-click on or touch the ¶ symbol, then copy the link.
Open a hyperlink in new tabMiddle-click on the hyperlink, or press Ctrl or Cmd while left-clicking on it.
Highlight a passageThis requires an extension for your browser:Firefox: Persistent Highlighter.Chrome: either Super Simple Highlighter or Noted.Opera: first install the Download Chrome Extension, then choose one of the Chrome extensions.
Change the color schemeClick or touch the Grayscale and/or High Contrast buttons at the top of the right-hand sidebar.
Change the font sizeClick or touch the font icon buttons at the bottom of the right-hand sidebar.


Center for Universal Design (1997). The Principles of Universal Design. North Carolina State University. Retrieved from https://projects.ncsu.edu/ncsu/design/cud

Gonzalez, A., OpenDyslexic: A Typeface for Dyslexia. Retrieved from https://www.opendyslexic.org

W3C (2018). WAI-ARIA Authoring Practices 1.1. Retrieved from https://www.w3.org/TR/wai-aria-practices/

Webby Books. Law Books as Websites. Retrieved from https://webby-books.com

Go to the table of contents for:
Spring 2019: Transforming Teaching Through Active Learning