Hi

New to web stuff and new to dreamweaver. I need to get site that will look good at 800x600 and 1024x768 pixels. Is there a code that will resize a page to fit depending on the sreen resolution?

In reply to:

---

Is there a code that will resize a page to fit depending on the sreen resolution?

---

Yes - it's called a browser.

Write your HTML without any preconceptions about how it will be displayed, and you'll find you have to spend less time fixing it - meaning more time to write interesting content that people want to read.

Why do you think people will have browser windows of only the two sizes you mention? Most people I know prefer a browser that's taller than it is wide, like most books. I don't know anyone who uses a browser of anything like the proportions you suggest.

I'm pretty sure he meant that the user's screen resolutions were set to 800 and 1024, rather than the browsers being that size.

Still, I agree that time should be spent making the content work. Nobody really writes sites based on what the user's resolution is.

---

Nobody really writes sites based on what the user's resolution is.

---

I wish that were true. Sadly, it seems that quite a few people do, and never look at their work with anything other than their own browsing environment. Thankfully, such people seem to be the ones with least to say

In reply to:

---

the user's screen resolutions were set to 800 and 1024, rather than the browsers being that size

---

Even with a known screen size, the browser canvas's size will vary a lot depending on the user's preferences for how many words they like to a line and at what font size, whether they have other windows on the screen that also need attention (e.g. I like to have two Mozilla windows side-by-side when I'm coding), how much window-manager and browser clutter they have (toolbars, tabbed browsing, sidebar etc.) You really can say very little about the browsing pane size given the screen size (except that the former is rarely larger than the latter).

I did mean screen resolutions, not browser resolutions. Problem is that graphics and text at 800x600 resolution look crap when I change to 1024x768. Just wondering if some piece of code will detect screen resolutions and resize it to look in proportion.

Well with the resize part you're on your own, but this will detect the size:

http://webdeveloper.earthweb.com/repository/webdev/content/software/2000/05/11/JS_27166/script27166.html

Problem is that graphics and text at 800x600 resolution look crap when I change to 1024x768.

Okay, first thing... you're not developing on an LCD monitor, are you?

Second...

What everyone is trying to say is:

Don't develop to a specific screen size. Your web page should be designed so that all of the screen objects (tables, paragraphs, frames, images, text wrapping, etc.) re-flows logically around the page and looks good with the browser window at ANY reasonable size and shape, from as small as 640 to as large as 1600. When this is done correctly, your page does not need to detect the screen size or do anything special. Test this by viewing the page on a high-rez screen and resizing the window and looking at how it flows. If something doesn't look right, fix it by using things like tables, the <nobr> tag, and spacer-gifs.

A web page that only works at one screen rez is a sign of a newbie web designer.

I created and maintain my bass fishing clubs website and have often wondered how well it looks to others. Everywhere I view it from it seems fine, but lots of the older guys in the club that are new to the 'Net never say anything either way. I don't know if they can really view and navigate or just don't feel they are knowledgable enough to critique it.
Anyone wanna look at it and let me know if it's any good? I aim more towards information for our members and potential new members than a snazzy looking site.

I like the organisation of the site - it's easy and logical to find things.

All your images seem to be missing ALT attributes, which makes it hard to use for anyone without images (text-only browser, or graphical browser without image auto-load).

My browser also noticed a couple of silly mistakes like

Bad data characters [not allowed here], inferring <DD>

  Containing elements: HTML:BODY:BODYTEXT:DL

  Text around error: "#FF0000\">\r\n\r\n<dl> \r\n*ERROR*<center><table cells"

and the like, so you could use a trip to the validator.

Overall, I like it - you have a similar view to mine on the relative worth of information and eye-candy.

... with the usual warning to check that you don't break things for those who don't have Javascript.

Why do you think people will have browser windows of only the two sizes you mention? Most people I know prefer a browser that's taller than it is wide, like most books. I don't know anyone who uses a browser of anything like the proportions you suggest.

I disagree. You may know a different type of computer user, but the people I know (parents, girlfriend, etc.) view in full-screen. I personally view everything in full screen. I find very few instances that require me to have several windows viewable at the same time. Especially web content. You can't read two things at once anyway (unless you're Tony, it seems).

As for the other suggestions, I don't think he was really asking for something like a code to route people to different locations based on resolutions. I think he was talking about code in a page that will change it's shape based on resolution. Well, my friend, welcome to web design. I'm still dealing with making stuff look better on different sizes.

I tend to make sites that don't go beyond 800 pixels wide. If someone has a resolution of 640x480, I'm sorry, but they're beyond hope and they're probably used to horizontal scrolling anyway. Besides, about 3% of the people out there are in 640x480. Hell, Yahoo's pages are mostly restricted to less then 750px wide (good to factor in the scroll bar).

