Tampilkan postingan dengan label Belajar Web Design. Tampilkan semua postingan

Blog Design: Kumpulan Tips Trik Desain Blog

desain blog

BLOG DESIGN berkaitan dengan berbagai bentuk tips trik, hacks serta scipts/codes; baik HTML, CSS, dan Javascript serta beberapa Widgets eksternal lainnya. Desain blog merupakan salah satu inti blogging yg berhubungan dengan bagaimana membuat tampilan blog lebih personal, unik, professional dan sesuai dengan yg diharapkan oleh seorang Blogger. Oleh karena itu, blog design pada akhirnya harus berhubungan dengan pembelajaran coding yg mau tidak mau dan secara lambat ataupun cepat harus dikuasai oleh sang blogger. Kategori serta artikel kumpulan posting blog design ini ditujukan untuk memudahkan sobat Blogger semua dalam mencari posting desain blog yg diinginkan serta dapat menjadi alternatif & pendukung navigasi blog yg lain.
  1. 10 Situs Download Gambar Gratis Buat Blog/Web & Desain
  2. 3 Template Blogger dengan Desain Unik & Canggih
  3. 3 Widget Animated Twitter Follow untuk Blogger/Blogspot, Keren!
  4. 5 Dynamic View: Fitur Terbaru Blogger/Blogspot dan Cara Mengaktifkannya
  5. 5 Situs Terbaik untuk Belajar HTML & CSS Bagi Blogger Pemula - New !!
  6. Blog Design: Kumpulan Tips Trik Desain Blog Buka-Rahasia.Blogspot.Com
  7. Blogger HTML Editor Baru: Edit Template Kini Jauh Lebih Mudah!
  8. Cara -Trik CSS: Membuat Scroll Text Area di Blog/Website dan Style-nya
  9. Cara Buat/Pasang Fitur Emoticon/Smiley di Comment Blogger
  10. Cara Hapus Google Search Image Frame (Frame Breaker)
  11. Cara Membuat & Memasang Disqus Comment di Blogger
  12. Cara Membuat & Memasang Tanda Tangan di Blog
  13. Cara Membuat Auto Read more (Thumbnails) Blogspot V2
  14. Cara Membuat Daftar Isi (Sitemap) di Blogger/Blogspot
  15. Cara Membuat Efek Bayangan Pada Gambar (CSS3 Box Shadow)
  16. Cara Membuat Efek Transparan Pada Gambar Blog (CSS Image Opacity)
  17. Cara Membuat Facebook Comment Box & Like Box Responsif
  18. Cara Membuat Fitur Reply Comment (Balas Komentar) di Blogger
  19. Cara Membuat Fitur/Tombol Back To Top di Blogger-Blogspot
  20. Cara Membuat Kotak Permalink di Bawah Posting Blog
  21. Cara Membuat Kotak Space Banner Iklan Di Blog (Updated)
  22. Cara Membuat List HTML & Menu Sederhana (Basic of Unordered List)
  23. Cara Membuat Menu Horizontal Tabs Sederhana di Blogger
  24. Cara Membuat Menu/Navigasi Breadcrumbs di Blogger/Blogspot
  25. Cara Membuat Recent Posts Blogger (Auto Scroll & Thumbnails)
  26. Cara Membuat Related Post LinkWithin (Thumbnails) dan Trik Lengkapnya
  27. Cara Membuat Screensaver (Energy Saving Mode) Blog/Website
  28. Cara Membuat Super Vertical CSS Menu Blogger/Blogspot
  29. Cara Membuat Tabel HTML via MS Word & Memindahkan ke Posting Blog - New !!
  30. Cara Membuat Widget Twitter Follow Us Melayang di Blogger/Blogspot
  31. Cara Membuat/Memasang Favicon & Animated Favicon di Blog
  32. Cara Membuat/Memasang Tombol Google +1 di Blogger/Blogspot
  33. Cara Memodifikasi Tampilan Link di Blogger/Blogspot
  34. Cara Menambahkan Icon/Gambar di Depan Judul Posting Blogger
  35. Cara Menampilkan Judul Posting Saja Pada Label dan Arsip Blog
  36. Cara Menampilkan Widget Hanya di Homepage/Halaman Posting
  37. Cara Mencari Kode Tertentu di Edit HTML (Template) Blogger
  38. Cara Mengganti "Post a Comment" Blogger Dengan Teks Lain/Gambar
  39. Cara Mengganti Older/Newer Post-Home Blogger dengan Teks/Gambar Icon
  40. Cara Menggunakan/Memasang Custom Font di Blogger
  41. Cara Menghilangkan Underline (Garis Bawah) Link di Blogspot
  42. Cara Mengubah Dynamic View Menjadi Halaman Utama Blogspot
  43. Cara Mengubah Warna Teks Comment di Blogger/Blogspot
  44. Cara Mengubah/Memasang Gambar Background Header di Blogger/Blogspot
  45. Cara Mengubah/Mengganti Jenis Font di Blog Blogger (CSS Styling)
  46. Cara Menyembunyikan Pesan Status di Halaman Label/Search Blogger
  47. Cara Menyembunyikan Sidebar di Halaman Blogger
  48. Cara Modifikasi Tampilan Header Sidebar Blogger
  49. Cara Mudah Membuat Logo Blog Keren! (6 Online Text Logo Generators)
  50. Cara Mudah Membuat Tabel/Table HTML di Posting Blog/Website
  51. Cara Pasang Widget Sharing Is Caring/Sexy di Blogger
  52. Download Gambar Header Blog Gratis Berkualitas Tinggi
  53. Fitur Baru: Blogger Custom Favicon dan Cara Membuat-nya
  54. Letakkan Judul Posting di Depan Nama Blog untuk SEO
  55. Mau Ganti Template Blog? Perhatikan Ulasan dan Tips ini Dulu!
  56. Memberi Warna Berbeda pada Link yang Dikunjungi/Di-klik (Visited Link)
  57. Membuat Tampilan Iklan Google Adsense Responsif (CSS Media Queries)
  58. Membuat Textarea 3D Cantik di Blogger/Blogspot: (Light-Yellow)
  59. Membuat Warna Berbeda Pada Text Selection (Bagian Teks yang di-Blok)
  60. Memperindah Kotak Comment Blogger/Blogspot Dengan CSS
  61. Mengenal Elemen-elemen Wrapper CSS di Blogger/Blogspot
  62. Pasang Blogger Contact Form di Halaman Statis dan Kostumisasi Dasarnya - New !!
  63. Percepat Loading Blog dengan Optimalisasi/Kompres CSS
  64. Tampilan Baru Dashboard Blogger dan Cara Menggunakan-nya
  65. Tips Mengedit Template HTML Blogger/Blogspot: Mudah dan Aman
