By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
440,487 Members | 1,067 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 440,487 IT Pros & Developers. It's quick & easy.

Wrong fonts in Google cached version?

P: n/a
I'm just starting to play around with CSS and MovableType. My home page
(http://www.jay.fm) now validates on both the CSS and the XHTML.
However, the Google cached version shows the wrong font in IE6. This
seems to be because of the "header" they place before the <head> block;
if I save the cached copy to disk and edit that out, it displays fine.

It's not a big deal, but I don't notice this problem on other pages, so
I wondered if anyone had any insights on how to prevent it from
happening. Oddly, the rest of the style sheet seems to be obeyed fairly
well; it's only the fonts that are troublesome.

--
Jay Levitt |
Wellesley, MA | Hi!
Faster: jay at jay dot eff-em | Where are we going?
http://www.jay.fm | Why am I in this handbasket?
Jul 20 '05 #1
Share this Question
Share on Google+
21 Replies


P: n/a
Jay Levitt wrote:
I'm just starting to play around with CSS and MovableType.
Excuse my ignorance, but what is "MovableType?"
My home page (http://www.jay.fm) now validates on both the CSS and
the XHTML.
Really?

http://validator.w3.org/check?uri=http://www.jay.fm/

Regarding the css, what's with the microfonts?
However, the Google cached version shows the wrong font in IE6.
That's not all. In Moz 1.6/Win2k, the menu that was on the left is on
the right in the cached version, and part of it is covered. Not real pretty.
This seems to be because of the "header" they place before the <head>
block;
Very odd code they use. I'd think there must be a better way to do this.
Perhaps the cached doc should be framed?
It's not a big deal, but I don't notice this problem on other pages,
so I wondered if anyone had any insights on how to prevent it from
happening.


Since the html in the cached version is invalid, there's no telling what
a ua will do with it. Presumably, people would only access the cached
version if your server is down. Does that happen often?

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/
Jul 20 '05 #2

P: n/a
In article <10*************@corp.supernews.com>, usenet3
@julietremblay.com.invalid says...
I'm just starting to play around with CSS and MovableType.
Excuse my ignorance, but what is "MovableType?"


A CGI-based blog-publishing package that's actually quite usable as a
general-purpose, free content management system. It's got about a
zillion plugins that let you do all sorts of neat things, and of course
you can always layer PHP on top if you want to. The content is
generated once into static files, so as long as you publish less often
than people read, it's very efficient.
My home page (http://www.jay.fm) now validates on both the CSS and
the XHTML.


Really?

http://validator.w3.org/check?uri=http://www.jay.fm/


Damn. It did a few hours ago... then I cut-and-paste the BlogStreet
icon so I could get listed there, and didn't eyeball or revalidate it.
What's particularly odd is that they DO bother to close the img tag, yet
they don't put quotes around the border property!

Bad Jay. All better now.
Regarding the css, what's with the microfonts?
Yeah, the standard font sizes don't scale well when your default font is
small (though I find them quite readable at "Smaller" in IE). I saw a
really great article that had worked out percentages (or perhaps ems)
that made sense at all font-preference sizes, but I can no longer find
it.. hopefully I'll run across it again.
However, the Google cached version shows the wrong font in IE6.
That's not all. In Moz 1.6/Win2k, the menu that was on the left is on
the right in the cached version, and part of it is covered. Not real pretty.


Oh, that just got cached while I was in the middle of tweaking and
moving from a two-column to a three-column format. (At the hit rates I
get, I don't really need to have a "test" and "production" staging
system..) Tonight's GoogleBot should pick up the new one. But the font
problem has been pretty consistent throughout.

Actually, I just noticed something: The *first* time you go to the
cached copy, the fonts are normal, but larger. Reloading doesn't do
anything weird, but going back to the Google listing and then clicking
on "Cached" again pulls up a times-romanized page.

I wonder if it's because the font-family is defined only in the body
selector, and the BODY tag isn't in the expected place in the cached
copy. I'm going to try re-specifying the font in the #content,
#navAlpha and #navBeta selectors and see what happens tonight.
This seems to be because of the "header" they place before the <head>
block;


Very odd code they use. I'd think there must be a better way to do this.
Perhaps the cached doc should be framed?


Yeah, though of course then they'd have to serve up two pages for every
one now. I keep thinking how nice it'd be if there was an inline frame
- not like IFRAME, but an HTML doc nested inside another. I had another
use for one of those a week or two ago. In any case, that's obviously
outside of my control.
It's not a big deal, but I don't notice this problem on other pages,
so I wondered if anyone had any insights on how to prevent it from
happening.


Since the html in the cached version is invalid, there's no telling what
a ua will do with it. Presumably, people would only access the cached
version if your server is down. Does that happen often?


No, but I presume I'm not the only one who instinctively clicks on
cached copies when Googling so I can browse faster. Google's cache is
nearly always faster than any web site, and on any site other than mine,
seems to do a good job rendering. Obviously their HTML is invalid, but
for some reason my site is particularly confusing to IE...

--
Jay Levitt |
Wellesley, MA | Hi!
Faster: jay at jay dot eff-em | Where are we going?
http://www.jay.fm | Why am I in this handbasket?
Jul 20 '05 #3

P: n/a
Jay Levitt wrote:
us*****@julietremblay.com.invalid says...
Regarding the css, what's with the microfonts?
Yeah, the standard font sizes don't scale well when your default font
is small (though I find them quite readable at "Smaller" in IE). I
saw a really great article that had worked out percentages (or
perhaps ems) that made sense at all font-preference sizes, but I can
no longer find it.. hopefully I'll run across it again.


There's not much to it, unless this MoveableType thing changes
something. Don't set any font size in body, p, ul, etc. Set font sizes
only for things like H1, H2, etc.
However, the Google cached version shows the wrong font in IE6.
I wonder if it's because the font-family is defined only in the body
selector, and the BODY tag isn't in the expected place in the cached
copy.


That would make sense since the body tag isn't required in html. It is
assumed when the content starts. That might impact the css.
Very odd code they use. I'd think there must be a better way to do
this. Perhaps the cached doc should be framed?


Yeah, though of course then they'd have to serve up two pages for
every one now.


True. (thinking) Ok, why doesn't Google insert there stuff after the
<body> tag and before any document content?
I keep thinking how nice it'd be if there was an inline frame - not
like IFRAME, but an HTML doc nested inside another.
I think <object> is supposed to be able to handle that, but browser
support is poor.
I presume I'm not the only one who instinctively clicks on cached
copies when Googling so I can browse faster.
I've only done that to see what Google has in its cache for pages I
authored.
Google's cache is nearly always faster than any web site


I find that fascinating that you browse the web from Google that way.
The author really has no idea how his document will be viewed. Of
course, this would be troubling to me if lots of people did as you do
because Google often takes 1 or even 2 months to reindex pages on my
site. And I've seen other pages -- in particular, pages that recently
added a link to a site I've done -- remain unchanged in Google's cache
for even longer.

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/
Jul 20 '05 #4

P: n/a
In article <10*************@corp.supernews.com>, usenet3
@julietremblay.com.invalid says...
Yeah, the standard font sizes don't scale well when your default font
is small (though I find them quite readable at "Smaller" in IE). I
saw a really great article that had worked out percentages (or
perhaps ems) that made sense at all font-preference sizes, but I can
no longer find it.. hopefully I'll run across it again.


There's not much to it, unless this MoveableType thing changes
something. Don't set any font size in body, p, ul, etc. Set font sizes
only for things like H1, H2, etc.


Nope, MT is just content-management; I control all the HTML/CSS
generated. The problem is just that I want the navigation links
somewhat smaller than the body text, but I can't find a relative sizing
that works at all user-selected text sizes in all browsers. I changed
it so it looks nice in IE at "Size: Small", but if you go down two sizes
in Mozilla it's still unreadable. I think this is just the standard
"font sizing is a bitch" problem that's not particularly solvable. What
I really need is a min-font-size property! I really hate to start
serving different stylesheets to different browsers for such a simple
homepage.

I found the page I was looking for:
http://www.simplebits.com/bits/minitabs.html. Unfortunately, the
solution wasn't as amazing as I remembered: all he did was play around
with font percentages till he found ones that seemed to work. His
aren't particularly readable in Mozilla's smaller sizes either.
Google's cache is nearly always faster than any web site


I find that fascinating that you browse the web from Google that way.
The author really has no idea how his document will be viewed. Of
course, this would be troubling to me if lots of people did as you do
because Google often takes 1 or even 2 months to reindex pages on my
site. And I've seen other pages -- in particular, pages that recently
added a link to a site I've done -- remain unchanged in Google's cache
for even longer.


Yep; if what I'm reading is time-sensitive, really important to get
right, or is something that's often updated like a blog, I'll usually go
back and get the real copy. Often I'm browsing for quick sysadmin-help
type things, where most of the answers are on web message boards, where
(a) the servers are always slow, and (b) a post doesn't usually get
edited, so it's more efficient.

Maybe that's not such a common practice. It'd make a good "Ask
Slashdot".

--
Jay Levitt |
Wellesley, MA | Hi!
Faster: jay at jay dot eff-em | Where are we going?
http://www.jay.fm | Why am I in this handbasket?
Jul 20 '05 #5

P: n/a
In article Jay Levitt wrote:
In article <10*************@corp.supernews.com>, usenet3
@julietremblay.com.invalid says... Nope, MT is just content-management; I control all the HTML/CSS
generated. The problem is just that I want the navigation links
somewhat smaller than the body text, but I can't find a relative sizing
that works at all user-selected text sizes in all browsers.
That is because you use px unit too much. Or then you tried those stupid
keywords.
I changed it so it looks nice in IE at "Size: Small", but if you go down two sizes
in Mozilla it's still unreadable.
Well, in your monitor, with your setup. On other peoples setup, it looks
unreadable for them on normal setting.
I think this is just the standard
"font sizing is a bitch" problem that's not particularly solvable.
Actullay, just doing nothing to change font size is best way to handle
it.

Changing default font size has always been first thing to do after
installing browser. (of course, only if there has been need for that, but
I don't think I have ever been satisfied with browser defaults.)
What
I really need is a min-font-size property! I really hate to start
serving different stylesheets to different browsers for such a simple
homepage.
That would be stupid. Different browsers aren't the problem. Different
default font size is not problem either, but the *solution*. Problem is
that people can't read too small text, and too big is annoying.

When doing fixed font sizing, remember the fact "too big" == "too small".
Think about books, too small and too big type exists. The good thing in
book is that
a) there has been lots and lots of work done to find optimal for
everybody
b) size of text really is absolute, unlike on monitor, where difference
can be huge, depending on resolution.
c) there is build in zoom, that is absolutely natural for people to use,
ie. moving book closer/farther
- but, they still print books with extra large print, for people that
can't read normal text.

I myself use 10px fonts for normal reading, so your 11px is too big, let
alone 13px. OTOH, I know many people that can't use my computer at all,
untill I change few font settings.

I found the page I was looking for:
http://www.simplebits.com/bits/minitabs.html. Unfortunately, the
solution wasn't as amazing as I remembered: all he did was play around
with font percentages till he found ones that seemed to work. His aren't particularly readable in Mozilla's smaller sizes either.
You have gotten font size setting of browser all wrong. It is not
necessary to website to be readabele with all those font sizes, but the
one the end user is using.

To see how px unit is bad for other people, change resolution of your
monitor. Try for example 640*400 on 17", as well as 1280*1024. Notice
difference in pixel sized fonts. Then set font size of your browser to
something you find easy to read on each resolution. Go surfing around.
You notice that only sites you can use whitout changing settings on one
of machines are using relative font sizes, or aren't using any font
sizing
Google's cache is nearly always faster than any web site


Only for some slow servers, I think. But I am on fat cable...
Yep; if what I'm reading is time-sensitive, really important to get
right, or is something that's often updated like a blog, I'll usually go
back and get the real copy. Often I'm browsing for quick sysadmin-help
type things, where most of the answers are on web message boards, where
(a) the servers are always slow, and (b) a post doesn't usually get
edited, so it's more efficient.


That explains a lot. I dislike web message forums more than microsoft...

BTW, there is hardly anything, that is answered in web message forums,
and not in usenet -> use groups.google to search...

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
I'm looking for work | Etsin työtä
Jul 20 '05 #6

P: n/a
Jay Levitt wrote:
us*****@julietremblay.com.invalid says...
Jay Levitt wrote:
The problem is just that I want the navigation links
somewhat smaller than the body text,
body { font-size: 100%; }
#navigation { font-size: 90%; }

The font size on body is unneccessary; it is there to demonstate, but
you can leave it out. The navigation of your site, assuming <div
id="navigation">, will be 10% smaller. Use a size that suits you.

I'd point out that making links smaller than the default size doesn't
make sense. The only thing I make smaller than 100% on sites that I do
is the copyright notice.
but I can't find a relative sizing that works at all user-selected
text sizes in all browsers.
I don't understand that. Use percentages, and it will work regardless of
which size the user has chosen. Works in IE 5+, Moz, Opera (5+? lower
even?), Netscape 6+, IE/Mac 5+, Safari. It probably works in older
browsers (IE4, etc.), but there may be bugs. I remember a bug in NN 4.x
for example. But I hide all css from N4 and IE4 anyways.
I changed it so it looks nice in IE at "Size: Small", but if you go
down two sizes in Mozilla it's still unreadable.
Don't make the nav smaller than the text, and this won't be an issue.
I think this is just the standard "font sizing is a bitch" problem
that's not particularly solvable.
With all due respect, that's nonsense. CSS percentages for font-size is
a solution that works, and one that ciwas regulars use as a standard web
design feature.
What I really need is a min-font-size property!
Why? Let the user set their font as small as they like. If they have an
old monitor with low resolution, they may want to use a smaller font. Or
not. Either way, leaving the font-size along except for
I really hate to start serving different stylesheets to different
browsers for such a simple homepage.
With the exception of hiding css (@import "netscape4stayOut.css"), there
is really no need to.
I found the page I was looking for:
http://www.simplebits.com/bits/minitabs.html.
I see more microfonts. This is an example of what not to do.
His aren't particularly readable in Mozilla's smaller sizes either.


If I make things very small in Mozilla, no site is readable. I don't
understand why you find this unacceptable. You seem to assume that some
users will start with a font-size that's too small for them to read, and
that anything smaller will be unreadable. That's curious; most people
who argue against the only sensible font-size -- 100% for body -- claim
that the default is too big.

In any case, you're making this too complicated. You should assume
nothing with regard to 100%, except that the user can read text at that
size. Either the user has adjusted the font size to something that they
like, or they've accepted the default install setting. Either way, they
can read it. That's all that should matter to the author.
Google's cache is nearly always faster than any web site


I find that fascinating that you browse the web from Google that
way.


Often I'm browsing for quick sysadmin-help type things, where most of
the answers are on web message boards, where (a) the servers are
always slow, and (b) a post doesn't usually get edited, so it's more
efficient.


I'll have to try it sometime.

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/
Jul 20 '05 #7

P: n/a
In article <10*************@corp.supernews.com>, usenet3
@julietremblay.com.invalid says...
The problem is just that I want the navigation links
somewhat smaller than the body text,
body { font-size: 100%; }
#navigation { font-size: 90%; }

The font size on body is unneccessary; it is there to demonstate, but
you can leave it out. The navigation of your site, assuming <div
id="navigation">, will be 10% smaller. Use a size that suits you.


I actually already had font-size set to 85%, which isn't all that far
off 90%. (Depending what time you read it, it may have been 87% or 82%
as I experimented with browser rounding.)

What I believe is causing you "microfont grief" is that I had a font-
size: small in the body tag that I hadn't noticed, which contrary to my
expectations was cascading down to the side/sidetitle divs. (I thought
I read that font-size cascades only one layer deep.) That's gone now.
Readable? If not, what are you reading it on, resolution, browser, text
size?
I'd point out that making links smaller than the default size doesn't
make sense. The only thing I make smaller than 100% on sites that I do
is the copyright notice.


I get way too much text wrapping in the nav bars if I do that. I have
to say, looking at the sites I read everyday (mostly news sites), I
can't find a single one that has full-sized navigation bars. If it were
readable, why would you care? I happen to think it looks nicer and
emphasizes the main content.
His aren't particularly readable in Mozilla's smaller sizes either.

If I make things very small in Mozilla, no site is readable. I don't
understand why you find this unacceptable.


Now I'm even more confused. You're the one who's finding it
unacceptable, so I'm trying to learn from you how to improve my site. I
assumed that the problem is that (a) you have your default font size set
fairly small, so (b) my 85% nav bars are even smaller, and thus below
your threshold of readability. Maybe I was wrong on that; can you
correct me?
I find that fascinating that you browse the web from Google that
way.


A quick search of "google cached-version faster" showed a post on
webmasterworld that claims 58% of one guy's google traffic comes through
via the cached version. Guess I'm not alone...

--
Jay Levitt |
Wellesley, MA | Hi!
Faster: jay at jay dot eff-em | Where are we going?
http://www.jay.fm | Why am I in this handbasket?
Jul 20 '05 #8

P: n/a
In article <MP***********************@news.individual.net>,
la***@raittila.cjb.net says...
Nope, MT is just content-management; I control all the HTML/CSS
generated. The problem is just that I want the navigation links
somewhat smaller than the body text, but I can't find a relative sizing
that works at all user-selected text sizes in all browsers.
That is because you use px unit too much. Or then you tried those stupid
keywords.

[snip] I myself use 10px fonts for normal reading, so your 11px is too big,
What? My page as of this morning had (by accident) "font-size: small"
for the body tag, which AIUI would always be smaller than your selected
font size. The nav bars would have been one of font-size: 82/85/87%.
If you saw fixed-size fonts, you saw them on somebody else's site. I
would never use pixel- or point-based fonts.
BTW, there is hardly anything, that is answered in web message forums,
and not in usenet -> use groups.google to search...


Some things I find quicker via usenet, some via web search - mostly
depends whether I'm going to get polluted with a lot of Debian (et al)
bug reports and CVS checkin notices; Google has much better ideas about
relevancy on the web than on usenet, where there is no PageRank and all
they can really do is pure-text searching. Most webmaster-y things seem
to always get hits on webmasterworld, so I web-search first.

--
Jay Levitt |
Wellesley, MA | Hi!
Faster: jay at jay dot eff-em | Where are we going?
http://www.jay.fm | Why am I in this handbasket?
Jul 20 '05 #9

P: n/a
In article <MP************************@news-central.giganews.com>,
ja******@jay.fm says...
Actually, I just noticed something: The *first* time you go to the
cached copy, the fonts are normal, but larger. Reloading doesn't do
anything weird, but going back to the Google listing and then clicking
on "Cached" again pulls up a times-romanized page.

I wonder if it's because the font-family is defined only in the body
selector, and the BODY tag isn't in the expected place in the cached
copy. I'm going to try re-specifying the font in the #content,
#navAlpha and #navBeta selectors and see what happens tonight.


For Google-Groups's sake: This was exactly the problem. Restating the
font-family in each ID solves this problem. I imagine enclosing the
whole page in a div and stating it in that div's class would work too; I
think the problem was just that BODY isn't in the expected place in
Google's cached copy, and so IE gets confused and fails to cascade font-
family from there.

--
Jay Levitt |
Wellesley, MA | Hi!
Faster: jay at jay dot eff-em | Where are we going?
http://www.jay.fm | Why am I in this handbasket?
Jul 20 '05 #10

P: n/a
In article Jay Levitt wrote:
In article <MP***********************@news.individual.net>,
la***@raittila.cjb.net says...
Nope, MT is just content-management; I control all the HTML/CSS
generated. The problem is just that I want the navigation links
somewhat smaller than the body text, but I can't find a relative sizing
that works at all user-selected text sizes in all browsers.
That is because you use px unit too much. Or then you tried those stupid
keywords.


What? My page as of this morning had (by accident) "font-size: small"
for the body tag, which AIUI would always be smaller than your selected
font size. The nav bars would have been one of font-size: 82/85/87%.
If you saw fixed-size fonts, you saw them on somebody else's site. I
would never use pixel- or point-based fonts.


Sorry, I must have confused you with someone else. It seems that most
things after that first sentence were based on something else. Sorry. I
need to take a break from usenet, I have made too many errors lately...
--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
I'm looking for work | Etsin työtä
Jul 20 '05 #11

P: n/a
Jay Levitt wrote:
us*****@julietremblay.com.invalid says...

What I believe is causing you "microfont grief" is that I had a font-
size: small in the body tag that I hadn't noticed, which contrary to
my expectations was cascading down to the side/sidetitle divs. (I
thought I read that font-size cascades only one layer deep.)
I don't know of any such restriction. Did you read that somewhere? I'd
be curious to read it as well.
That's gone now. Readable?
I don't see any significant change. It's still smaller than what I have
*already* chosen as my default font size. That's the part you don't
quite grasp.
If not, what are you reading it on, resolution, browser, text size?
You're trying to solve the wrong problem. If you solve the problem for
me by changing the font size to what I use [1], it will be wrong for
some other user. Trying to guess the resolution of the user or their
browser will only lead to frustration.

<quote>
The font size chosen by the user as a comfortable default (1 em)
provides more truly useful information about the rendering environment
than all the resolution-sniffing, window-querying, "open-this-wide"
logic you can throw at the problem.
</quote>
http://style.cleverchimp.com/font_size/scale/

You mentioned earlier that this problem is unsolvable, but you haven't
tried the solution that I proposed. *DON'T SET A FONT-SIZE!* :-0
I get way too much text wrapping in the nav bars if I do that.
Increase the width of the nav bars?
I have to say, looking at the sites I read everyday (mostly news
sites), I can't find a single one that has full-sized navigation
bars.
Perhaps. But how many of those sites use html correctly? or validate?
Don't do as they do unless you're convinced that what they are doing is
right. On font-size, most are wrong.

"Why my font-size is better than your font-size."
http://www.xs4all.nl/~sbpoley/webmatters/fontsize.html
If it were readable, why would you care?
The point is, what if it *isn't* readable?
I happen to think it looks nicer and emphasizes the main content.
I wouldn't do it. It's your choice to disreard that advice. But if
you're going to do it, at least leave the main content at 100%. On that,
I will not budge. Anything else is wrong. :-p
If I make things very small in Mozilla, no site is readable. I
don't understand why you find this unacceptable.


Now I'm even more confused. You're the one who's finding it
unacceptable,


In the quoted part, I meant that you find the font-size: 100% solution
unacceptable. I don't know why you find that solution unacceptable.
I assumed that the problem is that (a) you have your default font
size set fairly small,
No. It is fairly large my most people's standards. But that isn't really
relevant to your solution.
so (b) my 85% nav bars are even smaller, and thus below your
threshold of readability.


The biggest problem -- you can say that I find *this* unacceptable -- is
that the body text is below my default. You then made the nav even
smaller. This compounds the first problem. Fix the first problem, then
we'll argue about whether nav can be smaller than body text. Others here
in ciwas do just that; I think it's wrong, but to each his own. But most
of the regulars here leave the body font size at 100% of the users default.
[1]If you insist on knowing my settings, here they are: 16px, 1024x768,
Win2k, Mozilla 1.6/Opera 7.23/IE 5.5.

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/
Jul 20 '05 #12

P: n/a
On Mon, 10 May 2004 16:37:38 -0400, Jay Levitt <ja******@jay.fm> wrote:

I get way too much text wrapping in the nav bars if I do that.
Set the navbar width in ems. It will flex according to text size.
I have
to say, looking at the sites I read everyday (mostly news sites), I
can't find a single one that has full-sized navigation bars. If it were
readable, why would you care? I happen to think it looks nicer and
emphasizes the main content.


If it is readable. If you're serving text set at anything smaller than
font-size: 100%;, there's a great likelihood it is not readable.

Think. The ideal font size is one that is as small as you can read
comfortably. Any smaller, it's illegible. Any larger, there's less content
above the fold on the page. Now, that size is going to be different for
all your users. It has to be left to them to make that adjustment, and
browsers have always allowed this - even IE, for cryin' out loud.

So, the wisest move you can make for the usability of your pages is to
allow the user agent to render as the user instructs without modification.
In other words, if you set ANY font size, let it be 100%. (Of course, if
you must, headings can be adjusted, as they are larger anyhow.)
Jul 20 '05 #13

P: n/a
In article <10*************@corp.supernews.com>, usenet3
@julietremblay.com.invalid says...
What I believe is causing you "microfont grief" is that I had a font-
size: small in the body tag that I hadn't noticed, which contrary to
my expectations was cascading down to the side/sidetitle divs. (I
thought I read that font-size cascades only one layer deep.)
I don't know of any such restriction. Did you read that somewhere? I'd
be curious to read it as well.


http://css.maxdesign.com.au/selectut...nheritance.htm

But it's only true for relative sizes, or so they say...

That's gone now. Readable?


I don't see any significant change. It's still smaller than what I have
*already* chosen as my default font size. That's the part you don't
quite grasp.


No, what I don't quite grasp is that if I edit the CSS file and forget
to save it, you're not going to see any difference.

Now the font-size tag for body is gone. Really, truly, 100% (1-em?)
gone.
If not, what are you reading it on, resolution, browser, text size?


You're trying to solve the wrong problem. If you solve the problem for
me by changing the font size to what I use [1], it will be wrong for
some other user. Trying to guess the resolution of the user or their
browser will only lead to frustration.


No, that would definitely be the wrong way to solve it - I just wanted
to see what you were seeing, because I don't see any microfonts. But if
you found
<quote>
The font size chosen by the user as a comfortable default (1 em)
provides more truly useful information about the rendering environment
than all the resolution-sniffing, window-querying, "open-this-wide"
logic you can throw at the problem.
</quote>
http://style.cleverchimp.com/font_size/scale/

You mentioned earlier that this problem is unsolvable, but you haven't
tried the solution that I proposed. *DON'T SET A FONT-SIZE!* :-0
Thought I did that before.. really did that now..

BTW, setting the font-size for body to "100%" or "1 em" give slightly
different results on IE6. Go figure. Although maybe that's because
100% is a relative value and so only is inherited by the children. I'd
have to try with more extreme values to see for sure.
I get way too much text wrapping in the nav bars if I do that.


Increase the width of the nav bars?


I'm already pushing the width as it is for 800x600.. any wider and the
nav bars are as wide as the content! The right pedantic answer would be
"So don't list movie titles in your nav bar. Nobody cares. Write
shorter headlines, and get rid of those book covers."
I wouldn't do it. It's your choice to disreard that advice. But if
you're going to do it, at least leave the main content at 100%. On that,
I will not budge. Anything else is wrong. :-p


100% agreed.

--
Jay Levitt |
Wellesley, MA | Hi!
Faster: jay at jay dot eff-em | Where are we going?
http://www.jay.fm | Why am I in this handbasket?
Jul 20 '05 #14

P: n/a
On Tue, 11 May 2004 00:01:26 -0400, Jay Levitt <ja******@jay.fm> wrote:

Now the font-size tag for body is gone. Really, truly, 100% (1-em?)
gone.
And the text size is legible in all browsers. Hooray!
I'm already pushing the width as it is for 800x600.. any wider and the
nav bars are as wide as the content! The right pedantic answer would be
"So don't list movie titles in your nav bar. Nobody cares. Write
shorter headlines, and get rid of those book covers."


Nah - like I said before, ems. Set the width in ems. And btw, there's
something wonky with your positioning - if I set IE to View-Large, things
overlap.

Oh, here it is. #banner (height: something px}. Use ems here too - it'll
scale with the text.

You know, I really like the design. I'd add a touch of margin to the
images in the left column (maybe .25 em).
Jul 20 '05 #15

P: n/a
Jay Levitt wrote:
us*****@julietremblay.com.invalid says...

what I don't quite grasp is that if I edit the CSS file and forget to
save it, you're not going to see any difference.
:-D
Now the font-size tag for body is gone. Really, truly, 100% (1-em?)
gone.
Enfin! It looks much better now. Really, truly.
No, that would definitely be the wrong way to solve it - I just
wanted to see what you were seeing, because I don't see any
microfonts. But if you found
You seem to have trailed off here. Care to finish that thought?
BTW, setting the font-size for body to "100%" or "1 em" give slightly
different results on IE6. Go figure.
Fortunately, there's an easy fix. Do one of the following:

1. Set all font sizes in css in percentage. Do not use em units for
font-size anywhere. (You can use em for width, margin, etc.)

2. Explicitly set the font-size of body to 100%. Now set other font
sizes in either percent or em.

I prefer (1), because I find percent easier to use, and then I need not
worry about this IE/win bug.
Although maybe that's because 100% is a relative value
No, I think it's because IE6 is broken in this regard, as in so many others.
Increase the width of the nav bars?


I'm already pushing the width as it is for 800x600.. any wider and
the nav bars are as wide as the content!


Yep. It's tough squeezing 3 columns on a page. I have 3 on a restaurant
site I've done. Fortunately, the right column is relatively short, and
floated, so below it the page can take the full width if needed.
The right pedantic answer would be "So don't list movie titles in
your nav bar. Nobody cares. Write shorter headlines, and get rid of
those book covers."


I don't know if it's pedantic, but the boot title and cover scans are a
killer. In fact, in Moz, I think you should put a little space between
the book cover and the title/author. Of course, that'll make it even
wider. I dunno how to make that column narrower.

The site is rather nice looking, IMHO. I like the header. Little
nitpicky things (now that font-size is out of the way!):

The left border of the content div is black; the right is blue. It seems
a little odd. Is that intentional? I think I'd use a lighter color for
the content div border, to set the outer border apart.

You might want a little color in the margin of the page. Or not. Play
around with that if you're so inclined.

I read "clicheboy." Very funny.

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/
Jul 20 '05 #16

P: n/a
Jay Levitt wrote:
In article <10*************@corp.supernews.com>, usenet3
@julietremblay.com.invalid says...
>
> (I thought I read that font-size cascades only one layer deep.)


I don't know of any such restriction. Did you read that somewhere?


http://css.maxdesign.com.au/selectut...nheritance.htm

But it's only true for relative sizes, or so they say...


I assume you are referring to
"...if you set a relative font-size on a <div> element, this will only
be passed down to the children, not all descendants."

I'm not sure if the article is worded badly, or you are just
misunderstanding. If you specifically set an element to some %, its
children are based on this new size, its grandchildren are based on the
size of the children, which may or may not be the same.

Put another way: all elements are based on 100% of their parent (or
container).

For example, where the browser default size is 16px:

div {font-size:75%}
<body>
<p>p1 text</p>
<div>
div1 text
<em>text</em>
<p>p2 text <strong>text</strong></p>
<div>div2 text <span>text</span></div>
</div>
<p>p3 text</p>
</body>

- body is calculated to 16px (100% of browser default size)
- p1 and p3 are 16px (100% of parent body)
- div1 is 12px (75% of parent body)
- em and p2 are 12px (100% of parent div1)
- strong is 12px (100% of parent p2)
- div2 is 9px (75% of parent div1)
- span is 9px (100% of parent div2)

You can directly substitute em units for % in the above example, i.e.
..75em=75%, 1em=100%.

The only time the above is false is because of browser bugs, most
notably inheritance into <table>. Some browsers are rather broken in
this respect, which is why you may not see correct inheritance in
table-based layouts.

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.
Jul 20 '05 #17

P: n/a
In article <2g************@uni-berlin.de>, us****@c-net.us says...
I assume you are referring to
"...if you set a relative font-size on a <div> element, this will only
be passed down to the children, not all descendants."

I'm not sure if the article is worded badly, or you are just
misunderstanding. If you specifically set an element to some %, its
children are based on this new size, its grandchildren are based on the
size of the children, which may or may not be the same.


A little of each, I think.. thanks for clearing that up.

--
Jay Levitt |
Wellesley, MA | Hi!
Faster: jay at jay dot eff-em | Where are we going?
http://www.jay.fm | Why am I in this handbasket?
Jul 20 '05 #18

P: n/a
In article <10*************@corp.supernews.com>, usenet3
@julietremblay.com.invalid says...
Jay Levitt wrote:
No, that would definitely be the wrong way to solve it - I just
wanted to see what you were seeing, because I don't see any
microfonts. But if you found
You seem to have trailed off here. Care to finish that thought?


I noticed that graf right after I posted, but even then I had no idea
what I had started to say.. let's just pretend it was witty and
insightful, ok?
BTW, setting the font-size for body to "100%" or "1 em" give slightly
different results on IE6. Go figure.


Fortunately, there's an easy fix. Do one of the following:

1. Set all font sizes in css in percentage. Do not use em units for
font-size anywhere. (You can use em for width, margin, etc.)

2. Explicitly set the font-size of body to 100%. Now set other font
sizes in either percent or em.


Excellent. Easier done than said.
The right pedantic answer would be "So don't list movie titles in
your nav bar. Nobody cares. Write shorter headlines, and get rid of
those book covers."


I don't know if it's pedantic, but the boot title and cover scans are a
killer. In fact, in Moz, I think you should put a little space between
the book cover and the title/author. Of course, that'll make it even
wider. I dunno how to make that column narrower.


Yep, I definitely need space around the images - I'm getting the benefit
of the IE "three-pixel text jog" and so it looks awful in other
browsers.
<http://www.positioniseverything.net/explorer/threepxtest.html>

I figured out how to strip the subtitles off the books, so now I can go
make the left nav bar much narrower. And IIRC I can use CSS to make a
hanging indent on the movie titles; that'll help too. (And
semantically, I should really make half of the nav bars unordered
lists.)
The site is rather nice looking, IMHO. I like the header. Little
nitpicky things (now that font-size is out of the way!):

