MANFAAT BESAR PERUBAHAN PROTOKOL INTERNET DARI HTTP/1 KE HTTP/2 UNTUK HALAMAN BLOGGER

Dunia berubah lagi dan kali ini tertuju kepada para pemilik halaman web seperti blogger perubahan kali ini nyambung banget ke halaman mereka karena ini adalah tentang WWW atau World Wide Web yang sedang kita pergunakan. Inilah dia ceritanya.

ilustrasi

Selama ini kita menggunakan protokol web HTTP itu dan itu penting agar halaman web kita tampil di internet setidaknya ia tidak pernah berubah hingga tahun 1997. Hingga pada tahun 2015, mulai muncul perubahan itu. Sedangkan Google sendiri baru menerapkannya sebagai salah satu fitur di halaman webmaster yakni bagian web core vitals pada bulan Mei 2021 ini.

Dan protokol itu telah mengalami revisi besar besaran yakni dari HTTP lama kita sebut saja HTTP/1 atau HTTP versi 1.0. Kini revisi besar besaran itu telah datang dengan nama HTTP/2 atau disebut juga dengan HTTP/02. Boleh dikatakan HTTP/2 ini adalah versi perubahan pertama semenjak HTTP/1. Dan ia akan menggantikan protokol lama tersebut.

Standar baru ini pastinya support ke browser browser ternama seperti: Chrome, Opera, Firefox, Microsoft Edge, Safari dan amazon silk.

Apa gunanya bagi halaman web dan blog?

Jadi kita dapat mengatakan HTTP/2 ini adalah lanjutan atau penyempurnaan dari HTTP/1. HTTP/2 ini akan membuat halaman webblog kita menjadi lebih cepat dan seperti telah kita singgung di atas, Google sedang menerapkannya. 

HTTP/2 membawa perubahan yang signifikan bersama fitur fitur baru serta perfoma yang jauh lebih baik. Ia juga mendukung banyak browser seperti yang telah kita singgung di atas. Disamping itu ia membawa perubahan pada kecepatan halaman web pada halaman pengujian Google Speed. 

Dapat di pastikan bersama kemajuan ini kecepatan halaman sebuah webblog meningkat drastis.

Menurut google: 

Tujuan utama untuk HTTP/2 adalah mengurangi latensi dengan meng-aktifkan permintaan lengkap dan multiplexing respons, meminimalkan overhead protokol melalui kompresi efisien kolom header HTTP, dan menambahkan dukungan untuk penentuan prioritas permintaan dan push server. 

Untuk mengimplementasikan persyaratan tersebut, ada banyak penyempurnaan protokol lainnya yang mendukung, seperti kontrol alur baru, penanganan error, dan mekanisme upgrade, namun inilah fitur terpenting yang harus dipahami dan dimanfaatkan setiap developer web di aplikasi.

Adapun fitur fitur HTTP/2 adalah:

1. Enkrispsi cepat
2. Mengoptimalkan kinerja situs web kita
3. Mengoptimalkan sumber daya jaringan sehingga jaringan telkom lelet bisa menjadi lebih ringan dan kencang
4. Sudah hadir di Web Core Google Webmaster untuk membantu peringkat halaman web atau blog kita.

Manfaatnya bagi halaman web atau halaman blog kita:

1. Untuk meningkatkan kinerja (yakni kecepatan memuat halaman) situs web atau blog secara keseluruhan.
2. Untuk mengoptimalkan kinerja seluler situs web Kita
3. Mengoptimalkan penggunaan sumber daya di jaringan Kita misalnya Telkomsel dll.
4. Meningkatkan keamanan komunikasi data
5. Sudah hadir Core Web Vitals, guna membantu meningkatkan peringkat kita

Bagaimana caranya mengaktifkan HTPP/2 untuk halaman blogger blogspot?

Kita harus menguji apakah server kita support ke protokol HTTP/2, karena blogspot menggunakan servernya Google harusnya support dong.

• Silahkan kunjungi:  https://http2.pro/
• Masukan URL atau alamat halaman blog Kalian

Lihat contoh:

Ternyata support. Namun jika Kalian adalah pengguna platform blog yang tidak menggunakan server Google lakukan uji coba di atas dan jika ternyata server tersebut belum support protocol HTTP/2 secara automatis maka harus dilakukan langkah langkah tertentu untuk mengaktifkannya.

Dan jika Kalian menggunakan server yang memang sudah support seperti miliki google atau cloudflare, maka kalian tidak perlu melakukan apa apa lagi.

Kesimpulan

Sangatlah rugi jika tidak mengikuti protocol baru ini karena jelas ia mensupport dan memiliki fitur yang sangat penting:

• support mobile
• Support keamanan
• Support kecepatan halaman
• support kecepatan jaringan

Terimakasih semoga bermanfaat.

Ilustrasi: Anna Shvets pexel - thank you featured Picture.

Sumber:

https://developers.google.com/web/fundamentals/performance/http2

https://increasily.com/how-to-enable-http-2-on-your-website/

https://seoagencydublin.ie/pagespeed-insights-and-http-2/

https://www.cloudflare.com/website-optimization/http2/what-is-http2/

Ikuti terus trik, tips, teknik hack dan kabar terupdate dari blog ini! Share:

SHARE YA:

MARI BERKENALAN DENGAN FRAMEWORK CODEIGNITER

Kali ini kita mencoba bekerja dan blogging dengan menggunakan framework alih alih menggunakan platform konvensional seperti blogger blogpsot dan wordpress. Dengan cara ini akan terasa kebebasannya. Namun sebelum kita membahas codeigniter terlebih dahulu mari kita memahami apa itu framework.

Framework adalah kerangka kerja untuk mengembangkan aplikasi berbasis website maupun desktop. Kerangka kerja disini sangat membantu developer dalam menuliskan sebuah projek dengan lebih terstruktur dan tersusun rapi.

Kerangka kerja diciptakan untuk mempermudah kinerja dari programmer. Sehingga, seorang programmer tidak perlu untuk menuliskan kode secara berulang – ulang. Karena di dalamnya sendiri kita hanya perlu menyusun komponen – komponen pemrograman saja.

Apakah CodeIgniter itu?

CodeIgniter adalah Framework PHP, sederhana, ringan dan gratis karena bersifat Open Source, mudah di pelajari dan efektif dipergunakan buat membangun sebuah halaman website seperti blog. Tentu saja banyak website telah di bangun menggunakan CodeIgniter alih alih menggunakan platform yang mengikat kita dengan aturan mereka seperti blogger, wix dan wordpress. Kita dapat menggunakan CodeIgnister dan bebas mengembangkannya.

Dan karena librarynya juga sudah lengkap, hal ini akan memudahkan kita dalam membangun halaman web tanpa harus membuat elemen elemen dari NOL.

Perlu di catat bahwa:

1. CodeIgniter mudah dipelajari karena penulisan kode kodenya sederhana
2. Konfigurasi sangat sederhana, jadi jika kita membangun web dengannya kita dapat menggunakan berbagai library sehingga pekerjaan menjadi lebih mudah dan cepat.
3. Ringan. Ukuran filenya hanya 900KB, sehingga sangat ringan dan mudah di download.
4. Memiliki artsitektur yang rapi karena CodeIgniter menggunakan sistem MVC, yakni:
-model
-view
-controller
Percayalah dengan model MVC inilah kode kode jadi sangat mudah dibuat, mudah dibaca dan mudah di kembangkan.

5. CodeIgniter mudah di intergrasikan dengan librari lain meskipun berbeda.
6. Migrasi database juga mudah
7. Keamanan terjamin 

Kalian dapat mempelajari dan kemudian membangun website sendiri menggunakan framework CodeIgniter dengan mendownloadnya melalui link berikut:

https://www.codeigniter.com/userguide3/installation/downloads.html

Versi versinya sudah lengkap. Oleh karena ia adalah Framework PHP, memang diperlukan pengatatahuan dasar PHP agar dapat membuat sebuah halaman web berikut tema (temnplatenya) dan setelah selesai mendownload silahkan pindahkan folder CodeIgniter terlebih dahulu ke dalam folder htDocs. Lalu ekstrak. Robah nama file hasil ekstrak agar mudah di ingat.

Langkah tersebut adalah langkah awal membangun dan mengembangkan website sendiri. Selanjutnya jika sebagai pemula kalian dapat mempelajarinya. Jika kalian sudah memahaminya tentu saja dapat langsung bekerja menggunakannya....Kita akan sambung lagi tulisan ini dengan cara membuat halaman web atau blog menggnunakan framework codeigniter di lain kesempatan..