Frankly, things shouldn't look worse at higher resolutions than they do at lower ones. Unless your eyesight is bad I'm at 1600x1200 and everything looks fine to me. The fact is that people with higher res screens have to deal with the lowest common denominator.

Of course, there's exceptions to all this, but do what you think looks good. I'm still trying to figure out what that is myself

Oh, and I would talk about Dreamweaver, but I'm pretty much only using Notepad, so I wouldn't be of much help

If someone has a resolution of 640x480, I'm sorry, but they're beyond hope and they're probably used to horizontal scrolling anyway.

Agreed. I stopped composing-to-640 a while ago.

Still, one should make sure that the page formats correctly on a window that small. Horizontal scrolling is fine as long as the page is still readable and navigable if you do the scrolling. The thing that I don't like to see is a page whose formatting breaks completely at small sizes rather than just making the scroll bars appear. I'd rather have my page render correctly with scroll bars than start wrapping strangely just to help people avoid scrolling.

Oh, and I would talk about Dreamweaver, but I'm pretty much only using Notepad, so I wouldn't be of much help

I love the "made with notepad" logos I see on some sites.

Before I'd heard of Dreamweaver, our company hired a trainer to come in and teach a bunch of us how to use it. We were supposed to spend several days in training, on-site in our own conference room. Since the product was from Macromedia, I figured that it was some kind of an interactive flash authoring tool. I sat down in the class and the trainer started explaining what Dreamweaver was.

I stopped him and said, "Wait- you mean that Dreamweaver is just an HTML editor?"

"Yes."

"It doesn't create animated interactive multimedia type stuff?"

"Right."

"I'm in the wrong class, then. Sorry."

...and I walked out.

I've got no time for an editor that simply adds a layer of abstraction atop a language I already know.

> Oh, and I would talk about Dreamweaver, but I'm pretty much only using Notepad, so I wouldn't be of much help

I started out with notepad, but switched to Dreamweaver for one reason; code help. Dreamweaver, and especially the new MX version, have a lot of sytax checking, autocomplete, and code color, for both your client side and server side code...no matter what language you use. Except for the project managment tools, I use the visual tools rarely, but they too come in handy when making complicated tables or spitting out lots of form elements. It has a lot of advantages over Notepad, and no disadvantages, except of course the price.

No, I wouldn't say it has no disadvantages over Notepad or simple text editors. I feel I have a greater degree of control when I'm inputing all the code myself. Whether this is purely in my head or not, it sure seems to appease me

Granted, my code is hardly perfect. I need to work a lot at getting it up to standards and writing things the way I should. However, I would argue that if it seems to work to your satisfaction, then standards be damned!

ps-I think I'm going to get one of those "made in notepad" graphics

> No, I wouldn't say it has no disadvantages over Notepad or simple text editors. I feel I have a greater degree of control when I'm inputing all the code myself. Whether this is purely in my head or not, it sure seems to appease me

I agree, and I use Dreamweaver to input 99% of the code myself, with the exception of the afor-mentioned tables and form elements, and then only when it would be easier to see and place it visually. The HTML it writes is indistinguishable from my code (except it is a lot more consistent with the caps than I am ), and unlike Frontpage, Dreamweaver won't ever screw with your code. Even if you code 100% by hand, it is still a better enviroment. No, really.

Personally, I use HomeSite (now owned by Macromedia). I think it's the best program (for PC, anyways) for people who code by hand. And, it has all the link checking, tag completion and other features you want.

http://www.macromedia.com/software/homesite/

I tend to make sites that don't go beyond 800 pixels wide. If someone has a resolution of 640x480, I'm sorry, but they're beyond hope and they're probably used to horizontal scrolling anyway. Besides, about 3% of the people out there are in 640x480.

Hmm. I've got my Windows monitor set at 1280x1024, but I never have the browser window more than half that width; textual sites such as this BBS are hard to read unless they're narrow. (In fact, textual pages are best read narrower still, but about half a screen-width seems to give the best compromise between text legibility on the one hand, and on the other navigability of sites that assume the browser is very wide.)

The best width to design your web pages to is 540, because that's about how many pixels you get on television sets. Devices smaller than that usually have HTML rewriters to get pages onto the smaller width.

Peter

Oops I forgot the ALT tabs when I redesigned the page last year Thanks for the tip! Which page gave the error you mentioned? The main page or somewhere down in the site?
And thanks for validator, I had forgotten about those checkers.
I have always had problems converting an Excel spreadsheet to HTML and then finishing the page with Netscape Composer 4.78. The standings page has always been rather screwy with borders dropping in various places and it's bloated with MS code. Anyone know of a better way to handle the table conversion? I save it as a webpage in Excel then go to Composer.
As for the javascript, I've been inclined to get rid of it, it should only be on the main page right now. It's that free counter as well as a javascript in the staus bar.
The best part is that we've gained about 10 new members because they found the webpage and it's one of the few bass club websites in the area that is current and constantly updated.

