Advice Articles

  • Beginners
    Just getting started? Loads of powerful advice here for beginners.
  • Intermediate
    Got a handle on the basics? Find more advanced topics covered here.
  • Advanced
    Warning! Advanced topics covered here.
  • Affiliate resources
    Affiliate marketing resources for affiliates and affiliate program managers tools, websites, books and articles.
  • Product reviews
    Candid reviews of the latest products to take you to the next level.


  

Advanced Search

Affiliate Marketing Forum

FAQFAQ  SearchSearch  MemberlistMemberlist  UsergroupsUsergroups   RegisterRegister ProfileProfile  Log in to check your private messagesPrivate Messages Log inLog in  
Dreamweaver Layers

 Affiliate Marketing Forum Index -> Do-It-Your-Selfers
Post new topic   Reply to topic
View previous topic :: View next topic  
Author Message
trigatch4



Joined: 30 Jan 2006
Posts: 29
PostPosted: Thu Feb 16, 2006 2:35 am    Post subject: Dreamweaver Layers Reply with quote
I found the easiest way to create my site was to use a Layer for the banner, a layer for links on the left, and to make this a template. I would then use the middle as an editable region.

Then, I heard grumblings about layers being not so good and then read the following on the Macromedia's webpage:

you may be left with the idea that using layers offers both a convenient and effective method of building a website, but unfortunately you would be wrong. The main reason why using layers isn't the best approach to structure your web pages is because Dreamweaver includes the CSS styles within the DIV element (inline CSS).

When Should You Use Layers?
Because Dreamweaver layers consist of absolutely positioned elements and their CSS styles are written inline, they are not considered the best way of designing pages using CSS. Here are a couple of reasons why you may still want to use the Layers tool:

You need to create basic animation.
You need to create rapid page mock ups.

Wow - well that screws my entire method of making webpages. Since I have absolutely no clue how to approach this in any other manner, I could use a poop load of help. What is my alternate approach.

As an example, one of the sites I created using layers template is www.shoresensation.com .... Should I start from scratch? What do I need to learn? Someone please help me as I have about 4 projects I'm ready to start and don't want to continue until I'm doing it right!

Or, perhaps the layers aren't as big of a problem as I am making them?

Thank you in advance!
Back to top View user's profile Send private message
Debs



Joined: 16 Aug 2003
Posts: 4296
Location: NY
PostPosted: Thu Feb 16, 2006 1:22 pm    Post subject: Reply with quote
You can use layers fine; CSS is rendered well in current browsers so you shouldn't have problems; it provides cleaner code than tables do; loads faster in most cases; and the spiders love them.

Macromedia knows nada about building sites for spiders; just keep the css in an external css style sheet so you can change it sitewide if needed and enjoy.

Debs
_________________
Learn how to turn keyphrases into quality, well-targeted articles your visitors and SE's will love with Gary Antosh's new ebook "Web Content Made Easy!"
Back to top View user's profile Send private message
income



Joined: 02 Feb 2006
Posts: 23
PostPosted: Thu Feb 16, 2006 3:37 pm    Post subject: Reply with quote
trigatch4,

Your page looks good and your code is pretty good. You might want to visit these two site and validate your code.

HTML Validater
http://validator.w3.org/

CSS Validater
http://jigsaw.w3.org/css-validator/

The validators will help you clean up your HTML and CSS.

If I can give you some advice, I would recommend that you take your CSS code in the head section and place it in a separate file. Take this code:
Code:
<style type="text/css">
<!--
.style1 {
   color: #FF0000;
   font-weight: bold;
}
.style2 {color: #000000}
.style3 {color: #0000FF}
-->
</style>


Put it in a new file with only this code:

Code:
.style1 {
   color: #FF0000;
   font-weight: bold;
}
.style2 {color: #000000}
.style3 {color: #0000FF}


Save the file with any name with the .css extension, i.e. style.css.
Put this code in the head of your page:

Code:
<link rel="stylesheet" href="style.css" type="text/css" />


This method allows you to use the CSS style on any page on your site.

You also have alot of inline CSS code, for example:
Code:
<div id="Banner" style="position: absolute; left: 35px; top: -5px; width: 792px; height: 158px; z-index: 1; font-weight: bold"><img src="/SSBanner.gif" width="792" height="162"></div>


What you have done here is okay, especially if this is the only location where this style applies. However, to use CSS to its full potential, you can put the style in your CSS file and use the style on any page without having to rewrite the code. Even thought you are using the page as a template, and you can change the template and subsequently every page that uses the template, it is easier and more logical to use an external CSS file.

You can also streamline your code by a putting your JavaScript in a separate folder the same as your css file. The process is the same as the css file. Copy all the js code minus the script tags and save the file with a .js extension.

Hope this helps,
Jim
_________________
Simple PC Talk
Back to top View user's profile Send private message Send e-mail Visit poster's website
sophist



Joined: 21 Nov 2003
Posts: 570
Location: Kamloops, Canada
PostPosted: Thu Feb 16, 2006 4:31 pm    Post subject: Reply with quote
income wrote:
trigatch4,
You might want to visit these two site and validate your code.

HTML Validater
http://validator.w3.org/
Jim


When I validate my code it shows errors that really make no sense. stuff like

<body>

and

<img src="image-files/image1.jpg">

How do I correct this without messing up my code?
_________________
Dave
Just one click can save a life!
Give a Helping Hand Today

Do You Dare Enter The Secret Classroom
Back to top View user's profile Send private message
income



Joined: 02 Feb 2006
Posts: 23
PostPosted: Thu Feb 16, 2006 5:15 pm    Post subject: Reply with quote
Here is the updae to the first error.
Code:
<script type="text/javascript" language="JavaScript">


Here is the updated img errors:
Code:
<div id="Banner" style="position: absolute; left: 35px; top: -5px; width: 792px; height: 158px; z-index: 1; font-weight: bold"><img src="SSBanner.gif" alt="ssbanner" width="792" height="162"></div>
<div id="Guide" style="position:absolute; width:210px; height:32px; z-index:2; top: 123px; left: 501px"><a href="/GuideToTopsail/guidehome.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Guide','','GuideButtonOver.gif',1)"><img name="Guide" border="0" src="GuideButton.gif" width="192" height="29"></a></div>


This is the addition to your img tags. I only showed one here but all img tags need updated.
Code:
alt="ssbanner"

_________________
Simple PC Talk
Back to top View user's profile Send private message Send e-mail Visit poster's website
View previous topic :: View next topic  
Display posts from previous:   
Post new topic   Reply to topic    Affiliate Marketing Forum Index -> Do-It-Your-Selfers All times are GMT
Page 1 of 1

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum





Your host: Allan Gardyne.
Earning a good living from affiliate programs since 1998.