469,290 Members | 1,930 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,290 developers. It's quick & easy.

Avoiding Text Anti-Aliasing

Hi,
I have some text on a page in a small font. The font size has been OK in
other applications, but in a web browser, the legebility suffers due to the
anti-aliasing. Is there a way to turn off anti-aliasing for small text from
the css, or is there something else I can do to make small text more
legible?

(Note, the text really does have to be small, as that is what is required
for the web-application. It is a system for use on screens of a fixed size,
in a specific place, not for general consumption)

Thanks,
Martin

--
Martin Eyles
ma**********@NOSPAM.bytronic.com
Nov 9 '05 #1
22 10291
"Martin Eyles" <ma**********@NOSPAM.bytronic.com> wrote:
I have some text on a page in a small font.
How small?
The font size has been OK in
other applications, but in a web browser, the legebility suffers due to the
anti-aliasing. Is there a way to turn off anti-aliasing for small text from
the css,
Font anti-aliasing is typically an OS feature, a user may have (some)
control over it, you as an author do not (and that's a good thing).
or is there something else I can do to make small text more
legible?
If your text is illegible then it's to small. First make sure that you
use the user's default size for normal body text, only for non essential
content is it acceptable to de-emphasize text by reducing it's size.
This should be done in moderation, I'd consider anything below 80% of
the user's default unacceptably small.
(Note, the text really does have to be small, as that is what is required
for the web-application.
Irrelevant.
It is a system for use on screens of a fixed size,


It's unlikely to be a web-application (in which case you have no idea on
what hardware it is going to run), *and* something like a dedicated
kiosk system.

--
Spartanicus
Nov 9 '05 #2
Martin Eyles wrote:
Hi,
I have some text on a page in a small font. The font size has been OK in
other applications, but in a web browser, the legebility suffers due to the
anti-aliasing. Is there a way to turn off anti-aliasing for small text from
the css, or is there something else I can do to make small text more
legible?


GIF or PNG
Nov 9 '05 #3
"Spartanicus" <in*****@invalid.invalid> wrote in message
news:85********************************@news.spart anicus.utvinternet.ie...
"Martin Eyles" <ma**********@NOSPAM.bytronic.com> wrote:
I have some text on a page in a small font.


How small?


ok, I put a sample at
http://www.bytronic.com/tests/test5.png

This is the font size I am intending to use.
The font size has been OK in
other applications, but in a web browser, the legebility suffers due to theanti-aliasing.
When I use this font in some other development systems, it isn't
anti-aliased, and the stroke of the text is then a pixel wide in solid
black, rather than what you see here
Is there a way to turn off anti-aliasing for small text from
the css,


Font anti-aliasing is typically an OS feature, a user may have (some)
control over it, you as an author do not (and that's a good thing).


This may be possible, is there an option in MSIE (the browser all the
customers will be using).
or is there something else I can do to make small text more
legible?


If your text is illegible then it's to small. First make sure that you
use the user's default size for normal body text, only for non essential
content is it acceptable to de-emphasize text by reducing it's size.
This should be done in moderation, I'd consider anything below 80% of
the user's default unacceptably small.


All the text sizes for the entire system is being specified in pixels. This
is for a fixed layout on 1024*768, and is essentially replacing some other
software, and looking as close as possible to it.
(Note, the text really does have to be small, as that is what is required
for the web-application.


Irrelevant.


Entirely relevant, it is a requirement of the system
It is a system for use on screens of a fixed size,


It's unlikely to be a web-application (in which case you have no idea on
what hardware it is going to run), *and* something like a dedicated
kiosk system.


Unlikely it may sound, but true. It will run on closed systems, like a
kiosk, but some of these may be off site, accesing pages via the internet.

Thanks for your help,
Martin

--
Martin Eyles
ma**********@bytrNOSPAMonic.com
Nov 9 '05 #4
"C A Upsdell" <""cupsdellXXX\"@-@-@XXXupsdell.com"> wrote in message
news:6a******************************@rogers.com.. .
Martin Eyles wrote:
Hi,
I have some text on a page in a small font. The font size has been OK in other applications, but in a web browser, the legebility suffers due to the anti-aliasing. Is there a way to turn off anti-aliasing for small text from the css, or is there something else I can do to make small text more
legible?


GIF or PNG


The text is comming from a database, so could say anything. Is the a way of
turning any text into GIF or PNG on the server side (The back end is written
in VB.NET)? What kind of badwidth penalty would I suffer (there are quite a
few labels per page, which could all require a unique image, although they
would be 4 colour at most (text, background and border colours))

--
Martin Eyles
ma**********@NOSPAM.bytronic.com
Nov 9 '05 #5
"Martin Eyles" <ma**********@NOSPAM.bytronic.com> wrote...
"Spartanicus" <in*****@invalid.invalid> wrote...
"Martin Eyles" <ma**********@NOSPAM.bytronic.com> wrote:
I have some text on a page in a small font.


How small?


ok, I put a sample at
http://www.bytronic.com/tests/test5.png

This is the font size I am intending to use.
The font size has been OK in
other applications, but in a web browser, the legebility suffers due to theanti-aliasing.


When I use this font in some other development systems, it isn't
anti-aliased, and the stroke of the text is then a pixel wide in solid
black, rather than what you see here


Added an example of how I want it to look at
http://www.bytronic.com/tests/test6.png

--
Martin Eyles
ma**********@NOSPAM.bytronic.com
Nov 9 '05 #6
"Martin Eyles" <ma**********@NOSPAM.bytronic.com> wrote:
ok, I put a sample at
http://www.bytronic.com/tests/test5.png

This is the font size I am intending to use.
>Is there a way to turn off anti-aliasing for small text from
>the css,
Font anti-aliasing is typically an OS feature, a user may have (some)
control over it, you as an author do not (and that's a good thing).


This may be possible, is there an option in MSIE (the browser all the
customers will be using).


A screenshot doesn't help. You'd have to put up a sample of the actual
code, list what version of IE is going to be used, what settings it
uses, what OS it runs on, and what the font settings of the OS are.

On the MS OS's that I'm familiar with (W98 & Windows 2000), font
anti-aliasing needs to be explicitly enabled by the user (Control Panel Display > effect tab > "Smooth edges of screen fonts") and it only

works on larger font sizes, smaller fonts are not affected.
It's unlikely to be a web-application (in which case you have no idea on
what hardware it is going to run), *and* something like a dedicated
kiosk system.


Unlikely it may sound, but true. It will run on closed systems, like a
kiosk, but some of these may be off site, accesing pages via the internet.


In that case it isn't a "web-application", your application simply uses
the internet. Note the "www" in this group's name, strictly speaking
questions on private systems are off-topic in this group.

--
Spartanicus
Nov 9 '05 #7
Martin Eyles wrote:

[...] Is there a way to turn off anti-aliasing for small text from
the css, [...]

No.
Use Verdana or Vera Sans? They have a large x-height that makes them
look bigger. And Verdana was designed for tiny size on a monitor. Of
course, not everyone has those fonts loaded.
Font-blurring, er, anti-aliasing, is an option of the OS' graphics
system. Not something that can be controlled from a browser.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
Nov 9 '05 #8
Martin Eyles wrote:
the css, or is there something else I can do to make small text more
legible?


GIF or PNG


The text is comming from a database, so could say anything. Is the a way of
turning any text into GIF or PNG on the server side (The back end is written
in VB.NET)? What kind of badwidth penalty would I suffer (there are quite a
few labels per page, which could all require a unique image, although they
would be 4 colour at most (text, background and border colours))

There is the gd library <http://www.boutell.com/gd/>. It exists as a
loadable library or a standalone app. It has been a part of PHP for a
while, and can be used through CGI calls. I do not know if there is a VB
counterpart.
Such a method has its drawbacks, of course.
- the increased server processing
- the text cannot wrap since it is not text anymore
- the user cannot resize the text to read it

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
Nov 9 '05 #9
In article <11*************@corp.supernews.com>,
"Martin Eyles" <ma**********@NOSPAM.bytronic.com> wrote:
ok, I put a sample at
http://www.bytronic.com/tests/test5.png

This is the font size I am intending to use.
Ouch! Unreadable. First thing I did after trying to read it in the top
left corner of Safari was to bring it up in Opera and magnify 200%
Unlikely it may sound, but true. It will run on closed systems, like a
kiosk, but some of these may be off site, accesing pages via the internet.


Put Opera (it is free) on the systems, running in full Kiosk mode.
Pages still show in the size you have selected, however any customer
with problems viewing it (and who knows the Opera zoom code) can zoom
enough to be able to read it?

On your existing text size, were I one of your customers, I'd now be a
customer someplace else.

--
http://www.ericlindsay.com
Nov 9 '05 #10
In article <11*************@corp.supernews.com>,
"Martin Eyles" <ma**********@NOSPAM.bytronic.com> wrote:
Added an example of how I want it to look at
http://www.bytronic.com/tests/test6.png


That is considerably more readable, but personally I would still zoom
it. Well, actually, since I set my browser to expand every font to a
minimum of 14 point, your layout would have broken anyhow.

Not letting your reader see things at a size they they like to read it
at seems so anti-audience that I don't know what to say. It is the sort
of thing I associate with ancient books in 6 point type, not with modern
computer displays. You have to be setting yourself up for someone to
claim discrimination against people with any visual impairment.

I suppose you could supply each computer with a large magnifying glass.

--
http://www.ericlindsay.com
Nov 9 '05 #11
> The text is comming from a database, so could say anything. Is the a way of
turning any text into GIF or PNG on the server side (The back end is written
in VB.NET)?
I don't know in VB but in PHP or Java, this is quite easy.
What kind of badwidth penalty would I suffer (there are quite a
few labels per page, which could all require a unique image, although they
would be 4 colour at most (text, background and border colours))


Images will be much bigger than the corresponding text. But if the gauge
is already an image, you could join the both. This is a solution to
investigate.

--
My desktop is worth a million of dollars. Put an icon on it.
http://www.milliondollarscreenshot.com/
Nov 10 '05 #12
used font-size: 9px; font-family: sans-serif, and that has fixed the
problem. No longer anti-aliased, and much more readable. I have no idea what
font it was using - I think it must be a default that ASP.NET adds
automatically, because I had left it blank (and this normally defaults to
serif or sans-serif in IE/FF). Interestingly, I tried verdana, and the
problem remained.

Thanks for your help, it got me thinking along the right lines!

Martin

--
Martin Eyles
ma**********@NOSPAM.bytronic.com

"Jim Moe" <jm***************@sohnen-moe.com> wrote in message
news:Zs******************************@giganews.com ...
Martin Eyles wrote:

[...] Is there a way to turn off anti-aliasing for small text from
the css, [...]

No.
Use Verdana or Vera Sans? They have a large x-height that makes them
look bigger. And Verdana was designed for tiny size on a monitor. Of
course, not everyone has those fonts loaded.
Font-blurring, er, anti-aliasing, is an option of the OS' graphics
system. Not something that can be controlled from a browser.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

Nov 10 '05 #13
"Eric Lindsay" <NO**********@ericlindsay.com> wrote in message
news:NO********************************@freenews.i inet.net.au...
Put Opera (it is free) on the systems, running in full Kiosk mode.
Pages still show in the size you have selected, however any customer
with problems viewing it (and who knows the Opera zoom code) can zoom
enough to be able to read it?


Firstly, I don't want adverts from opera.

Secondly, I need activex.

Thirdly, windows has a magnifying glass, which we can use.

Thanks anyway though. :-)

--
Martin Eyles
ma**********@NOSPAM.bytronic.com
Nov 10 '05 #14
"Eric Lindsay" <NO**********@ericlindsay.com> wrote in message
news:NO********************************@freenews.i inet.net.au...
In article <11*************@corp.supernews.com>,
"Martin Eyles" <ma**********@NOSPAM.bytronic.com> wrote:
Added an example of how I want it to look at
http://www.bytronic.com/tests/test6.png


That is considerably more readable, but personally I would still zoom
it. Well, actually, since I set my browser to expand every font to a
minimum of 14 point, your layout would have broken anyhow.


There is a lot of data on the screen, and this is the only way to fit it all
on without scroll bars. For most users of the system, this is the best way
to look at the screen, and it matches the software they are already using.
It also gives the best overview of the system. The Screen is essentially
three sets of bar graphs, so an accesible version would probably involve
splitting the screen into three. The added space would then allow bigger
bars, and larger fonts. However, this makes it harder for most users of the
system, so isn't on the main versions of the screens.

--
Martin Eyles
ma**********@NOSPAM.bytronic.com
Nov 10 '05 #15
"Spartanicus" <in*****@invalid.invalid> wrote in message
news:d2********************************@news.spart anicus.utvinternet.ie...
"Martin Eyles" <ma**********@NOSPAM.bytronic.com> wrote:
ok, I put a sample at
http://www.bytronic.com/tests/test5.png

This is the font size I am intending to use.
>Is there a way to turn off anti-aliasing for small text from
>the css,

Font anti-aliasing is typically an OS feature, a user may have (some)
control over it, you as an author do not (and that's a good thing).
This may be possible, is there an option in MSIE (the browser all the
customers will be using).


A screenshot doesn't help. You'd have to put up a sample of the actual
code, list what version of IE is going to be used, what settings it
uses, what OS it runs on, and what the font settings of the OS are.


Well, it may not have helped you, but other people could see what I meant,
and have offered lots of help, which has solved my problem.
It's unlikely to be a web-application (in which case you have no idea on what hardware it is going to run), *and* something like a dedicated
kiosk system.


Unlikely it may sound, but true. It will run on closed systems, like a
kiosk, but some of these may be off site, accesing pages via the

internet.
In that case it isn't a "web-application", your application simply uses
the internet. Note the "www" in this group's name, strictly speaking
questions on private systems are off-topic in this group.


Imagine that this application is like the amazon accounts page. This is only
accesible to amazon customers, but is still on the world wide web. The same
can be said for my system. The only difference is that we have set up the
customer PCs in a particular way, but that doesn't stop the page being on
the world-wide web. Therefore this post in *not* off-topic.

Martin

--
Martin Eyles
ma**********@NOSPAM.bytronic.com
Nov 10 '05 #16
On Thu, 10 Nov 2005, Martin Eyles blurted out atop a fullquote:
used font-size: 9px; font-family: sans-serif, and that has fixed the
problem.


It sure seems to have "fixed" a problem in place :-{

A pity you didn't solve the real problem instead!

It's very noticeable that you've ignored the better quality advice you
got, and took only what suited your immediate demands. I feel sorry
for your users, particularly any who have eyesight difficulties.

bye
Nov 10 '05 #17
"Martin Eyles" <ma**********@NOSPAM.bytronic.com> wrote:
>> It's unlikely to be a web-application (in which case you have no ideaon >> what hardware it is going to run), *and* something like a dedicated
>> kiosk system.
>
>Unlikely it may sound, but true. It will run on closed systems, like a
>kiosk, but some of these may be off site, accesing pages via the
internet.

In that case it isn't a "web-application", your application simply uses
the internet. Note the "www" in this group's name, strictly speaking
questions on private systems are off-topic in this group.


Imagine that this application is like the amazon accounts page. This is only
accesible to amazon customers, but is still on the world wide web. The same
can be said for my system. The only difference is that we have set up the
customer PCs in a particular way


Amazon accounts pages are publicly accessible with systems beyond the
control of Amazon. If you have control over the client systems then it's
a private network, this is off topic here.
, but that doesn't stop the page being on
the world-wide web.


Pages that are to accessed with a browser connecting through the
internet does not constitute a web page.

--
Spartanicus
Nov 10 '05 #18
"Alan J. Flavell" <fl*****@ph.gla.ac.uk> wrote in message
news:Pi*******************************@ppepc56.ph. gla.ac.uk...
On Thu, 10 Nov 2005, Martin Eyles blurted out atop a fullquote:
used font-size: 9px; font-family: sans-serif, and that has fixed the
problem.


It sure seems to have "fixed" a problem in place :-{

A pity you didn't solve the real problem instead!

It's very noticeable that you've ignored the better quality advice you
got, and took only what suited your immediate demands. I feel sorry
for your users, particularly any who have eyesight difficulties.

bye


Just a point of explanation. I have a lot of data to fit on this screen, and
for most of my users the best option is to use small text. My problem was
that IE was making this text illegible, even though this size could be
legible.

I am aware of accesibility concerns. However, for those users with impared
vision, a change in font size on the screens is not sufficuent. For these
user I will split the page into 3 pages, so that everything on the pages can
be made bigger. I already know how to do this, that's why my request was
about the small text, as that is what I had a problem doing.

Martin

--
Martin Eyles
ma**********@NOSPAM.bytronic.com
Nov 10 '05 #19
On Thu, 10 Nov 2005, Martin Eyles wrote:
Just a point of explanation. I have a lot of data to fit on this
screen,
But you haven't realised that *that* is your primary problem, and it's
not solved by creating an *additional* problem.
and for most of my users the best option is to use small text. My
problem was that IE was making this text illegible, even though this
size could be legible.
There's a well known large UK corporation, which shall remain
nameless, whose public web pages were (and still are, to a great
extent) user hostile. At the time, they were faulted for specifying
absolute font sizes, relying on unsolicited pop-up windows devoid of
browser controls, relying on javascript and cookies, and so on. It
was almost impossible to find anything.

I was told by an insider, however, that they had realised the scope
for litigation in relation to their *internal* - intranet - web pages,
which also had to be used by staff with various disabilities. He told
me they were practically in panic trying to re-design the internal
pages according to the principles of the WAI, to fend off suits for
discriminating against disabled staff, constructive dismissal and the
like.

This confirmed my belief that supposedly internal pages, designed for
what the designer supposes to be a well-control display situation,
still stand to learn a lot from WWW good practice.

We've also had service engineers here who grumbled about access to
their own company's intranet, that had been designed for their
corporate office PCs and didn't work, or were excessively hard to use,
from the service engineers' laptops and notepads. I take that as
further confirmation of the appropriateness of WAI guidelines.

And for sure if folk come here and ask questions about their intranet,
they are going to get some answers based on the Usenauts' perceptions
of WWW good practice (this is, after all, a WWW group). They are
going to take that advice or to leave it, as they choose; but, no
matter how many times they come back with an attempt to convince the
group that the advice doesn't apply to them, they aren't likely to win
the argument, I'm afraid.
I am aware of accesibility concerns. However, for those users with
impared vision, a change in font size on the screens is not
sufficuent.
So draw the right consequences from your own argument.
For these user I will split the page into 3 pages, so that
everything on the pages can be made bigger.


So now you'd have two problematic designs instead of one, and still
not have the flexibility to meet a wide range of needs.

Well, I've done my best. Bye now.
Nov 10 '05 #20
On Wed, 09 Nov 2005 13:19:45 GMT, in
comp.infosystems.www.authoring.stylesheets , Spartanicus
<in*****@invalid.invalid> in
<85********************************@news.spartanic us.utvinternet.ie>
wrote:
"Martin Eyles" <ma**********@NOSPAM.bytronic.com> wrote:

[snip]
It is a system for use on screens of a fixed size,


It's unlikely to be a web-application (in which case you have no idea on
what hardware it is going to run), *and* something like a dedicated
kiosk system.


There is a real, but rarely discussed, distinction between a web (i.e.
www) application and a HTTP/HTML/Browser application. The former makes
use of a somewhat larger set of interconnected networks, the latter
uses most of the same technologies but on a more restricted network. I
suspect that the latter will continue to grow in popularity.
--
Matt Silberstein

Do something today about the Darfur Genocide

http://www.beawitness.org
http://www.darfurgenocide.org
http://www.savedarfur.org

"Darfur: A Genocide We can Stop"
Nov 10 '05 #21
On Wed, 09 Nov 2005 15:54:07 GMT, in
comp.infosystems.www.authoring.stylesheets , Spartanicus
<in*****@invalid.invalid> in
<d2********************************@news.spartanic us.utvinternet.ie>
wrote:

[snip]
In that case it isn't a "web-application", your application simply uses
the internet. Note the "www" in this group's name, strictly speaking
questions on private systems are off-topic in this group.


Was that a deliberate decision by anyone? Or is that an afterthought?
I really don't know.
--
Matt Silberstein

Do something today about the Darfur Genocide

http://www.beawitness.org
http://www.darfurgenocide.org
http://www.savedarfur.org

"Darfur: A Genocide We can Stop"
Nov 10 '05 #22
"Eric Lindsay" <NO**********@ericlindsay.com> wrote:
Put Opera (it is free) on the systems, running in full Kiosk mode.

Martin Eyles <ma**********@NOSPAM.bytronic.com> wrote: Firstly, I don't want adverts from opera.
Opera is now free. Version 8.5 stopped being adware.
Secondly, I need activex.


My sympathies.
--
Darin McGrew, mc****@stanfordalumni.org, http://www.rahul.net/mcgrew/
Web Design Group, da***@htmlhelp.com, http://www.HTMLHelp.com/

"How long is this Beta guy going to keep testing our stuff?"
Nov 10 '05 #23

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

4 posts views Thread by Doug R | last post: by
11 posts views Thread by Mark Schneider | last post: by
27 posts views Thread by Cephalobus_alienus | last post: by
reply views Thread by zhoujie | last post: by
reply views Thread by suresh191 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.