Monday, 13 January 2014

Tips SEO Dari Google [Download]

, ,
pengoptimalan-mesin-telusur-google

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...


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 layanan yang berkualitas
    • Tulis teks tautan yang lebih baik
    • Opimalkan penggunaan gambar Anda
    • Menggunakan tag heading sewajarnya
  • Menangani Perayap
    • Menggunakan robot.txt dengan efektif
    • Hati-hati saat menggunakan tautan rel="nofollow"
  • SEO untuk Telepon Seluler
    • Beri tahu Google tentang situs seluler
    • Pandu pengguna seluler dengan akurat
  • Promosi dan Analisis
    • Promosikan situs web Anda dengan cara yang benar
    • Manfaatkan alat webmster gratis

Saturday, 11 January 2014

5 Aplikasi Kamera Android Terbaik 2014

, ,


download-camera-android-terbaik-2014

Camera pada perangkat Android kini hadir dengan berbagai variasi dari yang luar biasa sampai yang extreame, tergantung dari model handphone dan versi Android yang Anda gunakan. Nah, dibawah ini merupakan Camera Android yang populer dan terbaik dikalangannya yang akan membantu Anda mengambil dan mengedit photo sehingga mengahasilkan gambar yang lebih baik. Berikut 5 Camera Android terbaik :


Download Camera Zoom FX 

download-camera-zoom-fx-versi-.5.0.5

Camera ZOOM FX menempatkan posisinya sebagai aplikasi camera favorit untuk Android yang wajib buat Anda coba. Aplikasi ini dikemas untuk membantu Anda menghasilkan gambar yang lebih baik, mulai dari tahap pengambilan dengan modus suara, tap untuk focus, tap untuk mengambil photo, grid overlay yang akan membantu untuk menjaga ratio dari gambar, dll. Selain itu dilengkapi juga dengan tambahan effect untuk mengedit hasil jeperetan photo Anda. 



Download Snapseed


download-snapseed

Snapseed adalah aplikasi photo favorit dan mudah untuk digunakan yang sering saya pakai dan ini gratis, aplikasi ini bukan hanya sekedar mengatur filter dan efek sebuah photo tetapi juga memberikan kita control untuk apa yang akan kita ubah dan juga fitur automatic yang akan membantu Anda menghasil gambar yang tajam dan lebih baik. Selain itu fitur selective adjust memungkinkan Anda untuk men-tweak atau memberi filter pada bagian terntentu sehingga memberi suasana yang berbeda dari sebelumnya. Dan masih banyak lagi fitur yang akan membantu Anda menghasilkan gambar yang lebih baik. 

Download via : Google Play - Snapseed 


Donwload Pixlr Express


download-pixlr-express-photo-editor-android


Pixlr Express adalah salah satu alternatif favorit seperti photoshop, yang cukup mudah untuk Anda gunakan. Seperti aplikasi camera diatas pada pixlr express mendukung Anda untuk melakukan pengeditan dasar seperti (crop, mengubah ukuran, memutar, dll). Fitur yang disediakan juga cukup memadai untuk seperti Adjustment (crop, rotate, blur, sharpen, smooth, dll ), effect (vintage, creative, soft, dll), teks dan juga dilengkapi dengan overlay untuk memberi effect layer baru pada gambar.



Download Photo Editor by Aviary

Download-photo-editor-by-aviary

Photo Editor by Aviary adalah aplikasi yang akan membantu dalam malakukan pengeditan gambar dengan cepat dan mudah tanpa merusak kualitas dari gmabar asli. Dengan aplikasi ini memungkinkan Anda dengan mudah mengatur suhu warna, menghilanghkan blur, menyesuaikan kecerahan dan kontras, memotong dan mumutar gambar Anda.



Download Camera FV-5


Download-Camera-F-5

Jika Anda kurang menyukai aplikasi Camera ZOOM FX dan menginginkan pilhan lain, coba dengan Camera FV-5. Aplikasi ini hadir dengan fitur yang hampir sama tapi memberikan Anda kontrol atas elemen photo yang spesifik dan kontrol camera seperti waktu exposure, aperature, pengaturan cahaya, white balance dan banyak lagi. 




