Unduh PDF
Unduh PDF
Setiap hari, kita mengakses berbagai situs web. Namun, terkadang kita bertanya-tanya, sulitkah untuk membuat situs web sendiri? Di artikel ini, Anda akan dipandu untuk membuat halaman web HTML sederhana dengan Notepad.
Langkah
-
Bukalah Notepad. Penyunting teks ini merupakan program bawaan yang tersedia di setiap komputer Windows, dan dapat ditemukan di menu Start. Setelah Notepad terbuka, klik File > Save As , lalu pilih All Files pada kolom File Type . Simpan berkas buatan Anda dalam format HTML. Umumnya, halaman utama sebuah situs memiliki nama berkas "index.html", dan berisi tautan ke seluruh halaman pada situs.
-
Pahami HTML. Tanda ( tag ) pada HTML ( Hypertext Markup Language ) berada dalam <kurung sudut> .
Tanda tersebut berfungsi untuk membangun situs web Anda. Untuk mengakhiri kode HTML, gunakan tanda penutup ( end tag ), seperti </text> .Tanda penutup tersebut berguna untuk menutup berbagai tanda, seperti tanda huruf tebal atau paragraf. -
Awali halaman web Anda dengan memasukkan tanda <html> di bagian atas berkas.
-
Gunakan tanda <head> untuk memasukkan berbagai informasi. Tanda <title> berguna untuk mengatur judul halaman, sementara tanda <meta> (opsional) berfungsi untuk memasukkan penjelasan mengenai isi halaman web. Tanda <meta> tersebut kemudian akan dibaca oleh mesin pencari, seperti Google.
-
Setelah memasukkan tanda <head> , beri judul halaman dengan tanda <title> , misalnya <title>wikiHow HTML</title>
-
Akhiri kepala situs dengan menggunakan tanda </head>
-
Gunakan tanda <body> untuk memasukkan isi halaman. Ingatlah bahwa tidak semua warna didukung oleh peramban. Misalnya, warna abu-abu gelap mungkin tidak didukung.
-
Tuliskan isi halaman web di antara tanda <body> . Misalnya, mulailah dengan membuat kepala situs. Kepala situs adalah bagian situs dengan huruf berukuran besar, dan dibuat dengan tanda <h1> hingga <h6> . Tanda <h1> dapat Anda gunakan untuk membuat kepala situs dengan ukuran huruf terbesar. Cobalah menggunakan tanda tersebut tepat di bawah tanda <body> , seperti <h1>Selamat datang di situs saya!</h1> . Pastikan Anda menutup tanda <h1> di akhir kalimat.
-
Buatlah paragraf di halaman dengan tanda <p> . Misalnya, tulislah <p>Tes paragraf!</p> Untuk membuat baris baru, gunakan tanda <br> , atau break .
-
Anda tentu tidak ingin halaman web yang Anda buat hanya berisi teks polos. Gunakan berbagai tanda berikut ini untuk memformat teks pada halaman web: <b> untuk menebalkan teks, <i> untuk memiringkan teks, dan <u> untuk menggarisbawahinya. Setelah menggunakan tanda di atas, jangan lupa untuk menutupnya!
-
Tambahkan gambar dengan tanda <img> untuk memperindah situs dan menambahkan informasi yang tidak dapat dijelaskan dalam bentuk teks. Tanda <img> memerlukan informasi tertentu agar berfungsi. Sintaksis lengkap tanda <img> mungkin berbentuk seperti ini: <img alt=dog src="dog.jpg" width=200 height=200> .
Parameter src pada tanda berfungsi untuk menulis nama berkas gambar, dan width serta height berfungsi untuk menjelaskan panjang dan lebarnya. -
." src="https://www.wikihow.com/images_en/thumb/2/23/Create-a-Simple-Webpage-Using-Notepad-Step-12-Version-2.jpg/v4-460px-Create-a-Simple-Webpage-Using-Notepad-Step-12-Version-2.jpg" decoding="async" class="11a962bacc6697953aa0dba276e98a7c whcdn content-fill p_maxWidth" data-srclarge="https://www.wikihow.com/images_en/thumb/2/23/Create-a-Simple-Webpage-Using-Notepad-Step-12-Version-2.jpg/v4-460px-Create-a-Simple-Webpage-Using-Notepad-Step-12-Version-2.jpg" data-width="280" data-height="345" id="11a962bacc6697953aa0dba276e98a7c"/>
{"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/2\/23\/Create-a-Simple-Webpage-Using-Notepad-Step-12-Version-2.jpg\/v4-460px-Create-a-Simple-Webpage-Using-Notepad-Step-12-Version-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/2\/23\/Create-a-Simple-Webpage-Using-Notepad-Step-12-Version-2.jpg\/v4-728px-Create-a-Simple-Webpage-Using-Notepad-Step-12-Version-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}Buatlah tautan yang mengarah ke halaman lain dengan tanda <a> , misalnya <a href="otherpage.html">Halaman lain</a> . Teks di tengah tanda adalah teks yang akan muncul di halaman, sementara parameter href berisi halaman tujuan. Dengan tautan, pengunjung dapat berpindah ke berbagai halaman di situs Anda dengan mudah. -
Setelah selesai mengisi situs, akhiri halaman dengan menutup tanda </body> . Terakhir, tutup kode HTML dengan </html>
-
Simpan halaman web buatan Anda dengan ekstensi .html, dan bukalah di peramban favorit Anda untuk mengujinya.
-
Bacalah panduan berikut ini untuk mengunggah situs Anda ke internet.Iklan
Tips
- Di internet, tersedia berbagai situs berisi panduan untuk membuat situs web. W3school adalah salah satu situs dengan materi yang baik.
- Pastikan Anda menutup setiap tanda pada berkas HTML.
- Tuliskan tanda <!DOCTYPE html> di baris pertama berkas, sebelum <HTML>. Tanda ini menandakan bahwa berkas yang Anda buat adalah berkas HTML5.
- Ubah jenis huruf dengan tanda <font face="N"></font> sebelum <html> dan sesudah </html>. Gantilah "N" dengan jenis huruf yang Anda inginkan, misalnya "Verdana".
- Jika Anda perlu menggunakan kurung sudut, gunakan kode < and >. Sementara untuk menggunakan tanda &, gunakan kode &.
- Menurut tutorial HTML, Anda harus selalu memberi nama berkas dan folder web dengan huruf kecil, tanpa spasi dan tanda baca. Meskipun Windows memungkinkan Anda memberi spasi pada nama berkas, banyak penyedia layanan hosting tidak mengizinkannya. Selain itu, nama berkas yang rapi juga akan memudahkan Anda mengurus situs.
Iklan
Iklan
