Dalam post ini mari kita lihat beberapa default style pada sesebuah element yang anda boleh gayakan. Anda masih boleh merubah style ini sesukanya andai ianya tidak bersesuaian dengan citarasa anda.
List
Gaya penulisan yang bijak menggukan markup List akan tampak lebih mudah dibaca dan kelihatan teratur dimata. Contohya Tun Dr Mahathir dari Chedet.cc; melalui artikel-artikel di blog beliau, Tun Dr Mahathir gemar membahas dan menyampaikan akan sesuatu secara kemas dengan memanfaatkan penggunaan list. Berikut dibawah adalah Bullet List atau secara teknikalnya<ul/>
list element (default style).- List item 1
- List item 2 dengan permalink
- List item 3
- Nested list item 1
- Nested list item 2
- List item 4
Makala berikut adalah Numbered List atau secara teknikalnya
<ol/>
list element:- List item 1
- List item 2
- List item 3
- List item 4
class="underline"
didalam tags <ol/>
, seperti ini → <ol class="underline"/>
:- List item 1
- List item 2
- List item 3
- List item 4
entry content
adalah tidak terlalu banyak bagi memelihara pegangan 'SEO Friendly'. Cukuplah ada H2 dan H3 sebagai tambahan, itupun jika perlu.
Heading Element
PerkataanHeading Element
diatas menggunakan tag <h2/>
. Dan itu adalah tampilan default <h2/>
tag pada template ini (Anda boleh mengubahkan kelak).Subheading Style
Manakala perkataanSubheading Element
diatas menggunakan tag <h3/>
. Dan itu adalah tampilan default <h3/>
tag pada template ini.Standard Blockqoute
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque pharetra velit vel purus. Nunc tempor, urna sit amet euismod elementum, erat tellus auctor erat, non condimentum dui wisi non orci. Nam fringilla leo sed dui. Vestibulum ac elit sit amet diam vehicula scelerisque - Shah Danial
Button
Hanya dengan meletakkan Classclass="the-button"
pada tag, maka jadilah button. Dibawah berikut adalah contohnya:
<span class="the-button"> <a href="#LinkAnda">KLIK SINI</a> </span>
Hasilnya adalah button dibawah:
<code /> dan <pre/>
Bagi blog Tutorial, yang mungkin menyediakan toturial coding dan sebagainya. Text yang mempraktikkan markup<code />
dan <pre />
bukan sahaja lebih ‘SEO Friendly’, malah mudah untuk difahami oleh pembaca anda, kerana ianya kemas.
<pre />
digunakan untuk embed sesebuah coding seperti yang anda boleh lihat pada kotak kuning pada blog ini. Ianya meletakkan banyak kod.
Manakala
<code />
sesuai dikenakan pada code² yang terdapat pada mana-mana perenggan (code yang sedkit). Ikuti contoh perenggan dengan <code />
dibawah:
Sila search <code>#main</code> pada template anda.Hasilnya:
Sila search
#main
pada template anda.
Adakah default font style ini kurang menepati citarasa anda? Usah risau, ubah sahaja semuanya melalui template designer tanpa berhadapan hard coding!