Submit Your Article Forum Rules Search
WebProWorld
Register FAQ Calendar Mark Forums Read


Graphics & Design Discussion Forum Post your graphics design questions/comments/ideas in here. Ask questions, post tutorials, discuss trends and best practices. Sub-forum for website accessibility and usability.

Share Thread: & Tags

Share Thread:

Reply
 
LinkBack Thread Tools Display Modes
  #1 (permalink)  
Old 12-01-2004, 01:43 PM
WebProWorld New Member
 
Join Date: Dec 2004
Location: State College, PA
Posts: 7
tractor RepRank 0
Default Text Display Size in IE 5.5 and 6

I am a webmaster. I do get frustrated with IE at times. Starting with IE 5.5 and continuing with version 6, it seems for many installations of IE and windows (but not all), instead of the default text size being medium in IE (the equivalent of normal in Firefox) it is by default set to smaller. If a person goes in and changes it to medium in IE, once the computer is shut down, the next time it is booted up the default is again smaller and not medium. Opera and Firefox display my pages the way I want them. IE doesn't!!!!!!!!! They look ok, but I would like all users to see the sites I've done the way I designed them. Plus, I would assume at least 50% of the visitors to our site don't know that you can change the default text size. Is there a way to force IE to display the text on pages as medium instead of as smaller if the default on a users computer is smaller.
Reply With Quote
  #2 (permalink)  
Old 12-01-2004, 05:16 PM
Kellare's Avatar
WebProWorld Member
 
Join Date: Nov 2004
Location: Melbourne, Australia
Posts: 48
Kellare RepRank 0
Default

You can set up the body of the document to display default sizes for the fonts as in

<body style="font-family: Arial, sans-serif; font-size: 12pt">

etc...

you could also use css to do it which would make maintenance much simpler and even allow you to specify different settings for different browsers etc...

hth
Reply With Quote
  #3 (permalink)  
Old 12-03-2004, 10:05 AM
WebProWorld New Member
 
Join Date: Dec 2004
Location: State College, PA
Posts: 7
tractor RepRank 0
Default Text Size

Thank you for responding to my post. I tried your suggestion. The problem is that IE is setup by Windows on quite a few systems to have the default text size display one size smaller than what the default should be. Therefore, if I have a font set at 12 points it actually displays smaller than normal regardless of the HTML coding for text size. I have three different sites which use quite a few pictures. The pictures always display normally, but the text size ends up being smaller, so I need to be extremely careful not to have something end up looking really dumb where I have a picture in a cell in a table, and then text in an adjacent cell. On my test page, using your suggestion, IE is still displaying the text a size smaller since the default text size display in IE is set to smaller instead of normal. What is needed is some way to tell IE to display the text size as Normal on a site visitor's computer. I'm doubting that it can be done.
Reply With Quote
  #4 (permalink)  
Old 12-03-2004, 01:01 PM
WebProWorld 1,000+ Club
 
Join Date: Aug 2003
Location: Edmonton, AB, Canada
Posts: 1,527
mikmik RepRank 3mikmik RepRank 3
Default

Hi, folks! tractor, what DTD are you using at the top of the HTML docs? I get things to be consistent between the browsers by putting a
Quote:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
at the top.

I think that might work, but if you don't already have a DTD of some kind up, try the transitional. There may be a way to get some consistency with different uses of DTD. Can you post a URL?
Reply With Quote
  #5 (permalink)  
Old 12-04-2004, 02:01 AM
WebProWorld Pro
 
Join Date: Apr 2004
Location: Seattle
Posts: 239
scallihan RepRank 0
Default Re: Text Display Size in IE 5.5 and 6

Quote:
Originally Posted by tractor
I am a webmaster. I do get frustrated with IE at times. Starting with IE 5.5 and continuing with version 6, it seems for many installations of IE and windows (but not all), instead of the default text size being medium in IE (the equivalent of normal in Firefox) it is by default set to smaller. If a person goes in and changes it to medium in IE, once the computer is shut down, the next time it is booted up the default is again smaller and not medium. Opera and Firefox display my pages the way I want them. IE doesn't!!!!!!!!! They look ok, but I would like all users to see the sites I've done the way I designed them. Plus, I would assume at least 50% of the visitors to our site don't know that you can change the default text size. Is there a way to force IE to display the text on pages as medium instead of as smaller if the default on a users computer is smaller.
This is a well-known IE 5.x quirk. The reasoning behind it was apparently to synchronize the seven absolute font size properties (xx-small, x-small, small, medium, large, x-large, xx-large) with the seven absolute FONT element sizes (1, 2, 3, 4, 5, 6, 7), with font-size: small sequentially corresponding to size="3" (which corresponds to the default paragraph text font size). It is in direct conflict, however, with the CSS specifications, which clearly state that font-size: medium corresponds with size="3".

