'New' web site dimensions?

Bed & Breakfast / Short Term Rental Host Forum

Help Support Bed & Breakfast / Short Term Rental Host Forum:

This site may earn a commission from merchant affiliate links, including eBay, Amazon, and others.

Morticia

Well-known member
Joined
May 22, 2008
Messages
17,771
Reaction score
685
Is there a 'new' standard web site dimension? My site right now has a width of 730. I'm thinking of going over 800, is that a good decision? I'd like to now have columns so I do need to go wider to make that work.
 
I think it's gotten wider, I have no clue how websites are built but if you look at our new one it is much wider than it was before, and she does have two columns built in.
 
Fluid width is the safest. Do a percent width like 95%.. That way it works on anything. Fixd width sites are the easiest to make look just the way you want, but fluid sites are the only thing that is best for EVERY viewer.
 
Fluid width is the safest. Do a percent width like 95%.. That way it works on anything. Fixd width sites are the easiest to make look just the way you want, but fluid sites are the only thing that is best for EVERY viewer..
How do I state 95% in a line like this: (you should have known this was coming! I tried using ems but it was all over the place)
Code:
<table width="730" border="0" cellpadding="0" cellspacing="0">
 
width="95%" ;)
edited to add: That is 95% of th width of the continer that the table resides in. So if the table resides in a Body that is set to 800px wide, the table will only be 95% of 800px. But if the body is set to 95% (to give 2.5% margins) then the table will only be 95% of the original 95% (=90.25% of the whole page)
 
width="95%" ;)
edited to add: That is 95% of th width of the continer that the table resides in. So if the table resides in a Body that is set to 800px wide, the table will only be 95% of 800px. But if the body is set to 95% (to give 2.5% margins) then the table will only be 95% of the original 95% (=90.25% of the whole page).
swirt said:
width="95%" ;)
Smart aleck. I didn't know I could use '%'. I don't set the body width, just the table width. Which seems to adjust itself on some pages. (The rooms page with all the photos and the events pages do that, so I had to adjust the header so it was the same size.)
I'm always nervous with floating sizes that the text will be all over the place and nothing will line up.
 
width="95%" ;)
edited to add: That is 95% of th width of the continer that the table resides in. So if the table resides in a Body that is set to 800px wide, the table will only be 95% of 800px. But if the body is set to 95% (to give 2.5% margins) then the table will only be 95% of the original 95% (=90.25% of the whole page).
swirt said:
width="95%" ;)
Smart aleck. I didn't know I could use '%'. I don't set the body width, just the table width. Which seems to adjust itself on some pages. (The rooms page with all the photos and the events pages do that, so I had to adjust the header so it was the same size.)
I'm always nervous with floating sizes that the text will be all over the place and nothing will line up.
.
That is the biggest hassle with a fluid site is you give up control of the width, but you win the battle of not being able to fit certain browsers.
 
width="95%" ;)
edited to add: That is 95% of th width of the continer that the table resides in. So if the table resides in a Body that is set to 800px wide, the table will only be 95% of 800px. But if the body is set to 95% (to give 2.5% margins) then the table will only be 95% of the original 95% (=90.25% of the whole page).
swirt said:
width="95%" ;)
Smart aleck. I didn't know I could use '%'. I don't set the body width, just the table width. Which seems to adjust itself on some pages. (The rooms page with all the photos and the events pages do that, so I had to adjust the header so it was the same size.)
I'm always nervous with floating sizes that the text will be all over the place and nothing will line up.
.
That is the biggest hassle with a fluid site is you give up control of the width, but you win the battle of not being able to fit certain browsers.
.
So, it's a design thing, then. If it is designed to 'fit' most browsers, it may look good on one and bad on 3, or vice versa. Arrrgh! I know some of my stuff looks horrible on a Mac. And if you increase the font size the text and the pictures don't line up anymore in IE.
So, how do web designers go about making sure their client's site looks good 95% of the time? By using a fluid width size? Or do they just find out what browser their client uses, design for that and hope the client never sees the site on the 'wrong' platform? (Bad, designer, bad. I joke, but I bet some people do that.)
 
