Optimalisasi Fungsi Peramban dalam Blogging

Peramban merupakan perangkat lunak yang berfungsi menampilkan & melakukan interaksi dengan dokumen-dokumen yang disediakan oleh server web. Jenisnya pun bermacam-macam, antara lain Internet Explorer (IE), Firefox, Chrome, Opera dan lain-lain. Di antara beberapa peramban yang telah disebutkan tersebut, mungkin dapat kita kerucutkan menjadi dua yang paling sering digunakan, yakni Firefox & Chrome. Nah, posting ini akan sedikit menjelaskan tentang optimalisasi fungsi peramban melalui “Inspect Elements’ dan sejumlah ekstensi (add-ons) yang perlu diunduh untuk menunjang aktivitas blogging.

Inspect Elements

Fungsi ini dapat kita manfaatkan, ketika melakukan klik kanan pada sebuah halaman web agar mengetahui struktur pengkodean, namun jangan disalahgunakan untuk meniru secara menyeluruh format template. Oleh karena sebuah desain situs web atau blog mempunyai hak cipta bagi perancangnya, mungkin sebuah pengecualian jika kita meletakkan taut situs perancang & meminta izin, apakah kita boleh menggunakan desain tersebut.

Kembali pada fungsi “Inspect Elements”, ketika diklik akan muncul — di bagian bawah peramban — tab yang biasanya memiliki dua kolom, sebelah kiri adalah HTML (HyperText Markup Language) dan kanan adalah CSS (Cascading Style Sheets). Meskipun ia mampu menampilkan lebih dari sekedar HTML dan CSS, apabila ditelusuri lebih mendalam.

Bagi Anda yang suka utak-atik template, “Inspect Elements” sangat berguna untuk mengatur — menambah, mengurangi, atau memperbaiki pengkodean — tampilan sebuah situs web atau blog melalui CSS (sebelah kanan). Kemudian kode itu kita salin dan tempel pada “Notepad” atau perangkat lunak teks editor kesayangan Anda. Seiring dengan perubahan pengkodean, maka tampilan situs web atau blog pada layar peramban akan berubah pula sesuai dengan kustomisasi kode. Syaratnya halaman yang diperiksa dan dikustomisasi tersebut tidak direfresh.

Fungsi “Inspect Element” pada peramban Firefox.

Fungsi “Inspect Element” pada peramban Chrome.

Catatan: Untuk memeriksa elemen tertentu, Anda dapat memanfaatkan “Select elements” (dilingkari dengan warna merah), kemudian pilih elemen dengan melakukan klik kiri pada tetikus.

Ekstensi (add-ons)

Firebug — untuk mengetahui struktur pengkodean suatu situs web atau blog, jika Anda terbiasa untuk menggunakannya dibanding dengan default pada tiap-tiap peramban (Firefox dan Chrome).

Color Tools — untuk mengetahui pewarnaan yang ditampilkan pada layar peramban, kebanyakkan pengguna menggunakan ekstensi “ColorZilla” (Firefox dan Chrome). Namun untuk firefox, saya lebih memilih “Rainbow Color Tools”.

Font Style — untuk mengetahui pengaturan font & line-height, sehingga diharapkan mampu menjaga irama vertikal suatu teks, walaupun ditampilkan dalam ukuran yang berbeda (Firefox dan Chrome).

Screen Capture — untuk mengambil gambar (screenshot) pada suatu halaman yang ditampilkan oleh peramban dengan ekstensi “Awesome Screenshot” (Firefox dan Chrome). Namun pada Chrome, saya lebih memilih ekstensi “Screen Capture”.

HTML5 Outliner — untuk mengetahui struktur garis bentuk HTML5 pada suatu situs web atau blog yang biasanya diperlihatkan oleh baris judul pada masing-masing elemen (Firefox dan Chrome).

HTML Microdata — untuk mengecek struktur microdata yang terdapat dalam suatu situs web atau blog. Sementara saya hanya menggunakan “Semantic Inspector” khusus pada Chrome.

Users Online — ekstensi ini dapat digunakan setelah terlebih dulu memasang script dari http://whos.amung.us, kemudian masukkan 8 – 12 karakter sitekey sesuai kode script yang dipasang dalam situs web atau blog. Umumnya penggunaan ekstensi ini adalah pada script whos.amung.us yang disembunyikan atau tidak menampilkan widget status online (Firefox dan Chrome).

Web Developer — untuk menambah sekumpulan alat yang dapat dimanfaatkan sebagai analisis rinci pada situs web atau blog. Biasanya saya menggunakannya untuk men-disable all style dalam CSS (Firefox dan Chrome).

Fungsi & ekstensi (add-ons) yang telah disebutkan di atas, hanya sebagian kecil yang mungkin dapat digunakan dalam aktivitas blogging. Tinggal sejauh mana upaya kita agar penggunaannya dapat optimal, terutama bagi peramban kesayangan. Hal ini diharapkan agar blogging bukan hanya dipandang sebuah aktivitas menulis atau menerbitkan posting semata, namun akan lebih memiliki nilai jika kita mampu belajar memahami & menyelami markah yang terkandung didalamnya. Expert? Tidak juga.

