Search code examples
htmlurltagssemantics

What is the semantic HTML tag to display for URLs that are not links?

I have a search engine plugin that outputs results in a basic structure:

<a href="page url">
    <div class="searchResult">
        <h3>Page title</h3>
        <p>Page url</p>
        <p>Page <meta> description</p>
    </div>
</a>

The plugin is designed to integrate into an existing website so it has no default styling. However, websites are supposed to be usable even without CSS through the use of the correct, semantic HTML tags. Currently the displayed URL is indistinguishable from the description and would appear as a software glitch without additional styling.

Google uses the <cite> tag, however in HTML 5 <cite> should be used for the title of a work, not a URL so this isn't the answer.

Is there a HTML tag that is designed to show a URL other than <a>, a URL that is not clickable? What is the semantic approach for this?

Solution

  • If I understand you correctly, you want the url to be a link but also display as a url. To do this put the url in the a tag twice, like so:

    This can then be style as desired by the destination page.

    <style>
a {
color: blue;
text-decoration: underline; }
</style>

<a href="http://www.google.com/">http://www.google.com/</a><br /><br />

Edited to add:<br /><br />

<a>http://www.google.com/</a>