Semantic HTML [Kembali Ke Basic]
Sebenernya dipostingan terdahulu tanpa anda sadari saya sering nulis tentang beberapa tag yang mengarah kepada pembahasan Semantic HTML ini, Contohnya postingan saya yang berjudul: Penulisan Bold Dan Italic Pada Mark Up HTML5. Tapi memang, secara khusus saya belum menjelaskan apa itu semantic HTML karena lagi-lagi saya ingin anda menyukai HTML dengan versi simplenya dulu lewat Tutorial yang tinggal anda ikuti, sebelum anda mengenal unsur-unsur dasarnya, maklum pemikiran saya tentang ini memang agak terbalik dari kebanyakan orang yang mungkin juga menuliskan pembahasan tentang Semantic ini versi mereka :) karena buat saya, dasar memang penting untuk diletakkan diawal pengenalan, tapi menumbuhkan kesukaan anda itu jauh lebih penting, karena klo anda udah terlanjur suka, pasti akan gampang untuk anda melanjutkan pembahasan tentang ini sekalipun memang kita harus muter kebelakang lagi hhe... :)
Apa itu Semantic HTML? karena pengertian tentang Semantic HTML luar biasa banyak klo anda cari di Google, jadi saya ambil pengertian versi Wikipedia aja ya hhe... Menurut Wikipedia, Semantic HTML adalah cara penyusunan tag-tag HTML yang tepat yang bisa mewakili arti atau maksud yang sebenarnya dari isi konten (artikel) web/blog yang disajikan. Atau klo saya lebih suka mengatakan bahwa Semantic HTML adalah cara kita mengungkapkan Emosi yang terkandung dalam tulisan di Web/Blog kita lewat bentuk-bentuk yang mudah dipahami orang lain, sekalipun dengan tag yang mungkin tidak mereka pahami. Contoh: untuk menekankan sebuah kata, biasanya saya lebih suka membuatnya tercetak tebal (bold) atau mungkin juga tercetak miring (italic), dan dengan menggunakan Cetak tebal atau Cetak miring dengan sendirinya pembaca akan tau bahwa itu merupakan kata yang kita tekankan dalam postingan ini, dan mereka pun pasti akan bisa merasakan emosi dari postingan kita. Sekalipun mereka tidak akan pernah perduli terhadap tag apa yang kita gunakan untuk membuat tulisan-tulisan itu tercetak tebal ataupun miring. Nha, disini letak Semantic HTML sebagai dasar perlu kita ketahui, karena klo pengembangan terhadap Markup HTML semakin merangkak maju, masa iya kitanya tetep stay dengan aturan bawaan editor Entri kita hhe... klo untuk pengguna Wordpress sih enak, klo Markup ganti pasti mereka bisa secara langsung menikmatinya di Editor mereka lewat rilis Versi Wordpress terbaru mereka, soalnya saya juga pengguna Wordpress, tapi untuk kita yang numpangnya di Blogspot? klo kita gak bikin sendiri ya tetep gak akan berubah haha... padahal di Search Engine, mau kita tebelin pun mereka gak akan pernah ngerti maksud tebel itu tanpa tag yang mereka ketahui sebagai penekanan karena yang mereka pake kan emank bahasa mesin bukan bahasa manusia :) Atau bahasa gampangnya, dalam melihat dan mengerti postingan yang kita buat Search Engine justru berpikir terbalik dari pada para pengunjung blog kita, karena Search Engine memang membaca maksud tulisan kita lewat tag yang kita buat, bukan lewat visual yang dapat terlihat seperti cetak tebal, dan lainnya.
Contoh simplenya adalah tag untuk menebalkan tulisan yang secara default sampai kini masih menggunakan aturan <b> Elemen </b>, padahal klo kita ngomongin HTML5, tag yang dipake untuk cetak tebal udah berubah menjadi <strong> Elemen </strong>, yupz sekalipun unsur <b> memang masih tetap terlihat dengan cetak tebalnya, cuma klo kita ngomonginnya ke masalah SEO, bisa saya pastikan unsur <strong> akan lebih kuat karena mereka (Search Engine) akan memahaminya sebagai Hirarki utama mereka, bukan lagi hanya sekedar prosa normal tanpa penekanan akan pentingnya unsur yang terkandung didalamnya. Cuma ya balik lagi, untuk anda yang terbiasa menulis sebuah postingan dengan menggunakan Versi Compose atau tulis, mungkin anda akan langsung males klo disuruh beralih nulis di Versi edit HTML-nya hhe... tapi klo emank anda merasa Semantic HTML ini perlu, ya nggak ada salahnya klo saya menganjurkan anda untuk menggunakan Edit HTML tiap kali nulis postingan hhe... biarpun jujur saya sendiripun lebih suka pake Bawaan Blogspot, karena percaya atau nggak unsur <strong> yang kita gunakan memang akan kembali ke unsur <b> setelah publish, gak tau kenapa hal itu dilakukan Blogspot, padahal selama ini yang paling gencar menggunakan HTML5 justru Google :) tapi biarpun begitu, gak ada salahnya menurut saya anda tetap menulis di Edit HTML itung-itung anda memahami tag-nya klo suatu saat nanti anda gak nemuin button untuk cetak tebal di editor lain haha... :)
Dan sebenernya, lagi-lagi tanpa anda sadari penggantian Meta tag yang anda lakukan terhadap Judul Blog dan Judul postingan anda, contohnya bisa baca postingan saya yang berjudul: Cara Merubah Title Blog Dengan Title Postingan, sebenernya mengacu pada Konsep Semantic HTML ini, karena cara ini bisa dibilang adalah cara yang benar untuk mengenalkan judul halaman kita kepada Search Engine, dari pada tetap membiarkan Search engine membaca Judul Blog anda terlebih dahulu saat melakukan Index halaman. But, sayangnya gak ada satupun Blogger yang ngasih Tutorial tentang ini yang secara rinci memberitahukan alasan penggantian Meta Tag ini mengacu pada Semantic HTML, entah karena mereka gak tau atau karena mereka males ngasih tau kepada anda hhe... :)
Dan sama pentingnya dengan unsur <title> yang akan terindex lebih dulu oleh Search Engine seperti pembahasan diatas, unsur lain yang gak kalah penting untuk diperhatikan adalah Heading, itu kenapa beberapa Web Developer sangat-sangat memperhatikan Heading di Blog mereka, bahkan beberapa justru sangat suka membuat judul postingan mereka menggunakan h1 ketimbang h2 yang secara default sudah menjadi syarat umum yang digunakan pada template apapun baik itu Wordpress, Blogspot, Joomla dan lainnya, kenapa saya katakan sudah menjadi Syarat Umum? karena h1 biasanya hanya dipakai untuk judul Blog, bukan untuk judul postingan :) dan penggunaan h1 untuk judul blog serta penggunaan h2 untuk judul postingan pun sebenernya sudah mengacu pada kaidah Semantic yang benar, cuma lagi-lagi klo mau disambunginnya sama SEO, memang h1 akan lebih diperhatikan oleh si Mbah dari pada h2, h3, h4 dan h5 serta h6 yang jarang sekali digunakan.
Cuma, ada tapinya lagi, biarpun secara SEO h1 memang lebih diperhatikan, tapi ya balik lagi klo kita menggunakan h1 untuk judul postingan kita, menurut saya pribadi justru malah akan menimbulkan kerancuan, karena Search Engine justru membaca bahwa kita memiliki banyak headline, sedangkan biasanya headline itu ya cukup satu, cuma judul blog kita doank. jadi saran saya, anda gakperlu merubah Judul postingan anda ke h1, atau dengan kata lain, ya tetep aja judul postingan di h2 dan judul blog di h1 :)
Dan hal ketiga yang juga gak kalah penting dalam mempelajari Semantic HTML ini adalah, bagaimana anda menerapkan aturan ini pada konten atau postingan yang anda usung, atau dengan kata lain apa penekanan yang anda lakukan agar Search Engine pun bisa membaca penekanan itu sebagai sesuatu yang harus mereka pentingkan dari konten anda. Misal: gunakan tag
Apa itu Semantic HTML? karena pengertian tentang Semantic HTML luar biasa banyak klo anda cari di Google, jadi saya ambil pengertian versi Wikipedia aja ya hhe... Menurut Wikipedia, Semantic HTML adalah cara penyusunan tag-tag HTML yang tepat yang bisa mewakili arti atau maksud yang sebenarnya dari isi konten (artikel) web/blog yang disajikan. Atau klo saya lebih suka mengatakan bahwa Semantic HTML adalah cara kita mengungkapkan Emosi yang terkandung dalam tulisan di Web/Blog kita lewat bentuk-bentuk yang mudah dipahami orang lain, sekalipun dengan tag yang mungkin tidak mereka pahami. Contoh: untuk menekankan sebuah kata, biasanya saya lebih suka membuatnya tercetak tebal (bold) atau mungkin juga tercetak miring (italic), dan dengan menggunakan Cetak tebal atau Cetak miring dengan sendirinya pembaca akan tau bahwa itu merupakan kata yang kita tekankan dalam postingan ini, dan mereka pun pasti akan bisa merasakan emosi dari postingan kita. Sekalipun mereka tidak akan pernah perduli terhadap tag apa yang kita gunakan untuk membuat tulisan-tulisan itu tercetak tebal ataupun miring. Nha, disini letak Semantic HTML sebagai dasar perlu kita ketahui, karena klo pengembangan terhadap Markup HTML semakin merangkak maju, masa iya kitanya tetep stay dengan aturan bawaan editor Entri kita hhe... klo untuk pengguna Wordpress sih enak, klo Markup ganti pasti mereka bisa secara langsung menikmatinya di Editor mereka lewat rilis Versi Wordpress terbaru mereka, soalnya saya juga pengguna Wordpress, tapi untuk kita yang numpangnya di Blogspot? klo kita gak bikin sendiri ya tetep gak akan berubah haha... padahal di Search Engine, mau kita tebelin pun mereka gak akan pernah ngerti maksud tebel itu tanpa tag yang mereka ketahui sebagai penekanan karena yang mereka pake kan emank bahasa mesin bukan bahasa manusia :) Atau bahasa gampangnya, dalam melihat dan mengerti postingan yang kita buat Search Engine justru berpikir terbalik dari pada para pengunjung blog kita, karena Search Engine memang membaca maksud tulisan kita lewat tag yang kita buat, bukan lewat visual yang dapat terlihat seperti cetak tebal, dan lainnya.
Contoh simplenya adalah tag untuk menebalkan tulisan yang secara default sampai kini masih menggunakan aturan <b> Elemen </b>, padahal klo kita ngomongin HTML5, tag yang dipake untuk cetak tebal udah berubah menjadi <strong> Elemen </strong>, yupz sekalipun unsur <b> memang masih tetap terlihat dengan cetak tebalnya, cuma klo kita ngomonginnya ke masalah SEO, bisa saya pastikan unsur <strong> akan lebih kuat karena mereka (Search Engine) akan memahaminya sebagai Hirarki utama mereka, bukan lagi hanya sekedar prosa normal tanpa penekanan akan pentingnya unsur yang terkandung didalamnya. Cuma ya balik lagi, untuk anda yang terbiasa menulis sebuah postingan dengan menggunakan Versi Compose atau tulis, mungkin anda akan langsung males klo disuruh beralih nulis di Versi edit HTML-nya hhe... tapi klo emank anda merasa Semantic HTML ini perlu, ya nggak ada salahnya klo saya menganjurkan anda untuk menggunakan Edit HTML tiap kali nulis postingan hhe... biarpun jujur saya sendiripun lebih suka pake Bawaan Blogspot, karena percaya atau nggak unsur <strong> yang kita gunakan memang akan kembali ke unsur <b> setelah publish, gak tau kenapa hal itu dilakukan Blogspot, padahal selama ini yang paling gencar menggunakan HTML5 justru Google :) tapi biarpun begitu, gak ada salahnya menurut saya anda tetap menulis di Edit HTML itung-itung anda memahami tag-nya klo suatu saat nanti anda gak nemuin button untuk cetak tebal di editor lain haha... :)
Dan sebenernya, lagi-lagi tanpa anda sadari penggantian Meta tag yang anda lakukan terhadap Judul Blog dan Judul postingan anda, contohnya bisa baca postingan saya yang berjudul: Cara Merubah Title Blog Dengan Title Postingan, sebenernya mengacu pada Konsep Semantic HTML ini, karena cara ini bisa dibilang adalah cara yang benar untuk mengenalkan judul halaman kita kepada Search Engine, dari pada tetap membiarkan Search engine membaca Judul Blog anda terlebih dahulu saat melakukan Index halaman. But, sayangnya gak ada satupun Blogger yang ngasih Tutorial tentang ini yang secara rinci memberitahukan alasan penggantian Meta Tag ini mengacu pada Semantic HTML, entah karena mereka gak tau atau karena mereka males ngasih tau kepada anda hhe... :)
Dan sama pentingnya dengan unsur <title> yang akan terindex lebih dulu oleh Search Engine seperti pembahasan diatas, unsur lain yang gak kalah penting untuk diperhatikan adalah Heading, itu kenapa beberapa Web Developer sangat-sangat memperhatikan Heading di Blog mereka, bahkan beberapa justru sangat suka membuat judul postingan mereka menggunakan h1 ketimbang h2 yang secara default sudah menjadi syarat umum yang digunakan pada template apapun baik itu Wordpress, Blogspot, Joomla dan lainnya, kenapa saya katakan sudah menjadi Syarat Umum? karena h1 biasanya hanya dipakai untuk judul Blog, bukan untuk judul postingan :) dan penggunaan h1 untuk judul blog serta penggunaan h2 untuk judul postingan pun sebenernya sudah mengacu pada kaidah Semantic yang benar, cuma lagi-lagi klo mau disambunginnya sama SEO, memang h1 akan lebih diperhatikan oleh si Mbah dari pada h2, h3, h4 dan h5 serta h6 yang jarang sekali digunakan.
Cuma, ada tapinya lagi, biarpun secara SEO h1 memang lebih diperhatikan, tapi ya balik lagi klo kita menggunakan h1 untuk judul postingan kita, menurut saya pribadi justru malah akan menimbulkan kerancuan, karena Search Engine justru membaca bahwa kita memiliki banyak headline, sedangkan biasanya headline itu ya cukup satu, cuma judul blog kita doank. jadi saran saya, anda gakperlu merubah Judul postingan anda ke h1, atau dengan kata lain, ya tetep aja judul postingan di h2 dan judul blog di h1 :)
Dan hal ketiga yang juga gak kalah penting dalam mempelajari Semantic HTML ini adalah, bagaimana anda menerapkan aturan ini pada konten atau postingan yang anda usung, atau dengan kata lain apa penekanan yang anda lakukan agar Search Engine pun bisa membaca penekanan itu sebagai sesuatu yang harus mereka pentingkan dari konten anda. Misal: gunakan tag
<p> di setiap paragraf, <blockquote> di setiap kutipan, <table> bila perlu menggunakan tabel, <code> atau <pre> di setiap list kode HTML, CSS, PHP, ataupun kode pemrograman yang lain, <ol> atau <ul> untuk setiap daftar, atribut alt untuk setiap gambar, serta <strong> dan <em>Mungjkin itu 3 hal penting yang harus anda tau tentang Semantic HTML ini, biarpun lagi-lagi kembali saya tegaskan bahwa tidak ada kaidah pasti dalam penerapan Semantic HTML, jadi balik lagi urusan Semantic ini pun sebenernya sifatnya Subjektif tergantung masing-masing owner blog yang bersangkutan membuat blog mereka sesemantic mungkin :)
Posting Komentar
Posting Komentar