Description: Optimalisasi Fungsi Peramban dalam Blogging Rating: 5.0 Reviewer: Unknown ItemReviewed: Optimalisasi Fungsi Peramban dalam Blogging

Judul dan Deskripsi dalam Blog

Kita pasti sering menggunakan mesin penelusur untuk mencari sesuatu yang dibutuhkan. Khusus untuk informasi posting, biasanya hasil pencarian akan menunjukkan judul, URL (Uniform Resource Locator), dan deskripsi. Opsional, jika kata kunci yang diketik oleh pengguna mempunyai kesesuaian yang sangat nyata dengan judul & deskripsi blog serta posting didalamnya, maka pada baris bagian bawah akan muncul rekomendasi beberapa tautan yang mengarah pada alamat blog tersebut atau lebih dikenal dengan sebutan sitelink.

Dari paragraf di atas, judul & deskripsi dalam blog merupakan unsur dasar dalam SEO yang meliputi dua elemen penting, yakni blog dan halaman blog. Setiap Judul haruslah unik dan akurat. Unik karena format struktur yang tidak mempunyai persamaan identik dengan judul lain dan akurat karena menggambarkan isi konten atau posting dalam sebuah blog. Sedangkan deskripsi merupakan ringkasan yang dapat didefinisikan untuk setiap halaman, mungkin berisi satu atau dua kalimat atau paragraf pendek.

Judul

Judul akan ditampilkan dalam hasil pencarian & ketika membuka halaman pada hasil penelusuran, maka judul akan tampil pada tab peramban. Begitu pula ketika pengguna mengetikkan kata kunci lebih spesifik, maka hasil pencarian akan menampilkan sesuai dengan kata kunci tersebut. Biasanya judul diindasikan dengan menggunakan title tag yang berada antara <head> … </head>, seperti yang telah diulas dalam Tips Search Engine Optimization (SEO) pada Blogger.com.

<title>
  <b:if cond='data:blog.homepageUrl == data:blog.url'>
    <data:blog.title/>
  <b:else/>
    <data:blog.pageName/> | <data:blog.title/>
  </b:if>
</title>

Berikut beberapa hal yang perlu kita lakukan dalam membuat judul:

• Memilih judul yang secara efektif mengkomunikasikan topik dari konten halaman. Ini akan membantu mesin penelusur untuk menemukan obyek yang tepat, ketika pengguna mengetikkan kata kunci tertentu. Hindari penggunaan judul yang tidak ada hubungannnya dengan isi blog & menggunakan judul secara tersamar, seperti: “Tanpa Judul”, “Halaman Baru”.
• Menggunakan judul yang unik di setiap halaman. Setiap halaman blog idealnya harus memiliki tag judul yang unik, sehingga mesin penelusur mengetahui bagaimana halaman tersebut berbeda dari yang lain.
• Menggunakan judul yang singkat tapi deskriptif. Judul semestinya dapat dipersingkat & informatif, karena judul yang panjang mungkin tidak akan banyak membantu pengguna. Apalagi ketika sebuah judul dimasukkan kata-kata kunci yang tidak dibutuhkan serta berlebihan.

Deskripsi

Deskripsi dalam blog diwujudkan dalam description meta tags, dimana khusus untuk Blogger™ default akan berada pada markah <b:include data='blog' name='all-head-content'/>. Bagaimana jika tidak ada, mungkin karena modifikasi atau kustomisasi tiap template, maka kita dapat menambahkan secara manual.

<b:if cond='data:blog.metaDescription != &quot;&quot;'>
  <meta expr:content='data:blog.metaDescription' name='description'/>
</b:if>

Deskripsi blog dapat kita kostumisasi melalui pengaturan pada dashboard Blogger™, seperti yang telah ditulis dalam posting Kustomisasi Setelan pada Preferensi Penelusuran. Sedangkan untuk halaman posting & statis, berada pada menu pengaturan sebelah kanan editor posting.

Meta tag deskripsi berguna sebagai ringkasan dari keseluruhan isi blog dan “mungkin” mesin penelusur akan menampilkan deskripsi tersebut — jika benar-benar relevan — sesuai & cocok dengan permintaan pengguna. Berikut beberapa hal yang perlu kita lakukan dalam membuat deskripsi:

• Tulis desktipsi yang menginformasikan & demi kepentingan pengguna jika mereka melihat deskripsi tersebut sebagai potongan dalam hasil pencarian. Hindari menulis meta tag deskripsi yang tidak ada hubungannya dengan isi dari halaman, menggunakan deskripsi yang umum seperti “Ini adalah halaman web” atau “Halaman tentang blog”, mengisi deskripsi hanya dengan kata kunci, serta menyalin & menyisipkan seluruh isi dokumen ke dalam meta tag deskripsi.
• Menggunakan deskripsi yang unik untuk setiap halaman, sehingga membantu mesin penelusur & pengguna untuk menemukan ringkasan yang jelas tentang apa isi halaman blog tersebut. Oleh karena halaman sebuah blog adalah unik, maka hindari penggunaan deskripsi tunggal untuk setiap halaman.