width="95%" ;)
edited to add: That is 95% of th width of the continer that the table resides in. So if the table resides in a Body that is set to 800px wide, the table will only be 95% of 800px. But if the body is set to 95% (to give 2.5% margins) then the table will only be 95% of the original 95% (=90.25% of the whole page).
swirt said:
width="95%" ;)
Smart aleck. I didn't know I could use '%'. I don't set the body width, just the table width. Which seems to adjust itself on some pages. (The rooms page with all the photos and the events pages do that, so I had to adjust the header so it was the same size.)
I'm always nervous with floating sizes that the text will be all over the place and nothing will line up.
.
That is the biggest hassle with a fluid site is you give up control of the width, but you win the battle of not being able to fit certain browsers.
.
So, it's a design thing, then. If it is designed to 'fit' most browsers, it may look good on one and bad on 3, or vice versa. Arrrgh! I know some of my stuff looks horrible on a Mac. And if you increase the font size the text and the pictures don't line up anymore in IE.
So, how do web designers go about making sure their client's site looks good 95% of the time? By using a fluid width size? Or do they just find out what browser their client uses, design for that and hope the client never sees the site on the 'wrong' platform? (Bad, designer, bad. I joke, but I bet some people do that.)
.
Its a design thing. Most of the time designers went with what the majority of people had for screen sizes at the time, most trackers can show you that pretty easilly. The problem is that those numbers creep up over the years .. and in many ways will continue to creep up....but also now there is a split thanks to webphones.
Predominantly if you are using tables to control your layout then fluid width may be a bit more difficult. To pull off fluid witdth well, you need the kind of layout power you get from css. (but that opens up other cans of worms as diferent browsers implement css differently ... although that has gotten a lot better).
However, what you are asking about is a bit of a different issue. You are asking about retrofitting an existing site as opposed to starting with a new site. With a new site you'll take photo sizes and their placement in a fluid design differently than if you are trying to apply a fluid design and make sure they still accommodate your old photos.
 
width="95%" ;)
edited to add: That is 95% of th width of the continer that the table resides in. So if the table resides in a Body that is set to 800px wide, the table will only be 95% of 800px. But if the body is set to 95% (to give 2.5% margins) then the table will only be 95% of the original 95% (=90.25% of the whole page).
swirt said:
width="95%" ;)
Smart aleck. I didn't know I could use '%'. I don't set the body width, just the table width. Which seems to adjust itself on some pages. (The rooms page with all the photos and the events pages do that, so I had to adjust the header so it was the same size.)
I'm always nervous with floating sizes that the text will be all over the place and nothing will line up.
.
That is the biggest hassle with a fluid site is you give up control of the width, but you win the battle of not being able to fit certain browsers.
.
So, it's a design thing, then. If it is designed to 'fit' most browsers, it may look good on one and bad on 3, or vice versa. Arrrgh! I know some of my stuff looks horrible on a Mac. And if you increase the font size the text and the pictures don't line up anymore in IE.
So, how do web designers go about making sure their client's site looks good 95% of the time? By using a fluid width size? Or do they just find out what browser their client uses, design for that and hope the client never sees the site on the 'wrong' platform? (Bad, designer, bad. I joke, but I bet some people do that.)
.
Its a design thing. Most of the time designers went with what the majority of people had for screen sizes at the time, most trackers can show you that pretty easilly. The problem is that those numbers creep up over the years .. and in many ways will continue to creep up....but also now there is a split thanks to webphones.
Predominantly if you are using tables to control your layout then fluid width may be a bit more difficult. To pull off fluid witdth well, you need the kind of layout power you get from css. (but that opens up other cans of worms as diferent browsers implement css differently ... although that has gotten a lot better).
However, what you are asking about is a bit of a different issue. You are asking about retrofitting an existing site as opposed to starting with a new site. With a new site you'll take photo sizes and their placement in a fluid design differently than if you are trying to apply a fluid design and make sure they still accommodate your old photos.
.
You know me and CSS. Ugh. I gave up. But I'd still like to get some better pix on my site and make it wider to accommodate columns.
Gomez asked me today where the Google toolbar went on IE. I don't know, I don't use IE! I did a complete reinstall of IE8 using the Google version and guess what? No toolbar. The space is there for it and if I unclick Google toolbar the space goes away, but IE refuses to show the toolbar anymore.
I keep trying to get Gomez to use FF, to no avail. Maybe I'll show him Chrome.
 
in my opinion i like 990 right now. When you do %'s you lose some control of placement as 95% on each monitor may vary. I like using a fixed width so i can control where I place things. This one is 989, don't call me a liar for one pixel :) http://www.capecharleshouse.com/ .
 
