Home/ Questions/Q 3879382
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-19T22:43:12+00:00

Question about anchors in html , with maximum seo-friendlyness as well as user-friendlyness. Currently,

  • 0

Question about anchors in html, with maximum seo-friendlyness as well as user-friendlyness. Currently, the tabs on our website use javascript-auto-created numeric anchors e.g. when mouse hovering on them user sees: page#1, page#2 and page#3 Though this works fine, its not very sexy for a search engine, I guesse.

Now, tabs shows up in html as follows:

<div class="panel">
    <h3 class="tab">Tab Title</h3>
    <p>Contents</p>
</div>

<div class="panel">
    <h3 class="tab">Tab Title</h3>
    <p>Contents</p>
</div>

My plan is thus, to make non-auto, manually prescribed anchors on those javascript tab-buttons e.g. page#overview, page#servicesand page#prices.

Q1. Would the new tab anchors make my site better searchable?

Q2. OR, should the anchor texts be more specific? if so, Why doesn’t dreamweaver allow me to make bit more specific anchors e.g.
page#architectural services overview or
page#ornamental garden fountains?

When in Dreamweaver I navigate to menu > Insert > Named Anchor and fill in the single field something like “fountains”. Then, Dreamweaver inserts the following: 

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

Q3. Are both neccessary or is just one of part essential, or should that a tag be even broadened by adding a title=”fountain” in other words, whats the best way to write elegant anchors these days?

Q4. What are differences, if any, between anchor, anchor-tag, named-anchor, html-anchor

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Google’s spiders don’t render the page, as far as I can tell, as that would be pretty expensive to accomplish. They just look at the HTML. When you view the source of your site, it shows none of that JavaScript-generated content, and this is all Google (and any other engine) sees.

    Q1: page#overview is specifying the ID of the element. page#overview is also invalid HTML, as there is no <page> element. Google reads what’s written on the tabs, not their IDs. Just make them descriptive.

    Q2: page#architectural services overview is completely invalid HTML. If you must make such a long ID, use underscores: page#architectural_services_overview. Otherwise, you might get some crazy results when rendering the page…

    Q3: HTML attributes (href, rel, alt, id, name, title, etc.) each have a purpose. As you know, href is used to denote the location that a link points to. name is used by serverside scripts when you submit forms, so be nice to them. I would not touch the name unless it’s being used by a PHP script or the alike.

    Q4: This is why I don’t like Dreamweaver… Anchors (correct me if I’m wrong) are used by the browser to scroll to elements within a page. They are denoted by the id of an element prepended with a #. Try clicking here. The href is https://stackoverflow.com/questions/4911438/whats-the-best-syntax-for-using-html-named-anchor-texts-on-tabs-for-better-seo-se#top, and #top is the top of the document.

    Similarly, clicking here brings you to the bottom. It references #footer-menu.

    Hope this helps 😉

    • 0