dynamic sizing text

[Cartoper]

I am working on a browser kiosk needs to be able to be run at multiple
screen resolutions. What I would like to do is keep the text the same
size relative to the screen, all the time.

In other words, lets say there is a table with 10 rows and 4 columns
that is centered with a 5% of the screen as a boarder around it. If
you have two 17 inch monitors, one at 1024x768 and the other at
1280x1024 sitting next to each other, I would like the table and the
text to appear the same physical size on both monitors.

I believe the table is straight forward, using percentages, but is
there some way (I am thinking that I might want to be using one of
those fancy units other then px or pt) to scale the text so it appears
the same size on both monitors?

Cartoper

[Jukka K. Korpela]

Scripsit Cartoper:

I am working on a browser kiosk needs to be able to be run at multiple
screen resolutions. What I would like to do is keep the text the same
size relative to the screen, all the time.

What makes you think this is an HTML issue?

I would like the table and the
text to appear the same physical size on both monitors.

Why? If you simply do nothing to set any font size (though you might set
body { font-size: 100% } in CSS to overcome some browser bugs), the user
will be able to choose the font size at least in a coarse way, unless you
take extra trouble to prevent that. Just include simple instructions on this
near the kiosk.

Anyway, this does not belong to c.i.w.a.html.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

[David E. Ross]

On 9/6/2007 12:28 PM, Jukka K. Korpela wrote:

Scripsit Cartoper:

>I am working on a browser kiosk needs to be able to be run at multiple
screen resolutions. What I would like to do is keep the text the same
size relative to the screen, all the time.

What makes you think this is an HTML issue?

> I would like the table and the
text to appear the same physical size on both monitors.

Why? If you simply do nothing to set any font size (though you might set
body { font-size: 100% } in CSS to overcome some browser bugs), the user
will be able to choose the font size at least in a coarse way, unless you
take extra trouble to prevent that. Just include simple instructions on this
near the kiosk.

Anyway, this does not belong to c.i.w.a.html.

In a kiosk, the user usually has little ability to choose viewing
properties, including adjusting font sizes. This is one of the few
instances where the developer must set font sizes.

If this is not something that can be handled via HTML (and I doubt if it
can), a proper response to a request for help would be to point the
original poster to a valid source of information. After all, you might
someday need help, too. When that happens, do you want to be dismissed
abruptly just because you don't know where to ask?

--

David E. Ross
<http://www.rossde.com/>.

Anyone who thinks government owns a monopoly on inefficient, obstructive
bureaucracy has obviously never worked for a large corporation. © 1997

[David E. Ross]

On 9/6/2007 12:14 PM, Cartoper wrote:

I am working on a browser kiosk needs to be able to be run at multiple
screen resolutions. What I would like to do is keep the text the same
size relative to the screen, all the time.

In other words, lets say there is a table with 10 rows and 4 columns
that is centered with a 5% of the screen as a boarder around it. If
you have two 17 inch monitors, one at 1024x768 and the other at
1280x1024 sitting next to each other, I would like the table and the
text to appear the same physical size on both monitors.

I believe the table is straight forward, using percentages, but is
there some way (I am thinking that I might want to be using one of
those fancy units other then px or pt) to scale the text so it appears
the same size on both monitors?

Cartoper

I'm assuming that the kiosks are part of an intranet (not Internet)
where both the kiosk configurations and the server are both under the
same controlled configuration.

First, you need to determine which kiosk monitor is requesting the page
or at least the characteristics of the kiosk monitor. I have seen
statistics that indicate there is a way to do this in general, but I
don't know how. In your case, however, if your monitors have fixed IP
addresses or IDs, you can use those.

If your server is Apache, you can use server-side includes (SSIs) to
check the monitor ID or IP address and embed the appropriate CSS into
the HTML file being served. The embedded CSS should contain the
necessary font-sizing specifications.

The IP address of a Web client is Apache environment variable
REMOTE_ADDR. The ID of a kiosk can be set in the kiosk's browser as
part of its user agent (UA) string unique to each kiosk; the UA string a
Web client is Apache environment variable HTTP_USER_AGENT .

For this to work, the SSI script will need to do a table look-up on each
ID or IP address to determine which CSS fragment to embed within the
HTML. Then, if a kiosk's monitor is changed, the lookup table will
require a corresponding change.

--

David E. Ross
<http://www.rossde.com/>.

Anyone who thinks government owns a monopoly on inefficient, obstructive
bureaucracy has obviously never worked for a large corporation. © 1997