Continue Reading...

Kumpulan UI Kit iOS 7 Gratis untuk Developer

Telah kita ketahui bahwa Apple berencana mengeluarkan iOS terbaru untuk perangkat iPhone, iPod, dan iPad, untuk versi terbaru ini mereka menyebutnya dengan iOS 7. tampilan User Interface (UI) untuk iOS 7 ini sangat berbeda dengan versi sebelumnya (iOS 6), pada iOS 7 ini tampilan UI lebih Flat dan minimalis.

Artikel Terkait

Bagi UI Designer ataupun App Developer tentu harus menyesuaikan perubahan ini ke dalam aplikasi yang ingin kamu buat, berikut beberapa UI Kit iOS 7 yang bisa kamu download.

Free iOS 7 UI Kit dari MediaLoot

iOS 7 PSD UI KitiOS 7 PSD UI Kit

iOS 7 GUI PSD dari teehanlax

iOS 7 PSD UI KitiOS 7 GUI PSD

iOS 7 UI Kit dari  Sketch Gems

iOS 7 UI KitiOS 7 UI Kit

Tab Bar Icons iOS 7 dari Pixeden

Tab Bar Icons iOS 7Tab Bar Icons iOS 7

Template for iOS 7 App Icons dari  Denis Shoomov

iOS 7 App IconsiOS 7 App Icons
Sekedar kamu ketahui bahwa iOS 7 masih dalam tahap beta dan terus dikembangkan, versi beta hanya bisa diakses oleh para developer iOS App. apakah kamu termasuk salah satu App Developer itu? :)

