ช่วงนี้ผมกำลังศึกษา (สูบ) ความรู้ด้าน SEO ซึ่งไม่เคยมีมาก่อน ไม่เห็นความสำคัญ สักแค่ว่าอยากจะทำเวป แล้วก็ได้นั่ง modify wordpress theme ให้ http://football.chatza.com ของ @aspgod ด้วย ก็เลยได้ลองวิชากันใหญ่
ดังนั้น content นี้ผมขอ dedicate ให้
@gootum ผู้ให้ความรู้นะครับ
@aspgod เจ้าของ playground ที่วิ่งเล่นได้อย่างสบาย นะครับ
ก่อนอื่นเลยต้องขอออกตัวก่อน อย่างที่บอกว่าเพิ่งศึกษาหาความรู้ ก็เลยเขียนแบบตามความรู้ที่มีนะครับ
เรื่อง SEO ผมคงไม่พูดมาก คร่าว ๆ ก็คือทำยังไงให้ google (หรือ search engine เจ้าอื่น แต่ผมจะเรียกรวม ๆ ว่า google ละกันนะ) หาเวปเราเจอ
@gootum บอกว่า google มองเห็นเวปเราแบบนี้
ก็คือไม่แคร์สื่อ ไม่สนใจ style ใด ๆ ทั้งสิ้น
แล้วไอ่พวก design พวกนี้ล่ะ จะทำยังไง ไอ่ Bundes Liga ด้านบนนั่นก็ image ไอ่ more link ด้านล่างก็ image ใช้ text ก็ไม่สวยงาม หรือ design กับ SEO จะไปกันไม่ได้ ?
แต่จริง ๆ แล้วมันมีวิธี ก็คือ อย่างที่บอก ในเมื่อ google ไม่แคร์ css แต่สนใจ tag H2, สนใจ text บน page เราก็จัดการมันด้วย CSS อย่าง ไอ่ Heading Bundes Liga ด้านบนนั่น ผมก็ทำอย่างนี้
<div id="bundes_liga_header" class="imgHeader">
<h2>Bundes Liga</h2>
</div>
CSS ก็
1
2
3
4
5
6
7
| #bundes_liga_header{
background-image: url(images/bundes_liga.jpg);
}
#bundes_liga_header h2{
margin:0px;
visibility:hidden;
} |
เราก็อย่าได้แคร์ สั่ง visibility:hidden; h2 ซะเลย แล้วก็เอารูปมาแทนเป็น bg (หรือจริง ๆ จะแยกออกมาเป็น img tag ก็ได้นะ)
ส่วนไอ่ link more ด้านล่าง @gootum บอกว่า link ที่ดีไม่ควรจะมีแค่ว่า “มีต่อ” “อ่านต่อ” แต่ต้องบอกว่า ที่ไปต่อน่ะ ไปทำอะไร
มันก็เลยมาลงเอยแบบนี้
1
2
3
4
| <a href="<?php echo get_category_link(XX); ?>">
<span class="linkDesc">คลิปบุนเดสลีกาทั้งหมด</span>
<img src="<?php bloginfo('template_directory'); ?>/images/more.jpg" width="230" height="21" alt="คลิปบุนเดสลีกาทั้งหมด">
</a> |
ส่วน CSS ก็
1
2
3
| .linkDesc{
display:none;
} |
จบ