This document answers questions asked frequently by web authors. While its focus is on HTML-related questions, this FAQ also answers some questions related to CSS, HTTP, JavaScript, server configuration, etc.
This document is maintained by Darin McGrew <darin@htmlhelp.com> of the Web Design Group, and is posted regularly to the newsgroup comp.infosystems.www.authoring.html. It was last updated on October 20, 2001.
The following questions have moved to other sections of the FAQ.
Use an anchor element. The HREF attribute specifies the URL of the document that you want to link to. The following example links the text "Web Authoring FAQ" to <URL:http://www.htmlhelp.com//faq/html/>:
<A HREF="http://www.htmlhelp.com//faq/html/">Web Authoring
FAQ</A>
For more information on links and the anchor element, see: http://www.htmlhelp.com//reference/html40/special/a.html
First, identify the destination of the link with a named anchor (an anchor that uses the NAME attribute). For example:
<H2><A NAME="section2">Section 2: Beyond
Introductions</A></H2>
Second, link to the named anchor. The URL of the named anchor is the URL of the document, with "#" and the name of the anchor appended. For example, elsewhere in the same document you could use:
<A HREF="#section2">go to Section 2</A>
Similarly, in another document you could use:
<A HREF="thesis.html#section2">go to Section 2 of my
thesis</A>
<A TARGET="_blank" HREF=...> opens a new, unnamed
window.
<A TARGET="foobar" HREF=...> opens a new window named
"foobar", provided that a window or frame by that name does not already
exist.
Note that links that open new windows can be annoying to your readers if there is not a good reason (from the reader's perspective) for them.
With HTML, there is no way to control the size (or window decoration, or
other features) of a new window.
However, in JavaScript you can specify such details when using the
window.open() function.
Start with a normal HTML link (possibly one that opens in a new window as described in the answer to the previous question). Then use the ONCLICK attribute to open a window with the desired appearance for those readers with JavaScript supported and enabled. The following example specifies a window named "popup" that is 300 pixels by 150 pixels.
<A HREF="foo.html" TARGET="popup"
ONCLICK="window.open('foo.html', 'popup', 'width=300,height=150'); return
false">View Foo</A>
Used in this manner, JavaScript can specify a new window with the desired appearance, without blocking access when JavaScript is unsupported/disabled.
In addition to the parameters height and
width (which take a pixel count as a value), the third
argument to the window.open() can include the following
booloean parameters (which take "yes" or "no" as
a value):
directories, location, menubar, resizable, scrollbars, status, and toolbar.
These boolean parameters control the presence of the corresponding window
decorations in the resulting window.
This is best done with a small form:
<FORM ACTION="[URL]" METHOD=GET>
<INPUT TYPE=submit VALUE="Text on button">
</FORM>
If you want to line up buttons next to each other, you will have to put them in a one-row table, with each button in a separate cell.
Note that search engines might not find the target document unless there is a normal link somewhere else on the page.
A go-to-other-page button can also be coded in JavaScript, but the above is standard HTML and works for more readers.
You cannot do this with HTML. Going "back" means going to the previous location in your history. You could create a link to the URL specifed in the HTTP Referer header (available in the HTTP_REFERER environment variable in CGI programs), but that creates a link forward to a new location in your history. Even then, the information in the Referer header can be wrong. Some browsers incorrectly send the Referer header when the user enters a URL manually or uses a bookmark. Some never send the Referer header (which is optional).
You could use JavaScript's history.back() to create a back
button (or link).
Naturally, this only works when JavaScript is supported and enabled.
For a more detailed explanation, please see Abigail's "Simulating the back button" at <URL:http://www.foad.org/%7Eabigail/HTML/Misc/back_button.html>.
Also, it is worth noting that the only navigation tool used more frequently than the "back" function is the hyperlink. Your readers almost certainly know how to use their browsers' "back" function. Users who don't know how to use basic functions of their browsers will only be confused when various pages imitate those functions in different ways.
You cannot do this with HTML.
However, Internet Explorer 4+ supports the
window.external.AddFavorite() method, a proprietary extension
to JavaScript that opens an "Add to Favorites" dialog.
The following example avoids creating a non-functional button for those
with other browsers, or for those with JavaScript disabled:
<script type="text/javascript"><!--
function addf() {
window.external.AddFavorite('http://www.htmlhelp.com/',
'Web Design Group'); }
if(document.all) {
document.write('<input type="button" onclick="addf()"'+
' value="Bookmark WDG Site">'); }
//--></script>It is worth noting that readers who know how to use bookmarks almost certainly know how to bookmark your site independently. Likewise, the few readers who don't know how to bookmark your site probably won't know how to use bookmarks that you create for them. Users who don't know how to use basic functions of their browsers will only be confused when various pages imitate those functions in different ways.
You cannot do this with HTML.
However, some browsers support the JavaScript window.print()
method, which opens a "Print" dialog.
The following example avoids creating a non-functional button for those
with other browsers, or for those with JavaScript disabled:
<script type="text/javascript"><!--
if (window.print) {
document.write('<input type="button" onclick="window.print()"'+
' value="Print This Page">'); }
//--></script>It is worth noting that readers who have printers almost certainly know how to use their browsers' print function. Users who don't know how to use basic functions of their browsers will only be confused when various pages imitate those functions in different ways.
Use a mailto link, for example
Send me email at
<A HREF="mailto:me@mydomain.com">me@mydomain.com</A>.
Note that any email address that you publish on the WWW like this will probably start receiving unsolicited commercial email (UCE, junk email). It's a good idea to protect your real email address (e.g., by filtering incoming email, or by using a separate address only for mailto links).
You can't, not in any reliable way. The methods that are frequently posted are not effective on all combinations of browser and email software (not even on all common combinations), and many of them have an important drawback: when they fail, the email will be lost.
If you really need a subject, you can do it by providing a form on your page, which submits data to a CGI program that emails the form data to you with your desired subject line. However, the form must have an input field for the visitor's email address, and you must hope that the visitor enters it correctly.
Here are some other ways to transmit subject-type information:
<A HREF="mailto:user@site" TITLE="Your Subject">.
Most browsers will ignore the TITLE attribute, but some minor
browsers will use it as a subject for the email message. All browsers will
send the mail.<A HREF="mailto:user@site?subject=Your%20Subject">,
which puts "Your Subject" (the space is encoded as "%20") in
the "Subject" header field of the email message in most current browsers.
The details of this RFC can be found at
<URL:http://info.internet.isi.edu/in-notes/rfc/files/rfc2368.txt>.
Note however that you will lose mail from users of older browsers, so you
should consider whether the pre-filled subject is worth lost mail.If you want to turn off link underlining when you're looking at pages in your browser, check your browser's configuration options. In Netscape 3, for example, see Options | General Preferences | Appearance; in Netscape 4 it's Edit | Preferences | Appearance | Colors; in Internet Explorer see View | Options | General.
If you want to prevent links on your page being underlined when your visitors see them, there's no way in HTML to accomplish this. You can suggest this presentation using style sheets by defining
a:link, a:visited, a:active {text-decoration: none}
You can suggest this presentation using style sheets. In your style sheet, define something like this:
a:link {color: blue; background: white}
a:visited {color: purple; background: white}
a:active {color: red; background: white}
a.foo:link {color: yellow; background: black}
a.foo:visited {color: white; background: black}
a.foo:active {color: red; background: black}
Then use CLASS="foo" to identify the links of the second
color in your HTML, like this:
<A CLASS="foo" HREF=...>...</A>
In your style sheet, use the hover pseudo-class to specify
a different appearance for links when the cursor is over them.
Specify the hover pseudo-class after the link and
visited pseudo-classes.
For example:
A:link { color: blue ; background: white }
A:visited { color: purple ; background: white }
A:hover { color: red ; background: white }
Your markup may include HTML syntax errors that affect links. For example, there may not be quotes around attribute values that require quotes, or there may be a missing closing quote at the end of the HREF attribute value.
Perfectly valid markup may trigger common browser bugs. For example, even though a ">" character is valid inside (quoted) attribute values, several older browsers will think the tag ends there, so the rest of the tag's attributes are displayed as normal text. Likewise, ">" characters inside comments can trigger similar browser bugs. (See the answer to "How can I include comments in HTML?" for practical guidelines.)
As another example, some versions of Netscape Navigator are known to have problems with links to named anchors when the anchors are within a table that uses the ALIGN attribute.
It is also possible that your URLs are incorrect. For example, your web authoring software may have used file URLs (e.g., file:C:\path\file.html). If so, then you should replace them with relative URLs (e.g., file.html) or http URLs (e.g., http://example.com/path/file.html).
See the answer to "How can I check for errors?" HTML validators will find syntax errors in your markup. HTML checkers/linters can find some syntax errors and valid markup that is known to trigger some common browser bugs. Link checkers can find links to incorrect URLs.
Is there a space, #, ?, or other special character in the path or filename? Spaces are not legal in URLs. If you encode the space by replacing it with %20, your link will work.
You can encode any character in a URL as % plus the two-digit hex value of the character. (Hex digits A-F can be in upper or lower case.) According to the spec, only alphanumerics and the special characters -_.!*'() never need to be encoded.
You should encode all other characters when they occur in a URL, except when they're used for their reserved purposes. For example, if you wanted to pass the value "Jack&Jill" to a CGI script, you would need to encode the "&" character as "%26", which might give you a URL like the following: http://www.foo.com/foo.cgi?rhyme=Jack%26Jill&audience=child
Note that the "?" and other "&" character in this URL are not
encoded since they're used for their reserved purposes.
However, when this URL is used as an attribute value in an HTML document,
the "&" character must be encoded as "&", like the following:
<A HREF="http://www.foo.com/foo.cgi?rhyme=Jack%26Jill&audience=child">
For the technical details, see <URL:http://www.w3.org/Addressing/>
Home,
Reference,
FAQs,
Tools,
Design,
Feature Article,
BBS,
Links
Copyright © 1996-2001 by the Web Design Group. This material may be distributed only subject to the terms and conditions set forth in the Open Publication License, v1.0 or later (the latest version is presently available at http://www.opencontent.org/openpub/).