navigation
a webmaster learning community
     Home    Register     Search      Help      Login    
Sponsors

Shopping Cart Software
Ecommerce software integrated into Frontpage, Dreamweaver and Golive templates. No monthly fees and available in ASP and PHP versions.

Website Templates
We also have a wide selection of Dreamweaver, Expression Web and Frontpage templates as well as webmaster tools and CSS layouts.

Frontpage website templates
Creative Website Templates for FrontPage, Dreamweaver, Flash, SwishMax

Spooky Login
This ASP Login code allows you to create protected areas on your website, where only registered users can enter or as a method of collecting membership information.

Search Forums
 

Advanced search
Recent Posts

 Todays Posts
 Most Active posts
 Posts since last visit
 My Recent Posts
 Mark posts read

Microsoft MVP

 

back to top link

 
View related threads: (in this forum | in all forums)

Logged in as: Guest
Users viewing this topic: none
Printable Version 

All Forums >> Community >> OutFront Discoveries >> back to top link
Page: [1]
 
d a v e

 

Posts: 3935
Joined: 7/24/2002
From: England (but live in Finland now)
Status: online

 
back to top link - 2/26/2008 16:50:41   
embarrassingly enough i never realised that this was the best way to make a 'back to the top' link to go back to the top of a page...

(courtesy of this thread: http://www.webmaster-talk.com/html-forum/115858-return-to-top-html-code.html )

i always used the old 'name' way when it's so much easier to simply place, for example,

<a href="#wrapper">top</a>

and target an existing id at the top of your page or simply add an id to any existing element at the very top of the page

;)





_____________________________

David Prescott
Gekko web design
Starhugger

 

Posts: 489
Joined: 4/12/2005
Status: offline

 
RE: back to top link - 2/28/2008 17:27:03   
I've mostly just used < a href="#" > using a linked up-arrow GIF, but lately I've wondered about something else. So much material gets copied into pages in MySpace, etc., and they so often wind up snaring linked graphics which use my own bandwidth. I've never been able to find a way to trace which MySpace page they're coming from. At any rate, I was thinking that if I were to include the address of the page in the href address, a click on those up-arrows would at least take them back to my site. I might even benefit from the back-link, although I doubt the Big-G would consider it a quality link. <shrug> More trouble than it's worth maybe.

Starhugger


(in reply to d a v e)
Tailslide

 

Posts: 5764
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline

 
RE: back to top link - 2/29/2008 2:26:36   
I do this:

<a id="top" name="top"> </a>

<a href="#top>Back to top</a>



_____________________________

"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project

(in reply to Starhugger)
Starhugger

 

Posts: 489
Joined: 4/12/2005
Status: offline

 
RE: back to top link - 2/29/2008 12:10:01   
I used to do that too, but I found that even when I put the anchor at the top of the Header, it would take it up but drop it down slightly from the very top of the page. Maybe that's because I'm using a FrontPage theme and I couldn't get at the raw code (not without digging around in the hidden files, anyway). When I discovered that just "#" would do the same, I started using that instead.

Starhugger


(in reply to Tailslide)
womble

 

Posts: 5445
Joined: 3/14/2005
From: Living on the edge
Status: offline

 
RE: back to top link - 2/29/2008 17:21:55   

quote:

ORIGINAL: Tailslide

I do this:

<a id="top" name="top"> </a>

<a href="#top>Back to top</a>




Same here. Never really thought about using an existing element, I suppose really on the off chance that I might rename or remove that element or something. I use the same set-up for toplinks on all my sites, so that's generally the safest thing, I've found.

_____________________________

~~ "A cruel god ain't no god at all" ~~
:)

(in reply to Tailslide)
Donkey

 

Posts: 3787
Joined: 11/13/2001
From: Blackfield United Kingdom
Status: online

 
RE: back to top link - 3/4/2008 10:48:02   
I agree, you need your top anchor at the highest point - there is nothing worse than a top link that takes you almost, but not quite to the top of the page.

It is probably considered overkill, but I always use this.
<p class="top"><a id="top">Top</a> </p>

<a href="#top" title="Link to the top of this page"> Back to Top</a>
And in the CSS
p.top{
margin: -8px 0 0 0;
background-color: transparent;
visibility: hidden;
}

p.top a{
visibility:hidden;
font-size: 0.1em;
}


I read somewhere that it is better to link to a word rather than an empty anchor.

I always make the anchor the first thing inside the <body> tag, above the container and above any skip links. It works for me.

_____________________________

:)

I have a higher and grander standard of principle than George Washington. He could not lie; I can, but I won't.
Samuel Clemens

(in reply to womble)
Starhugger

 

Posts: 489
Joined: 4/12/2005
Status: offline

 
RE: back to top link - 3/4/2008 11:26:32   

quote:

ORIGINAL: Donkey

I read somewhere that it is better to link to a word rather than an empty anchor.