The left border of the content div is black; the right is blue. It seems
a little odd. Is that intentional? I think I'd use a lighter color for
the content div border, to set the outer border apart.
Nope, not at all intentional. I haven't even really spent much time on
the design yet; it's mostly cribbed from a free style template at
www.movablestypes.com, mashed up with a three-column layout from
bluerobot.com. That's left me with some inconsistencies, but I never
would have noticed this one on my LCD. I like the idea of a lighter
inner border.
You might want a little color in the margin of the page. Or not. Play
around with that if you're so inclined.


You mean around the nav bars, or at the bottom where there are none?

--
Jay Levitt |
Wellesley, MA | Hi!
Faster: jay at jay dot eff-em | Where are we going?
http://www.jay.fm | Why am I in this handbasket?
Jul 20 '05 #19

P: n/a
In article <op**************@news.individual.net>, ne*****@yahoo.com
says...
Nah - like I said before, ems. Set the width in ems. And btw, there's
something wonky with your positioning - if I set IE to View-Large, things
overlap.

Oh, here it is. #banner (height: something px}. Use ems here too - it'll
scale with the text.


But then I can't get the nav bars to line up with the banner nicely. I
think the problem is that the three-column layout I borrowed from
bluerobot.com actually layers the nav bars and content over each other,
and I can no longer remember why that's such a cool thing... I need to
find/figure out a layout where things are just butted up against each
other in one layer, which will require learning a bit more about CSS
positioning.