5 aplikasi camera diatas adalah beberapa yang terfavorit dan terbaik dianatara pengguna Android yang tentunya memiliki kelebihan dan kekurang masing-masing. Namun, hal tersebut tidak tidak memungkinkan Anda untuk menghasilkan gambar yang baik dan dengan teknik menggabungkan fitur-fitur dari masing-masing aplikasi tentunya akan menghasilkan gambar dengan kualitas yang lebih baik.



Tuesday, 7 January 2014

21 Style Efek Link Download dan Demo Keren

,
membuat-style-keren-link-download-dan-demo-blog-website





Posting hari ini kita akan membuat Link Style untuk Blog atau Website yang nantinya bisa Anda terapkan sebagai tombol navigasi serperti,tombol download, demo, maupun menu navigasi. Teknik ini menggunakan  pseudo-elements dengan memasukan element tambahan :before dan :after dan selanjutnya diberi efek animation dan efek transisi sehinga menciptkan style link yang fresh dan modern. 

Tahap Persiapan :

Download file yang ada pada link diatas, file tersebut berisi html, css style dan file javascript yang akan ditambahkan di blog Anda.


Tahap Pertama :

Buka file component.css yang telah di download dan masuk ke HTML editor Template Blog, kemudian copy dan salin tag element nav sebelum  tag ]]></b:skin>, seperti berikut :

nav a {
 position: relative;
 display: inline-block;
 margin: 15px 25px;
 outline: none;
 color: #fff;
 text-decoration: none;
 text-transform: uppercase;
 letter-spacing: 1px;
 font-weight: 400;
 text-shadow: 0 0 1px rgba(255,255,255,0.3);
 font-size: 1.35em;
}

nav a:hover,
nav a:focus {
 outline: none;
}

Selanjutnya pilih link style yang akan digunakan dan tambahkan sebelum tag  ]]></b:skin> seperti cara diatas. Disini penulis menggunakan contoh link efek  cl-effect-2, seperti berikut :


/* Effect 2: 3D rolling links, idea from http://hakim.se/thoughts/rolling-links */
.cl-effect-2 a {
 line-height: 44px;
 -webkit-perspective: 1000px;
 -moz-perspective: 1000px;
 perspective: 1000px;
}

.cl-effect-2 a span {
 position: relative;
 display: inline-block;
 padding: 0 14px;
 background: #2195de;
 -webkit-transition: -webkit-transform 0.3s;
 -moz-transition: -moz-transform 0.3s;
 transition: transform 0.3s;
 -webkit-transform-origin: 50% 0;
 -moz-transform-origin: 50% 0;
 transform-origin: 50% 0;
 -webkit-transform-style: preserve-3d;
 -moz-transform-style: preserve-3d;
 transform-style: preserve-3d;
}

.csstransforms3d .cl-effect-2 a span::before {
 position: absolute;
 top: 100%;
 left: 0;
 width: 100%;
 height: 100%;
 background: #0965a0;
 content: attr(data-hover);
 -webkit-transition: background 0.3s;
 -moz-transition: background 0.3s;
 transition: background 0.3s;
 -webkit-transform: rotateX(-90deg);
 -moz-transform: rotateX(-90deg);
 transform: rotateX(-90deg);
 -webkit-transform-origin: 50% 0;
 -moz-transform-origin: 50% 0;
 transform-origin: 50% 0;
}

.cl-effect-2 a:hover span,
.cl-effect-2 a:focus span {
 -webkit-transform: rotateX(90deg) translateY(-22px);
 -moz-transform: rotateX(90deg) translateY(-22px);
 transform: rotateX(90deg) translateY(-22px);
}

.csstransforms3d .cl-effect-2 a:hover span::before,
.csstransforms3d .cl-effect-2 a:focus span::before {
 background: #28a2ee; 
}

Pada link css diatas menggunakan element hover transtition ditambahkan dengan element transform sehingga memberi efek 3D. Langkah berikutnya menambahkan fungsi javascript dibawah tepat diatas tag </head>, seperti berikut :

<script src="https://dl.dropboxusercontent.com/s/h1iozk0zvkpi8tm/modernizr.custom.js"></script>


Catatan, file javascript yang di download telah di hosting seperti diatas untuk menghemat ruang editor blog Anda.


