Sunday, March 04, 2012
HTML (Hyper Text Markup Language) merupakan serangkaian simbol-sibol atau tag di mana berfungsi menampilkan sebuah halaman atau sebuah objek pada web browser. Bagi kalangan ahli, mungkin tidak perlu lagi belajar HTML Basic, namun bagi kalangan pemula (seperti ane, hehe), sudah selayaknya belajar HTML dari tingkat dasar terlebih dahulu sebelum beranjak ke tingkat Intermediate, dan pada tingkat akhir, menuju Web Master. Dalam postingan kali ini, saya bakal mengajak sobat-sobat Blogger yang ingin belajar lebih banyak tentang HTML dan penggunaannya.
Seperti yang saya sebutkan di awal, HTML berfungsi untuk menampilkan sebuah halaman atau objek pada web browser. Pada umumnya kode-kode atau tag HTML selalu di awali dengan tanda <x> dan diakhiri dengan </x>. Di mana x merupakan tag HTML semisal b, i, u, ul, li dan lain sebagainya. Sebagai contoh, jika kita menuliskan <b>Belajar HTML</b> maka hasil dari penulisan kode tadi akan menghasilkan objek berupa huruf tebal seperti yang sobat lihat di bawah ini:
Belajar HTML
Sebagai persiapan pembelajaran, mari kita bernyanyi bersama menyiapkan terlebih dahulu seperangkat alat yang harus sobat Blogger miliki sebelum belajar tentang HTML.
Semoga bermanfaat..
- PC
- Notepad, adalah sebuah tool yang paling sederhana untuk membuat atau menuliskan tag-tag HTML, namun saya sangat menyarankan agar sobat menggunakan tool khusus untuk menulis dan merancang kode HTML, seperti HTML-Kit yang bisa didownload melalui link ini. Kalo bisa sih, sobat make Adobe Dreamweaver (dulunya bernama Macromedia Dreamweaver), seperti yang saya pake sekarang, soalnya tool-tool dari Dreamweaver sangat lengkap.
- Web Browser, sobat bisa menggunakan Mozilla Firefox versi 3.6 ke atas, Google Chrome, Apple Safari, IE, Netscape Navigator atau yang lainnya.
Minyak sayur 2 Kg.Tempe 1 potongBawang putih 1 siung.
- Tag <b>, <u>, dan <i>
Ini adalah tag yang paling sederhana dari beberapa tag HTML, huruf b, u dan i adalah tag HTML yang berfungsi untuk memberikan fungsi pada text yang masuk di dalamnya.
Tag <b> memberikan fungsi tebal pada sebuah text.
Tag <u> memberikan fungsi garis bawah pada teks
Tag <i> memberikan fungsi Italic atau teks miring.
Untuk mencobanya, silahkan buka Notepad dan tuliskan kode di bawah ini:
<html><!--Ini adalah permulaan penulisan kode HTML-->
<b>Teks Tebal</b>
<div></div><!--Penggunaan tag div berfungsi untuk membuat garis baru-->
<u>Teks Bergaris Bawah</u>
<div></div>
<i>Teks Miring</i>
</html><!--Ini adalah akhir dari penulisan kode HTML-->
Hasil tag <b> : Teks tebal
Hasil tag <u> : Teks bergaris bawah
Hasil tag <i> : Teks miring
Setelah selesai menulis kode di atas, silahkan simpan dengan nama "font.html" tanpa tanda kutip, pemberian nama font.html berfungsi agar Notepad menyimpan data tersebut dalam format *.htm dan bukan dalam format *.txt. Jika sudah disimpan, silahkan buka file tersebut menggunakan Web Browser.
- Tag <font>...</font>
Tag <font> berfungsi untuk mengubah gaya dari sebuah huruf, kata atau kalimat. Memiliki atribut seperti color, name dan size.
color akan menentukan warna dari sebuah teks.
name merupakan nama font semisal Arial, Times, Book Antiqua dan sebagainya.
size akan menentukan ukuran teks.
Atribut ini (color, name, size) ditempatkan di dalam tag <font>. Sebagai contoh, silahkan ketikkan kode di bawah ini ke dalam Notepad. Perhatikan cara penulisannya!
<font name="arial" size="12px" color="magenta">Ini adalah Font Arial, berukuran 12 pixel, berwarna Magenta</font>
Simpan dengan nama Font1.html dan buka file tersebut dengan menggunakan web browser.
- Tag <blink>...</blink>
Tag <blink> digunakan untuk membuat teks berkedik-kedip, sebenarnya ini sudah saya posting dahulu kala. Namun apa salahnya jika saya menyertakan hal ini. OK, silahkan ketikkan kode di bawah ini:
<blink>Ini adalah teks berkedip</blink>
Hasilnya :
- Tag <marquee>...</marquee>
Tag <marquee> akan memberikan efek berjalan pada sebuah teks, seperti yang anda lihat di dalam blog ini. Marquee mempunyai atribut di antaranya:
direction, menentukan ke mana arah teks ini akan berjalan.
behaviour, mengatur perilaku gerakan teks. Mempunyai anggota yaitu:
- Scroll, digunakan agar teks berputar.
- Slide, digunakan agar teks bergerak satu kali, lalu berhenti.
- Alternate, digunakan agar teks bergerak ke kiri dan ke kanan, lalu kembali lagi seperti itu (puyeng-puyeng deh).
Contohnya:
<marquee direction="left">Teks akan berjalan ke kiri</marquee>
Hasilnya :
Semoga bermanfaat..
{ 2 comments... read them below or Comment }
You can leave a comment to request any article(s), software(s), ebook(s) or report the dead link.
Then I will reply as soon as I can :)
mantap gan... ane dapat pencerahan soal HTML.. btw.. mohon sarannya gan untuk bikin menu horzintal di blogg soalnya ane sudah ikut petunjuk dari beberapa site tapi tdk ada yg berhasil.
ReplyDeleteTerima Kasih,,,
ReplyDeleteInsya Allah Masalah Horizontal menu akan saya post di postingan berikutnya..