--
Jay Levitt |
Wellesley, MA | Hi!
Faster: jay at jay dot eff-em | Where are we going?
http://www.jay.fm | Why am I in this handbasket?
Jul 20 '05 #20

P: n/a
Jay Levitt wrote:
us*****@julietremblay.com.invalid says...

I noticed that graf right after I posted, but even then I had
no idea what I had started to say.. let's just pretend it was
witty and insightful, ok?


Oh, it was witty. And insightful. It changed my thinking on this
important matter, too. :-)
You might want a little color in the margin of the page. Or not.
Play around with that if you're so inclined.


You mean around the nav bars, or at the bottom where there are none?


The entire page -- center content and left and right nav bars -- are
inset in my browser window. There's a spacing of, I dunno, 20 px? It's
at each edge of my window. You could color that, or add color somewhere
else. Something subtle.

Warning: I am a completely *crap* visual designer. I can tell you if I
like something or not, but how to improve it, well, take what I say
with a grain of salt. My sister, a graphic designer by vocation, never
misses an opportunity to slam my sites for their aesthetics. (I get her
back by mocking her pathetic code. Ha!)

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/
Jul 20 '05 #21

P: n/a
In article <op**************@news.individual.net>, ne*****@yahoo.com
says...
I get way too much text wrapping in the nav bars if I do that.
Set the navbar width in ems. It will flex according to text size.


