Tutorial Coding - Halo sobat gamekupedia sekalian, kembali lagi dengan admin dala postingan kali ini yang membahas tentang tutorial membuat web sederhana menggunakan compiler Notepad++. Sebelumnya bagi sobat yang belum memiliki Notepad++ silahkan mendownload dahulu melalui website resminya notepad-plus-plus.org atau bisa klik disini.
Untuk versi dari Notepad++ nya sendiri itu bebas atau terserah kepada sobat gamekupedia ingin menggunakan versi yang mana saja. Setelah selesai proses download dan installasi mari kita lanjutkan kedalam proses mengcoding. Langkah-langkahnya adalah sebagai berikut:
1. Jalankan Notepad++ yang telah sobat install tadi, kemudian tekan File - New
2. Setelah selesai sobat pilih File - Save as
3. Sobat pilih Save as type: Hyper Text Markup Language file dan tuliskan nama dari file tersebut
4. Setelah selesai sobat isikan code html dibawah ini dalam file yang sobat buat tadi
5. Setelah selesai mengisikan code html diatas, sobat buka tempat penyimpanan file tadi dan jalankan file html tersebut menggunakan search engine miliki sobat. Dan hasilnya akan seperti gambar dibawah ini.
6. Selanjutnya sobat buat lagi file baru dengan nama halo.html dan isikan code html dibawah ini pada file halo.html yang sobat buat tadi
Sebenarnya sama saja dengan file index.html tadi, hanya saja admin mengganti bagian <a href="index.html"> menjadi <a href="halo.html">
7. Dan jika benar maka hasilnya akan seperti pada gambar dibawah ini.
Atau sobat dapat mendownload filenya disini
Oke selesai sudah tutorial mengcoding website kali ini, eits tapi sebelum itu admin akan menjelaskan pertahap nih tentang proses mengcoding kita kali ini. Nah pertama-tama admin akan menjelaskan tentang konsep pada html nih sobat. Sebelum sobat ingin membuat suatu website melalui compiler apa saja. Pastikan bagian penting ini dituliskan dahulu, apasih bagian penting tersebut? Ini dia bagian tersebut:
- <html> - Merupakan inisialisasi dari file bahwa berbentuk file HTML
- <head> - Merupakan bagian kepala dari website
- <title> - Merupakan bagian penamaan atau penjudulan dari website yang ingin kita buat, lokasinya berada setelah code <html> dan langsung ditutup setelah menuliskan judul website
- <body> - Merupakan tempat menuliskan isi dari website
Jangan lupa untuk menutup setiap bagian penting tersebut, contohnya <html> ditutup dengan </html>. Dan pada code diatas ada namanya bgcolor, apasih itu? itu adalah singkatan dari background color sobat, digunakan untuk pemberian warna background, admin meletakkan fungsi bgcolor didalm tag <body> yang bertujuan untuk memberikan warna pada latar website kita nih sobat. Apasih <p> ? Merupakan inisialisasi dari paragraf, jadi setiap sobat membuat suatu kalimat berbentuk paragraf, dapat sobat gunakan tag dari <p> dan titutup setelah akhir dari paragraf, otomatis setelah ditutup maka tulisan teks selanjutnya akan berpindah baris nih sobat, tapi sobat juga dapat menggunakan tag <br> untuk berpindah baris kok.
Selanjutnya apasih <img src> ? Nah tag tersebut merupakan fungsi untuk menampilkan gambar berdasarkan folder alamat dan nama beserta format dari gambar yang akan ditampilkan yah. contohnya <img src="img/1.jpg"> "img" merupakan folder tempat penyimpanan gambar, dan pastikan lokasi folder gambar berada disatu tempat dengan file index.html sobat ya!
Dan terakhir apasih <input type="Submit" value="Tekan Saya"> ? Nah tag ini merupakan fungsi untuk menampilkan suatu button yang bertipe melempar atau memparsing data pada file index.html. Sebenarnya sobat cukup membuat tag <button> untuk membuat suatu button, tapi disini admin tidak menggunakannya karena pada postingan selanjutnya kita masih akan menggunakan code HTML pada postingan kali ini.
Mungkin cukup sekian dahulu postingan dari admin kali ini tentang belajar membuat website sederhana. Semoga dapat bermanfaat dan berguna bagi sobat sekalian ya dalam belajar membuat website sendiri hehe. Dan InsyaAllah pada postingan selanjutnya kita akan belajar membuat website yang sedikit lebih sulit lagi yah!
No comments:
Post a Comment