Lompat ke konten Lompat ke sidebar Lompat ke footer

Cara Membuat Halaman Kode Warna pada Blog

Di dalam blog, biasanya terdapat Web Tools yang sangat berguna bagi pengunjung, salah satu Web Tools yang populer dan sering kita temukan di blog orang lain adalah Halaman Kode Warna. Berbicara mengenai kode warna, tentu yang terlintas di pikiran kalian tidak jauh dari kata desain.  Entah itu desain grafis, desain web, atau apapun itu yang membutuhkan kode warna.


Thumbnail Gambar Artikel

Seberapa Pentingnya Kode Warna itu?

Kode warna sangat penting jika kita ingin mendesain web, mengapa perlu menggunakan kode warna? Bukankah saat kita mendesain web hanya perlu menuliskan nama warnanya dalam bahasa Inggris? Bukankah itu sudah cukup?

Jawabannya adalah kode warna memang sangat sangat diperlukan dalam hal mendesain web, dan perlu diketahui bahwa ketika kita menuliskan nama warna di bagian style html, maka warna yang akan dihasilkan hanyalah warna umum.

Misalnya kita menulis kode :

<p style="color:red"><b>Warna Merah tanpa Kode Warna</b></p>

tentu warna yang dihasilkan akan seperti ini :

Warna Merah tanpa Kode Warna

Hal ini menunjukkan bahwa dengan hanya menuliskan kode warna dalam bahasa Inggris saja itu belum cukup. Karena kita tidak hanya membutuhkan warna merah yang standart, tentu saja kita akan membutuhkan warna merah yang agak soft atau warna merah yang agak strong.

Lalu bagaimana kita bisa mendapatkan warna yang beranekaragam untuk memenuhi kebutuhan kita? Nah, jawaban yang tepat untuk mejawab pertanyaan di atas adalah Kode Warna.

Dengan kode warna, kita bisa memilih warna dengan tingkat kecerahan yang sesuka hati, sehingga akan memudahkan kalian untuk mendesain web, misalnya.

Perlu juga kita ketahui bahwa kode warna ada bermacam-macam, tidak hanya satu jenis saja.
Jenis-jenis kode warna antara lain :
1. Warna RGB
2. Warna RGBA
3. Warna HSL
4. Warna HSLA
5. Warna HEX atau Hexadecimal
6. Warna berdasarkan nama (dalam bahasa Inggris, seperti yang saya sebutkan di atas)

Pada halaman yang akan kalian buat melalui tutorial saya ini, hanya akan menampilkan kode warna berupa HSL, RGB, dan juga Hexadecimal saja. Namun, keiga kode warna ini sudah lebih dari cukup untuk kita gunakan dalam mendesain. Biasanya di saat kalian hendak mendesain web, maka kode warna yang dibutuhkan adalah Kode Warna HEX. Jadi, tidak perlu khawatir jika halaman kode warna yang kita buat nanti kurang lengkap, karena tiga jenis itu saja sudah cukup.

Akan saya berikan dua model Kode Warna, yang satu aan menampilkan kode warna HSL, RGB, dan HEX. Sedangkan model yang kedua akan menampilkan kode warna berupa HEX saja, namun memberikan 4 warna saran yang dapat menjadi pertimbangan saat kalian mendesain nanti.

Biar ga semakin penasaran, sekarang saatnya kita mulai untuk membuat halaman kode warna pada blog. Langkah-langkahnya sangat mudah, silahkan kalian ikuti langkah-langkah di bawah ini :
  1. Pertama, silahkan kalian masuk ke dalam akun blog kalian
  2. Lalu, pilih Halaman dan buatlah Halaman Baru
  3. Setelah masuk ke Halaman Baru, silahkan kalian pilih HTML di bagian pojok kiri atas
  4. Terakhir, masukkan kode berikut
    Source code Model ke-01 :
    <object border="0" classid="clsid:D27CDB6E-AE6D-11CF-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" height="480" id="obj1" width="480"><param value="http://www.2createawebsite.com/build/color.swf" name="movie"><param value="High" name="quality"><embed pluginspage="http://www.macromedia.com/go/getflashplayer" quality="High" src="http://www.2createawebsite.com/build/color.swf" name="obj1" type="application/x-shockwave-flash" width="485" height="485"></embed></object>
    Source code Model ke-02 :
    <object align="middle" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" height="480" id="col" width="480"><param value="sameDomain" name="allowScriptAccess"><param value="http://www.2createawebsite.com/build/col.swf" name="movie"><param value="high" name="quality"><br /><param value="#ffffff" name="bgcolor"><embed pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" src="http://www.2createawebsite.com/build/col.swf" bgcolor="#ffffff" name="col" width="480" align="middle" height="480"></embed></object>
  5. Jangan lupa untuk memberi judul pada Halaman Baru yang telah kalian buat, ex : Kode Warna, atau terserah sesuai dengan kebutuhan kalian.
  6. Terakhir, klik Publikasikan
Setelah mempublikasikan, jangan lupa pasang Halaman ke Navigasi Blog kalian, agar dapat diakses oleh pengunjung!
Halaman Kode Warna tidak akan bisa dibuka, jika kalian tidak mengaktifkan Adobe Flash Player pada Browser yang sedang digunakan

Sampai sini pembahasan mengenai Cara Membuat Halaman Kode Warna pada Blog, silahkan berkomentar jika ada masukan.

Semoga jelas dan bermanfaat, sampai jumpa..