Tampilkan postingan dengan label Tutorial HTML. Tampilkan semua postingan
Tampilkan postingan dengan label Tutorial HTML. Tampilkan semua postingan

Sabtu, 28 Januari 2012

Tag Body Part 1 [Tutorial HTML]


Tag Body [Tutorial HTML] - Balik lagi dengan saya yang terlanjur tampan di blog Shinigami Note ini. Sebelumya saya pernah mengajarkan berbagi ilmu tentang pengenalan HTML, Pengenalan HTML [part 2], dan yang terakir Tag Anchor [tutorial html]. Dan kali ini kita akan membahas tag body [<body>] yang merupakan salah satu tag terpenting di dalam penulisan HTML.

Tag body adalah tag yang akan mengatur tampilan atau isi dari pada browser. Tag body memiliki beberapa atribut antara lain:
• Bgcolor
• Background
• Text
• Link
• Alink
• Margin
• Dan lain-lain (kalau di jelasin semua malah pusing nanti :D )

Oke dari pada bingung mending langsung praktek, dan saatnya buka notepad ....
(Klik start, all programs, accessories, notepad)
Tulis kode berikut kedalam notepad

Lalu simpan dengan nama Shinigami.html dan pilih save type: all files

Bgcolor


Bgcolor atau background color alias warna latar adalah atribut yang digunakan untuk menentukan warna latar belakang yang akan ditampilkan nantinya. Warna pada HTML ditentukan dengan pola RGB (Red green blue). Misal kita ingin membuat background warna hitam maka:


Background


Berbeda dengan atribut bgcolor yang hanya membuat warna latar, tag Background ini akan membuat latar belakang dengan gambar. Rumusnya <body background=”url gambar” >
Misal:


Text


Atribut text ini digunakan untuk mewarnai text secara umum. Sebenarnya jika tidak menggunakan atribut ini warna text otomatis akan berwarna hitam.
Misal kita ingin warna merah :


Link


Hampir serupa dengan atribut text, tetepi atribut link ini bekerja pada pabrik pewarnaan link (tautan)secara umum. Jika kita tidak menyisipkan atribut ini maka secara default (bawaan) warna link adalah biru. Dan dengan atribut ini kita bisa mengubahnya. Misal kita ingin memberikan warna putih pada link, maka:


Alink


Nah, kalau yang satu ini berguna ketika sebuah tautan atau link di sorot lampu oleh kursor. Jika kita menambahkan atribut ini maka kita bisa menentukan warna ketika sebuah link atau tautan di tunjuk oleh kursor. Misal kita ingin menggunakan warna merah, maka:


Margin


Akhirnya sampai juga pada pembahasan yang terakhir, yaitu mengenai margin. Si margin ini berfungsi untuk mengatur jarak antara konten ketepian. Misal kita ingin membuat jarak tepian 15 pixel, maka:


Sekian untuk penjelasan tag body part 1 ini, jika ada yang bingung silahkan tinggalkan komentar. Semoga membermanfaat.

Jumat, 23 Desember 2011

Tag Anchor (Tutorial HTML)

tag anchor
Ketemu lagi dengan saya yang terlanjur ganteng ini :akhirnya: .Sempet bingung mau posting apa, tapi setelah dipikir – pikir lebih baik posting yang berguna. Jadi kali ini saya akan menjelaskan tentang tag Ancur Anchor <a> , kalau bahasa Indonesia artinya jangkar.
Tag ini merupakan tag yang biasa di gunakan, biasanya digunakan untuk membuat link atau tautan. Tau kan link itu apa ?.
Contoh:
<a href=’http://rupi-adam.blogspot.com>Cyber Blog</a>
Hasilnya: Cyber Blog

Atribut


Atribut ini adalah perintah tambahan pada tag anchor. Diantaranya:
  • href,
  • title,
  • target,
  • name,
  • accesskey

Href


Atribut ini merupakan bagian terpenting, karena tanpa ini tujuan tidak akan jelas. Atributnini menentukan kemana arah / tujuan suatu tautan tersebut.
Jadi Atribut ini di tulis href=alamat tujuan. Misalkan kita hendak membuat link facebook maka kita tulis <a href=’http://facebook.com’>Facbook</a> hasilnya Facebook

Title


Dari namanya saja kita sudah bisa menebak, bahwa atribut ini memberikan title / keterangan tautan tersebut. Atribut ini tidak akan mengubah tampilan tulisan dari tautan, ia hanya akan memunculkan keterangan ketika tautan tersebut di sorot.

Contoh :

Dengan title
<a href=’http://rupi-adam.blogspot.com’ title=’dengan title’ >Cyber Blog</a>
Hasilnya: Cyber Blog

