Why is Vista showing this website so screwy?

My client loves the website I designed for her- at home.
At work she is running Vista with MicroSoft Outlook and she says it looks
crazy. Screwy spacing, out of alignment, letters too big and adding extra
lines. The weird thing is that she printed the pages and they are fine!

Now I checked this website this morning on Mozilla, Safari, Internet
Explorer, Netscape on two computers - both Macs--and they all looked great.

She says "Home page has a big gap (3 inches) between quote on top and second
paragraph."

http://www.barnlivin.com/

And on Services page - last words of bulleted sentences she says are aligned
way on the left.

http://www.barnlivin.com/services.html

I'm not seeing any of this. Is it her work computer? Or how do I fix this
for her?

Opinions cheerfully accepted,
Alley Cat

IE has a number of user settings that might do that, up to, and including
accessibility settings, and custom .css 'stylesheets'.
IE, View menu, "Text Size" set to 'fixed' or whatever.
Rightclick a page and set 'Encoding' to something unusual.
IE, Tools menu, Options. General tab, "Accessibility" button.

--
Was this helpful? Then click the Ratings button. Voting helps the web
interface.
http://www.microsoft.com/wn3/locales...eAPostAsAnswer
Mark L. Ferguson
..

"Alley Cat Smith" <Alley Cat > wrote in
message news1B0A66B-F07A-483E-9031-...
> My client loves the website I designed for her- at home.
> At work she is running Vista with MicroSoft Outlook and she says it looks
> crazy. Screwy spacing, out of alignment, letters too big and adding extra
> lines. The weird thing is that she printed the pages and they are fine!
>
> Now I checked this website this morning on Mozilla, Safari, Internet
> Explorer, Netscape on two computers - both Macs--and they all looked
> great.
>
> She says "Home page has a big gap (3 inches) between quote on top and
> second
> paragraph."
>
> http://www.barnlivin.com/
>
> And on Services page - last words of bulleted sentences she says are
> aligned
> way on the left.
>
> http://www.barnlivin.com/services.html
>
> I'm not seeing any of this. Is it her work computer? Or how do I fix this
> for her?
>
> Opinions cheerfully accepted,
> Alley Cat

On Wed, 16 Apr 2008 07:49:02 -0700, Alley Cat Smith <Alley Cat
> wrote:

>My client loves the website I designed for her- at home.
>At work she is running Vista with MicroSoft Outlook and she says it looks
>crazy. Screwy spacing, out of alignment, letters too big and adding extra
>lines. The weird thing is that she printed the pages and they are fine!
>
>Now I checked this website this morning on Mozilla, Safari, Internet
>Explorer, Netscape on two computers - both Macs--and they all looked great.
>
>She says "Home page has a big gap (3 inches) between quote on top and second
>paragraph."
>
>http://www.barnlivin.com/
>
>And on Services page - last words of bulleted sentences she says are aligned
>way on the left.
>
>http://www.barnlivin.com/services.html
>
>I'm not seeing any of this. Is it her work computer? Or how do I fix this
>for her?
>
>Opinions cheerfully accepted,
>Alley Cat

I see the same thing your client does using IE7. Why? Well I looked at
the source of the web page that shows how the HTML was encoded. To be
frank, a bewildering mass of quivering spaghetti gobbledygook. Not
your design, rather the underlying code that created it. THAT is the
problem.

The short answer is you using non standard markup. More correctly the
editor you've picked is. When you do all bets off, different browsers
on different platforms will show web pages differently, ESPECIALLY
when you assign height values in tables. Since you seem to be using
forced height values in your tables THAT will for sure give different
results and can depending on many things (user resolution for example)
really mess up spacing. I see the same huge gaps your client does.
This happens with tables, more so if you use nested tables.

It looks "fine" to you since you are viewing it at your preferred
resolution and favorite browser and your system is set to display
pages CORRECTLY with GoLive. That may or may not generate good results
at lessor or greater resolutions or for others because of a host of
variables.

What's really wrong? You apparently don't understand the underlying
principles behind HTML markup and are using some "fancy" HTML editor
to generate the markup for you. In your case Adobe GoLive.