Sumber: General guidelines Search Engine Optimization (SEO).

Description: Judul dan Deskripsi dalam Blog Rating: 5.0 Reviewer: Unknown ItemReviewed: Judul dan Deskripsi dalam Blog

Pemahaman yang saklak tentang SEO

Kita mempunyai suatu branding dan — tidak munafik — ingin dikenal. Bagaimana caranya agar dikenal? Yah, diberitahukan kepada orang-orang bahwa, ini adalah branding saya. Bagaimana orang itu tahu, kalau orang-orang sudah kenal dengan branding-nya — sebuah generalisasi sederhana — cari di mesin penelusur.

Umumnya SEO (Search Engine Optimization) merupakan usaha optimalisasi situs web atau blog agar mendapat perhatian dari mesin penelusur, sehingga ketika pengguna mengetikkan kata kunci tertentu, diharapkan halaman situs web atau blog tersebut akan muncul pada hasil pencarian. Apabila kita hanya terfokus pada frase kata mesin pencari, maka akan terjebak dengan pemikiran yang saklak tentang pemahaman makna sebenarnya yang terkandung dalam SEO itu sendiri. Sangat dimungkinkan timbul beberapa paradigma yang berpendapat bahwa SEO itu rumit, SEO itu perlu sekolah, & sebagainya. Kembali pada ilustrasi di atas, apakah hal tersebut akan menafikan proses SEO dalam aktivitas blogging Anda? Ya, tentu saja tidak. Terkecuali Anda adalah seseorang yang populer, memiliki banyak partner & follower atau hal-hal lain di luar kebiasaan.

Mungkin Anda adalah pembaca setia “Optimasi Blog”, kemudian pernah membaca beberapa posting tentang tips SEO. Mari kita kesampingkan dulu posting-posting itu & mulai dengan dua posting terakhir dengan label SEO, yakni Tips Search Engine Optimization (SEO) pada Blogger.com dan Tips SEO pada Blogger.com Bagian Kedua. Adakah hal-hal rumit tentang SEO? Apakah kita perlu menghitung jumlah kata dalam sebuah posting? Apakah satu atau lebih kata kunci harus ditekan secara berulang-ulang? Apakah dengan memberi tanda-tanda tertentu pada kata kunci akan meningkatkan peringkat pencarian?

Ketika kita mulai berpikir tentang pertanyaan-pertanyaan itu, maka kita pun akan terjatuh pada penilaian yang saklak akan makna sebenarnya dari SEO. Bukankah terdapat keterkaitan dengan “selalu dihubungkan dengan mesin pencari”? Antara keduanya memiliki keterkaitan yang jelas, namun dalam ruang lingkup yang berbeda. Daerah yang satu menggambarkan lingkup dalam sebuah branding, sedangkan yang lain diluar lingkup branding.

Ketika kita telah memutuskan tentang apa yang akan & patut dijadikan produk, sangat dimungkinkan pula kita telah menemukan merek yang tepat untuk produk tersebut. Jika dihubungkan dengan aktivitas blogging, produk yang dimaksud adalah berupa kumpulan catatan posting atau artikel. Selanjutnya, secara rutin posting — yang diterbitkan — diupayakan tidak terlepas dengan merek yang telah kita tetapkan. Satu keunikkan dari situs web atau blog telah muncul, yaitu merek & produk saling terkait. Ini adalah branding Anda.

Pengguna yang membutuhkan suatu informasi tertentu akan mencari pada mesin telusur dengan kata kunci yang ia butuhkan. Mungkin halaman situs web atau blog Anda akan muncul pada hasil pencarian & pengguna pun mengunjunginya. Ternyata halaman itu memang berisi informasi yang mereka butuhkan. Penyajian yang segar serta tersusun dengan bahasa yang baik, ia pun betah membacanya. Tidak menutup kemungkinan, pengguna akan membaca posting lain karena informasi yang dibutuhkannya memiliki keterkaitan.

Simpulan

Secara sadar atau tidak sadar, dimulai dari rancangan sebuah situs web atau blog sampai dengan pembaharuan posting yang sesuai serta terkait dengan tema, kita telah masuk ke dalam SEO. Oleh karena ia bukan hasil dari pemikiran yang saklak, harus mesin pencari atau sejumlah usaha keras utak-atik untuk mendapatkan peringkat dalam hasil organik. Tetapi lebih kepada target kebutuhan pengguna yang menjadi konsumen utama kita. Ketika blog ini berbicara tentang “SEO”, mungkin akan sesuai dengan pindaian Anda bahwa temanya adalah “Optimasi Blog”. Bagaimana jika menerbitkan tentang kisah “Selebritis”? Anda juga yang akan menilai.

Description: Pemahaman yang saklak tentang SEO Rating: 5.0 Reviewer: Unknown ItemReviewed: Pemahaman yang saklak tentang SEO

Desain Blog dan Aksesibilitas

