Announcement Announcement Module
Collapse
No announcement yet.
Beginner web designer needs help with Dreamweaver CS4 Page Title Module
Move Remove Collapse
Search Search Module
Collapse

Advertisement Advertisement Module
Collapse

Featured Images Featured Images Module
Collapse

Mediabistro Creative Sites Mediabistro Creative Sites Module
Collapse
Latest Topics Latest Topics Module
Collapse

  • KitchWitch
    Reply to Hello GDF!
    KitchWitch
    Mini welcome tacos!

    ...
    Today, 12:46 AM
  • PrintDriver
    Reply to School assignment: Collateral campaign
    PrintDriver
    Um...do you seriously want to focus on blowing bubbles for a disease that pretty much drowns you in mucous???
    Today, 12:31 AM
  • Roth
    Reply to New Logo
    Roth
    The blue scales remind me of Bumblebee's face. Whichever way you choose to go, make it the simpler version, so for example the two circles rather than the literal scales, you want to show not tell. Make...
    Yesterday, 10:33 PM
  • Roth
    Reply to Poster critique
    Roth
    He looks like he's been in a fight with a cassette.

    You can't do a poster and assume you'll throw all the imporant when and where stuff in later. They're integral.
    Yesterday, 10:24 PM
  • <b>
    Reply to Hello GDF!
    <b>
    Just to make sure that you're not mistaken about that, here's a reminder not to forget these very important links here and here. Seriously, welcome to the forum!...
    Yesterday, 09:53 PM
Advertisement Advertisement Module
Collapse

Sponsors Sponsors Module
Collapse

X
Conversation Detail Module
Collapse
  • Filter
  • Time
  • Show
