Sunday, October 22, 2017

Serupa Tapi Tak Sama, pahami Bedanya "div id" dan "div class"

memahami id dan class
Hai sobat ngoding, kamu yang sering bermain-main dengan syntax HTML tentu gak asing lagi dengan kedua tag ini yaitu div id dan div class. Namun gak jarang orang hanya menulis dan sekedar tahu posisi penggunaanya tanpa tahu apa maksudnya.

Nah pada kesempatan kali ini kita akan membahas tentang perbedaan kedua tag itu. Tapi sebelumnya jika kamu ingin belajar mengenai syntax silahkan scoll terus kebawah, namun jika ingin melihat video lucu kami belum menyediakannya :D.

Nah sekarang ayo mulai serius. Yang perlu kamu ketahui adalah bahwa Class dan Id digunakan untuk penanda pada file HTML untuk kemudian dipanggil dan dimanipulasi oleh CSS ataupun Javascript.

Agar lebih paham, kita akan bermain logika. Bayangkan anda memiliki 3 buah kotak dan anda ingin 2 kotak berwarna kuning dan yang ketiga berwarna merah, dan kita akan mengisi value nya dengan sama-sama "kotak" maka syntaxnya adalah sbb :

HTML


CSS


Hasil
Hasil dari syntax diatas jika dieksekusi dengan web browser
Nah dalam pemanggilan id dan class biasanya id ditandai dengan "#" (tagar) sedangkan class ditandai dengan "." (titik).

Jadi jika dilihat dari contoh diatas meskipun value nya sama yaitu "kotak" maka pengeksekusiannya beda, id hanya akan mengeksekusi satu saja sedangkan class untuk beberapa. jadi anda tidak perlu berulang-ulang untuk memanggil perintah yang sama. Mungkin hal ini dikenal di javascript dengan variabel yang dijelaskan seperti DISINI.

Oke sekian dulu penjelasan kali ini, silahkan tinggalkan komentar kamu di kolom komentar.
Read more ...

Saturday, October 21, 2017

Pengertian Dan Penggunaan @keyframes pada CSS.

Mengenal fungsi @keyframes
Mungkin dalam media lain animasi dapat dibuat dalam bentuk video maupun gif. Namun bagaimana jika ingin menampilkannya di website? untuk Membuat Spinner Loading mungkin. Nah kali ini saya akan membahas tentang @keyframes.

Nah @keyframes digunakan untuk menampilkan animasi pada website. Biasanya disematkan didalam syntax CSS yang berada dalam syntax HTML. Jadi jika kamu ingin membuat animasi pada website kamu maka @Keyframes ini lah yang mengatur pergerakan dan jalannya animasi kamu.

@keyframes ini dapat dieksekusi di web browser seperti Mozilla, Chrome dll. Sedangkan pada Opera masih belum optimal dalam pengeksekusiannya.

Adapun penulisan @keyframes adalah sebagai Berikut :

@keyframes nama_animasi{
selector_keyframe {style_css;}
}

Contoh penulisan :
@keyframes spin{
        0% {transform: rotate(0deg);}
        100% {transform: rotate(360deg);}
    }

Keterangan :
spin : Nama animasi sebagai penanda kita.
x%  : Persentasi durasi animasi (0% - 100%)
{...} : Perintah yang ingin di eksekusi.

Untuk mempelajari lebih lanjut mengenai animasi dan @keyframes silahkan  KUNJUNGI DISINI.
Read more ...

Cara Membuat Box/Kotak Di Dalam Postingan Blog.

Cara membuat box didalam postingan
Bagi para blogger khususnya dengan niche bahasa pemograman atau mungkin yang lain yang memerlukan membuat penulisan diblog pasti tentu kebingungan. Sebab Blogger tidak menyediakan menu untuk membuat kotak atau box untuk ditampilkan didalam postingan.

Hal itu tentu harus mengharuskan kita membuat box nya secara manual. Tapi tenang kali ini Ngoding-Nyantai akan memberikan solusi akan hal tersebut.

Silahkan Copy paste kode berikut kedalam postingan anda, Lalu anda dapat mengubah kalimat "ubah adek bang" dengan tulisan yang anda butuhkan.

Model 1.
<p style="border: solid 1px #eceff5; background: #29447E; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: white; font-size: 18px">ubah adek bang</p>

Model 2.
<p style="border: dashed 2px #eceff5; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #1a356e; font-size: 18px">ubah adek bang</p>

