dpi / resolution / web pages

[Guest]

hello everyone,

I'm confused about this subject in general, but here's my concise issue:

I have chosen to set my Windows XP on the 'large' 125% dpi setting because
it seems to make it easier to generally see whatever I'm looking at. I toyed
with the font size options but didn't really grasp what specifically was
changing, so stayed with the dpi setting mentioned above.

Now; what specifically should my increased dpi (resolution?) setting have an
effect on? Everything I view in XP? I'm not convinced that some Mozilla
software is playing by the same rules, for example.

This brings me to a web authoring conundrum:

Am I right in thinking that the fonts and sizes in a correctly coded /
css'ed website should _always_ appear the same in any browser, regardless of
the end user's dpi setting(s)? ie the website should 'force through' a
consistent size etc.
(I'm assuming here that the end user has set /left their browser to allow
the web page to dictate such things. I'm also not talking about slight
cross-browser compatibility rendering issues.)

I hope you can clarify these matters for me, as I can then decide how best
to code my web pages. You can appreciate I'm currently going round in circles
to a large extent.

Many thanks,
Lee
England

 

[Burt]

Lee,
I also build quite a few websites and have come across some info that
might be of interest to you. When you build a site, you can set the font
size and/or picture size as you see it on YOUR own computer, but if you go
to somebody elses computer and look at it, it might be totally different due
to their own settings ie: their screen res and their dpi settings and also
the TEXT SIZE that they can set in their own browser. So what I have found
to work the best is to select sizes when building your pages that are
somewhere in the middle of the spectrum for size.. ie: use size 3 or 4 for
most fonts for a normal or reasonably normal size on the viewers machine...
I also know that there are some vb scripts that you can use that will resize
the recipients aspects, but I am reluctant to use them... For one, it makes
the page take longer to load on their machine. If you need to go to say a
larger font than size=7, then you can always use a <style> sheet for the
text. I work on customer computers nearly daily and I see settings that
they have come up with that would make it nearly impossible for a Web
Designer to get around.... Some people are "different" as to how they like
their machines set up...
I hope this help you some..
--
Burt
The Old Alaskan
MVP's listed on TECKPAGE
http://www.cvinternet.net/~smokydog
http://www.cvinternet.net/~smokydog/teckpage.htm

 

[Guest]

Thanks Bert,

That's certainly a big help.

I'm still curious though as to why some websites I look at don't seem to be
affected in the way I've described, whereas others do.
Maybe a microsoft person here can explain specifically how a web browser
should react when used on a pc with a non-standard dpi setting.

So Bert, with my web-authoring hat on, should I _not_ attempt to code my
pages with my XP set to 125% dpi?

thanks again,
lee

 

[Guest]

with apologies, for Bert please read Burt.

 

[David Candy]

(Resolutionpx / 125dpi) = LogicalInches

MonitorInches/LogicalInches is the ratio of logical inches to physical inches.

Web pages are specified in pixels or logical units (inch, point (72/in), or twips (20/pt)). A lot mix units (fonts in points but other things in pixels).

Likewise a dialog must be designed specially to handle anything else but 96dpi. Typically fonts are in points and measurements in pixels. Only modern designed apps can handle this seemlessly and this is mainly because they are getting ready for high dpi displays.

 

[Burt]

Lee,
David Candy came in here with a professional view point that you can
take to the bank.. The 125 DPI setting that you use on your local machine
will not affect what the opener of your website sees, only what YOU see on
your machine.. However, if I were you, to get a better view of what the
recipient "MIGHT" see, is to set your display setting say to 1024 X 768 on a
19" monitor and anything less than that size, I would recommend 800 X 600
res.. "with the dpi on your machine set at 96 as David mentioned... This
will be about as close to the middle of the road as you are going to get.
--
Burt
The Old Alaskan
MVP's listed on TECKPAGE
http://www.cvinternet.net/~smokydog
http://www.cvinternet.net/~smokydog/teckpage.htm

 

[Guest]

thanks again Burt and David,

I need to learn and grasp the principles that David for eg has mentioned.

It sounds like my belief was wrong, that a 'correctly' coded webpage will
force through its intended size etc regardless of the end user's resolution
settings. ie, I believed (assuming the end user's browser is allowing
webpages to dictate fonts and sizes) that the browser would treat such a
webpage as 'preset' and show it disregarding the general XP dpi or font size
settings. Can I confirm that I indeed was wrong in believing this?

Also, although I have chosen to use my XP in the large 125% dpi mode because
it makes most things appear larger (not talking specifically about viewing
webpages) I don't understand _why_ it makes things look larger. ie, I would
have thought it just uses more 'dots per inch' implying clarity/detail may be
enhanced but within the same size.
Presumably this is how I should understand it :
The 'dots per inch' is 'pixels used to resolve the original image',
therefore using 'more pixels' to show something must mean it takes up more
screen space and therefore appears bigger. ie the pixels don't 'move' so more
pixels has to mean a larger viewed result. Have I got that right?

 

[Burt]

