locked
Formating Navigation Section RRS feed

  • Question

  • I am using the following Navigation Code in EW4.

    <ul>
       <li><a href="index.html">Home</a><li>
       <li><a href="about/about.html" style="width: 49px">About</a></li>
       <li><a href="buzz/buzz.html" style="width: 40px">Buzz</a></li>
       <li><a href="photo_gallery/default.html">Team Pics</a></li>
       <li><a href="pricing/pricing.html">Pricing</a></li>
       <li><a href="signup/signup.aspx">Signup</a></li>
       <li><a href="Support/support.aspx">Support</a></li>
       <li><a href="contact/contact.html">Contact</a></li>
       <li><a href="links/default.html">Links</a></li>
       <li><a href="login/login.aspx">Team Login</a></li>
      </ul>

    Questions:

    1) The </ul> appears in yellow.  I thought this was an indication of a missing "<ul>" but this is not the case.

    2) When Navigating to the "Pricing" or "Signup" pages from the "Home" (index.html) page and then clicking on the "Home" hyperlink to go back to index.html page I get a 404 error.

    All of the other links work back and forth from index.html. I copied and paisted the navigation section from my master.dwt page to these two pages as well as other pages not based on the master.dwt page and they work.

    I have rebuilt the hyperlinks but still have the problem.  The site is http://www.TrackOurTeam.com"

    Thank you again in advance.  I continue to learn.


    Thank you! Bruce Dill
    Monday, January 10, 2011 11:04 AM

