3 Tools Pengujian Desain Responsive Blog atau Website

-

Pada tutorial ini saya akan mengajak Anda untuk melihat 3 tools dari sekian banyak tools pengujian desain responsive. Alat ini sangat membantu web desainer dalam merancang maupun mengembangkan website desain responsive. Dan untuk cara kerja mesin tool yang saya bawa saat ini cara kerja hampir sama dan cukup simple. Yang perlu ada lakukan hanyalah memasukan URL dari website/blog Anda untuk melakukan pengujian. Dan hasilnya akan ditampilakan dalam berbagai platform atau device yang ada. berikut 3 tools pengujian desain responsive :

  1. Responsivetest
pada tools ini hasil resize di tampilkan pada 3 platform umum yaitu Desktop, Tablet dan Phone. cara kerjanya masukan URL website Anda di pojok kanan atas dan tekan Enter dan untuk melihat dalam platform yang beda klik pada ikon dan pilih ukurannya.


tools




   2.   Screenqueri

Di screenqueri platform yang ditampilkan hanya ada 2 yaitu phone dan tablet. Yang membedakannya dari tools lain, kita dapat mengubah ukuran hasil resize selain mengklik pada ikon bisa juga dengan mendrag atau menarik garis titik-titik merah. cara kerjanya, masukan URL pada pojok kanan atas dan klik view dan pilih platform yang ingin kita lihat tampilannya.

tools




     3.  Re-ponsive

Tools yang terkahir ini selain tampilannya yang simple, cara kerjanya juga simple hanya butuh 2 langkah untuk melihat semua hasil tampilan dari platform iphone, ipad dan android. cara kerjanya, masukan URL website Anda di dalam kotak putih setelah http:// dan tekan enter, hasilnya akan ditampilkan semua.

tools



Sekian dari saya tentang 3 Tools Pengujian Desain Responsive, jika Anda tertarik dengan template blogger dengan desain responsive, Anda bisa mengunjungi artikela saya yang lainnya : 10+ Template Blogger Responsive.

Comments

  1. Anonymous9 January 2014 at 06:57

    Kalau saya biasanya menggunakan
    http://ami.responsivedesign.is
    http://responsinator.com

    :)

    ReplyDelete
    Replies
    1. Unknown9 January 2014 at 07:35

      belum pernah coba, kebiasaan ane sih uji dari browser langsung. :D

      Delete
  2. Julka Hendri24 March 2014 at 07:58

    Iya sihm kalau gw mending pakai browser saja, yang penting punya resolusi gede, jadi bisa dicobain semua

    ReplyDelete

Post a Comment

Popular posts from this blog

2 Style Navigasi Nomor Halaman Blogger

-
Image
Halaman Navigasi adalah fitur yang akan memberikan kenyamanan bagi pengunjung blog Anda untuk menjalahi index posting dari blog Anda. Untuk template bawaan dari blogger memang sudah ada tombol Navigasi halaman tapi itu bukanlah yang terbaik. Nah, pada kesempatan ini kita akan mempelajari tutorial tentang membuat Navigasi Nomor Halaman Blogger yang tentunya sudah sering Anda lihat pada blog lain. Artikel Terkait : Menampilkan Hanya Title Posting di Halaman Blogger Membuat Sitemap HTML di Blogger Membuat Halaman Statis Blogger dan Lebih Dari 20 Halaman Cara Membuat Navigasi Nomor pada Halaman Blogger Login ke Dashboard Blogger Anda Klik Template – Edit HTML Sekarang cari kode dibawah ini : ]]></b:skin> Kemudian tambahkan kode dibawah ini tepat diatasnya : .showpageArea a { text-decoration:underline;} .showpageNum a {text-decoration:none; border: 1px solid #cccccc;margin:0 3px; padding:3px;} .showpageNum a:hover { border: 1px solid #cccccc; b...
Read more

Membuat Kontak Blogger Hubungi Kami Menggunakan Google Drive

-
Image
Pada kesempatan ini kita akan membuat halaman Contact Us atau Hubungi Kami di Blogger , form ini merupakan suatu kewajiban yang harus Anda tambahkan ke dalam blog Anda atau website yang mana bertujuan untuk mempermudah komunikasi sama pengunjung blog Anda. Ada banyak cara atau layanan yang dapat membantu Anda dalam membuat form ini tapi disini saya akan menerapkannya menggunakan Google Drive dengan langkah-langkah yang mudah. Google Drive yang akan kita hubungkan ke blog akan langsung terintegrasi dengan email google Anda, sehingga apabila pengunjung blog mengirim suatu pesan maka secara otomatis masuk ke email google Anda yang langsung di arahkan ke Google Drive website atau aplikasi mobile Google Drive . Nah, langsung saja kita terapkan cara dibawah ini. Baca juga...    7 Apps Android Untuk Pengguna Blogger Membuat Halaman Statis Blogger dan Lebih Dari 20 Halaman Cara Membuat Form Hubungi Kami Log in dengan email google Anda di Google Drive Klik Buat dan ...
Read more

Tips SEO Dari Google [Download]

-
Image
Pada saat kita memulai untuk membangun suatu website tentunya akan muncul suatu pertanyaan "Bagaimana cara menginkatkan lalu lintas ke blog atau situs Anda?". Nah, Pada panduan Google ini akan menjelaskan dan mempraktikan cara mengoptimalkan mesin pencarian (SEO) dan interaksi pengunjung ke blog atau situs Anda. Dalam panduan ini juga dilengkapi dengan teknik/praktik yang akan memudahkan mesin telusur dalam merayapi, mengindeks, dan memahami konten Anda. Di bawah ini daftar isi dari Pengoptimalan Mesin Telusur Google (SEO). Baca juga... Menambahkan Sitemap di Google Webmaster Tools Menampilkan Photo di Hasil Pencarian Google Menambahkan Judul dan Atribut di Posting Gambar   Daftar isi : Dasar-dasar SEO Buat judul laman yang unik dan akurat Menggunakan Meta tag "description" Meningkatkan Struktur Situs Tingkatkan struktur URL Anda] Buatlah situs agar lebih mudah untuk dinavigasi   Mengoptimalkan Konten Tawarkan konten dan...
Read more