Please welcome Senpai. Semoga Bermanfaat.

Pengenalan HTML

Senin, 21 April 2014
Sebelumnya sudah ada postingan yang berjudul Belajar HTML, disana sudah dijelaskan secara mendasar tentang HTML. Sekedar untuk mengingatkan kembali tentang apa itu HTML anda bisa membacanya di Pengenalan HTML.

Didalam tutorial HTML ini kita akan membahas kembali tentang HTML tersebut termasuk elemen-elemen HTML yang belum kita bahas sebelumnya seperti frame, table, form dan sebagainya.

Apa yang dibutuhkan dalam Belajar HTML ini?
Komputer dan koneksi ke Internet.
Agar kita bisa membaca dan belajar sambil praktek.

Teks editor.
Teks editor seperti Notepad di Windows adalah pilihan paling mudah karena sudah terintegrasi dengan system kita. Jika ingin menggunakan teks editor yang lebih bagus lagi, bisa men-download Notepad ++.

Jika menggunakan software lain seperti MS FrontPage atau Dreamweaver usahakan untuk selalu berada di kode "HTML View" dan gunakan real browser untuk menampilkan atau "preview" dokumen HTML anda.

Dengan kata lain biasakan untuk membuat, mengedit dan memasukkan kode-kode HTML dengan mengetiknya secara manual sehingga nantinya akan terbiasa dan hafal dengan kode-kode HTML.

Browser atau peramban.
Untuk Windows ada Internet Explorer namun jika ingin menggunakan peramban yang lain ada bermacam-macam pilihan seperti Mozilla Firefox, Google Chrome, Opera, Safari dsb.

Kreatif, tekun dan sabar.
Misal jika diberikan contoh-contoh HTML, kemudian berinisiatif membuat contoh-contoh yang berbeda berdasarkan imajinasinya sendiri ini namanya kreatif.

Kemudian lakukan dengan rutin dengan melakukan berbagai macam percobaan, melakukan pencarian informasi dari berbagai macam sumber, menyimak dan memberikan perhatian dengan apa yang sedang di lakukan itu namanya baru tekun.

Kesabaran memang ada batasnya jika ini terjadi sebaiknya anda beralih melakukan hobby-hobby anda yang lainnya lupakan HTML untuk sementara.

Tips lainnya
Jangan menulis tag-tag HTML secara tumpang-tindih.

Penulisan yang salah:
<p><strong>Paragraf dengan tulisan tebal</p></strong>

 Penulisan yang benar:

<p><strong>Paragraf dengan tulisan tebal</strong></p>

Hasil dari kedua contoh diatas akan sama:

Paragraf dengan tulisan tebal

Pelajari tapi hindari penggunaan deprecated tag dan atribut, seperti contoh untuk tag <body> deprecated jika menggunakan atribut bgcolor atau background:

<body background="#FFFFFF">...</body> atau: <body bgcolor="#FFFFFF">...</body>
Kita dapat menggantinya dengan menggunakan atribut style:

<body style="background-color:#ffffff">...</body>

Dalam tulisan tentang Pengenalan HTML mungkin anda akan mendapati tulisan seperti berikut:

Untuk menuliskan Elemen HTML bisa menggunakan huruf besar maupun huruf kecil. Contoh: <HTML>, <HtMl>, <HTml>, <html>, semuanya adalah sama.

Namun saat ini saya menganjurkan untuk membiasakan diri menggunakan huruf kecil saja baik untuk HTML maupun CSS.

Disamping akan terlihat lebih rapi juga agar nantinya lebih mudah ber-adaptasi dengan XHTML yang memang diharuskan harus menggunakan huruf kecil.

XHTML adalah gabungan dari XML dan HTML jadi tetap menggunakan kode-kode HTML hanya ada peberapa perbedaan yang mudah dipelajari nantinya kalau sudah tahu dan mengerti tentang HTML.

Tag Dasar HTML

Jumat, 18 April 2014

Komponen dasar dari suatu dokumen HTML terdiri dari tag elemen HTML, HEAD dan BODY. Berikut ini adalah penjelasan dari Tag Elemen tersebut:
<html>
<head>
<title>Disini titel websiteku</title>
</head> <body> Disini adalah konten yang tampil di browser </body>
</html>
Tag pertama pada dokumen HTML diatas adalah: " <html>" tag ini merupakan awal dari suatu dokumen HTML, dan tag " </html>" merupakan akhir dari dokumen HTML. Isi keseluruhan dari suatu dokumen HTML selalu berada diantara tag <html>…</html>.

Kemudian tag " <head>…</head>" (header) adalah informasi dari dokumen HTML. Informasi di dalam header meliputi: title, meta, style, script dll. Selain Title informasi di dalam header ini nantinya tidak akan di tampilkan di web browser.

Tag berikutnya adalah " <title>…</title>" merupakan bagian dari Head, tag ini adalah sebagai Titel dari dokumen HTML, titel ini akan tampil di titel dan tab browser. Sebagai contoh sewaktu anda membuka file contoh diatas perhatikan akan muncul tulisan "Disini titel websiteku". 

Tag "<body>…</body>" merupakan isi dari suatu dokumen HTML yang akan ditampilkan di web browser, yang terdiri dari berbagai macam format file berupa teks, grafik, link, animasi maupun audio-video (multimedia).