Model 3.
<p style="border: solid 1px #333; background: #999; padding: 15px; -moz-border-radius: 15px; -khtml-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; margin: 0; text-align: justify; line-height: 23px; color: black; font-size: 18px">ubah adek bang</p>

Model 4.
<div style="border: 3px #1780dd Double; padding: 10px;background-color:#ffffff;
text-align: left;">ubah adek bang</div>

Model 5.
<div style="background-color: #f3f3f3; padding: 10px; text-align: left;">ubah adek bang</div>

Nah sekarang anda sudah bisa membuat box didalam postingan anda tanpa harus banyak merombak. Jangan lupa share dan tinggalkan komentar anda
Read more ...

Udah Lama Ngeblog Tapi Traffic Dikit? Cek Dulu Deh SEO Blog Kamu Disini.

chkme.com
Sebelumnya teman-teman sudah membaca bagaimana cara agar postingan cepat terindeks Oleh google (Bagi Yang belum silahkan KESINI). Namun mungkin teman-teman masih mendapati traffic atau data pengunjung yang masih rendah.
Banyak faktor yang menyebabkan hal tersebut. Sebaiknya kamu cepat mengetahui hal-hal yang menghambat traffic kamu, baik dari segi data, template dan penulisannya. Hal ini akan kita uji data kamu di Chkme.com, Kamu akan mendapati score dan error-error yang ada pada blog kamu sehingga blog kamu tidak SEO (Search Engine Optimization). Ikuti langkah-langka berikut ini.

1. Masuk ke website chkme.com dengan klik DISINI.

2. Setelah itu copy URL blog kamu dan pastekan (Lihat Gambar).
chkme.com
chkme.com
3. Lalu klik "Check SEO Score".

4. Terakhir kamu akan mendapati score SEO blog kamu serta akan ditunjukkan ulasan mengenai blog kamu.

Saya harap hal ini dapat membantu anda. Sampai jumpa.
Read more ...

Friday, October 20, 2017

Ingin Postingan Cepat Terindeks Google? Lakukan Cara Ini Dengan Rutin.

Google Webmaster Tools
Hallo teman semua. Sebelumnya kita telah membahas mengenai pentingnya webmaster tools. Nah sekarang kita akan membahas mengenai pentingnya tools yang dapat membuat postingan kamu cepat terindeks oleh google. Yaitu dengan menggunakan tools "perayapan".

Banyak para blogger-blogger pemula yang tidak paham mengenai webmaster ini. Mungkin dari segi penggunaan hingga kepentingan. Namun sangat disarankan untuk kamu yang ingin tulisannya terideks oleh mesin pencari google.

Nah mari kita bahas mengenai tools perayapan ini.

Yang pertama silahkan masuk ke webmaster tools menggunakan akun anda. Maka anda akan disuguhkan tampilan seperti berikut ini. Lalu klik properti yang akan anda lakukan penganalisaan.


Setelah itu anda akan disuguhkan tampilan seperti berikut ini. Setelah itu klik "perayapan" lalu klik "Ambil sebagai Google" seperti contoh berikut.



Setelah berada dihalaman ini silahkan isi url postingan anda lalu klik "Ambil" atau "Ambil dan Render" lalu klik "Minta Pengindeksan".



Maksud dari kedua tombol tersebut adalah :
Ambil : Robot google hanya akan mencari data dan mengambil data dari url anda.
Ambil dan Render : Jika render maka google merayapi url anda dan memberikan data tentang kesalahan dan pelanggaran dari url anda dari semua sisi.

Setelah menentukan pilihan lalu anda akan mendapati kotak seperti ini. Centang "saya bukan robot" lalu klik "Rayapi URL ini saja" atau "Rayapi URL ini dan tautannya langsung"



Maksud dari kedua pilihan itu adalah :
Rayapi URL ini saja : Robot google hanya akan merayapi url anda saja dan anda akan diberikan kuota 500 kali perayapan dalam 1 bulan.

Rayapi URL ini dan tautannya langsung : Robot google akan merayapi url anda sekaligus url yang termuat didalam url tersebut dan anda hanya diberikan kuota 10 kali perayapan dalam sebulan.

Nah saran saya lakukan hal tersebut setiap kali anda melakukan postingan agar postingan anda terindeks oleh mesin pencarian google. Jika ada pertanyaan silahkan tulis dikolom komentar. Semoga keberuntungan berpihak pada anda.
Read more ...

Thursday, October 19, 2017