Lee,
You don't have that EXACTLY right, but you are close... Here is a point
of interest for you.
Open any website and go to View/Source and look at the FONT selection that
the web designer used... In MOST cases you will find that they name more
than ONE font... The reason for this is because if the END USER does not
happen to have the first font that the designer put on the page, then the
recipients computer will look for the second font in the list and on to the
third if neither of the other fonts are installed on recipients computer...
If all else fails in the browsers search for the fonts on the recipients
machine, most likely Windows will use Arial or maybe Times Roman or some
such default or it might even be Marietta font... Again, you cannot TOTALLY
control the recipients computer as for viewing your pages. Again, for
instance you call for a size 4 font on your webpage. If the recipient has
his setting in IE for small fonts, that would be close to the equivalent of
you having named it size 3 on YOUR machine and viewed it in that you are
using say Larger font in IE... It is a very IFFY thing when you start
writing web page code.. Like I told you in a diff reply, I have viewed my
own pages on friends computers that were set up with totally different
settings and found them in some cases to not look like I had planned... BUT,
it did teach me a lesson to be sure and put <BR> codes and such in the
proper place to FORCE their machine to put a break line where "I" want it.
There are a lot of tricks to this, but you can manage the recipients
computer to some extents with careful coding... I sure hope this gives you
more insight into this matter.
--
Burt
The Old Alaskan
MVP's listed on TECKPAGE
http://www.cvinternet.net/~smokydog
http://www.cvinternet.net/~smokydog/teckpage.htm

 

[Guest]

thanks again Burt,

I think the central issue that I have obsessed with, is the idea that any
_general_ non-standard resolution setting by the end user, if their browser
is set to allow webpages to dictate fonts /sizes, will NOT mean the website
is displayed as I intended it.

ie I now believe / think that _any_ non-standard resolution settings by the
end user will impact on a web design. Have I finally got this specififc
belief correct?

I can't really explain why I thought otherwsie; I always understood that my
local settings are of course only as _I_ see it, but I had a hunch that there
was some standard 'guaranteed' way of over-riding any settings at the user's
end.

 

[Burt]

Lee,
You are getting the message... You can control "some" aspects of what
the recipient sees on your site, but most likely not ALL of code as exactly
AS you coded it.. Some items WILL be as you coded, but other bits of code
may NOT look the same to the recipient.. I will reiterate what I said
earlier in this thread, use some fairly NORMAL settings as for font names,
font size and even font color. There are basically 256 font colors that are
recognized as definite web colors even though you have the option of coding
ANY of 16.8 Million colors in your code... Here again, maybe the recipients
machine has a video card that won't handle any more than the 256 basic
colors.. If that be the case, Windows will most likely choose the NEXT
appropriate color to display... I learned that the hard way too.. I have
found that if you put up a web site and did some exotic things on the pages,
it is a good idea to test it on OTHER computers as well as your own.. I have
several buddies that I go to there place and double check my pages on THEIR
machines the way THEY have them set up and occasionally I have to go back
home and redo certain parts of the code to get them cleaned up... I hope
all this brings you to a better understanding.
Burt

 

[David Candy]

The browser decides formatting. You merely suggest formatting to it. That's the essential concept. The browser decides. That's the underlying design goal. Things have been added to html because authors demanded it but at it's heart you describe the data (a heading, a paragraph, or a list) and the browser decides how to show it.

 

[Guest]

Thankyou both;

I've recently started to move away from my previous coding technique of
stuffing all the design detail into the html tags, in favour of using a css
template. I need to fully explore why this is the recommended technique, but
I understand the basic principle that the html should really be used only for
the physical structure.
The most obvious benefit _for me_ of a css sheet is of course to avoid
having to recode 60 odd pages for a slight or major generic design change!

Btw, I've started to re-jig my coding with a view to sticking to the 'em'
and '%' principle for sizes, which I now believe to be the most 'scalable'
techniques.
I'm still learning and have probably got the idea a little wrong, but
anyone's welcome to look at the code on these 2 pages if they want to tell me
how I'm doing:

http://www.incelsite.com/incelsite.css
http://www.incelsite.com/menu.shtml

btw, I believe I've got my DOCTYPE line in the wrong place for it to be
effective; apparently that line should be at the very start of the page ...?

 

[Burt]

David,
Thanks for the backup of what I said.... Just for the record: Your
replies are golden.
Burt

"David Candy" <.> wrote in message
The browser decides formatting. You merely suggest formatting to it. That's
the essential concept. The browser decides. That's the underlying design
goal. Things have been added to html because authors demanded it but at it's
heart you describe the data (a heading, a paragraph, or a list) and the
browser decides how to show it.

 

[Burt]

