You are editing a student news story and want to link to the school board’s published agenda. The words should tell readers what they will open, and the address should lead to the right document. Understanding the syntax of an href and the structure of an HTML link lets you check both parts before the story goes live.
HTML link syntax: Connect text to a destination
An HTML link commonly uses an anchor element, written as <a>, with an href attribute. The attribute holds the destination; the text between the opening and closing tags is the visible link text, often called anchor text. Here is an invented editorial example:
<a href="https://example.org/board/agenda.html">Read the school board agenda</a>
The a identifies the anchor element. The opening tag uses href attribute syntax: an equals sign and an address in quotation marks. The closing </a> ends the link. A browser displays “Read the school board agenda” as the clickable text, rather than displaying the tags as part of the article. The example domain and path are placeholders: replace them with a verified destination in a real story.
The href syntax connects the reader’s action to the address. The syntax of the href attribute places the destination inside the opening tag. The text and URL have separate jobs, so check both: a clear label cannot repair a misspelled address, and a correct address does not explain itself to a reader. MDN’s guide to the anchor element describes its attributes and other destinations.
Read the link one piece at a time
Start with the opening <a, followed by a space and the attribute. In href="https://example.org/board/agenda.html", the quotation marks surround the complete value. The closing angle bracket ends the opening tag. After the words the reader sees, </a> closes the element. A href syntax check should confirm that both tags are present and that the address sits inside the attribute value.
If the closing tag is missing, the browser may treat later content as part of the link. If the address has a typo, the link may lead to an error or an unintended page. The structure of an anchor with an href keeps the address separate from the visible label. Use quoted attribute values consistently; this makes the boundaries easy to see, particularly when an address contains punctuation. Read the HTML link syntax alongside a preview of the rendered page so you can compare the code with the result.
A link without href does not create the same navigable hyperlink as the example above. If you have not yet confirmed a destination, leave yourself an editorial note and add the actual attribute only after checking the source. Avoid publishing a placeholder as though it were a finished citation.
Absolute and relative addresses
An absolute URL includes the scheme and host, as in the example above. It gives the browser a full address. Use one when linking to an external source such as a board’s official site, and verify that the page is the actual document you intend to cite. The href syntax stays the same; only the value changes.
A relative URL is resolved against the document’s base URL. Suppose a page is at https://example.org/news/story.html, with no separate base URL declared, and the intended page is https://example.org/news/agenda.html:
<a href="agenda.html">Read the meeting agenda</a>
Here agenda.html resolves within the /news/ directory. A leading slash, as in /board/agenda.html, instead starts at the site’s origin and resolves to https://example.org/board/agenda.html. These addresses are examples; whether a real destination exists depends on the site. If the story moves to another directory, a relative address such as agenda.html may resolve differently. The href attribute uses the same syntax for a relative value, but the base URL affects the destination. Check the final URL in the published context.
The syntax for an href does not tell you whether an absolute or relative address is more appropriate for every situation. Choose based on where the destination lives and how the site is organized. When you are unsure, preview the link and inspect where it takes you. A document’s base URL can also change resolution, so check the actual page rather than guessing from its displayed location alone.
Write anchor text that earns the click
“Click here” tells a reader to act but gives little information about the destination. “Read the school board agenda” names the document. A person scanning a page or navigating through a list of links can make a more informed choice. The W3C’s advice on meaningful link text explains why the destination should be clear from the link label.
Match your words to the destination. If the link opens minutes from a previous meeting, label it “Read the meeting minutes,” not “Read the upcoming agenda.” If it opens a PDF, you can say so in the text when that format matters to readers. Keep the label concise and descriptive; avoid putting an entire paragraph inside a link just to make it noticeable.
Good HTML links combine accurate syntax with editorial judgment. Before publication, open the destination and check its title, date, and relevance to the claim. If you cite a document for a particular figure, find that figure in the document. Link text should promise what the reader will actually find.
Practice: Repair the example
Assume the correct destination is https://example.org/board/agenda.html. What would you change here?
<a href="https://example.org/board/agnda.html">click here</a>
The expected revision fixes the path and names the document:
<a href="https://example.org/board/agenda.html">Read the school board agenda</a>
The first address misspells agenda, while the first label gives no destination. The corrected HTML link uses the same anchor structure and makes both fixes. Compare the href attribute syntax in each opening tag, then compare the labels between the tags. In real work, use the source’s actual URL; the spelling correction above is part of the exercise, not a claim that this placeholder page exists.
Final link check
Review the syntax of the anchor and its href attribute: confirm that the quotes, opening tag, and closing tag are in place. Open the destination in the final page context, especially for a relative URL. Check the source, date, and document against your claim. Finally, read the anchor text on its own: does it tell someone what they will open? If not, revise the label and test the link again.
