|
|
||
Customized Web Browsing With Cascading Style Sheets© Copyright Darrell Anderson. I’m middle-aged and my eyesight gradually reflects that with each passing year. Therefore I prefer readable text, meaning slightly larger, not the nonsense tiny stuff that naive web designers use. I have used the 120 dpi resolution going back many years to the mid 90s with Windows NT4. Long before my eyesight started reflecting my age. The Windows “Large Fonts” setting was roughly the equivalent of 120 dpi. With Slackware I use 120 dpi on a 17 inch LCD monitor running a native resolution of 1280 x 1024. Based upon my experience with 17 inch monitors, I suspect with a 1440 horizontal pixels or wider, that the 120 dpi setting is much better than traditional 100 or 96 dpi. I force this resolution in /usr/bin/startx: serverargs="-dpi 120 -ac -nolisten tcp" For those occasions when I boot into run level 4 and use the KDM login manager, I pass the same option in /etc/kde/kdm/kdmrc: [X-:*-Core] ServerArgsLocal=-dpi 120 -ac -nolisten tcp I always boot into X at 120 dpi. After setting the screen resolution, I adjust my desktop font sizes to taste. That means bumping up the font sizes a notch. I use KDE. Without changing the desktop font sizes from the typical default settings, all fonts will be much too tiny at 120 dpi. Therefore this is a two-step process although straightforward. The big challenge with readable fonts is web browsing. All the folks out there who design web pages on 24 inch monitors don’t “get it.” That is, after those web pages are viewed on typical 17 and 15 inch monitors, the fonts become too small for many people to read. A significant portion of the people are not interested in tiny fonts or squeezing more information on a page than can be absorbed by any typical human. As a first step I ensure my default fonts in Firefox are slightly large. In my Firefox user.js, I have the following options: user_pref("font.FreeType2.enable", true); However, those adjustments are only a basic foundation. Those font settings will not override those naive web designers who don’t “get it.” Especially when most sites use cascading style sheets. I create a custom style sheet for web site sites I visit often that use too small text. I use Firefox but the idea should work for any browser supporting individual style sheets. To get this concept to function, I chain (cascade) a series of userContent.css files. I insert the following in every user’s Firefox userContent.css file: @import "file:///home//public//firefox_shared/Chrome/userContent.css"; I share several Firefox configuration files with all of my user accounts. Hence the public location for my primary userContent.css file. In that file I add specific Firefox tweaks but at the top of the file I insert: @import url(userContent-tweaks.css); In userContent-tweaks.css I add the following: @import url(userContent-site-linuxquestions.css); When I decide I want to regularly visit an eyesight-busting web site, I create a site specific style sheet and then add the style sheet to userContent-tweaks.css. By chaining (cascading) my style sheets in this manner I need not muck around with my primary userContent.css file. In each user-content-site-xyz.css file, I insert the tweaks I need to render the specific web site the way I want. Because I am no expert on cascading style sheets, usually I have to experiment until I find the combination I want. For an example, my userContent-site-linuxquestions.css looks like this: @-moz-document domain(linuxquestions.org) { With custom style sheets for the sites I visit regularly, I no longer suffer from small fonts. I significantly notice the difference when I visit these same sites from a different computer and web browser and I have to view the sites as originally designed. This approach also works quite well in Windows. One last note. I use the Zoomy extension in Firefox, which allows me to manually increase page fonts. Finis. |
||