Home | Follow Me on Twitter | Our Facebook

Cara Termudah Merubah Warna HTML di Blog Menggunakan Adobe Photoshop

Salam blogger...

    Pagi pagi minum coofeemix hangat, sambil ngemil donat wah enak banget sob, Sambil memberanikan diri untuk berbagi tentang HTML, Heehhehee,, saya bukan pakar HTML, banyak teman-teman blogger yang lebih tau tentang HTML, hanya berdasar pengalaman di bidang Grafis hanya ingin berbagi saja.
    Selama ini jika kita akan menambahkan sebuah script dalam blog ada saat-saat tertentu untuk menyesuaikan warna sesuai dengan tempelate kita, dengan tujuan agar sedap di pandang mata, mungkin untuk menentukan sebuah warna HTML di blog, kita menggunakan Panduan warna yang mungkin banyak tersebar pada blog-blog tutorial. Selama ini (Halah baru ngeblog udah berani ngomong lama xixixixixixi) saya mengenal beberapa cara untuk menentukan warna tersebut, Bagi para master yang sudah paham diharap diam hihiiihiiihi, biarkan adik-adik ini belajar hahahaahahah (ampun para master :D) ini contohnya:
    • rgb(226, 230, 233) Apa itu RGB? Setiap warna di blog/website sebenarnya adalah percampuran dari 3 warna yaitu Red, Green, Blue, untuk menentukan warna dengan cara pertama ini sudah tersebar di blog tutorial manapun.
    •  #000000 = HITAM, #FFFFFF = PUTIH, #FF0000 = MERAH dan lain sebagianya









    Tetapi ketika kita mempunyai template dengan warna yang tidak biasa seperti yang saya punya ini, untuk menentukan warna agar sesuai dengan yang lainnya, mungkin akan kesulitan jika melihat tabel warna yang sudah ada, padahal ada tips yang sangat mudah untuk menentukannya.
    Sebagai contoh yang gampang kita akan menentukan warna Judul Postingan saya, ini biasa saya gunakan untuk menentukan warna iklan Google Adsense, atau iklan-iklan yang lain agar sesuai dengan dengan warna font pada template saya.
    Ok langsung ke TKP:
    • Langkah pertama untuk mendapatkan warna adalah buka blog anda, untuk mengambil sampel warna dari font blog anda tekan tombol PrtSc SysRq (Print Screen), biasanya terletak setelah tombol F12 untuk mendapatkan snapshot dari blog kita. Kemudian buka program Photoshop, buat dokumen baru dengan menekan tombol Ctrl+N lalu tekan tombol Ctrl+V (Paste), kemudian akan terlihat hasil seperti di bawah ini:
    mister x
    Kemudian perhatikan panah berwarna merah pada tool photoshop di bawah ini, kerjakan sesuai urutan nomor, pertama kita pilih tool "eyedropper tool" atau tekan tombol I, lalu letakk pada warna yang kita inginkan, kita ambil contoh warna judul dari postingan, setelah itu akan perhatikan panah nomor 3 kita sudah mendapatkan warna sesuai dengan judul, perhatikan gambar di bawah ini:
    html photoshop
    Kemudian untuk mendapatkan kode HTMLnya kita tekan kotak warna pada panah no. 3, akan muncul dialog tool di bawah ini:
    Image and video hosting by TinyPic
    Nah setelah kita menekan tombol kotak panah 3, akan muncul kode warna HTML yang kita inginkan, perhatikan panah 1 dan 2, Panah pertama menunjukkan bahwa warna judul dari blog ini adalah :

    Alternatif 1 : rgb(65, 82, 98)
    Alternatif 2 : #415262

    Bagaimana ?? Gampangkan. Hahahah kok cuma gitu??? ndeso ya .... :D
    Semoga bermanfaat.


    Bookmark and Share

    Related Post:

    8 comments:

    1. Joko Sutarto says:

      Saya juga termasuk yang ndeso alias tak mahir Photoshop, Mas. Tapi cara ini betul sekali. Ini cara termudah untuk melihat warna font dan background blog agar iklan adsense tampak natural menyatu dengan blognya.

      Hem, namun ada sedikit ganjalan buat saya setelah melakukan itu. Mengapa? Saya jadi ingat dengan salah satu buku yang pernah saya baca. Buku antologi liputan mendalam dan memikat yang berjudul "Jurnalisme Sastrawi" yang pernah ditulis oleh Pantau. Dalam sebuah pengantar yang ditulis oleh Andreas Harsono dalam buku tersebut disinggung sekilas katanya jurnalisme di negara kita tidak sebaik di negara Thailand. Apa pasalnya? Karena di media negara kita tidak mengenal apa itu byline serta firewall. Byline adalah penyebutan nama si penulis cerita pada awal suatu laporan jurnalistik dan firewall adalah garis tipis yang dicetak di antara semua iklan dan semua berita sebagai simbol bahwa iklan dan berita tak boleh dibuat samar.

      Nah, pada kasus blog jika iklan dimuat samar dengan artikelnya karena font dan backgroundnya menyatu warnanya, tanpa border, bukankah ini juga mirip dengan apa yang dikatakan Andreas Harsono diatas?

    1. MisterXWebz says:

      Menarik juga uraian dari mas jokostt, hahaha kalau udah masuk etika jurnalistik ga tau deh, Karena sebenarnya ini juga dianjurkan oleh penyedia iklan yang ada.. untuk meningkatkan pendapatan sih katanya ... tapi semuanya kita kembalikan pada diri kita aja .. hehehhe sukses ya mas ..

    1. Rinda says:

      wihiii aq juga pke c sotosop kl soal kode wrn mister ^^

      With Love,

      |
      |
      V

      Miss Rinda - Personal Blog

    1. MisterXWebz says:

      @ Mis Rinda... emang pinter deeh ...

    1. MisterXWebz says:

      @5995705712297134878.0
      test reply ...

    1. MisterXWebz says:

      @2257762328613608415.0
      Test Reply ... mas Jokostt

    1. MisterXWebz says:

      @4311518746485798431.0
      Test Reply level 3

    1. MisterXWebz says:

      @3200772939472248279.0
      Test Reply level 4

    Leave a Reply

    Bro and Sist Tulisan diatas jauh dari sempurna, Hanya Komentar saran dan kritik membangun dari Bro & Sist yang bisa menyempurnakan. Jika anda tidak memiliki blog, gunakanlah Name & Url, Isi dengan Profil Facebook/Twitter, sehingga saya bisa menyapa anda Thanks

    POPULAR POST

    Email Subscriptions

    Enter your email address:

    Delivered by FeedBurner

    Comments




    blogarama - the blog directory blog-indonesia.com Bloggerian Top Hits Blogger Topsites KampungBlog.com - Kumpulan Blog-Blog Indonesia blog search directory Aplikasi java, software komputer, Opera mini, Bolt, Tip dan triks Hobbies Blogs - Blog Rankings The Republic of Indonesian Blogger | Garuda di Dadaku Blog Directory & Search engine Top Show all blogs Free Automatic Backlink Msn bot last visit powered by MyPagerank.Net Google bot last visit powered by Bots Visit Yahoo bot last visit powered by  Bots Visit Find broken links on your website for free with LinkTiger.com Links
    RSSMicro FeedRank Results


    free counters

    Leave The Massage







    Download MP3

    Friends Update List