Newbie question

A

abadsvt

New Member
Hi everyone! Just want to say hi and love the forum! It looks like a bunch of good people here! Now to the question. I am kind of new to webdesign but I have built a couple websites. I want to learn the "correct" way to do some things so i am trying to learn more. I use dreamweaver as my editor and have been building my new website over the last couple weeks. The site has around 10-15 pages so i made a template so i can make changes to the site without major surgery. The problem is after building the site i have multiple javascript scripts, some jquery, and some dreamweaver widgets and since i always thought that stuff should be in the <head> tags i have been adding that code to the template file which has created a good amount of extra code that doesn't get used on every page. So is that standard to leave everything in the <head> tags and ingnore all the extra code or is it standard proccedure to put the javascript and other stuff in the body of the actuall page when using a template? Does that make sence? Thanks ahead of time.

Josh
 
ronaldroe

ronaldroe

Super Moderator
Staff member
It's pretty normal. You aren't downloading those file each time. It only downloads them once and stores them in the cache for a while. I'd worry more about the messy code Dw is generating for you when you use their design view.
 
A

abadsvt

New Member
Thanks for the help ronaldroe! That is good to know. You actually touched on my other question in regards what to clean code and messy code. The other website i built a long time ago someone mentioned that the code was messy and i didn't understand. Everything worked fine. Could you explain a little bit on what messy code or what dreamweaver does? Thanks

Josh
 
krymson

krymson

Member
What we (web designers) are talking about, is when you're creating a website using a WYSIWYG editor the code it generates is not often the best. For instance when you are wanting to use a DW widget is puts the code in and sure it works fine, but when you go back and look at it in code view you have all these unnecessary tags and formatting issues that could be avoided if you had coded it by hand in the code view.

I'm not downing DW, I use it on a daily basis but I use it in the developer view so I don't see a visual editor and everything is nice and clean, I know exactly whats in the code if something is messed up i know where the problem is without having to look though the generated code. No I will give Adobe this, they heave made it better over the years the coding it puts out is not really that bad compared to most, but it is no substitue for good clean hand coding. The only reason I use DW is because it's what I've been using for years (dont ask how many) but im comfortable with it and I know how to make it work the way I want it to work.

Since you are new I would suggest you look at some tutorials see whats good and whats not... This site is currently growing and I urge you to check back there from time to time to see any tutorials. www.thedspot.co.cc It's still in its infancy but you can grow with it as more information gets put on there.
 
A

abadsvt

New Member
Thanks for the reply. I want to learn what "clean" code is like. I like dreamweaver and would like to keep using it. I will check out that link. When my site is finished (hopefully tomorrow) i will post a link and if you wouldn't mind just taking a peak. I am sure the code is a little messy and would like to improve it over time. Again thanks!!

Josh

krymson said:
What we (web designers) are talking about, is when you're creating a website using a WYSIWYG editor the code it generates is not often the best. For instance when you are wanting to use a DW widget is puts the code in and sure it works fine, but when you go back and look at it in code view you have all these unnecessary tags and formatting issues that could be avoided if you had coded it by hand in the code view.

I'm not downing DW, I use it on a daily basis but I use it in the developer view so I don't see a visual editor and everything is nice and clean, I know exactly whats in the code if something is messed up i know where the problem is without having to look though the generated code. No I will give Adobe this, they heave made it better over the years the coding it puts out is not really that bad compared to most, but it is no substitue for good clean hand coding. The only reason I use DW is because it's what I've been using for years (dont ask how many) but im comfortable with it and I know how to make it work the way I want it to work.

Since you are new I would suggest you look at some tutorials see whats good and whats not... This site is currently growing and I urge you to check back there from time to time to see any tutorials. www.thedspot.co.cc It's still in its infancy but you can grow with it as more information gets put on there.
Click to expand...
 
ronaldroe

ronaldroe

