Firefox not displaying websites correctly

[aguila]

Hi all,

it's a minor issue, but still annoying.

While other browsers seem to have no probs with most websites, Firefox doesn't display them correctly.

Example:

Rekonq:



Firefox:


This is one of a lot of examples where Firefox doesn't seem to render the website correctly. I love Firefox and won't drop it, but this is quite annoying sometimes....

I have disabled all addons, but still the same. I have searched about:config, but couldn't find a solution. And also unabling accessability options in Desktop Effects didn't help.

Any takers? I'll be really happy if someone could help me sort this out.

Thank you in advance.

Aguila

[agmg]

Do you have webcore-fonts installed?
Also check if you can find the Tahoma font and install it on your system.
Many websites use it and when it's missing, Firefox replaces it with another sans serif which may not display as it should.

[aguila]

Hi agmg,

thanks for your reply.

webcore-fonts are installed, these include Tahoma.

Also changing the standard font in Firefox settings won't help.

[agmg]

I don't think Tahoma is included in the webcore-fonts package...

My mistake, Tahoma is included in that package...

[aguila]

Hi agmg,

thanks for the link.

Here's the package description of webcore-fonts from Synaptic:

Collection of minimum popular high quality TrueType fonts
Collection of high quality TrueType fonts, default in any MS Windows installation. These are also the main webfonts as specified in microsoft.com/typography
The fonts:
Andale Mono, Arial, Arial Black, Comic, Courier New, Georgia, Impact, Lucida Sans, Lucida Console, Microsoft Sans Serif, Symbol, Tahoma, Times New Roman, Trebuchet, Verdana, Webdings, Wingdings

Tahoma is installed and enabled. Must be some other reason...

Thank you for your thoughts anyway.

[agmg]

Yes, I was mistaken. Edited my post.

You should know that different websites will show differently between browsers. It's a general rule.
Each browser has a different rendering engine, uses different replacement fonts etc.
The problem was much bigger some years ago but seems to be going better.

It's not entirely a browser's fault. Sometimes web developers don't clearly state replacement fonts for their websites or use fonts that only display good in certain browsers or certain platforms (%&*%@ MS).

You could use the fontinfo addon for Firefox to see what fonts are used in a web page.

[kjpetrie]

The problem you see is not the browser's fault: it is the designer's fault. There are two basic length measurements used in web pages - relative and absolute. If these are used inappropriately the page will only fit together on a browser using exactly the same font size and page scaling as the developer did.

You, as the user, set the page scale and font size, although obviously each browser will also come with default values.

Many (I'm tempted to say most) web designers are incompetent. They produce pages which look pretty on their client's browser at their client's screen resolution, treating the job as a page layout job rather than an information-conveying one. They get the contract because most clients are advertising agencies or big corporations who expect to control every aspect of appearance, so they are pleased by what these cowboy designers produce. Real designers who stick to HTML and CSS principles don't get the contract because they produce pages which always make sense, but don't always look the same, which isn't what the corporate bosses want. There is a philosophical contradiction at the heart of the web - it relies on rules written by anarchists! I mean the rules are written to put the viewer in control, because of a deep freedom-loving philosophy. Big corporate bosses think the producer, rather than the viewer, should be in control, so they can't cope with that philosophy at all.

[Just17]

I looked at the two pics and had a hard time finding the differences .....  some very minor font differences it seems.

So, how do I know which is the 'correct' one? .......  which is intended by the designer?

[menotu]

The problem you see is not the browser's fault: it is the designer's fault. There are two basic length measurements used in web pages - relative and absolute. If these are used inappropriately the page will only fit together on a browser using exactly the same font size and page scaling as the developer did.

+1

Beat me to it kjpetrie 

It's often the case that web designers are at fault but frequently the browser is blamed.

[aguila]

I looked at the two pics and had a hard time finding the differences .....  some very minor font differences it seems.

So, how do I know which is the 'correct' one? .......  which is intended by the designer?

Not the most obvious example, I admit. Check the image on the right, you can see that in the Firefox screenshot the "Search" ("Suchen") button is on top of the image, while in Rekonq the rendering is correct.

The website is http://www.umsatztalente.de How does it look like in YOUR Firefox?

I seem to remember that on Windows I didn't have this issue, everything was rendered correctly. Btw, my screen resolution is 1400 x 1050, i.e. any website (only except for the most incompetently designed ones) should not have a problem if the width was defined as an absolute value instead of a relative one.

I will gather some urls and post them here to find out if it's only me (and my settings) or if it's a common issue. Will also see if I can find a solution on the mozilla site.

Oh, I seem to remember that in Firefox on Windows I never had these issues. Unfortunately I don't have access to any Windows machines now....

Thank you all for jumping in.

Aguila

[Just17]

Not the most obvious example, I admit. Check the image on the right, you can see that in the Firefox screenshot the "Search" ("Suchen") button is on top of the image, while in Rekonq the rendering is correct.

The website is http://www.umsatztalente.de How does it look like in YOUR Firefox?

Easy see when it is pointed out 

OK ...... the Search is on top of the image in

Firefox
Chromium
Flock
Konqueror
Midori


not on top of the image (correct) in
Opera
Arora
Qupzilla

Epiphany would not launch for me ....  haven't used it in a long time.

[aguila]

Looks like I'm using too few browsers.... 

Will watch it and see if I can find out anything...

So long....

[kjpetrie]

I seem to remember that on Windows I didn't have this issue, everything was rendered correctly. Btw, my screen resolution is 1400 x 1050, i.e. any website (only except for the most incompetently designed ones) should not have a problem if the width was defined as an absolute value instead of a relative one.

Which browser do you think those corporate bosses the cowboys design for are most likely to use?

Yep, that's why you don't see the problem so much in IE. But IE is not correct, it is the most non-compliant browser of them all if you check the web standards. It's getting better slowly.

The width should never be defined as an absolute value. Documents are supposed to 'flow' to fit the user's window and still make sense. Belief in a fixed width is the first sign of a basic misunderstanding of what a web page is.

[aguila]

Hi kjpetrie,

sorry if I was unclear. I meant Firefox on Windows. I haven't opened IE since I first heard of Firefox 

I have dived into web development (HTML and CSS) a little bit a while ago, so I'm somewhat familiar with the deficiencies of IE and the non-conformity of almost any browser out there.

However, it seemed to me that on my PCLOS Firefox produces more bad rendering than on XP. But I may be mistaken...

[sling-shot]

For the same screen resolution and the same version number of Firefox, the total text information visible at a time is usually less in PCLinuxOS Firefox than Windows Firefox.