In reply to:

---

Which page gave the error you mentioned? The main page or somewhere down in the site?

---

I can't remember. I picked one at random, rather than checking them all. After all, that's your job... . I'm sure the validator will find it for you.

For converting spreadsheet tables to HTML, that's something I don't have experience of doing this, but one thing that might work is to use your spreadsheet's export facility and run it through Dave Raggett's HTML Tidy, which I've heard good things about. Alternatively, export as something simple like CSV and write some Perl to generate the structure.

In reply to:

---

The best part is that we've gained about 10 new members because they found the webpage

---

Yeah, I've had that experience several times over with the local student hillwalking club. It gives me warm-and-fuzzies to know that I'm helping people have more fun.

(And yes, I have to confess that I don't visit the link checker as often as I should...)

I agree with ninti. I recently switched from writing HTML by hand to using DreamWeaver. I'm loving this tool. You get a split-screen view, if you want it, with raw HTML on top and formatted web page below. You can click in either one and start typing, wherever it's more convenient.

Other cool features that I'm now hooked on:

- The search and replace gizmo lets you search based on HTML tags. For example, "find all IMG tags and add BORDER=1" is trivial to do.

- I'd never bothered to figure out style sheets before. DreamWeaver makes it totally easy to set them up and use them. I've torn out some really ugly tables, hand-built with spacer images and now I use much simpler style sheets.

- Templates and stuff are also really easy. I have a lot of old pages that need pointers to the newer pages. I have them all include a template HTML table that says "were you trying to find the new X page?". I can change the template once, and everything that uses it will be automagically updated. (I used to do this by hand with a homebrew c-preprocessor like tool.)

DreamWeaver just painlessly imports your old stuff and lets you hack it up. If you work with big ugly tables, it's just amazingly more pleasant than doing it by hand. Check it out.

DreamWeaver just painlessly imports your old stuff

Not so at all with me. I'm sure it's just because of the way I've coded my HTML, but when I simply opened up my page in Dreamweaver, it completely f*cked it up. That's when I closed and uninstalled the program.

I will agree, I've seen other people use it and it's a far cry from Frontpage, which I used in the early days. I finally got sick and tired of the loads of code it inserted and ditched it. That was about 3-4 years ago though.

> when I simply opened up my page in Dreamweaver, it completely f*cked it up.

Hmm, that is odd. Maybe the old versions did that, I only started using it in the last couple of years. With Dreamweaver 4 and Dreamweaver MX, I have never had it change as much as a space without me asking it too, and I use it for almost 8 hours a day every day. If you get a chance, give it another try, I think you will find it very rewarding.

I am a proponent of doing HTML manually and knowing it inside and out, but I also recognize the value of a WYSIWYG editor like Dreamweaver. I like it a lot. The thing is, I throw stuff together "coarse grain" with the WYSIWYG stuff, and then use the source window to make all the important changes. Having it simultaneously update the WYSIWYG window is a great feature. I do think these HTML editors have their place, as long as they conform to specs.

The best width to design your web pages to is 540

You've got to be kidding me. 540px is nothing! Just look around the internet and the average is probably 800 pixels wide. That's if the site has a limited width at all. I really disagree that 540 pixels is a good width.

I'll give it another try. I do like the idea of an instant view of what I'm doing. Does the preview show includes as well? Because if you have an include in your file, just opening it in a browser off your system won't show the included HTML. If Dreamweaver does that, you've sold me on trying it out.

> Does the preview show includes as well?

I tried it right now, and at least the new version (Dreamweaver MX) does. Don't know about version 4.

Okay. I'm using Dreamweaver a little. I've got a copy of version 4. So far I did catch some errors in my own page. That was helpful. I'm still not used to doing things this way, but I may in time.

Yes, 4 also shows includes, which is one reason alone for me to use it.

But I still don't like the program much. I can't help but feel that I'm using a glorified Frontpage. WYSIWYG editing is nice, but the program does stuff for me that I don't want it to. Then I spend a while fixing it. That annoys me.

So we'll see. I may go back to Notepad eventually.

You may find that you're better off using a graphical tool such as dreamweaver to build the initial look and structure of the site, then as soon as you start adding code and content, moving to a basic highlighting editor (along with HTML Tidy and regular use of the W3C validator).

a basic highlighting editor? What's HTML Tidy?

a basic highlighting editor?

One that will highlight the syntax of your HTML so that it is easier to pick out tags. Usually, they will highlight different tags in different colors/font styles, and they will often highlight the text that has been marked up, as well (like making text surrounded by <B> tags bold and <A> tags underlined, etc). They're useful because it's easier to see your layout and they usually also perform some very basic syntax checking.

What's HTML Tidy?

It's a program that tidies your HTML, formatting it in a more consistent fashion, and sometimes editing out extraneous tags, especially the stuff MS products like to put in. HTML Tidy

> WYSIWYG editing is nice, but the program does stuff for me that I don't want it to. Then I spend a while fixing it. That annoys me.

Well, if you do things in the visual mode, it will add code that may not be completely to your liking. I do stick in the code editor 99% of the time, flipping over to the visual editor only to take a look, or rarely, to create something visually. I certainly wouldn't use any of its Javascript creation stuff, as it is generates code that is overly complicated. You sound like you would be happier using it more like what David calls a "basic highlighting editor", which it does quite well.

Yeah, I did experiment a little bit with the visual mode, but found that to be the case. Didn't like it. The split screen is nice too. Does anyone know of a way to get it to display split screen vertically instead of horizontally?

Like I said, I'm getting used to it

You've got to be kidding me. 540px is nothing! Just look around the internet and the average is probably 800 pixels wide.

I didn't say it was the most common width...

That's if the site has a limited width at all. I really disagree that 540 pixels is a good width.

Oh, I wasn't saying it should appear 540 pixels wide if your browser window happens to be wider than that. I was just saying that, as a good compromise between inclusiveness and ease of designing, the site should still be usable in a 540-pixel window without horizontal scrolling. Ideally, though this gets harder the more HTML gimmicks one uses, it should scale from 540 pixels all the way up to 1920 -- but making pages that look sensible wider than 1000 is difficult.

This BBS stays readable down to 540 pixels (unless someone writes a lot of monospaced text). So does Google. The news.bbc.co.uk story pages do too, though you can't see the links at the right. I guess it's a marketing call, really: whether you reckon you'll lose more readers by frustration at using your site, than you'd gain by using whatever funky layout somehow can't be written to be stretchy.

Peter

This BBS stays readable down to 540 pixels (unless someone writes a lot of monospaced text)

Can anyone think of a good fix for this, without totally bloating the BBS HTML that is spit out? Individual tables for each comment should fix it, but I'm not sure how much bloat it would introduce. The really bad part is that moderators and admins can't fix it either. I tried on my ext3 post that caused it to spew across the screen, and I simply can't reedit it without the BBS code making it worse.

Maybe put such text inside an IFRAME so that it's scrollable on its own?

monospaced text

Can anyone think of a good fix for this, without totally bloating the BBS HTML that is spit out?

Have the "code" tag produce <tt> rather than <pre>? Unlike HTML, BBS-code doesn't discard linefeeds, so <pre> isn't needed so often. And you could convert spaces to U+00A0's in case whitespace was significant.

Peter

Okay, sorry to bring up the Dreamweaver stuff again, but I've run into something puzzling and I've never been sure how to solve it.

It has to do with various horizontal alignments in a table cell. Say I have a cell. In that cell I want to have an image at the top, followed by several paragraphs of text. I want the image centered and the text aligned to the left.

So what I did was this. I figured I might have a bunch of other things that I might want centered in that cell as well, so I just put code in the cell tag that the alignment was centered. So okay, this centers everything, as I expect. Then to make the text aligned to the left, I put span tags around the text and put a style element in it for text-align. This is successful and aligns all the text to the left side of the cell. So I have everything how I want it, right?

Well, just to check I open the file up in IE and all the text is centered. Dreamweaver shows that it's aligned to the left, IE says it's centered.

How do I do what I'm trying to do??

Here's the code I used:

<span style="text-align: left"></span>

Also, tell me if I'm wrong, but is this how I call up an external style sheet??

<link rel="stylesheet" type="text/css" href="mystyle.css" />

Easy solution is to just put the image in one cell, start a new row and the text in another cell. You can't rely on each browser to implement thig sort of thing in the same way.

Well, that stinks, but oh well. I just set it all to left alignment, and added white space to the left of the image. Works for me.

And I just found something that has switched me over to being a Dreamweaver user. It's called CTRL+SHIFT+SPACE

In reply to:

---

<link rel="stylesheet" type="text/css" href="mystyle.css" >

---

Remember to ensure that the server sends mystyle.css with the correct content-type. The value in the "type" attribute is just a hint to the browser (to help it choose which stylesheet, perhaps); what the server says is authoritative.

Okay, cool. I was just using code that I think is provided by the w3c, so I figured it was cool. I've used it with 4 sites on 4 different servers and they've all worked fine.

But I have found that Dreamweaver does a pretty poor job of displaying CSS in the preview pane. For example, they provide the CSS tags for hyperlink states, yet the links are still the default blue and decorated the default way in the preview. On many fields they tell you that Dreamweaver doesn't display certain attributes you assign, but it has problems with others it says it does show. odd.