| Author |
Topic: How to override fixed font sizes on web pages |
Wiz Feinberg
From:
Mid-Michigan, USA
|
Posted 2 Jan 2007 5:44 pm |
|
Background
The web as we know it is an outgrowth of the print media, like magazines and newspapers, all of which are printed as designed and are unalterable by the reader, without the use of a magnifying glass. Sometimes, the company decision makers, webmasters, or independent owners who design websites think of them as online magazines, and make the incorrect choice to use fixed font sizes using Cascading StyleSheet (CSS) rules. This might be because the page looks good to them with their monitor screen-size and desktop font setting and the web browser they used when designing and testing it, or because they think that by fixing the font sizes at absolute pixel numbers the various parts of a page can be forced to line up exactly as visualized.
Sometimes template companies use fixed font sizes in the templates they make available to the public. Many of these designers and Webmasters see the results on a monitor that displays the preset fixed fonts properly, or have very good eyesight, and never think ahead that some of their intended audience may not be able to resolve, or display those fixed fonts satisfactorally. Not all monitors have the same resolution setting, nor do all desktops use the same system font. This causes huge variations in how a web page is rendered on different monitors and operating systems.
Most web browsers are designed to render font sizes based on the specifications of each web page. Many knowledgable Webmasters use relative font sizes in their design rules, allowing each visitor to alter the fonts using the method they are accustomed to using. If no font is specified each browser maker decides on how to render it's default font size, measured in pixels. All browsers have some means of setting a general font size control, like x-small, small, medium, large and x-large (Internet Explorer), or by setting a zoom size in percentage points. However, when a fixed font size is specified on a web page some browser makes and models do not provide an easy means of overriding that setting. Others always provide a simple override method.
The new SGF BB Code font size problem
The default setup scripts for this version of PhP-BB uses fixed font sizes for various parts of the Posts and announcements. This will be corrected in the very near future, when b0b has time to look over the CSS scripts. In the meantime, here are some ways you can override the fixed font settings in the current crop of Internet Explorer, Firefox and Opera browsers.
How to override fixed website font sizes in the main browsers in use today
Firefox
Hold down the Control key and tap the + key to enlarge, or the - key to reduce the font size. You can also use the Control key and the scroll wheel to change font sizes. Forward scroll reduces and backward enlarges fonts in Firefox.
Internet Explorer 6 and under
Hold down the Control key and roll your scroll wheel forward to enlarge, or backward to reduce the font size. This is opposite to the direction used in Firefox browsers. If you don't have a scroll-wheel mouse you will have to use Accessibility Options to override CSS font size rules. From Internet Explorer click on Tools > Internet Options > Accessibility button > check the box to "Ignore font sizes specified on web pages," click Apply and Ok.
Internet Explorer 7
IE 7 allows you to use a wheel mouse the same way as Mozilla Firefox does it, to override preset font sizes. Scroll the wheel forward to enlarge, or backward to reduce the font size. IE 7 also has a font size override in the statusbar, on the bottom right. You can click on the magnifying glass icon to cycle between 100%, 125% and 150%, or click on the little down-arrow next to the size indicator and select anywhere from 50% to 400% magnification.
Opera
Opera browsers respond to a scroll wheel exactly like Internet Explorer does. You can also tap just the + key to enlarge, or the - key to reduce the on-page font size by 10% per tap.
Someday all websites and forums will be designed with relative font specifications, or all browsers will settle on a common method of overriding preset font sizes. Until then my tips will save your eyes and help you avoid aggravation.
_________________
"Wiz" Feinberg, Moderator SGF Computers Forum
Security Consultant
Twitter: @Wizcrafts
Main web pages: Wiztunes Steel Guitar website | Wiz's Security Blog | My Webmaster Services | Wiz's Security Blog
Last edited by Wiz Feinberg on 4 Jan 2007 8:01 pm; edited 1 time in total |
|
|
 |
