demosthenes.info

I’m Dudley Storey, the author of Pro CSS3 Animation. This is my blog, where I talk about web design and development with , and . To receive more information, including news, updates, and tips, you should follow me on Twitter or add me on Google+.

web developer guide

my books

Book cover of Pro CSS3 AnimationPro CSS3 Animation, Apress, 2013

my projects

A Sass color keyword system for designers. Replaces CSS defaults with improved hues and more memorable, relevant color names.

CSSslidy: an auto-generated #RWD image slider. 3.8K of JS, no JQuery. Drop in images, add a line of CSS. Done.

tipster.ioAutomatically provides local tipping customs and percentages for services anywhere.

Link Oddities: empty links and mailto links

html / links

Estimated reading time: 1 minute, 34 seconds

Sometimes you want to give something the appearance of a link, but not actually link to anything. This can be particularly useful when activating a JavaScript function, for example. However, we have a small problem. If you put any text at all inside the quotes of the <a href=""> link, the browser will attempt to find that resource. So what do you do?

The answer is to link to a hash / pound symbol (#). This will give the appearance of a link, but the link won’t actually do anything. For example:

<a href="#">This looks like a link, but it really only appears that way: it won’t go anywhere when clicked on</a>

In theory you can surround anything with a hypertext reference. The most common things to link are text and images, but under the DOM, a href can be applied to any element - tables, horizontal rules, anything.

If <a> can link to anything, it’s possible to create a link to an eMail that will be automatically created when clicked on by the user:

<a href="mailto:youraddress@yourmailserver.com">

Note that this assumes that the user has an eMail client installed and knows how to use it: be aware that not everyone does (some use a web service like Hotmail or gMail exclusively, for example). Also, this technique does tend to be picked up by “page scrapers” used by spammers to harvest eMail addresses. It's perfectly good, even advisable for a business site, but a better technique is to make a PHP form that will send the contents of a form to an eMail address.

<a href=”mailto:youraddress@yourmailserver.com?subject=Subject Line Here”>

(Note the use of ? to separate elements in a link: it’s a particularly subtle technique that can be used to great advantage when we get to processing information with PHP.)

comments powered by Disqus

This site helps millions of visitors while remaining ad-free. For less than the price of a cup of coffee, you can help pay for bandwidth and server costs while encouraging further articles.