20 replies [Last post]
Alan
Offline
Enthusiast
Last seen: 10 years 44 weeks ago
Joined: 2003-10-20
Posts: 72
Points: 0

Hi,

On certain web pages, the text looks weird. As if it's being displayed one size too small. It looks all scrunched up and ugly. Take a look at this screen cap to see what I mean:

http://img370.imageshack.us/img370/9176/fontslookweird1vo.jpg

See the text "Choose from the latest phones from Orange"? That's what I'm talking about.

I'm using Internet Explorer 6, with the browser Text Size set to the default "Medium". Can anyone explain what the problem is, 'cos I really don't understand it.

Tags:
Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 33 weeks 19 hours ago
London
Joined: 2004-06-06
Posts: 15650
Points: 2788

Fonts look weird on certain web pages! Why?

No Allen we can't really tell you what is happening from sight of a jpg.

Code please or a link to the page.

Hugo.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

tripleshift
Offline
Enthusiast
Last seen: 8 years 3 weeks ago
Timezone: GMT+2
Joined: 2005-03-22
Posts: 70
Points: 0

Fonts look weird on certain web pages! Why?

i visited that site ( here Wink ) and couldn't notice anything wrong on font and character display on both mozilla and IE.

this thing seems strange to me too and the only thing I can think about, is your screen resolution.
if you have a lcd monitor and you're using a screen resolution different from the default one, everything looks obviously "scrunched" as you said, because the resulting display is interpolated.

if this isn't your case, i'm sorry i have no clues at all Sad

bye
tripleshift

...

I left my good sign in the other pants

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 33 weeks 19 hours ago
London
Joined: 2004-06-06
Posts: 15650
Points: 2788

Fonts look weird on certain web pages! Why?

Laughing out loud oops completely missed the point there, ignore my previous comments, although as tripleshift says it's likely a monitor/resolution problem, it looks fine for me in IE6 1024×768 .

Hugo.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 8 years 1 week ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Fonts look weird on certain web pages! Why?

Alan
You must have taken that screen shot at a screen *size* of 1024x768 or higher, because the content disappears below the left column on a smaller window. Then, it seems to me, you cropped part of the image and reduced the remaining bit down to the 747x542 pixels in your jpg, with image editing software.

If that is what you did, I got a certain amount of squidgyness when I resized the image from 1024x768 down to 747x542 - see attachment. I got even more of the effect from a 1280x1024 screen size taken down to 747x542.

You also got a certain amount of stretchiness (allied to squidyness) in the fonts, which can happen if an image is not resized proportionally to the original i.e. by not maintaining the aspect ratio.

Hope that explains what *could* have happened. Laughing out loud

Edit: I now note the image as displayed by ImageShack is 703x510 pixels, yet when copied to my PSP software the dimensions are 747x542 and PSP renders the text a little clearer. Don't know if there is anything in that. :roll:

Alan
Offline
Enthusiast
Last seen: 10 years 44 weeks ago
Joined: 2003-10-20
Posts: 72
Points: 0

Fonts look weird on certain web pages! Why?

Hi. The screenshot I took has not been resized. It is exactly how it appeared in my browser (IE6). All I did was crop off the browser window/controls.

I have a 15" LCD Display, with a native resolution of 1024x768. I'm running the LCD at 1024x768 so everything else looks fine.

This one website, and a few others I visit, have this same problem. Perhaps I have an old/corrupt font that the website is using?Perhaps I don't even have the correct font that the website is requesting?

Alan
Offline
Enthusiast
Last seen: 10 years 44 weeks ago
Joined: 2003-10-20
Posts: 72
Points: 0

Fonts look weird on certain web pages! Why?

Hey. I found out what the problem is. The site uses Helvetica. This is a font that I don't have. I have Windows XP SP2, but Helvetica never came installed with the PC.

I've tried to find Helvetica to download on various websites, but they all charge for it.

If this is a system font that most people have, how can I get it onto my PC for free?

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 8 years 1 week ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Fonts look weird on certain web pages! Why?

Oh well - egg on face all round then. Thanks for clearing that up.

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 1 year 4 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

Fonts look weird on certain web pages! Why?