The way around this in IE 6.x is to use DocType Switching:

1. To cause IE 6.x to use "standards mode" (where font-size: medium equals size="3"), include this DocType declaration at the top of the page:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

2. To cause IE 6.x to use "quirks mode" (where font-size: small equals size="3"), either don't include a DocType declaration or include this DocType declaration at the top of the page:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Reply With Quote
  #6 (permalink)  
Old 12-06-2004, 11:20 AM
WebProWorld New Member
 
Join Date: Dec 2004
Location: State College, PA
Posts: 7
tractor RepRank 0
Default Reply to Steve

Steve,

Thank you very much for your post. When I did the sites I’ve done from scratch, I did them before the DOCTYPE specifications existed. Since the sites performed as I intended them to other than for this text problem, I didn’t bother going through them and adding the DOCTYPE. Some time ago I had read an article about IE having some rendering problems, but there wasn’t anything that seemed related to anything I had done. I’m sure you have me on the right tract. But...... I haven’t had any success with your suggestion yet. Here are three pages you can look at:
http://cbur.com/
This page has no DOCTYPE
http://cbur.com/index1.html
This page has the <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
http://cbur.com/index2.html
This page has the <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
When I view all three pages in IE 6 though, I’m still not getting any change in the display size of the text.
Reply With Quote
  #7 (permalink)  
Old 12-06-2004, 11:41 AM
WebProWorld New Member
 
Join Date: Dec 2004
Location: State College, PA
Posts: 7
tractor RepRank 0
Default

Hi mikmik,
I wasn’t trying to ignore your suggestion when I wrote my reply to Steve above. I did try the DOCTYPE you suggested at http://cbur.com/index3.html . It still didn’t change the text size display on my system in IE 6. All of the pages regardless of the DOCTYPE look fine in Firefox 1.0 . I haven’t tried Opera yet.
Reply With Quote
  #8 (permalink)  
Old 12-06-2004, 02:37 PM
WebProWorld Pro
 
Join Date: Apr 2004
Location: Seattle
Posts: 239
scallihan RepRank 0
Default Re: Reply to Steve

Ugh, looping background audio...

The DocType declaration has to go at the very top of the document, above the <html> start tag:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

The "loose" DTD, by the way, allows for use of "deprecated" elements and attributes (such as the FONT element and the ALIGN attribute, for instance), while the "strict" DTD does not. For more info, see the W3C site at http://www.w3.org/ .

Quote:
Originally Posted by tractor
Steve,

Thank you very much for your post. When I did the sites I’ve done from scratch, I did them before the DOCTYPE specifications existed. Since the sites performed as I intended them to other than for this text problem, I didn’t bother going through them and adding the DOCTYPE. Some time ago I had read an article about IE having some rendering problems, but there wasn’t anything that seemed related to anything I had done. I’m sure you have me on the right tract. But...... I haven’t had any success with your suggestion yet. Here are three pages you can look at:
http://cbur.com/
This page has no DOCTYPE
http://cbur.com/index1.html
This page has the <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
http://cbur.com/index2.html
This page has the <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
When I view all three pages in IE 6 though, I’m still not getting any change in the display size of the text.
Reply With Quote
  #9 (permalink)  
Old 12-10-2004, 07:36 PM
WebProWorld New Member
 
Join Date: Dec 2004
Location: State College, PA
Posts: 7
tractor RepRank 0
Default

Hi Steve,

Oops!!!!! Looping music! Yes, I know a person isn't supposed to do that on a business site. But quite honestly, about 90% of our visitors like it. The other 10% hate it. It is only on selected pages, and it is changed roughly every month, and I'm very particular about what songs go where. If this were a site selling computers, it would be absurd to have music on it. With it being real estate, what I'm trying to do is to set an atmosphere with the songs I choose. So, the music isn't there just for the sake of having music. But if you would be there just letting the music on that page play over and over, yes, it would be very obnoxious!

Now to the business at hand. I do have the doctype in the right place now. I'm sorry I messed up before. And it seems to me, if I understand what you are saying correctly, that I need the “loose” coding. That is what I now have on http://cbur.com/index1.html , but in good old IE 6 the text is still displaying one size smaller.

Thanks for your help.
Reply With Quote
  #10 (permalink)  
Old 12-11-2004, 03:25 PM
WebProWorld 1,000+ Club
 
Join Date: Aug 2003
Location: Edmonton, AB, Canada
Posts: 1,527
mikmik RepRank 3mikmik RepRank 3
Default

I am not sure that I understand. I took a screenshot of IE6, IE5.5, and Firefox1.0, and they all render in 'standards mode' with that DTD, and they all look the same size to me!



