HTML Boilerplate
- Categories:
- notes
Terinspirasi dari postingan HTML boilerplate milik Manuel Matuzovic, berikut ini HTML boilerplate versi saya. Saya menggunakan referensi dari web.dev untuk HTML Boilerplate dan berhubung sebisa mungkin tanpa Javascript, maka hal-hal yang terkait Javascript saya hapus.
Penjelasan detil tag-tag HTML dibawah dapat dibaca melalui web.dev dan The Open Graph Protocol.
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=1">
<title>Contoh Title - My Example Site</title>
<!-- start open graph -->
<meta name="description" content="Contoh page description">
<meta property="og:title" content="Contoh title - My Example Site">
<meta property="og:description" content="Contoh page description">
<meta property="og:image" content="https://www.example.com/image.jpg">
<meta property="og:image:alt" content="Contoh image description">
<meta property="og:locale" content="id_ID">
<meta property="og:type" content="website">
<meta name="twitter:card" content="summary_large_image">
<meta property="og:url" content="https://www.example.com/mypage.html">
<!-- end open graph -->
<meta name="theme-color" content="#FF00FF">
<link rel="icon" href="/favicon.ico">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/my.webmanifest">
<link rel="canonical" href="https://www.example.com/mypage.html">
<link rel="stylesheet" href="/assets/css/styles.css">
<link rel="stylesheet" href="/assets/css/print.css" media="print">
</head>
<body>
<header>
<!-- konten header -->
</header>
<main>
<!-- konten body -->
</main>
<footer>
<!-- konten footer -->
</footer>
</body>
</html>
Recent Posts
KAK Labs Newsletter #6 - Staying Safe From Pegasus Spyware
Newsletter #6 - Pegasus, Ruby, PostgreSQL and networkQuality tool
Material Design - Paragraph Spacing
According to Google's Material Design, keep paragraph spacing in the range between .75x and 1.25x of the type size.
Amazon SDK for C# - S3 File Download Methods
Comparison between `TransferUtility.DownloadAsync`, `DownloadSingleFileAsync`, and `GetObjectAsync`.
Duplicate Content Detection with fdupes Command
Effortlessly locate duplicate files content in Linux using 'fdupes' command.
Broken Pipe Error
My note about Broken Pipe error