Mengenal Dasar-Dasar Fungsi HTML

Oke kali ini gw mau berbagi sedikit pengetahuan seputar HTML, Langsung aja kita ke pembahasannya.

HTML ( Hyper Text Markup Language) Adalah bahasa yang digunakan untuk mendisain dan memformat halaman web. Kita mungkin sudah mendengar tentang bahasa program seperti C,C++, Java, dan Visual basic. Masing-Masing bahasa ini terdiri dari perintah sintak
dan programming. Nah didalam website programing HTML menjadi pondasi dasar dalam halaman suatu website, sebuah file html biasanya disimpan dalam kode ekstensi .html (dot html), apabtila ingin membuat website yang dinamis tentu kita tidak hanya memerlukan HTML saja, namun css, java script dan php juga sangat diperlukan, kalua hanya menggunakan html saja maka website tersebut kedalam website statis karena tidak memiliki aksi atau fungsi-fungsi tertentu yang dapat mengelola website tersebut.

HTML memliki beberapa elemen yang tersusun dari tag, seperti tag heading, paragraf, pembuatan from, list, tombol, membuat hyperlink, link yang menghubungkan antar halaman website, dan lain-lain
Didalam HTML, sintak ini disebut tag.Tag ditulis dengan tanda-kurung bersudut< dan >.Ada kelompok tag yang sudah dikenal didalam HTML, yang mana digunakan untuk berbagai tujuan.
Sebagai contoh, dalam rangka memodifikasi satu baris teks ke dalam Bold, kita menerapkan
tag bold dengan suatu tag <b>, kemudian tulis beberapa teks atau suatu paragrap yang
berisi beberapa teks,dan tutup tag menggunakan tag </b> seperti dalam contoh listing 1.
Semua tag didalam HTML harus ditutup menggunakan sintak </>.Tetapi ada beberapa perkecualian pada aturan ini, yang mana kita akan mendiskusikanya nanti.Kita memakai tag ini
sebab HTML bukanlah bahasa yang sensitip seperti C++ dan Java.

KEGUNAAN HTML

  • Membungkus element2 tertentu sesuai kebutuhan
  • Membuat Heading/Judul
  • Membuat tabel
  • Membuat Paragraf
  • Membuat list
  • Membuat form
  • Menampilkan video
  • Membuar garis
  • Membuat huruf cetak Tebal, Miring, Garis bawah
  • Menampilkan gambar
  • dan masih banyak lainnya yang mungkin akan kita praktekan secara bertahap kalau mimin ga mls ya pak :v

Struktur

Setiap kode HTML perlu ditulis dalam suatu struktur yang mana dapat dihubungkan dengan
Word Wide Web.Tidaklah wajib untuk mengikuti struktur ini. Bagaimanapun juga,lebih
baik
mempraktekan langsung struktur ini sebagaai perancangan halaman web kita.
Listing 1  
Struktur HTML sederhana :
<!– Ini komentar didalam HTML.Ini tidak akan diperliatkan pada browser–>
<HTML>
<HEAD>
<TITLE>Welcome to HTML (tanda pengenal/Judul)</TITLE>
</HEAD>
<BODY>
<!–halaman content dimulai (biasa berisi pesan2 atau isi dari sebuah html yang kamu bikin)–>
<B>
Yang ditampilkan di browser, cuma tulisan ini.
</BODY>
</HTML>
Kode diatas menggunakan Notepad dan menyimpan file sebagai kode.html. Kemudian, klik kanan file yang disimpan tadi. bagaimanakah keluarannya?
Listing 2 

<B>Untuk menampilkan tulisan cetak tebal (Bold)</B><BR>
<I>Untuk menampilkan tulisan cetak miring (Italic) </I><BR>
<U>Untuk menampilkan tulisan bergaris bawah (Underline) </U><BR>
<BR> digunakan untuk menampilkan baris baru.
Listing 3
<Pon> Bla bla bla bla taeku mambu wedus wkwk, dan tulisan ini pun akan dianggap satu paragraf. kalau ga percaya, coba aja sendiri. dengan menggunakannya dua kali atau lebih bakal lebih keliatan hasilnya wkwk.</P>
Tidak wajib untuk menutup tag <P>. Tetapi seperti dikatakan sebelumnya, menutup
tiap-tiap tag adalah suatu yang baik yang pemprogram praktekkan.
Listing 4  
Bekerja dengan Heading
Kita dapat menggunakan heading untuk mengorganisir teks kita dalam berbagai
tingkatan. Ada lima tingkatan heading didalam HTML seperti di bawah:
<H1>Level - 1 </H1>
<H2>Level - 2 </H2>
<H3>Level - 3 </H3>
<H4>Level - 4 </H4>
<H5>Level - 5 </H5>
Listing 5 Penempatan List 
contoh teks atau items.Ada dua jenis list didalam HTML.
sebagai berikut
  1. Ordered List
  2. Unordered List

Ordered List diwakili oleh tag <ol> tag secara otomatis menomori, dan
Unordered List diwakili oleh tag <ul> dan terlihat seperti bullet.
Cobalah kode di bawah ini:
<OL>
<LI>Java
<LI>C++
</OL>
kode diatas menghasilkan suatu daftar perintah bahasa. Jika kita
menginginkannya seperti bullet kemudian kita ubah tag <OL> menjadi tag <UL>
sebagai di bawah ini:
Listing 6
<UL>
<LI>Java
<LI>C++
</UL>
Listing 7 
Penerapan Definisi List
Definisi List adalah serupa dengan daftar kata. Diterapkan menggunakan tag <DL>
dan <DT> seperti ditunjukkan listing 7 dibawah ini.
<DL>
<DT>Java
<DD>Developed by Mr.4NDI
<DT>Yang kedua
<DD>Developed by saya sendiri
</DL>
Listing 8 
Indenting Text
Tag <BLOCKQUOTE> yaitu teks yang menjorok lebih kedalam dari garis tepi secara
otomatis dari kiri ke kanan. Cobalah contoh berikut :
<BLOCKQUOTE>
kamu jelek kaya bebek pantatnya robek dicium bebek (use your brain bro hehe)</BLOCKQUOTE>

Oke sampai sini udah mulai paham kan? mungkin segitu dulu yang kita bahas karna aing dh cape ngetiknya njer wkwk,
Maksud saya membuat artikel kali ini bukan untuk mengajari/menggurui tapi hanya sekedar sharing aja supaya kita bisa sama2 belajar.
Apabila masih ada yg blm dimengerti silakan komen aja :)

Postingan terkait:

Belum ada tanggapan untuk "Mengenal Dasar-Dasar Fungsi HTML"

Posting Komentar