Sure you have the latest updates from Microsoft installed? I used to have that prob all the time, but with sp2, IE is much more standards compliant, and I rarely have problems with font-size differences now.
Reply With Quote
  #11 (permalink)  
Old 12-11-2004, 11:37 PM
WebProWorld New Member
 
Join Date: Dec 2004
Location: State College, PA
Posts: 7
tractor RepRank 0
Default

Hi MikMIk,

Thank you for your replay. I'm not an expert at computers, but I'm definitely above average. I have all of the Windows updates, including SP 2. My IE always defaults to smaller for the text size. If I set it to medium, and then shut down the computer (power down), after the next boot, IE has returned to smaller as being the default text size. I generally upgrade computers (at home and at the office) about one a year, and I sell my used ones to folks who want good used computers. All 4 have done this. Also, the previous machines I had before the last 4 did the same thing on the default text size with Windows me and IE 6. When I am at a clients property, I like to check how our site performs on other folks computers in terms of speed and everything. Every once in a while I find a system where the text size is as it should be. On most of them it isn't. If you can tell me how to post a screen shot, I will show you my display. It is still smaller. I agree with you. On your screen shots, yours are all the same!

Thank you for your help!!!!!!! :)
Reply With Quote
  #12 (permalink)  
Old 12-12-2004, 04:40 AM
WebProWorld Veteran
 
Join Date: Aug 2003
Location: Cornwall, UK
Posts: 999
speed RepRank 2
Default

You need to specify the text size as em, px or pt at the moment your giving it as relative sizes.

You have already set the font size for the body as 12pt but in the body you use:

<font size="3"> ....... </font>

If you change that to:

<span style="font-size: 1.25em> ....... </span>

The text size will be relative to the 12pt set in the body/td and not the setting the user chooses.

You also need to add the following in your head:

<style type="text/css" media="screen"><!--
td { font-family: Arial; font-size: 12pt; }
body { font-family: Arial; font-size: 12pt; }
--></style>

and change the <body line to:

<body alink="#ffffff" background="index1_files/blue3.jpg" link="#ffffff" vlink="#ffffff">

The downside of doing this is that the user looses the ability to change the size of the font.

I think that's what you were after anyway.

By the way that music is horrid, I nearly didn't bother looking at your site once that started, maybe next time when you post an example you could remove the music first.
Reply With Quote
  #13 (permalink)  
Old 12-12-2004, 06:19 PM
WebProWorld 1,000+ Club
 
Join Date: Aug 2003
Location: Edmonton, AB, Canada
Posts: 1,527
mikmik RepRank 3mikmik RepRank 3
Default

tractor, you and me both!
Quote:
I generally upgrade computers (at home and at the office) about one a year, and I sell my used ones to folks who want good used computers
Well, you raise an interesting point, as I said, it seemed to me I have had the 'smaller text size' mystery in IE6 before, so now I am not sure LOL! You obviously know what you are doing as much as me, so no questions there.

For now, I would follow what speed says. I almost exclusively use ems or % to set font sizes. If worst comes to worst, I use a hack target the CSS for one browser - this will NOT apply to IE5.5, but will work in IE6, if you have the right DTD (man!)

Quote:
#testElement {
color: /**/#00cc00;
}
Put this in front of the value: /**/. Unfortunately, Mozilla will also apply this, but you get the idea. I try not to use hacks at all, there are usally better ways to handle browser differences.

PS Damn, it has been over a year. I want to go to a 64 bit AMD FX pretty soon, time to upgrade :O)))
Reply With Quote
  #14 (permalink)  
Old 12-12-2004, 06:24 PM
WebProWorld 1,000+ Club
 
Join Date: Aug 2003
Location: Edmonton, AB, Canada
Posts: 1,527
mikmik RepRank 3mikmik RepRank 3
Default

Oh ya, for future reference, I use MWSnap to take screen shots, then upload to my website.
Put the URL to the image in your post,
eg httq;//yoursite.com/imagefolder/screenshot.jpg and then put the [ img ] things around it like the [url ] tags for links. Make your pic smaller than 300 or 350 px wide so it fits nicely LMAO
Reply With Quote
  #15 (permalink)  
Old 12-14-2004, 12:50 AM
WebProWorld Pro
 
Join Date: Apr 2004
Location: Seattle
Posts: 239
scallihan RepRank 0
Default

Quote:
Originally Posted by mikmik
I am not sure that I understand. I took a screenshot of IE6, IE5.5, and Firefox1.0, and they all render in 'standards mode' with that DTD, and they all look the same size to me!
Okay, check the following two examples in IE 6:

http://www.callihan.com/example/quirks_mode.html

and

http://www.callihan.com/example/standards_mode.html

Normal text is displayed in green, medium text in red. In standards mode in IE 6, they are the same size. In quirks mode, medium text is one size larger (equal to size="4") than normal text (equal to size="3").

