DISKON TERBATAS! Masukkan kupon "skillbaru" saat checkout di kelas apa saja

Logo Koala Skodev mengetik

Skodev

Belajar coding dalam bahasa Indonesia

CARA MEMBUAT WEBSITE HTML DAN CSS

Artikel ini menjelaskan langkah-langkah membuat website sederhana menggunakan HTML dan CSS dengan mudah dan praktis. Pelajari cara mendesain website kamu sendiri.

Daftar Isi:

Memahami HTML dan CSS
Mempersiapkan Tools
Membuat Dokumen HTML
Membuat CSS
Mengisi Konten HTML

Membuat website menggunakan HTML (Hyper Text Markup Language) dan CSS (Cascading Style Sheets) bisa jadi tugas yang menarik dan kreatif. HTML adalah rangka dasar dari setiap website, sedangkan CSS menentukan tampilan website tersebut. Berikut ini adalah langkah-langkah sederhana dalam membuat website menggunakan HTML dan CSS.

Memahami HTML dan CSS

Sebelum memulai, penting untuk mengetahui apa itu HTML dan CSS. HTML digunakan untuk membuat struktur dan konten suatu website, seperti teks, gambar, dan video. CSS digunakan untuk mengatur tampilan dan layout dari konten ini, termasuk warna, ukuran, dan posisi elemen.

Untuk bisa membuat website yang baik, kamu harus paham dan mengerti tentang kedua bahasa ini.

Mempersiapkan Tools

Tekst Editor

Untuk membuat website, kamu akan membutuhkan text editor. Text editor adalah program yang digunakan untuk menulis dan mengedit kode. Ada banyak text editor yang bisa digunakan seperti Sublime Text, Atom, dan Visual Studio Code. Semua memiliki fitur dan kelebihannya masing-masing, jadi kamu bisa memilih yang paling sesuai dengan preferensi kamu.

Browser

Selanjutnya, kamu akan membutuhkan browser (Chrome, Firefox, Safari, dll) untuk melihat hasil kerjaan kamu.

Membuat Dokumen HTML

Pertama, kamu harus membuat dokumen HTML. Ini adalah kerangka dasar dari website kamu.

  1. Buka text editor pilihan kamu
  2. Tuliskan kode berikut pada baris pertama : <!DOCTYPE html>
  3. Berikan struktur dasar dalam HTML, seperti berikut:
<html>
    <head>
        <title>Judul Website</title>
    </head>
    <body>
        Konten Website
    </body>
</html>
  1. Simpan file dengan ekstensi .html, misal index.html

Membuat CSS

Setelah membuat kerangka dasar dalam HTML, kita akan membuat tampilan website menggunakan CSS.

  1. Buat file baru dan simpan dengan ekstensi .css, misal style.css di folder yang sama dengan file HTML.
  2. Tuliskan kode CSS. Misalnya, kita ingin merubah warna latar belakang dan warna teks. Kode CSS bisa ditulis seperti ini:
body {
    background-color: grey;
    color: white;
}
  1. Sambungkan file CSS dengan HTML dengan menambahkan link ke file CSS di dalam elemen <head> pada dokumen HTML.
<head>
<title>Judul Website</title>
<link rel="stylesheet" href="style.css">
</head>

Mengisi Konten HTML

Sekarang saatnya kamu mengisi konten website kamu. Kamu bisa menambahkan teks, gambar, video, dan lainnya.

Misalnya, kita ingin menambahkan paragraf dan gambar.

<body>
    <h1>Selamat datang di website saya</h1>
    <p>Ini adalah paragraf pertama dalam website saya.</p>
    <img src="image.jpg" alt="gambarku">
</body>

Membuat website dengan HTML dan CSS memang tidak semudah membalikkan telapak tangan, tetapi dengan latihan dan kesabaran, kamu bisa menjadi ahli dalam waktu yang tidak terduga. Selamat mencoba!


Daftar newsletter skodev masukkan emailmu untuk dapat informasi menarik dari dunia koding