Alan - if you don't have Helvetica then your browser will fall-back on Arial, then on whatever font you have designated to be 'Sans Serif' within IE's preferences. This is not the cause of your problem per se. The problem is in the limitations of your OS to try and show you what Helvetica or Arial looks like at 80% (or 71% or whatever) of your designated base size. It is tiny text with a cap-height of only 8 pixels and for each letter, your system is trying to round up or down all of the dozens of outline intersection points in order to recreate the font in bitmap form at the specified size. Font technology at small bitmap sizes is a nightmare of complexity.

Mac users have the luxury of a superb font rendering engine built into the OS, but Windows users should be able to get close to it by enabling what M$ calls 'font smoothing' (I think) within Settings > Display > Effects (I think).

That said, a particular problem with your set-up seems to be with the kerning as well as a lack of interpolation. It's as if the OS is applying the kerning data from one font to another. Maybe it is even scaling it incorrectly in the same way. The root of your problem may be that your OS thinks you have Helvetica even though you don't, and it's getting confused. I suggest you try and reinstall Helvetica from your system software CDs as I'm pretty sure it should be included as part of the M$ base set, even though I'm not a Windows user myself (can you guess).

HTH Smile

Life's a b*tch and then you die!

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 8 years 1 week ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Fonts look weird on certain web pages! Why?

Curiouser and curiouser.
I have viewed the actual Orange site on a bog standard Windows XP machine with not a SP in sight and on a Windows XP SP2 machine. Both look quite OK in IE6 and FF1.0.6, as attached. Neither machine has the Helvetica font in the list of fonts and I can't find it on the installation CDs.

As Roy says your kit should be falling back on Arial, then Sans-serif in accordance with the Orange CSS and I'd be surprised if neither of these fonts was available to you.

{ font-family:Helvetica, Arial, Sans-serif }

Maybe your brower(Drunk has been set to over-ride fonts on web pages in favour of a user-chosen font.

There's a bit about font-smoothing here:
http://support.microsoft.com/default.aspx?scid=kb;en-us;294851
If that doesn't help try searching the MS Knowledge Base for font-smoothing and kerning. But we must both appreciate we are using a rubbish OS Tongue

Alan
Offline
Enthusiast
Last seen: 10 years 44 weeks ago
Joined: 2003-10-20
Posts: 72
Points: 0

Fonts look weird on certain web pages! Why?

Ok. The problem is solved.

I had a font installed called Helvetica Light. The Typeface name is actually "Helvetica" so Internet Explorer 6 must've been assuming that Helvetica Light was Helvetica.

I have now removed Helvetica Light from my Fonts folder, and the Orange website looks fine. IE6 is most likely now reverting to Arial, because Helvetica cannot be found. Here's how the page looks:

http://img338.imageshack.us/img338/955/fontslookfine9pr.jpg

Once last question, though. Does anyone know a way of obtaining helvtica as a TrueType Font, for Windows XP, for free? I imagine its a font that most PC users don't have by default.

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 1 year 4 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

Fonts look weird on certain web pages! Why?

You're right Lorraine, I've just fired up my PC and Helvetica is not on the system - sorry!

Alan - download Firefox and see how it looks on that. In fact, download Firefox anyway as IE is a heap of sh*t Wink

Mac screenshot attached (just to show you what I mean about the Mac OS).

[edit] x-posted with above.

Life's a b*tch and then you die!

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 8 years 1 week ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Fonts look weird on certain web pages! Why?

Roy wrote:
I've just fired up my PC

You did what? You've just admitted to owning a what?

HellsBells
HellsBells's picture
Offline
Leader
Bedford, UK
Last seen: 6 years 17 weeks ago
Bedford, UK
Joined: 2004-04-07
Posts: 851
Points: 0

Fonts look weird on certain web pages! Why?

Aghh - I've got Helvetica light too - and I paid for it so I don't really want to get rid of it. Poo. :?

My strategy is so simple an idiot could have devised it!

"Also, your CSS (no offence) makes me want to gouge my eyes out with a rusty spoon" - TPH

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 1 year 4 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

Fonts look weird on certain web pages! Why?

Lorraine wrote:
Roy wrote:
I've just fired up my PC

You did what? You've just admitted to owning a what?

...yes; a PC with IE5.5 on Win98, and IE6 on Win2000 so that I can see just what sort of mess they make of my lovely CSS ](*,) Crying