in my opinion i like 990 right now. When you do %'s you lose some control of placement as 95% on each monitor may vary. I like using a fixed width so i can control where I place things. This one is 989, don't call me a liar for one pixel :) http://www.capecharleshouse.com/ ..
My problem with such a wide config as 990 is that it can become hard for me to read. (And it's all about me.
wink_smile.gif
) I need a little more real estate than I have now, but not ready for the jump to 990! (A lot of that has to do with how the photos convert as well. The wider I make the viewable area, the taller I need to make the photos which pushes the text down further.
 
You can always crop height to get your point across. Big images do give the oooh ahh effect.
When i look at reports from cape charles house, these are the resolution useage %'s
1. 1024x768 20.23%
2. 1280x800 19.74%
3. 1280x1024 10.77%
4. 1680x1050 10.77%
5. 1440x900 9.14%
6. 1920x1080 4.08%
7. 1366x768 3.43%
8. 1152x864 1.96%
9. 1920x1200 1.79%
10. 1280x960 1.63%
 
You can always crop height to get your point across. Big images do give the oooh ahh effect.
When i look at reports from cape charles house, these are the resolution useage %'s
1. 1024x768 20.23%
2. 1280x800 19.74%
3. 1280x1024 10.77%
4. 1680x1050 10.77%
5. 1440x900 9.14%
6. 1920x1080 4.08%
7. 1366x768 3.43%
8. 1152x864 1.96%
9. 1920x1200 1.79%
10. 1280x960 1.63%.
How about iPhones, etc? How do the larger pages resolve on the phones?
 
Good question and they will be on the rise but for now - results below. Iphone / safari does a great job of reducing / proportioned so it's fine. In a perfect world, there would be a mobile version of the site as well but thats another expense.
1. Internet Explorer / Windows 55.14%
2. Firefox / Windows 18.11%
3. Safari / Macintosh 13.87%
4. Firefox / Macintosh 5.22%
5. Chrome / Windows 3.26%
6. Safari / Android 0.82%
7. Chrome / Macintosh 0.65%
8. Safari / iPhone 0.65%
9. Firefox / Linux 0.33%
10. Mozilla / Linux 0.33%
 
You can always crop height to get your point across. Big images do give the oooh ahh effect.
When i look at reports from cape charles house, these are the resolution useage %'s
1. 1024x768 20.23%
2. 1280x800 19.74%
3. 1280x1024 10.77%
4. 1680x1050 10.77%
5. 1440x900 9.14%
6. 1920x1080 4.08%
7. 1366x768 3.43%
8. 1152x864 1.96%
9. 1920x1200 1.79%
10. 1280x960 1.63%.
That is very interesting. So anyone can probably get away with a 900 wide one. If they still have a 14 inch monitor..then that is too bad....get with it folks:)
 
You can always crop height to get your point across. Big images do give the oooh ahh effect.
When i look at reports from cape charles house, these are the resolution useage %'s
1. 1024x768 20.23%
2. 1280x800 19.74%
3. 1280x1024 10.77%
4. 1680x1050 10.77%
5. 1440x900 9.14%
6. 1920x1080 4.08%
7. 1366x768 3.43%
8. 1152x864 1.96%
9. 1920x1200 1.79%
10. 1280x960 1.63%.
That is very interesting. So anyone can probably get away with a 900 wide one. If they still have a 14 inch monitor..then that is too bad....get with it folks:)
.
I am happy not to see the old 800 x 600 anymore. The resolution numbers will continue to increase and thats good thing for the web. It won't be long before 1024 x 768 is replaced by 1280x800 then 1280 x 800 replaced by 1280x1024 or 1680x1050 and so on..
 
You can always crop height to get your point across. Big images do give the oooh ahh effect.
When i look at reports from cape charles house, these are the resolution useage %'s
1. 1024x768 20.23%
2. 1280x800 19.74%
3. 1280x1024 10.77%
4. 1680x1050 10.77%
5. 1440x900 9.14%
6. 1920x1080 4.08%
7. 1366x768 3.43%
8. 1152x864 1.96%
9. 1920x1200 1.79%
10. 1280x960 1.63%.
That is very interesting. So anyone can probably get away with a 900 wide one. If they still have a 14 inch monitor..then that is too bad....get with it folks:)
.
I am happy not to see the old 800 x 600 anymore. The resolution numbers will continue to increase and thats good thing for the web. It won't be long before 1024 x 768 is replaced by 1280x800 then 1280 x 800 replaced by 1280x1024 or 1680x1050 and so on..
.
Yeah...I want to plug my computer into my 42 inch TV ;-)
 
You can always crop height to get your point across. Big images do give the oooh ahh effect.
When i look at reports from cape charles house, these are the resolution useage %'s
1. 1024x768 20.23%
2. 1280x800 19.74%
3. 1280x1024 10.77%
4. 1680x1050 10.77%
5. 1440x900 9.14%
6. 1920x1080 4.08%
7. 1366x768 3.43%
8. 1152x864 1.96%
9. 1920x1200 1.79%
10. 1280x960 1.63%.
That is very interesting. So anyone can probably get away with a 900 wide one. If they still have a 14 inch monitor..then that is too bad....get with it folks:)
.
I am happy not to see the old 800 x 600 anymore. The resolution numbers will continue to increase and thats good thing for the web. It won't be long before 1024 x 768 is replaced by 1280x800 then 1280 x 800 replaced by 1280x1024 or 1680x1050 and so on..
.
Yeah...I want to plug my computer into my 42 inch TV ;-)
.
i hear ya! We can only go by stats and what people use and then optimize to those stats / specs.
 
Posted a screen shot of 160,000 visitors screen dimensions to our blog
http://blog.pillowsandpancakes.com/screen-dimension-of-160000-visitors/
 
Back
Top