Lee,
I see a couple things wrong when I opened the source on your second
link.. First, you are right about the DOCTYPE, it is in the wrong place. I
don't think it really makes a lot of difference, but it should be at the
very TOP above the entering <html> tag. I didn't look the entire code over
because you are using some "Program" to build your html and I don't like all
the garbage they add to it.. I do all my webpage html in Notepad with no
helper programs.. You can build a much cleaner code that way. I am not
saying that it won't work, I just prefer to hand code my pages. Once you
have something going, you can do most of it with just copy/paste technique
to save a lot of typing.. I have hundreds of snippets of code saved in a
fairly easy to navigate file system, so to retrieve them for use is rather
simple..
Now at the bottom of the code in your second link I also saw an error
showing TWO </html> closure tags when you only need ONE of them at that
point.. Like I said, I didn't tear apart the whole thing, but I do see some
other little tidbits in there that I don't think are necessary..
Glad to be of help..
I was glad to see David Candy back up my messages to you... You can take
what he says to the bank and in the past, he has helped me much and so have
all the other MVP's on these groups.. I help where I can.
Burt

 

[David Candy]

<td class="menu" align="center" bordercolor="#cccccc" id="choice8" style="background-color:bisque; cursor:hand" onmouseover="movein(this,'Home')" onmouseout="moveout(this)">

Most of this should be in the css definition. Otherwise not much point using css. And your page becomes smaller. Align, bordercolor, & style (which is css itself) should be part of the css.

www.mvps.org/serenitymacros is entirely css. So is the attached hta.

 

[a nonymous]

|
| Thankyou both;
|
| I've recently started to move away from my previous coding technique of
| stuffing all the design detail into the html tags, in favour of using a css
| template. I need to fully explore why this is the recommended technique, but
| I understand the basic principle that the html should really be used only for
| the physical structure.
| The most obvious benefit _for me_ of a css sheet is of course to avoid
| having to recode 60 odd pages for a slight or major generic design change!
|
| Btw, I've started to re-jig my coding with a view to sticking to the 'em'
| and '%' principle for sizes, which I now believe to be the most 'scalable'
| techniques.
| I'm still learning and have probably got the idea a little wrong, but
| anyone's welcome to look at the code on these 2 pages if they want to tell me
| how I'm doing:
|
| http://www.incelsite.com/incelsite.css
| http://www.incelsite.com/menu.shtml
|
| btw, I believe I've got my DOCTYPE line in the wrong place for it to be
| effective; apparently that line should be at the very start of the page ...?


Go to: http://validator.w3.org/

Validate by URL
Address: [ http://www.incelsite.com/menu.shtml ] [Check]

You have 17 errors.

Go to: http://jigsaw.w3.org/css-validator/

Validate by URI
Enter the URI of a document (HTML with CSS or CSS only) you would like validated:
Address: [ http://www.incelsite.com/incelsite.css ] [Check]

You have 2 errors.

 

[Guest]

Ok; I find it difficult to interpret from the validator how I should correct
things.
Assuming my use of em and % in www/incelsite.css and www/menu.shtml is
correct, I have noticed this situation:

all looks normal in IE6 and Firefox when I have XP set on 96dpi. Good.

However, I do like working generally in 125% dpi, and although I expected
this to then 'screw up' my viewing of my pages on the web, I'm interested to
see that Firefox seems to be 'compensating' for my XP dpi setting whereas IE6
isn't. Firefox is in 'normal' text size mode and IE6 is in 'medium'.

Or, rather than Firefox doing some kind of compensation that IE isn't, is
it that IE6's idea of 'normal' is vastly different to Firefox's ?? Presumably
not, seeing as the same settings do compare very closely when in 96dpi.

out of interest, here are 2 screen grabs to show this:

http://www.incelsite.com/IE6.gif
http://www.incelsite.com/firefox.gif

thanks for any thoughts,
lee

 

[a nonymous]

| Ok; I find it difficult to interpret from the validator how I should correct
| things.

Study the HTML and CSS specifications at http://www.w3.org/

(Who|what)ever coded those .html and .css files does not understand how to code
valid HTML and CSS. Any web browser will do its best to render the nonsense it
finds in those .html and .css files.

 

[Burt]

Lee,
There is one more possible work around for your need to use the 125DPI
setting..
Why don't you try dropping your Sreen Resolution on notch and set the DPI
back to 96?
You might have better luck.. It will display more properly.
HTH,
--
Burt
The Old Alaskan
MVP's listed on TECKPAGE
http://www.cvinternet.net/~smokydog
http://www.cvinternet.net/~smokydog/teckpage.htm

 

[Guest]

hello Trevor and everyone,

That menu page is actually framed in the actual site, so is always available
as a navigator.
btw I saw the Frpntpage group but I'm not using Frontpage. My motive for
starting this thread was to understand XP's resolution functionality.

Yes, I too am a newbie to 'more than basic' html and css, and I don't
pretend I have even grasped those properly yet. I find it very hard to learn
specifics from documentation and specifications, whilst trying then to place
how to put it all into practice. I need a training course.

That 'menu' script wasn't written by me; I just used it wholesale from
hotscripts.com or somewhere similar. There are bits of it that I don't
understand or use.

Burt; absolutely, working within XP's 96dpi does now show the same pages
fine in IE6 and Firefox, but I was querying why Firefox apparently ignores or
compensates for the higher resolution setting of 125%. This was certainly
unexpected although handy.
Someone else I've been mentioning this to has concluded that IE6 must be
more closely tied to the OS than Firefox, although I'm asking at Mozilla to
find out why. I mean, it's the same OS running both so I would have expected
the same result.