7 Menit Bisa..! Belajar Membuat Fungsi Sederhana Dengan Javascript.

banner
© NgodingNyantai.youtube
Hallo sobat ngoding. Kalian udah pasti tahu dong ya tentang javascript. Ya jika kalian ingin menjadi web design handal kalian wajib menguasai salah satu bahasa pemograman ini. Karena selain membuat tampilan lebih dinamis, pengunjung juga akan mampu berinteraksi langsung dengan website atau blog kalian (Baca : Bahasa Pemograman Yang Wajib Diketahui).

Javascript ini tergolong bahasa pemograman yang tingkat memahaminya tidak terlalu sulit, jika kalian mau belajar. Javascript dibuat dan disematkan dalam file HTML dan untuk penulisannya menggunakan tag <script>...</script>. Java script juga mampu membaca perintah yang dapat dipanggil berkali-kali namun penulisannya hanya sekali yaitu dengan variabel.

Nah di video ini akan dibahas tentang membuat penjumlahan sederhana dengan menggunakan Javascript.


Divideo tersebut telah dijelaskan tentang bagaimana menggunakan Javascript dalam tahap dasar. Semoga bermanfaat.
Read more ...

Pentingkah Google Web Master Untuk Para Blogger?

google webmaster
© Google Web Master
Sudah tidak dipungkiri lagi bahwa harapan terbesar para penulis ialah tulisannya terkenal dan diminati banyak orang. Termasuk juga penulis yang bergelut didunia maya seperti blogger misalnya. Selain itu harapan lebih menjanjikan dengan semakin terkenalnya blog atau web kita maka kesempatan untuk meraih pendapatan pun akan semakin dekat didepan mata.

Namun kali ini saya tidak akan membahas dulu tentang masalah pendapatan. Yang ingin saya sampaikan adalah mengenai caranya dulu untuk menjadi berkualitas dan tentunya dikenal banyak orang.

Kita tahu bahwa penggelut dunia maya sudah menganggap Google sebagai sandaran mereka. Bagaimana tidak, raksasa internet tersebut banyak sekali menyediakan layanan dan aplikasi yang bebas kita gunakan. Salah satunya ialah Webmaster. Sebagai blogger yang serius anda juga harus serius dalam mengontrol web atau blog anda. Dan webmaster adalah salah satu alasannya.

Dan berikut adalah langkah-langkah untuk mendaftarkan situs anda di web master :

  • Kunjungi situs web master DISINI.
  • Anda akan ditampilkan ke halaman webmaster, maka anda akan mendapati halaman awal webmaster lalu klik Search Console.
  • Silahkan masukkan alamat URL blog anda (Penting : jangan diketik tapi di copy dari url bar google).
  • Klik "Tambahkan Properti"
  • setelah itu proses pendaftaran selesai.

Setelah itu lakukan verifikasi dengan cara berikut :
  • Anda akan dibawa ke laman verifikasi namun jika tidak silahkan klik logo gear di pojok kanan lalu pilih "Detail Vefication"
  • Setelah itu klik "Verifikasi dengan metode lain"
  • Lalu pilih HTML tag.
  • Copy tag nya lalu pastekan di blog anda. caranya :
    • Masuk ke akun blog anda.
    • klik tema lalu pilih edit html.
    • lalu cari kode <head> dan pastekan kodenya dibawahnya.
    • Simpan dan tunggu beberapa saat.
metode alternatif
Laman metode alternatif
  • Setelah selesai maka kembali ke webmaster dan klik verify.
berhasil
berhasil
  • Whola... anda sudah terverifikasi sebagai pemilik web atau blogger yang anda daftarkan.
Lalu apa pentingnya webmaster tool? Sekarang coba saya tanya, kalau kamu menanam sawit dan menunggu buahnya untuk dijual apakah kamu tidak merawat, menecheck dan menngatasi masalahnya seperti hama dll. Blogger juga begitu. nah dengan web master anda akan mendapatkan analisa mengenai pengunjung blog anda, memonitoring perkembangan blog anda, mengetahui jika ada pelanggaran-pelanggaran yang dilakukan hingga yang paling utama jika beruntung tulisan anda akan mendapatkan tempat di page 1 halaman google ketika disearch.

Robot google juga akan sering merayap ke situs anda. Itulah yang menjadikan situs anda lebih gampang terindex. Untuk mengenai Toolsnya akan kita bahas selanjutnya.

Terimakasih dan jangan lupa bagikan artikel ini jika menurut anda bermanfaat.
Read more ...