The only differences between the two files are the DocType declarations:

Standards Mode:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>

Quirks Mode:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
Reply With Quote
  #16 (permalink)  
Old 12-15-2004, 07:43 PM
WebProWorld New Member
 
Join Date: Dec 2004
Location: State College, PA
Posts: 7
tractor RepRank 0
Default

Hi Gentlemen,

First, thank you all for your input. When I started doing websites, I started with Frontpage 98. Then I moved up to Frontpage 2000 when it came out. For two years now I've been going to get Dreamweaver. I ordered it yesterday. I'm sorry some of you object to the music. Yes, I've been told from day one not to put music on a business website. But after almost 6 years, the number of complaints are really minuscule compared to the very large number of compliments about it. It seems most of our real estate visitors think it is a little extra touch we do that nobody else does. Believe me, if we had any significant number of complaints it would be gone! Now to the business at hand.

Scallihan's examples do exactly what he intended them to do. I've never done anything with CSS. Some of the things I've read scared me away from it a little, and if I'm making a major change in background, logo,etc., I can just sort of cheat and call the new one the old one! I have not had time to try Speed's suggestion yet. When I started doing sites, Frontpage did everything for me. I knew nothing about html. Needless to say, I had to learn some basics to fix things Frontpage did wrong. I'm especially looking forward to using Dreamweaver to get better coding, and to run the pages through the code checker. Yes, I do know you can get code checkers on line too!!!!!!! But I want a design program that is up to standards also.

What I'm thinking from looking at what speed wrote and looking at the code in scallihans simple pages, I need some css coding on all of the pages to make the doctype work. Is that correct?

Thank you to all of your for your assistance!!!!!!!
Reply With Quote
  #17 (permalink)  
Old 12-16-2004, 02:26 PM
WebProWorld Pro
 
Join Date: Apr 2004
Location: Seattle
Posts: 239
scallihan RepRank 0
Default

Quote:
Originally Posted by tractor
Hi Gentlemen,

First, thank you all for your input. When I started doing websites, I started with Frontpage 98. Then I moved up to Frontpage 2000 when it came out. For two years now I've been going to get Dreamweaver. I ordered it yesterday. I'm sorry some of you object to the music. Yes, I've been told from day one not to put music on a business website. But after almost 6 years, the number of complaints are really minuscule compared to the very large number of compliments about it. It seems most of our real estate visitors think it is a little extra touch we do that nobody else does. Believe me, if we had any significant number of complaints it would be gone! Now to the business at hand.

Scallihan's examples do exactly what he intended them to do. I've never done anything with CSS. Some of the things I've read scared me away from it a little, and if I'm making a major change in background, logo,etc., I can just sort of cheat and call the new one the old one! I have not had time to try Speed's suggestion yet. When I started doing sites, Frontpage did everything for me. I knew nothing about html. Needless to say, I had to learn some basics to fix things Frontpage did wrong. I'm especially looking forward to using Dreamweaver to get better coding, and to run the pages through the code checker. Yes, I do know you can get code checkers on line too!!!!!!! But I want a design program that is up to standards also.

What I'm thinking from looking at what speed wrote and looking at the code in scallihans simple pages, I need some css coding on all of the pages to make the doctype work. Is that correct?

Thank you to all of your for your assistance!!!!!!!
If you want the "medium" font size (set using CSS) to be the same size as the default font size (size="3") in Internet Explorer 6, then you need to insert the full DocType declaration I provided at the very top of your HTML file (above the HTML start tag) to invoke standards mode.

You need to watch out, however, that Standards Mode in IE 6 does not affect the display of your page in other ways that you may not want. If that is the case, you may want to stick with Quirks Mode and just eschew trying to set the "medium" font size at all. I'm guessing that it is FrontPage that inserted it in the first place.

To change the font size using CSS, you can use em-measurements: font-size: 1em or font-size: 100% would be the same as font-size: medium, assuming that the font-size of the parent element was equivalent to size="3".

Internet Explorer 3 does have a problem with em-measurements, interpreting 1em to be the same as 1px, but very few people are using that browser anymore.

Using pixel measurements (font-size: 16px, for instance) runs into the problem that Windows and the Macintosh have different default dot-pitches (96-dpi vs. 72-dpi), which can cause the same sized text to display smaller on the Macintosh than in Windows. IE 5+ for the Macintosh, however, converts font sizes so they match what is seen in Windows, but other Mac browsers may not.

Or you can just eschew setting font sizes at all -- that is often the best approach.
Reply With Quote
Reply

  WebProWorld > Site Design > Graphics & Design Discussion Forum

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On



All times are GMT -4. The time now is 10:30 PM.



Search Engine Optimization by vBSEO 3.3.0