Could you [collectively, nobody in particular] please help? I am confused about same-page anchors/linking and the use of id= .

Question

So, last I knew, you can't use ID more than 1 time per page. Pretty sure it's still the case. But my problem/confusion lies in the supposed way (which I'm not clear about either) to link to parts of the same page (like a TOC for ex.). How is the "sending" anchor to be worded? I know it has ID=" " in it. Then when done, how is the "receiving" end of the anchor written? Ughh! I'm so confused and frustrated. My last attempt resulted in my Dog getting 557 emails from me, all with links right back to me! Oops!

Answer 1

An ID should only be assigned to one tag/element within a page. It may be used across multiple pages within the same project if relevant to the current context. This doesn't mean that an ID couldn't be used multiple times within the same page/project however. In fact most browsers will treat an ID in a similar fashion to a class if it is used as such. This is strongly discouraged and considered to be bad practice. When creating a link to this ID of the page you prefix the ID in the href with a #.

page1.html
<p id="para">A paragraph that can be linked to using the given id</p>
...
...
...
<a href="#para">Link to paragraph somewhere else on the same page</a>

page2.html
<a href="page1.html#para">Link to the paragraph from another page<a/>

NOTE: Depending on the server type etc you also need to use some relative path identifiers
Such as ./ for the same directory or ../ up one directory

For instance I had a link like above that worked fine when running on my PC in the browser, but once uploaded to the server a link on the same page looked like:
<a href="./#id-name"></a>
instead, while a link to another page named index.html in its own directory might look like:
<a href="directory-name/#id-name"></a>
and to a page that is up one directory with a page named index.html:
<a href="../#id-name"></a>
while if the pages name was something other than the servers built in names that may be used for the main page within a directory (index.html, index.php, index.htm, etc) the name of the page would need to come before the id if not linking within the same page like:
<a href="./page-name#id-name"></a>
or
<a href="../page-name#id-name"></a>
or
<a href="directory-name/page-name#id-name"></a>