[Ben C]

On 2007-09-06, Cartoper <ca******@gmail .comwrote:

I am working on a browser kiosk needs to be able to be run at multiple
screen resolutions. What I would like to do is keep the text the same
size relative to the screen, all the time.

In other words, lets say there is a table with 10 rows and 4 columns
that is centered with a 5% of the screen as a boarder around it. If
you have two 17 inch monitors, one at 1024x768 and the other at
1280x1024 sitting next to each other, I would like the table and the
text to appear the same physical size on both monitors.

I believe the table is straight forward, using percentages, but is
there some way (I am thinking that I might want to be using one of
those fancy units other then px or pt) to scale the text so it appears
the same size on both monitors?

You can just set a font-size in inches (in) or cm.

How well the result will tally with exact numbers of wavelengths of
Helium-Neon laser light in a vacuum depends on how the kiosk and browser
are set up, but it's worth a try.

What's the browser and kiosk OS?

[André Gillibert]

Ben C wrote about setting a font size proportional to the screen size in a
kiosk:

You can just set a font-size in inches (in) or cm.

How well the result will tally with exact numbers of wavelengths of
Helium-Neon laser light in a vacuum depends on how the kiosk and browser
are set up, but it's worth a try.

I think that most user agents stupidly assume that any screen has 72
pixels per inch.
Since a point is 1/72th of inch, these user agents assume 1 point == 1
pixel.

Moreover, I think that that it isn't exactly what Cartoper wants.
He wants that, for a 15 inch screen, the font size so proportionally
smaller than for a 17 inch screen.

Cartoper wrote:

What I would like to do is keep the text the same size relative to the
screen, all the time.

Ben C wrote:

It's worth a try.

Yes.

What's the browser and kiosk OS?

Good question.
If the browser supports JavaScript and if it's not foolish to enable it,
then, it might be possible to dynamically modify the font size from the
screen size got in the JavaScript.
The browser may support something like the window.screen.w idth and
window.screen.h eight properties provided by Internet Explorer.

However, this would be an ugly hack.

--
You can contact me at <ta************ *****@yahoDELET ETHATo.fr>

[Cartoper]

On Sep 6, 5:41 pm, "André Gillibert"
<tabkanDELETETH IS...@yahodelet ethato.frwrote:

Moreover, I think that that it isn't exactly what Cartoper wants.
He wants that, for a 15 inch screen, the font size so proportionally
smaller than for a 17 inch screen.

You are correct, I don't mind if the font size is different sizes on
physically different size monitors, I just want to keep the font size
the same on one monitor regardless of the screen resolution.

On Sep 6, 4:03 pm, "David E. Ross" <nob...@nowhere .notwrote:

>
I'm assuming that the kiosks are part of an intranet (not Internet)
where both the kiosk configurations and the server are both under the
same controlled configuration.

This is correct, it is on a intranet.

On Sep 6, 4:45 pm, Ben C <spams...@spam. eggswrote:

What's the browser and kiosk OS?

The first phase of development is targeting a specific kiosk browser,
currently IE7. With the new version I am coding for Firefox. I will
be moving the kiosk browser to Firefox before the next release.

I am a ISV and it is my customers that will be setting up and
configuring my kiosk system. The issue I am currently having is that
customers are running the kiosk at all possible resolutions between
1024x768 and 1920x1200. As we all know, users are not always the
brights folks in the world, so I can imagine that some will set up the
two kiosk systems, side by side at different resolutions! I know from
experience that a lot of folks can not tell the difference between
1024x768 and 1280x1024. More importantly then just easing my
customer's life, I want to present a consistent look and feel across
all resolutions. In other words, when a customer runs the kiosk on a
30" monitor, which one will sooner or later, I want it to look like it
does on a more normal sized wide screen.

As I said the target browser is Firefox, but... In future versions of
the software, users will be able to surf the site on their computers,
so I don't want to do anything that is completely unique to Firefox,
to a degree. I do plan to use SVG, which is not native to IE6/IE7,
that bridge I will cross once I get there;)

As far as coding on the front and back ends, I am going to do both.
There is an apache server with both PHP and a custom Apache Module (in
C) and I will be using JavaScript in the browser for lots of things,
including Ajax. So I can do pretty much anything.

Cartoper

[Jonathan N. Little]

Cartoper wrote:

On Sep 6, 5:41 pm, "André Gillibert"
<tabkanDELETETH IS...@yahodelet ethato.frwrote:

