Jumat, 01 Maret 2019

Menulis Kode HTML

Mengenal HTML
Pada kesempatan kali ini saya akan membahas sedikit mengenai apa itu html dan mencoba mempraktekan penggunaan html menggunakan editor Microsoft visual code dan bantuan browser.

HTML (Hyper Text Markup Language) merupakan kode-kode yang digunakan untuk membuat/mengedit sebuah halaman web. Code-code yang ditulis menggunakan HTML akan diterjemahkan oleh web browser (Opera, Mozila Firefox, Google Crome dll.).

Untuk mengenal lebih dalam mengenai HTML mari kita coba praktekan menggunakan Microsoft Visual Code. Sebenarnya masih banyak  editor untuk html seperti notepad, notepad++, sublime teks, atom dll. masih banyak lagi. Mengapa saya menggunakan Microsoft Visual Code Selain gratis Microsoft visual code juga ringan di pc dan juga sudah bisa mendeteksi sesuai standart penulisan code pemrograman dan tentunya kita bisa mendownload di webnya secara mudah.

 Penulisan HTML
1.  Struktur HTML terdiri dari pendeklarasian file html, kepala program, dan tubuh program
2.     Penulisan html teridiri dari elemen-elemen yang diwakili oleh tag
3.  Di dalam tag terdapat atribut yang digunakan untuk menambah variasi di dalam tag. (di tulis di tag awal)
4.   Sebagian besar di tulis berpasangan <tag> </tag tapi ada beberapa yang ditulis tidak berpasangan

Cara Membuat HTML
                    1.       Buka Microsoft Visual Code


                    2.       Buat File baru klik File>New File


                    3.       Ketik program pada Editor


                    4.       Simpan file dan ganti ekstensi file menjadi .html jangan lupa beri nama dan ingat tempat penyimpanan


                    5.        Buka file yang kita simpan dengan ekstensi tadi menggunakan browser klik kanan file>open with>Google Chrome


                    6.       Setelah itu kita akan diarahkan ke browser yaitu tampilan dari code yang kita ketik, seperti yang di bawah ini



Penjelasan Program :
1.     <html> </html> digunakan untuk mendeklarasikan file beruapa html
2.     <head>  </head> digunakan untuk mendeklarasikan
3.     <title> </title> digunakan untuk memberikan judul web
4.     <body> </body> digunkan untuk mengawali dan mengakhiri deklarasi isi web
5.     <h1> </h1> digunakan untuk membuat judul pada isi web atau kita bisa sebut heading
6.     <p> </p> digunakan untuk mengawali dan mengakhiri paragraph atau bisa juga untuk memulai baris baru meskipun sebenarnya ada perintah yang lain yang digunakan untuk ganti baris.

Untuk mengenal lebih jauh mengenai html. Coba kita membuat program baru dengan beberapa perintah-perintah/atau bisa kita sebut tagname dan juga atribut baru. Kali ini saya akan membuat contoh menampikan Biodata.

Program
<html>
    <head>
        <title>Biodata</title>
    </head>
   
    <body>
        <h1 style=color:red;> Biodata</h1>
        <p><b>Nama</b> : <i>Prishandy Hamami Amrulloh</i></p>
        <p><b>NRP</b> : <del>1103181031</del></p>
        <p><b>Kelas</b> : <ins>1 D3 Elektronika B</ins></p>
    </body>
</html>


Hasil

Penjelasan
1.      <h1 style=color:red> </h> digunakan untuk memberikan warna pada heading/judul. Tidak hanya judul pemberian warna juga bisa digunakan untuk memberi warna paragraf/teks lain
2.      <b> </b> digunakan untuk memberi efek bold/tebal pada teks
3.      <i> </i> digunakan untuk memberi efek miring pada tulisan
4.      <del> </del> digunakan untuk memeberi efek coretan
5.      <ins> </ins> digunkan untuk memberi efek garis bawah pada teks

Untuk tag name yang belum saya bahas pada program tersebut sudah saya bahas pada penjelasan sebelumnya silahkan scroll uap dan  pembahasan kali ini sampai ini dulu ya. Untuk fungsi-fungsi yang lain akan saya bahas pada postingan berikutnya. Sekian terima kasih semoga bermanfaat dan bisa menambah wawasan kita semua. Jika ada yang belum paham atau ada kesalahan bisa ketik di kolom komentar.

Tidak ada komentar:

Posting Komentar