Answers

  • 1. The </ul> appears in yellow because there is a mistake earlier in your list:
    <li><a href="index.html">Home</a> <li>
    It's yellow as a warning that each opening li element isn't matched with a closing one. Fix that one and it should be hunky dory.

    2. Your links aren't the same from page to page (why aren't you using a DWT for all pages?). Look at the links and compare them:
    <li><a href="../Support/support.aspx">Support</a></li>
    <li><a href="Support/support.aspx">Support</a></li>

    See the difference? ../ is missing in the ones that don't work, so the browser is looking for Support in the current directory rather than in the /Support directory.

    Go through your site and make sure that all the menus are exactly the same (and remove the width settings, etc.

    Also: That graphic at the top of the page is a HUGE file! It's 814,847 Bytes! And it takes a dog's age to download. The entire page, ideally, should be no more than 100,000 Bytes, with all graphics, code, etc. Run that thing through a graphics program and shrink the size to 80,000 Bytes or less. Your visitors will thank you.


    Eschew obfuscation.
    • Marked as answer by Bruce Dill Monday, January 10, 2011 9:00 PM
    Monday, January 10, 2011 2:46 PM
  • The links you have are document relative and have not been updated to reflect the correct path.

    When I go to http://www.trackourteam.com/pricing/pricing.html the index.html hasn't been updated to reflect the path location for that page so when you click the Home button you end up with the browser trying to find http://www.trackourteam.com/pricing/index.html instead of http://www.trackourteam.com/index.html.

    Something is wrong with the way your pages are attached and as a result they are not updating. Are you perhaps editing live on the server?

    It looks to me like you are missing a line in your pages:

    <!-- #BeginTemplate "master.dwt" -->

    Also, you shouldn't be using spaces in your title element.

    <title>Home&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; AboutBuzz&nbsp;&nbsp;&nbsp;&nbsp;
    Photo</title>

    Why do you have a boatload of carrage returns to add blank space at the end of your page? I also don't see any paragraphs on the page referenced above but I do see styles on every single line, sometimes more than one.

    <br class="auto-style13" />
     <br class="auto-style13" />
     <span class="auto-style13">One thing we don&#39;t like is a software company
     that has a complex pricing schedule. </span><br class="auto-style13" />
     <br class="auto-style13" />

    Could far more simply be written:

    <p>One thing we don&#39;t like is a software company
     that has a complex pricing schedule. </p>

    If you simply defined the font in the body element:

    body {font-family: verdana, sans-serif;} /*medium is the default so there is no need to specify it.*/

    May I suggest you spend a little time with the resources in the Before Posting sticky that will help you understand how CSS works?

    Edit: I forgot to add that the page structure that Microsoft uses in their templates is bad practice. You should never have a folder that does not have an index.html or whatever is the default file name for your server. That means that if you are using separate folders you should have /pricing/index.html not pricing/pricing.html and your links/default.html should be links/index.html OR your home page should be default.html whichever it is your server uses.


    MS MVP Expression Tutorials & Help http://by-expression.com & Expression Web forums

    • Edited by Cheryl D Wise Monday, January 10, 2011 2:55 PM added more info
    • Marked as answer by Bruce Dill Monday, January 10, 2011 9:02 PM
    Monday, January 10, 2011 2:51 PM

All replies

  • 1. The </ul> appears in yellow because there is a mistake earlier in your list:
    <li><a href="index.html">Home</a> <li>
    It's yellow as a warning that each opening li element isn't matched with a closing one. Fix that one and it should be hunky dory.

    2. Your links aren't the same from page to page (why aren't you using a DWT for all pages?). Look at the links and compare them:
    <li><a href="../Support/support.aspx">Support</a></li>
    <li><a href="Support/support.aspx">Support</a></li>

    See the difference? ../ is missing in the ones that don't work, so the browser is looking for Support in the current directory rather than in the /Support directory.

    Go through your site and make sure that all the menus are exactly the same (and remove the width settings, etc.

    Also: That graphic at the top of the page is a HUGE file! It's 814,847 Bytes! And it takes a dog's age to download. The entire page, ideally, should be no more than 100,000 Bytes, with all graphics, code, etc. Run that thing through a graphics program and shrink the size to 80,000 Bytes or less. Your visitors will thank you.


    Eschew obfuscation.
    • Marked as answer by Bruce Dill Monday, January 10, 2011 9:00 PM
    Monday, January 10, 2011 2:46 PM
  • The links you have are document relative and have not been updated to reflect the correct path.

    When I go to http://www.trackourteam.com/pricing/pricing.html the index.html hasn't been updated to reflect the path location for that page so when you click the Home button you end up with the browser trying to find http://www.trackourteam.com/pricing/index.html instead of http://www.trackourteam.com/index.html.

    Something is wrong with the way your pages are attached and as a result they are not updating. Are you perhaps editing live on the server?

    It looks to me like you are missing a line in your pages:

    <!-- #BeginTemplate "master.dwt" -->

    Also, you shouldn't be using spaces in your title element.

    <title>Home&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; AboutBuzz&nbsp;&nbsp;&nbsp;&nbsp;
    Photo</title>

    Why do you have a boatload of carrage returns to add blank space at the end of your page? I also don't see any paragraphs on the page referenced above but I do see styles on every single line, sometimes more than one.

    <br class="auto-style13" />
     <br class="auto-style13" />
     <span class="auto-style13">One thing we don&#39;t like is a software company
     that has a complex pricing schedule. </span><br class="auto-style13" />
     <br class="auto-style13" />

    Could far more simply be written:

    <p>One thing we don&#39;t like is a software company
     that has a complex pricing schedule. </p>

    If you simply defined the font in the body element:

    body {font-family: verdana, sans-serif;} /*medium is the default so there is no need to specify it.*/

    May I suggest you spend a little time with the resources in the Before Posting sticky that will help you understand how CSS works?

    Edit: I forgot to add that the page structure that Microsoft uses in their templates is bad practice. You should never have a folder that does not have an index.html or whatever is the default file name for your server. That means that if you are using separate folders you should have /pricing/index.html not pricing/pricing.html and your links/default.html should be links/index.html OR your home page should be default.html whichever it is your server uses.


    MS MVP Expression Tutorials & Help http://by-expression.com & Expression Web forums

    • Edited by Cheryl D Wise Monday, January 10, 2011 2:55 PM added more info
    • Marked as answer by Bruce Dill Monday, January 10, 2011 9:02 PM
    Monday, January 10, 2011 2:51 PM
  • Thanks Bill!

     

    The graphic at the top needs to be changed.  This site was originally written in DW but DW can't handle ODBC.  I have never used either product but had no choice to JUMP in.  I built this site over the last four days.  I am learning and sincerely appreciate your help.

     

    Blessings!


    Thank you! Bruce Dill
    Monday, January 10, 2011 9:00 PM
  • Thanks CHeryl,

     

    I am learning a lot quickly.  It is actually kind of fun but not what I should be doing.  The person responsible did everything in DW which is not ODBC compatable.

    You are soo kind to share.

     

    Blessings!


    Thank you! Bruce Dill
    Monday, January 10, 2011 9:02 PM
  • Dreamweaver can handle ODBC, I've used it since Ultra Dev 1 -aka approx 2000.
    MS MVP Expression Tutorials & Help http://by-expression.com & Expression Web forums
    Monday, January 10, 2011 9:49 PM