Diskon kelas baru hingga 25%! Masukkan kupon "lebihcepat" di kelas ini

X
Logo Koala Skodev mengetik

Skodev

Belajar coding dalam bahasa Indonesia

CARA MEMBUAT WEBSITE SEDERHANA DENGAN HTML DAN CSS

Panduan langkah demi langkah membuat website sederhana dengan HTML dan CSS untuk pemula. Belajar membuat website dengan mudah dan cepat.

Daftar Isi:

Persiapan
Langkah 1: Membuat Dokumen HTM...
Langkah 2: Menambahkan Konten ...
Langkah 3: Menambahkan Gaya de...

Membuat website tampaknya sulit dan menyita waktu, tetapi sebenarnya tidak harus begitu. Dengan pemahaman dasar tentang HTML dan CSS, kamu bisa membuat website sederhana dalam waktu kurang dari satu jam. Yuk, kita coba!

Persiapan

Sebelum kita mulai, pastikan kamu telah menginstal editor teks. Ada berbagai macam editor teks yang bisa kamu gunakan, seperti Sublime Text, Atom, atau Visual Studio Code. Kamu juga perlu menginstal browser seperti Chrome atau Firefox untuk melihat hasilnya.

Langkah 1: Membuat Dokumen HTML

Pertama, buatlah dokumen baru di editor teks kamu dengan ekstensi .html. Misalnya, kamu bisa menamainya index.html. Di dalam dokumen ini, tulislah struktur dasar HTML seperti berikut:

<!DOCTYPE html>
<html>
<head>
  <title>Judul Website Kamu</title>
</head>
<body>

</body>
</html>

Struktur ini adalah kerangka dasar dari sebuah halaman web. Di antara tag <body> adalah tempat kita akan menuliskan konten dari website.

Langkah 2: Menambahkan Konten HTML

Di dalam tag <body>, kita bisa menambahkan berbagai elemen HTML. Misalkan saja kita buat header, paragraph, dan link.

<body>
  <h1>Website Sederhana</h1>
  <p>Ini adalah contoh website sederhana yang dibuat menggunakan HTML dan CSS.</p>
  <a href="https://www.google.com">Kunjungi Google</a>
</body>

Di sini, kita telah membuat judul dengan tag <h1>, paragraf dengan tag <p>, dan link ke Google menggunakan tag <a>.

Langkah 3: Menambahkan Gaya dengan CSS

Sekarang, kita bisa mulai menambahkan gaya ke website kita dengan CSS. CSS dapat kita tulis di dalam tag <style> yang berada di dalam tag <head>. Sebagai contoh, mari kita berikan gaya untuk judul <h1>.

<head>
  <title>Website Sederhana</title>
  <style>
    h1 {
      color: blue;
      text-align: center;
    }
  </style>
</head>

Di atas, kita telah memberikan warna biru pada judul dan mengubah posisinya menjadi tengah.

Itulah cara membuat website sederhana dengan HTML dan CSS! Kamu bisa eksplor lebih lanjut untuk menambahkan elemen dan gaya lainnya. Selamat mencoba!

cover kelas Kelas membuat website dengan HTML dan CSS
Kelas membuat website dengan HTML dan CSS

belajar membuat website kamu dari nol. Cocok untuk pemula

Lihat Kelas

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