'New' web site dimensions?

INNspiring.com | Innkeeper Forum & Innkeeping Resources

Help Support INNspiring.com | Innkeeper Forum & Innkeeping Resources:

Morticia

Administrator
Staff member
Administrator
Moderator
Joined
May 22, 2008
Messages
17,560
Reaction score
444
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.
 

Don Draper

Well-known member
Joined
Aug 10, 2008
Messages
2,863
Reaction score
0
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.
 

swirt

Forum founder. Former Owner.
Joined
May 17, 2008
Messages
3,210
Reaction score
0
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.
 

Morticia

Administrator
Staff member
Administrator
Moderator
Joined
May 22, 2008
Messages
17,560
Reaction score
444
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">
 

swirt

Forum founder. Former Owner.
Joined
May 17, 2008
Messages
3,210
Reaction score
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)
 

Morticia

Administrator
Staff member
Administrator
Moderator
Joined
May 22, 2008
Messages
17,560
Reaction score
444
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.
 

swirt

Forum founder. Former Owner.
Joined
May 17, 2008
Messages
3,210
Reaction score
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).
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.
 

Morticia

Administrator
Staff member
Administrator
Moderator
Joined
May 22, 2008
Messages
17,560
Reaction score
444
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.)
 

swirt

Forum founder. Former Owner.
Joined
May 17, 2008
Messages
3,210
Reaction score
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).
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.
 

Morticia

Administrator
Staff member
Administrator
Moderator
Joined
May 22, 2008
Messages
17,560
Reaction score
444
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.
 

vbwebsites

Active member
Joined
Jun 24, 2010
Messages
30
Reaction score
0
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/ .
 

Morticia

Administrator
Staff member
Administrator
Moderator
Joined
May 22, 2008
Messages
17,560
Reaction score
444
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.
) 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.
 

vbwebsites

Active member
Joined
Jun 24, 2010
Messages
30
Reaction score
0
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%
 

Morticia

Administrator
Staff member
Administrator
Moderator
Joined
May 22, 2008
Messages
17,560
Reaction score
444
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?
 

vbwebsites

Active member
Joined
Jun 24, 2010
Messages
30
Reaction score
0
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%
 

EmptyNest

Well-known member
Joined
May 22, 2008
Messages
8,741
Reaction score
1
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:)
 

vbwebsites

Active member
Joined
Jun 24, 2010
Messages
30
Reaction score
0
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..
 

EmptyNest

Well-known member
Joined
May 22, 2008
Messages
8,741
Reaction score
1
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 ;-)
 

vbwebsites

Active member
Joined
Jun 24, 2010
Messages
30
Reaction score
0
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.
 

paulavery

Well-known member
Joined
Sep 19, 2008
Messages
108
Reaction score
0
Posted a screen shot of 160,000 visitors screen dimensions to our blog
http://blog.pillowsandpancakes.com/screen-dimension-of-160000-visitors/
 
Top