Mari belajar HTML


Jika anda baru terjun di dunia maya alias pemula (newbie) dan tertarik ingin belajar HTML untuk membuat website sendiri maka anda tidak salah datang ke blog ini, karena disini anda akan mendapatkan tutorial, tips, triks dan artikel-artikel tentang bagaimana cara belajar HTML untuk membuat website.

Di Internet sebenarnya kita bisa saja mendapatkan banyak template baik yang gratis maupun yang berbayar, namun kadang tidak sesuai dengan keinginan (selera) kita. Maka kita harus meng-edit dan melakukan perubahan-perubahan. Di dalam mengedit dan melakukan perubahan inilah kita harus mengerti dan memahami bahasa HTML.

Di blog ini anda akan mendapatkan tutorial belajar HTML yang disertai dengan contoh-contoh mulai dari dasar, sehingga akan mudah dipahami dan sangat cocok bagi anda yang masih pemula. Dan bagi anda yang mengedit atau membuat suatu halaman web bisa melangkah ke halaman-halaman berikutnya sesuai dengan topik yang anda inginkan.

Untuk belajar anda dapat menggunakan program HTML seperti Ms FrontPage, Dreamweaver atau Text Editor (Notepad), sesuai dengan selera anda masing-masing. Namun untuk tutorial ini akan diajarkan dengan menggunakan teks editor yang simpel yaitu Notepad, jika anda ingin teks editor yang lebih interaktif anda bisa menggunakan Notepad++.

Dalam belajar sebaiknya anda langsung praktek di program HTML anda, sehingga akan lebih mudah untuk dipahami, anda ketik atau copy/paste contoh-contoh HTML-nya di program HTML anda dan preview di browser untuk melihat hasilnya.

Saya sangat berterimakasih jika anda bersedia memberikan kritik, saran maupun komentar atas kekurangan, error, broken links dan lainnya, masukan dari anda sangat membantu untuk perbaikan tutorial maupun blog ini.



Pengenalan HTML

Pengertian singkat tentang HTML

HTML (Hyper Text Markup Language) merupakan bahasa standar untuk membuat suatu dokumen HTML (halaman web) yang terdiri dari kode-kode singkat tertentu, dimana dengan kode-kode tersebut akan memerintahkan Web browser bagaimana untuk menampilkan halaman Web yang terdiri dari berbagai macam format file seperti teks, grafik, animasi, link maupun audio-video.

Sedangkan Web browser adalah sebuah progam yang dapat menterjemahkan kode perintah dari dokumen HTML tersebut sehingga dapat kita lihat, baca dan dengar. Contoh dari Web Browser adalah Internet Explorer, Netscape Navigator, Mozilla Firefox, Opera, Safari dll.

HTML mempunyai file perluasan (extention) htm atau html. Dimana kedua perluasan tersebut adalah sama, jadi anda boleh menyimpan file dokumen HTML dengan extention ".htm" atau ".html".

Untuk mulai belajar HTML kita akan menggunakan Texs Editor, Notepad. Di bawah ini adalah contoh suatu dokumen HTML yang sangat sederhana. Buka Notepad, silahkan mulai dengan mengetikkan (copy/paste) kode di bawah ini:
<html>
<head>
 <title>Titel Websiteku</title>
</head>
<body> Ini adalah dokumen HTML pertamaku
</body>
</html>
Simpan file tersebut ke C:\My Documents dengan nama "websiteku.htm." Ketika menyimpan file tersebut dengan Notepad ganti "save as type"-nya dengan "all files". Kemudian buka browser, dari menu File klik Open dan tujukan ke C:\My Documents\websiteku.htm "klik Ok" maka halaman website pertama anda akan ditampilkan.
*Lakukan hal yang sama untuk contoh-contoh selanjutnya.

Perintah didalam dokumen HTML terdiri dari berbagai struktur penyusun seperti tag, elemen, atribut dan nilai. Tag terdiri dari lambang-lambang khusus seperti: " <", " >" dan "/", untuk menuliskannya di dalam dokumen HTML dimulai dengan tag pembuka " <…>"dan diakhiri dengan tag penutup " </…>". Kemudian di dalam tag tersebut terdapat teks seperti contoh diatas :html, head, title,body dan yang lainnya ini disebut dengan Elemen HTML.

Elemen HTML kemudian ada yang memiliki atribut dan nilai tertentu, seperti contoh untuk membuat warna latar belakang (background): <body bgcolor="0000ff">, body merupakan elemen, bgcolor adalah atribut dan 0000ff merupakan nilai (value).

Elemen HTML mempunyai tiga hal penting yaitu: tag pembuka, isi, dan tag penutup. Sebagai contoh: Elemen html mempunyai tag pembuka " <html>" dan tag penutup " </html>" dan yang berada diantaranya merupakan isi atau konten dari elemen html tersebut. Untuk menuliskan Elemen HTML bisa menggunakan huruf besar maupun huruf kecil. Contoh: <HTML>, <HtMl>, <HTml>, <html>, semuanya adalah sama.


Diberdayakan oleh Blogger.
Copyright @ 2014 Snowpiercer. Designed by Prayogi Pamungkas

Follow us on Facebook