Minggu, 22 Oktober 2017

Pertemuan 7 - KOM201 - HTML

Hai teman-teman ...

        Selama ini jika kalian membuat website atau blog, mungkin pada blog temen-temen yang akan tampil hanyalah tulisan dan gambar tanpa adanya hal yang membuat tulisan kalian bertambah menarik. Hal dasar yang penting untuk kalian pelajari saat memiliki website salah satunya yaitu HTML. HTML adalah singkatan dari Hypertext Markup Language. Disebut hypertext karena di dalam HTML sebuah text biasa dapat berfungsi lain, kita dapat membuatnya menjadi link yang dapat berpindah dari satu halaman ke halaman lainnya hanya dengan meng-klik text tersebut. Disebut Markup Language karena bahasa HTML menggunakan tanda (mark), untuk menandai bagian-bagian dalam text.


Dalam HTML perlu diketahui beberapa tag yang sering digunakan yang diantaranya :



  •  <!DOCTYPE> Tag untuk menentukan tipe dokumen
  • <html> Tag untuk membuat sebuah dokumen HTML
  • <title> Tag untuk membuat judul dari sebuah halaman
  • <body> Tag untuk membuat tubuh dari sebuah halaman
  • <h1> to <h6> Tag untuk membuat heading
  • <p> Tag untuk membuat paragraf
  • <nav> Tag untuk membuat navigasi link
  • <img> Tag untuk membuat gambar
  • <audio> Tag untuk membuat isi suara
  • <source> Tag untuk membuat sumber beberapa media untuk elemen media (<image>, <audio>, dan <video>)
  • <ul> Tag untuk membuat daftar dengan selain nomor
  • <ol> Tag untuk membuat daftar dengan nomor
  • <li> Tag untuk membuat sebuah item daftar
  • <th> tag untuk membuat sel header tabel
  • <tr> Tag untuk membuat baris dalam sebuah tabel
  • <footer> Tag untuk membuat footer untuk dokumen atau bagian
Disini aku akan kasih tau cara membuat HTML yang cukup simpel aja karena udah pusing sama kode-kodean jadi mo buat yang gampang aja lol yak langsung aja :)



 Pertama, buka notepad++ atau sublime. jika belum ada maka download filenya dulu.

 Kedua, save file yang baru kalian buka dengan nama yang di tambah .html (misal: Revita G8-66.html) save a type dengan html.

 Ketiga, isi file tersebut sesuai keinginan kalian dengan menggunakan tag yang tersedia, contohnya seperti dibawah :
Untuk background bisa menggunakan "bg=" jika mau memakai gambar (jangan lupa cantumkan tipe gambarnya) atau "bgcolor=" jika mau memakai warna saja


"widht" dan "height" digunakan untuk merubah ukuran gambar sesuai dengan yang diinginkan

Note yang perlu diketahui:
  • setiap tag pastikan diakhiri dengan tag penutup, misal <tr>_____</tr>.
  • jika cantumkan source, pastikan bentuk source juga dicantumkan. misal "______.jpg" karena akan memengaruhi hasil web.
  • jika audio yang dipakai bentuknya __.mp3, gunakan audio="audio/mpeg" (seperti pada contoh), jika bentuknya __.wav gunakan "audio/wav"


Keempat, save kembali data yang telah kalian buat dengan cara menekan ctrl+s atau klik file lalu save.

Selanjutnya, buka data yang kalian simpan. lalu, akan muncul hasil dari yang kalian buka pada chrome atau firefox (aku sarankan chrome soalnya lebih bagus hasilnya).

Contoh hasilnya seperti ini



contoh saat diisi malunya ;;;;;

Sekian info dariku, semoga bermanfaat~ :)

Tidak ada komentar:

Posting Komentar