Tahap Kedua :

Setelah memastikan tahap diatas telah benar waktunya untuk menambahkan Style Link ke posting, pada tahap ini buat lah posting baru untuk menguji link. So, setiap kali Anda membuat posting yang membutuhkan tombol link download dan demo gunakan tag HTML pada file index.html. Penulis menggunakan tag HTML untuk class cl-effect-2 untuk menindaklanjuti langkah sebelumnya :

<nav class="cl-effect-2">
 <a href="#"><span data-hover="Demo">Demo</span></a>
 <a href="#"><span data-hover="Download">Download</span></a>
</nav>


Catatan :
Untuk effect transform 3d tidak bisa berjalan di IE10 dan nama element .nav bisa Anda ganti dengan nama yang lain bila di style template Anda telah ada element dengan nama tersebut.

Akhir kata semoga koleksi dari Codrops ini memberikan inspirasi baru buat kita semua, dan jika Anda menyukai posting kali ini please klik like and share.


Sunday, 5 January 2014

Timely Alarm Clock - Bitspin Sekarang Gratis Setelah di Beli Google

,
aplikasi-android-jam-alarm-keren


Berita baru datang dari Bitspin bahwa telah bergabung dengan Google namun berita ini belum lah jelas apakah Google membeli perusahaan tersebut atau hanya menyewa tim pengembangnya. Bitspin merupakan Tim pengembang aplikasi jam alarm dengan desain visual yang menakjubkan dan mungkin karena alasan itulah google menyukainya.

Aplikasi ini sebelumnya tidak lah gratis namun setelah keluar berita tersebut sekarang bisa di download secara free melalui Play Store, dan telah di download lebih dari 1 juta pengguna dan memiliki 4.4 bintang dari 5 bintang. Saat mennggunakan aplikasi ini, Anda akan dibawa pada pengalaman yang berbeda, seperti :

  • Mengola Alarm dengan cara yang unik.
  • Mengubah pengalaman bangun Anda menjadi lebih menarik dengan sebuah tantangan saat mematikan Alarm.
  • Pilihan warna tema yang fresh dan bisa diatur sesuai dengan warna pilihanmu
  • Mengghubungkan perangkat Anda sehingga memungkinkan untuk mengola, mengabaikan dan mengatur semua perangkat sekaligus
  • Fitur pendukung seperti penghitung mundur dan Stopwatch dengan tampilan visual yang menakjubkan 
aplikasi-jam-alarm-terbaik-google

Bila Anda tertarik untuk menggunaknya langsung saja download dari Play Store atau klik disini Timely Alarm Clock. [info via: Android Police ]


Monday, 30 December 2013

Membuat Kontak Blogger Hubungi Kami Menggunakan Google Drive

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...  

Cara Membuat Form Hubungi Kami

  • Log in dengan email google Anda di Google Drive
  • Klik Buat dan pilih formulir, seperti berikut :
membuat-form-hubungi-kami-blogger

  • Selanjutnya Anda akan diarahkan di tab baru untuk mengisi title dan memilih theme form yang akan digunakan setelah selesai klik oke.
membuat-form-hubungi-kami-blogger



  • Pada tahap ini kita akan membuat isi dari form kontak seperti nama, email, subjek pesan dan isi pesan dan untuk menambahkan form baru klik tambahkan item.
membuat-kontak-hubungi-kami-blogger


  • Nah, Untuk menambahkan subjek baru (email, subjek pesan dan isi pesan) gunakan teknik yang sama seperti diatas dan untuk isi pesan beri uncheck pada pertanyaan wajib.
  • Setelah menyelesaikan langkah diatas klik pada Kirim Formulir dan pilih sematkan. Copy dan simpan HTML yang ada di dalam box yang nanti akan ditambahkan di blog Anda.
membuat-kontak-hubungi-kami-blogger
  • Sampai disini form kontak telah berhasil dan kita akan melakukan sedikit pengaturan. Pada menu bar klik Pilih Tujuan Tanggapan
membuat-kontak-hubungi-kami-blogger

  • akan muncul popup dan atur seperti dibawah ini.
membuat-kontak-hubungi-kami-blogger


  • Masih dihalaman yang sama klik Lihat tanggapan 
