Introducing Legiblii
A Chrome extension to improve readability of documents on Westlaw and Lexis
When it comes to reading on Westlaw and Lexis, I have two small but longstanding pet peeves:
The line lengths are not optimized for today’s wider monitors and larger resolutions, and the main text often stretches from one side of the screen to the other. These long lines make it harder to find the beginning of the next line, disrupting my reading flow.
The frequent bright blue hyperlinked citations distract me from the actual content of the opinions.
Together, these design choices make legal research more of a strain than it has to be. Luckily, it turns out that both of these things can be fixed with just a couple lines of code:
If you’re interested in the design theory or the code behind the extension, the rest of this post will go into why and how I made Legiblii.
If you’re not interested in any of that stuff, here’s the Chrome extension so you can try it out without reading further.
On Line Lengths
The Web Content Accessibility Guidelines note that the widths of blocks of text should be no more than 80 characters or glyphs, reasoning that “[f]or people with some reading or vision disabilities, long lines of text can become a significant barrier.” It’s also just a generally good design practice, since lines that are too long can cause any reader to lose their place when jumping from one line to the next.
In The Elements of Typographic Style, Robert Bringhurst notes the usual standard of 45 to 75 characters per line. Westlaw and Lexis documents often exceed double that guideline, making for a jankier experience than I’d like.
To fix this, Legiblii adds the following lines of CSS to Westlaw webpages:
div#co_document {
max-width: 800px;
margin: 0 auto;
}
And the following lines of CSS to Lexis webpages:
section#document-section {
max-width: 800px;
margin: 0 auto;
}
The first line (aka the “selector”) sets the scope of the rule, limiting all changes to just the section in which the main text appears. The max-width
property tells the browser to cap the line lengths for this section, and the auto
value for the margin
property tells the browser to distribute the resulting additional space equally, thereby centering the document.
The law librarian in me especially likes how this adjusted format brings the document closer to its print roots, resembling the wide margins of law reviews and the U.S. Reports.
On Hyperlinks
I’m a bit more conflicted on hyperlinks — while I love the ability to identify and click on any relevant link as I read, I find the bright blue text makes it harder to absorb the actual content of the documents. While hyperlinks can play an important role in helping the reader skim the text, they can also increase your cognitive load and draw your attention away from the important bits of the text.
For the purposes of reading on Westlaw and Lexis, I’d like to be able to recognize hyperlinks without having the color distract from my reading experience. After testing out different colors, I settled on what CSS calls “lightslategrey” — a blueish gray that wasn’t too distracting but was also legible and recognizable as a link.
Here’s the added CSS rule on Westlaw:
.co_paragraphText a:link, .co_paragraphText a:visited {
color:lightslategrey;
}
And here’s the added CSS rule on Lexis:
#document-content a:link, #document-content a:visited {
color:lightslategrey;
}
The selector here just applies the rule to links within the main text of the documents, and the rule just changes the color of the links.
Legiblii
Since all the Chrome extension does is apply the above CSS rules to Westlaw and Lexis pages, there doesn’t seem to be any noticeable difference in loading speeds.
If you find the design changes helpful, feel free to install Legiblii. I’ve limited the CSS changes to just the line length and hyperlinks on just these two databases, but if you have any design pet peeves on these or other legal research sites, feel free to leave a comment below.
It looks like you're US-based but if you refer to Commonwealth case law on occasion, do check out this other legal extension: https://clerkent.huey.xyz
This is so great! An excellent tool that addresses an important issue. I would be interested in a post that covers the experience of coding and creating a browser extension, as it's something I've never played with but probably should.