• Toll-free  888-665-8637
  • International  +1 717-220-0012
Welcome Guest! To enable all features please Login or Register.

Notification

Icon
Error

MitchA
#1 Posted : Saturday, September 1, 2007 12:42:32 PM(UTC)
MitchA

Rank: Member

Joined: 3/3/2006(UTC)
Posts: 1,737

I set up my site to look good when my View>Text size is set to medium. I figure this is a default setting for most of the planet...


I had a look to see what happens if someone visits with text size set to 'larger' (IE6). Holy Cow. Text overflows bg img, text wrapping kills column width... At Rudy's Toys, changing text size had no effect in IE6 (unlike my site), but got whacked in FireFox.



I've gone out and found a bunch of sites where no matter what I set my text size to, nothing changes and others get wrecked.



SO.... what's the secret?? ANy way to keep your text looking the way it was designed???
Optimists invent airplanes,
Pessimists buy parachutes.
[email protected]
#2 Posted : Saturday, September 1, 2007 7:42:22 PM(UTC)
sales@rudystoys.com

Rank: Member

Joined: 11/13/2004(UTC)
Posts: 189

Hi Mitch,
Are you indicating www.rudystoys.com had an issue in Firefox?
MitchA
#3 Posted : Saturday, September 1, 2007 10:36:27 PM(UTC)
MitchA

Rank: Member

Joined: 3/3/2006(UTC)
Posts: 1,737

Yea. (Below) View>Text is bumped up 3X in FF. Doing the same with text size in IE6... no noticable change.

Oh, yea... 'minimum' is mis-spelled on <SPAN id=lblDescription>Montgomery Schoolhouse building blocks.
MitchA attached the following image(s):
Rudys-in-Firefox-large-text.jpg (95kb) downloaded 130 time(s).

You cannot view/download attachments. Try to login or register.
Optimists invent airplanes,
Pessimists buy parachutes.
Cliff
#4 Posted : Sunday, September 2, 2007 12:13:21 AM(UTC)
Cliff

Rank: Member

Joined: 5/24/2004(UTC)
Posts: 4,147

Mitch, IE6 doesn't resize text if it's set in pixels. Firefox does allow text resize. This isn't a problem with RudysToys.com, really, so much as it is a problem with IE6.

Text should be set in percentages and/or EMs to allow for accessibility, which is how your stylesheet is set up in this case. You don't want to hijack the browser of someone who is visually impaired by setting all font sizes in pixels. You just need to design to accommodate it; it's rare that someone is going to change the default text size in their browser, but when they do, the design should do everything possible to expand with it.

If you set your body font size to '13px' instead of the current 'small', you'll probably see that it doesn't change in IE when you resize. The rest of your stylesheet's font sizes are based on the body size and will adjust. I don't necessarily recommend it, though; the object is to get the same result in all browsers.

Rudy, no worries.
[email protected]
#5 Posted : Sunday, September 2, 2007 6:00:05 AM(UTC)
sales@rudystoys.com

Rank: Member

Joined: 11/13/2004(UTC)
Posts: 189

Cliff,
Thanks for the info!

Mitch,
Nice catch on the spelling, it is corrected.
MitchA
#6 Posted : Sunday, September 2, 2007 8:00:07 AM(UTC)
MitchA

Rank: Member

Joined: 3/3/2006(UTC)
Posts: 1,737

Thanks, Cliff. There's usually logic behind most of the magic.... I'm really surprised when this stuff works at all.
Optimists invent airplanes,
Pessimists buy parachutes.
scott.mech
#7 Posted : Sunday, September 2, 2007 9:31:57 AM(UTC)
scott.mech

Rank: Member

Joined: 4/4/2004(UTC)
Posts: 670

While this topic is probably beyond the scope of this forum, I want to add that not all browsers display all things at the same size, text, input fields, and more. I also want to say that its easy to blame the browse -- I sure have in the past -- but this won't change the fact that you have customers out there using browser x [IE6 or otherwise]. My opinion is that the rendered output and style should deliver a good customer experience regardless of the browser used.