Tanpa Title

<a href=’http://rupi-adam.blogspot.com’>Cyber Blog</a>
Hasilnya: Cyber Blog

Coba kalian sorot, dan lihat bedanya


Target


Atribut target ini adalah opsi atau perintah bagaimana sebuah link atau tautan dibuka :piktor::piktor: pada browser. Pilihannya mulai dari membuka di tab baru, jendela baru, atau di buka saat itu juga :mesum: :mesum:

Contoh

Membuka di tab baru
<a href=’http://rupi-adam.blogspot.com’ target=’_blank’>Cyber Blog</a>
Hasilnya: Cyber Blog
Membuka di tempat
<a href=’http://rupi-adam.blogspot.com’ target=’_self’ >Cyber Blog</a> atau bisa juga <a href=’http://rupi-adam.blogspot.com’>Cyber Blog</a>
Hasilnya: Cyber Blog

Name


Atribut ini berbeda dari atribut href yang akan membawa kita kesebuah halaman. Menurut Buku Tatang Sutarma sepengetahuan saya ini hanya mengantarkita menuju ke suatu titik, eitz bukan titik kaya gini (.). Atribut ini berguna untuk memberikan nama dari suatu tautan.
contoh:
<a href=’#Rupi’>Rupi</a>
Maka akan menuju ke
<a name=’Rupi’>Rupi</a>
Hasilnya klik tautan dibawah ini
Klik ini !!!

Rupi Adam
Rupi adam adalah seorang pria yang terlanjur tampan. Ia adalah pemilik Cyber Blog. Udah ah capek narsisnya :ngakak: :ngakak: :ngakak:

Accesskey


Kalau atribut yang satu ini bisa dibilang sebagai shortcut atau jalan pintas dari sebuah tautan / link. Jadi ketika ada sebuah tautan yang menggunakan atribut ini maka bisa di buka dengan tombol shortcut ALT+[apa aj sesuai keinginan kita]

Contoh:
<a href=’http://rupi-adam.blogspot.com’ accesskey=’A’>Halaman Awal</a>
Atau
<a href=’http://facebook.com/rupi.adam’ accesskey=’F’>Facebook Gue</a>
Hasilnya:
Halaman Awal
Facebook Gue

Nah, sekarang pencet ALT+A buat kembali ke homepage atau halaman awal dan ALT+F buat nge-add facebook gue. Alhamdulillah ya udah selesai, semoga bisa membantu, maaf kalau belibet libet, namanya juga newbie.
Kalau ada yang bingung ya tinggal di komeng aja ok, see you ...
:bigsmile::bigsmile::bigsmile:

Sabtu, 03 Desember 2011

Tutorial HTML part 2

Belajar HTML

Sebelumnya saya telah memposting tentang Pengenalan HTML untuk pemula dan pada malam minggu yang selalu suram kali ini kita akan praktek membuatnya. So yang harus di persiapkan adalah sebuah komputer dan secangkir kopi :D

Tutor kali ini spesial pakek telor buat anggota KIR sekolah yang cupu yang ingin belajar html dari saya. Dan kali ini kita akan praktek membuat file html dengan tag dasar.


Langkah



1. Hidupkan komputer
2. Klik start
3. All programs
4. Buka Accssories, pilih notepad
5. Lalu ketikan

<html>
<head>
<title>Belajar HTML</title>
</head>
<body>
<i>menggunakan tag italic</i>
<b>ini pakai tag bold</b>
<strike>ini pakai tanda coet</strike>
<u>ini pakai underline</u>
<blink>ini pakai efek kedip</blink>
</body>
</html>



Klik untuk memperbesar


6. kalau sudah maka save dengan ekstensi / akhiran .html


7. Cek dengan menggunakan browser (bisa mozila, Google chrome, deelel)

tarraaaaa, inilah hasilnya



sampai jumpa di tutor lainnya ...

Rabu, 14 September 2011

Pengenalan HTML untuk membuat web

Sebelumnya saya mohon maaf apabila nanti ada kesalahan, di karenakan saya masih newbie dan belajar belajar secara autodidak. Tapi karena banyak permintaan, ya sudah saya buat kelas untuk belajar HTML ini.


Hal pertama ialah mengetahui apa itu HTML. HTML adalah bahasa pemrograman dasar yang digunakan untuk membangun sebuah situs. HTML sangat mudah digunakan dan diaplikasikan, oleh karena itu apabila kalian ingin belajar membangun sebuah situs sendiri maka bahasa HTML wajib kalian pelajari. Pelajaran HTML ini akan diberikan dalam bahasa yang mudah dimengerti sehingga kalian dapat belajar mulai dari nol alias tidak tahu apa-apa tentang html.