Archive for November, 2009

ช่วงนี้ผมกำลังศึกษา (สูบ) ความรู้ด้าน 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;
}

จบ