Ikuti terus trik, tips, teknik hack dan kabar terupdate dari blog ini! Share:

SHARE YA:

Langkah dasar yang harus diperhatikan dalam membuat desain web yang menarik

Saya bukan desainer, karena saya masih terlalu mentah dan terlalu dini dalam pengatahuan itu. Tapi saya selalu berusaha menjadi 'pemerhati' yang kalau menurut pengertian saya berarti selalu tertarik dan memperhatikan desain desain halaman web besar yang tidak luput dari pengamatan saya selama ini. Jika ada artikel Coding, web desain pasti akan saya buka dan saya baca.

Dan dari semua itu dan selama itu pula saya dapat menarik beberapa kesimpulan.

1. LOGO

Logo tidak dapat di abaikan karena termasuk hal penting dalam dunia desain. Sebuah LOGO dapat menjadi hal yang paling berdampak psikologis dan melekat dalam ingatan manusia. Walaupun tidak semata mata sebagai jimat bagi sebuah produk secara keseluruhan termasuk halaman web, namun LOGO kemudian menjadi abadi di ingat oleh pengunjung.

Editblogtema tidak atau belum memiliki LOGO, namun namanya mungkin telah di ingat oleh sebagian besar pengunjungnya yang sedikit itu. 

LOGO yang paling berharga itu adalah logo Apple ia mempresentasikan branding secara visual, begitu sederhana dan mudah diingat. Logo kemudian menjadi trademark sebuah perusahaan di silicon valley itu.

Bicara masalah LOGO perusahaan Apple kita harus tahu bahwa ia telah di desain dengan sangat cerdik oleh pembuat atau desainernya. Sebuah gambar buah apel yang di gigit! Apel memang untuk digigit, dan itu yang membedakannya dengan Appel utuh yang sangat biasa. Apel untuk dimakan dan ikon itu menyertakan bagaimana sebuah apel yang telah digigit.

Akan tetapi ikon LOGO tidak akan serta merta menjadi begitu terkenal jika perusahaan yang menyandangnya tidak sebesar Apple yang legendaris. Banyak faktor yang menjadi penyebabnya. Namun walau demikian, peranan seorang desainerlah yang telah menciptkan karya seni yang dapat begitu kuat menancap di ingatan manusia.

2. Warna

Warna memainkan emosi dengan gentle, ia dapat membangkitkan nuansa yang tidak dapat dijelaskan. Dengan bermain warna latar, header, dan mengkombinasikannya dengan pintar dan halus akan menjadi kesan pertama yang indah pada halaman web Anda.

Kesan pertama akan menentukan kesan terakhir, demikian kata pepatah. Karena jatuh cinta pada pandangan pertama orang akan mengenal sesuatu lebih awal dan mulai berinteraksi. Setelah itu terserah bagaimana cara mempertahankan interaksi tersebut.

Bahkan di dunia ini telah terdapat ilmu piskologi warna, contohnya:

1. Merah: bahaya, kegembiraan, kekuatan, cinta, energi
2. Oranye: kepercayaan diri, kesuksesan, keramahan, vitalitas
3. Kuning: kreativitas, kebahagiaan, kehangatan, keceriaan, optimisme
4. Hijau: alam, penyembuhan, kesegaran, kualitas, keberlanjutan
5. Biru: kepercayaan, perdamaian, kesetiaan, kompetensi, depresi
6. Merah muda: kasih sayang, kecanggihan, manis, feminin
7. Ungu: bangsawan, kemewahan, spiritualitas, ambisi
8. Coklat: dapat diandalkan, kasar, dapat dipercaya, sederhana, duniawi
9. Hitam: formalitas, dramatis, canggih, aman, mewah
10. Putih: bersih, sederhana, polos, jujur, minimal
11. Beraneka warna: bersatu, terbuka untuk semua, keberagaman, kesenangan

Dan di dalam spektrum warna terdapat banyak warna turunan seperti hotpink, laut, biru langit, dll. Pokoknya para desainer professional sangat pintar memainkan warna.

3. Kontras

Bicara kontras tidak terlepas dari warna, pencahayaan dan tampilan visual yang bertentangan. Dalam desain web yang paling banyak di lakukan adalah mengutak atik kontras warna. BAyangkan ketika menulis pada latar dengan warna gelap dengan tulisan warna hitam, tulisan akan nyaris tersamar bukan?

Jadi dalam hal ini adalah bagaimana sebuah tulisan nyaman di baca. Namun, permainanya tidak seserhana itu. Ketika Anda menulis warna hitam pada latar yang benar benar putih, mata juga ternyata tidak selamanya nyaman karena cepat kelelahan. kontras yang menyakitkan.

Demikian juga ketika membuat latar dark mode, latar terlalu hitam sedangkan tulisan terlalu putih akan sangat menyakitkan bagi mata pada saat membaca di tempat gelap. 

Warna hitam di tulis #000000;

warna putih di tulis #ffffff;

Dan itu sangat kontras jika Anda pada dua kebalikan: latar sangat hitam dengan tulisan sangat putih atau latar sangat putih dengan tulisan sangat hitam. Jelas, tapi perilaku membaca di halaman web bukan untuk 13 detik, bisa 13 menit hingga 30 menit.

Maka itulah sering di temukan:

Warna gelap ditulis #555555;

Warna terang ditulis #f1f1f1;

Kita menulis untuk manusia jadi desain harus mempertimbangkan kebutuhan manusia hingga menyentuh ke bagian terdalam: Psikologi.

Akan tetapi bicara kontras bukan hanya warna. Ukuran font juga menentukan. Misalnya jika Anda menulis heading atau Judul terlalu besar. Mata pembaca pertama tama akan melihat itu sangat jelas. Namun ketika pembaca mulai membaca tulisan dibawahnya tulisan menjadi sangat kecil walaupun tulisan itu sebenarnya sudah standar, hal ini terjadi karena efek kontras tadi. Petama pembaca membaca judul yang sangat besar. Tiba tiba membaca tulisan artikel dibawahnya menjadi terlihat sangat kecil. Ini akan membuat efek yang melelahkan mata.

4. Jenis Font tulisan

Sebaiknya dalam mendesain menggunakan jenis font yang paling familiar pada mata manusia dan paling mudah di baca. Anda bisa membuat Satu judul dengan jenis font seperti Unifraktur Maguntia.

Tapi tentu saja Anda tidak mungkin membuat seluruh artikel menggunakan jenis font tersebut, karena pembaca pasti akan kesulitan memahaminya.

Ada beberapa jenis font yang sangat umum di pergunakan dalam penulisan di dunia web, contohnya:

• Arial
• Courier
• Gerorgia
• Helvitica

dll. Di blogger font font ini di kelompokan sebagai font 'default'.

Di samping jenis font, warna font pada umumnya di tulis hitam atau gelap pada latar warna putih atau terang. juga di tulis dalam bentuk pragraraph yang rapi dan teratur. penulisan juga harus mengikuti kaedah umum, misalnya pada blog ini menggunakan text-align: left. Artinya tulisan di letakan dan dimulai dari kiri.

4. White blank space (Ruang putih kosong)

Ruang kosong. Sering desainer merasa harus mengisi ruang kosong. Akan tetapi tidak selamanya pola pikir itu benar. Pembaca butuh ruang putih kosong untuk membedakan objek yang satu dengan objek yang lain. Misalnya tulisan terlalu rapat juga akan sangat menyakitkan di pandang mata. Tulisan tanpa spasi juga akan membingungkan pada saat di baca. 

Sering header terlalu tinggi dan banyak ruang kosong sehingga judul tampak kesepian di sana. Akan tetapi sebenarnya diperlukan mengisolasi atau memisahkan judul dari isi tulisan. Pertama pembaca melihat judul blog lalu melihat judul artikel. Dan pada akhirnya fokus pada isi tulisan.

Spasi tulisan dan jarak tinggi tulisan benar benar harus benar agar nyaman di baca oleh pengunjung halaman.

 
Kesimpulan:

Tentu saja hal di atas lebih kepada estetika, namun secara teknis desain juga melibatkan:

• Layout yang baik
• Navigasi yang baik
• Kecepatan berdasarkan kesederhanaan
• Kelengkapan elemen
• UI (user Interface)
• UX (user experience)
• dll