Super Moderator
Staff member
The easiest way to keep your code clean is to minimize the amount of HTML you use and make sure you separate content and structure from visuals. Content/structure go in HTML, visuals go in CSS. Don't let yourself get in the bad habit of wrapping everything in some arbitrary div. Learn and understand the correct usage of CSS selectors. Never use tables for anything but tabular data, and even then consider not using them if possible.
 
G

Garenius

New Member
ronaldroe said:
The easiest way to keep your code clean is to minimize the amount of HTML you use and make sure you separate content and structure from visuals. Content/structure go in HTML, visuals go in CSS. Don't let yourself get in the bad habit of wrapping everything in some arbitrary div. Learn and understand the correct usage of CSS selectors. Never use tables for anything but tabular data, and even then consider not using them if possible.
Click to expand...

This. I can't stress this point enough. After working on web design for quite a while now, the first thing I'll teach newcomers is that you should make a clear distinction between your main HTML page and your CSS.
 
A

Artistmode

New Member
abadsvt said:
Hi everyone! Just want to say hi and love the forum! It looks like a bunch of good people here! Now to the question. I am kind of new to webdesign but I have built a couple websites. I want to learn the "correct" way to do some things so i am trying to learn more. I use dreamweaver as my editor and have been building my new website over the last couple weeks. The site has around 10-15 pages so i made a template so i can make changes to the site without major surgery. The problem is after building the site i have multiple javascript scripts, some jquery, and some dreamweaver widgets and since i always thought that stuff should be in the <head> tags i have been adding that code to the template file which has created a good amount of extra code that doesn't get used on every page. So is that standard to leave everything in the <head> tags and ingnore all the extra code or is it standard proccedure to put the javascript and other stuff in the body of the actuall page when using a template? Does that make sence? Thanks ahead of time.

Josh
Click to expand...
Get the actual code off of your HTML pages. Use external stylesheets and scripts.
<link rel="stylesheet" type="text/css" href="mystyle.css" />
 
A

abadsvt

New Member
Thanks everyone! I just built my website and i am already thinking about redoing all the html. LOL. I did use external style sheets for all my stuff though. The problem i have on my new website is that i have a complex shopping cart that i had a company install and it put ALOT of css style sheets, html, php and tons of folders.

So is good code using short hand css instead of listing out everything. For example.

#example_div {
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}

#example_div {
margin: 0 auto 0 auto;
}

Or does it not make a difference? I noticed dreamweaver will automatically do the top example unless it is set to short hand (don't know exactly what you call it).

Another question is it good practice to have multiple style sheets when you have alot going on? I was thinking next time maybe have a different style sheet for each page. That would simplify trying to find a class or div after all the pages are built. Again thanks everyone!

Josh
 
ronaldroe

ronaldroe

Super Moderator
Staff member
Shorthand is up to you. It will reduce the size of your CSS file drastically, but you're talking about fractions of a second difference on most connections, unless you have an incredibly massive amount of CSS. As far as multiple sheets, I'd say unless you have a very specific reason to, there's no need to split it up. You do want to keep the number of seperate server requests down if you can.
 
krymson

krymson

Member
abadsvt said:
Thanks everyone! I just built my website and i am already thinking about redoing all the html. LOL. I did use external style sheets for all my stuff though. The problem i have on my new website is that i have a complex shopping cart that i had a company install and it put ALOT of css style sheets, html, php and tons of folders.

So is good code using short hand css instead of listing out everything. For example.

#example_div {
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}


#example_div {
margin: 0 auto 0 auto;
}

Or does it not make a difference? I noticed dreamweaver will automatically do the top example unless it is set to short hand (don't know exactly what you call it).

Another question is it good practice to have multiple style sheets when you have alot going on? I was thinking next time maybe have a different style sheet for each page. That would simplify trying to find a class or div after all the pages are built. Again thanks everyone!

Josh
Click to expand...

Yes, you would want to do:

Code: 
#example_div{
     margin: 0 auto 0 auto;
}

You dont need multiple stylesheet, the only time you might need them is alternate stylesheets for older IE browsers. Javascript (for the most part) should be external as well.
 
You must log in or register to reply here.
Top