Life's a b*tch and then you die!

Alan
Offline
Enthusiast
Last seen: 10 years 44 weeks ago
Joined: 2003-10-20
Posts: 72
Points: 0

Fonts look weird on certain web pages! Why?

Ok guys. Thanks for all your help.

I'll download Firefox, but personally I am very happy with IE6. It does everything I want it to. And I can't understand why "tabbed browsing" is such an innovation, because Windows already allows you to have multiple websites open along the taskbar.

HellsBells
HellsBells's picture
Offline
Leader
Bedford, UK
Last seen: 6 years 17 weeks ago
Bedford, UK
Joined: 2004-04-07
Posts: 851
Points: 0

Fonts look weird on certain web pages! Why?

Oh my god Alan Shock

Quick run while I distract them!

*cough* Ahem - Anyone noticed any new cool Firefox extensions?

Oh and I've noticed that fonts in Firefox on the Mac come out really small - much smaller than Safari. Odd eh?

My strategy is so simple an idiot could have devised it!

"Also, your CSS (no offence) makes me want to gouge my eyes out with a rusty spoon" - TPH

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 8 years 1 week ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Fonts look weird on certain web pages! Why?

Alan wrote:
I am very happy with IE6.

Do you have a death wish?
At least download Firefox and check out some of the extensions like the Web Developer Toolbar and the HMTL Tidy plug-in. If nothing else it will help you to check how your pages render in another browser or, as I should say, a standards compliant browser.

Time to come out of the closet, methinks, before someone else does it for me. IE6 is my default browser and I've just bought a new copy of FrontPage

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 1 year 4 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

Fonts look weird on certain web pages! Why?

Alan - if you build websites and are moving to CSSP then you'll need to start using a standards compliant browser or you'll tie yourself up in knots trying to build websites that everyone can see properly. Tabbed browsing and reduced windows are two completely separate things, as you'll find out if you start using Firefox. I'm going to stop there before I start ranting Wink

HellsBells - change your FF prefs base font size to 16px so that it matches IE's ridiculously large default fonts. As usual, IE is wrong (16px - I ask you :roll: ) and Apple are correct, but also as usual, IE has the monopoly so everyone works to their settings!

Lorraine - you are joking, right Shock

Life's a b*tch and then you die!

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 8 years 1 week ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Fonts look weird on certain web pages! Why?

roytheboy wrote:

Lorraine - you are joking, right Shock

Err... No. IE is my default browser and FrontPage was the best tool for me personally to do some quick, albeit, and dirty work to set up a new business. 'sides I took my lead from your comment about Dreamweaver being part of your RAM-based set-up Wink

I would have tried to use my new Apple thingy, but they never did fix the screen, gave up and paid off my credit card debt. Smile

<soapbox>
Oh yes and I have a high regard for what Bill and Melissa Gates are doing for developing countries http://www.gatesfoundation.org/
Scoff away anyone, if you must Then check out the grants total and consider what size of endowments, from you know who, provided the investment income that made those grants possible.
</soapbox>

Don't think I'll ever get another star now. Cool

thepineapplehead
thepineapplehead's picture
Offline
Guru
Milton Keynes
Last seen: 2 weeks 5 days ago
Milton Keynes
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9668
Points: 801

Fonts look weird on certain web pages! Why?

Alan wrote:
Ok guys. Thanks for all your help.

I'll download Firefox, but personally I am very happy with IE6. It does everything I want it to. And I can't understand why "tabbed browsing" is such an innovation, because Windows already allows you to have multiple websites open along the taskbar.

<gets petrol>

<loads up flamethrower>

Seriously, use FF for day to day browsing. Get used to tabbed browsing. Download Mouse gestures, and right click+drag to go back a page. Download a cool theme. Put a clock in your statusbar. Customise the menus to how you like.

Oh yeah, and GET RID OF EVERY ADVERT ON EVERY PAGE EVER.

Then open ONE site in IE, and wonder how you EVER lived with that pos excuse for a browser.

Trust me, after using Fx for weeks/ a few months, you'll NEVER go back to IE.

/edit

Look at this image:

That's IE on the left, Fx on the right.

Verschwindende wrote:
  • CSS doesn't make pies