Sayangnya pada kesempatan kali ini kita tidak sedang membahas hal hal teknis tersebut.

Ikuti terus trik, tips, teknik hack dan kabar terupdate dari blog ini! Share:

SHARE YA:

Apa yang akan terjadi terhadap halaman website setelah Anda meninggal?

Mungkin anda tidak perduli bagaiama kelanjutan nasib halaman website yang sedang Anda kelola jika suatu hari Anda telah tiada, tapi bagaimana jika halaman website anda adalah halaman pencetak uang? Mau tidak mau anda harus perduli. Nah ini yang akan terjadi:

1. Jika itu adalah akun Media Sosial.

Jika anda memiliki akun bisnis di Facebook, Instagram dan lain lain. Apa yang akan lakukan dengan hal itu sebelum anda mati? Jika anda tidak ingin meninggalkan jejak umum di internet anda dapat memutuskan: MENGHAPUS AKUN MEDSOS ANDA SEBELUM ANDA MATI.

When you are gone

Jika anda tidak menghapusnya dalam jangka waktu beberapa lama pihak pengelola Media Sosial yang telah anda pergunakan, mereka akan mencoba menghubungi anda melalui email yang anda pergunakan. Jika tidak ada respon, akun akan di hapus secara otomatis dalam jangka waktu tertentu.

Tetapi sebelumnya saya ragu jika mereka tidak melakukan "back up" seluruh kegiatan semasa anda hidup. Karena ketika anda pertama mendaftar saya juga ragu tidak semua orang membaca "term of condition" atau Privacy of policy" yang menjelaskan bagaimana pengelola akan menggunakan privasi anda ke dalam kegiatan bisnis mereka di internet.

Bayangkan setelah anda meninggal, sebagian diri anda masih tetap 'bergentayangan' di internet.

Jika hari ini anda masih menganggap "itu hanyalah medsos" dimasa depan anda keliru. Itu adalah bagian dari aktivitas manusia untuk berinteraksi dan mempelajari hidup anda sampai ke dalam isi kepala anda.

Tentu saja jejak digital kita tetap tertinggal di internet setelah selama hidup anda bermain di Facebook, instagram, twiter atau bahkan Pinterest dan Linkedin. Sekalipun sekarang anda mulai menghapusnya. Semua itu tidak terlepas dari interaksi anda dengan sesama pelaku medsos atau warga net.

Setiap hal yang berwarna warna yang anda tulis dan anggap indah itu tidak semua orang memandangnya dengan hal yang sama. Ada saja orang orang yang membenci anda dengan diam diam karena postingan anda itu. Tetapi sadar atau tidak sadar anda telah bersedia menerima risikonya karena anda aktif di Facebook, instagram dkk.

Jika tidak tentu lebih baik dari dulu anda tidak usah "exist" disana. Semua yang telah kita lakukan dalam hidup ini tidak ada yang gratis. Media sosial akan menagih segalanya bahkan sampai anda telah mati. Seluruh kisah baik dan buruk anda akan dipelajari terutama untuk ekspos ke bisnis. Terlalu filosofis? Tidak! Itu logika.

Jadi anda bisa memutuskan menghapus akun anda, atau membuat wasiat kepada ahli waris dengan memberikan seluruh akses, password dan segala yang terhubung ke jejak digital anda di internet kepada ahli waris untuk melakukan tindakan pengambilan keputusan: Di hapus atau di lanjutkan.

Bagi anda yang memiliki akun bisnis premium di media sosial yang terkait dengan kegiatan jual-beli, lebih baik dipikirkan mulai sekarang, bersiaplah dengan ahli waris untuk pengelolaannya.

2. Jika itu adalah website anda

Jika sekedar blogging, banyak juga orang membiarkan blognya mati sebelum berkembang. Di tinggalkan begitu saja karena telah dianggap tidak menghasilkan apa apa. Sekalipun blog tersebut telah memiliki domain premium. Tetapi pihak domain dan hosting akan mencoba menghubungi anda via email pada saat batas pembayaran tahunan jatuh tempo meminta anda untuk memperbaharui pembayaran. Ini hanya dapat dilakukan oleh pemilik asli halaman web.

Dan jika tidak ada respon dalam jangka waktu yang telah mereka syaratkan, maka blog tersebut akan di nonaktifkan. Anda akan menemukan domain anda ditawarkan kepada pembeli umum.

Akan tetapi perlu anda pertimbangkan jika halaman web terkait dengan profesi, penghasilan, tutorial atau pendidikan online, sama halnya dengan akun medsos, anda mungkin harus mempertimbangkan untuk mengalihkannya kepada seorang ahli waris yang telah anda persiapkan.

Anda bisa mempercayakan nya pada seseorang terpercaya yang memiliki akses penuh mengelola domain dan hosting yang telah anda beli dan mewariskan-nya.

Mungkin ini hanya berlaku buat domain saja sementara jika anda memiliki aset digital lain yang terkait dengan domain namun dengan password yang berbeda, sebaiknya mulai sekarang membuat semacam "Master Password" sehingga kelak semua aset dapat di akses melaluinya.

Alternatif lain anda dapat mewariskan-nya kepada anggota keluarga. Atau mulai melakukan penawaran untuk di jual melalui jasa online....

3. Dan, apa yang terjadi setelah itu, bagaimana anda terlihat setelah anda tiada?

Patut juga dipertanyakan, ketika semasa hidup anda mengutip, memposting kata kata dan gambar di internet. Apa yang terjadi adalah, gambar dan kata kata anda  di sebar kembali di halaman internet. Baik secara langsung atau pun tidak.

Berbeda dengan medsos yang seluruh properti dan aset di kelola oleh pihak ketiga dan dipergunakan oleh jutaan pengguna secara massal bersama sama, website bisa berbentuk personal dan anda memiliki hak kontrol penuh terhadapnya kecuali kewenangan kontrol terhadap pembatasan domain dan hosting adalah kewenangan pihak pemilik server dengan ijin mengelola.

Namun pada prinsipnya Internet itu adalah sebuah dunia yang tidak berada di bawah kekuasaan anda. Jika segala informasi perihal diri anda bisa saja masih tersimpan di dalam server pusat sebuah medsos selamanya dan masih dapat di pergunakan oleh pemilik maupun user lain yang masih hidup dalam bentuk copy yang pernah mereka lakukan, maka sebuah website pribadi dan bisnis milik anda mungkin akan terus hidup seperti sebuah buku digital di internet yang berisikan seluruh bentuk pemikiran anda yang benar dan juga yang salah.

Dan pada prinsipnya karena internet tidak berada di bawah kekuasaan kita, apa yang telah kita pergunakan, baik berbentuk medsos, website, situs lainnya bisa jadi merupakan jejak rekam digital diri anda. Dan menimbang betapa majunya dunia internet setelah kepergian anda. Anda bisa saja seolah "hidup" kembali.

Bayangkan, semasa hidup mungkin kita menginginkannya. Tetapi suatu waktu setelah kita tiada, kita tidak mungkin lagi berubah pikiran...Jadi untuk website jika anda berniat untuk tetap mengontrol-nya, sebaiknya menyiapkan ahli waris yang terpercaya mulai sekarang.

www.editblogtema.com

SHARE YA:

Cara menjadi SEO dan mendapatkan kotak sitelink halaman Blogger Blogspot di tahun 2020

Kotak penelusuran sitelink adalah beberapa kumpulan links daripada halaman suatu blog atau web yang tertera di bawah suatu blog atau website yang dituju. link tersebut merupakan link yang mengarah ke situs dari website tersebut bukan link yang mengarah ke situs lainnya, sehingga dengan begitu memberikan suatu kemudahan untuk para pengunjung.

Manfaatnya kotak penelusuran? Mengutip kata pakarnya:

• Menunjukan bahwa halaman web tersebut telah memiliki kualitas 
• Mempermudah Pengunjung dalam mencari informasi yang tepat dari halaman web/blog tersebut.
• Menghemat waktu pengunjung karena ia dapat berfungsi sebagai jalan pintas
• Sitelink terbukti mampu meningkatkan traffik kunjungan ke halaman web atau blog tersebut, termasuk secara signifikan meningkatkan CPC/BPK Adsense dalam meningkatkan penghasilan (bagi yang memasang)

BACA JUGA:

Cara meningkatkan performa halaman web

Ada 3 elemen yang harus di perhatikan para blogger zaman next, contoh:

1. Mobile Usability
402
0
OPEN REPORT
2. Breadcrumbs
785
0
OPEN REPORT
3. Sitelinks searchbox
394
0
OPEN REPORT
Silahkan buka di:

Google Search Control

Dari table yang saya ambil di Google Webmaster 'search Control' di atas kita dapat menyimpulkan:

1. Halaman harus mudah di digunakan, di akses dan di baca melalui perangkat seluler (ponsel)
2. Halaman harus memiliki data yang terstruktur yakni dengan memasang breadcrumb.
3. Halaman memiliki sitelink.

Sayangnya elemen di atas tidak serta merta kita dapatkan begitu saja tanpa menambahkannya. 

1. HARUS MOBILE USABILITY

Untuk mendapatkan halaman yang mobile friendly kita harus menggunakan template yang mobile friendly, hindari menggunakan template tua (versi lama, terutama yang klasik), gunakan saja template bawaan terbaru blogger seperti contempo, soho, emporio dan notable (kami sekarang menggunakan template soho yang telah di modifikasi)

2. HARUS DENGAN DATA TERSTRUKTUR

Untuk membuat data halaman terstruktur pasang breadcrumb, cara paling sederhana adalah dengan meletakan script breadcrumb jason-LD berikut di bawah kode <data:post.body/> di dalam template Anda:

<script type='application/ld+json'>{ "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [ { "@type": "ListItem", "position": 1, "name": "Home", "item": "<data:blog.homepageUrl.canonical/>" <b:if cond='!data:post.labels'>}<b:else/>},<b:loop index='i' values='data:post.labels' var='label'> { "@type": "ListItem", "position": <b:with value='data:i + 2' var='num'><b:eval expr='data:num'/></b:with>, "name": "<data:label.name/>", "item": "<data:label.url.canonical/>" <b:if cond='data:post.labels.size != data:i + 1'>},<b:else/>}</b:if></b:loop></b:if> ] }</script>

Breadcrumb diatas tidak akan terlihat secara visual di atas halaman blog, akan tetapi kode di atas jelas menjadi sinyal yang sangat kuat bagi mesin penelusur karena di rekomendasikan oleh google. Buktinya akan terlihat di halaman Webmaster Google Search Control pada tabel yang telah kami tampilkan diatas.

3. HARUS MEMILIKI KOTAK PENELUSURAN SITELINK

• BEGINI CARA MEMBUAT KOTAK PENELUSURAN SITELINK DI BLOGSPOT

Yang terakhir adalah syarat halaman blog atau web modern harus memiliki kotak penelusuran sitelink kami mencobakan script berikut yang di letakan di bawah kode tag <head>:

 <script type='application/ld+json'>

    {

      &quot;@context&quot;: &quot;https://schema.org&quot;,

      &quot;@type&quot;: &quot;WebSite&quot;,

      &quot;url&quot;: &quot;<data:blog.homepageUrl/>&quot;,

      &quot;name&quot;: &quot;<data:blog.title/>&quot;,

      &quot;alternateName&quot;: &quot;<data:blog.title/>&quot;,

      &quot;potentialAction&quot;: {

        &quot;@type&quot;: &quot;SearchAction&quot;,

        &quot;target&quot;: &quot;<data:blog.homepageUrl/>search?q={search_term_string}&amp;max-results=6&quot;,

        &quot;query-input&quot;: &quot;required name=search_term_string&quot;

      }

    }

  </script>

Save template dan lihat hasilnya dengan cara memasukan dan menguji salah satu link artikel ke webmaster tool melalui cara:

1. Masuk ke dasbor blogger
2. Pilih pengaturan
3. Scroll halaman kanan yang muncul dari atas ke bawah
4. Untuk inspeksi URL silahkan klik Google Search Console
5. Setelah masuk klik 'Inspeksi URL' dan masukan URL untuk menguji apakah halaman telah memiliki kotak pencarian Sitelink

Tampilan pengujiannya akan tampak sebagai berikut:

Tampilan itu tidak akan muncul jika pada template Anda tidak terdapat/terpasang kode sinyal yang telah kami utarakan di atas.

Google terus mengingatkan: Hanya halaman yang di index yang dapat memiliki penyempurnaan. Halaman harus kanonik sehingga dapat di index.

Terimakasih, selamat mencoba.

Ikuti terus trik, tips, teknik hack dan kabar terupdate dari blog ini! Share:

SHARE YA:

BEDANYA SITUS BESAR DENGAN SITUS KECIL DI MATA MESIN PENCARI

Website recehan

Jauh banget bedanya, bro. Terasa sekali. Yang menyedihkan itu adalah dari sisi persaingan kepercayaan terkait Domain Authority, atau kepercayaan oleh mesin pencari terhadap halaman kita dan juga persaingan kata kunci (keyword), jika Kita menulis sebuah artikel dengan dengan topik dan kata kunci tertentu lebih duluan dari Detik, Kompas dan Tribun dan walaupun halaman web kecil milik kita telah kita optimalkan, mesin telusur menyuruh kita antri dan mereka mendahulukan mencari halaman halaman besar terlebih dahulu, dan mengangkut artikel mereka kehalaman internet, setelah itu baru halaman kita. Biasanya halaman kita muncul setelah topik menjadi basi. Padahal kita duluan yang mengedapankan dan mengajukan artikel dengan topik tersebut.

Saya menamakannya dengan: Beda perlakuan. Tapi itu adalah realita yang tidak mungkin di elakan. Mari kita hadapi.

1. Branding dan Domain Authority: Milyuner vs Recehan

Contoh, jika kita bertolak dari halaman blog kita menulis sebuah topik dengan judul 'Kekalahan Donald Trump atas Biden' sehari sebelum halaman majalah detik, Tribun,kompas dkk, halaman kita tidak segera muncul ke halaman pencarian hingga berhari hari. Kita kalah Authority dari halaman mereka. Lalu hari ini Kita melihat topik dan judul yang sama di keluarkan oleh Detik langsung viral dalam 10 detik setelah itu seperti berlomba lomba diterbitkan dan berjejer di atas halaman mesin pencarian! 

Pelajari semua kesamaan topik dan judulnya, pelajari keywordnya, sama. Tapi wajar, itu halaman besar dengan modal yang besar dengan Domain Authority yang besar juga, lebih tinggi dan lebih mudah terlihat, bukan? 

Lihat contoh lain: Akan jauh lebih banyak orang mengunjungi Supermall ketimbang warung di pinggir jalanan bukan. Ironis memang jika mengibaratkannya demikian namun itu penting dan begitu memang faktanya. lalu bagaimana dengan nasib artikel kita tadi? Bukankah sebenarnya kita yang mengangkat topik tersebut lebih duluan?

Artikel kita tetap akan 'temukan' setelah berita menjadi 'dingin' kita akan melihat halaman telah di crawl dan dimasukan ke dalam peta situs oleh Google. Atau paling buruk, di anggap sebagai artikel penjiplak dan pengekor karena baru nongol setelah artikel artikel dari halaman besar bermunculan.

Diluar teknis baik penulisan dan pengoptimalan, pada kenyataannya algoritma Google masihlah bersifat 'Business Oriented'.

Sepertinya belajar SEO keyword itu ambigu, absurd dll (ngawur nih)...Soalnya halaman menjadi besar dan kuat setelah melewati proses waktu bukan karena keyword juga kale ya dan halaman besar itu sendiri bisa menjelma menjadi keyword yang kuat dan membekas, dan kadang itu harus memakan waktu yang lama. Memang tidak salah mengoptimalkan halaman dengan berbagai cara, akan tetapi jika halaman belum terbukti konsisten, maka bisa saja akan tetap diabaikan oleh mesin pencari. 

Halaman blog memang tidak semanarik halaman halaman Tribun, Detik dan Kompas, bro. Halaman kita adalah halaman miskin jadi memang seharusnya bersabar dan mengalah pada yang lebih kuat dan kaya. Dan itu memang sudah hukum alam semesta.

Result: Untuk poin di atas apa boleh buat saya harus mengatakan mereka menang telak, bro. Orang lebih suka melihat orang kaya ketimbang orang miskin.

2. Halaman mobile dan kecepatan loading vs konten lengkap

Google memprioritaskan halaman mobile ketimbang halaman web desktop, semua orang sudah tahu, sampai urusan template pun di modifikasi menjadi halaman AMP. Namun jangan berharap terlalu banyak pada hal tersebut karena masih banyak faktor lain yang jauh lebih penting.

Halaman mobile dan kecepatan loading juga tidak begitu berpengaruh terhadap prioritas mesin pencari jika berhadapan dengan halaman yang lebih besar dengan otoritas domain yang lebih tinggi, tetap saja halaman kita akan di kemudiankan di crawl oleh mesin pencari. Namun penyebab yang paling menentukan adalah, diantaranya:

• kampanye dengan dana besar, jelas media besar memiliki hal ini mereka memiliki manajemen yang professional dan bagian pemasaran.
• pengunjung  organik dan non organik yang lebih banyak. Mereka telah memiliki basis kuat untuk kedua jenis pengunjung dengan menyediakan semua konten yang lengkap.
• Afiliasi langsung antar perusahaan pengunjung yang masif.  Mereka berbasis bisnis yang menawarkan keuntungan dan perputaran uang.
• Jadwal penerbitan yang sangat konsisten. Ini sangat penting agar otoritas halaman tertap terjaga tinggi.
• Konten lengkap, niche di babat habis, optimasi dan up to date lebih cepat dan teratur.
• Sistem keamanan dan kepercayaan lebih tinggi

Melihat poin poin di atas wajar walaupun halaman kita telah lari secepat kilat, mesin pencari masih menunggu halaman mereka yang besar dengan muatan berat namun penuh dengan konten yang selalu  di tunggu oleh pembaca.

Result: Maaf, bro, dalam hal ini lagi lagi mereka menang telak. Kalau membandingkan ya kita pacundang. Jadi gak usah membandingkan ya, cukup tahu saja.

Ayo masih mau membandingkan halaman Tribun dengan dengan halaman kita?.  Yang realistis saja, bro. Kita tetap memiliki bagian dari kita sendiri yang masih patut untuk di garap dengan serius, misalnya membuat blog niche, tutorial, spesialis bidang tertentu. Namanya juga mencari recehan.

3. Peluang yang tersisa.

Peluang selalu ada. Meskipun kita tidak dapat memungkiri banyak halaman blog yang tadinya begitu populer akhirnya tutup karena dirasa oleh pemiliknya hanya buang buang waktu. Itu hanyalah pilihan.

Peluang yang paling masuk akal adalah menjadikan atau mengkonversikan halaman blog untuk support atau mendukung bisnis disamping hobi. Peluang lain adalah untuk menyalurkan hobi menulis, dan menjadikannya sebagai ancang ancang bisnis juga. Bukankah akhirnya ada peluang untuk menjual jasa tulisan?

Namun di dunia tidak ada yang abadi, platform blogger bahkan vlogger bisa saja dianggap ketinggalan zaman suatu hari dan akan di gantikan oleh suatu platform yang sebelumnya tidak terbayangkan oleh kita. Untuk mengantisipasi hal ini di butuhkan kreatifitas dan jiwa inovator yang tinggi. Karena Anda sudah menjadi blogger saya percaya Anda kebanyakan adalah orang orang seperti itu.

Result: Untuk poin ini: No comment.

Ikuti terus trik, tips, teknik hack dan kabar terupdate dari blog ini! Share:

SHARE YA:

Cara membuat layout Website dengan CSS

Boleh dikatakan ini adalah teknik pembuatan layout template editblogtema sendiri, yang pembuatannya di dominasi oleh CSS Style untuk membentuk tampilan elemen HTML di dalam template. Melalui 'rahasia dapur' pembuatan template kami kalian akan dibawa untuk memahami kesaktian CSS.

CSS adalah bahasa yang menerapkan style ke dalam dokumen HTML. CSS-lah yang menentukan bagaimana HTML akan di tampilkan. Atau singkatnya sebagai berikut:

1. CSS adalah singkatan dari Cascading Style Sheet
2. CSS-lah yang akan menentukan bagaimana HTML akan terlihat (ditampilkan pada layar monitor PC, kertas atau media lainnya). Misalnya bagaimana template template berubah tampilannya oleh editblogtema.
3. CSS menghemat banyak waktu kerja. Ia dapat mengendalikan layout berbagai halaman web sekaligus.
4. Stylsheest eksternal (CSS) di simpan di dalam file CSS. 

Di dalam halaman HTML (termasuk halaman HTML Blogger) sintaks CSS akan terlihat sebagai berikut:

<style>
p {
color: red;
text-align: center;
}
</style>
</head>

<p>Halo Dunia!</p>
<p>Pragraf ini di stylish dengan CSS.</p>

Banyak jenis deklarasi pengaturan yang menyertainya, misalnya untuk mengatur dan menambah warna, mengatur jarak elemen, mengatur background halaman, font, lebar, align, posisi, dropdown, z-index, border, dll.

Membuat layout halaman website dengan CSS

1. CSS untuk membuat Header Blog

Hal pertama terlihat pada suatu layout website adalah header dan menurut kebiasaan selalu terletak di atas halaman Website/Blog, tepatnya bisa di atas menu navigasi, bisa pula di bawahnya. Dan biasanya selalu deilengkapi dengan sebuah LOGO atau nama Website.

CONTOH:

EditBlogTema

Kode CSS-nya:

<!DOCTYPE html>
<html lang="en">
<head>
<title>CSS Website Layout</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
margin: 0;
}
/* Style the header */
.header {
background-color: #f1f1f1;
padding: 20px;
text-align: center;
}
</style>
</head>
<body>
<div class="header">
<h1>EditBlogTema</h1>
</div>
</body>
</html>

 2. CSS untuk membuat Navigasi menu bar blog