What your client sees is sadly typical of code generated by such
"fancy" HTML editors. Oh the web site is readable enough and I guess
it works, and it doesn't look that bad, but for some, including your
client it looks butt ugly because in places doing HTML markup this way
can add huge gaps in the text, often between paragraphs or between
body text and headings.

What else looks rather cheesy is the added space both above and below
the images in the left column. Again the reason is the height values
and also the text formatting of the CSS in some paragraphs. Extra
space is getting added (forced) in the table column holding the images
to make up for added space in the text column to show the text, which
is probably way different in some browsers that what you're seeing.
The saddest thing of all is you probably weren't aware this can
happen.

Word to the wise... if you're going to author web sites for others for
MONEY be SURE you first understand the basics of HTML and never rely
exclusively on some fancy editor to generate the code for you or the
results can be pretty bad and make you look amateurish.

I used to author web sites in the mid to late 90's and I made a
fortune, but I had to stop, the pressure was getting to me and I was
working 18-20 hours 7 days a week.

Best thing you can do, learn the RIGHT way. Start here:

http://www.w3.org/

I tested it first thing this morning and the report says

http://validator.w3.org/check?uri=ht....barnlivin.com

They say no errors, GoLive says no errors.

"Adam Albright" <> wrote in message
news:...
>
> I see the same thing your client does using IE7. Why? Well I looked at
> the source of the web page that shows how the HTML was encoded. To be
> frank, a bewildering mass of quivering spaghetti gobbledygook. Not
> your design, rather the underlying code that created it. THAT is the
> problem.
>
> The short answer is you using non standard markup. More correctly the
> editor you've picked is. When you do all bets off, different browsers
> on different platforms will show web pages differently, ESPECIALLY
> when you assign height values in tables. Since you seem to be using
> forced height values in your tables THAT will for sure give different
> results and can depending on many things (user resolution for example)
> really mess up spacing. I see the same huge gaps your client does.
> This happens with tables, more so if you use nested tables.
>
> It looks "fine" to you since you are viewing it at your preferred
> resolution and favorite browser and your system is set to display
> pages CORRECTLY with GoLive. That may or may not generate good results
> at lessor or greater resolutions or for others because of a host of
> variables.
>
> What's really wrong? You apparently don't understand the underlying
> principles behind HTML markup and are using some "fancy" HTML editor
> to generate the markup for you. In your case Adobe GoLive.
>
> What your client sees is sadly typical of code generated by such
> "fancy" HTML editors. Oh the web site is readable enough and I guess
> it works, and it doesn't look that bad, but for some, including your
> client it looks butt ugly because in places doing HTML markup this way
> can add huge gaps in the text, often between paragraphs or between
> body text and headings.
>
> What else looks rather cheesy is the added space both above and below
> the images in the left column. Again the reason is the height values
> and also the text formatting of the CSS in some paragraphs. Extra
> space is getting added (forced) in the table column holding the images
> to make up for added space in the text column to show the text, which
> is probably way different in some browsers that what you're seeing.
> The saddest thing of all is you probably weren't aware this can
> happen.
>
> Word to the wise... if you're going to author web sites for others for
> MONEY be SURE you first understand the basics of HTML and never rely
> exclusively on some fancy editor to generate the code for you or the
> results can be pretty bad and make you look amateurish.
>
> I used to author web sites in the mid to late 90's and I made a
> fortune, but I had to stop, the pressure was getting to me and I was
> working 18-20 hours 7 days a week.
>
> Best thing you can do, learn the RIGHT way. Start here:
>
> http://www.w3.org/


There is nothing wrong with GoLive!. Do you really think that GoLive! and
Dreamweaver are not used for professional sites, and that they are all
hand-coded? They are not just WYSIWYG editors, like FrontPage.

This problem with the large space appears on XP with IE7 as well. It is
obviously a IE7 issue (probably IE6 as well, although the OP says that it
was checked in 'IE')

The page validates perfectly, and Dreamweaver's Browser Compatibility Check
doesn't reveal any issues. There is no non-standard formatting. I am now
sure what you meant by that. The code is pretty messy though, in my
opinion.

