Anima Team See what you want and enjoy the contents

Blog

22 Jul 2011

Part 1


Mungkin banyak yang belum mengetahui sebenarnya apa itu HTML?
pertama-tama akan lebih baik kalau kita tahu dulu apa itu sebenarnya.
Jadi, HyperText Markup Language (HTML) adalah sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah Penjelajah web Internet dan formating hypertext sederhana yang ditulis kedalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi. Dengan kata lain, berkas yang dibuat dalam perangkat lunak pengolah kata dan disimpan kedalam format ASCII normal sehingga menjadi home page dengan perintah-perintah HTML. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang disebut dengan SGML (Standard Generalized Markup Language), HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web. HTML saat ini merupakan standar Internet yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C). HTML dibuat oleh kolaborasi Caillau TIM dengan Berners-lee robert ketika mereka bekerja di CERN pada tahun 1989 (CERN adalah lembaga penelitian fisika energi tinggi di Jenewa)
cukup sekian pengenalan tentang HTML yang mungkin telah sedikit membuatku bingung sendiri karenanya. Tapi kalau kalian mau penjelasan yang lebih lagi, aku sarankan kalian buka saja sendiri web ini

Baiklah, langsung saja pada pokok pembahasan kita yaitu pembelajaran HTML

Pertama dan yaang paling dasar, aku akan memberitahukan bagian-bagian dari sebuah kode HTML, berikut ini tutorialnya:

Sebelum masuk pada bab yang dituju, akan aku beritahukan catatan pentingnya
untuk kode yang tidak terdapat garis miring "/" maka kode tersebut berfungsi sebagai kode pembuka, sedangkan kode yang terdapat garis miring "/" merupakan penutup kode tersebut.


baiklah, berikut adalah urut-urutan dari sebuah kode HTML:

<html>
<head>
</head>
<title>
</title>
<body>
</body>
</html>


<html> = berfungsi sebagai pembuka dari kode HTML, kode ini juga menandakan sebagai pembuka suatu kumpulan kode HTML yang lain.
<head> = dilihat dari kodenya adalah head yang berarti kepala dan itu berada di atas, itu berarti head bisa dibilang sebagai suatu kode html dimana kita menempatkan suatu gambar atau konten khusus yang nantinya akan diletakkan di paling atas suatu website.
<title> = ini adalah judul, kode ini akan membuat suatu tulisan yang dimasukkan didalam kode ini akan menjadi sebuah judul yang tampil di browser saat di buka.
<body> = kode ini adalah kode dimana kita meng-input berbagai konten yang nantinya akan menjadi isi website tersebut.

Baiklah, sekarang kita aplikasikan untuk bisa langsung mengetahui hasilnya.
Pertama, kita buka aplikasi bernama Notepad (Start - All programs - Accessories - Notepad)

Sekarang untuk aplikasinya, kita ketikkan kode di bawah ini:

<html>
<head></head>
<title>disini judul akan ditampilkan</title>
<body>disini isi konten dalam website akan ditampilkan</body>
</html>


(untuk head aku kosongi karena jika head bukan suatu konten maka head akan sama dengan isi body biasa)

Setelah itu lihat hasilnya dengan cara:
1. Klik Save
2. Ketikkan nama file yang kamu mau pada file name, misalnya: belajar HTML.htm
NB: jangan lupa untuk memberikan format .htm pada akhir nama file kamu
3. Ubah Save as Type menjadi All Files dengan men-drop down menu tersebut
4. Buka file kamu tadi, cukup klik 2x pada file tersebut. Maka hasilnya adalah sebuah default browser yang telah terinstal di komputer kamu akan terbuka dan menampilkan hasil kode HTML kamu tadi.

Jika benar, maka hasilnya akan menjadi seperi gambar di bawah ini:



Jika telah berhasil dan hasilnya sama dengan yang di gambar, maka anda telah menguasai hal paling dasar dalam HTML ini. Selamat untuk anda.

