Comments on: How to Design the Web in a High-Def World http://sixrevisions.com/web-development/how-to-design-the-web-in-a-high-def-world/ Fri, 19 Mar 2010 11:46:17 +0000 http://wordpress.org/?v=2.8.4 hourly 1 By: Randy http://sixrevisions.com/web-development/how-to-design-the-web-in-a-high-def-world/#comment-49480 Randy Sat, 24 Oct 2009 16:51:15 +0000 http://sixrevisions.com/?p=1568#comment-49480 Glad I found this. I am not really interested in the background image size but more about applying this to optimizing a website for widescreen. As a designer, I realize the importance of making a website viewable to everyone but frankly I am sick of making sites fit 1024 wide resolutions and then having tons of negative space on other monitors. Google Analytics shows 70% of my clients visitors have at least 1200px wide screens. There is just so much wasted space and then still having to scroll. I have a number high def TVs at home and I get so annoyed with the lack of HD programming, can you even buy a non-hd tv anymore? Anyway, I guess if i am making 1024 sites, I am no better. So the challenge is making widescreen optimized sites that can still be viewed on 1024. I am going to try using the concepts here to define my css divs, I am thinking making my main content fit 1024 and then have a block that on widescreens will appear on the right and on 1024 will become a footer. and yes, i could do a fluid width but frankly the lack of control of layout really sucks with that unless maybe there is a ton of text which I wont likely have. Glad I found this. I am not really interested in the background image size but more about applying this to optimizing a website for widescreen. As a designer, I realize the importance of making a website viewable to everyone but frankly I am sick of making sites fit 1024 wide resolutions and then having tons of negative space on other monitors. Google Analytics shows 70% of my clients visitors have at least 1200px wide screens. There is just so much wasted space and then still having to scroll.

I have a number high def TVs at home and I get so annoyed with the lack of HD programming, can you even buy a non-hd tv anymore? Anyway, I guess if i am making 1024 sites, I am no better. So the challenge is making widescreen optimized sites that can still be viewed on 1024.

I am going to try using the concepts here to define my css divs, I am thinking making my main content fit 1024 and then have a block that on widescreens will appear on the right and on 1024 will become a footer. and yes, i could do a fluid width but frankly the lack of control of layout really sucks with that unless maybe there is a ton of text which I wont likely have.

]]> By: Lee http://sixrevisions.com/web-development/how-to-design-the-web-in-a-high-def-world/#comment-48847 Lee Sat, 17 Oct 2009 03:26:10 +0000 http://sixrevisions.com/?p=1568#comment-48847 Idont want use it as web home page i just thowt that having a good browser would help with size of media player and homepage to big sites when starts to grow so support on this one so any ideas great thankyou. Idont want use it as web home page i just thowt that having a good browser would help with size of media player and homepage to big sites when starts to grow so support on this one so any ideas great thankyou.

]]> By: Zync http://sixrevisions.com/web-development/how-to-design-the-web-in-a-high-def-world/#comment-46502 Zync Tue, 22 Sep 2009 03:41:40 +0000 http://sixrevisions.com/?p=1568#comment-46502 Love the tute, Thanks heaps for this. I also use smart image resizer to dynamically create the backgrounds for different resolutions on the fly. That was just upload 1 and let php take care of the rest. http://shiftingpixel.com/2008/03/03/smart-image-resizer/ Love the tute,

Thanks heaps for this. I also use smart image resizer to dynamically create the backgrounds for different resolutions on the fly. That was just upload 1 and let php take care of the rest.

http://shiftingpixel.com/2008/03/03/smart-image-resizer/

]]> By: Bobin http://sixrevisions.com/web-development/how-to-design-the-web-in-a-high-def-world/#comment-45394 Bobin Thu, 03 Sep 2009 07:10:14 +0000 http://sixrevisions.com/?p=1568#comment-45394 very good , thanks for sharing and all the cooments very good , thanks for sharing and all the cooments

]]> By: Sergio de la Garza http://sixrevisions.com/web-development/how-to-design-the-web-in-a-high-def-world/#comment-45240 Sergio de la Garza Tue, 01 Sep 2009 01:55:19 +0000 http://sixrevisions.com/?p=1568#comment-45240 what a great tutorial and feedbacks btw i guess will follow this for my page regards what a great tutorial and feedbacks btw i guess will follow this for my page