Tim Berners Lee said...
"Anyone who slaps a 'this page is best viewed with Browser X' label on a Web page appears to be yearning for the bad old days, before the Web, when you had very little chance of reading a document written on another computer, another word processor, or another network."
Tim Berners-Lee
Technology Review, July 1996

Rudy, your text doesn't appear to resize for me in IE7 and there are probably other cross-browser problems beyond just text-resize that you would probably want to address if they were visible to you. I attached a couple of screen shots to this reply, but I do not have time this morning to take additional snapshots.

Mitch, a well designed style sheet can go a long ways towards this. Using ems instead of px will better allow for this across browsers. No matter what anyone says, what matters most is that your customers are delivered the best possible experience.

Adaptive rendering is another thing to contend with. It is possible (and highly likely) that the actual rendered html will differ between browser devices. Try validating the markup of your home page at [email protected]
scott.mech attached the following image(s):
20070902-1009-RudyHome.jpg (39kb) downloaded 112 time(s).

You cannot view/download attachments. Try to login or register.
bbcweb
#8 Posted : Sunday, September 2, 2007 11:46:14 AM(UTC)
bbcweb

Rank: Member

Joined: 5/14/2005(UTC)
Posts: 398

Just to throw out another option, you can use em to style everything. then IE6/7 and FireFox text resizing would act a lot like IE7 page zoom. This method would keep your column/image/text size relationships the same without overriding any of the browser options. Not many sites implement this because it isn't quick or easy.
BetterBuilt.net professional web design and development. call 1-877-325-1109 x7
[email protected]
#9 Posted : Sunday, September 2, 2007 4:35:02 PM(UTC)
sales@rudystoys.com

Rank: Member

Joined: 11/13/2004(UTC)
Posts: 189

Scott,
Thanks for looking, I apprecaite the input.
Your post is well beyond my skills.
I will need to call in my experts to review the issue...
Cliff
#10 Posted : Sunday, September 2, 2007 9:45:56 PM(UTC)
Cliff

Rank: Member

Joined: 5/24/2004(UTC)
Posts: 4,147

One of the best em-based designs I've seen is a CSS Zen Garden theme called Elastic Lawn.

Coupled with some browser reset work, an elastic layout is amazingly accessible. But like BB said, it just takes a helluva lot of work to get it right. Especially if you're set in tables in BVC 2004. :)
bbcweb
#11 Posted : Monday, September 3, 2007 11:07:04 AM(UTC)
bbcweb

Rank: Member

Joined: 5/14/2005(UTC)
Posts: 398

Thankfully i haven't been commissioned to do this to a bv2004 site yet :)
I was hoping mitch would take a crack at it on BV5.

I did this one a couple years back for a usability guy... Environmental Testing Laboratory


After looking at it I noticed that whoever is still maintaining their content has stopped sizing the images properly.
BetterBuilt.net professional web design and development. call 1-877-325-1109 x7
Cliff
#12 Posted : Monday, September 3, 2007 2:32:18 PM(UTC)
Cliff

Rank: Member

Joined: 5/24/2004(UTC)
Posts: 4,147

Originally Posted by: "BetterBuilt.com" Go to Quoted Post
Thankfully i haven't been commissioned to do this to a bv2004 site yet :)
I was hoping mitch would take a crack at it on BV5.

No kidding. :)

Fresh Start BVC5 is em-based, so hopefully that'll help if I can ever get it released.

Originally Posted by: "BetterBuilt.com" Go to Quoted Post
After looking at it I noticed that whoever is still maintaining their content has stopped sizing the images properly.

#1 reason I'll be committed within the next 3 years. ;)
MitchA
#13 Posted : Monday, September 3, 2007 4:55:14 PM(UTC)
MitchA

Rank: Member

Joined: 3/3/2006(UTC)
Posts: 1,737

Mitch just figured out how to change the background on his home page to something other than white, and hasn't figured out how to do the same on the cat and product pages yet.

Mitch breaks a sweat anytime he edits and re-loads a file..... Mitch isn't coming to the rescue any time soon. ;)

Tag, you're it...
Optimists invent airplanes,
Pessimists buy parachutes.
Forum Jump  
You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.

©2024 Develisys. All rights reserved.
  • Toll-free  888-665-8637
  • International  +1 717-220-0012