That's interesting. I'd like to find out more about that. Any idea where you read it, or what context it was in?

quote:

I always make the anchor the first thing inside the <body> tag, above the container and above any skip links. It works for me.

That won't work if you're using a FrontPage theme. With FP, it will only take you to the top of the content, not the top of the page header. Even when I've tried putting the tag into the top-most point I could get to in the header (by placing the cursor directly into the header and then inserting HTML code through a FP Web Component), it still lands about one line down from the top of the page.

SH

(in reply to Donkey)
Donkey

 

Posts: 3787
Joined: 11/13/2001
From: Blackfield United Kingdom
Status: online

 
RE: back to top link - 3/4/2008 13:12:16   
I've no idea where I read that or even if it is correct, it was probably a throwaway remark someone made in a forum. It does work though.

In code view type it just below the opening body tag.

So it looks like this.
<body>
<p class="top"><a id="top">Top</a></p>


That should work, although I haven't used frontpage themes so I stand ready to be corrected by an expert.

Alternatively you can move it up the page by increasing the negative top margin (or technically decreasing it).
e.g
p.top{
margin: -15px 0 0 0;
}

< Message edited by Donkey -- 3/4/2008 13:18:32 >


_____________________________

:)

I have a higher and grander standard of principle than George Washington. He could not lie; I can, but I won't.
Samuel Clemens

(in reply to Starhugger)
caz

 

Posts: 3431
Joined: 10/10/2001
From: Somewhere south of Chester, UK
Status: offline

 
RE: back to top link - 3/4/2008 13:48:01   
Sometimes returning to the top of the content makes more sense to the reader, especially if you have good content and a decorative only header.

_____________________________

Do not meddle in the affairs of cats, for they are subtle and will dance, or more on your keyboard.
Cheshire cat. www.doracat.co.uk

I remember when it took less than 4hrs to fly across the Atlantic.

(in reply to Donkey)
Starhugger

 

Posts: 489
Joined: 4/12/2005
Status: offline

 
RE: back to top link - 3/4/2008 13:49:02   
Hmmm... Okay, well I tried to test it to prove you wrong, but it turned out okay. (I hate it when that happens... :) ) But it wasn't taking me to the top of the page when I tried it ages ago, honest! LOL

SH

(in reply to Donkey)
Starhugger

 

Posts: 489
Joined: 4/12/2005
Status: offline

 
RE: back to top link - 3/4/2008 13:50:36   
quote:

ORIGINAL: caz
Sometimes returning to the top of the content makes more sense to the reader, especially if you have good content and a decorative only header.

In my case, I have my navigation there too.

SH

(in reply to caz)
womble

 

Posts: 5445
Joined: 3/14/2005
From: Living on the edge
Status: offline

 
RE: back to top link - 3/4/2008 15:29:08   

quote:

ORIGINAL: caz

Sometimes returning to the top of the content makes more sense to the reader, especially if you have good content and a decorative only header.


That's what I usually do, especially if my header's only got the page title in it (usually hidden from view by using image replacement if I've used a decorative font). I usually use skip links right up at the very top of the page to skip to either the navigation, content, or sidebar if I'm using one though.

_____________________________

~~ "A cruel god ain't no god at all" ~~
:)

(in reply to caz)
caz

 

Posts: 3431
Joined: 10/10/2001
From: Somewhere south of Chester, UK
Status: offline

 
RE: back to top link - 3/4/2008 18:36:52   
I do too - skip links that is and as the content anchor is already defined then that's where the back-to-top links lead to if needed. Of course if your navigation is not visible like that then you must do otherwise.

_____________________________

Do not meddle in the affairs of cats, for they are subtle and will dance, or more on your keyboard.
Cheshire cat. www.doracat.co.uk

I remember when it took less than 4hrs to fly across the Atlantic.

(in reply to womble)
jaybee

 

Posts: 13778
Joined: 10/7/2003
From: Berkshire, UK
Status: offline

 
RE: back to top link - 3/4/2008 20:21:34   
quote:

<p class="top"><a id="top">Top</a></p>


It does work but it turns the word TOP into an anchor, so when you hover over it it changes colour or underlines or whatever you do to distinguish links, which can confuse visitors into thinking clicking it takes them somewhere when it doesn't.

If you then apply the css to make it invisible the way Donkey has, that's fine but if you decide to use the first word of your first paragraph as an anchor then you have a problem.

_____________________________

If it ain't broke..... fix it until it is.
:)

:)
GAWDS
Now where did I put that Doctype?

(in reply to caz)
Page:   [1]

All Forums >> Community >> OutFront Discoveries >> back to top link
Page: [1]
Jump to: 1





New Messages No New Messages
Hot Topic w/ New Messages Hot Topic w/o New Messages
Locked w/ New Messages Locked w/o New Messages
 Post New Thread
 Reply to Message
 Post New Poll
 Submit Vote
 Delete My Own Post
 Delete My Own Thread
 Rate Posts