There seems to be two overlapping tables where this space is appearing in
IE7. I have never used tables for formatting, as CSS was already around
when I learnt some web-design, so I cannot see why this problem with IE7
appears. I'd suggest stop using the old tables kludge and move onto CSS for
formatting, with divs and floats, although that would mean redoing the whole
site and working in an entirely new way.

ss.

On Wed, 16 Apr 2008 09:49:10 -0700, Alley Cat Smith
<> wrote:

>I tested it first thing this morning and the report says
>
>http://validator.w3.org/check?uri=ht....barnlivin.com
>
>They say no errors, GoLive says no errors.

We're not talking mechanical errors rather appearance which validators
don't care about. I see the same thing you client does. Huge gaps
between paragraphs. As I said before it is the software you're using
to generate the HTML that is messing things up. If you don't
understand HTML you're going to have a devil of a time fixing it since
looking briefly at the markup there are all kinds of excessive height
statements, divisions and other garbage code that's causing the
problem.

The point is while the markup may be valid and pass a validator it is
written in a very clumsy way (common for hand holding HTML editors)
and because of it especially when also using style sheets the results
for SOME may be rather ugly.

Since the web page in question is very simple in nature all that's
really required if you're going to use tables is have a two column
one. All the images would go in the first, all you text in the second.
There is no need to add height or width attributes. In fact they often
hurt rather than help.

A better way would be to write it using only CSS rules.

"Alley Cat Smith" <Alley Cat > wrote in
message news1B0A66B-F07A-483E-9031-...
> She says "Home page has a big gap (3 inches) between quote on top and
> second
> paragraph."
>
> http://www.barnlivin.com/
>

This page looks fine to me.

> And on Services page - last words of bulleted sentences she says are
> aligned
> way on the left.
>
> http://www.barnlivin.com/services.html

Yes I am seeing this also. Probably due to my font size being set to large
system wide, not just in IE. It looks like this:

- Schematic to Final Design
- Prime Contractor Selection
- Selection of Materials, Appliances, Fixtures
- Manage the Permitting and Inspection Process
- Developing a Project Budget and Schedule
- Documentation for Obtaining a Construction
Loan
- Negotiate Costs with Prime Contractors and
Suppliers
- Develop Owner-Contractor Agreements
- Formulate and Monitor Project Schedules
- Construction Oversight to Observe Progress,
Design
Compliance, and Quality of Work
- Manage the Disbursement of Funds
- Project Closeout Procedures

I'm using IE7 with Vista Home Premium and both pages you've linked to look
absolutely fine here! No unusual gaps or spaces at all. I don't know what to
say.

LesleyO

"Alley Cat Smith" <Alley Cat > wrote in
message news1B0A66B-F07A-483E-9031-...
> My client loves the website I designed for her- at home.
> At work she is running Vista with MicroSoft Outlook and she says it looks
> crazy. Screwy spacing, out of alignment, letters too big and adding extra
> lines. The weird thing is that she printed the pages and they are fine!
>
> Now I checked this website this morning on Mozilla, Safari, Internet
> Explorer, Netscape on two computers - both Macs--and they all looked
> great.
>
> She says "Home page has a big gap (3 inches) between quote on top and
> second
> paragraph."
>
> http://www.barnlivin.com/
>
> And on Services page - last words of bulleted sentences she says are
> aligned
> way on the left.
>
> http://www.barnlivin.com/services.html
>
> I'm not seeing any of this. Is it her work computer? Or how do I fix this
> for her?
>
> Opinions cheerfully accepted,
> Alley Cat

That web page is displayed best if you have a wide-screen monitor.
Windows Vista is optimized for use with wide-screen monitors.

Example:
http://www.newegg.com/Product/Produc...82E16824001236


--
Carey Frisch
Microsoft MVP
Windows Desktop Experience -
Windows System & Performance

---------------------------------------------------------------

"Alley Cat Smith" wrote:

I tested it first thing this morning and the report says

http://validator.w3.org/check?uri=ht....barnlivin.com

They say no errors, GoLive says no errors.

"LesleyO " <> wrote in message
news:efPk0p$...
> I'm using IE7 with Vista Home Premium and both pages you've linked to look
> absolutely fine here! No unusual gaps or spaces at all. I don't know what
> to say.


That's because he has fixed the issue with the tables since I posted.

ss.