Ketika berbicara tentang desain, umumnya kerap dihubungkan dengan desain antarmuka (front-end). Yah, sebuah tampilan dari baris markah yang dipertunjukkan oleh layar peramban, sehingga tidak lebih dari sekedar tampilan grafis yang dimaknai dengan sekumpulan kode-kode. Apabila hal ini berkelanjutan — mungkin menjadi sebuah #trending topics — maka jangan terkejut, jika kelak desain yang diartikan seperti tersebut di atas akan tidak bisa diakses oleh suatu peralatan tertentu.

Blog merupakan catatan di web yang tersusun oleh posting/artikel, biasa diurut berdasarkan akhir sampai awal penerbitan. Umumnya sebuah blog merupakan media berbagi, dimana pengelola, penulis, & pengunjung saling berinteraksi. Mungkin pula interaksi tersebut berjalan satu arah, penulis menerbitkan posting/artikel, sedangkan pengunjung cuma mencerna isinya, tanpa perlu ada aksi tertentu. Desain blog berisi karakter unik — HTML, XHTML, CSS, JS, PHP, dan sebagainya — tergantung pada mesin blogger yang mendukungnya.

Ketika kita memandang desain web adalah sebuah sistem, kita tidak dapat melepaskan aksesibilitas (dan usabilitas) di dalamnya. Saya berpendapat bahwa tujuan dari desain antarmuka adalah untuk menunjang aksesibilitas & usabilitas, bukan sebaliknya.

Aksesibilitas dan Desain oleh Ardian Trimurti

Kembali ke paragraf pertama, Jangan terkejut, jika kelak desain yang diartikan seperti tersebut di atas akan tidak bisa diakses oleh suatu peralatan tertentu. Mungkin sebagian dari kita, lebih mengutamakan tampilan desain yang cool serta elegen. Namun yang pasti, sebuah desain jangan meninggalkan satu poin penting, yakni aksesibilitas. Oleh karena aksesibilitas bukan hanya untuk memfasilitasi penyandang disabilitas, tetapi aksesibilitas itu untuk semua.

Catatan: Posting ini merupakan pembelajaran & dokumentasi penulis tentang aksesibilitas serta usabilitas.

Description: Desain Blog dan Aksesibilitas Rating: 5.0 Reviewer: Unknown ItemReviewed: Desain Blog dan Aksesibilitas

Membuat Halaman Arsip tanpa JavaScript

Setiap blogger pasti tahu, apa yang dimaksud dengan halaman arsip? Ya, betul sekali. Halaman itu terdiri dari kumpulan posting yang tersusun secara teratur, baik berdasarkan tahun, bulan, tanggal terbit, kategori, label, atau berisi keseluruhan item — yang telah disebutkan sebelumnya — dan sebagainya. Banyak sekali metode yang dapat dimanfaatkan untuk membuat halaman arsip, antara lain: menggunakan JavaScript & widget.

Trik blogger kali ini “Optimasi Blog” akan berbagi tentang membuat halaman arsip dengan menggunakan widget arsip dan widget label pada Blogger™. Ini didapat dari hasil blog-walking ke “Simple Blogger Tutorial” dalam posting Create a Separate Label or Archive Page in Blogger yang ditulis oleh Raju.

Petama, buatlah terlebih dulu sebuah halaman statis yang akan menampilkan arsip — contoh: Arsip — sehingga akan terbentuk sebuah permalink baru, seperti: h**p://namablog.blogspot.com/p/arsip.html. Isilah halaman itu dengan kalimat pembuka atau lainnya.

Kedua, masuk ke akun Blogger.com & pergi ke “Edit HTML”. Backup terlebih dulu template sebelum melakukan trik blogger ini. Perhatikan pula struktur pengkodean template, karena sangat dimungkinkan akan berbeda. Cari kode berikut, kemudian tambahkan kode yang berwarna merah di bawahnya.

  <b:section class='main' id='main' maxwidgets='1' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
  <b:section class='main' id='main1' maxwidgets='2' showaddelement='yes'/>

Jangan lupa disimpan & sekarang Anda telah memiliki elemen baru di bawah “Posting Blog”, dengan selector class='main' dan id='main1'. Elemen itu dapat Anda tambahkan maksimal 2 gadget — maxwidgets='2' — pada dashboard Blogger™ dalam menu “Tata Letak” (Layout).

Ketiga, tambahkan widget label dan widget arsip dengan mengklik add a gadget, sehingga tidak ada lagi opsi add a gadget pada elemen di bawah “Posting Blog”. Oleh karena kedua widget tersebut akan ditampilkan hanya pada halaman tertentu, yakni h**p://namablog.blogspot.com/p/arsip.html, maka diperlukan kustomisasi dengan memanfaatkan conditional tags.

Keempat, kembali ke “Edit HTML” & centang Expand Widget Templates. Cari kode berikut — dalam widget arsip maupun widget label — kemudian sisipkan dengan kode yang berwarna hijau.

<b:widget … >
<b:includable id='main'>
<b:if cond='data:blog.url == "h**p://namablog.blogspot.com/p/arsip.html"'> <!-- sesuaikan alamat dengan halaman yang dibuat untuk arsip -->
  …code widgets…