Sekarang masanya melengkapi header yang telah kita buat di atas dengan menu navigasi. sebagai contoh kita tuliskan 3 buah menu horisontal dikanan bawah header: Link 1, Link 2, Link 3.

Halaman kami penuh dengan contoh membuat navigasi ini, contoh paling standar pembuatannya adalah sebagai berikut:

EditBlogTema

Link1 Link2 Link3

Kode CSS-nya:

<!DOCTYPE html>
<html lang="en">
<head>
<title>CSS Website Layout</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>

* {
box-sizing: border-box;
}
body {
margin: 0;
}

/* Style the header */
.header {
background-color: #f1f1f1;
padding: 20px;
text-align: center;
}
/* Style the top navigation bar */
.topnav {
overflow: hidden;
background-color: #333;
}

/* Style the topnav links */
.topnav a {
float: left;
display: block;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}

/* Change color on hover */
.topnav a:hover {
background-color: #ddd;
color: black;
}
</style>

</head>
<body>
<div class="header">
<h1>Header</h1>
</div>
<div class="topnav">
<a href="#">Link1</a>
<a href="#">Link2</a>
<a href="#">Link3</a>
</div>
</body>
</html>

3. CSS untuk membuat konten 'body' blog

Setelah membuat header dan navigasi, kini saatnya membuat konten, yakni apa yang kita sebut sebagai body daripada layout halaman website tempat menulis konten tulisan, gambar dan video layaknya halaman website atau blog. Caranya adalah sebagai berikut:

EditBlogTema

seni blogging yang sensaional.

Link1 Link2 Link3

Column 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet pretium urna. Vivamus venenatis velit nec neque ultricies, eget elementum magna tristique. Quisque vehicula, risus eget aliquam placerat, purus leo tincidunt eros, eget luctus quam orci in velit. Praesent scelerisque tortor sed accumsan convallis.

Column 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet pretium urna. Vivamus venenatis velit nec neque ultricies, eget elementum magna tristique. Quisque vehicula, risus eget aliquam placerat, purus leo tincidunt eros, eget luctus quam orci in velit. Praesent scelerisque tortor sed accumsan convallis.

Column 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet pretium urna. Vivamus venenatis velit nec neque ultricies, eget elementum magna tristique. Quisque vehicula, risus eget aliquam placerat, purus leo tincidunt eros, eget luctus quam orci in velit. Praesent scelerisque tortor sed accumsan convallis.

Kode CSS-nya:

<!DOCTYPE html>
<html lang="en">
<head>
<title>CSS Website Layout</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
box-sizing: border-box;
}

body {
margin: 0;
}

/* Style the header */
.header {
background-color: #f1f1f1;
padding: 20px;
text-align: center;
}

/* Style the top navigation bar */
.topnav {
overflow: hidden;
background-color: #333;
}

/* Style the topnav links */
.topnav a {
float: left;
display: block;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}

/* Change color on hover */
.topnav a:hover {
background-color: #ddd;
color: black;
}