Selanjutnya adalah kode untuk mengatur sebuah paragraf, sebenarnya terdapat banyak sekali kode-kode HTML yang berfungsi terhadap paragraf yang telah kita buat, namun kali ini aku akan mengajarkan hal-hal dasar dahulu seperti kode untuk meletakkan suatu paragraf menjadi rata tengah, rata kanan, atau rata kiri.
Ada 2 perintah yang memiliki fungsi sama namun berbeda hasilnya pada suatu paragraf. aku ambil contoh untuk perintah yang menyebabkan suatu kalimat menjadi rata tengah, kanan, atau kiri. Perintah untuk membuat hal tersebut ada 2 macam. Yang pertama adalah dengan perintah <p align="letak"></p> dan yang lainnya adalah dengan perintah <letak></letak> dan yang membedakan antara keduanya adalah hasil space di tiap paragrafnya. Untuk lebih jelasnya, berikut adalah tutorialnya :

Pertama, akan aku gunakan yang <p align="right">-</p>. Coba anda masukkan kode berikut ini di Notepad anda dan kemudian lihat hasilnya:

<html>
<title>Tutorial paragraf</title>
<head/>
<body>
<p align="left">rata kiri</p>
<p align="center">rata tengah</p>
<p align="right">rata kanan</p>
</body>
</html>


Jika kode yang anda masukkan benar, maka hasilnya akan menjadi seperti pada gambar dibawah ini:




Jika kali ini anda benar lagi dan sesuai dengan gambar, maka aku ucapkan SELAMAT sekali lagi pada anda karena sudah mulai mahir dalam hal ini.

Namun, masih ada kode lain yang memiliki fungsi sama, yaitu adalah sebagai berikut, silakan kamu coba di notepadmu untuk mengetahui lebih jelas hasilnya:

<html>
<title>Tutorial paragraf</title>
<head/>
<body>
<left>rata kiri</left>
<center>rata tengah</center>
<right>rata kanan</right>
</body>
</html>


Jika benar, maka hasilnya akan sama seperti di atas namun space atau jarak tiap kalimatnya akan lebih kecil dari sebelumnya.

Berikutnya adalah kode-kode yang akan bekerja untuk mengubah font(tulisan). Mulai dari mengubah ukuran(size), warna(color), model(face), memberikan efek tulisan kecil di atas(sup) ataupun di bawah(sub), sampai memberikan efek tebal(bold), miring(italic), atau bergaris bawah(underline). Semua akan di bahas dalam tutorial HTML Part 2. Jadi, bersabarlah dan teruslah berkarya dengan HTML.

SEMANGAT DAN SELAMAT MENCOBA

Fasilitas berlangganan artikel di anima world telah tersedia (FREE)

Silakan masukkan alamat e-mail anda lalu klik Berlangganan:

Delivered by FeedBurner

2 komentar:

virendra yadav mengatakan...

online calculator

Great post! I've got an idea here. Thanks for sharing this information. It will really help.

Dio Alsabah A. Z. mengatakan...

mas, ada bisnis baru

pay per sms
http://addjitoe.com:8080/pls/f?p=110:7::Member:NO::P7_REF_NAME:ALSSTAR

kita dibayar tiap dapet sms dari mereka

pay out lewat bank lokal

Posting Komentar

Join Us

About me

Foto Saya
A. Harfi A.
INILAH AKU. seorang remaja yang sedang dalam masa pertumbuhan dan sering berharap banyak hal-hal indah dan berpikir bisa mendapatkannya tanpa adanya usaha yang keras, itulah impian. Aku hanyalah remaja biasa dengan kehidupan biasa namun aku hidup dari cita-cita besar yang selalu membayangiku. Aku bukan orang pintar, rajin juga tidak, apalagi genius, tapi kebalikan dari itu semualah yang dibicarakan kebanyakan orang tentangku, terserah kau mau berpihak pada siapa, akupun bingung. Jadi, aku pikir cukup sekian segala penghinaan sekaligus pujian yang mungkin bisa membuat kepalaku pecah karenanya. Sekarang waktunya aku ucapkan,"Selamat menikmati blog simple buatanku ini" :)
Lihat profil lengkapku

Find something else? Search here


The Generation Design by Insight © 2009