</b:if>
</b:includable>
</b:widget>

Conditional tags di atas berarti bahwa, widget akan ditampilkan hanya pada halaman dengan alamat h**p://namablog.blogspot.com/p/arsip.html, selain URL tersebut maka widget tidak akan ditampilkan.

Kelima, apabila menuju halaman lain — selain h**p://namablog.blogspot.com/p/arsip.html — masih terlihat janggal. Yah, mungkin tersisa ruang kosong karena pengaruh pengkodean elemen, seperti margin atau padding. Coba tambahkan CSS berikut di bawah ]]></b:skin>.

<b:if cond='data:blog.url != "h**p://namablog.blogspot.com/p/arsip.html"'>
<style>
#main1 {
  display: none;
}
</style>
</b:if>

CSS (Cascading Style Sheets) di atas dimaksudkan, jika URL bukan h**p://namablog.blogspot.com/p/arsip.html, maka selector id='main' — #main1 — disembunyikan.

Untuk demontrasi trik blogger di atas, silakan klik taut arsip “Optimasi Blog”. Apabila terdapat kekeliruan dalam deskripsi tentang membuat halaman arsip tanpa javascript, mari kita perbaiki bersama melalui kolom komentar. Begitu pula jika terdapat pertanyaan atau kritik dapat kita diskusikan pada media yang sama pula.

Description: Membuat Halaman Arsip tanpa JavaScript Rating: 5.0 Reviewer: Unknown ItemReviewed: Membuat Halaman Arsip tanpa JavaScript

Etika Berkomentar dalam Posting Blog

Ketika Anda mengunjungi sebuah blog, bukan tidak mungkin menemui satu atau lebih posting yang menarik perhatian. Namun Anda tidak memiliki kapasitas untuk meninggalkan komentar relevan, sebaiknya jangan dipaksakan untuk berkomentar. Oleh karena komentar yang Anda tinggalkan boleh jadi tidak merupakan sebuah asupan yang berarti bagi pengelola blog atau penulis posting atau pengunjung lain, bahkan bagi posting itu sendiri. Sehingga tidak jarang dianggap sebagai — eksplisit — komentar spam.

Hal ini pernah terjadi pada penulis, dimana suatu saat pernah memberikan komentar dengan memasukkan nama sebenarnya & email yang original, namun memberikan tautan (URL) pada posting tertentu dalam blog penulis. Meskipun secara de facto itu sah, tetapi secara etika mungkin keliru. Bagaimana etika yang benar? Cobalah selalu memperhatikan tanda-tanda di sekeliling formulir komentar.

Nama

Apakah Anda memiliki identitas? Ya, tentu. Nama saya “Aris Asmara” — bukan “Botol Kecap No.1” — sehingga ketika seseorang memanggil akan lebih memiliki makna, Hei, Aris Asmara. Bandingkan dengan panggilan berikut, Hei, Botol Kecap. Jadi, isi kolom nama dengan nama & bukan produk atau lainnya.

Email

Dimana rumah Anda? Jika seseorang — sesuatu — ingin mengenal Anda dan dapat mem-validitasi tempat tinggal Anda, maka suatu saat dia akan mudah menghubungi Anda kembali. Rumah merupakan tempat tinggal, sudah barang tentu berisi validitas informasi tentang profil Anda, termasuk nama serta foto. Sayangnya, sistem komentar Blogger™ tidak/belum memasukkan input ini sebagai alternatif, kecuali jika blog hanya dikomentari oleh pengguna yang teregistrasi pada akun Google Mail.

URL

Apa brand Anda? “Fortuner SUV Terbaik” atau “Optimasi Blog”. “Fortuner SUV Terbaik” merupakan hasil produk & “Optimasi Blog” adalah brand. Sebuah etika apabila Anda memasukkan alamat blog, bukan alamat posting (post permalink) pada bilah URL (Uniform Resource Locator).

Komentar

Bagaimana komentar Anda tentang isi posting? Komentar bukan merupakan sebuah reaksi praktis atau pemungutan suara, seperti Posting yang menarik, Terima kasih infonya, Boleh dicoba postingannya, dan sebagainya. Komentar merupakan ide yang muncul karena keingintahuan akan kebenaran dari isi posting, mungkin berisi pertanyaan, tanggapan, masukan, atau sanggahan.

Pertanyaan dalam komentar pun bukan hanya sambil lalu, namun memerlukan tindak lanjut. Jika pertanyaan Anda berkategori sambil lalu, sebaiknya tidak perlu berkomentar. Pengelola blog, penulis, dan pengunjung lain akan mengetahui bahwa Anda hanya menjaring trafik.

Tanggapan dapat berarti memberikan balasan pada suatu komentar. Manfaatkan fasilitas ini jika komentar Anda memiliki keterkaitan dengan induk komentar lain. Jangan membuat topik komentar baru, apabila isi dari komentar tersebut sudah memiliki topik yang sama.

