floating point

A recent trend in web design is to turn off underlining for links, relying purely on the color changes to tip off readers that they’re links. While I agree that this often makes for a more attractive page, many designers end up choosing colors for link text that are difficult for colorblind folks like myself to tell apart from the surrounding text.

After being frustrated by this for years, I finally came up with a solution: use a user style sheet to keep underlines on for all links.

First, install the Firefox extension Stylish. (There are ways to use user style sheets without Stylish on Firefox, and on other browsers, but Stylish gives a nice user interface for managing them.) Restart; there’ll be a new icon in the status bar at the bottom of your browser window. Select “Manage Styles…” from the menu that pops up from it, and write a new style containing

:link, :visited { text-decoration: underline ! important }

Reload the page, and voila: all links are underlined!

(While all I did was install an extension somebody else wrote and copy-and-paste a line from this list of useful user styles, I was surprised to not find anything about this when Googling various phrases involving “colorblind”, “color blind”, “colourblind”, “colour blind”, etc. Hopefully this post can help future color-deficient folks solve this problem.)