467235 - avg.com - When "Minimum font size" is large (e.g., 12 or 14) the page is distorted.

Status: RESOLVED WORKSFORME

(Web Compatibility :: Site Reports, defect, P3)

Description

[Ocie Hudson]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.0.4) Gecko/2008102920 Firefox/3.0.4
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.0.4) 

When I use the Tools > Options > Content panel - Fonts & Colors Advanced > Fonts dialog to specify a "Minimum font size", displayed text will begin to distort the web page (unless the "Minimum font size" is set to "None").  As shown on the attached screenshots, the larger the specified Minimum size, the larger the amount of distortion.  If the Minimum size is at least 14, it can even render parts of the page virtually unreadable and inacessable.  The page might be rendered with some parts of it overlapping or completely covering others. (Note: the option "Allow pages to choose fonts, ...." is enabled.)

However, some pages on any given website may not be adversely affected while others are, and whether there is distortion does not seem to be affected by the size of the window or of the tab.  

On the whole, the distortion appears to arise from simply replacing the original letters, digits and symbols (that comprise text) with ones of the same font but a larger size, without taking any other page elements such as the use of columns or the placement of images and graphics into account.  In particular, it seems that the total area of the original page is maintained and is not allowed to increase, although the larger size for the text implies that it will occupy more space.  As a result, text that is near the bottom of the page may be rendered as covering some of the page that is above it, and an interior column of text may be overwritten by a column of text to its right.


Reproducible: Always

Steps to Reproduce:
1. Use Tools > Options > Content: Fonts & Colors Advanced to display the Fonts dialog.  Specify a "Minimum font size" of 14 or more.  I can't recall whether you must restart Firefox for it to take effect, but I don't think that you do.

2. Have Firefox 3.0.4 fetch http://www.avg.com

3. If you don't see what I see, then you need to consult an opthamologist. :-)

Actual Results:  
Please view the attached screenshots.

Expected Results:  
It should render the page without distorting the contents.

Firefox is running the default theme.  The Image Zoom and View Image extensions are installed and compatible with FF 3, but I seldom use either one.  A screenshot of the about:buildconfig is attached along with four others.

The computer's mainboard is an Asus A7N8X-VM with an nVidia nForce 2 chipset, an AMD Athlon XP 2400+ CPU @ 2 GHz, and 2 GB DRAM (333 MHz).  The display is a Hewlett Packard LCD monitor (model w1907) using VGA input from the mainboard.

Comment 1

[Ocie Hudson]

Attachment: AVG.COM displayed with Minimum font size = None

Comment 2

[Ocie Hudson]

Attachment: AVG.COM displayed with Minimum font size = 10

Please read the note on the screenshot.

Comment 3

[Ocie Hudson]

Attachment: AVG.COM with Minimum font size = 16

Please read the note on the screenshot.

Comment 4

[Ocie Hudson]

Attachment: AVG Home Security Product Comparison (FF 3.0.3 not sure of font size)

The note on the very top right asks ".... Your fault or Firefox 3.0.3?" because I sent it to AVG tech support.  I don't recall the value of the "Minimum font size" at the time but it was probably 16.  The same page displayed at that font size today is mangled, but you can see a little more of the column for "AVG Internet Security" than with the one accompanying this note.

Comment 5

[Ocie Hudson]

Attachment: Screenshot of Firefox 3.0.4 about:buildconfig ... if that means anything to you

Comment 6

[Mardeg]

From the Accessibility Extension report on avg.com: http://tinyurl.com/avgpage
Violoation: Set font sizes using relative measurements (not px, pt, in, cm, mm). 
Occurences: 190
Class: Text Sizing

This is a valid Tech Evangelism bug, AVG needs to fix the code on it's page to make it more accessible to things like a larger minimum font size.

From your report "some pages on any given website may not be adversely affected while others are" you will likely find the ones that are make similar coding mistakes, and only the developers of those sites can fix that, sorry.

Here's the accessibility extension: https://addons.mozilla.org/en-US/firefox/addon/5809
The report was generated using "beta rule set"

Comment 7

[Ocie Hudson]

Thank-you, Mardeg, I will advise AVG tech support about this Bugzilla web page.  I sent them two screenshots of the problem on their website but they replied that they could not reproduce it.  I was not aware at the time that the "Minimum font size" was affecting it, only after I began investigating it.  I see it here and there on other websites, but not many.

Comment 8

[Tyler Downer [He/Him]]

Ocie, please read http://www.mozilla.org/projects/tech-evangelism/site/procedures.html for proper site evangelism contacting. Are you willing to take this?

Comment 9

[Ocie Hudson]

"Tech Evangelism" is an aspect of Bugzilla that I've known nothing about until now.  I have read the referenced procedures page.  I am not sure what you mean by asking whether I am willing to "take this" -- just this website? 

