Planning a site so CSS does not conflict

Is there a simple way (like an outline for a paper) to plan a website? How do you decide which CSS to use on the master template and which to use on the children in Dreamweaver for instance?
I am a newbie here - but this site is awesome, I plan to comeback often!

I want to claripfy my question about planning. In planning my first small site - I kept having to change my template css for font styles and sizes, because I found I wanted to do different things in my editable region on other pages. Is there a systematic way to appproach planning fonts and sizes between the template and other pages in Dreamweaver.

Hi rlfoster. Welcome to the forums. :slight_smile:

It sounds like you are trying to plan your site based on Dreamweaver, which is a bad idea. Try to think of it in terms of the site you will see in a browser. You only really need one style sheet. You can use the same styles for all of your pages, and if there’s anything unique on any pages, you can just write styles for those specific elements by using a special class or ID, for example.

It’s not too hard to learn CSS and HTML to the point where you can throw away Dreamwever and its tools altogether, as they really just get in the way and make a mess of your code.

You’re having a conceptual issue. First, decide what content you want to display, and how you want to display it (i.e. “I want THIS information front and center, THAT information in a sidebar, THOSE details on a subpage, THESE links in a horizontal bar under the header”, etc). Next, decide how to structure your design to accomodate your content decisions. Then and only then will you bother with creating an HTML/CSS framework to best contain that content.

The hell with Dreamweaver. Do your first page/site in a text editor (be it plain-jane Notepad or something more spiffy and code-friendly such as Notepad++), and write/structure it entirely by hand. Everything you type will help you learn how the specific code works and how it impacts other code elements. Learning design/code in Dreamweaver teaches you nothing besides how to get Dreamweaver to build the site for you, and what buttons to click to get DW to do your bidding.

Thank you for such a quick reply!
So do you do a physical layout or sketch a thumbnail to decide where everythig goes and what fonts and images to use where? Do you do it in a program like In Design or just sketch it on paper?

There are many ways to do it, like paper, InDesign, Photoshop and so on. All of these have the problem that they are not the web, so they don’t flex like a web page will. Because ‘content is king’ (to coin a phrase), the suggestion is to work out how to organize the site content first (in such a way that best helps site visitors) This can be done on paper or whatever. Then build a ‘wireframe’, a basic page layout indicating what will sit where on the various pages. You could actually do this in the browser itself, by building the basic framework of your site. Then, as the finishing touch, you could add styles, try different fonts etc.