Al Marcus
From:
Cedar Springs,MI USA (deceased)
|
Posted 2 Jan 2007 8:10 pm Font Sizes
|
|
Wiz-I tried your explanation of the Fonts and they do work!
But I notice when I increase the size and readablity, it makes the whole page bigger, then I have to scroll right or left to get it all in to read. ...al:)
_________________
Michigan (MSGC)Christmas Dinner and Jam on my 80th Birthday.
My Email.. almarcus@cmedic.net
My Website..... www.cmedic.net/~almarcus |
|
|
|
Wiz Feinberg
From:
Mid-Michigan, USA
|
Posted 4 Jan 2007 8:17 am Re: Font Sizes
|
|
| Al Marcus wrote: |
Wiz-I tried your explanation of the Fonts and they do work!
But I notice when I increase the size and readablity, it makes the whole page bigger, then I have to scroll right or left to get it all in to read. ...al:):) |
When you enlarge fonts on a web page that is designed with fixed positioning of text in relation to other elements on the page, like images or text boxes, the consequence can be horizontal and vertical displacement of fixed position images or text boxes, or other positioned items. If the text "box" where the text is located was designed to occupy a certain amount of fixed width and the font size is greatly enlarged, it can push the boundaries to the right, causing a horizontal scrollbar.
The solution is for website designers to change the layout to respond to the width as set by the customer, allowing text to wrap when the width is reduced, or to float and wrap around fixed images or text boxes. This is done using what are known as CSS style rules, specifying relative, fluid positioning, using percentages instead of fixed font or text box sizes.
_________________
"Wiz" Feinberg, Moderator SGF Computers Forum
Security Consultant
Twitter: @Wizcrafts
Main web pages: Wiztunes Steel Guitar website | Wiz's Security Blog | My Webmaster Services | Wiz's Security Blog |
|
|
|
Al Marcus
From:
Cedar Springs,MI USA (deceased)
|
Posted 4 Jan 2007 8:27 am
|
|
Wiz-thanks for the explanatin. I understand. But then, I wonder if b0b can use that style on the Forum???...al.
_________________
Michigan (MSGC)Christmas Dinner and Jam on my 80th Birthday.
My Email.. almarcus@cmedic.net
My Website..... www.cmedic.net/~almarcus |
|
|
|
Wiz Feinberg
From:
Mid-Michigan, USA
|
Posted 4 Jan 2007 7:48 pm
|
|
| Al Marcus wrote: |
| Wiz-thanks for the explanatin. I understand. But then, I wonder if b0b can use that style on the Forum???...al. |
b0b has been asked about that already and replied that as soon as he has enough time to sit down and go over the stylesheet rules he will try to convert the forum fonts to percentages instead of pixels or points. You are not the only member who has complained about the fixed fonts and horizontal scrolling problems.
With all new server software conversions there is a period of adjustment and fine-tuning. We should applaud b0b for the work he has done and is yet planning to do, on our behalf. 
_________________
"Wiz" Feinberg, Moderator SGF Computers Forum
Security Consultant
Twitter: @Wizcrafts
Main web pages: Wiztunes Steel Guitar website | Wiz's Security Blog | My Webmaster Services | Wiz's Security Blog |
|
|
|
Al Marcus
From:
Cedar Springs,MI USA (deceased)
|
Posted 4 Jan 2007 8:07 pm
|
|
Wiz-I sure do applaud b0b for all the work he is doing putting all this together .He can take his time as far as he wants. He should just relax a while and let it all shake out,,al.
_________________
Michigan (MSGC)Christmas Dinner and Jam on my 80th Birthday.
My Email.. almarcus@cmedic.net
My Website..... www.cmedic.net/~almarcus |
|
|
|
Wiz Feinberg
From:
Mid-Michigan, USA
|
Posted 16 Jan 2007 9:38 pm Another way to override font sizes on the forum
|
|
If you use Firefox as your web browser I have researched and posted information about creating a custom stylesheet, just for the SGF posts, where you can set your desired font size and color, as well as changing the color and underlining of links. The article is here.
It is based on an article posted on my blog, which goes into great depth about the techniques used to create such a custom stylesheet for Firefox. I will be creating another one for Internet Explorer after researching the methods it uses to override website fonts.
_________________
"Wiz" Feinberg, Moderator SGF Computers Forum
Security Consultant
Twitter: @Wizcrafts
Main web pages: Wiztunes Steel Guitar website | Wiz's Security Blog | My Webmaster Services | Wiz's Security Blog |
|
|
|
Gary C. Dygert
From:
Frankfort, NY, USA
|
Posted 4 Jan 2008 9:29 am
|
|
Another thank-you! This was exactly the question I was going to ask. The font size has been to big up till now, but thanks to you I fixed it.
I love this forum! |
|
|
|
Chip Fossa
From:
Monson, MA, USA (deceased)
|
Posted 4 May 2009 4:13 am
|
|
Wiz,
In FF, the CTRL/Scroll wheel and +/- keys work just as you mentioned.
However, and this has always been a nuisance, in the LATimes Crossword all bets are off with FF. The puzzle grid refuses to get larger (which of course is what I'm after).
But after switching back to IE lately, the LA Xword can be increased/reduced.
Just don't understand why it won't work with FF.
_________________
Chip
Williams U-12 8X5; Keyless; Natural Blonde Laquer. |
|
|
|
Wiz Feinberg
From:
Mid-Michigan, USA
|
Posted 4 May 2009 7:22 am
|
|
| Chip Fossa wrote: |
Wiz,
In FF, the CTRL/Scroll wheel and +/- keys work just as you mentioned.
However, and this has always been a nuisance, in the LATimes Crossword all bets are off with FF. The puzzle grid refuses to get larger (which of course is what I'm after).
But after switching back to IE lately, the LA Xword can be increased/reduced.
Just don't understand why it won't work with FF. |
Chip;
I just visited the LA Times Crossword puzzle of the day, using Firefox, and it most certainly scales up and down when I press CTRL and tap the + or - key on the right numeric keypad. Try that key combination.
_________________
"Wiz" Feinberg, Moderator SGF Computers Forum
Security Consultant
Twitter: @Wizcrafts
Main web pages: Wiztunes Steel Guitar website | Wiz's Security Blog | My Webmaster Services | Wiz's Security Blog |
|
|
|
Chip Fossa
From:
Monson, MA, USA (deceased)
|
Posted 5 May 2009 3:27 am
|
|
Must be something wrong with my keyboard. I just tried it again using both CTRL +/- on the regular keypad and the numeric one, too.
As a matter of fact, nothing on the LA screen increased or decreased in size. But on other FF sites, CTRL +/- works. 
_________________
Chip
Williams U-12 8X5; Keyless; Natural Blonde Laquer. |
|
|
|