/* Create three equal columns that floats next to each other */
.column {
float: left;
width: 33.33%;
padding: 15px;
}


/* Clear floats after the columns */
.row:after {
content: "";
display: table;
clear: both;
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width:600px) {
.column {
width: 100%;
}
}
</style>
</head>
<body>

<div class="header">
<h1>Header</h1>
<p>Resize the browser window to see the responsive effect.</p>
</div>

<div class="topnav">
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
</div>

<div class="row">
<div class="column">
<h2>Column</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet pretium urna. Vivamus venenatis velit nec neque ultricies, eget elementum magna tristique. Quisque vehicula, risus eget aliquam placerat, purus leo tincidunt eros, eget luctus quam orci in velit. Praesent scelerisque tortor sed accumsan convallis.</p>
</div>

<div class="column">
<h2>Column</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet pretium urna. Vivamus venenatis velit nec neque ultricies, eget elementum magna tristique. Quisque vehicula, risus eget aliquam placerat, purus leo tincidunt eros, eget luctus quam orci in velit. Praesent scelerisque tortor sed accumsan convallis.</p>
</div>

<div class="column">
<h2>Column</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet pretium urna. Vivamus venenatis velit nec neque ultricies, eget elementum magna tristique. Quisque vehicula, risus eget aliquam placerat, purus leo tincidunt eros, eget luctus quam orci in velit. Praesent scelerisque tortor sed accumsan convallis.</p>
</div>
</div>

</body>
</html>

Dengan memahami hal di atas kalian dapat mengembangkan skil bahasa CSS untuk pembuatan layout halaman Website. Selamat belajar teknologi programming web!

SHARE YA:

BAGAIMANA CARA MENGETAHUI KECEPATAN LOADING HALAMAN BLOG YANG VALID?

Apakah sekedar cepat pada tampilan PageSpeed Google sudah cukup memperesentasikan keadaan yang sebenarnya? Apakah kecepatan loading itu masih menyisakan pertanyaan bagi para blogger? 

Ya semenjak Google merasa harus mengutamakan halaman mobile dan kecepatan loading sebuah halaman atau situs di jaringan internet dan web, tiba tiba saja orang berlomba lomba menggunakan template yang supercepat agar setiap konten mereka cepat terindex oleh Google. Padahal Google juga mensyaratkan sebuah konten yang 'canonic', terutama bagi mereka yang mempergunakan template AMP.

Well kita mulai dari pertanyaan: Situs mana sih yang mempergunakan template paling cepat menurut GTMetrix? Oke paling tidak telah dapat dijadikan standar kecepatan.

Ya salah satunya GiftOfspeed.com. Terlebih dahulu kita beri gambaran sedikit perihal situs yang satu ini. Ia adalah halaman berisi tool untuk mengoptimalkan suatu halaman web, padanya kita dapat melakukan hal hal diantaranya sebagai berikut:

• Menguji kecepatan blog/website
• Mengkompres halaman blog Gzip
• Mengoptimalkan CSS
• Mengkompress CSS
• Mengkompress JS
• Masukan,atau teknik mempercepat loading halaman web
• dan masih sangat banyak lagi 

Ia menuliskan konten konten berisi sumber kode dan atribut yang cukup memperumit kecepatan sebuah halaman yang menanggung beban konten konten seperti itu. Namun sangat mengagumkan skor kecepatan halaman situs tersebut di GTMetrix adalah 100, bahkan YSlownya juga 100.

Kita sedang membahas kecepatan sebuah template, dalam hal ini penggunanya yakni situs giftofspeed ini nyaris memiliki kecepatan yang sempurna, tadinya saya terkagum kagum dengan halaman blognya mbak Igniel, kali ini saya berpaling pada giftofspeed. Jadi setelah mengoptimalkan kecepatan template milik kami editblogtema kami melakukan perbandingan pictorial sebagai berikut:

1. UNTUK SITUS GiftOfSpeed.com:

Situs GiftOfSpeed memiliki skor kecepatan yang fantastis pada pengukuran PageSpeedInsight, untuk kecepatan mobile yakni jika situs tersebut di akses melalui perangkat hape nilai skornya dalah 99, nyaris sempurna, sedangkan untuk skor kecepatan desktopnya adalah 100. Tapi tunggu, ternyata pada pengujian menggunakan parameter kecepatan Data Web Inti Google walaupun halaman mobile dan desktopnya sudah mencapai skor setinggi itu giftofspeed TIDAK LULUS!

Saya sempat kepo menguji halaman blog mbak Igniel dengan skor kecepatan sebagai berikut:

• Mobile: 96
• Desktop: 99

Untuk mobile igniel.com tidak lulus pengujian Data Web Inti, namun untuk skor kecepatan Desktop ia dinyatakan LULUS. Jadi masih keren halaman igniel.com dong.

2. UNTUK SITUS EDITBLOGTEMA.NET

Untuk memenuhi rasa ingin tahu tentunya kami juga berusaha untuk cepat dan valid dong. 

Data kecepatan template editblogtema adalah sebagai berikut:

1. Mobile 94
2. Desktop 100

Namun ternyata loading Mobile pada pengujian kecepatan Data Web Inti Google di nyatakan LULUS, sedangkan untuk Desktop dinyatakan TIDAK LULUS!

BAGAIMANA KITA MELIHAT VALIDASI-NYA?

Masuk saja ke Google webmaster bagian console, pilih Data Web Inti seperti terlihat pada gambar berikut:

Setelah mengklik data web inti kalian akan di arahkan ke halaman datanya, dan data tersebut menunjukan halaman mobile editblogema memang valid untuk halaman mobile dengan predikat BAIK  dan NOL kesalahan.

Namun apa yang terjadi pada penggunaan halaman Desktop? ternyata masih kuning alias belum baik. Walaupun tidak buruk hal ini cukup membuat kami sakit kepala.

Jadi template editblogtema masih butuh perbaikan pada performa desktopnya di banding dengan mobile. Ini tentu saja rahasia Google dalam memvalidasi kecepatan loading sebuah halaman blog. kami telah melakukan perbaikan khusus untuk desktop, mungkin butuh waktu beberapa hari sebelum Google Webmaster menyatakannya sebagai VALID.

Kesimpulan:

Cara agar template blogger menjadi fast loading adalah:

1. Kompress HTML, CSS, Javascript, kalian dapat menggunakan tool tool compressor yang tersedia pada halaman GiftOfSpeed.com. Atau pada situs situs yang serupa.
2. Hal hal yang dapat kita hindari adalah: Jika tidak benar benar perlu jangan gunakan javascript.
3. Tombol berbagi dapat di buat hanya dengan CSS/HTML/XML.
4. Jika tidak benar benar penting hindari memasang gadget follower pada template blog.
5. Jika ingin menggunakan ikon sebaiknya hindari pemakaian font awesome, sebagai gantinya gunakan ikon SVG saja.
6. Font style juga cukup memberatkan loading dan menyakiti kecepatan loading blog karena ia mengharuskan kita meng'embed' script ke dalam templat.
7. Sebaiknya jika menyertakan gambar, gunakan format webp ketimbang menggunakan JPG, JPEG dan format lama lainnya. 

Ternyata kecepatan juga harus di uji validitasnya, kadang kecepatan bisa saja berbentuk manipulatif, hanya pada test permukaan tool saja. Kecepatan loading sejatinya terkait oleh banyak hal: kemampuan membawa dan memaparkan semua komponen yang harus di bawa serta dalam kecepatan itu sendiri secara menyeluruh.

Dan kecepatan sebuah situs itu harus nyata dan berdampak, bukan sekedar teoritis.

karena jangan sampai ternyata beberapa template 'cepat' tampak hanya seperti memiliki jargon kecepatan namun berbeda pada realitasnya, jadi: Harus di validasi.

Ikuti terus trik, tips, teknik hack dan kabar terupdate dari blog ini! Share:

SHARE YA:

2020 DESAIN TEMPLATE WAJIB MOBILE FRIENDLY

Quality Templates. Hari segini bagi siapa yang sedang membangun halaman website (termasuk blogging, karena blogger itu juga adalah website) maka mereka harus memperhatikan satu hal :
Halaman web harus mobile!

antar muka mobile template notable

Mobile dalam istilah web adalah perangkat genggam atau mudah di bawa kemana mana, jangan salah mendefinisikannya, karena ada saja orang suka usil bahas hal hal sepele kayak salah satu admin blog ini he he he...secara umum di masa lalu orang mendefinisikan mobile dengan istilah:

 let's see! it is a mobile canteen (Lihatlah! Itu kantin yang berpindah pindah)