Before being apprised of the T.E. procedures today, yesterday I sent an e-mail to AVG tech support, headed by my current AVG software license number, attention "webmaster" (I know they have one, but I don't have the URL or e-mail address).  It might have been a bit wordy but polite, factual and encouraging.  For better or for worse, I included the URL for this bug report (467235) and the entire content of Comment #6.  

If their webmaster responds, or doesn't respond, then I will keep T.E. apprised and I suppose that I could follow the procedures to update the status of the bug accordingly.  But I think that Mardeg is in charge of it right now.

Beyond that, I must think it over and look at more of the links for T.E..  Since  my eyes are not so young as they were (I'm 60 years old), visual display of web pages, in particular, has become a personal concern.  I have also downloaded and installed the Accessibility Extension.  It seems a bit formidable to someone who has not used it. :-)

Comment 10

[Mardeg]

I think you've done very well Ocie, and the email you sent covered enough of the points the "template" example letter would, and the fact that you are a customer of AVG is also mentioned as beneficial in the procedures link.
I linked to the accessibility extension just for reference, though you can certainly use the Reports -> Accessibility Issues (beta rule set) menu of it to file similar reports on other sites - "View Summary" in that dialog to get a window that you can File -> Save Page As.. to then upload as an attachment to a bug report.

I set the target month for this to be resolved as Jan 2009, and priority to P3 as "Evangelizing the site will help develop helpful documentation that can be leveraged in helping other sites" is possible given mention of other sites that need help fixing this.

If the AVG web developers are reading this, the main CSS file with the non-relative font-size units of "px" is:
http://www.avg.com/stc/tpl/crp/css/full-home.css
Here is a link talking about proper units for font sizing:
http://www.w3.org/QA/Tips/font-size#goodcss
and here is a link you can use to justify spending your time fixing this:
https://developer.mozilla.org/en/Using_Web_Standards_in_your_Web_Pages/Benefits_of_using_web_standards#section_15

Comment 11

[Bastiaan Jacques]

This same problem affects a huge number of websites. In my estimation, website owners will not change their ways because there are simply not enough users who care about accessibility. I'll point out that this seems to be the only bug on this subject and that it is filed as 'minor' importance as indications that even Mozilla does not seem to attach much relevance to accessibility.

But Firefox could do something to mitigate the problem: it could zoom pages depending on the font size (instead of increasing *just* the font sizes). That way, the layout will remain intact, regardless of website owners' best efforts. For example, if a website requests a font size of exactly half that of the minimum font size, Firefox could scale the page by 200%. This is exactly what the NoSquint extension does. See https://addons.mozilla.org/en-US/firefox/addon/2592/

Comment 12

[Ocie Hudson]

@Bastiaan Jacques:  For what it is worth, I use the Image Zoom extension, but I will take a look at NoSquint.  Unfortunately, although magnifying a page usually makes it more readable, magnification is accomplished by treating the page (or just the text) as an *image* instead of a mixture of text and of images.  That has various undesirable consequences.  

The primary consequence is that I cannot highlight text and copy it to the Windows Clipboard, since it is now an image.  I don't know about you, but I often copy text to the clipboard to paste it into a message, or sometimes I save it to a file.  In particular, I cannot copy URLs to the clipboard, and clicking on them with the Left Mouse Button usually does not work (I don't understand why occasionally it does).  The context menu is usually not available with the Right Mouse Button, and I might believe that there simply isn't one until I view the page without magnification and discover that one is available.  I cannot use the Dictionary Search extension while the page is magnified.

Ordinarily, I can enter data into boxes on the page, but the results are unpredictable.  Curiously, log-in dialogs and e-commerce forms are usually created with much larger point-sizes and ample space in which to enter the data, so I usually don't have to magnify them.  Also, a "button" that is associated with a JavaScript routine usually functions.  Also, drop-down forms which are reduced to one character usually remain that way regardless, until I launch Internet Explorer to access the page.

THE SUGGESTED SOLUTION is that website developers should use "relative sizes" instead of fixed sizes for elements.  What I would like to know is whether it would be feasible for the Firefox rendering engine to convert fixed sizes into relative ones.

Comment 13

[Bastiaan Jacques]

(In reply to comment #12)
> @Bastiaan Jacques:  For what it is worth, I use the Image Zoom extension, but I
> will take a look at NoSquint.  Unfortunately, although magnifying a page
> usually makes it more readable, magnification is accomplished by treating the
> page (or just the text) as an *image* instead of a mixture of text and of
> images.  That has various undesirable consequences.

I have not noticed that issue, but I'm not using the Image Zoom extension. Simply using Firefox's internal zoom produces selectable text on my machine.

Comment 14

[Ocie Hudson]

When was "internal zoom" added to Firefox?  It is possible that I might be using the "internal zoom" sometimes and the Image Zoom extension at other times, which could account for differences in behavior that I observe.  For example, sometimes I can highlight and copy text to the clipboard after using the View > Zoom sub-menu (or the Ctrl+ keypress combinations).  Sometimes I can't, and perhaps that is because I've used the context menu Zoom sub-menu options, although that feature ordinarily only shows while the mouse cursor is on an image.  I am not aware of which is now native to Firefox and which is the effect of enabling the extension (or whether using one disables the other).  

I haven't tried No Squint yet, because it seems likely that I must at least disable Image Zoom before I install No Squint.  I'll try that out today.

One thing is sure, though, that using either View > Zoom or the context menu options rarely affects rendering of the page.  If a string of text with a hyperlink is overlaying a text data entry box, making them look bigger doesn't change the fact that the box is inaccessible, because you can't put the mouse cursor in it without using the hyperlink.

Regardless, thank you for your time and attention to this matter.  Remember, though, that my original complaint is that specifying a minimum font point-size with Tools > Options > Content > Fonts & Colors - Advanced : Fonts often causes distortions of the text and/or of its placement in the context of column borders, adjacent images, drop-downs, buttons, etc.  Using Zoom generally does increase legibility, so it might be the preferred alternative to specifying relatively large font point sizes.  Although, I enable web sites to specify their own, so my preferences usually do not affect the rendering of a web site page.  It is kinda weird, though, when the preferences don't affect some pages but others from the same web site are affected.

Comment 15

[Karl Dubost💡 :karlcow]

http://www.avg.com/us-en/homepage
This seems seems to be working for me.