membuat-kontak-hubungi-kami-blogger

  • Anda akan di arahkan ke halaman formulir dan klik alat pada menu bar, pilih Aturan pemberitahuan dan atur seperti dibawah ini.
membuat-kontak-hubungi-kami-blogger

  • Sampai disini Kontak Form siap ditambahkan di blog Anda. Next menambahkan Form Hubungi Kami di blog.

Membuat Halaman Statis Untuk Form Kontak

  • Masuk ke dasboard blogger Anda
  • Klik Laman - Laman baru dan pilih Laman kosong
  • Beri title Hubungi kami pada halaman dan pilih HTML dan salin HTML frame yang Anda simpan tadi.
  • Klik Publiksikan dan Selesai

Turorial ini dibuat untuk menbantu pengunjung blogger Anda untuk melakukan komunikasi dengan menyediakan kontak form Hubungi Kami di blog Anda. Semoga artikel yang ringan ini bermanfaat dan jika Anda menyukainya posting ini please di share dan tinggalkan komentar Anda bila berhasil menambahkannya. 


Monday, 16 December 2013

2 Style Navigasi Nomor Halaman Blogger

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.
navigasi-blogger


Artikel Terkait :


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; background-color:#cccccc;}
.showpagePoint {color:#333; text-decoration:none; border: 1px solid #cccccc; background: #cccccc; margin:0 3px; padding:3px;}
.showpageOf { text-decoration:none; padding:3px; margin: 0 3px 0 0; }
.showpage a { text-decoration:none; border: 1px solid #cccccc; padding:3px; }
.showpage a:hover { text-decoration:none;}
.showpageNum a:link,.showpage a:link { text-decoration:none; color:#333333;}


  • Script diatas bisa Anda gunakan untuk mengedit dari style Navigasi. Selanjutnya cari tag :
</body>

  • Kemudian tambahkan script dibawah ini tepat diatasnya :
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Prev&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='https://dl.dropboxusercontent.com/s/xem1puohuldjpms/blogger_pagenavi_min.js' type='text/javascript'/>


  • Langkah terakhir klik – Simpan template

Untuk menggunakan Navigasi style ke-2 caranya sama seperti diatas, cukup Anda menggantikan css style dan javascript diatas dengan script berikut :
Css Style Navigasi ke-2 :
.showpageNum a, .showpage a {  text-decoration: none;  margin: 0 0 0 1px;  padding: 7px 11px;  background: #333;  color: #fff;  }
.showpageOf {  display:none;  }
.showpageNum a:hover, .showpage a:hover {  background: #41B7D8;  color: #fff;  text-decoration: none;  }
.showpagePoint {  color:#fff;  padding: 7px 11px;  background: #41B7D8;  text-decoration: none;  }


Javascript Navigasi ke-2 :
<!--Navigasi Nomor Starts-->
<script type='text/javascript'>
    var postperpage=5;
    var numshowpage=2;
    var upPageWord = &#39;Prev&#39;;
    var downPageWord = &#39;Next&#39;;
    var urlactivepage=location.href;
    var home_page=&quot;/&quot;;
</script>
<script src='https://dl.dropboxusercontent.com/s/gzu15cdm6njxqba/btnt-pagenav.js' type='text/javascript'/>

<!--Page Navigation Ends -->


Keterangan :
Kode ini menentukan jumlah posting yang akan ditampilkan per halaman.
var pageCount=5;
dan
var postperpage=5;
Kode ini menentukan jumlah nomor navigasi halaman tambahan yang akan ditampilkan pada halaman.
var displayPageNum=5;
dan
var numshowpage=2;
Kedua baris menentukan teks yang akan ditampilkan untuk halaman sebelumnya dan halaman berikutnya.
var upPageWord =&#39;Prev
var donwPageword =&#39;Next


Finaly, dengan menyelesaikan langkah diatas Anda telah berhasil menambahkan Navigasi Nomor pada halaman Blogger. Dan bila Anda menemukan kesulitan dengan tutorial diatas jangan malu untuk meninggalkan komentar Anda. Akhir kata semoga artikel ini bermanfaat buat Anda dan salam satu-delapan !