Jadi mobile pada zaman dulu, sebelum perangkat genggam hadir di dalam genggaman manusia adalah segala sesuatu dalam bentuk properti bergerak yang dapat dan mudah di bawa berpindah pindah, atau segala sesuatu yang dapat bergerak dan dapat di pindah pindah dengan mudah. Istilah zaman now: Sangat mobile!

Sekali lagi dalam istilah web desain mobile berarti perangkat mobile, bisa ponsel atau smartphone atau hape, bisa tablet bahkan laptop super tipis. Akan tetapi karena web berorientasi kepada banyak kegiatan dan manusia membutuhkan mobilitas yang sangat tinggi, maka istilah mobile-pun melekat pada perangkat genggam yakni: Hape, ponsel atau smartphone.

PROYEK GOOGLE

Nah demi mengejar trend ini Google membuat proyek AMP (Accelaration Mobile Page) dimana halaman web di optimalkan kecepatan, performa, dan antarmukanya pada layar hape sehingga membuat pengguna nyaman mengaksesnya. Jadi memang demikian tuntutan zaman. Bayangin saja menurut TEKNO:

Pada tahun 2016 yang lalu, berdasarkan survei  yang dilakukan UC Browser, terdapat 95,4 persen pengguna internet di Indonesia membaca konten berita dari smartphone.

Kemudian sebanyak 45,9 persen mengakses berita dari televisi, hanya tinggal 15,9 persen dari majalah atau koran, 15,3 persen dari komputer, baik desktop maupun laptop serta 4,7 persen mengakses berita dari radio. Trend membaca konvensional ini terus saja menyust dari tahun ke tahun. Zaman sudah tidak memungkinkan lagi orang untuk kembali kemasa lalu.

Bayangin! Survey ini setali tiga uang dengan survey survey lainnya, yang membuat kita harus waspada adalah hanya tinggal 15,3% pengguna membaca di internet menggunakan desktop dan latop! Pantesan pada stats di dasbor saya, terkadang hanya 12% editblogtema di baca atau di kunjungi melalui perangkat komputer termasuk desktop dan laptop, sisanya berasal dari pengguna mobile.

Bayangkan betapa besar potensi halaman mobile mendapatkan pengunjung dan berapa kerugian halaman web yang seharusnya bagus namun karena mengabaikan akses mobile, harus kehilangan kesempatan (baca: keberuntungan) karena halaman tersebut hanya nayaman apabila di akses melalui halaman desktop, laptop atau notebook?

Belum lagi seberapa besar peluang bisnis yang kita dapatkan dari sekian milyar manusia di muka bumi yang mengunjungi halaman web hanya melalui ponsel? Apa yang terjadi sesungguhnya adalah begini:

Algoritma terbaru Google (Bert) sangat memahami manusia, input tersebut yang dipergunakan oleh Google memberikan kita kesempatan agar mengoptimalkan halaman web atau blog kita salah satunya adalah dengan mengganti template yang buruk (tua dan tidak sesuai lagi dengan zaman) dengan template terbaru yang lebih responsive dan mobile friendly. Dan keharusan ini berdampak langsung terhadap usaha kita di dunia web. Jika kita sedikit mau meluangkan waktu untuk memperhatikan dan mempelajari situs situs besar dan sukses di tanah air seperti kompas, kaskus, tribun mereka sudah terlebih dahulu menggunakan halaman yang sangat mobile friendly.

Mereka ini sangat di sukai oleh google dan tidak pernah repot repot mikirin teknik SEO segala macam. Bagi situs yang mengutamakan konten berita original seperti mereka teknik SEO Neil Patel tidak berguna dan masuk ke tong sampah! Demikian juga DA dan PA mereka gak perlu sakit kepala toh backlink mereka banyak, kompas saja dengan mudah dapat DA sampai lebih dari 80-an, padahal mereka tidak pernah susah mikir mencarinya.

Dan bisnis mereka berkembang bersama dengan teknik itu, akses perangkat mobile dan membuat konten, tidaklah mengherankan mengapa pengunjung atau visitor mereka begitu masif, adalah karena mereka telah memenuhi seluruh syarat dan prasyarat website modern. Dan untuk melakukan hal tersebut samasekali tidak rumit. Buat halaman web kita lebih mobile friendly.

DESAIN TEMPLATE BLOG HARUS MOBILE FRIENDLY

Dan itulah sebabnya mengapa desain sebuah template harus mobile, kami mulai menggunakan tool responsive untuk melakukan pengujian template agar menjadi mobile friendly pada saat dipergunakan, dan beberapa tool online telah tersedia gratis, namun hanya tiga tool ini yang paling kami rekomendasikan karena antarmuka dan tampilannya yang sederhana dan mudah di pergunakan. Tiga tool tersebut adalah:

1. DESIGNMODO.COM
Antarmukanya lengkap. Kita dapat mengetikan alamat atau URL blog kita ke dalam kotak dialog yang tersedia pada menubar yang berwarna ke biruan diatas halamannya dan dengan menekan 'enter' pada keyboard kita akan melihat seperti apa tampilan halaman web kita pada segala ukuran layar peragkat.

tampilan tool designmodo

Tool ini rekomen banget, nyaris memiliki berbagai jenis ukuran layar untuk pengujian desain template kita. Perhatikan saja pada menubar kebiruan diatas halamannya terletak sebelah kanan terdapat tool yang apabila di klik dapat menentukan pilihan layar seperti apa blog akan di tampilkan. Tidak perduli layar desktop yang gede, laptop, tablet hingga berbagai ukuran layar hape.

Dan kita dapat membuka dan mengeksplorasi halaman blog melalui layar layar sentuh virtual tesebut.

2. AM I RESPONSIVE?

Tool yang satu ini simple, kita masukan URL atau alamat blog kita ke dalam kotak dialog yang tersedia di bawah image perangkatnya lalu menekan 'enter' pada keyboard atau 'GO!' pada ujung kotak dialog, maka kita akan melihat seperti apa tampilan halaman blog kita melalui 4 pukuran layar perangkat yang berbeda sekaligus!

tampilan halaman amiresponsive

Dan kita dapat membuka dan mengeksplorasi halaman blog melalui layar layar sentuh virtual tesebut.

3. RESPONSINATOR.COM
Cara menggunakannya hampir mirip dengan tool DESIGNMODO.COM. Sama sama memiliki menubar di atas halamannya. Bedanya designmodo memiliki perangkat lebih lengkap, sedangkan responsinator lebih mengutamakan mobile.

tampilan tool responsinator

Kita dapat mengetikan alamat atau URL blog kita ke dalam kotak dialog yang tersedia pada menubar yang berwarna hijau gelap diatas halamannya dan dengan menekan 'enter' pada keyboard kita akan melihat seperti apa tampilan halaman web kita pada beberapa jenis ukuran layar peragkat mobile.

SHARE:

SHARE YA:

JANGAN ALERGI MEMBACA DAN BELAJAR DI INTERNET!

working and study online

"Seribu satu cara bekerja dan mendapatkan uang di internet" suatu hari teman chatting saya memotivasi. Dia salah seorang teman facebook saya yang sekarang menjadi seorang pelukis mendunia melalui iPad tuanya. Sebut saja namanya Jaime.

Waktu itu tahun 2013, dan saya masih bekerja di tempat yang sama sampai sekarang, sebuah perusahaan asing dan membayar saya bulanan, tapi sampai kapan?

CERITA DARI YAHOO MESSENGER DI PENGHUJUNG TAHUN 2013

Saya menunggu dia mengetik di layar Macbook...Itu masih Yahoo Messenger. Itu adalah salah satu aplikasi masa muda kami yang penuh kenangan, betapa tidak, walaupun dia tinggal di Spanyol dan saya di Indonesia, ikatan persahabatan telah terjalin begitu mendalam diantara kami.

"Setelah suatu hari kamu tidak produktif lagi," sambungnya,  "Kamu akan kehilangan cara untuk tetap menghasilkan uang di hari tua. Orang bisa saja berkata, di hari tua kita tidak terlalu membutuhkan uang.

Siapa bilang? Justeru pada waktu itu di perlukan persiapan lebih untuk menutupi kekurangan kita ketika masa muda dan segala kekuatan telah berlalu. Misalnya, jika dulu dan sampai saat ini kita masih bisa berbuat banyak karena fisik kita masih kuat, kelak kita tetap dapat melakukan sesuatu yang lebih besar secara finansial"

