Cara Membuat Website Sederhana dengan HTML • ReeZh Design

Bagaimana cara membuat halaman website sederhana dengan HTML

Tutorial kali ini adalah tentang cara membuat halaman website sederhana dengan hanya menggunakan HTML. Seperti yang kita ketahui, sebuah halaman website akan berisikan tulisan teks baik dalam format paragraf atau hanya sebagai hyperlink. Tentunya hal ini di perlukan bahasa baku yang di ketahui oleh sebuah Browser Internet agar bisa menampilkan halaman tersebut. Maka dari itu, di butuhkan bahasa pemrograman baku yang bisa di baca oleh semua browser dalam berbagai device yaitu HTML. Baik itu browser yang di gunakan pada desktop komputer ataupun juga pada tablet dan perangkat handphone.

Apa itu HTML

Hypertext Markup Language (HTML) adalah sebuah bahasa markah yang di gunakan untuk membuat sebuah halaman web, dengan cara menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang di tulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegrasi.

Halaman website akan berisikan halaman – halaman HTML yang di gunakan untuk menampilkan konten artikel dengan isi berbentuk tulisan, gambar, atau video. Pembahasan tentang html secara keseluruhan tidak akan di terangkan secara detail pada tutorial kali ini.

Kebutuhan dalam membuat website sederhana

Bikin website sederhana tentu membutuhkan :

1. Nama Domain

Apabila proyek dalam membuat html akan di simpan di server, maka memerlukan sebuah nama domain agar bisa di ketahui publik. Nama domain bisa menggunakan domain gratis atau domain berbayar.

Domain Gratis – pengertiannya adalah domain yang di berikan dengan cuma – cuma tanpa harus membayar setiap tahunnya. Dengan kata lain tidak ada biaya perpanjangan domain setiap akhir tahun.

Domain Berbayar – memiliki domain jenis ini akan menjadi identitas yang penting dan mudah di ingat oleh orang lain. Selain gampang di ingat tentunya bisa meningkatkan kepercayaan dari orang lain bagi pemiliknya.

Tidak selalu anda harus memiliki domain jika proyek hanya untuk konsumsi pribadi dan tidak di publikasikan. Anda bisa mengakses langsung berkas melalui browser dengan mengisikan alamat dari folder. Jika anda menggunakan localhost, tentunya akan lebih mudah lagi, alamat pada browser bisa berisikan alamat sub folder dari localhost anda.

2. Penyimpanan Data Hosting

Hosting Gratisan – banyak penyedia hosting yang memberikan fasilitas penyimpanan data secara gratis. Bagi yang masih belajar tentang website, tentunya hal ini akan sangat berguna.

Hosting Berbayar – namanya juga hosting yang berbayar, tentunya anda memerlukan sedikit biaya untuk sewa tempat penyimpanan data yang akan di gunakan.Localhost

Anda tidak memerlukan hosting gratisan dan hosting berbayar jika proyek yang anda buat tidak membutuhkan penyimpanan di luar komputer atau laptop. Cukup menggunakan localhost yang telah di sediakan operating system yang anda gunakan.

3. Halaman HTML

Buatlah halaman web anda sesuai kebutuhan, apakah hanya sebagai Landing Page atau Full website yang memiliki banyak halaman. Jenis website juga akan menentukan keperluan anda dalam tampilan, buatlah tampilan sederhana terlebih dahulu.

Landing Page – halaman html yang berupa satu lembar halaman dengan banyak bagian yang menerangkan tentang website secara keseluruhan. Banyak digunakan sebagai tujuan halaman untuk Iklan dan mendapatkan Call Action sesuai dengan target dari website itu sendiri.

Full Website – berisikan banyak halaman html yang saling terkoneksi dengan hyperlink, beberapa halaman yang berbeda, baik itu halaman single page ataupun halaman arsip (kumpulan).

Halaman html yang terstruktur dengan baik akan menentukan dari fungsi yang akan diraih. Selalu periksa halaman html anda baik dari struktur dan kegunaannya. Gunakan pemeriksaan markup seperti :

