The head element is where a page declares what it is. Some of it is technical — the character encoding, the viewport, the stylesheet. Some of it is for search engines. And some of it is for the moment your page is pasted into a chat, where a title and a preview image decide whether anyone clicks.
Which tags are essential?
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>How to Structure a Java Project | Acme</title>
<meta name="description" content="A practical walkthrough of structuring a Java project so the layout makes sense to the next person who opens it.">
<link rel="canonical" href="https://acme.com/articles/java-project-structure">
</head>
The charset and viewport are technical requirements. The title and description are what people see in search results. The canonical link says which URL is the real one when the same content is reachable at several addresses — a duplicate, a tracking parameter, an old trailing-slash variant.
How do the title and description work?
The title is the single most important on-page signal. It appears as the blue clickable line in a search result, as the tab label, and as the name of the bookmark. It has to do two jobs at once: describe the page for a searcher and fit in the space the result gives you.
roughly 55-60 characters before the result is truncated
Put the important words first, because the tail is what gets cut. The site name can go at the end, separated by a vertical bar, and it can be dropped entirely on pages where the brand is obvious. What must not happen is a title so generic that it describes every page on the site.
The description is the grey summary under the title. It is not a ranking factor — it has never been used as one, and the search engine that generates the snippet usually rewrites it anyway. What it does is influence whether the searcher clicks, which is worth more than a ranking position.
<!-- specific, with a reason to click -->
<meta name="description"
content="A practical walkthrough of structuring a Java project so the layout makes sense to the next person who opens it, with the folder tree and the reasoning behind each layer.">
Two mistakes make a description useless. Writing it as a list of keywords, which reads as spam, and making every page on the site share one, which turns a page into a near-duplicate of every other page on the site.
What are Open Graph tags for?
When your page is shared in a chat, a messaging app or a social network, that service does not screenshot your page. It reads your metadata and builds a card from it. The Open Graph protocol is the standard for that, and it is four tags.
<meta property="og:type" content="article">
<meta property="og:title" content="How to Structure a Java Project">
<meta property="og:description" content="The folder layout that makes sense, and the reasoning behind each layer.">
<meta property="og:image" content="https://acme.com/images/java-project.png">
<meta property="og:url" content="https://acme.com/articles/java-project-structure">
The image is the one that matters most in practice. A card with a clear preview image and a readable title gets clicked; a card with no image is a line of text. The image needs an absolute URL, and it needs to be a reasonable size — the classic failure is a tiny logo that renders as a speck.
There is a matching set for Twitter-style cards, and the two overlap. If you set both, use twitter:card with the value summary_large_image to ask for the large format.
What else belongs in the head?
meta name="robots"controls indexing.noindexkeeps a page out of search results, and it is the right tool for a thin page or a duplicate.link rel="icon"is the favicon, and it can be an SVG for a sharp result at any size.link rel="preconnect"andrel="preload"hint to the browser about resources it will need.meta name="theme-color"sets the colour of the browser interface on a phone.link rel="manifest"points to the web app manifest for a site that can be installed.
What is structured data?
Metadata describes the page for machines; structured data describes the page for search engines in a machine-readable form, so a search result can include more than a title and a snippet. It is written as JSON-LD, a block of script embedded in the page.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "TechArticle",
"headline": "How to Structure a Java Project",
"description": "The folder layout that makes sense, and the reasoning behind each layer.",
"datePublished": "2026-10-14",
"author": { "@type": "Person", "name": "Alex Doyle" },
"image": "https://acme.com/images/java-project.png"
}
</script>
It is worth knowing about, and worth being careful with. The vocabulary is large and the rules are strict — a wrong value is worse than no value, because a structured data block that contradicts the page itself is a signal that the markup is untrustworthy. Start with the type that matches what the page really is, keep the values identical to what a reader would see on the page, and validate the block with the search engine's own testing tool before relying on it.
What about the language of the page?
The lang attribute on the html element is part of the metadata story, because it tells search engines which language the page is in, which matters for a site that publishes in several languages.
<html lang="en-GB">
...
</html>
<!-- a page in another language, inside the same document -->
<p lang="fr">Une phrase en français</p>
Using a region as well as a language — en-GB rather than just en — is useful when spelling and formatting differ between markets, and it is what lets a site offer regional variants of the same content without confusing a search engine about which page is for whom.
Quick reference
- Charset and viewport are technical requirements; title and description are for people.
- Put the important words first in the title — the tail gets truncated.
- The description is a click-through lever, not a ranking factor, and it must be unique per page.
- Open Graph tags control how a shared link looks; the image matters most.
- Use
noindexfor pages that should not appear in search results.
Try it yourself: write the head for a page you have, keeping the title under sixty characters and the description between one and two sentences. Paste the page link into a chat app that renders previews and see whether the card shows your title and image or falls back to something generic.