"Saya memiliki seorang paman," tambahnya lagi, "Dia dulu memiliki posisi tinggi di sebuah perusahaan, gajinya besar. Namun kini telah pensiun dan uangnya telah habis untuk membiayai anak anak bersekolah. Anak anak itu kini telah sibuk dengan kehidupan mereka masing masing...eits, jangan menyalahkan moral karena sepanjang waktu cerita begini telah terulang, hanya saja jarang orang yang menyadarinya Beberapa anak pamanku jebolan sekolah agama, tidak membuatnya lebih baik daripada yang lain.

Kita hanya bisa memberikan harapan, doa dan bekal pendidikan agar anak anak kelak hidup, kesalahan kita percaya kepada apa yang telah kita lakukan dengan melihat contoh yang baik daripada nasib keluarga lain. Hari ini mereka masih kecil kecil dan manis manis. Buatlah yang terbaik untuk mereka. Masa depan itu berbeda daripada masa lalu.

Pamanku itu kini hidup seperti sebatang kara, untungnya badan kurus, kulit keriput dan rambut dipenuhi uban itu selalu menyimpan kesabaran dan kebijaksanaan. Kini dia bekerja mengajar bahasa asli dengan bayaran ala kadarnya. Dia sering dengan mata bersinar sinar bercerita tentang kejayaannya di masa lalu ketika bekerja dan kirim ke mancanegara," tuturnya.

Saya menyimak penuturannya itu, saya kenal dia bukan seorang pembual, tapi seorang yang selalu gigih mencari cara untuk mengamankan masa depannya dan berbagi dengan orang lain bagaimana merencanakan kehidupan dalam jangka waktu yang panjang.

Saya sendiri benci dengan setiap cerita masa lalu karena dia menjadi hal yang paling menyedihkan buat hari nanti, saya selalu menyembunyikan masa lalu sebagai sebuah misteri dan ingin hal tersebut hanya menjadi sebuah privasi, saya ingin menuntut orang yang mengorek masa lalu saya secara hukum..he he he jika memungkinkan. Saya juga benci di photo semenjak hal tersebut mempengaruhi privasi kegiatan saya di internet.

Saya melihat tanda titik..titik..titik di layar tandanya dia sedang mengetik:

"Saya mengenal lelaki tua lain yang selalu tersenyum di ujung jalan tempat tinggal kami, hidup dengan beberapa orang pembantu dan sepucuk surat wasiat di kantor notaris. Saya baru menyadari dia adalah seorang penulis. Di internet kita dapat menulis di Wattpad dan mendapatkan bayaran. Kita dapat mengerjakan proyek membuat aplikasi web, desain dll, tidak perduli kamu berusia 100 tahun selagi kamu masih mampu kamu tidak akan di batasi oleh "pensiun" fisik kita dapat dilatih untuk melewati batas kemampuan kita, begitu juga dengan kesehatan akal dan pikiran"

"Saat saya menyadari ketrampilan yang saya miliki dalam melukis, saya mulai membuat halaman web, menawarkan ketrampilan saya dan saya tahu ini akan menjadi aset yang berharga saya karena kita akan bahagia melakukan pekerjaan yang memang kita cintai"

NAMUN TIDAK BOLEH BERHENTI BELAJAR

Saya tidak pernah berhenti belajar ketika internet memberikan banyak pilihan, buku buku yang biasanya harus di beli di toko buku dengan harga mahal, kini saya dapatkan dengan sangat lengkap di internet tanpa membayar sepeserpun. Di forum mereka yang telah membeli tidak segan segan membagikan copy buku buku berkualitas tinggi kepada sesama anggota. Saya pernah mendapat sebuah buku hampir seribu halaman tebalnya yang di kalau di toko harganya hampir satu jutaan (RP. 9,999,999,00,-) benar benar gratis setelah di berikan copynya. Saya membacanya sampai tamat melalui tablet.

study and working online

Saya telah berhenti meggunakan kertas sejak tahun 2015 sebagai media informasi dan beralih ke internet, hasilnya memang jauh lebih cepat. Perubahan ini dapat mengurangi penggunaan kertas, mengurangi penebangan hutan, dan menjaga kelestarian lingkungan.  Sebaliknya anggapan membaca melalui internet itu tidak nyaman itu tidak masuk akal, medianya semakin maju dan dampak kesehatannya ( radiasi ) telah semakin minim berkat kemajuan teknollogi yang memberikan inovasi baru terus menerus. Saya termasuk yang meramalkan bahwa koran dan buku kertas memang akan lenyap di masa depan.

APA YANG PALING WORTH UNTUK DI PELAJARI DI INTERNET?

Ada teman yang ingin beternak belut dia menyaring informasi dari internet dan tidak membeli buku dalam bentuk kertas. Ada yang telah sukses berbisnis online. Ada yang sukses menjadi penulis di aplikasi web WattPad dan menghasilkan uang tetap dari sana.

Internet juga telah membuka mata kita bahwa tidak ada yang abadi. Perubahan yang semakin cepat harus kita imbangi dengan penguasaan informasi. Produk teknologi murah biasanya tidak dapat bertahan lebih dari 6 bulan setelah itu akan di gantikan dengan produk baru yang lebih inovatif ketimbang pendahulunya. Bayangkan betapa ruginya kalian dalam beberapa hal jika kalian hanya mengandalkan buku: Terlambat menyikapi perubahan, terlambat pembaharuan informasi dari isi buku, atau jangan jangan kalian sedang membaca informasi yang telah usang!

Bidang jasa juga tumbuh subur secara online, misalnya orang dapat memberikan les privat, desain gambar, game dan desain web. Kita tahu peranan mesin pencari, browser dan jaringan penghantar data. Semua itu menjadikan bisnis ini diam diam sebenarnya terkendali dan terpusat pada suatu tempat: Server server besar dan massive.

Saya sendiri lebih tertarik kepada menulis, desain, aplikasi web dan hal hal sejenisnya. Salah satu hal yang masih sangat "worth" hingga kini adalah membangun website, blog dan halaman landing usaha. Kita tahu gunanya adalah untuk menjangkau orang orang dan informasi sekaligus.

Kalau soal belajar terdapat banyak informasi, lembaga kursus online yang bersedia mengajarkan kita tanpa di pungut bayaran apa apa. Modal kita hanyalah perangkat dan quota internet. Ada kisa sukses seorang ayah yang telah pensiun dan menderita kelumpuhan namun masih memiliki anak kecil dia membeli laptop dan paket internet lalu memberikan kepada anaknya dan mendampinginya berjam jam setiap hari browsing di situs situs kursus online programming.

Hari ini anak tersebut telah menjadi seorang developer software dan game paling sukses di dunia. Tanpa sekolah formal. Saya hanya ingin memberikan contoh suatu peluang yang kadang tidak terbayangkan manfaatnya. Disamping itu semua hal memiliki sisi baik dan buruk dan tidak terkecuali internet.

Kesalahan fahaman sering terjadi karena ketidak tahuan, misalnya saya sering mendengar keluhan:

"Mata saya lelah dan agak kurang penglihatan karena layar gadget,"

Mungkin anda benar, tapi keliru. Dulu karena banyak membaca buku orang orang menunjuk kepada para remaja berkacamata tebal. Membaca bisa membuat mata minus? Mungkin karena huruf huruf tidak bergerak dan tidak membuat kornea mata bergerak datar dan tidak secara fluktuatif. Tetapi membaca di tablet?

Efek mata memandang layar dengan gerakan animasi kadang sama dengan kegiatan mata melihat atau memandang jarak dekat dan jarak jauh. Jadi mata tetap beraktifiktas pada gambar 3 dimensi bergerak seperti dunia nyata. Radiasi? Tidak ada bukti radiasi internet merusak saraf mata dan otak. Teknologi juga sudah semakin berkembang untuk mengurangi dampak negetif layar gagdet terhadap kesehatan secara langsung.

Dunia memang harus berubah lebih maju dan lebih lucu: Karena ibu ibu dan bapak bapak berteriak di wall facebook: "Anak anak zaman sekarang lebih banyak membuka internet tidak kayak kita zaman dulu apa dunia sudah mau kiamat ya"

Tidak mereka sadari wall facebook itu biangnya internet?

Tolong di share ya..

SHARE YA: