Sayfa üstverisi: head ve meta

<head>, ziyaretçiye doğrudan gösterilmeyen ama tarayıcılar ve arama motorları için önemli olan bilgileri saklar: başlık, karakter kodlaması, stil ve betik bağlantıları, meta etiketleri.

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Fresh bread in Baku | Example Bakery</title>
  <link rel="stylesheet" href="style.css">
  <link rel="icon" href="favicon.svg">
</head>

• charset="utf-8" harflerin doğru görünmesini sağlar.
• viewport mobil ekranda doğru ölçü sağlar.

<title>, tarayıcı sekmesinde ve arama sonuçlarında görünen başlıktır; her sayfa için benzersiz ve net olmalıdır. <meta name="description"> arama sonucundaki kısa açıklamanın kaynağı olabilir; 150–160 karakter yeterlidir.

<meta name="description" content="Daily fresh bread, pastries and coffee in the centre of Baku.">
<link rel="canonical" href="https://example.com/bread">

Open Graph etiketleri bağlantının sosyal ağlarda nasıl görüneceğini belirler: og:title, og:description, og:image. <html lang="az"> belgenin dilini bildirir; alternatif diller için hreflang bağlantıları kullanılır.

<meta property="og:title" content="Fresh bread in Baku">
<meta property="og:image" content="https://example.com/cover.jpg">
<link rel="alternate" hreflang="en" href="https://example.com/en/bread">