Tags

kumpulan icon ios 7,kumpulan icon aplikasi,kumpulan icon ios7,kumpulan icon ios,belajar developer ios,kumpulan icon app ios 7,kumpulan icon aplikasi wp,kumpulan icon aplikasi ios 7,kumpulan icon ios7 real,kumpulan ui kit aplikasi ios 7,kumpulan web disgin media online,kumpulan website universitas indonesia,kumpulang website univertitas indonesia,kunpulan website univertitas indonesia,kursus web developer gratis,photoshop shop menu,UI kit,ui kit ios 7,aplikasi black market gratis untuk ios 
Continue Reading...

Pure, CSS Module dari Yahoo!

Baru-baru ini Yahoo! meluncurkan Pure CSS yaitu sebuah CSSModule yang bisa dipakai untuk project website kita, ya seperti Bootstrap lah tapi Pure CSS lebih kecil gak sekomplek Bootstrap, meskipun tidak sekomplek bootstrap tapi keren juga dipakai pada project website kita selanjutnya.

Artikel Terkait

Seperti CSS Framework lainnya, Pure CSS juga menyajikan beberapa elemen seperti Layout yang bisa responsive, Menu, Form, tombol, Grid Base, Tabel.
pure-css-1

Grid

Penggunaan Grid untuk Pure CSS ini sama mudahnya seperti yang lain, hanya beda di classnya saja, untuk membuat sebuah Grid Layout dengan 3 kolom maka bisa menggunakan
<div class="pure-g">
    <div class="pure-u-1-3">
        <!--
        By default, grid units don't have any margin/padding.
        If you want to add these, put them in a child container.
        -->
        <p>Thirds</p>
    </div>

    <div class="pure-u-1-3">
        <p>Thirds</p>
    </div>

    <div class="pure-u-1-3">
        <p>Thirds</p>
    </div>
</div>
Kita bisa menggunakan class pure-g atau pure-g-r bedanya kalau pakai pure-g-r maka ketika browser di resize ke ukuran kecil maka class tersebut akan berpindah ke bawah, kalau pure-g biasa dia akan tetap menjadi 3 kolom.

Button (Tombol)

Untuk membentuk link menjadi tombol cukup tambahkan class pure-button di tag a atau button
<a class="pure-button" href="#">A Pure Button</a>
<button class="pure-button">A Pure Button</button>

Menu

Untuk membuat menu menggunakan Pure CSS ini juga gampang aja, tinggal pakai
<div class="pure-menu pure-menu-open pure-menu-horizontal">
    <ul>
        <li><a href="#">Home</a></li>
        <li class="pure-menu-selected"><a href="#">Blog</a></li>
        <li><a href="#">News</a></li>
        <li><a href="#">Events</a></li>
        <li><a href="#">Contact Us</a></li>
    </ul>
</div>
Nah, untuk melihat contoh elemen lainnya di Pure CSS ini bekerja, silakan kunjungi websitenyahttp://purecss.io/
Bagaimana Pure CSS ini menurut kamu?

Tags

cara menggunakan pure css,contoh css dalam website,belajar web designer membutuhkan waktu,Contoh penggunaan css pada desain web,contoh sederhana pemograman web menggunakan CSS,contoh project html,beberapa contoh website,membuat layout seperti facebook dengan css,membuat content dgn css3,layout website 3 kolom dengan css,membuat layout blog menggunakan pure css,gambar kebawah pakai div,framework html untuk tampilan membuat web,framework bootstrap,format css3 kertas,ekstensi gambar pure adalah?,design pure css yahoo,desain web menggunakn css,website yang menggunakan scc,membuat segitiga kecil dengan css
Continue Reading...
Langganan: Postingan (Atom)