Masukan memiliki arti yang mendalam pada komentar. Ia bisa memberikan perbaikan & pembaharuan, bahkan kesempurnaan bagi posting. Apalagi jika disertai dengan referensi yang jelas dan tepat.

Sanggahan dapat timbul, jika isi posting kurang/tidak sesuai dengan pendapat atau opini komentator. Sama halnya dengan “masukan”, sanggahan yang menjurus pada perbedaan nyata (kontradiksi) seharusnya disertai pula dengan referensi yang jelas dan akurat. Bagaimana jika sanggahan tersebut tidak beralasan sama sekali? Berarti komentator hanya menginginkan trafik dengan cara negatif atau komentar sanggahan yang disampaikan hanya akal-akalan agar pengelola blog, penulis, maupun pengunjung lain tertarik untuk mengunjungi situs web atau blog-nya.

Simpulan

Penulis rasa etika berkomentar bukan merupakan sebuah informasi baru yang patut dijadikan berita hangat, namun lebih kepada kesadaran pribadi akan makna komentar itu sendiri. Berikut beberapa poin yang dapat kita ambil dari uraian posting etika berkomentar di atas.

• Anda berkomentar untuk siapa? Anda pribadi karena rasa keingintahuan atau bagi khalayak blogger atau trafik dan backlink untuk kepentingan situs web atau blog Anda. Jika Anda mementingkan trafik dan backlink, sebaiknya jangan berkomentar. Oleh karena isi komentar belum tentu akan berhubungan dengan posting yang Anda komentari. Sebaliknya jika Anda berkomentar karena rasa keingintahuan atau bagi khalayak blogger, berarti Anda telah memberi sebuah arti pada posting & komentar itu sendiri. Secara tidak langsung, trafik dan backlink akan menyusul akibat komentar Anda yang penuh arti.
• Perhatikan tanda-tanda yang dapat menjadi acuan dalam memberikan komentar — tanda baca, tag-tag HTML yang diperbolehkan, dan sebagainya — agar mendukung ‘keterbacaan’.
• Masukkan nama jelas Anda — bukan yang lain —, email (jika dibutuhkan), URL blog dan bukan URL posting Anda. Apabila hal itu tidak terpenuhi, sangat dimungkinkan pengelola blog, penulis, atau pengunjung lain memberikan ‘cap’ sebagai komentar spam.
• Terakhir untuk meluruskan beberapa pemberitaan yang keliru — padahal update telah dilakukan pada beberapa posting sebelumnya — bahwa Optimasi Blog tidak dofollow. Ketika sebuah blog menerapkan sistem komentar bersarang (threaded comments) pada Blogger™, mungkin dapat dipastikan blog tersebut nofollow.

Jadikan diri kita dan situs web atau blog yang kita kelola dapat memberikan makna bagi orang lain. Silakan Anda berkomentar atau tidak perlu berkomentar sama sekali!

Description: Etika Berkomentar dalam Posting Blog Rating: 5.0 Reviewer: Unknown ItemReviewed: Etika Berkomentar dalam Posting Blog

Online Tool yang Membantu dalam Blogging

Di samping mengandalkan kemampuan & keterampilan sendiri — diperoleh melalui belajar maupun pengalaman — tidak terlepas pula dengan kebutuhan alat bantu untuk mendukung blogging. Dari sekian banyak situs web yang membantu aktivitas blogging, terdapat beberapa yang menyediakan tool secara online. Nah, berikut sedikit deskripsi dari beberapa online tool yang membantu “Optimasi Blog” dalam menghasilkan karya-karyanya.

CSS with vertical rhythm

Tool ini akan membantu untuk menghitung CSS agar memiliki ritme vertikal yang konsisten. Perhitungan menggunakan pixels (px) dan M (em). Cara penggunaannya tidak sulit, kita tinggal memasukkan jenis font, ukuran font dasar, besar line-height, & ukuran font yang ditargetkan dalam skala pixels. Berikut hasil uji coba vertical rhythm berdasarkan font yang berukuran 12px dan 18px, sedangkan font yang saya gunakan adalah Georgia, Times, "Times New Roman", serif berukuran .9375em atau 15px dan line-height: 1.6em; atau 24px. (red: baca kembali posting yang berjudul Sentuhan Magis dalam Blog).

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus euismod, mi ullamcorper ornare aliquet, erat dolor euismod libero, sed bibendum quam nunc quis quam.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus euismod, mi ullamcorper ornare aliquet, erat dolor euismod libero.

CSS Font Stack

Penggunaan sangat mudah, kita hanya perlu mengklik “Copy to Clipboard”, kemudian tempel pada kertas aplikasi seperti notepad dan sejenisnya. Tersedia pula beberapa pilihan jenis font yang akan/ingin kita gunakan dalam membangun sebuah situs web atau blog.

font-family: Georgia, Times, "Times New Roman", serif;

Variable Grid System

Sistem variabel grid adalah cara cepat untuk menghasilkan beberapa jaringan (kotak) CSS yang mendasari pembuatan situs web atau blog. File yang dihasilkan CSS didasarkan pada “Sistem Grid 960”. Salah satu manfaat dalam penggunaan tool ini adalah pengguna dapat dengan mudah mengatur responsif desain situs web atau blog-nya. Pun kita dapat melakukan berbagai kustomisasi lebar kolom, jumlah kolom, jarak antar kolom, & lebar konten.

