September 9, 2002-- Newsletter #197

By Vince Barnes


Goodies to Go (tm)
September 9, 2002--Newsletter #197

This newsletter is part of the internet.com network.
http://www.internet.com
 

 
Goodies Announcement

Just in case you missed it before, the new Beyond HTML Goodies book has just been released!

 

Go beyond the basics and learn how the pros add and use dynamic HTML features and advanced JavaScript techniques. Beyond HTML Goodies demonstrates dozens of new and different features readers can add to their existing Web pages using HTML and JavaScript. The book starts with simple text and image tips, such as adding a clock to a Web page or causing text to appear when the mouse moves over an image. It gradually builds to more complex tricks, including manipulating forms or working with cookies behind the scenes. Throughout the book, readers enjoy Joe's snappy style and "to the point" discussion of each "goody" in the book.

 

http://books.internet.com/books/0789727803

 

 

Goodies Thoughts - Easy Navigation Maintenance


Many thanks to all of you who use HTMLGoodies.com as your web development information resource and who send in your questions to the Mentors.
(See http://www.htmlgoodies.com/mentors .)
There have been a lot of questions recently related to web site navigation, and especially how to simplify the navigation maintenance effort. Our mentors have devised a variety of elegant solutions and have shared those solutions with those who sent in the questions. A couple of them have also appeared in Q&A Goodies in earlier issues of this newsletter.
(See http://www.htmlgoodies.com/letters .)
Since this has been such a hot topic recently, I thought it would be a good idea to discuss it a little further here.

First there is the question of where to put the navigation links. Basically there are four options: top, left, bottom and right. You could theoretically place them in the middle and modify the surrounding area, but to do so would mean you are dealing with a much more esoteric site than this topic is intended to deal with! Personally, I favor the left. It seems to me to be the most natural place for a contents list. That being said, the top is a great place for a group of headings. The choice between these two would have to depend on what makes sense for your content. It may be that a group of headings across the top takes you to different sections of the site, while each section has a content list on the left to take you to the various pages in that section. I am not a big fan of contents on the bottom or on the right, except for links to related information that may be in other sites. The bottom and the right also have to contend more with screen resolution problems. It is no fun the develop a site with lots of interesting sections if nobody can find out they are there because the contents have disappeared off the right or dropped off the bottom!

Enough with the cosmetics! Let's get to the "How?"

There are several possible methods to use for easy to maintain contents. One method which does not fit this category is to create a table on each page that contains the contents list. Each time you change a link, you would have to change every page on which that link appears. It's doubtful you'll do that more than once or twice without making any errors!

Next method: if you're using FrontPage or a similar program, they typically have a means of automatically generating navigation features. In FrontPage you can us "Shared Borders" (for more information, use the indicated term as a search term in FrontPage's Help system -- for more about FrontPage, see http://www.htmlgoodies.com/articles/frontpagep1.html ) into which you put navigation elements using the "Navigation" view. This method works, but depends on the particular program to support it and takes you a little further away from the actual code, thereby reducing your level of control a little.

Another method is to create pages (files) that are "include"d into your various site pages. This is called Server Side Includes (SSI). We have an article (see http://www.htmlgoodies.com/beyond/asp.html ) that includes a very nice section with examples on how to do this. The trouble with this method is that it depends on the server permitting SSI. While most do these days, there are still some that don't. You might want to check with your service provider before writing a ton of code using SSI (unless of course, you just want the practice!)

In my opinion, the best method is to use frames. "Uggh!" I hear from the peanut gallery! In the old days (and the Internet is getting older!) frames were shunned because they looked ugly and a lot of browsers didn't support them. Almost every modern browser now support frames and those frames can have zero width borders so you dont even have to know they're there. Judicious use of contents, sizes etc. should also prevent the need for scroll bars appearing in the middle of your page. "How?" Easy! There's a neat tutorial right here: http://www.htmlgoodies.com/tutors/fram.html Go ahead and get right in! With a frame on the left for contents, one on the right for the body of the site and possibly one across the top for titles and even group headings (see http://www.htmlgoodies.com/tutors/2atonce.html for advice on how to change both the contents and the main body frames with one click of a subject header) you should be all set. Many thanks also to our esteemed reader Dr. Virginia Lawrence who reminds us that "1. The site owner should not be removing or renaming pages from his Web site after the Web site has been spidered by the search engines. If he removes or renames pages, he is breaking his existing search engine links. (Adding links and pages, is of course, perfectly fine!) 2. Not all of the search engines can follow SSI, ASP, or JavaScript links."
 


Thanks for reading!
 

 



Q & A Goodies

Questions are taken from submissions to our Community Mentors. You can ask a Mentor a question by going to http://www.htmlgoodies.com/mentors/.



Q. Is there anyway to indicate the window size of a link in standard html?


A. To make a new window a specific size you can add a little JavaScript to the html link code
like so:

<a href="#"
OnClick="window.open('YourPageNameHere.html','my_window','width=300,
height=200, menubar, status, scrollbars, resizable, toolbar,
location');">Your Link Here</a>

Just change the the part "YourPageNameHere" to the actual name of your html file and set your height and width to the size you want. You can also
leave off the menu bar, status bar, scroll bar, tool bar, location bar and
make it not resizable by just leaving any of those sections out of the code.



Q. In the gallery pages i.e portraits the page loads with the jpegs. , on clicking the image a larger version appears in a pop-up. This works okay, except that the original page stops loading, so to see images that had not loaded prior to the pop-up the page has to be refreshed.
Is there a way for the page to continue loading in the background?

A. You might try pre loading the images in the gallery pages.
If you have a copy of JavaScript Goodies, this is covered in Chapter 4, Lesson 17.  You should also be able to find pre loading images covered on the web site.

The code should be placed within the script tags that lie between the head tags at the top of your frame page. The intent is to cause the image files to load into the cache before the body of the page is loaded, thus rendering the images more quickly.
There is a chance this might not help as when your visitors click to open the new window before all the images are done loading, the previous page loses focus.



Q.  I'm using a table with links in the cells and want the cell an link to change color when the mouse goes over them. Currently, when the mouse moves over the hyperlink, the cell it is in changes color, but if the mouse just goes over the cell and not the hyperlink itself, nothing changes.

A. Here is a sample script of one way that you could have the cell color change only when you mouse over the text link. This script will work in IE5+ and NS6+ version browsers. For NS4 and IE4 nothing will happen when you mouseover, but you also will not receive any errors Take a look at the code below and let me know if you have any questions.

<html>
<head>
<title>Table Cell and Link Color Change</title>
<SCRIPT LANGUAGE="JavaScript">
function chgtxt(obj,cellid,cellcolor,linkcolor)
{
if(document.getElementById) // IE5+ and NS6+ only
{
document.getElementById(cellid).style.backgroundColor=cellcolor
document.getElementById(obj.id).style.color=linkcolor
}
}
</SCRIPT>
</head>
<body>
<TABLE ALIGN="left" BORDER="1" WIDTH="20%" HEIGHT="10%" CELLSPACING="0" CELLPADDING="0">
<TR>
<TD ID="td1" STYLE="background-color:blue;" ALIGN="center" VALIGN="middle">
<A HREF="somepage.html" ID="link0" STYLE="color:white;font-weight:bold;font-size:11pt;font-face:Arial" onMouseOver="chgtxt(this,'td1','white','blue')" onMouseOut="chgtxt(this,'td1','blue','white')">Click Me</A>
</TD>
</TR>
<TR>
<TD ID="td2" STYLE="background-color:yellow;" ALIGN="center" VALIGN="middle">
<A HREF="somepage.html" ID="link1" STYLE="color:red;font-weight:bold;font-size:11pt;font-face:Arial" onMouseOver="chgtxt(this,'td2','red','yellow')" onMouseOut="chgtxt(this,'td2','yellow','red')">Click Me</A>
</TD>
</TR>
</TABLE>
</body>
</html>
 

 

 

Q.  I would like to know how to put an executable file on my web page. I have created a file using ebcreator. Their web page says the ebooks created can be downloaded from a home page but I can not figure out how to get the file on the page.

 

A. You just use the regular link code <a href="mybookname.pdf">My Ebook</a>. Most ebooks are viewable in adobe .pdf format so the user (which most already do) must have the free adobe pdf viewer to read it.

 

 


News Goodies

 

Microsoft Rolls out Windows XP Update
[September 9, 2002] Service Pack 1 will let computer makers and users avoid key Microsoft middleware programs, as mandated by the company's pending antitrust settlement.

Click here to read the article

 

I've Been Framed!
(If you read my piece above, you should also read this! - VB)
[September 9, 2002] New vulnerability discovered in IE could allow attackers to compromise your computer through a Web site's frames.

Click here to read the article

 

 

Movie Titans Struggle Against Tides of Fate
[May 17, 2002] FEATURE: Hollywood is on the brink of rolling out PC broadband video-on-demand services, but has the wait been too long? There may not be enough market to support IP network services with piracy in vogue.

Click here to read the article

 
 
And Remember This . . .


On this day in...

1956, Elvis on Ed Sullivan
Elvis finally appeared on the Ed Sullivan Show. Ed had refused to book Elvis because he thought the singer's stage gyrations and suggestive move were scandalous. He changed his mind, however, due to the amazing popularity of the singer on other shows. After he appeared on Ed's show, his name became a household name.


1945, The first computer bug!

Computer pioneer Grace Murray Hopper found the first documented live bug in a computer on this day in 1945. Although the term "bug" had been used to describe technical glitches since the late 1800s, the bug that plagued Hopper this day was an actual moth that had managed to get into the circuitry of the Mark II computer at Harvard University. The bug, which Hopper and her assistants removed with tweezers, was preserved at the Naval Museum in Dahlgren, Virginia


 


Thanks for reading Goodies to Go!

 

Archive Home Page.



Make a Comment

Loading Comments...

  • Web Development Newsletter Signup

    Invalid email
    You have successfuly registered to our newsletter.
  •