regards

]]> By: Wiz http://sixrevisions.com/web-development/how-to-design-the-web-in-a-high-def-world/#comment-45084 Wiz Fri, 28 Aug 2009 17:01:24 +0000 http://sixrevisions.com/?p=1568#comment-45084 @Russell <!--begin sarcasm--> Yay! (clap clap clap) Nice constructive criticism, you did a great job of making your point by adding an ellipsis to the end of your sentence. <!--end sarcasm--> Perhaps you should just re-read the article and see the point was using different images so people on smaller resolutions don't have to wait for high-res images to load. Just because the title used the term "high-def" world doesn't mean the tutorial is completely about high-def. @Russell

Yay! (clap clap clap) Nice constructive criticism, you did a great job of making your point by adding an ellipsis to the end of your sentence.

Perhaps you should just re-read the article and see the point was using different images so people on smaller resolutions don’t have to wait for high-res images to load. Just because the title used the term “high-def” world doesn’t mean the tutorial is completely about high-def.

]]> By: Jay Carlson http://sixrevisions.com/web-development/how-to-design-the-web-in-a-high-def-world/#comment-45082 Jay Carlson Fri, 28 Aug 2009 16:44:28 +0000 http://sixrevisions.com/?p=1568#comment-45082 great tutorial and ideas. I think some people aren't paying attention to your original bg image. you don't want to repeat the glowing effect if it's on a bigger screen, guys. that's why he doesn't just "set the bg in CSS and repeat"...I might have to give this a try on one of my own projects. J. great tutorial and ideas. I think some people aren’t paying attention to your original bg image. you don’t want to repeat the glowing effect if it’s on a bigger screen, guys. that’s why he doesn’t just “set the bg in CSS and repeat”…I might have to give this a try on one of my own projects.

J.

]]> By: Marcel Muller http://sixrevisions.com/web-development/how-to-design-the-web-in-a-high-def-world/#comment-45013 Marcel Muller Thu, 27 Aug 2009 16:23:00 +0000 http://sixrevisions.com/?p=1568#comment-45013 Very interesting. Thanks for sharing! Very interesting. Thanks for sharing!

]]> By: Cory Mathews http://sixrevisions.com/web-development/how-to-design-the-web-in-a-high-def-world/#comment-45009 Cory Mathews Thu, 27 Aug 2009 15:10:08 +0000 http://sixrevisions.com/?p=1568#comment-45009 I do not understand why you would want to do this? Why not just put a css background on your body tag with the image? Then you do not have to create so many different images, or rely on javascript. I do not understand why you would want to do this? Why not just put a css background on your body tag with the image? Then you do not have to create so many different images, or rely on javascript.

]]> By: Luisa http://sixrevisions.com/web-development/how-to-design-the-web-in-a-high-def-world/#comment-45007 Luisa Thu, 27 Aug 2009 15:06:00 +0000 http://sixrevisions.com/?p=1568#comment-45007 Well, if the right and left side are the same, is possible to make a background 50%/50% each side repeatig different patterns. And then, you make the bottom to repeat the last color. I dont know how to explain better, but you can see this site I developed in HTML/CSS/PHP as exemple: http://diegorangel.com - It works in any resolution full 100% width and the background images are very very tiny Well, if the right and left side are the same, is possible to make a background 50%/50% each side repeatig different patterns. And then, you make the bottom to repeat the last color. I dont know how to explain better, but you can see this site I developed in HTML/CSS/PHP as exemple: http://diegorangel.com – It works in any resolution full 100% width and the background images are very very tiny

]]>