>Moreover, I think that that it isn't exactly what Cartoper wants.
He wants that, for a 15 inch screen, the font size so proportionally
smaller than for a 17 inch screen.

You are correct, I don't mind if the font size is different sizes on
physically different size monitors, I just want to keep the font size
the same on one monitor regardless of the screen resolution.

Stop and think about this for a moment. I know that you do not want yo
mess up your pretty "to the pixel" kiosk layout but what if the use has
poor eyesight?

For example I finally showed a lady at our public library the Windows
Accessibility settings so she could bump up all her text where she could
see it with her very poor eye sight. This would be independent of the
browser...what then?

>
On Sep 6, 4:03 pm, "David E. Ross" <nob...@nowhere .notwrote:

>I'm assuming that the kiosks are part of an intranet (not Internet)
where both the kiosk configurations and the server are both under the
same controlled configuration.

This is correct, it is on a intranet.

On Sep 6, 4:45 pm, Ben C <spams...@spam. eggswrote:

>What's the browser and kiosk OS?

The first phase of development is targeting a specific kiosk browser,
currently IE7. With the new version I am coding for Firefox. I will
be moving the kiosk browser to Firefox before the next release.

Yep you can hack FF to kiosk mode but it doesn't disable CTRL +!

Maybe advisable to rethink your design.

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

[Andy Dingley]

On 6 Sep, 20:14, Cartoper <carto...@gmail .comwrote:

I am working on a browser kiosk needs to be able to be run at multiple
screen resolutions. What I would like to do is keep the text the same
size relative to the screen, all the time.

Do this in exactly the same way you'd write an accessible website.
body { font-size: 100% } and use fluid design techniques to make the
rest work no matter what the relative font sizes are. Don't use
physical dimensions in inches for font-size, even if that's the end
result you're after.

Then do the initial configuration of the kiosks such that the
browser's default font size is such to give you an acceptable physical
size for the text, on that particular hardware combination. Include
instructions for how to determine and configure this into the user
manual that's given to the kiosk operators, under the headline "How to
bring a dead kiosk back on-line after you have to swap out the
embedded PC/screen).
Kiosks are usually "public access" devices, often funded with
government funds to the project. Accessibility is thus even more
significant than usual for commercial web work. Although you should do
this anyway, it's often more prominent an issue for kiosks.

If you want to do even better, then use an on-screen HTML button and
some server-side code to change the CSS default size for body, based
on some sort of simple session variable. This is the only time I'd
advocate on-screen font size buttons (rather than letting users use
their browser controls) and the only time I'd change default font
sizes in the CSS. I'd do both of these for the same reason: the kiosk
user doesn't have a keyboard and so can't access the usual shortcuts.

Limit just how small the text size can be set. There's no reason for
anyone to make it smaller than will fit a "long line" (20 words) of
text onto the screen width. Maximum size is a bit more open-ended,
bbut you might limit this to the point where your fluid design finally
starts to break. Make sure that the size resets to the default after
the session timeout expires. Also make the font size buttons and their
text sized in % units, so that they remain vaguely findable after the
text has been scrolled down to the unreadable. Otherwise the local
chavs will find an amusing game of "Scroll the text size down, walk
away and make the kiosks unusable for others".

[Cartoper]

On Sep 6, 11:44 pm, "Jonathan N. Little" <lws4...@centra lva.net>
wrote:

Stop and think about this for a moment. I know that you do not want yo
mess up your pretty "to the pixel" kiosk layout but what if the use has
poor eyesight?

For example I finally showed a lady at our public library the Windows
Accessibility settings so she could bump up all her text where she could
see it with her very poor eye sight. This would be independent of the
browser...what then?

Jonathan, Thank you for the concern, but it is complete unnecessary.
The first version, which has been released was small and one of the
complaints was that everything was too small for touch screens. One
of the reasons I want to make the text scale is to keep it large, I am
thinking around 24pt on a 1024x768 screen. Even folks with the worst
eye sight should be able to read it!

Yep you can hack FF to kiosk mode but it doesn't disable CTRL +!

Maybe advisable to rethink your design.

Thank you, I didn't know about <Ctrl+ <+and <Ctrl+ <->,
interesting, it also works with IE7. But the way I to hack together
the current IE7 kiosk, those hot keys don't work. Considering I plan
to hack the FF kiosk the same way, I beleive that this too is a non
concern. I do appreciate the enlightenment.

P.S. If you would like to see a sample of the kiosk, only a snipet of
the code, go to mozilla.dev.tec h.svg and look at the "How to position
SVG image in div" thread.

Cartoper