Tuesday, January 25, 2005

Updated business site with CSS

I spent a couple of days (and nights!) doing a major design overhaul of my business website using cascading style sheets. Any feedback is welcome, especially (but not only) if something looks weird in your browser. Next I'm thinking of managing the links pages with Blogroll, and I definitely finally have to set up forms instead of just asking people to send inquiries by e-mail....


At 10:41, Blogger Bunker said...

The only thing I see (in Firefox) is that the text background sometimes flashes white to transparent. I think the transparent would look good all the time.

At 15:18, Blogger MiGrant said...

Thanks Bunker! For some reason Firefox seems to be applying the a:hover background style to the entire div rather than just to the link when you mouse over one. I'll have to look into it further — I'm pretty new at all this.

At 19:01, Blogger Eric said...

Another observation from a Firefox (Mac) user. The background image in the body tag is not aligning with the bottom of the window, as it seems designed to do, because of the gradient at the top of the image. (Maybe that's not your intention.) You can add "bottom" to the CSS rule to get it to do that, again, if that's what you'd like for it to do. The new rule would be:

body {
background: white;
background-repeat: no-repeat;
background-attachment: fixed;
background-position: bottom center;font-family: Georgia, serif;

At 17:28, Blogger MiGrant said...

Thanks Eric. Ideally what I'd like is for the browser window to open only to the size of the image or less, never larger. I suppose I could do that with JavaScript, but even if I knew JS (which I don't), I don't want to be that aggressive with people's windows. I thought the image was large enough that not many people would see the bottom of it, but I suppose there are a few folks out there (like you?) with really big screens. For now I've set the background color to "silver" so it's not quite such a shock when you reach the bottom of the image.

At 10:43, Blogger Eric said...

The background color update does help things. And, just fyi, here are some recent (7/2004) statistics about the screen resolutions used by web surfers:

1. 1024 x 768 - 54.02%
2. 800 x 600 - 24.66%
3. 1280 x 1024 - 14.1%
4. 1152 x 864 - 4%
5. 640 x 480 - 0.6%
6. 1600 x 1200 - 0.8%
7. 1152 x 870 - 0.1%

As you can see, according to these stats, around 15% of your theoretical visitors will see the band at the bottom of the screen (assuming they've got their browser window maxed out in terms of vertical resolution). I think that number will grow as larger monitors become the norm, but I wouldn't quibble at all with your design decision.


Post a Comment

Links to this post:

Create a Link

<< Home