Pemeriksaan validasi ini akan berguna bagi anda dikemudian hari ketika mengharuskan membuat halaman html dengan struktur yang baik dan menggunakan skema data.

4. Cascading Style Sheet (CSS)

Untuk menampilkan halaman html agar lebih menarik, Cascading Style Sheet (CSS) bisa digunakan dan ditambahkan pada skrip HTML. Membuat halaman website sederhana dengan HTML dan CSS sudah lumrah digunakan saat ini, karena itu akan menjadikan tampilan lebih unik.

  • CSS Internal – Berkas css yang di simpan pada berkas terpisah tetapi masih dalam satu direktori atau internal server.
  • CSS External – Berkas css yang di sambungkan melalui link agar bisa di gunakan untuk merubah tampilan html terkait. Framework CSS yang biasa di gunakan seperti Bootstrap, Tailwind, Foundation, Bulma dan lainnya.
  • Inline CSS – Baris cascading style sheet yang di masukkan pada barisan head halaman html.
Bootstrap 5

Baca juga: Cara Menggunakan Bootstrap

5. Koneksi Internet

Jika anda akan menyimpan data halaman html, gambar, css dan lainnya tentu memerlukan koneksi internet. Akan tetapi, apabila proyek website sederhana anda hanya sebagai contoh atau sebagai presentasi saja hal ini tidak di perlukan. Tentunya anda bisa menggunakan localhost atau direktori folder saja apabila html bersifat statis.

Cara menggunakan perangkat lunak dalam membuat website

Cara terbaik dalam membuat halaman website tentu memerlukan software atau perangkat lunak, di butuhkan untuk merubah dan menyimpan berkas halaman web yang di inginkan.

1. Code Editor

Membuat, menyimpan dan memperbarui kode yang anda ketikkan tentunya memerlukan aplikasi Code Editor yang sudah terinstall pada perangkat komputer anda. Ada 2 perbedaan dalam tipe aplikasi editor kode, Tekstual dan WYSWYG.

Tekstual – cocok untuk web developer berpengalaman karena memperlihatkan kode sesuai dengan yang anda tuliskan.

WYSWYG – berarti What You See What You Get yang artinya apa yang anda ketikan akan menghasilkan hasil yang sesuai dengan hasil akhir dari tampilan yang akan anda lihat.

HTML Editor

Baca juga: Perangkat Lunak untuk HTML Editor.

2. Aplikasi Transfer Data

Penyimpanan data website sederhana pada server dapat dilakukan dengan cara menggunakan FTP. File Transfer Protocol (FTP) adalah elemen penting dalam melakukan download upload berkas.

Referensi cara belajar membuat halaman website HTML

html5

Dengan adanya internet, tentunya akan memudahkan anda mendapatkan referensi belajar membuat halaman website yang di inginkan. Baik itu untuk sebagai pemula atau sebagai orang telah mengetahui banyak tentang hal ini. Mau yang gratisan atau pun yang berbentuk kursus online yang berbayar.

Referensi Dasar untuk belajar Website dan HTML bisa di dapatkan di :

  • Google – Tinggal ketik topik yang anda cari, maka google akan memberikan jawabannya.
  • W3Schools – Tempat anda belajar tentang HTML dari dasar.
  • CodeAcademy – Tempat kursus belajar HTML secara online.
  • ReeZh Design – walaupun tidak di khususkan sebagai situs yang mempelajari tentang belajar website, tetapi kami akan selalu berbagi tips tentang hal ini. Silahkan anda berselancar di halaman – halaman website dan temukan topik yang anda cari.

Kesimpulan

Tutorial ini di harapkan bisa menjadi panduan bagi anda untuk memiliki web sederhana dan cara membuatnya. Apabila kurang mengerti tentang HTML, CSS, JS dan lainnya mungkin bisa mencari referensi sesuai dengan topik dan bahasan terkait. Selamat belajar!

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan.