TUTOR DASAR HTML 3

Belajar dasar HTML 3

Hallo semuanya, terimakasih sudah mau berkunjung di tempat saya yang sangat sederhana ini. Sekarang saya akan membahas lagi kelanjutan mengenai dasar-dasar belajar HTML. Bagi sobat yang belum membaca pembahasan sebelumnya sobat bisa melihat di belajar dasar HTML dan belajar HTML2.
Pembahasan sebelumnya kita membahas mengenai font, dan sekarang saya akan bahas mengenai warna dan formatting. Ok kita langsung aja ya.

8.       Attribut Warna

Dalam hal perancangan sebuah web/blog kita tidak terlepas dengan yang namanya warna, karena warna sangat berpengaruh untuk design tampilan baik itu diweb maupun blog dan untuk perintah warna kita bisa langsung menggunakan perintah nama tersebut seperti : white, black atau red, tapi kita juga bisa menggunakan sebuah code heksadesimal.
Contoh :
<font color=blue>UjiCoba</font> atau <font color=#0000FF>UjiCoba</font>
Hasilnya seperti ini :
UjiCoba atau UjiCoba tetap sama kan hasilnya.
Banyak sekali alamat situs yang menyediakan mengenai konversi warna seperti di www.colorcombos.com, kelebihan dari situs tersebut kita bisa langsung mendeteksi warna apa saja yang terdapat pada blog kita hanya dengan memasukan alamat blog kita. Di situs tersebut sobat tinggal klik tombol ColorBlog kemudian masukan alamat blog sobat kemudian klik tombol get atau sobat bisa mencari aplikasi untuk konversi warna dasar ke heksa seperti aplikasi colortoHTML dan sobat bisa cek disini untuk aplikasinya kebetulan di salah satu blog sahabat tersedia aplikasi tersebut.
Sobat bisa cek gambar di dalam spoiler.

Lihat Gambar

Maka hasilnya akan seperti ini

Gambar diatas diambil secara keseluruhan.

Dengan mengetahui kode hexa pada blog kita, akan memudahkan dalam perubahan warna terutama dalam blog kita, sobat tinggal copy aja code hexa yang sudah di deteksi sama web tadi kemudian tinggal cari kode tersebut atau tekan ctrl+f pada rancangan edit HTML sobat.

Kebetulan saya menggunakan google chrome jadi pencariannya ada diatas, seandainya memakai firefox, menu pencarian biasanya ada dibawah.

Mungkin itu salah satu tips sangat sederhana mengenai attribut warna. Sekarang kita lanjut lagi ke Formatting.

9.       Formatting

HTML mendukung beberapa format untuk mendukung perancangan web, seperti list, alignment dll. Berikut beberapa contoh formatting yang sering kita gunakan dalam perancangan web maupun pengeditan HTML dalam sebuah blog.

1. LIST
   LIST terdiri dari dua list yaitu Unnumbered List (Unordered List) dan Numbered List(Ordered List). Mungkin sobat sudah mengetahui mengenai perbedaan antara Unnumbered List dan Numbered List.
   Unnumbered List.
   Contoh syntax dari Unnumbered :
   <UL>
   <LI> Ayo
   <LI> Belajar
   <LI> Bersama
   </UL>
   Hasil nya seperti dibawah :
   
   • Ayo
     
   • Belajar
     
   • Bersama
   Numbered List
   Contoh syntax dari Numbered :
   <OL>
   <LI> Ayo
   <LI> Belajar
   <LI> Bersama
   </OL>
   Hasil nya seperti dibawah :
   
   1. Ayo
      
   2. Belajar
      
   3. Bersama
      
   Untuk <LI> merupakan Elemen list
2. Blockquote
   Digunakan untuk mengatur text dan gambar dalam suatu tag
   Contoh blockquote :
   <blockquote>belajar bersama</blockquote>
   Hasilnya seperti ini :
   

   belajar bersama

   
   
3. Definition List
   Contoh dari definition list :
   <dd>creativoltz</dd>
   Hasilnya seperti berikut :
   
   creativoltz
   
   Definition Term <dt>
   Definition Description <dd>
   
   
4. Ganti Baris/<br>
   Contoh :
   Mari belajar bersama
   <br>Mari belajar bersama
   Hasilnya seperti berikut :
   Mari belajar bersama
   
   Mari belajar bersama
   Contoh tanpa menggunakan <br>
   Mari belajar bersama
   Mari belajar bersama
   Maka hasilnya akan seperti ini :
   Mari belajar bersama Mari belajar bersama
   
   
5. Garis Horizontal
   Contoh :
   <hr>
   <hr>
   Maka hasilnya akan seperti ini :
   

   ---

   ---

   
   
6. Paragraf
   Contoh paragaraf :
   Mari belajar bersama
   <p>mari belajar bersama</p>
   Maka hasilnya akan seperti ini :
   Mari belajar bersama
   

   mari belajar bersama

   perintah ini mirip dengan menggunakan <br>
   
   
7. Alignment
   Beberapa alignment sering kita gunakan sepeti rata tengah (center), kiri (left), kanan (right) maupun rata kiri-kanan (justify)
   Contoh dari rata tengah (center) :
   <center>creativoltz</center> atau
   <div align=center>creativoltz</div> atau
   <div style="text-align: center;">creativoltz</div>
   Maka hasilnya akan seperti ini :
   creativoltz
   
   creativoltz
   creativoltz
   semuanya tetap hasilnya di tengah(center)
   
   Contoh dari rata kiri (left) :
   <div align=left>creativoltz</div> atau
   <div style="text-align: left;">creativoltz</div>
   Maka hasilnya akan seperti ini :
   
   creativoltz
   atau
   
   creativoltz
   
   Contoh dari rata kanan (right) :
   <div align=right>creativoltz</div> atau
   <div style="text-align: right;">creativoltz</div>
   Maka hasilnya akan seperti ini :
   
   creativoltz
   atau
   
   creativoltz
   
   Contoh dari rata kiri dan kanan (justify) :
   <div align= justify>creativoltz</div> atau
   <div style="text-align: justify;">creativoltz</div>
   Maka hasilnya akan seperti ini :
   
   creativoltz
   atau
   
   creativoltz

Mungkin sekian dulu pembahasan yang sangat sederhana dan singkat ini, mudah-mudahan dapat bermanfaat. Mohon maaf atas segala kekurangannya.

Terimakasih
To be continued..

“Hopefully useful”
Wenks@Creativoltz