Clear All
new posts

  • Beginner web designer needs help with Dreamweaver CS4

    Hey, what's up!

    I'll ask my question first and then I'll explain the details a bit further.

    Software: Dreamweaver CS 4

    Question: How do I give a frame a 'name' so that I can designate the frame as a target from a link.


    This is just for my learning process, I know how to create blank templates that have frames pre-made, but what I wanted to do is learn how to make that from scratch.

    Here's my example site that I created using a pre-made template. http://www.sharkonland.com

    What I want to do is recreate the exact same website, but do it all from scratch, meaning I have to make my own frames and set their sizes, etc.

    I have 3 frames. The top (title), the left (navigation) and the bottom right (content). What I want to do is make a link in the navigation page open up a new page and display it in the content frame. When I choose a target for the link I don't understand how to choose the content frame as the target. When I used the frame template the content frame was labeled "_main" I believe, but how did the frame get that name? How do I make a frame/name show up in the target list?

    I hope some of that made sense.

    Thank you!


    And since this is my first post, for those interested my name is Scott, I'm 28, live near Seattle, WA and I'm trying to learn a little bit about web development using Dreamweaver CS4. I'd like to slowly get away from the design view and learn just the code part (I can read and edit the code, just can't write it from scratch).

  • #2
    Hi Scott, welcome to GDF.

    When you have a few moments, please take a look over the threads posted here. These explain our forum rules and policies which probably differ a bit from other forums that you've visited.

    I'm a print designer and can't help you with Dreamweaver, but I am sure that someone will be along shortly to help you with that.
    "It's never too late to be who you might have been." - George Eliot

    Comment


    • #3
      Thanks for the heads up, I just read through the guidelines and rules.

      Comment


      • #4
        thanks for that. I knew I liked you.

        There are a few of us who check in "after hours", but most people flew out the door at around 4:58pm for the weekend.

        Don't be discouraged if you don't see a lot of response before Monday morning, and don't be afraid to bump the thread then if you haven't had an answer.
        "It's never too late to be who you might have been." - George Eliot

        Comment


        • #5
          hmmm... You are talking about loading the content into the designated window/space without having the page reload the header and left navigation. Correct?
          Professional Pixel Pusher — Designing the world around you. | Working daily to reach 10,000 hours of practice.

          Comment


          • #6
            Ahh, ok cool thanks for that tip. I browsed around the net for a bit trying to find a decently active forum for web design help. I saw a lot of very well answered questions here so thought I'd post up.

            My question isn't really urgent since right now web design is just a hobby I'm starting. I can usually figure stuff out, but sometimes I over-complicate the basic things and need help getting my brain straightened out again. haha

            Comment


            • #7
              Originally posted by CkretAjint View Post
              hmmm... You are talking about loading the content into the designated window/space without having the page reload the header and left navigation. Correct?
              Yep, that is correct.

              Specifically I want to know how to designate the frame that will be loading the new content as a target that links on the navigation bar will link to.

              Example: I have the 'blog' link on the left frame and it opens up the page sharkonland.com/blog

              I want the blog page to load up into the existing content frame (so the navigation and title frame don't move, but the content frame loads the new content). I understand the idea of how it works and how to set a target frame for the blog link. The problem is when I create the frames from scratch, the content frame doesn't show up in the 'target' drop-down menu. That is the thing I want to know, how to make the content frame show up in the target drop-down menu.

              Comment


              • #8
                Frames raise numerous accessibility and usability problems. Its in your best interest to learn design and client-side programming without resorting to frames. A more productive way to spend your time would be to learn everything you can about HTML.

                Considering your more interested in the coding side of things semantic web standard HTML is a must. HTML it self can be learned with little to no design knowledge. Its much more light weight then a programming language, but its a good place to start considering your interest in front-end development.

                I highly recommend closing Dreamweaver and opening a text editor. Then looking at the resource thread at the top of this forum to some great links to start you on your way.

                A good exercise might be to take certain pages of the site you created and write them in semantic, valid mark-up (HTML). W3C Schools has some good beginner material on writing HTML as well as HTML dog. SitePoint is also a good place visit considering its vast array of books, articles and helpful forum members.

                I'd answer your actual question but I haven't used frames in about 5 years…

                Comment


                • #9
                  home page made with semantic and valid HTML:

                  HTML Code:
                  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
                  <html lang="en">
                  <head>
                  	<meta http-equiv="content-type" content="text/html; charset=utf-8">
                  	<title>Landshark's Home on the Internet</title>
                  </head>
                  <body>
                  
                  <div id="container">
                  
                  	<h1>Landshark's Home on the Internet</h1>
                  
                  	<div id="content">
                  
                  		<div id="sidebar">
                  
                  			<dl id="nav-main">
                  				<dt>Navigation</dt>
                  				<dd><a href="#">Home</a></dd>
                  				<dd><a href="#">Blog</a></dd>
                  				<dd><a href="#">MyPics</a></dd>
                  				<dd><a href="#">MyVideo</a></dd>
                  				<dd><a href="#">MyFiles</a></dd>
                  				<dd><a href="#">MyStuff</a></dd>
                  			</dl>
                  
                  			<dl id="nav-external">
                  				<dt>External Links</dt>
                  				<dd><a href="#">Landshark on Myspace</a></dd>
                  				<dd><a href="#">1stMI Gaming website</a></dd>
                  			</dl>
                  
                  		</div> <!-- end of #sidebar -->
                  
                  		<div id="page">
                  
                  			<p>Welcome to Landshark's Home on the Internet.</p>
                  			<p>This is a pretty quick and basic page used to navigate 
                  			around my site content. Here you'll find my blog, links to 
                  			raw data such as my pictures and other files, videos, etc.</p>
                  			<p>Use the navigation page on the left to find what you are looking for.</p>
                  
                  		</div> <!-- end of page -->
                  	
                  	</div> <!-- end of #content -->
                  
                  </div> <!-- end of #container -->
                  
                  </body>
                  </html>

                  Comment


                  • #10
                    tZ, would one use dl/dd tags for the navigation? or ul/li tags?? I thought that the SEO guys preferred ul/li tags. Plus, they display as a nice list if your css doesn't load correctly.
                    Professional Pixel Pusher — Designing the world around you. | Working daily to reach 10,000 hours of practice.

                    Comment


                    • #11
                      Originally posted by CkretAjint
                      tZ, would one use dl/dd tags for the navigation? or ul/li tags??
                      I've recently begun using a definition list when something has a heading, but it doesn't quite seem right to use a heading. If that makes any sense…

                      The "headings" Navigation and External Links are directly related to content. So if its not absolutely necessary to use a heading tag a dl is a cleaner and more semantic way to mark up such content.

                      The only downside is SEO. If content is important to SEO then using a definiton list wouldn't be appropriate. However, here it doesn't quit seem like that is case. I wouldn't feel right making External Links and Navigation headings.

                      Unless I could use a generic heading tag like in the XHTML2 where the heading is relative to encapsulating element rather then the entire page. In HTML 5 this could also be done using a section element. However, that isn't the case with HTML 4. In HTML 4 headings are relative to the page. Navigation and External Links aren't all that important to the page to get a heading tag.

                      HTML Code:
                      <ul>
                      	<li><h2>Navigation</h2>
                      		<ul>
                      			<li><a href="#">Home</a></li>
                      			<li><a href="#">Blog</a></li>
                      			<li><a href="#">MyPics</a></li>
                      			<li><a href="#">MyVideo</a></li>
                      			<li><a href="#">MyFiles</a></li>
                      			<li><a href="#">MyStuff</a></li>	
                      		</ul>
                      	</li>
                      </ul>
                      The proper heading level is ambiguous here and I don't believe the "proper" heading level can really be determined. Besides using a definition list results in less code. The ul requires 3 levels and the dl only requires one. In actuality the entire thing could probably be placed in a single dl to compact the code even more.

                      HTML Code:
                      <dl id="nav-main">
                      	<dt>Navigation</dt>
                      	<dd><a href="#">Home</a></dd>
                      	<dd><a href="#">Blog</a></dd>
                      	<dd><a href="#">MyPics</a></dd>
                      	<dd><a href="#">MyVideo</a></dd>
                      	<dd><a href="#">MyFiles</a></dd>
                      	<dd><a href="#">MyStuff</a></dd>
                      	<dt>External Links</dt>
                      	<dd><a href="#">Landshark on Myspace</a></dd>
                      	<dd><a href="#">1stMI Gaming website</a></dd>
                      </dl>
                      The only problem there though is that the encapsulating element separating each nav is lost. Which may not be a problem or it could be a gigantic problem depending on the complexity of the design.

                      Originally posted by CkretAjint
                      I thought that the SEO guys preferred ul/li tags. Plus, they display as a nice list if your css doesn't load correctly.
                      It wouldn't make a difference. The only problem with using the definition list is that a heading can't be nested in the term (dt). That is why using them is generally not a very good idea. However, if the content doesn't absolutely need a heading or it wouldn't feel right using a heading then a dl is the way to go. It results in less code and a more semantic relationship - definition term relates directly the definitions (dd).

                      You could also do something like this if you think the extra tags will be useful for presentation purposes.

                      HTML Code:
                      <dl id="nav-main">
                      	<dt>Navigation</dt>
                      	<dd>
                      		<ul>
                      			<li><a href="#">Home</a></li>
                      			<li><a href="#">Blog</a></li>
                      			<li><a href="#">MyPics</a></li>
                      			<li><a href="#">MyVideo</a></li>
                      			<li><a href="#">MyFiles</a></li>
                      			<li><a href="#">MyStuff</a></li>
                      		</ul>
                      	<dd>
                      	<dt>External Links</dt>
                      	<dd>
                      		<ul>
                      			<li><a href="#">Landshark on Myspace</a></li>
                      			<li><a href="#">1stMI Gaming website</a></li>
                      		</ul>
                      	</dd>
                      </dl>
                      Using definition list here avoids the need to decide the appropriate heading level. When… there really isn't one.

                      With the above code now the sidebar div could even be removed.
                      Last edited by tZ; 08-08-2009, 03:00 AM.

                      Comment


                      • #12
                        This may not be perfect for presentation reasons, but the whole page can be written in only 31 lines. if you haven't noticed I'm a fan of doing as much as I can with as little as possible,lol.

                        HTML Code:
                        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
                        <html lang="en">
                        <head>
                        	<meta http-equiv="content-type" content="text/html; charset=utf-8">
                        	<title>Landshark's Home on the Internet</title>
                        </head>
                        <body>
                        
                        <h1>Landshark's Home on the Internet</h1>
                        <dl id="nav-main">
                        	<dt>Navigation</dt>
                        	<dd><a href="#">Home</a></dd>
                        	<dd><a href="#">Blog</a></dd>
                        	<dd><a href="#">MyPics</a></dd>
                        	<dd><a href="#">MyVideo</a></dd>
                        	<dd><a href="#">MyFiles</a></dd>
                        	<dd><a href="#">MyStuff</a></dd>
                        	<dt>External Links</dt>
                        	<dd><a href="#">Landshark on Myspace</a></dd>
                        	<dd><a href="#">1stMI Gaming website</a></dd>
                        </dl>
                        <div id="content">
                        	<p>Welcome to Landshark's Home on the Internet.</p>
                        	<p>This is a pretty quick and basic page used to navigate 
                        	around my site content. Here you'll find my blog, links to 
                        	raw data such as my pictures and other files, videos, etc.</p>
                        	<p>Use the navigation page on the left to find what you are looking for.</p>
                        </div> <!-- end of content -->
                        
                        </body>
                        </html>
                        Besides with a CSS reset all the styling is removed any way. That is generally what I use and add only the styles that I absolutely need. That way everything gets normalized and less bug hunting has to go on later if all default styling has been removed.
                        Last edited by tZ; 08-08-2009, 03:06 AM.

                        Comment


                        • #13
                          Great stuff tZ! Thanks!!!

                          Whenever I new my new site up I will make sure I PM you the link to check out and get your honest opinion (If you don't mind). The validation site says that the code is green (good), but I still feel like I am over doing a few of my layout techniques with my divs. We shall see though!
                          Professional Pixel Pusher — Designing the world around you. | Working daily to reach 10,000 hours of practice.

                          Comment


                          • #14
                            Hey, TZ and everyone else, thank you very much for your insightful input! Don't worry, I'm humble enough to take advice from those who know more than me.

                            Obviously I'm very much a beginner at this stuff. My first goal for my personal site was simply to make it function and do so as quick as possible. That part worked out fine (albeit, it's ugly, lacks character and design, but it works).

                            I'll definitely step back and take another approach at this (not using frames). I appreciate you helping head me in the right direction. I'm also a fan of doing more with less.

                            Comment


                            • #15
                              Originally posted by CkretAjint
                              Whenever I new my new site up I will make sure I PM you the link to check out and get your honest opinion (If you don't mind). The validation site says that the code is green (good), but I still feel like I am over doing a few of my layout techniques with my divs. We shall see though!
                              Wouldn't mind taking a look at it all. Send me the link when it gets up and I'll be glad to take a look at it CkretAjint.

                              Originally posted by Landshark
                              Hey, TZ and everyone else, thank you very much for your insightful input! Don't worry, I'm humble enough to take advice from those who know more than me.
                              No worries, we all need to begin somewhere. You should have seen my first website…

                              Comment

                              Mediabistro A division of Prometheus Global Media home | site map | advertising/sponsorships | careers | contact us | help courses | browse jobs | freelancers | content | member benefits | reprints & permissions terms of use | privacy policy Copyright © 2014 Mediabistro Inc. call (212) 389-2000 or email us
                              Working...
                              X