But then I'll end up with a horizontal scrollbar at 800x600.. better to
tweak my content so I just don't *need* wide nav bars, I think.
Although at that point I still might try ems if the max IE size doesn't
push me past 800px wide total.
Think. The ideal font size is one that is as small as you can read
comfortably. Any smaller, it's illegible. Any larger, there's less content
above the fold on the page. Now, that size is going to be different for
all your users. It has to be left to them to make that adjustment, and
browsers have always allowed this - even IE, for cryin' out loud.


I'm not sure it's so black-and-white. I don't set my font size to the
minimum I can possibly read; I set it to the minimum I can read large
chunks of text comfortably. Here at my desk, where the LCD is a foot
from my face, that's "Smaller" in IE; up in my studio, where it's 3 feet
away, that's "Larger". But in both places I can still read the system
menus in 8-point Tahoma; I just wouldn't want to read a whole article in
that. So clearly there's a little legroom below "default" for smaller
fonts in small doses, and by definition that's true for anyone with a
large font selected in IE but not in their Windows control panel, say.

--
Jay Levitt |
Wellesley, MA | Hi!
Faster: jay at jay dot eff-em | Where are we going?
http://www.jay.fm | Why am I in this handbasket?
Jul 20 '05 #22

This discussion thread is closed

Replies have been disabled for this discussion.