Pada tutorial ini, kita akan mencoba membuat project web kecil-kecilan. Tujuannya untuk berlatih dan memahami bagaimana cara membuat web. Show
Baiklah.. Langsung saja kita mulai. Step 1 – Membuat Desain WebPembuatan web dimulai dengan desain. Kalau tidak ada desain, nanti kita akan kesulitan dan tidak akan tahu mau buat apa. Biasanya desain web dikerjakan oleh desainer, setelah itu diserahkan ke programmer untuk diubah menjadi HTML. Pada project ini, kita akan membuat tiga halaman web, yakni home, contact, dan about. Desain yang digunakan adalah desain dalam bentuk wireframe atau sketsa. Berikut ini desain untuk tiap-tiap halaman: 1. Desain Halaman HomeHalaman home adalah halaman utama yang akan dibuka pertama kali saat pengunjung membuka website. Halaman ini berisi menu, foto, teks, dan tabel. 2. Desain Halaman ContactHalaman contact adalah halaman yang berisi form untuk menghubungi pemilik website. 3. Desain Halaman AboutHalaman about adalah halaman yang berisi informasi lengkap tentang website. Step 2 – Memulai Project WebSilahkan buat folder baru dengan nama Setelah itu buat folder Sehingga nanti stuktur folder kita akan menjadi seperti ini:
File yang perlu kamu persiapkan di tahapan ini adalah 1 dan 3.Berikutnya, kita akan mulai menulis kode. Silahkan buka folder Caranya: Klik menu File, lalu pilih Open Folder dan carilah folder Degan begini, kita sudah siap untuk menulis kode. Step 3 – Membuat Halaman HomeSilahkan buat file baru bernama 5 di dalam folder websiteku.Setelah itu, isi dengan kode berikut:
Jangan lupa untuk mengubah nama 4 dengan nama kamu.Jika kita coba membuka file 5, maka hasilnya akan seperti ini:Gambarnya tidak bisa tampil karena kita belum menambahkan file gambar di dalam folder Silahkan tambahkan file gambar dengan nama 1. Pastikan gambar yang ditambahkan memiliki ukuran persegi atau rasio 1:1. Pada proyek ini, saya menggunakan gambar dengan ukuran 200x200 piksel.
Setelah itu, coba refresh halaman home atau 5.Maka haslinya: Step 4 – Membuat Halaman About MeBuatlah file HTML baru dengan nama 7.Kemudian isi dengan kode berikut:
Sama seperti halaman home, halaman ini juga memiliki konten berupa video untuk ditampilkan. Tapi file videonya belum ada. Sudah pasti videonya tidak akan bisa ditampilkan: Karena itu, silahkan tambahkan file video-nya ke dalam folder 1
Setelah itu, coba buka dan refresh halaman about. Maka hasilnya: Step 5 – Membuat Halaman ContactBuatlah file baru dengan nama 6.Kemudian isi dengan kode berikut:
Hasilnya: Form contact ini belum bisa berfungsi, karena kita belum membuat kode untuk mengirim data. Step 6 – Membuat Fitur Download CVFitur ini sebenarnya paling gampang dibuat. Kita hanya perlu menambahkan file 3 ke dalam folder websiteku.
Setelah itu, coba klik menu Download CV. Jika PDF-nya terbuka, maka link ini sudah benar. Step 7 – Membuat Ikon untuk WebAgar websitenya terlihat menarik, kita akan membuat ikon atau favicon. Silahkan buka favicon-generator.orgkemudian pilih gambar yang akan dijadikan ikon. Setelah itu, kita akan mendapatkan link download dan juga kode HTML yang harus ditambahkan ke dalam tag 4 agar ikon bisa ditampilkan.
Langkah langkah pembuatan website menggunakan HTML?Cara Membuat Halaman Web Sederhana dengan HTML. Buka editor teks. ... . Atur jenis dokumen untuk HTML. ... . Tambahkan tab judul untuk halaman web kamu. ... . Ketik di bawah tag "Head" yang tertutup. ... . Selanjutnya membuat judul halaman. ... . Tambahkan judul tambahan jika kamu mau. ... . Membuat paragraf. ... . Mengubah warna teks.. Apakah HTML bisa membuat website?Melansir laman TechTarget, HTML merupakan kependekan dari Hyper Text Markup Language. Ini merupakan bahasa markup yang digunakan dapat untuk membuat situs web. Bahasa markup sendiri adalah bahasa pemrograman dalam komputer yang digunakan untuk memproses format teks, gambar, dan berbagai media di dalamnya.
HTML website apa?HTML adalah adalah singkatan dari Hypertext Markup Language. HTML memungkinkan seorang pengguna dapat membuat dan menyusun bagian heading, paragraf, link atau tautan, dan blockquote untuk halaman sebuah website.
Buat HTML pake apa?Adapun peralatan yang harus kamu persiapkan adalah:. Teks Editor untuk Menulis HTML. Teks editor akan kita gunakan untuk menulis kode-kode HTML. Kamu bebas menggunakan teks editor apapun. ... . 2. Web Browser untuk Membuka HTML. Web browser akan kita gunakan untuk membuka HTML. Kamu juga bebeas menggunakan web browser apapun.. |