Pernahkah Anda melihat suatu tulisan yang dicetak miring, tebal, atau bahkan bergaris bawah (underline) ? Jika di aplikasi pengolah kata seperti Microsoft Word Anda hanya tinggal klik menu khusus untuk mengubah format tulisan yang Anda inginkan (formatting).
Tetapi, berbeda halnya jika kita mengubah formatting teks pada saat coding, Anda harus menggunakan tag tertentu untuk mengubahnya. Untuk yang belum tahu apa itu tag, element, dan atribut bisa baca artikel di bawah ini :
Baca : Mengenal Apa Itu Tag, Element, Atribut Beserta Contohnya Pada HTML
Ketika mengatur formatting HTML seperti membuat tulisan miring, tebal maupun underline (bergaris bawah), Anda harus paham tag-tag yang akan digunakan untuk membuat efek font seperti itu. Anda bisa menuliskan kode program di bawah ini pada text editor yang Anda suka. Sekarang mari kita bahas satu persatu :
Cara Membuat Tulisan Miring Dengan Tag <i>
Tag <i> memiliki kepanjangan yaitu italic yang berarti huruf miring. Jika Anda ingin membuat tulisan menjadi miring, Anda bisa menggunakan tag <i> ataupun tag <em>. Untuk perbedaannya akan dibahas di bawah. Sekarang mari kita masuk ke penulisan kode programnya :
[sourcecode language=”plain”]
&amp;lt;i&amp;gt;Ini adalah huruf miring&amp;lt;/i&amp;gt;
[/sourcecode]
Hasilnya adalah sebagai berikut :
Cara Membuat Tulisan Miring Dengan Tag <em>
Tag <em> secara sekilas memiliki fungsi yang sama dengan tag <i>. Dan hasil yang ditampilkan juga sama, yaitu berupa huruf miring. Lihat source code ini :
[sourcecode language=”plain”]
&amp;lt;em&amp;gt;Ini adalah huruf miring&amp;lt;/em&amp;gt;
[/sourcecode]
Dan hasilnya pun sebagai berikut :
Memang secara sekilas tidak ada perbedaan dalam hal visual, tetapi di mata search engine, kedua tag tersebut memiliki perbedaan. Dengan kata lain, tag <i> itu hanya digunakan untuk membuat tulisan miring dan tidak memiliki arti apapun di mata search engine.
Sedangkan tag <em> itu selain membuat tulisan miring, juga memiliki arti di mata search engine. Sebuah kata/teks yang berada di dalam tag <em> itu akan dianggap penting oleh search engine. Ini hubungannya dengan SEO.
Sekilas kalau website Anda bagus dalam sisi SEO maka website Anda akan mendapatkan peringkat yang tinggi di mesin pencari untuk kata kunci tertentu.
Cara Membuat Tulisan Tebal Dengan Tag <b>
Tag <b> itu digunakan untuk membuat tulisan menjadi tebal. Sama halnya dengan tag <strong>. Tetapi tidak memiliki makna di mata search engine. Untuk penulisan kode programnya seperti di bawah ini :
[sourcecode language=”plain”]
&amp;lt;b&amp;gt;Ini adalah tulisan tebal&amp;lt;/b&amp;gt;
[/sourcecode]
Dan hasilnya adalah seperti di bawah ini :
Cara Membuat Tulisan Tebal Dengan Tag <strong>
Sudah dijelaskan di atas, bahwa secara visual tag <b> dengan tag <strong>. Tapi di mata search engine atau mesin pencari, tag <strong> itu memiliki arti yang lebih daripada tag <b>. Seperti halnya tag <em> dan tag <i>. Penulisannya adalah sebagai berikut :
[sourcecode language=”plain”]
&amp;lt;strong&amp;gt;Ini adalah tulisan tebal&amp;lt;/strong&amp;gt;
[/sourcecode]
Dan hasilnya adalah seperti di bawah ini :
Tetapi, SEO sekarang sudah tidak mempertimbangkan hal itu. Walaupun terdapat kata-kata yang penting dalam website, tidak perlu dimasukkan ke dalam tag <em>, <strong>, maupun <ins> karena mesin pencari sudah tahu mana konten yang berbobot mana yang tidak.
Cara Membuat Tulisan Bergaris Bawah Dengan Tag <u>
Tag <u> itu berfungsi untuk memberikan garis bawah/underline pada sebuah tulisan. Langsung saja contoh penulisannya seperti di bawah ini :
[sourcecode language=”plain”]
&amp;lt;u&amp;gt;Ini adalah tulisan underline&amp;lt;/u&amp;gt;
[/sourcecode]
Dan hasilnya adalah sebagai berikut :
Cara Membuat Tulisan Bergaris Bawah Dengan Tag <ins>
Tag <ins> juga memiliki fungsi yang sama dengan tag <ul>. Hanya saja tag <ins> lebih ‘dianggap’ oleh mesin pencari. Tapi balik ke hakikat SEO bahwasannya SEO sekarang sudah tidak perlu menggunakan tag seperti itu. Untuk penulisan kode program tag <ins> seperti ini :
[sourcecode language=”plain”]
&amp;lt;ins&amp;gt;Ini adalah tulisan underline&amp;lt;/ins&amp;gt;
[/sourcecode]
Dan hasilnya sama seperti tag <u>. Sekarang Anda sudah paham kan tentang cara membuat huruf menjadi miring, tebal, dan underline (bergaris bawah) di HTML ?
I’m an experienced SEO Specialist who can grow a website through organic channel. I’m also passionate about digital marketing and web development