The Responsinator

Bagaimana cara kita agar mengetahui desain situs web atau blog responsif? Tool ini dapat menjadi salah satu alternatif untuk mengamati tampilan situs web atau blog pada beberapa layar yang berbeda. Cukup dengan memasukkan alamat situs atau blog, kemudian klik “Go” atau eksekusi dengan menekan tombol Enter pada papan ketik.

HTML Entities

Sungguh sesuatu hal yang menyenangkan, ketika kita membuat pengkodean atau menulis posting/artikel dengan menggunakan entitas HTML tertentu. Ingat! Lakukan pembaharuan terhadap peramban kesayangan Anda.

Awas! Jangan menggunakan tips ini, karena mengandung ☢. Anda akan terbius atau ketagihan memakainya, apalagi jika berbintang ♈. “Khusus ♂”, harap menggunakan pengaman. Menurut penelitian, ❷ di antara ➉ peristiwa terjadi disebabkan kelalaian. Ketika ✍ perhatikan selalu tanda baca agar posting Anda tidak ter-✄ oleh pindaian para pengunjung — mendengar ♫ akan menimbulkan perasaan ♡ — gunakan ✉ atau ✆, sehingga tiap ✗ dapat diminimalisasi. Atau blog Anda akan di-asing-kan ke planet ♇.

HTML5 Outliner

Online tool ini bermanfaat untuk mengetahui format outline heading pada struktur situs web atau blog dalam HTML5, seperti h1, h2,… ,h6. Alat ini dapat melakukan pengecekan terhadap format outliner, baik melalui berkas file HTML, URL (Uniform Resource Locator), & input kode.

Lipsum Generator

Lorem Ipsum adalah contoh teks atau dummy dalam industri percetakan dan penataan huruf atau typesetting. Lorem Ipsum telah menjadi standar contoh teks sejak tahun 1500an, saat seorang tukang cetak yang tidak dikenal mengambil sebuah kumpulan teks dan mengacaknya untuk menjadi sebuah buku contoh huruf.

Online YUI Compressor

Untuk proses pemampatan sumber kode, baik CSS maupun JavaScript, tool ini dapat diandalkan. Kita dapat memasukkan text, URL, atau file, kemudian klik “Compress” untuk melihat hasilnya. Terdapat pula beberapa opsi pemampatan yang dapat kita pergunakan, sebelum memperoleh hasil yang diinginkan. Lebih detail tentang online tool ini, silakan baca posting berjudul Kompres Kode CSS dan Javascript.

Smush.it™

Smush.it menggunakan teknik optimasi khusus untuk format gambar yang tidak perlu untuk menghapus byte dari file gambar. Ini adalah perangkat “lossless”, yang berarti mengoptimalkan gambar tanpa mengubah tampilan atau kualitas visual. Setelah Smush.it berjalan pada halaman web, akan ada laporan berapa banyak byte akan diselamatkan dengan mengoptimalkan gambar halaman dan menyediakan file zip download dengan file gambar diminimalkan.

robots.txt Checker

Berkas robots.txt (sering keliru disebut robot.txt, dalam bentuk tunggal) yang dibuat oleh webmaster untuk menandai (melarang) file & direktori dari sebuah situs web untuk diakses oleh spider mesin pencari (dan jenis-jenis robot lain). Pengecek robots.txt ini merupakan "validator" yang menganalisis sintaks dari sebuah file robots.txt untuk melihat apakah format berlaku sebagaimana ditetapkan oleh A Standard for Robot Exclusion (silakan baca dokumentasi & tutorial untuk mempelajari dasar-dasar) atau jika mengandung kesalahan dalam pengecekan.

jsFiddle

Online tool ini dapat membantu jika kita ingin membuat suatu pengkodean tertentu, dimana disediakan empat kotak dengan input kode tertentu pula, seperti HTML, CSS, JavaScript, dan Result (hasil). Pun terdapat berbagai opsi pada tab di sebelah kiri layar.

The Readability Test Tool

Alat Uji Keterbacaan menyediakan cara cepat dan mudah untuk menguji pembacaan pekerjaan kita. Ini adalah perangkat lunak pembacaan yang paling fleksibel untuk menilai formula keterbacaan. Kita dapat menguji semua, atau bagian dari suatu halaman web, atau cukup mengetik teks. Taut langsung dari halaman situs web atau blog, kemudian online tool ini akan menghitung hasil untuk halaman tersebut.

GTmetrix

Ketika kita ingin mengecek performa situs web atau blog, perangkat GTmetrix merupakan alternatif yang dapat diandalkan. Selain menilai performa, ia juga memberikan deskripsi tentang cara mengoptimalkan serta beberapa taut rekomendasi yang dapat dimanfaatkan oleh pengguna.

Di antara sekian online tool yang dapat membantu dalam aktivitas blogging di atas, mungkin masih banyak alat atau perangkat lain yang tidak dapat penulis sebutkan. Tinggal bagaimana kita memanfaatkannya, sehingga mampu ‘mendongkrak’ performa situs web atau blog yang kita kelola agar lebih efektif & efesien, berguna, serta memberikan kenyamanan di hati para pembacanya.
So, bagaimana dengan Anda?

Description: Online Tool yang Membantu dalam Blogging Rating: 5.0 Reviewer: Unknown ItemReviewed: Online Tool yang Membantu dalam Blogging

Memodifikasi Tanggal Posting (date-header)

Pernah melihat hal yang menarik pada tanggal posting (date-header)? Atau kebanyakan tidak melihat, oleh karena tidak jarang elemen ini dihilangkan? Date Header merupakan kepala (judul) tanggal yang terdiri dari satu atau lebih posting, dimana mereka diterbitkan pada tanggal yang sama. Seandainya hari ini — 21 Oktober 2012 — Anda dapat menerbitkan sebanyak dua posting, maka kedua posting tersebut akan memiliki kepala tanggal 21 Oktober 2012.

Sebenarnya date header pada Blogger™ dapat ditampilkan dengan menarik, seperti sebagai icon kalender atau bentuk-bentuk lain. Mungkin disebabkan kekurang-tahuan kita, sehingga tidak jarang menghilangkan elemen ini. Berikut merupakan gambar pengaturan tanggal posting, baik melalui language and formating atau tata letak (layout) posting blog & kode elemen-nya.

Pengaturan tanggal posting (date-header) melalui language and formating.

Pengaturan tanggal posting (date-header) melalui tata letak (layout) posting blog.

<b:if cond='data:post.isDateStart'>
  &lt;div class=&quot;date-outer&quot;&gt;
</b:if>
<b:if cond='data:post.dateHeader'>
  <h2 class='date-header'><span><data:post.dateHeader/></span></h2>
</b:if>
<b:if cond='data:post.isDateStart'>
  &lt;div class=&quot;date-posts&quot;&gt;
</b:if>

Backup terlebih dulu template sebelum melakukan trik blogger berikut ini. Kemudian akses edit HTML melalui menu Template pada dashboard Blogger™, klik tombol proses & centang “Expand Widget Templates”. Tampilan tanggal posting dapat dibuat sedikit menarik dengan menambahkan script berikut di atas </head>, sehingga nantinya format tanggal mudah untuk dikustomisasi.

<script type='text/javascript'>
//<![CDATA[
function replace_date(b){var a=b.split(' ');month="<span class='month'>"+a[0].slice(0,3)+"</span>";day=" <span class='day'>"+a[1].slice(0,2)+"</span><span class='sep'>, </span>";year="<span class='year'>"+a[2]+"</span>";document.write(month+day+year)};
//]]>
</script>

Cari markah date-header seperti pada kode yang diberi warna merah di atas, kemudian ganti dengan kode berikut. Oleh karena beberapa pengaturan template pada blog penulis, maka <h2> diganti dengan <div>.

<div class='date-header'><span><script> replace_date(&#39;<data:post.dateHeader/>&#39;);</script></span></div>

Format tanggal posting harus sesuai seperti gambar (figure) di atas, letaknya — sampai posting ini diterbitkan — berada pada urutan ketiga dari bawah (third from bottom). Contoh: “Oktober 21, 2012” atau “October 21, 2012“. Selanjutnya, menambahkan CSS berikut di atas ]]></b:skin>.

.date-header {
  background: #666;
  color: #fff;
  float: left;
  position: relative;
  text-align: center;
  width: 44px; /* perhatikan border-width left & right */
}
.date-header:after {
  content: '';
  display: block;
  position: absolute;
  bottom: -20px; /* perhatikan border-width top & bottom */
  left: 0;
  border-color: #666 #666 #fff #666; /* nilai kode yang berwarna biru sama dengan nilai pada warna latar */
  border-style: solid;
  border-width: 8px 22px 12px; /* top=8px, bottom=12px, left & right masing-masing=22px */
}
.date-header .month {
  border-bottom: 1px solid #fff;
  display: block;
}
<!-- Menghilangkan koma & tahun -->
.date-header .sep, 
.date-header .year {
  clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
}
<!-- Memberikan ruang disebelah kiri untuk ditempati date-header -->
.post {
  padding-left: 58px;
}

Terkadang .post dapat pula diganti dengan .post-outer — sedangkan atribut padding dapat pula diganti dengan margin — tergantung pengkodean dalam tiap-tiap template. Hasilnya dapat dilihat pada tanggal posting di blog ini atau dapat diamati melalui gambar berikut.

Sekarang tampilan tanggal posting lebih menarik bukan? Pun tidak perlu lagi meng-unggah gambar & sebagainya. Selamat mencoba trik blogger “memodifikasi tanggal posting (date-header)”. :)

Description: Memodifikasi Tanggal Posting (date-header) Rating: 5.0 Reviewer: Unknown ItemReviewed: Memodifikasi Tanggal Posting (date-header)