E-mail List Archives
Thread: pixels to ems - was RE: Relative vs. absolute units
Number of posts in this thread: 4 (In chronological order)
From: Kevin Spruill
Date: Tue, Jan 07 2003 3:12PM
Subject: pixels to ems - was RE: Relative vs. absolute units
No previous message | Next message →
Jules, et al...
Rough justice division reveals that by dividing #pixels by 16 you get the equivalent in ems... a little tweaking from there should handle it if/when necessary
HK
Kevin Spruill
National Library of Medicine
OCCS
= EMAIL ADDRESS REMOVED =
(301) 402-9708
(301) 402-0367 (fax)
www.nlm.nih.gov
>>> = EMAIL ADDRESS REMOVED = 01/07/03 11:18AM >>>
Despite the fact that the bytowninternet.com example you gave is quite an
eye-opener, it raises the question, how does one measure in ems or convert
from Photoshop pixels to HTML ems?
Jules
> -----Original Message-----
> From: John Foliot - bytown internet [ mailto: = EMAIL ADDRESS REMOVED = ]
> Sent: Friday, January 03, 2003 5:21 PM
> To: = EMAIL ADDRESS REMOVED =
> Cc: = EMAIL ADDRESS REMOVED =
> Subject: RE: Relative vs. absolute units
>
>
> Jules,
>
> Your reading is both correct and reasonable.
>
> However, remember that with the latest versions of popular
> browsers, they
> also support relative sizing for images. See:
> http://www.bytowninternet.com/examples/relative.html for
> examples of what I
> mean.
>
> While most images, when subjected to this treatment, may lose
> a fair bit of
> quality, it is an important consideration when developing
> graphics such as
> buttons or "clickable" icons. In these instances, making the
> image scale
> with the text may aid in accessibility, despite the
> degradation of image
> quality.
>
> Food for thought.
>
> JF
>
>
>
>
> > -----Original Message-----
> > From: = EMAIL ADDRESS REMOVED =
> > [ mailto: = EMAIL ADDRESS REMOVED = ]
> > Sent: Friday, January 03, 2003 3:22 PM
> > To: = EMAIL ADDRESS REMOVED =
> > Subject: Relative vs. absolute units
> >
> >
> > Hi:
> >
> > WCAG 1.0: Checkpoint 3.4
> >
> > "Use relative rather than absolute units in markup language
> > attribute values
> > and style sheet property values."
> >
> > I understand the purpose of using relative font sizes but WCAG 1.0
> > Checkpoint 3.4 does not make the distinction that it is
> referring to only
> > font sizes or if it is refering to any time a measurement is to
> > be used. For
> > example, for usability issues, graphics should be sized
> with height and
> > width but graphics have a "physical" dimension and should be
> > measured using
> > pixels, an absolute unit of measurement. In an instance where the
> > left cell
> > of a layout table in which the left cell is the navbar for the
> > page (and the
> > site), if the links are graphical links, then the graphics
> will have to be
> > measured using pixels and it makes sense to make that
> cell's width also
> > measured in pixels. However, I do agree that the table as a whole
> > should be
> > sized using percentage (for example 100%) so that the right
> cell with the
> > content may expand or contract as the widht of the browser window
> > dictates.
> >
> > Is this a reasonable interpretation of checkpoint 3.4?
> >
> > Jules
> >
> > ---------------------------------------------------------
> > Julian Rickards
> > Digital Publications Distribution Coordinator
> > Publications Services Section
> > Ontario Ministry of Northern Development and Mines
> > Phone: (705) 670-5608
> > Fax: (705) 670-5690
> >
> >
> > ----
> > To subscribe, unsubscribe, or view list archives,
> > visit http://www.webaim.org/discussion/
> >
> >
>
>
>
> ----
> To subscribe, unsubscribe, or view list archives,
> visit http://www.webaim.org/discussion/
>
----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/
----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/
From: Kynn Bartlett
Date: Tue, Jan 07 2003 3:26PM
Subject: Re: pixels to ems - was RE: Relative vs. absolute units
← Previous message | Next message →
An em equals the size of the current font, and that can be changed by
the browser,
by the user, by the author's style sheet, by the user's style sheet, by
the HTML,
...
An em only equals 16 pixels as long as the font size equals 16 pixels.
--Kynn
On Tuesday, January 7, 2003, at 01:47 PM, Kevin Spruill wrote:
> Jules, et al...
>
> Rough justice division reveals that by dividing #pixels by 16 you get
> the equivalent in ems... a little tweaking from there should handle it
> if/when necessary
>
> HK
--
Kynn Bartlett < = EMAIL ADDRESS REMOVED = > http://kynn.com
Chief Technologist, Idyll Mountain http://idyllmtn.com
Author, CSS in 24 Hours http://cssin24hours.com
----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/
From: John Foliot - bytown internet
Date: Tue, Jan 07 2003 3:45PM
Subject: RE: pixels to ems - was RE: Relative vs. absolute units
← Previous message | Next message →
...based on the width of the widest letter in the english alphabet, the "M"
(thus the name - although I always thought that "W" was wider...). Netscape
6/Mozilla 1 actually install with a default font size of 16 pixels, IE's
"default install" (at least on a PC, can't say for Macs) is about the same,
I beleive it's 11 pts +/-
Thus the example page on my site is never guaranteed; as a matter of fact I
state "under normal circumstances"
(http://www.bytowninternet.com/examples/relative.html). That said, icons
such as the PDF icon or text "buttons" could still stand to benefit by
scaling, especially a small icon like the acrobat icon, which is about 16px
square.
However, as always, your mileage may vary and I by no means advocate using
"ems" to size *all* images on your page(s).
JF
> -----Original Message-----
> From: Kynn Bartlett [mailto: = EMAIL ADDRESS REMOVED = ]
> Sent: Tuesday, January 07, 2003 5:08 PM
> To: = EMAIL ADDRESS REMOVED =
> Cc: <"John Foliot - bytown internet"
> Subject: Re: pixels to ems - was RE: Relative vs. absolute units
>
>
> An em equals the size of the current font, and that can be changed by
> the browser,
> by the user, by the author's style sheet, by the user's style sheet, by
> the HTML,
> ...
>
> An em only equals 16 pixels as long as the font size equals 16 pixels.
>
> --Kynn
>
> On Tuesday, January 7, 2003, at 01:47 PM, Kevin Spruill wrote:
>
> > Jules, et al...
> >
> > Rough justice division reveals that by dividing #pixels by 16 you get
> > the equivalent in ems... a little tweaking from there should handle it
> > if/when necessary
> >
> > HK
> --
> Kynn Bartlett < = EMAIL ADDRESS REMOVED = > http://kynn.com
> Chief Technologist, Idyll Mountain http://idyllmtn.com
> Author, CSS in 24 Hours http://cssin24hours.com
>
>
> ----
> To subscribe, unsubscribe, or view list archives,
> visit http://www.webaim.org/discussion/
>
>
----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/
From: Jared Smith
Date: Tue, Jan 07 2003 6:42PM
Subject: Re[2]: pixels to ems - was RE: Relative vs. absolute units
← Previous message | No next message
Kynn-
KB> An em only equals 16 pixels as long as the font size equals 16 pixels.
Which, by default, it roughly does on most systems. The power of ems
is that the size is contingent upon the users settings, yet still
maintains the relative sizing that the developer wants. For the
majority of users who have not changed their default font or user
style sheet, then 16 pixels = 1em is a good guideline to base your text
sizing, though this changes slightly based on OS, browser, font
settings, or weather patterns (ok, it only seems that way).
The danger comes in a design that is not useable when 1em does not
equal the same font size that the majority of us use. What happens to
your page when 1em = 48 pixels? Good design that allows scaling and
utilizes relative size values almost always provides excellent
implementation of ems.
A great, though somewhat antiquated, overview of relative and absolute
sizing and the limitations thereof can be found at
http://www.alistapart.com/stories/fear4/index.html
Jared Smith
WebAIM (Web Accessibility In Mind)
Center for Persons with Disabilities
Utah State University
***************
On Tuesday, January 07, 2003 you sent:
KB> An em equals the size of the current font, and that can be changed by
KB> the browser,
KB> by the user, by the author's style sheet, by the user's style sheet, by
KB> the HTML,
KB> ...
KB> An em only equals 16 pixels as long as the font size equals 16 pixels.
----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/