|
|
marty.sasaki Inner circle 1117 Posts |
I've been looking at a lot of web sites recently, I'm starting to do some web site work, and wanted to see examples of good and bad sites. One thing that I have run across a lot is that the site doesn't display properly. My guess is that it displays properly in a specific browser (say Internet Explorer or Safari) but it looks funny in Mozilla or Opera. It's hard to test in all of the different combinations of browsers and systems, and each is slightly different. This is true of standard HTML/CSS, and especially true of Javascript.
I would try to test with as many as you can and would certainly include IE, Safari, Netscape/Mozilla/FireFox, and Opera. If you know something about the technical side, use one of the framework/tool kits that "normalizes" things like CSS units and such. I've been playing with YUI from Yahoo, and it claims to test on the most popular browsers and systems. It also provides a nice set of Javascript tools, including some nifty AJAX tools. If you understood what I just wrote, then definitely check out YUI. Otherwise, in the words of Emily Latella, "Never mind".
Marty Sasaki
Arlington, Massachusetts, USA Standard disclaimer: I'm just a hobbyist who enjoys occasionally mystifying friends and family, so my opinions should be viewed with this in mind. |
NJJ Inner circle 6437 Posts |
The main issue is size. Most good websites ensure that the page is no more than 700 wide by creating a table of that width and designing the page inside. http://www.funnybones.com.au and http://www.conman.com.au should fit in most browsers.
|
Lyndel Inner circle wrote the theme to the TV show COPS! 1623 Posts |
Quote:
On 2008-02-17 21:05, Nicholas J. Johnson wrote: No truer words have ever been spoken... Lyndel |
marty.sasaki Inner circle 1117 Posts |
Don't build web sites at fixed sizes. These don't scale well with screen size and screen resolution. While you can safely assume that screens will be 800X600 or larger (if you eliminate mobile screens), why limit yourself? If I want to have larger text, why can't I have that? I've had at least a 21 inch monitor for a while now, and having to change my screen resolution to properly view a site is ridiculous.
If you can avoid it, don't use tables for your layout. This makes things easier for some HTML editors, but better sites are possible using CSS. These scale better, allow resizing text, and are more flexible and allow changes in the look of a web site to be done relatively quickly and easily. Different browsers render font sizes differently. They also handle alignment, both horizontal and vertical, differently. Borders and margins can be measured differently, as well. There are more differences, but you get the idea. So, while important, size isn't the only issue. At least, that's what I've been told.
Marty Sasaki
Arlington, Massachusetts, USA Standard disclaimer: I'm just a hobbyist who enjoys occasionally mystifying friends and family, so my opinions should be viewed with this in mind. |
ScottRSullivan Special user 874 Posts |
Marty is pretty spot on. I'd add that you CAN design for larger screens, but also have an alternate layout for smaller screens.
Using CSS, you can have two different sites using the same page. The main page checks the browser size, if it is a mobile device like an iPhone, then uses an alternate CSS file to reformat the page that is optimized for that device. Same page, different layout. That's the beauty of CSS. You separate the content from the design. WARNING: GEEK ALERT! I'll geek out for a minute here. My page is an example of the resizing for mobile devices. Feel free to look at the code in the header that checks for the mobile device and then uses the iPhone.css file in lieu of the standard .css file. Here's the code in the header: Quote:
<link media="only screen and (max-device-width: 480px)" href="css/iphone.css" type="text/css" rel="stylesheet" > Also, any media should be compatible with mobile devices. For example, Flash videos are nice, but they don't work on iPhones. Also, larger video files take forever to download using a cell phone network, like EDGE. So your media should also scale. For example, when someone clicks to play the video on my site, this script checks if I'm on a desktop with high speed connection or a mobile device with slower EDGE cell phone network. Then, it delivers a higher resolution video for the desktop and a low resolution optimized for cell phone screens. Here's that script: Quote:
HEADER: But I'll insert my disclaimer here. I don't design websites for people. There are plenty of others that do (many listed in the other thread). They should be the ones to give advice here. I'm just a guy who knows a thing or two about CSS. *grin* Scott |
amshake Regular user 164 Posts |
I'm going to have to disagree about fixed width sites...
I set a fix width (using CSS) on ALL my sites, mostly due to the advent of wide-screen monitors. Now, understanding the need for smaller>larger layouts for smaller>larger screens, a good way to go is to set max widths and allow scale up to that point. As well, setting min width works to keep content readable on tiny monitors. So, I guess fixed width isn't the right term, but controlled size is... Oh...and I DO create sites for people.....but take all advice with a grain of salt.
_________________________________________
Adam Shake Vice President of the Peoria Magicians Assembly IBM and SAM Member Magic Geek |
ScottRSullivan Special user 874 Posts |
Hmm, I'm not sure I'm understanding you, Adam. You are saying that you design sites all to the same width? How do you accommodate for mobile devices?
Sorry for the questions. I think I just might be misunderstanding you! I'm all for designing a site that is formatted for the device. That's the beauty of the code I gave above. You can have the advantage of designing a fixed width site, but with the ability to scale on the fly to various sized devices. While the example I gave above formats the page to a design tailored specifically to an iPhone, it works just as well with monitors set to 640x480, 600x800 and on up the chain. In today's day of mobile communications, our sites have to be designed for all possible conditions. You never know what type of device a visitor will be using, and you want their experience of your website to be as enjoyable and positive as possible. Good luck with your web design business! My hat's off to you! Later! Scott |
amshake Regular user 164 Posts |
Mobile devices are a different monster altogether. Determining your audience plays a big part in that. I wholeheartedly agree on having a layout for mobile devices. Though, to do that right, you need to account for mobile browsers like the iPhone and Blackberry, as well as non-smart-phones with WAP style browsers. EBay does a GREAT job with this....
But, discluding mobile browsers, yes, I always use a set width (or max and mins) so I maintain control over the content and can assure its easy to read and looks good no matter what size or type of monitor the person is using. To allow for fully dynamic sites leaves you open to having paragraphs morph into single line sentences on widescreen monitors, or paragraphs being displayed 1 word at a time in a long vertical column on tiny ones. Does that make sense? And thanks for the wish of luck, all entrepreneurs need the same wish and luck! edit: WOW, I need a new avatar!
_________________________________________
Adam Shake Vice President of the Peoria Magicians Assembly IBM and SAM Member Magic Geek |
marty.sasaki Inner circle 1117 Posts |
Mobile devices are a pain. At least, that's what I've heard from friends who know. One company has a "super CSS" that determines the device and tweaks the style appropriately for the 200 phones that they support. One of the developers that I know has 5 phones that he routinely uses to check out their product.
YUI appears to use "fixed" widths with their basic layout, but scaling and text re-sizing works well. To keep this from being too geeky, check out http://www.webpagesthatsuck.com/ for sometimes hilariously bad web sites. It's a great resource for web design by showing how not to design web sites.
Marty Sasaki
Arlington, Massachusetts, USA Standard disclaimer: I'm just a hobbyist who enjoys occasionally mystifying friends and family, so my opinions should be viewed with this in mind. |
amshake Regular user 164 Posts |
YUI is an amazing tool!!! Just be comfortable with JavaScript before you dive in!
_________________________________________
Adam Shake Vice President of the Peoria Magicians Assembly IBM and SAM Member Magic Geek |
The Magic Cafe Forum Index » » Tricky business » » Advice on websites... (0 Likes) |
[ Top of Page ] |
All content & postings Copyright © 2001-2024 Steve Brooks. All Rights Reserved. This page was created in 0.04 seconds requiring 5 database queries. |
The views and comments expressed on The Magic Café are not necessarily those of The Magic Café, Steve Brooks, or Steve Brooks Magic. > Privacy Statement < |