<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Enjoyday.net &#187; บทความดีๆ ที่คัดสรรแล้ว</title>
	<atom:link href="http://www.enjoyday.net/category/how-to-create-a-website/build-website-good-article/feed" rel="self" type="application/rss+xml" />
	<link>http://www.enjoyday.net</link>
	<description>แนะนำการสร้างเว็บไซต์ สอนทำเว็บตั้งแต่พื้นฐาน สอน HTML,CSS, XHTML แนะนำการใช้งาน Wordpress &#38; Joomla!</description>
	<lastBuildDate>Sat, 12 Mar 2011 13:04:14 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>แนวทางการดีไซน์บล็อกยุคใหม่ (ตอน2)</title>
		<link>http://www.enjoyday.net/blog-design-2.html</link>
		<comments>http://www.enjoyday.net/blog-design-2.html#comments</comments>
		<pubDate>Wed, 27 May 2009 15:17:10 +0000</pubDate>
		<dc:creator>joy</dc:creator>
				<category><![CDATA[3. ออกแบบเว็บไซต์]]></category>
		<category><![CDATA[การสร้าง Blog ด้วย Wordpress]]></category>
		<category><![CDATA[บทความดีๆ ที่คัดสรรแล้ว]]></category>
		<category><![CDATA[blog]]></category>
		<category><![CDATA[การออกแบบเว็บไซต์]]></category>

		<guid isPermaLink="false">http://www.enjoyday.net/?p=1657</guid>
		<description><![CDATA[6. ส่วนแสดงความคิดเห็น(Comments) ส่วนความคิดเห็น เป็นบริเวณที่มีการถกกันเกี่ยวกับบทความจากผู้อ่าน/ผู้เยี่ยมชม หน้าที่ของผู้ออกแบบ จะต้องออกแบบให้บริเวณนี้ดูเป็นการสนทนากัน ด้วยการแยกแต่ละความคิดเห็นออกจากกัน อาจจะด้วยการกำหนดหมายเลขให้แต่ละความคิดเห็น วิธีนี้ยังช่วยให้ง่ายต่อการอ้างอิงความคิดเห็นต่าง ๆ อีกประการ คือแยกความคิดเห็นของเจ้าของบทความ ให้ต่างจากความคิดเห็นทั่วไป เพื่อเอาไว้คั่นว่าได้ตอบความเห็นของผู้อ่านถึงไหนแล้ว หรือ ดูว่ามีความเห็นเพิ่มมาอีกหรือป่าว ตัวอย่างส่วนแสดงความคิดเห็นที่ดี 1. Chris Shiflett Chris’ ออกแบบแบบเรียบง่าย อ่านง่าย แยกชื่อผู้ออกความคิดเห็น ออกจาก ความคิดเห็นอย่างชัดเจน เพื่อประโยชน์ที่ได้กล่าวไปแล้วข้างต้น 2. Darkmotion ผมชอบที่เขาแยกส่วนชื่อผู้ออกความเห็น กับ ความคิดเห็น และดูแล้วได้อารมณ์มาก เหมือนการคุยกัน 3. Blog Design Blog นี่ก็เป็นอีกตัวอย่างหนึ่ง มีตัวเลขบอกลำดับความคิดเห็น และเน้นชื่อผู้ออกความคิดเห็นด้วยกล่องสีฟ้า ทำให้แยกออกจากส่วนของความคิดเห็น วิธีทำให้การออกแบบส่วนแสดงความคิดเห็นออกมาดูดี แยกแต่ละความคิดเห็นออกจากกัน วิธีที่ง่ายที่สุด ทำได้ด้วยการใช้สี และอีกวิธีคือ วางไว้คนละที่กันอาจจะใช้กรอบครอบแต่ละส่วน หรือใช้เส้นคั่นก็ได้ ใช้สี และ การออกแบบ ให้ชื่อความคิดเห็นของเจ้าของบท ความเด่นกว่าความคิดเห็นของผู้เยี่ยมชมคนอื่น ๆ [...]]]></description>
			<content:encoded><![CDATA[<h3>6. ส่วนแสดงความคิดเห็น(Comments)</h3>
<p>ส่วนความคิดเห็น เป็นบริเวณที่มีการถกกันเกี่ยวกับบทความจากผู้อ่าน/ผู้เยี่ยมชม หน้าที่ของผู้ออกแบบ จะต้องออกแบบให้บริเวณนี้ดูเป็นการสนทนากัน ด้วยการแยกแต่ละความคิดเห็นออกจากกัน อาจจะด้วยการกำหนดหมายเลขให้แต่ละความคิดเห็น วิธีนี้ยังช่วยให้ง่ายต่อการอ้างอิงความคิดเห็นต่าง ๆ อีกประการ คือแยกความคิดเห็นของเจ้าของบทความ ให้ต่างจากความคิดเห็นทั่วไป เพื่อเอาไว้คั่นว่าได้ตอบความเห็นของผู้อ่านถึงไหนแล้ว หรือ ดูว่ามีความเห็นเพิ่มมาอีกหรือป่าว</p>
<h4>ตัวอย่างส่วนแสดงความคิดเห็นที่ดี</h4>
<p>1. <a rel="nofollow" href="http://www.shiflett.org/" target="_blank">Chris Shiflett</a><br />
<img src="http://www.enjoyday.net/images/f.jpg" alt="" /></p>
<p>Chris’ ออกแบบแบบเรียบง่าย อ่านง่าย แยกชื่อผู้ออกความคิดเห็น ออกจาก ความคิดเห็นอย่างชัดเจน เพื่อประโยชน์ที่ได้กล่าวไปแล้วข้างต้น</p>
<p>2. <a rel="nofollow" href="http://www.darkmotion.com/" target="_blank" class="broken_link">Darkmotion</a><br />
<img src="http://www.enjoyday.net/images/fr.jpg" alt="" /></p>
<p>ผมชอบที่เขาแยกส่วนชื่อผู้ออกความเห็น กับ ความคิดเห็น และดูแล้วได้อารมณ์มาก เหมือนการคุยกัน</p>
<p>3. <a rel="nofollow" href="http://www.blogdesignblog.com/" target="_blank">Blog Design Blog</a><br />
<img src="http://www.enjoyday.net/images/fra.jpg" alt="" /></p>
<p>นี่ก็เป็นอีกตัวอย่างหนึ่ง มีตัวเลขบอกลำดับความคิดเห็น และเน้นชื่อผู้ออกความคิดเห็นด้วยกล่องสีฟ้า ทำให้แยกออกจากส่วนของความคิดเห็น</p>
<h4>วิธีทำให้การออกแบบส่วนแสดงความคิดเห็นออกมาดูดี</h4>
<ul>
<li>แยกแต่ละความคิดเห็นออกจากกัน วิธีที่ง่ายที่สุด ทำได้ด้วยการใช้สี และอีกวิธีคือ วางไว้คนละที่กันอาจจะใช้กรอบครอบแต่ละส่วน หรือใช้เส้นคั่นก็ได้</li>
<li>ใช้สี และ การออกแบบ ให้ชื่อความคิดเห็นของเจ้าของบท ความเด่นกว่าความคิดเห็นของผู้เยี่ยมชมคนอื่น ๆ เล็กน้อย แต่ก็ไม่ควรแตกต่างกันแบบสุดโต่ง</li>
<li>แยกข้อมูลอื่น ๆ (ชื่อ วันที่ หมายเลขลำดับการโพสความคิดเห็น) ออกมาจากส่วนของความคิดเห็นเพื่อให้มองเห็นได้ง่าย</li>
</ul>
<p><span style="color: #ffffff;">.</span></p>
<h3>7. ส่วนท้ายของบทความ(Post’s Footer)</h3>
<p>ส่วนท้ายของบทความจะอยู่ระหว่างด้านล่างบทความ บรรทัดสุดท้ายกับส่วนแสดงความคิดเห็น บ่อยครั้งที่เราจะไม่ค่อยให้ความสนใจกับส่วนนี้สักเท่าไหร่ และคิดว่าไม่สำคัญ แต่ส่วนท้ายของบทความก็มีค่ามากเหมือนกัน เพราะมันเป็นส่วนที่ชักจูงผู้เยี่ยมชม/ผู้อ่าน ไปยังบทความอื่น ๆ ที่เกี่ยวข้อง หรือ บทความที่สำคัญ</p>
<h4>ตัวอย่างส่วนท้ายของบทความที่ดี</h4>
<p>1. <a rel="nofollow" href="http://www.freelanceswitch.com/" target="_blank">Freelanceswitch</a></p>
<p><img src="http://www.enjoyday.net/images/freelanceswitch2.jpg" alt="" /></p>
<p>ผมชอบการออกแบบบล็อกแบบ Collis มาก ให้ความรู้สึกเรียบร้อย สะอาด ดึงดูดความสนใจ<br />
ในตัวอย่างนี้เขาทำได้ดีทีเดียว แยกส่วนเนื้อหาออกจากส่วนเพิ่มเติ่มพิเศษในส่วนท้ายบทความได้ชัดเจน</p>
<p>2. <a rel="nofollow" href="http://www.psdtuts.com/" target="_blank">PSDTuts</a><br />
<img src="http://www.enjoyday.net/images/psdtuts.jpg" alt="" /></p>
<p>นี่ก็เป็นอีกตัวอย่างหนึ่งของการออกแบบบล็อกแบบ Collis ดึงความสนใจผู้อ่านมาสู่ส่วนที่มีการโหวต และ ทำบุคมาร์คบทความ เขายังแยกส่วนนี้กับส่วนถัดไปออกจากกันด้วยสีพื้นหลัง</p>
<p>3. <a rel="nofollow" href="http://www.standardsforlife.com/" target="_blank">Standards for Life</a></p>
<p><img src="http://www.enjoyday.net/images/standardsforlife2.jpg" alt="" /></p>
<p>ส่วนท้ายบทความของ Standards of Life ให้ความรู้สึกปลอดโปร่งโล่งสบาย การสลับสี similar posts(เนื้อเรื่องที่คล้ายกัน) ดูแล้วสบายตา</p>
<h4>วิธีทำให้การออกแบบส่วนท้ายบทความออกมาดูดี</h4>
<ul>
<li>ทำให้ส่วนท้ายบทความแตกต่างจากส่วนเนื้อหา เพื่อให้ผู้อ่านรู้ว่าทั้งสองส่วนนี้ไม่ไม่ใช่ส่วนเดียวกัน และยังช่วยให้ส่วนท้ายบทความเด่นขึ้น เทคนิคนนี้ทำได้โดยใช้สีพื้นหลังที่ต่างกัน</li>
<li>ตัดสินใจให้ได้ก่อนว่าจะเอาอะไรมาใส่ไว้ในส่วนท้ายบทความนี้บ้าง จะได้ไม่ต้องมาทำแล้วลบทิ้งและทำใหม่ ภายหลัง เป็นเหตุให้เสียเวลา</li>
<li>เนื้อหาที่จะนำมาใส่ในส่วนนี้นั้น น่าจะต้องมี บทความที่คล้ายกัน (related posts) เพื่อช่วยให้ผู้อ่านไปยังเรื่องที่น่าสนใจคล้ายกับเรื่องนี้ได้</li>
</ul>
<p><span style="color: #ffffff;">.</span></p>
<h3>8. ส่วนท้ายของบล็อก(Footer)</h3>
<p>ส่วนท้ายของบล็อกเป็นส่วนที่คนส่วนใหญ่ไม่ได้ใช้ประโยชน์จากมัน อย่างเต็มที่ (ใช้แค่ใส่ copyright ) แต่ส่วนนี้สามารถนำเมนูรองมาใส่ไว้ได้เพื่อลดความแออัดของลิงค์ ในเมนูรองในด้านข้างบล็อก</p>
<p>เมื่อผู้อ่านมาพบกับส่วนท้ายของบล็อกจะเป็นเวลาที่ผู้อ่าน อ่านเนื้อหาจบแล้ว หรือ อ่านส่วนแสดงความคิดเห็นเสร็จแล้ว นับเป็นช่วงเวลาที่ดีที่คุณจะได้นำเสนอ บทความอื่น ๆ ในบล็อก ด้วยการวางเมนูรองไว้ในส่วนท้ายบล็อกนี้</p>
<p>ลิงค์ที่น่าจะนำมาใส่ควรเป็น บทความที่มีผู้อ่านมากที่สุด บทความแนะนำ คุณอาจจะใส่ลิงค์ เกี่ยวกับเรา และ การติดต่อไปด้วย ถ้าหากเป้าหมายของคุณคือ ผู้เยี่ยมชมบล็อกติดต่อคุณ</p>
<h4>ตัวอย่างส่วนท้ายของบล็อกที่ดี</h4>
<p>1. <a rel="nofollow" href="http://www.designshack.co.uk/" target="_blank">Designshack</a><br />
<img src="http://www.enjoyday.net/images/designshack.jpg" alt="" /></p>
<p>ผมชอบที่ Designshack ใช้ส่วนท้ายของบล็อกเป็นที่วางเมนูรองทั้งหมด โดยด้านข้างบล็อกจะไม่มีเมนูรองเลย</p>
<p>2. <a rel="nofollow" href="http://www.webdesignerwall.com/" target="_blank">Web Designer Wall</a></p>
<p><img src="http://www.enjoyday.net/images/webdesignerwall2.jpg" alt="" /></p>
<p>ผมชอบความตั้งใจของเจ้าของบล็อก เขาให้ความสำคัญกับส่วนนี้พอ ๆ กับส่วนหัวเลย ผลจึงออกมาดูงดงามยิ่งนัก</p>
<p>3. <a rel="nofollow" href="http://shiflett.org/" target="_blank">Chris Shiflett</a><br />
<img src="http://www.enjoyday.net/images/shiflett1.jpg" alt="" /></p>
<p>เป็นส่วนท้ายบล็อกที่สะอาด เรียบง่าย มาก ๆ สื่ออกมาได้อย่างชัดเจนว่าต้องการอะไร</p>
<h4>วิธีทำให้การออกแบบส่วนท้ายของบล็อกออกมาดูดี</h4>
<ul>
<li>ออกแบบให้ส่วนท้ายบล็อกตัดกับส่วนของเนื้อหาบล็อก เพื่อให้ผู้ใช้รู้ว่า ณ ตอนนี้เขาได้อยู่ที่ส่วนท้ายของบล็อกแล้ว</li>
<li>ใส่ลิงค์เท่าที่คุณคิดว่าผู้เยี่ยมชมต้องการใช้ ไม่ควรใส่เรื่อยเปื่อย จับใส่จนรก ทำให้ผู้ใช้หาสิ่งที่ต้องการไม่เจอ สิ่งที่ไม่ควรนำมาใส่เช่น ความคิดเห็นล่าสุด</li>
<li>ออกแบบอย่างเรียบง่ายไม่ต้องฉูดฉาดเกินไป เน้นที่การใช้ประโยชน์</li>
</ul>
<p><span style="color: #ffffff;">.</span></p>
<h3>9. โฆษณา(Advertisements)</h3>
<p>ในปัจจุบันหลาย ๆ บล็อก ได้นำโฆษณามาแปะไว้ในบล็อก จึงทำให้ส่วนนี้มีความสำคัญมากขึ้น ต้องการการออกแบบอย่างพิถีพิถัน เพื่อไม่ให้บล็อกดูน่าเกียจเกินไปหรือ เพื่อไม่ให้โฆษณษมาบดบังความสำคัญของเนื้อหา</p>
<p>ถ้าหากผู้เยี่ยมชมได้พบเจอกับโฆษณาที่จัดวางไม่ถูกที่ ดูน่าเกียจ อาจจะทำให้ผู้เยี่ยมชมเอือมระอาบล็อกของคุณ แทนที่คุณจะได้เงินจากการคลิกโฆษณา เขาจะไม่กลับมาบล็อกคุณอีกเลย คุณจึงควรให้ความสำคัญกับเนื้อหามากกว่าโฆษณา หากคุณออกแบบและวางโฆษณาไว้อย่างถูกหลัก เงินจากค่าโฆษณามันก็ไม่หนีไปไหนหรอก</p>
<h4>ตัวอย่างโฆษณาที่ดี</h4>
<p>1. <a rel="nofollow" href="http://www.copyblogger.com/" target="_blank">Copyblogger</a><br />
<img src="http://www.enjoyday.net/images/copyblogger.jpg" alt="" /></p>
<p>Copyblogger ใช้โฆษณาที่มีขนาดมาตรฐานทั่วไป (125 x 125) ไว้ด้านบนของบล็อก โดยการระบุไว้อย่างชัดแจ้งว่านี่คือผู้สนับสนุน แต่ก่อนที่คุณจะเห็นโฆษณาคุณจะได้พบกับ tagline ของเขาก่อน ทำให้เห็นว่าเขาให้ความสำคัญกับเนื้อหาบล็อกมากกว่าโฆษณา</p>
<p>2. <a rel="nofollow" href="http://www.webdesignerwall.com/" target="_blank">Webdesignerwall</a></p>
<p><img src="http://www.enjoyday.net/images/webdesignerwall1.jpg" alt="" /></p>
<p>Webdesignerwall ไม่ได้มีเพียงแค่โฆษณาขนาดมาตรฐาน แต่ยังมีโฆษณาอยู่ตรงกลางเนื้อหาด้วย และ ด้วยการออกแบบของเขาทำให้ผู้เยี่ยมชมทราบได้ว่านี่เป็นโฆษณา</p>
<p>3. <a rel="nofollow" href="http://www.problogger.net/" target="_blank">Problogger</a><br />
<img src="http://www.enjoyday.net/images/problogger.jpg" alt="" /></p>
<p>Problogger วางโฆษณาไว้ถัดจากโลโก้ของบล็อก แต่มันไม่ได้บดบังความน่าสนใจของโลโก้และเนื้อหาบล็อกเลย</p>
<h4>วิธีทำให้การออกแบบโฆษณาออกมาดูดี</h4>
<ul>
<li>ถ้าคุณตั้งใจไว้ว่าจะเอาโฆษณามาแปะไว้ในบล็อก ในระหว่างการออกแบบบล็อกคุณจะต้องให้ความสำคัญกับมันด้วย เพื่อให้โฆษณาที่เอามาแปะ เข้ากับบล็อกได้อย่างลงตัว</li>
<li>โฆษณาที่เป็นที่นิยมมาก คือ google’s adsense และโฆษณาขนาด 125 x 125 Google’s adsense เป็นโฆษณาที่ยืดหยุ่นอย่างมาก คุณสามารถเลือกขนาดได้ หรือ รูปแบบการแสดงผลได้ตามที่คุณต้องการ แต่โฆษณาขนาด 125 x 125 จะไม่ค่อยยืดหยุ่นสักเท่าไหร่ โฆษณาประเภทนี้มักจะนำไปใส่ไว้ด้านข้างบล็อก</li>
<li>หลังจากที่ได้ตัดสินใจคร่าว ๆ ไว้แล้วว่าจะใช้โฆษณาแบบไหนก็ให้คุณหาตัวอยางโฆษณาแบบนั้น แล้วคัดลอกมาแปะไว้ในบล็อกคุณ แปะหลอก ๆ ไว้ก่อน เพื่อที่การออกแบบส่วนอื่น ๆ จะได้เข้ากับบล็อกของคุณได้อย่างลงตัว</li>
<li>อย่าลืมออกแบบบล็อกให้สังเกตเห็นโฆษณาได้ง่าย แต่จะต้องไม่บดบังความสำคัญของเนื้อหา ด้านข้างของบล็อกเป็นส่วนที่เหมาะสมที่สุดที่จะนำโฆษณาไปแปะและ ส่วนที่แย่ที่สุดคือการนำโฆษณาไปไว้ในที่ ๆ ผู้เยี่ยมชมจะเข้าใจผิดคิดว่าเป็นเมนูของบล็อก</li>
</ul>
<p>Google มีโฆษณาที่เป็นชุดของลิงค์จำนวนหนึ่ง และ ผมมักจะสับสนคิดว่ามันคือเมนูของบล็อก ดังนั้น การระบุว่านี่คือโฆษณาจะช่วยแก้ปัญหานี้ได้</p>
<p>ที่มา <a href="http://www.divland.com/blog/2008/06/12/how-to-blog-design/"  target="_blank">http://www.divland.com/blog/2008/06/12/how-to-blog-design/</a></p>
<p>ข้อมูลจาก <a href="http://www.blogdesignblog.com/blog-design/how-to-blog-design-style-guide/" target="_blank">http://www.blogdesignblog.com/blog-design/how-to-blog-design-style-guide/</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.enjoyday.net/blog-design-2.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>แนวทางการดีไซน์บล็อกยุคใหม่ (ตอน1)</title>
		<link>http://www.enjoyday.net/blog-design-1.html</link>
		<comments>http://www.enjoyday.net/blog-design-1.html#comments</comments>
		<pubDate>Wed, 27 May 2009 14:38:52 +0000</pubDate>
		<dc:creator>joy</dc:creator>
				<category><![CDATA[3. ออกแบบเว็บไซต์]]></category>
		<category><![CDATA[การสร้าง Blog ด้วย Wordpress]]></category>
		<category><![CDATA[บทความดีๆ ที่คัดสรรแล้ว]]></category>
		<category><![CDATA[blog]]></category>
		<category><![CDATA[การออกแบบเว็บไซต์]]></category>

		<guid isPermaLink="false">http://www.enjoyday.net/?p=1647</guid>
		<description><![CDATA[ในการออกแบบบล็อก จะสังเกตได้ว่าการออกแบบส่วนประกอบต่าง ๆ จะมีความแตกต่างกัน ในบทความนี้ผมจะแยกส่วนประกอบพวกนี้ออกเป็น 9 ส่วน หากคุณให้ความสนใจในแต่ละส่วนมากเท่าไหร่ ภาพรวมของบล็อกที่ออกมาจะดูดีมากเท่านั้น ส่วนหัว(Header) ส่วนเนื้อหา(Content Area) เมนูหลัก(Primary Navigation) เมนูรอง(Secondary Navigation) หัวเรื่อง(Headlines) ส่วนแสดงความคิดเห็น(Comments) ส่วนท้ายของบทความ(Post’s Footer) ส่วนท้ายของบล็อก(Footer) โฆษณา(Advertisements) 1.ส่วนหัว(Header) ส่วนหัวเป็นส่วนที่ผู้เยี่ยมชมส่วนใหญ่จะเห็นเป็นส่วนแรก เมื่อเข้ามาในบล็อกของคุณ และเป็นส่วนที่สำคัญที่สุด มันเป็นสิ่งเดียวที่จะแยก ให้เห็นถึงความแตกต่างระหว่างบล็อกของคุณกับบล็อกอื่น ๆ นับล้านบล็อก เป็นสิ่งที่แสดงถึงเอกลักษณ์ของบล็อกคุณเพื่อให้เกิดการจดจำ จากที่กล่าวมาแสดงให้เห็นว่าทำไมส่วนหัวจึงสำคัญมากที่สุด ในบรรดากระบวนการออกแบบบล็อก แม้แต่คนที่ไม่ให้ความสนใจกับการออกแบบบล็อกสักเท่าไหร่ แต่เขาก็ให้ความสำคัญกับส่วนหัวมาก ตัวอย่างส่วนหัวที่ดี 1. Octwelve Octwelve เป็นตัวอย่างที่ดีของการใช้ตัวอักษรที่สวยงาม ในส่วนหัวเพื่อทำให้ส่วนหัวแตกต่างจากส่วนอื่น ๆ ของบล็อกอย่างเห็นได้ชัด และยังทำให้คุณรู้ว่าบล็อกนี้มีเนื้อหาเกี่ยวกับอะไร 2. Cult foo ผมชอบส่วนหัวของ Cultfoo ตรงที่รูปภาพทะลุออกมาจากกรอบ ที่เดิมทีจะเป็นกรอบโค้งและกรอบเหลี่ยม การออกแบบแบบนี้เรียกร้องความสนใจให้บล็อกได้เป็นอย่างดีทีเดียว 3. Darkmotion จุดเด่นของ [...]]]></description>
			<content:encoded><![CDATA[<p>ในการออกแบบบล็อก จะสังเกตได้ว่าการออกแบบส่วนประกอบต่าง ๆ จะมีความแตกต่างกัน ในบทความนี้ผมจะแยกส่วนประกอบพวกนี้ออกเป็น 9 ส่วน หากคุณให้ความสนใจในแต่ละส่วนมากเท่าไหร่ ภาพรวมของบล็อกที่ออกมาจะดูดีมากเท่านั้น</p>
<ul>
<li>ส่วนหัว(Header)</li>
<li>ส่วนเนื้อหา(Content Area)</li>
<li>เมนูหลัก(Primary Navigation)</li>
<li>เมนูรอง(Secondary Navigation)</li>
<li>หัวเรื่อง(Headlines)</li>
<li>ส่วนแสดงความคิดเห็น(Comments)</li>
<li>ส่วนท้ายของบทความ(Post’s Footer)</li>
<li>ส่วนท้ายของบล็อก(Footer)</li>
<li>โฆษณา(Advertisements)</li>
</ul>
<h3>1.ส่วนหัว(Header)</h3>
<p>ส่วนหัวเป็นส่วนที่ผู้เยี่ยมชมส่วนใหญ่จะเห็นเป็นส่วนแรก เมื่อเข้ามาในบล็อกของคุณ และเป็นส่วนที่สำคัญที่สุด มันเป็นสิ่งเดียวที่จะแยก ให้เห็นถึงความแตกต่างระหว่างบล็อกของคุณกับบล็อกอื่น ๆ นับล้านบล็อก เป็นสิ่งที่แสดงถึงเอกลักษณ์ของบล็อกคุณเพื่อให้เกิดการจดจำ จากที่กล่าวมาแสดงให้เห็นว่าทำไมส่วนหัวจึงสำคัญมากที่สุด ในบรรดากระบวนการออกแบบบล็อก แม้แต่คนที่ไม่ให้ความสนใจกับการออกแบบบล็อกสักเท่าไหร่ แต่เขาก็ให้ความสำคัญกับส่วนหัวมาก</p>
<h4>ตัวอย่างส่วนหัวที่ดี</h4>
<p>1. <a rel="nofollow" href="http://www.octwelve.com/" target="_blank">Octwelve</a></p>
<p><img src="http://www.enjoyday.net/images/octwelve.jpg" alt="" /></p>
<p>Octwelve เป็นตัวอย่างที่ดีของการใช้ตัวอักษรที่สวยงาม ในส่วนหัวเพื่อทำให้ส่วนหัวแตกต่างจากส่วนอื่น ๆ ของบล็อกอย่างเห็นได้ชัด และยังทำให้คุณรู้ว่าบล็อกนี้มีเนื้อหาเกี่ยวกับอะไร</p>
<p>2. <a rel="nofollow" href="http://www.cult-f.net/" target="_blank">Cult foo</a><br />
<img src="http://www.enjoyday.net/images/cultfoo1.jpg" alt="" /></p>
<p>ผมชอบส่วนหัวของ Cultfoo ตรงที่รูปภาพทะลุออกมาจากกรอบ ที่เดิมทีจะเป็นกรอบโค้งและกรอบเหลี่ยม การออกแบบแบบนี้เรียกร้องความสนใจให้บล็อกได้เป็นอย่างดีทีเดียว<br />
3. <a rel="nofollow" href="http://darkmotion.com/" target="_blank" class="broken_link">Darkmotion</a></p>
<p><img src="http://www.enjoyday.net/images/darkmotion2.jpg" alt="" /></p>
<p>จุดเด่นของ darkmotion คือ การออกแบบส่วนหัวที่ได้อารมณ์มาก ดูแล้วสนุกสนานรื่นเริง</p>
<h4>วิธีทำให้การออกแบบส่วนหัวออกมาดูดี</h4>
<ul>
<li>ถ้าผมจะออกแบบบล็อกสักอัน สิ่งแรกที่ผมจะทำคือส่วนหัว เพราะ มันเป็นสิ่งที่กำหนดแนวทางในการออกแบบส่วนอื่น ๆ ของบล็อก ดังนั้น ก่อนจะออกแบบส่วนหัวคุณจะต้องตอบให้ได้ก่อนว่า อะไรที่สื่อให้เห็นถึงความเป็นตัวตนของบล็อกคุณ หรือพูดง่าย ๆ ก็คือ บล็อกของคุณมีไว้เพื่ออะไรและอะไรจะสื่อให้เห็นถึงสิ่งนั้น การทำเช่นนี้ ช่วยให้คุณจะได้ไม่มาปวดหัวทีหลัง ในการแก้ไขระหว่างการออกแบบส่วนหัว</li>
<li>ถึงแม้ว่าจะมีแนวทางในการออกแบบส่วนหัวมากมาย แต่สิ่งหนึ่งที่จะลืมไม่ได้เลยและจะต้องให้ความสำคัญมากที่สุด คือ การสื่อให้ผู้เยี่ยมชมเห็นวัตถุประสงค์ของบล็อก ทั้งนี้ก็เพื่อให้ผู้เยี่ยมชม รับรู้ถึงวัตถุประสงค์ได้ในทันทีที่เห็นส่วนหัวของบล็อก</li>
<li>มีความคิดริเริ่มสร้างสรรค์ และไม่หยุดนิ่งที่จะลองการออกส่วนหัวแบบอื่น ๆ จนกระทั่งคุณได้เจอสิ่งที่คุณถูกใจ เพราะอย่างที่บอกไปหลายครั้งแล้วว่าส่วนหัวมันสำคัญมากจริง ๆ มันช่วยให้ผู้เยี่ยมชมจดจำบล็อกของคุณได้ด้วย</li>
</ul>
<p><span style="color: #ffffff;">.</span></p>
<h3>2. ส่วนเนื้อหา(Content Area)</h3>
<p>ส่วนเนื้อหาเป็นส่วนที่ผู้อ่านหรือผู้เยี่ยมชม จะใช้เวลาจดจ่ออยู่นานที่สุด สิ่งสำคัญคือจะต้องแน่ใจว่า ส่วนเนื้อหาง่ายต่อการอ่านและ ไม่ควรมีสิ่งที่ดึงความสนใจผู้อ่านมากจนเกินไป สิ่งสำคัญอีกสิ่งหนึ่งคือ ต้องวางโครงสร้างเนื้อหาให้ดีว่าอะไร สำคัญที่สุดไปจนถึงสำคัญน้อยที่สุด</p>
<h4>ตัวอย่างส่วนเนื้อหาที่ดี</h4>
<p>1. <a rel="nofollow" href="http://www.simplebits.com/" target="_blank">Simplebits</a></p>
<p><img src="http://www.enjoyday.net/images/simplebits1.jpg" alt="" /></p>
<p>ส่วนเนื้อหาของ Simplebits ดีที่อ่านง่ายและแยกลิงค์ออกจากส่วนของเนื้อหาได้อย่างชัดเจน แต่มันไม่เรียกร้องความสนใจหรือไม่ตื่นตาตื่นใจสักเท่าไหร่ ออกแนวเรียบง่าย</p>
<p>2. <a rel="nofollow" href="http://www.welovewp.com/" target="_blank">We Love WP</a></p>
<p><img src="http://www.enjoyday.net/images/welovewp1.jpg" alt="" /></p>
<p>ปัญหาใหญ่ในการออกแบบพื้นหลังสีทึบคือยากต่อการอ่าน แต่ถ้าหากทำให้ดีแล้วจะดูสวยงามมาก WeLoveWP ใช้สีน้ำตาลอ่อนจึงไม่ตัดกับพื้นหลังที่ออกทึบมากเท่าไหร่ ทำให้อ่านง่าย</p>
<p>3. <a rel="nofollow" href="http://blog.webreakstuff.com/" target="_blank">We Break Stuff</a></p>
<p><img src="http://www.enjoyday.net/images/webreakstuff.jpg" alt="" /></p>
<p>ผมชอบการผสมผสานรูปแบบลิงค์ระหว่างเส้นใต้ที่เป็นจุด ๆ กับสี ทำให้ดูดี</p>
<h4>วิธีทำให้การออกแบบส่วนเนื้อหาออกมาดูดี</h4>
<ul>
<li>ออกแบบโครงสร้างเนื้อหาว่าสิ่งไหนสำคัญมากที่สุด ไปจนถึงสำคัญน้อยที่สุด เช่น หัวเรื่องควรเด่นกว่าลิงค์และข้อความที่เป็นตัวหนา</li>
<li>สไตล์การออกแบบเนื้อหาต้องมีส่วนที่ทำหน้าที่เดียวกัน ต้องมีสิ่งที่คล้ายกัน เช่น ลิงค์ต้องมีรูปแบบเหมือนกัน คือ ให้ดูแล้วรู้ว่าเป็นลิงค์เหมือนกัน ไม่ใช่ว่า ลิงค์อันนึงขีดเส้นใต้ อีกอันนึงทำตัวหนา</li>
<li>การกำหนดรูปแบบหรือสไตล์ให้กับลิงค์ ควรทำให้มันเด่นกว่าเนื้อหาธรรมดา เพียงพอที่จะดึงความสนใจผู้อ่านได้แต่ไม่ควรเด่นมากจนเกินไป</li>
</ul>
<p><span style="color: #ffffff;">.</span></p>
<h3>3. เมนูหลัก(Primary Navigation)</h3>
<p>เมนูหลักคือชุดของลิงค์ที่จะนำพาไปสู่ส่วนของอื่น ๆ ที่แตกต่างกันอย่างชัดเจน (area) ในบล็อกโดยทั่วไปแล้วจะวางไว้ใกล้กับส่วนหัว (ความจริงไม่ต้องวางไว้ตรงนี้ก็ได้) แต่การวางไว้ใกล้กับส่วนหัวมันมีประโยชน์ตรงที่ ผู้เยี่ยมชมส่วนใหญ่จะคาดหวังว่าเมนูหลักจะต้องอยู่แถวนี้</p>
<h4>ตัวอย่างเมนูหลักที่ดี</h4>
<p>1. <a rel="nofollow" href="http://www.alistapart.com/" target="_blank">A list apart</a><br />
<img src="http://www.enjoyday.net/images/alistapart.jpg" alt="" width="505" height="140" /></p>
<p>AList Apart เป็นตัวอย่างที่ดีตัวอย่างหนึ่งในการนำเมนูหลักไว้ด้านบน</p>
<p>2. <a rel="nofollow" href="http://www.mindtwitch.com/" target="_blank">Mindtwitch</a><br />
<img src="http://www.enjoyday.net/images/mindtwitch.jpg" alt="" /></p>
<p>Mindtwitch ใช้การความแตกต่างของพื้นผิวแสดงทำให้เห็นชัดเจนว่าเป็นเมนูหลัก</p>
<p>3. <a rel="nofollow" href="http://www.jogger.pl/" target="_blank">Jogger</a><br />
<img src="http://www.enjoyday.net/images/jogger.jpg" alt="" /></p>
<p>เมนูหลักของ Jogger เรียบง่าย และทำได้ง่าย แต่มันสื่อสารออกมาได้อย่างชัดแจ้ง และยังกลืนเข้ากับส่วนอื่น ๆ ได้อย่างแนบเนียน</p>
<h4>วิธีทำให้การออกแบบเมนูหลักออกมาดูดี</h4>
<ul>
<li>จำนวนลิงค์ในส่วนเมนูหลักไม่ควรมีเยอะเกินไป ทั้งนี้ไม่ได้มีกฏเกณฑ์ตายตัวว่าจะต้องมีไม่เกินกี่ลิงค์ แต่โดยทั่วไปแล้วไม่ควรเกิน 6-7 ลิงค์</li>
<li>ส่วนของเมนูหลักควรสงวนไว้ให้ เฉพาะลิงค์ที่ไปสู่หน้าหลักของส่วนอื่น ๆ ของบล็อก โดยที่หน้านั้นสามารถพาผู้เยี่ยมชมไปสู่ส่วนย่อยต่าง ๆ(เมนูรองนั่นเอง) ได้อีก</li>
<li>ตัวอย่างเมนูหลักที่เห็นได้ทั่วไปคือ การติดต่อ(contact) เกี่ยวกับเรา (about) คุณสมบัติ/คุณลักษณะของเมนูหลัก ขึ้นอยู่กับว่า คุณออกแบบโครงสร้างบล็อกของคุณอย่างไร และ อะไรที่คุณต้องการให้ผู้เยี่ยมชมบล็อกของคุณสนใจ</li>
</ul>
<p><span style="color: #ffffff;">.</span></p>
<h3>4. เมนูรอง(Secondary Navigation)</h3>
<p>เมนูรองคือชุดของลิงค์ที่นำพาผู้เยี่ยมชมไปยังส่วนย่อยอื่น ๆ ของเนื้อหาที่อยู่ในขอบเขตเดียวกัน(section) โดยทั่วไปจะอยู่ในรูปแบบส่วนด้านข้าง(sidebar) เมนูรองมีความสำคัญไม่น้อยเหมือนกัน เพราะเป็นส่วนที่ทำให้ผู้อ่านสามารถเข้าถึงส่วนย่อยอื่น ๆ ของบล็อกที่เมนูหลักไม่ได้คลอบคลุมถึงได้</p>
<p>เมนูรองที่ดีควรจะเป็นลิงค์ไปยังบทความ ที่ผู้เยี่ยมชมคลิกดูมากที่สุด ลิงค์ของชุดบทความ (บทความที่มีหลายตอน) หรือจะเป็นสิ่งอื่น ๆ ที่น่าสนใจที่คุณอยากให้ผู้อ่านเข้าถึงได้ง่าย</p>
<h4>ตัวอย่างเมนูรองที่ดี</h4>
<p>1. <a rel="nofollow" href="http://www.elitistsnob.com/" target="_blank">Elitistsnob</a></p>
<p><img src="http://www.enjoyday.net/images/elitistsnob2.jpg" alt="" /></p>
<p>ผมชอบที่ส่วนด้านข้างเด่นชัด แยกออกมาจากส่วนอื่น ๆ ทำให้ผู้เยี่ยมชมสามารถมองหาได้ง่าย</p>
<p>2. <a rel="nofollow" href="http://www.mancub.net/" target="_blank">Mancub</a></p>
<p><img src="http://www.enjoyday.net/images/mancub1.jpg" alt="" /></p>
<p>ชอบที่ส่วนด้านข้างผุดออกมาจากเนื้อหา</p>
<p>3. <a rel="nofollow" href="http://wp-themes.designdisease.com/" target="_blank">Designdisease</a></p>
<p><img src="http://www.enjoyday.net/images/designdisease1.jpg" alt="" /></p>
<p>Design Disease ใช้สีส้มทำให้ส่วนข้างเด่นกว่าส่วนอื่น ๆ</p>
<h4>วิธีทำให้การออกแบบเมนูรองออกมาดูดี</h4>
<ul>
<li>หลักการก็เหมือนกับการออกแบบเมนูหลัก คือใส่ลิงค์แค่ที่จำเป็น</li>
<li>แยกส่วนของเมนูรองออกจากส่วนอื่น ๆ โดยการใช้รูปแบบลิงค์ที่แตกต่างจากส่วนอื่น ๆ เพื่อช่วยให้ดูเป็นระบบระเบียบ (ดูรู้ว่านี่คือเมนูรอง ไม่ใช่ปนอยู่กับเนื้อหา) ง่ายต่อการใช้งาน</li>
<li>ไม่ควรใส่ของตกแต่งจำพวกโปรแกรมเล็ก ๆ เช่น ปฏิทิน เข้าไปในส่วนของเมนูรองมากนัก เพราะจะทำให้รกตาและมันยังไม่ได้ช่วยให้ผู้เยี่ยมชม หาสิ่งที่ต้องการเจอ</li>
</ul>
<p><span style="color: #ffffff;">.</span></p>
<h3>5. หัวเรื่อง(Headlines)</h3>
<p>หัวเรื่องของแต่ละบทความมีไว้เพื่อดึงดูดความสนใจผู้อ่าน และยั่วเย้าให้อ่านเนื้อหาทั้งหมดในที่สุด การจะทำเช่นนี้ได้ หัวเรื่องของคุณจะต้องเด่น โดยสามารถทำได้หลากหลายวิธี</p>
<h4>ตัวอย่างหัวเรื่องที่ดี</h4>
<p>1. <a rel="nofollow" href="http://henryjones.us/" target="_blank">Henry Jones</a><br />
<img src="http://www.enjoyday.net/images/henryjones.jpg" alt="" /></p>
<p>Henry Jones เป็นตัวอย่างการออกแบบหัวเรื่องที่ดูเรียบง่ายมาก ๆ แต่ถึงจะเรียบง่ายมันก็สามารถดึงความสนใจมาสู่หัวเรื่องได้ อาจจะด้วยการใช้ไอคอนแปะไว้กับวันที่ และจำนวนความคิดเห็น ที่อยู่ถัดลงมาจากหัวเรื่อง</p>
<p>2. <a rel="nofollow" href="http://www.ilovetypography.com/" target="_blank">I Love Typography</a><br />
<img src="http://www.enjoyday.net/images/ilovetype.jpg" alt="" /></p>
<p>ตัวอย่างนี้ใช้สีสันและแบบตัวอักษรแสดงให้เห็นถึงความคิดสร้างสรรค์ ยั่วยวนใจผู้เยี่ยมชม</p>
<p>3. <a rel="nofollow" href="http://blogsolid.com/" target="_blank">Blogsolid</a><br />
<img src="http://www.enjoyday.net/images/blogsolid1.jpg" alt="" /></p>
<p>Blogsolid ใช้ยุทธวิธีในการดึงดูดความสนใจผู้เยี่ยมชมมาสู่หัวเรื่อง ด้วยการนำรูปภาพงานศิลปอันงดงามมาวางไว้ใกล้กับหัวเรื่อง</p>
<h4>วิธีทำให้การออกแบบหัวเรื่องออกมาดูดี</h4>
<ul>
<li>วิธีที่ง่ายที่สุดเลยก็คือ กำหนดสีให้หัวเรื่องแตกต่างจากตัวเนื้อหา</li>
<li>ใช้แบบอักษรให้แตกต่างจากเนื้อหา โดยทั่วไปนิยมใช้ แบบอักษร serif กับหัวเรื่อง และ แบบอักษร non-serif กับส่วนเนื้อหา</li>
<li>ขนาดตัวอักษร หัวเรื่องไม่ควรใช้ขนาดตัวอักษรที่ใกล้เคียงกับเนื้อหา (ถึงแม้จะใหญ่กว่าเล็กน้อยก็ตาม) เพราะจะทำให้ผู้อ่านแยกแยะได้ยากว่าอันไหนคือหัวเรื่อง</li>
<li>วิธีที่จะทำให้หัวเรื่องเด่นมาแต่ไกล ทำได้โดยเอาวันที่โพสบทความใส่เข้าไปบริเวณเดียวกับหัวเรื่องด้วย</li>
</ul>
<p>ที่มา <a href="http://www.divland.com/blog/2008/06/12/how-to-blog-design/" target="_blank">http://www.divland.com/blog/2008/06/12/how-to-blog-design/</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.enjoyday.net/blog-design-1.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>ออกแบบเว็บเพจอย่างไรให้ดูดี (Web 2.0 Design)</title>
		<link>http://www.enjoyday.net/good-page-design.html</link>
		<comments>http://www.enjoyday.net/good-page-design.html#comments</comments>
		<pubDate>Tue, 05 May 2009 15:09:57 +0000</pubDate>
		<dc:creator>joy</dc:creator>
				<category><![CDATA[3. ออกแบบเว็บไซต์]]></category>
		<category><![CDATA[บทความดีๆ ที่คัดสรรแล้ว]]></category>
		<category><![CDATA[การออกแบบเว็บไซต์]]></category>

		<guid isPermaLink="false">http://www.enjoyday.net/?p=1297</guid>
		<description><![CDATA[Web 2.0 Design ส่วนประกอบของดีไซน์ยุคใหม่นั้นมีอะไรกันบ้าง ที่มา : http://www.divland.com/blog/2007/11/13/web-2-design/ เรียบง่าย ความเรียบง่ายหมายถึงการใช้จำนวน pixel ตามที่ต้องใช้เพื่อให้สื่อสารสิ่งที่ต้องการให้ได้และในการสื่อสารนั้นก็ประกอบไปด้วย ข้อมูลหลัก hard data และ เนื้อหาที่ซ่อนอยู่ soft information ตัวอย่างของข้อมูล Hard data &#8211; ข้อมูล สาระ เนื้อหาสำคัญที่ต้องการจะสื่อ เช่น ข่าว ราคาสินค้า ตารางเวลารถไฟ Soft Information &#8211; ความรู้สึก บรรยกาศของหน้าเว็บ เปรียบเทียบได้กับความรู้สึกเมื่อแรกพบของผู้ชมที่มีต่อเว็บ ว่าน่าไว้ใจแค่ไหน จะเหมาะสมกับผู้ใช้หรือไม่ ตัวอย่างที่ดี ดี เพราะ ละเอียด ตื่นตา น่าสนใจ แต่ก็เรียบง่ายในขณะเดียวกัน ตัวอย่างที่ไม่ดี ไม่ดี เพราะ ยุ่งเหยิง มีขีดเส้นมากมายที่ไม่ได้ช่วยเป็นส่วนประกอบในการสื่อสาร หาเมนูได้ยากไม่โดดเด่น มีลายเส้นที่เบี่ยงเบนความสนใจของสายตามากไป . เนื้อหาอยู่กึ่งกลาง จากที่เคยกล่าวถึงไปเมื่อบทความก่อนหน้านี้ evolution [...]]]></description>
			<content:encoded><![CDATA[<h2>Web 2.0 Design</h2>
<h2>ส่วนประกอบของดีไซน์ยุคใหม่นั้นมีอะไรกันบ้าง</h2>
<p>ที่มา : <a href="http://www.divland.com/blog/2007/11/13/web-2-design/" target="_blank">http://www.divland.com/blog/2007/11/13/web-2-design/</a></p>
<h3>เรียบง่าย</h3>
<p>ความเรียบง่ายหมายถึงการใช้จำนวน pixel ตามที่ต้องใช้เพื่อให้สื่อสารสิ่งที่ต้องการให้ได้และในการสื่อสารนั้นก็ประกอบไปด้วย ข้อมูลหลัก hard data และ เนื้อหาที่ซ่อนอยู่ soft information</p>
<p>ตัวอย่างของข้อมูล</p>
<ul>
<li><strong><span style="color: #59a620;">Hard data</span></strong> &#8211; ข้อมูล สาระ เนื้อหาสำคัญที่ต้องการจะสื่อ เช่น ข่าว ราคาสินค้า ตารางเวลารถไฟ</li>
<li><strong><span style="color: #59a620;">Soft Information</span></strong> &#8211; ความรู้สึก บรรยกาศของหน้าเว็บ เปรียบเทียบได้กับความรู้สึกเมื่อแรกพบของผู้ชมที่มีต่อเว็บ ว่าน่าไว้ใจแค่ไหน จะเหมาะสมกับผู้ใช้หรือไม่</li>
</ul>
<h4>ตัวอย่างที่ดี</h4>
<p><img src="http://www.enjoyday.net/images/20-alex-dukal-large.jpg" alt="" /></p>
<p>ดี เพราะ ละเอียด ตื่นตา น่าสนใจ แต่ก็เรียบง่ายในขณะเดียวกัน</p>
<h4>ตัวอย่างที่ไม่ดี</h4>
<p><img src="http://www.enjoyday.net/images/20-yaxay.jpg" alt="" /><br />
<img src="http://www.enjoyday.net/images/20-yaxay-detail.jpg" alt="" /><br />
ไม่ดี เพราะ ยุ่งเหยิง มีขีดเส้นมากมายที่ไม่ได้ช่วยเป็นส่วนประกอบในการสื่อสาร หาเมนูได้ยากไม่โดดเด่น มีลายเส้นที่เบี่ยงเบนความสนใจของสายตามากไป</p>
<p><span style="color: #ffffff;">.</span></p>
<h3>เนื้อหาอยู่กึ่งกลาง</h3>
<p>จากที่เคยกล่าวถึงไปเมื่อบทความก่อนหน้านี้ <a href="http://www.divland.com/blog/2007/08/15/css-layout-evolution/" target="_blank"><span style="color: #00a0c7;">evolution of css layout</span></a> ว่าหน้าเว็บในปัจจุบันเริ่มถูกออกแบบให้มีเนื้อหาอยู่กึ่งกลาง ตอนนี้เราก็สรุปได้แล้วว่าการวางเนื้อหาไว้ตำแหน่งกลางหน้าเว็บนั้น เป็นหลักการออกแบบที่ดีของดีไซน์ยุค 2.0</p>
<p>ซึ่งเหตุผลก็คือ การวางเนื้อหาไว้กึ่งกลางหน้าเว็บนั้น สามารถแสดงถึงความเรียบง่าย และตรงไปตรงมาได้ และจากการที่เราใช้จำนวน pixel อย่างประหยัดทำให้เราไม่ถูกกดดัน ให้ยัดเยียดเนื้อหาจำนวนมาก ไว้ในพื้นที่เล็กๆ เราสามารถสื่อได้มากกว่าจากความเรียบง่าย และเหตุผลเดียวที่เราอาจจะไม่เลือก ที่จะออกแบบเนื้อให้อยู่กึ่งกลางหน้าเว็บ คือ กรณีที่เราต้องการยัดเนื้อหาไว้ในหน้าเว็บเยอะๆ อย่างเช่น หน้าเว็บของ <strong><span style="color: #59a620;">web application</span></strong></p>
<p><span style="color: #59a620;"><span style="color: #ffffff;">.</span></span><strong><span style="color: #59a620;"><br />
</span></strong></p>
<p><span style="color: #59a620;"><!--ตัวอย่าง screen capture หน้าเว็บที่มีเนื้อหาอยู่กึ่งกลาง--></span></p>
<h3>น้อยคอลัมน์</h3>
<p>เมื่อไม่กี่ปีก่อนเราจะเห็นหลายๆเว็บแบ่งเนื้อหาในหน้าเว็บเป็น 3-4 คอลัมน์ แต่ปัจจุบันส่วนใหญ่จะใช้แค่ 2 คอลัมน์ หรืออย่างมากก็ 3 เข้าข่ายยิ่งน้อยยิ่งดี ซึ่งเป็นผลพวงมาจากการที่จัดให้หน้าเว็บอยู่กึ่งกลางจอด้วย ทำให้เราไม่ต้องบรรจุเนื้อหาให้เต็มหน้าจอ และเราก็ไม่จำเป็นต้องใช้คอลัมน์จำนวนมากในการสื่อสาร แค่ใช้คอลัมน์ที่จำเป็น ที่ได้เลือกและคัดสรรค์มาแล้ว ทำให้เรียบง่ายกว่า ตรงไปตรงมา และสื่อสารได้มีประสิทธิภาพมากว่า</p>
<h4>ตัวอย่างที่ดี</h4>
<p><img src="http://www.enjoyday.net/images/20-apple-expo.jpg" alt="" /><br />
ดี เพราะ คอลัมน์ที่เลือกใช้ เป็นคอลัมน์ที่ได้คัดสรรค์เลือกมาอย่างดีแล้ว ว่าคอลัมน์นั้นๆเป็น<strong><span style="color: #59a620;"> คอลัมน์ที่จำเป็นต้องมี</span></strong></p>
<h4>ตัวอย่างที่ไม่ดี</h4>
<p><img src="http://www.enjoyday.net/images/20-all-things-web-20.jpg" alt="" /><br />
ไม่ดี เพราะ แต่ละคอลัมน์ไม่มีอะไรโดดเด่นขึ้นมา ทำให้ไม่สามารถกำหนดได้ว่าควรจะมองที่ตรงไหนก่อน ทุกคอลัมน์มีความสำคัญเท่ากันหมดซึ่งทำใหดูกลืนเข้าไปในหน้าเว็บ</p>
<h4>ตัวอย่างที่ใช้หลายคอลัมน์ได้</h4>
<p><img src="http://www.enjoyday.net/images/20-amazon-uk.jpg" alt="" /><br />
ที่สามารถใช้ได้หลายคอลัมน์เพราะแต่ละคอลัมน์ได้ถูกออกแบบ แยกสัดส่วนมาอย่างชัดเจน ว่าด้านซ้ายเป็นเมนู ตรงกลางเป็นสินค้าซึ่งถูกแบ่งโดยช่องว่าง ทำให้ไม่ดูรกตา</p>
<p><span style="color: #ffffff;">.</span></p>
<h3>แยกส่วนหัวของหน้าเว็บอย่างชัดเจน</h3>
<p>หมายถึงการทำให้ส่วนหัวของหน้าเว็บซึ่งหมายถึงส่วนโลโก้และเมนู โดดเด่นขี้นมาจากส่วนอื่นๆ</p>
<p>เทคนิคนี้ไม่ใช่อะไรที่ใหม่ มีการประยุกต์ใช้มานานแล้ว เพราะเป็นเทคนิคที่ดี แต่ปัจจุบันมีการนำมาใช้มากขึ้นเป็นพิเศษ และได้มีการแบ่งสัดส่วนอย่างขัดเจนมากขึ้นดังเช่นตัวอย่างต่อไปนี้</p>
<p><img src="http://www.enjoyday.net/images/20-simplebits.jpg" alt="" /><br />
<img src="http://www.enjoyday.net/images/20-alsa-creations.jpg" alt="" /></p>
<p>การแบ่งสัดส่วนหัวของหน้าเว็บไว้อย่างชัดเจนนั้นดีตรงที่ ได้แบ่งสัดส่วนให้แน่ชัดว่าส่วนไหนคือส่วนเริ่มของหน้าเว็บ ซึ่งเป็นการเน้นหลักการดีไซน์สไตล์ยุค 2.0 ที่ต้องการแสดงเนื้อหาอย่างหนักแน่น เรียบง่ายและตรงไปตรงมา</p>
<p>และการแยกส่วนหัวของหน้าเวปนั้นสามารถทำได้หลายวิธีเช่น ใช้สีที่โดดเด่นแตกต่างจากเนื้อหาที่เหลือดังเช่นตัวอย่างข้างต้น หรือจะใช้เส้นขีดแบ่งดังตัวอย่างต่อไปนี้ก็ได้</p>
<p><img src="http://www.enjoyday.net/images/20-ex-blogs.gif" alt="" /></p>
<p>หรือจะแค่วางโลโก้ไว้ข้างนอกเนื้อหาดังตัวอย่าง</p>
<p><img src="http://www.enjoyday.net/images/20-steinruck.jpg" alt="" /></p>
<p><span style="color: #ffffff;">.</span></p>
<h3>แยกส่วนต่างๆของหน้าเว็บอย่างชัดเจน</h3>
<p>ส่วนต่างๆของหน้าเว็บประกอบไปด้วย</p>
<ul>
<li>เมนู</li>
<li>พื้นหลัง</li>
<li>เนื้อหา</li>
<li>ส่วนอื่นๆ</li>
<li>ลิงค์</li>
</ul>
<p>การที่จะจัดกลุ่มแบ่งแยกส่วนต่างๆได้อย่างชัดเจนที่สุดคือการเล่นสี<br />
<img src="http://www.enjoyday.net/images/20-curve2.jpg" alt="" /><br />
<img src="http://www.enjoyday.net/images/20-jeremy-boles.jpg" alt="" /><br />
แต่การใช้ช่องว่างก็สำคัญไม่แพ้กัน</p>
<p>ข้อควรระวังของการเล่นสีคือ สีสรรคต่างๆจะดึงดูดความสนใจไปจากเนื้อหาที่สำคัญ ดังนั้นการวางเนื้อหาลงบนผืนผ้าใบที่ขาวสะอาดจะช่วยให้ผู้ชมรู้สึกผ่อนคลายมากขึ้น</p>
<p><img src="http://www.enjoyday.net/images/20-etre.jpg" alt="" /></p>
<p><span style="color: #ffffff;">.</span></p>
<h3>เมนูเรียบง่าย</h3>
<p>เมนูหลักของหน้าเว็บควรมีสักษณะโดดเด่น สังเกตุเห็นและมองออกได้ง่ายว่าเป็นเมนู โดยการใช้ font ที่หนาใหญ่สะอาดและชัดเจน รวมถึงลิงค์ต่างๆในเนื้อหาควรดูโดดเด่นแตกต่างจากเนื้อหาที่เหลือ<br />
<img src="http://www.enjoyday.net/images/20-snip-nav-tradingeye.jpg" alt="" /></p>
<p>เพราะ เราต้องการให้ผู้เยี่ยมชมเว็บไซด์ของเราบอกได้ว่าส่วนไหนเป็นเมนู เพื่อให้รับทราบถึงข้อมูลต่างๆว่า</p>
<ul>
<li>ตอนนี้อยู่ที่จุดไหนแล้ว</li>
<li>สามารถไปที่ไหนได้อีก</li>
<li>แสดงทางเลือกต่างๆให้ชัดเจน</li>
</ul>
<p>เราสามารถทำให้เมนูดูโดดเด่นได้โดย</p>
<ul>
<li>แยกส่วนออกมาจากเนื้อหา</li>
<li>ทำให้ดูแตกต่าง โดยใช้โทนสี และรูปร่าง</li>
<li>ใช้ตัวใหญ่และหนา</li>
<li>ใช้ภาษาที่ชัดเจนและเป็นสากลเพื่อไม่ให้เกิดความสับสน</li>
</ul>
<p>สิ่งสำคัญคือต้องทำให้ลิงค์และเมนูดูโดดเด่นแตกต่างจากเนื้อหาส่วนที่ไม่ได้เป็นลิงค์<br />
<img src="http://www.enjoyday.net/images/20-nav-hyperlinks1.gif" alt="" /></p>
<p><span style="color: #ffffff;">.</span></p>
<h3>โลโก้ตัวหนา</h3>
<p>สอดคล้องไปกับหลักการดีไซน์ยุค 2.0 เพื่อสร้างภาพลักษณ์ที่ชัดเจนและหนักแน่น</p>
<p>ตัวอย่างโลโก้ดังต่อไปนี้เป็นขนาดจริง สังเกตุได้ว่าขนาดจะค่อนข้างใหญ่<br />
<img src="http://www.enjoyday.net/images/20-logos-wall.gif" alt="" /><br />
<strong><span style="color: #59a620;">คุณสมบัติของโลโก้</span></strong></p>
<ul>
<li>แสดงออกให้มองเห็นได้อย่างชัดเจน</li>
<li>จำได้ง่ายและแตกต่าง</li>
<li>เป็นตัวแทนภาพลักษณ์</li>
</ul>
<p><span style="color: #ffffff;">.</span></p>
<h3>ตัวอักษรตัวใหญ่</h3>
<p>เว็บดีไซน์ยุค 2.0 มีการใช้ตัวอักษรตัวใหญ่ขึ้นเมื่อเทียบกับเว็บสไตล์เก่าๆ การที่เราไม่ได้พยายามยัดเยียดเนื้อหาทำให้เรามีพื้นที่มากขึ้น และทำให้สามารถที่จะเลือกทำให้สิ่งสำคัญมีขนาดใหญ่กว่าสิ่งที่ไม่สำคัญ ซึ่งตัวอย่างการใช้งานที่ผ่านมาได้แก่การใช้ตัวอักษรใหญ่สำหรับหัวข้อต่างๆ</p>
<p>การใช้ตัวอักษรตัวใหญ่ทำให้เราสามารถเข้าถึงกลุ่มเป้าหมายได้มากขึ้น ไม่ว่าจะเป็นคนสายตาสั้น ผู้อ่านที่อ่านผ่านๆ ผู้คนที่นั่งห่างไกลจากจอ หรือผู้ใช้จอ LCD ภายใต้แสงแดด</p>
<p><img src="http://www.enjoyday.net/images/20-browse-happy.jpg" alt="" /><br />
<img src="http://www.enjoyday.net/images/20-aurum3.jpg" alt="" /><br />
ถึงกระนั้นเราก็ควรมีเหตุผลในการกำหนดว่าส่วนไหน ควรจะใช้ตัวอักษรตัวใหญ่ ให้ใช้เฉพาะกับส่วนที่สำคัญ เพื่อกำหนดความโดดเด่นหลังจากที่ได้เคลีย พื้นที่แล้ว ไม่ใช่สักแต่ว่าทำให้ดูใหญ่ไปหมด จะทำให้ดูรก และไม่ได้ผล ถ้าต้องการจุเนื้อหาที่มีความสำคัญพอๆกัน จำนวนมากควรคงขนาดตัวอักษรให้ตัวเล็กเท่าๆกัน</p>
<p><span style="color: #ffffff;">.</span></p>
<h3>ตัวอักษรแนะนำตัวหนา</h3>
<p>เป็นการสื่อข้อความหลักของเนื้อหา ซึ่งส่วนใหญ่จะเป็นตัวอักษรกราฟฟิกมากกว่าตัวอักษรธรรมดา เนื่องจากนักออกแบบต้องการจะควบคุมสิ่งที่หน้าเว็บต้องการจะสื่ออย่างชัดเเจน<br />
<img src="http://www.enjoyday.net/images/20-apple-home.jpg" alt="" /><br />
<img src="http://www.enjoyday.net/images/20-37-signals.jpg" alt="" /></p>
<p>แนะนำให้ใช้เมื่อเป็นสโลแกนหลักเท่านั้น</p>
<p><span style="color: #ffffff;">.</span></p>
<h3>สีสันสดใส</h3>
<p>สีสันที่สดใสมีคุณสมบัติในการดึงดูดสายตา เราสามารถใช้สีที่ตัดกันแบ่งส่วนต่างๆของหน้าเว็บ หรือกำหนดให้ส่วนที่สำคัญดูโดดเด่นขึ้นมาได้<br />
<img src="http://www.enjoyday.net/images/20-treo.jpg" alt="" /><br />
<img src="http://www.enjoyday.net/images/20-colorschemer.gif" alt="" /><br />
แต่ก็ควรระวังไม่ใช้สีสดเกินไปล้อมรอบเนื้อหา เพราะจะทำให้สายตาถูกดึงหนีไปจากเนื้อหาหลัก ดังเช่นตัวอย่างต่อไปนี้</p>
<p><img src="http://www.enjoyday.net/images/20-giddykippa.jpg" alt="" /></p>
<p>แล้วก็อย่าลืมว่าการที่จุดนึงในหน้าเว็บจะดึงดูดสายตาได้ด้วยสีสันที่สดใส สีในจุดอื่นๆก็ควรจะอ่อนลงตามความสำคัญ มิฉะนั้นจะทำให้หน้าเว็บดูสับสนและยุ่งเหยิง</p>
<p><span style="color: #ffffff;">.</span></p>
<h3>มีลูกเล่นบนพื้นผิว</h3>
<p>ลูกเล่นต่างๆบนพื้นผิวไม่ว่าจะเป็นการเล่นแสงเงาหรือการไล่สีให้เป็นสามมิติเล็กน้อย ทำให้ภาพกราฟฟิคต่างๆดูเสร็จสมบูรณ์เรียบร้อยและดูเสมือนวัตถุจริง ไม่ว่าจะเป็น คาร์บอนไฟเบอร์</p>
<p><img src="http://www.enjoyday.net/images/20-surface-i-hate-clowns-redesign.jpg" alt="" /><br />
หรือพลาสติกเงา<br />
<img src="http://www.enjoyday.net/images/20-surface-apple.jpg" alt="" /></p>
<p>เทคนิคนี้จะใช้ได้ผลก็ต่อเมื่อเราทำให้หน้าเว็บมีส่วนที่เป็นสามมิติเพียงเล็กน้อยเพื่อเน้นความโดดเด่นเท่านั้น การทำให้ทุกอย่างเป็นสามมิติไปหมดนั้นไม่ใช่สิ่งที่ดี เพราะจะลดความเด่นของสิ่งที่เราต้องการที่จะเน้น และทำให้โหลดช้า</p>
<p><span style="color: #ffffff;">.</span></p>
<h3>ไล่เฉดสี</h3>
<p>การไล่เฉดสีสามารถ สร้างมิติ และ กำหนดบรรยากาศของหน้าเว็บได้<br />
<img src="http://www.enjoyday.net/images/20-artypapers.jpg" alt="" /><br />
<img src="http://www.enjoyday.net/images/20-3d-aurum.jpg" alt="" /></p>
<p>มีการนำมาใช้ให้ดูเป็นเงา หรือนำมาใช้บนปุ่มเมนู</p>
<p><img src="http://www.enjoyday.net/images/20-colorschemer.gif" alt="" /></p>
<p><span style="color: #ffffff;">.</span></p>
<h3>เงาสะท้อน</h3>
<p>มีหลักๆอยู่ 2 แบบคือ</p>
<ul>
<li>เงาสะท้อนบนพื้นผิวของตัววัตถุเอง<br />
<img src="http://www.enjoyday.net/images/20-surface-shiny-button.jpg" alt="" /></li>
<li>และเงาสะท้อนบนพื้นผิวที่วัตถุวางอยู่<br />
<img src="http://www.enjoyday.net/images/20-shinytable-2.jpg" alt="" /> <img src="http://www.divland.com/blog/wp-content/2007/11/20-shinytable-1.jpg" alt="" /></li>
</ul>
<p>หรือจะนำมาประยุกต์ใช้ให้วัตถุมีเงาสะท้อนบนกลับไป บนพื้นผิวของตัววัตถุเอง ก็จะได้ภาพกราฟฟิคที่น่าสนใจและสวยงาม</p>
<p><img src="http://www.enjoyday.net/images/20-shinytable-4.jpg" alt="" /></p>
<p><span style="color: #ffffff;">.</span></p>
<h3>Icon น่ารัก</h3>
<p><strong><span style="color: #59a620;">ไอคอน</span></strong>ต่างๆมีบทบาทมากขึ้นในดีไซน์ยุค 2.0 ปัจจุบันเราเลือกที่จะใช้ไอคอนจำนวนน้อยลง แต่มีความหมายมากขึ้น</p>
<p>การใช้ไอคอนจะมีประโยชน์ก็ต่อเมื่อมองออกได้ง่าย และสื่อสารความหมายได้อย่างชัดเจน</p>
<p>ในอดีตได้มีการใช้ไอคอนมากเกินไป เช่นใช้กับทุกเมนูที่มี ซึ่งปัจจุบันเรานิยมที่จะใช้ตัวอักษรที่สื่อความหมาย ได้อย่างชัดเจนกว่าและไม่ทำให้หน้าเว็บรกไปด้วยไอคอน</p>
<p>เราจะนำไอคอนมาใช้ในจุดที่สำคัญเท่านั้น<br />
<img src="http://www.enjoyday.net/images/20-icons-7.gif" alt="" /></p>
<p><span style="color: #ffffff;">.</span></p>
<h3>ป้ายดาว</h3>
<p>ควรใช้เพื่อดึงดูดสายตาไปยังสิ่งที่สำคัญจริงๆเท่านั้น และไม่ควรใช้เกิน 1 ดาวต่อ 1 หน้า</p>
<p><img src="http://www.enjoyday.net/images/20-flashes1.jpg" alt="" /><br />
<img src="http://www.enjoyday.net/images/20-flashes3.jpg" alt="" /><br />
<img src="http://www.enjoyday.net/images/20-flashes6.gif" alt="" /></p>
<p><span style="color: #ffffff;">.</span></p>
<p>ทั้งนี้ทั้งนั้นเราไม่จำเป็นต้องใช้หลักการพวกนี้ทั้งหมด เพื่อให้เว็บมีหน้าตาเป็น 2.0 และการใช้หลักการออกแบบดังกล่าว ก็ไม่สามารถทำให้หน้าเว็บ มีรูปแบบที่ดีเสมอไป แต่การออกแบบหน้าเว็บให้มีความเหมาะสม และพอดีกับเนื้อหา และสิ่งที่ต้องการจะสื่อต่างหากที่สำคัญ</p>
<p>แปลและอ้างอิงจาก<br />
<a rel="nofollow" href="http://www.webdesignfromscratch.com/web-2.0-design-style-guide.cfm" target="_blank"><span style="color: #00a0c7;">http://www.webdesignfromscratch.com/web-2.0-design-style-guide.cfm</span></a><br />
<strong><span style="color: #59a620;">โดย Kwanjai</span></strong></p>
]]></content:encoded>
			<wfw:commentRss>http://www.enjoyday.net/good-page-design.html/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>26 ขั้นตอนการสร้างเว็บไซต์ให้ยอดวันละหมื่นห้า</title>
		<link>http://www.enjoyday.net/26-steps.html</link>
		<comments>http://www.enjoyday.net/26-steps.html#comments</comments>
		<pubDate>Tue, 28 Apr 2009 02:17:19 +0000</pubDate>
		<dc:creator>joy</dc:creator>
				<category><![CDATA[บทความดีๆ ที่คัดสรรแล้ว]]></category>
		<category><![CDATA[การโปรโมทเว็บไซต์]]></category>

		<guid isPermaLink="false">http://www.enjoyday.net/?p=1011</guid>
		<description><![CDATA[มาดูเคล็ดไม่ลับ การสร้างเว็บไซต์ให้ผู้เข้าชมติดใจเว็บไซต์คุณ หากคุณทำตามขั้นตอนเหล่านี้อย่างเคร่งครัด คุณจะประสบความสำเร็จภายในหนึ่งปี ถ้าเว็บไซต์ของคุณเป็นภาษาอังกฤษ แต่ถ้าเป็นภาษาไทย ยอดน่าจะได้ประมาณ 2000 คนต่อวัน หลายๆคนอาจจะไม่เชื่อว่าเป็นไปได้ ผมเองก็ไม่อยากจะเชื่อ แต่ไม่เชื่อนั่นแหละดี เราจะได้พิสูจน์กันไปพร้อมๆกันเลยว่า อีกหนึ่งปีข้างหน้า ยอดเว็บของเราจะพุ่งถึง 2000 คนต่อวัน จริงหรือเปล่า? ลองมาทำตามไปพร้อมๆกันเลยครับ (บทความนี้ เน้นถึงการทำเว็บไซต์ที่เหมาะกับ Search Engine และดึงผู้เข้าชมจาก Search Engine เป็นหลัก) A) เตรียมตัวให้พร้อม : เตรียมตัวคุณให้พร้อม และเตรียมเนื้อหาให้พร้อม เนื้อหาของเว็บไซต์สำคัญกว่าชื่อโดเมนเสียอีก ถ้าหากคุณคิดชื่อโดเมนได้ แต่ไม่มีเนื้อหา คนเข้ามาก็จะรู้สึกแย่กับเว็บคุณ แล้วก็จะไม่กลับมาหาคุณอีกเลย! ทางที่ดี ควรจะเผื่อเนื้อหาไว้ให้พร้อมซัก 100 หน้าเป็นอย่างน้อย ที่สำคัญๆก็อย่างเช่น About Us หรือ Company Profile, Contact Us, Privacy Policy, Terms of Agreement เป็นต้น [...]]]></description>
			<content:encoded><![CDATA[<p>มาดูเคล็ดไม่ลับ การสร้างเว็บไซต์ให้ผู้เข้าชมติดใจเว็บไซต์คุณ</p>
<p>หากคุณทำตามขั้นตอนเหล่านี้อย่างเคร่งครัด คุณจะประสบความสำเร็จภายในหนึ่งปี ถ้าเว็บไซต์ของคุณเป็นภาษาอังกฤษ แต่ถ้าเป็นภาษาไทย ยอดน่าจะได้ประมาณ 2000 คนต่อวัน หลายๆคนอาจจะไม่เชื่อว่าเป็นไปได้ ผมเองก็ไม่อยากจะเชื่อ แต่ไม่เชื่อนั่นแหละดี เราจะได้พิสูจน์กันไปพร้อมๆกันเลยว่า อีกหนึ่งปีข้างหน้า ยอดเว็บของเราจะพุ่งถึง 2000 คนต่อวัน จริงหรือเปล่า? ลองมาทำตามไปพร้อมๆกันเลยครับ (บทความนี้ เน้นถึงการทำเว็บไซต์ที่เหมาะกับ Search Engine และดึงผู้เข้าชมจาก Search Engine เป็นหลัก)</p>
<p><strong>A) เตรียมตัวให้พร้อม :</strong></p>
<blockquote><p>เตรียมตัวคุณให้พร้อม และเตรียมเนื้อหาให้พร้อม เนื้อหาของเว็บไซต์สำคัญกว่าชื่อโดเมนเสียอีก ถ้าหากคุณคิดชื่อโดเมนได้ แต่ไม่มีเนื้อหา คนเข้ามาก็จะรู้สึกแย่กับเว็บคุณ แล้วก็จะไม่กลับมาหาคุณอีกเลย! ทางที่ดี ควรจะเผื่อเนื้อหาไว้ให้พร้อมซัก 100 หน้าเป็นอย่างน้อย ที่สำคัญๆก็อย่างเช่น About Us หรือ Company Profile, Contact Us, Privacy Policy, Terms of Agreement เป็นต้น และถ้าเป็นไปได้ ต้องเป็นเนื้อหาที่หาที่ไหนไม่ได้ ตรงมาอ่านที่เว็บไซต์ของคุณเท่านั้น จะเยี่ยมมากๆ</p></blockquote>
<p><strong>B) ชื่อโดเมน :</strong></p>
<blockquote><p>ต้องเน้นให้ <strong>จำง่าย, พิมพ์ง่าย</strong> ยิ่งพยางค์น้อย หรือน้อยตัวอักษรได้เท่าไหร่ยิ่งดี ถ้าจะให้ดีมี keyword สำคัญๆ ของคุณอยู่ในโดเมนด้วยยิ่งดี แต่บางคนก็คิดว่า ชื่อโดเมนที่มี keyword อยู่ด้วยนั้น &#8220;Out&#8221; ไม่ทันสมัย เชยระเบิดระเบ้อ นั่นก็ขึ้นอยู่กับความชอบเป็นการส่วนตัว  อย่าง SEO-Thai นี่จะถือว่ายาวก็ได้ สั้นก็ได้อีก หรือชื่อที่ไม่มีความหมายอย่าง <strong>Google</strong> ใครจะคิดว่าจะดังเปรี้ยงปร้างขนาดทุกวันนี้ นั่นขึ้นกับหลักง่ายๆที่ว่า ของดีเสียอย่าง ใครๆก็อยากได้ เพราะฉะนั้น เตรียมเนื้อหาของคุณให้ดี เอาเวลาคิดชื่อโดเมนเก๋ไก๋ไปทำเนื้อหาดีกว่าครับ</p></blockquote>
<p><strong>C) ออกแบบหน้าตาเว็บไซต์ให้ใช้ง่าย และตรงกับกลุ่มเป้าหมาย :</strong></p>
<blockquote><p>ง่ายไว้ก่อน ดีที่สุด ! ดีทั้งกับ Spiders และดีทั้งผู้เข้าชม,  ดีกับ Spiders จะทำให้คนค้นหาเว็บไซต์ของคุณได้ง่าย และทำให้มีคนเข้ามามาก และเมื่อเข้ามาแล้วเว็บไซต์ใช้งานง่าย ทำความเข้าใจง่าย เนื้อหาก็ดี โดเมนจำง่าย ใครจะไม่เข้ามาอีก :) คุณอาจจะถามไปอีกว่า ง่ายน่ะ ง่ายยังไง เว็บของผมไม่เห็นจะใช้งานยากตรงไหนเลย? ผมมีวิธีทดสอบสองวิธีครับ</p>
<p>วิธีแรก ให้ลองนึกไปถึงวันแรกๆที่คุณใช้คอมพิวเตอร์ เล่นอินเทอร์เนต ความรู้สึกในวันนั้น คุณคงจำได้ว่า มันเงอะๆงะๆไปหมด ปุ่มไหนคืออะไร จะไปหน้าอื่นต้องทำอย่างไร รู้สึกว่ามันมีปุ่มอะไรต่างๆเยอะแยะไปหมด เอาง่ายๆ Mouse ยังใช้ไม่คล่องเลย! จริงมั้ยครับ? ลองนึกไปถึงวันนั้น แล้วดูเว็บของคุณอีกทีว่า ถ้าคุณในวันนั้นมาเข้าชมเว็บคุณ จะรู้สึกอย่างไร?</p>
<p>วิธีที่สอง เป็นวิธีทดสอบโดยใช้อาสาสมัคร โดยคุณจะต้องหาคนที่ไม่เคยใช้เว็บของคุณเลย จะเป็นคนที่ใช้อินเทอร์เนตคล่องอยู่แล้ว หรือจะเป็นมือใหม่หัด Serve Net ก็สุดแท้แต่ ขอให้มีเขายินดีมาเป็นตัวทดสอบเป็นใช้ได้ การทดสอบก็ง่ายๆ โดยการที่คุณตั้งโจทย์ให้ผู้ทดสอบทำอะไรซักอย่างเกี่ยวกับเว็บไซต์ของคุณเช่น อาจจะให้ลองเลือกซื้อของ หรือหาบทความที่มีอยู่ในเว็บ และคุณนั่งดูอยู่ข้างหลัง ดูอย่างเดียวนะครับ ห้ามแนะนำใดๆทั้งสิ้น ดูว่าเขาใช้งานได้คล่องเหมือนคุณหรือเปล่า? ถ้าไม่เกิน 20 นาทีก็ถือว่าผ่านครับ :)</p>
<p>อีกอย่างก็คือต้องพยายามจัดเนื้อหาของหน้าแรกให้ตรงกับกลุ่มคำ หรือข้อความในหัวข้อหลักของเว็บ มันจะมีความจำเป็นเมื่อ search engine ส่ง bot มาสำรวจเว็บของคุณมันจะได้รู้สึกว่าเว็บของคุณมีเนื้อหาไปในทำนองเดียวกับ meta-tag หรือ title จริงๆ</p>
<p>ความเร็วอาจจะไม่ใช่ทุกอย่าง การทำให้โหลดเร็วเข้าว่าเพียงอย่างเดียวก็อาจจะทำให้เว็บขาดความน่าสนใจไป มันอยู่ที่ว่าคุณจัดสรรหรือคัดเรื่องเด่นแค่ไหนเข้ามาลงหน้าแรก</p></blockquote>
<p><strong>D) ขนาดของข้อมูลในแต่ละหน้า (File Size) : </strong></p>
<blockquote><p>ยิ่งเล็กยิ่งดี แต่กำลังพอดีจะดีที่สุด :) ถ้าเนื้อหามีน้อยก็ควรใส่รูปภาพประกอบ ตกแต่งให้สวยงาม   แต่ถ้าเนื้อหามีมาก ถ้าใส่ไว้ในหน้าเดียวอาจจะทำให้โหลดข้อมูลนานเกินไป ควรจะทำการแบ่งเป็นหน้าๆ ตั้งชื่อแต่ละหน้า ตามหัวข้อของหน้านั้นๆ ไม่ต้องกังวลเรื่องขนาดของไฟล์มากจนเกินไป ควรจะแบ่งให้อ่านแล้วรู้เรื่อง ไม่ใช่แบ่งซอยยิบเกินไป หวังให้โหลดเร็ว อย่างนั้น Search Engine ชอบ แต่คนไม่ชอบ เข้ามาแล้วอาจจากไปลับก็ได้ ควรให้พอดีๆ</p></blockquote>
<p><strong>E) เนื้อหา : </strong></p>
<blockquote><p>ทำเนื้อหาตาม Keyword ที่เหมาะกับเว็บไซต์ของคุณ โดยการตั้ง Keyword เป็นตัวตั้ง ยกตัวอย่างเช่น เว็บของคุณขายต้นไม้ส่งในประเทศ คุณอาจจะเลือก &#8220;<strong>ไม้ประดับ</strong>&#8221; หรือ &#8220;<strong>ไม้มงคล</strong>&#8221; เป็น Keyword แล้วทำเนื้อหาตาม Keyword ที่เลือกไว้ แล้วคอย Update อย่างสม่ำเสมอ รับรองว่า &#8220;<strong>ไม้มงคล</strong>&#8221; หรือ &#8220;<strong>ไม้ประดับ</strong>&#8221; ของคุณจะออกดอกออกผลให้ได้ชื่นชมแน่ๆ</p></blockquote>
<p><strong>F) จำนวน Keyword และการจัดวางตำแหน่งในแต่ละหน้า : </strong></p>
<blockquote><p>แน่นอนว่า ถ้าคุณอยากให้ Search Engine หาคุณพบด้วย Keyword คำไหน แต่ไม่มีคำนั้นๆในเว็บไซต์ของคุณเลย จะเป็นไปได้หรือ? และถ้ามีมากจนล้นเลยยิ่งแล้วใหญ่ (Spam) Search Engine เกลียดนัก ถือว่าดูถูกความสามารถกันอย่างร้ายแรง คุณต้องระวังให้จงหนักเลย ทางที่ดีควรจะมีไม่เกิน 5% ต่อจำนวนคำทั้งหมดในหน้านั้น (ไม่นับ Tag HTML) แต่ถ้าจำเป็นจะต้องมี Keyword คำนั้นๆมากๆ เพราะเหตุการณ์บังคับ ก็ควรจะใช้มุขเดิมคือ แบ่งเป็นหลายๆหน้า หรือหาเนื้อหาอื่นๆมาเพิ่ม ลดทอนจำนวน Keyword นั้นลง</p></blockquote>
<p><strong>G) การเชื่อมโยงไปเว็บไซต์อื่นๆ :</strong></p>
<blockquote><p>เชื่อมโยงถึงเว็บไซต์ใหญ่ๆ ด้วย Keyword ในหน้านั้นเป็นการอ้างอิงให้ผู้เข้าชมเชื่อถือ แถมยังอ้างให้ Search Engine รู้ด้วยว่าเราเป็นเว็บที่มีเนื้อหาเกี่ยวกับเรื่องนั้นๆได้ง่ายยิ่งขึ้น (Ralate Link) เพราะเว็บไซต์ใหญ่ๆนั้น Search Engine รู้จักดีอยู่แล้ว เมื่อเราอ้างถึงเว็บไซต์นั้นๆ Search Engine จะสร้างความสัมพันธ์กับเว็บไซต์ของคุณ กับ Keyword ที่คุณ link ออกไป เปรียบเหมือนการแนะนำตัวกับ Search Engine เว็บไซต์ของเราอยู่หมวดหมู่ไหนนั่นเอง</p></blockquote>
<p><strong>H</strong>) <strong>โครงสร้างของการเชื่อมโยงภายในเว็บไซต์ของคุณ (Cross Links หรือ Link Structure) : </strong></p>
<blockquote><p>cross links ก็คือ links การเชื่อมโยงข้อมูลภายใน website ของเรานั้นเอง ถ้าคุณทำเว็บไซต์เกี่ยวกับอาหาร คุณอาจจะต้องมีการเชื่อมโยงไปยัง หน้า แอปเปิ้ล หรือ ผักผลไม้อื่นๆ หรืออะไรก็ตามที่ชื่อพ้องกับเนื้อหาของเว็บไซต์ของคุณ ไม่จำเป็นจะต้องทำทุกหน้า แต่ถ้าคุณขยันและมีเวลาพอละก็ ผมแนะนำให้คุณทำ link ในคำทุกคำที่สามารถ link ได้ แต่ต้องไปหาหมวดหมู่หรือหน้าที่เกี่ยวข้องนะครับ และที่สำคัญมากๆ ทุกหน้าควรมี link ไปหน้าแรกเสมอ ห้ามลืม เด็ดขาด!!!</p></blockquote>
<p><strong>I) ได้เวลาออนไลน์ : </strong></p>
<blockquote><p>ถ้าคุณมีทุนทรัพย์เพียงพอ คุณควรเลือก Hosting ที่มี IP ให้สำหรับคุณคนเดียว ไม่ควรเลือกแบบ Virtual Host แต่ถ้าเบี้ยน้อย หอยน้อย เลือก ็Host ราคาถูกๆ แต่ไม่ค่อยล่ม ก็พอได้อยู่ เมื่อมี Hosting แล้ว เนื้อหาพร้อมแล้ว link sturcture ทำได้นวลเนียนดีแล้ว ก็ออนไลน์ออกสู่โลกกว้างได้เลยครับ และขอให้จำไว้เลยว่า ถ้าไม่พร้อม อย่าเพิ่งออนไลน์เด็ดขาด นอกเสียจากคุณไม่แคร์ และคุณมีวินัยเพียงพอที่จะเพิ่มเนื้อหาได้อย่างต่อเนื่อง แต่ถึงอย่างไรก็ตาม ผมแนะนำให้คุณใจเย็นๆ รอให้พร้อมก่อนดีกว่าอยู่ดี</p></blockquote>
<p><strong>J) Submit : </strong></p>
<blockquote><p>ได้เวลาของการโฆษณาแล้วครับ ขั้นตอนนี้คือการเอาเว็บของคุณไป submit ตาม search engine ต่างๆ เท่านี้แหละครับ อย่าไปคาดหวังว่าจะได้รับการจัดอันดับในเร็ววันครับ คอยตรวจสอบบ้างสัปดาห์ละครั้งก็พอ</p></blockquote>
<p><strong>K) ตรวจสอบและติดตามผล : </strong></p>
<blockquote><p>ทำได้โดยการวิเคราะห์ log ครับ ไม่ต้องไปสนใจข้อมูล graphics ที่สวยงามแต่ไม่ได้ให้ข้อมูลอะไร ทำนอง &#8220;สวยแต่รูป จูบไม่หอม&#8221; ไม่เอาครับ logs file คือสิ่งที่เราต้องการ อย่าลืมดูว่า logs มีข้อมูล referer หรือเปล่า ถ้าไม่ก็ย้าย hosting ดีกว่าครับ ถ้าคุณอ่าน Logs File ไม่เป็น ผมแนะนำให้คุณจ้างโปรแกรมเมอร์ มาจัดส่วนตรงนี้ให้คุณดีกว่า บอกความต้องการเขาไปว่า อยากให้เขียนโปรแกรมวิเคราะห์ Log File ให้แสดงผลออกมาในแบบคุณอ่านรู้เรื่อง หรือหาๆเอาใน internet นี่แหละครับ ของฟรี ดีด้วย ยังมีอีกเยอะ เพียงแต่คุณจะหามันเจอหรือเปล่าเท่านั้นเอง</p></blockquote>
<p><strong>L) เอาอกเอาใจ Spider ให้มากๆเข้าไว้ :</strong></p>
<blockquote><p>ให้คุณคอยดูว่า มีแมงมุม (Spiders) มีล่าเหยื่อ (เนื้อหา) ของคุณไปติดหรือยัง? หมายความว่า Search Engine ส่ง Bot หรือ Spider เข้าไปเก็บข้อมูลเว็บไซต์ของคุณไปหรือยัง ตรวจสอบง่ายๆด้วยการใช้คำสั่ง <strong>site:www.seo-thai.com</strong> โดยเปลี่ยนจาก seo-thai เป็นชื่อโดเมนของคุณเอง เท่านี้ คุณก็จะได้รู้ว่า แมงมุมฮุบเหยื่อยัง :) ถ้ายัง ต้องรีบมาตรวจแล้วว่าผิดกฏของ Search Engine บ้างหรือเปล่า? โครงสร้าง Link ดีหรือไม่อย่างไร มีเว็บอื่นสร้าง link มาหาคุณบ้างหรือเปล่า ถ้าไม่มีเลย คุณก็ต้องหาพันธมิตรให้ได้ ไม่งั้นเว็บของคุณก็จะกลายเป็นเว็บร้างแน่ๆ</p></blockquote>
<p><strong>M) จัดหมวดหมู่ให้เรียบร้อย เน้นเข้าใจง่าย ใช้ง่ายเป็นหลัก : </strong></p>
<blockquote><p>พยายามจัดหมวดหมู่ของ keyword ให้เป็นเรื่องเดียวกับ topic ของมันครับ ไม่มีอะไรมาก :)</p></blockquote>
<p><strong>N) Links จากเว็บประเภทเดียวกัน :</strong></p>
<blockquote><p>ในกรณีที่เว็บของคุณได้รับการ index บน <a href="http://www.dmoz.org/" target="_blank"><strong>www.dmoz.org</strong></a> แล้ว ให้คุณพยายามขอแลก link กับเว็บในหมวดหมู่เดียวกัน ถ้าเขาไม่ยอมรับแลกก็ไม่เป็นไร ขอกับเว็บอื่นก็ได้ ใครก็ได้ที่ยอมรับการแลกกับเรา เน้นให้พยายามแลก link กะเว็บที่ค่อนข้างจะมีการ update อย่างต่อเนื่อง</p></blockquote>
<p><strong>O) เนื้อหาๆๆ :</strong></p>
<blockquote><p>ควรจะมีหน้าที่มีเรื่องที่เด่นๆ ในแต่ละวัน โดยถ้าเป็นบท ความยาวๆ หน่อยจะดีมาก อย่าพยายามลงในเรื่องที่มีคนสนใจน้อย หรือเรื่องที่มันกว้างเกินไป อันนี้คุณต้องกลับไปค้นหนังสือวิชาภาษาไทยเรื่องการเขียนเรียงความมาอ่านสักหน่อยก็จะดีครับ เขียนให้อ่านง่ายๆไว้ก่อน สำนวนภาษาเป็นเรื่องเฉพาะตัว แต่ก็ฝึกกันได้ ขอให้เขียนทุกวันเป็นใช้ได้ เมื่อครบปีแล้ว คุณลองกลับมาอ่านบทความแรกๆ ที่คุณเขียน คุณจะได้เห็นถึงการเปลี่ยนแปลงอย่างมากทีเดียว</p></blockquote>
<p><strong>P) ลูกเล่น ต่างๆ :</strong></p>
<blockquote><p>พยายามหลีกเลี่ยงลูกเล่นแปลกๆ ที่อาจจะสร้างความสนุกให้ท่าน แต่นั่นอาจจะสร้างความรำคาญให้แก่คนที่เข้ามาชมก็เป็นได้ พยายามให้มันดูกลางๆ ไม่จืดหรือหวือหวาจนน่ารำคาญ</p></blockquote>
<p><strong>Q) Link จากเว็บพันธมิตร :</strong></p>
<blockquote><p>ข้อนี้จะต่างจากข้อ N ตรงที่อาจจะเป็น Link ที่ไม่ได้มาจากเว็บในประเภทเดียวกัน แล้วจำเป็นที่จะต้อง Link กลับไปหาเว็บนั้นๆด้วย เรียกง่ายๆว่า &#8220;การขอแลก Link&#8221; นั่นเอง อันนี้ผมแนะนำว่าคุณจำเป็นต้องเลือกสักหน่อย อย่า Link ไปสะเปะสะปะ เพราะถ้า link ปลายทางเป็น เว็บโป๊ ละก็ ภาพลักษณ์ของเว็บของคุณก็จะถูกมองเป็นเว็บแนวๆนั้นทันที เสียทั้งหน้าตา และ Search Engine ก็จะงงกับเว็บคุณอีกด้วย</p></blockquote>
<p><strong>R</strong>) <strong>บริการเสริม</strong>:</p>
<blockquote><p>เพิ่มบริการเสริมที่จำเป็นอย่างเช่น &#8220;ส่งเว็บนี้ให้เพื่อน&#8221; กระดานสนทนา หรือจดหมายข่าว เป็นต้น เท่านี้ก็แทบจะเพียงพอแล้ว อย่าเพิ่มลูกเล่นอื่นๆที่ไม่จำเป็น เพราะนั่นอาจจะทำให้ค่าใช้จ่ายในการจ้างทำเว็บของคุณสูงจนเกินจำเป็น แถมยังเปล่าประโยชน์อีกด้วย</p></blockquote>
<p><strong>S) อย่ายัดเยียดโฆษณา!:<br />
</strong></p>
<blockquote><p>ถ้าเว็บไซต์ของคุณเป็นเว็บไซต์ขายสินค้า ขอให้ระมัดระวังเรื่องการโฆษณาสักหน่อย อย่ายัดเยียดจนดูน่าเกลียด ต้องทำให้ดูแนบเนียนประมาณว่า ผู้เข้าชมได้รับชมโฆษณาไปโดยไม่รู้ตัว อย่างนั้นได้ยิ่งดี โปรดระลึกไว้เสมอว่า ผู้ชมเข้าเว็บของคุณเพราะต้องการเนื้อหา หรือ สินค้าที่ต้องการ ไม่ใช่ &#8220;โฆษณา&#8221;</p></blockquote>
<p><strong>T) เพิ่มเนื้อหา หรือ สินค้า บ่อยๆและสม่ำเสมอ:<br />
</strong></p>
<blockquote><p>ควรเพิ่มเนื้อหา หรือบทความอย่างสม่ำเสมอ สิ่งนี้แทบจะเรียกได้ว่าเป็นสิ่งสำคัญที่สุดในการทำเว็บไซต์เลยทีเดียว</p></blockquote>
<p><strong>U) เรียนรู้เรื่อง Logs:<br />
</strong></p>
<blockquote><p>หลังจากเปิดดำเนินการได้ 30-60 วัน ก็ได้เวลาที่จะต้อง ทำตัวเป็นนักวิเคราะห์ข้อมูลกันแล้วครับ ข้อมูลที่จะนำมาวิเคราะห์ก็ควรจะนำมาจาก Log Files นั่นเอง คุณควรจะคอยดูว่าผู้เข้าชมใช้ Keyword คำไหนเข้ามาสู่เว็บคุณ อาจจะเป็นคำที่คุณไม่ได้เตรียมไว้ (Optimize) ถ้าเป็นอย่างนั้นคุณควรจะ Optimize เพิ่ม ยกตัวอย่างเช่น ผู้เข้าชม มักจะใช้คำว่า &#8220;orange citrus fruit&#8221; แต่ว่าคุณเตรียมเนื้อหาไว้สำหรับคำว่า &#8220;oranges&#8221; ฉะนั้นคุณควรจะเตรียมเนื้อหาสำหรับคำว่า &#8220;citrus&#8221; และ &#8220;fruit&#8221; แล้วก็ทำ Cross Links ถึงกัน</p></blockquote>
<p><strong>V) การกะระยะเวลา:<br />
</strong></p>
<blockquote><p>เมื่อทำให้เว็บไซต์ได้รับความนิยมแล้ว ไม่ได้ทำให้คุณหมดหน้าที่ไป เพราะคุณยังคงต้องเฝ้าประคบประหงม เว็บของคุณให้ติดอันดับต่อไปอีก เหมือนขี่หลังเสือไม่อาจจะลงได้ การวิเคราะห์ความเป็นไปก็ยังต้องกระทำอย่างต่อเนื่อง อย่าลืมนะครับว่า กว่าที่ keyword ของคุณจะไปปรากฎใน search engine อาจจะใช้เวลานานถึง 3 เดือน เช่นถ้าคุณต้องการให้ผลิตภัณฑ์ของ คุณปรากฏอยู่ใน search engine ในตอนต้นปี คุณอาจจะต้องทำ web ให้เสร็จก่อนหน้านั้นถึง 3 เดือนเป็นอย่างน้อย</p></blockquote>
<p><strong>W) เพื่อนและพันธมิตร:<br />
</strong></p>
<blockquote><p>ในโลกความเป็นจริงคุณต้องมีเพื่อนหรือทำความรู้จักผู้คน ในโลกอินเทอร์เน็ตก็เช่นกัน คุณควรจะทำความรู้จักผู้คน โดยการเข้าที่กระดานสนทนา หรือ กระดานข่าวในเรื่องที่คุณสนใจ แต่ว่ากระดานสนทนาเกี่ยวกับ SEO ในบ้านเรายังไม่เห็นมี คุณต้องหากระดานสนทนาของประเทศ เช่น http://www.searchengineworld.com เป็น และเมื่อคุณเข้าไปแล้ว ก็ใช่ว่าควรจะอ่านอย่างเดียว คุณควรจะสมัครสมาชิก รับจดหมายข่าว แสดงความเห็นหรือสอบถามบ้าง อย่าลืมว่ากระดานข่าวไม่ใช่แค่เข้าไปแล้ว อ่านๆ อย่างเดียว แต่กระดานข่าวตอบคำถามคุณได้</p></blockquote>
<p><strong>X) อย่าลืมจดบันทึกไอเดียเด็ดของคุณ:<br />
</strong></p>
<blockquote><p>หากคุณเพิ่มเนื้อหาใหม่ๆทุกวัน นั่นอาจจะทำให้คุณต้องใช้สมองจนเครียดพอสมควรทีเดียว เพราะฉะนั้นบางครั้งคุณอาจจะคลายเครียดโดยการเปลี่ยนกิจกรรมที่กำลังทำอยู่ เช่น ออกไปเดินเล่น อาบน้ำ แต่เมื่อหลังจากการคลายเครียดแล้ว บางครั้งรายระเอียดที่คุณพยายามคิดมาตั้งนาน ก็พลันหายไปพร้อมกับความเครียด!! ผมแนะนำว่า คุณควรจะจดบันทึกไอเดียของคุณเอาไว้ทุกครั้งที่นึกออก หรือก่อนจะออกไปพัก หรือถ้าคุณมีเครื่องบันทึกเสียงก็ยิ่งดี มันจะช่วยคุณได้ในกรณีที่ไอเดียของคุณหลั่งไหลออกมาจนคุณจดตามไม่ทัน คุณอาจจะพูดๆๆ ใส่เครื่องบันทึกเสียง แล้วค่อยกรอกลับมาฟังใหม่ รับรองไอเดียเด็ดของคุณจะไม่สูญหายไป</p></blockquote>
<p><strong>Y) ตรวจสอบผลการ Submission เมื่อผ่านไปได้ 6 เดือน:<br />
</strong></p>
<blockquote><p>กลับไปดูว่าผลการ Submission กับ Search Engine ต่างๆ หรือ Directory ต่างๆ อย่างเช่น <a href="http://www.dmoz.org/" target="_blank">ODP</a> นั้น Index เว็บไซต์ของคุณให้หรือยัง? ถ้ายัง คุณต้อง ReSubmit ไปอีกครั้ง คราวนี้จะมีโอกาสเพิ่มขึ้น เพราะคุณมีเนื้อหาหรือสินค้ามากกว่าเดิม 180 หน้าแล้ว :)</p></blockquote>
<p><strong>Z) พยายามสร้างเนื้อหาที่ Search Engine ชอบ ทุกๆวัน:<br />
</strong></p>
<blockquote><p>เนื้อหาที่ Search Engine ชอบเป็นอย่างไร? อธิบายง่ายๆก็คือเนื้อหาที่มีการคัดกรองมาอย่างดี มีบทนำ มีเนื้อหา มีบทสรุป เน้นในสิ่งที่ควรเน้น มีจำนวนคำต่อหน้าที่พอเหมาะ มีการอ้างอิงถึงข้อมูลที่เกี่ยวข้อง ได้รับความนิยม (มีจำนวน Link มาหามาก) ไม่ทำผิดกฏของ Search Engine ไม่ใช้ ลูกเล่นหรือ HTML ที่ซับซ้อนจนเกินกว่าที่ Search Engine จะเข้าใจได้ (Search Engine ไม่ฉลาดเท่า Browser)<br />
จะว่ายากก็ไม่น่ายากเท่าไหร่นักที่จะทำให้ได้ครบทุกข้อ แต่ถ้าคุณคิดเนื้อหาไป แล้วก็ Optimize ไปด้วย ผมรับรองว่ายากแน่ๆ คุณควรจะคิดเนื้อหาให้ครบถ้วนก่อน จากนั้นให้ทำเว็บไซต์ด้วย HTML Code ง่ายๆก่อน แล้วจึง Optimize เป็นอันดับสุดท้าย ถ้าคุณทำได้ครบ สิ้นปี คุณจะมีจำนวนหน้าที่คุณภาพคับแก้ว เกือบ 400 หน้าทีเดียว!</p></blockquote>
<p>ขั้นตอนทั้งหมด 26 ขั้นตอนนี้ ถ้าทำตามทั้งหมดแล้วรับรองว่าคุณจะเพิ่มยอดผู้เข้าชมให้คุณได้แน่นอน อยู่ที่ว่าคุณจะทำเต็มที่แค่ไหน? ตั้งใจอย่างต่อเนื่องแค่ไหน? อย่างน้อยๆก็ 500 &#8211; 2000 คนต่อวัน และหากคุณเพิ่มเนื้อหาดีๆ วันละ 4-5 บทความ หรือถ้าเว็บของคุณขายสินค้า คุณก็ควรจะมีรายละเอียดสินค้าแบบละเอียดในทุกๆสินค้าที่คุณขายบนเว็บของคุณ นั่นอาจจะทำให้ยอดผู้เข้าชมพุ่งไปถึง 15000 คนต่อวันก็เป็นได้ ขอให้คุณโชคดี และมีความสุขกับการพัฒนาเว็บไซต์ของคุณ</p>
<p>ที่มา : <a href="http://www.seo-thai.com/seo_articles/guide.htm" target="_blank">http://www.seo-thai.com/seo_articles/guide.htm</a><br />
ข้อมูลจาก : <a href="http://www.searchengineworld.com" target="_blank">http://www.searchengineworld.com</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.enjoyday.net/26-steps.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
<!-- WP Super Cache is installed but broken. The path to wp-cache-phase1.php in wp-content/advanced-cache.php must be fixed! -->
