Templates by BIGtheme NET
หน้าแรก / การสร้างเว็บไซต์ / 3. ออกแบบเว็บไซต์ / แนวทางการดีไซน์บล็อกยุคใหม่ (ตอน2)

แนวทางการดีไซน์บล็อกยุคใหม่ (ตอน2)



6. ส่วนแสดงความคิดเห็น(Comments)

ส่วนความคิดเห็น เป็นบริเวณที่มีการถกกันเกี่ยวกับบทความจากผู้อ่าน/ผู้เยี่ยมชม หน้าที่ของผู้ออกแบบ จะต้องออกแบบให้บริเวณนี้ดูเป็นการสนทนากัน ด้วยการแยกแต่ละความคิดเห็นออกจากกัน อาจจะด้วยการกำหนดหมายเลขให้แต่ละความคิดเห็น วิธีนี้ยังช่วยให้ง่ายต่อการอ้างอิงความคิดเห็นต่าง ๆ อีกประการ คือแยกความคิดเห็นของเจ้าของบทความ ให้ต่างจากความคิดเห็นทั่วไป เพื่อเอาไว้คั่นว่าได้ตอบความเห็นของผู้อ่านถึงไหนแล้ว หรือ ดูว่ามีความเห็นเพิ่มมาอีกหรือป่าว

ตัวอย่างส่วนแสดงความคิดเห็นที่ดี

1. Chris Shiflett

Chris’ ออกแบบแบบเรียบง่าย อ่านง่าย แยกชื่อผู้ออกความคิดเห็น ออกจาก ความคิดเห็นอย่างชัดเจน เพื่อประโยชน์ที่ได้กล่าวไปแล้วข้างต้น

2. Darkmotion

ผมชอบที่เขาแยกส่วนชื่อผู้ออกความเห็น กับ ความคิดเห็น และดูแล้วได้อารมณ์มาก เหมือนการคุยกัน

3. Blog Design Blog

นี่ก็เป็นอีกตัวอย่างหนึ่ง มีตัวเลขบอกลำดับความคิดเห็น และเน้นชื่อผู้ออกความคิดเห็นด้วยกล่องสีฟ้า ทำให้แยกออกจากส่วนของความคิดเห็น

วิธีทำให้การออกแบบส่วนแสดงความคิดเห็นออกมาดูดี

  • แยกแต่ละความคิดเห็นออกจากกัน วิธีที่ง่ายที่สุด ทำได้ด้วยการใช้สี และอีกวิธีคือ วางไว้คนละที่กันอาจจะใช้กรอบครอบแต่ละส่วน หรือใช้เส้นคั่นก็ได้
  • ใช้สี และ การออกแบบ ให้ชื่อความคิดเห็นของเจ้าของบท ความเด่นกว่าความคิดเห็นของผู้เยี่ยมชมคนอื่น ๆ เล็กน้อย แต่ก็ไม่ควรแตกต่างกันแบบสุดโต่ง
  • แยกข้อมูลอื่น ๆ (ชื่อ วันที่ หมายเลขลำดับการโพสความคิดเห็น) ออกมาจากส่วนของความคิดเห็นเพื่อให้มองเห็นได้ง่าย

.

7. ส่วนท้ายของบทความ(Post’s Footer)

ส่วนท้ายของบทความจะอยู่ระหว่างด้านล่างบทความ บรรทัดสุดท้ายกับส่วนแสดงความคิดเห็น บ่อยครั้งที่เราจะไม่ค่อยให้ความสนใจกับส่วนนี้สักเท่าไหร่ และคิดว่าไม่สำคัญ แต่ส่วนท้ายของบทความก็มีค่ามากเหมือนกัน เพราะมันเป็นส่วนที่ชักจูงผู้เยี่ยมชม/ผู้อ่าน ไปยังบทความอื่น ๆ ที่เกี่ยวข้อง หรือ บทความที่สำคัญ

ตัวอย่างส่วนท้ายของบทความที่ดี

1. Freelanceswitch

ผมชอบการออกแบบบล็อกแบบ Collis มาก ให้ความรู้สึกเรียบร้อย สะอาด ดึงดูดความสนใจ
ในตัวอย่างนี้เขาทำได้ดีทีเดียว แยกส่วนเนื้อหาออกจากส่วนเพิ่มเติ่มพิเศษในส่วนท้ายบทความได้ชัดเจน

2. PSDTuts

นี่ก็เป็นอีกตัวอย่างหนึ่งของการออกแบบบล็อกแบบ Collis ดึงความสนใจผู้อ่านมาสู่ส่วนที่มีการโหวต และ ทำบุคมาร์คบทความ เขายังแยกส่วนนี้กับส่วนถัดไปออกจากกันด้วยสีพื้นหลัง

3. Standards for Life

ส่วนท้ายบทความของ Standards of Life ให้ความรู้สึกปลอดโปร่งโล่งสบาย การสลับสี similar posts(เนื้อเรื่องที่คล้ายกัน) ดูแล้วสบายตา

วิธีทำให้การออกแบบส่วนท้ายบทความออกมาดูดี

  • ทำให้ส่วนท้ายบทความแตกต่างจากส่วนเนื้อหา เพื่อให้ผู้อ่านรู้ว่าทั้งสองส่วนนี้ไม่ไม่ใช่ส่วนเดียวกัน และยังช่วยให้ส่วนท้ายบทความเด่นขึ้น เทคนิคนนี้ทำได้โดยใช้สีพื้นหลังที่ต่างกัน
  • ตัดสินใจให้ได้ก่อนว่าจะเอาอะไรมาใส่ไว้ในส่วนท้ายบทความนี้บ้าง จะได้ไม่ต้องมาทำแล้วลบทิ้งและทำใหม่ ภายหลัง เป็นเหตุให้เสียเวลา
  • เนื้อหาที่จะนำมาใส่ในส่วนนี้นั้น น่าจะต้องมี บทความที่คล้ายกัน (related posts) เพื่อช่วยให้ผู้อ่านไปยังเรื่องที่น่าสนใจคล้ายกับเรื่องนี้ได้

.

8. ส่วนท้ายของบล็อก(Footer)

ส่วนท้ายของบล็อกเป็นส่วนที่คนส่วนใหญ่ไม่ได้ใช้ประโยชน์จากมัน อย่างเต็มที่ (ใช้แค่ใส่ copyright ) แต่ส่วนนี้สามารถนำเมนูรองมาใส่ไว้ได้เพื่อลดความแออัดของลิงค์ ในเมนูรองในด้านข้างบล็อก

เมื่อผู้อ่านมาพบกับส่วนท้ายของบล็อกจะเป็นเวลาที่ผู้อ่าน อ่านเนื้อหาจบแล้ว หรือ อ่านส่วนแสดงความคิดเห็นเสร็จแล้ว นับเป็นช่วงเวลาที่ดีที่คุณจะได้นำเสนอ บทความอื่น ๆ ในบล็อก ด้วยการวางเมนูรองไว้ในส่วนท้ายบล็อกนี้

ลิงค์ที่น่าจะนำมาใส่ควรเป็น บทความที่มีผู้อ่านมากที่สุด บทความแนะนำ คุณอาจจะใส่ลิงค์ เกี่ยวกับเรา และ การติดต่อไปด้วย ถ้าหากเป้าหมายของคุณคือ ผู้เยี่ยมชมบล็อกติดต่อคุณ

ตัวอย่างส่วนท้ายของบล็อกที่ดี

1. Designshack

ผมชอบที่ Designshack ใช้ส่วนท้ายของบล็อกเป็นที่วางเมนูรองทั้งหมด โดยด้านข้างบล็อกจะไม่มีเมนูรองเลย

2. Web Designer Wall

ผมชอบความตั้งใจของเจ้าของบล็อก เขาให้ความสำคัญกับส่วนนี้พอ ๆ กับส่วนหัวเลย ผลจึงออกมาดูงดงามยิ่งนัก

3. Chris Shiflett

เป็นส่วนท้ายบล็อกที่สะอาด เรียบง่าย มาก ๆ สื่ออกมาได้อย่างชัดเจนว่าต้องการอะไร

วิธีทำให้การออกแบบส่วนท้ายของบล็อกออกมาดูดี

  • ออกแบบให้ส่วนท้ายบล็อกตัดกับส่วนของเนื้อหาบล็อก เพื่อให้ผู้ใช้รู้ว่า ณ ตอนนี้เขาได้อยู่ที่ส่วนท้ายของบล็อกแล้ว
  • ใส่ลิงค์เท่าที่คุณคิดว่าผู้เยี่ยมชมต้องการใช้ ไม่ควรใส่เรื่อยเปื่อย จับใส่จนรก ทำให้ผู้ใช้หาสิ่งที่ต้องการไม่เจอ สิ่งที่ไม่ควรนำมาใส่เช่น ความคิดเห็นล่าสุด
  • ออกแบบอย่างเรียบง่ายไม่ต้องฉูดฉาดเกินไป เน้นที่การใช้ประโยชน์

.

9. โฆษณา(Advertisements)

ในปัจจุบันหลาย ๆ บล็อก ได้นำโฆษณามาแปะไว้ในบล็อก จึงทำให้ส่วนนี้มีความสำคัญมากขึ้น ต้องการการออกแบบอย่างพิถีพิถัน เพื่อไม่ให้บล็อกดูน่าเกียจเกินไปหรือ เพื่อไม่ให้โฆษณษมาบดบังความสำคัญของเนื้อหา

ถ้าหากผู้เยี่ยมชมได้พบเจอกับโฆษณาที่จัดวางไม่ถูกที่ ดูน่าเกียจ อาจจะทำให้ผู้เยี่ยมชมเอือมระอาบล็อกของคุณ แทนที่คุณจะได้เงินจากการคลิกโฆษณา เขาจะไม่กลับมาบล็อกคุณอีกเลย คุณจึงควรให้ความสำคัญกับเนื้อหามากกว่าโฆษณา หากคุณออกแบบและวางโฆษณาไว้อย่างถูกหลัก เงินจากค่าโฆษณามันก็ไม่หนีไปไหนหรอก

ตัวอย่างโฆษณาที่ดี

1. Copyblogger

Copyblogger ใช้โฆษณาที่มีขนาดมาตรฐานทั่วไป (125 x 125) ไว้ด้านบนของบล็อก โดยการระบุไว้อย่างชัดแจ้งว่านี่คือผู้สนับสนุน แต่ก่อนที่คุณจะเห็นโฆษณาคุณจะได้พบกับ tagline ของเขาก่อน ทำให้เห็นว่าเขาให้ความสำคัญกับเนื้อหาบล็อกมากกว่าโฆษณา

2. Webdesignerwall

Webdesignerwall ไม่ได้มีเพียงแค่โฆษณาขนาดมาตรฐาน แต่ยังมีโฆษณาอยู่ตรงกลางเนื้อหาด้วย และ ด้วยการออกแบบของเขาทำให้ผู้เยี่ยมชมทราบได้ว่านี่เป็นโฆษณา

3. Problogger

Problogger วางโฆษณาไว้ถัดจากโลโก้ของบล็อก แต่มันไม่ได้บดบังความน่าสนใจของโลโก้และเนื้อหาบล็อกเลย

วิธีทำให้การออกแบบโฆษณาออกมาดูดี

  • ถ้าคุณตั้งใจไว้ว่าจะเอาโฆษณามาแปะไว้ในบล็อก ในระหว่างการออกแบบบล็อกคุณจะต้องให้ความสำคัญกับมันด้วย เพื่อให้โฆษณาที่เอามาแปะ เข้ากับบล็อกได้อย่างลงตัว
  • โฆษณาที่เป็นที่นิยมมาก คือ google’s adsense และโฆษณาขนาด 125 x 125 Google’s adsense เป็นโฆษณาที่ยืดหยุ่นอย่างมาก คุณสามารถเลือกขนาดได้ หรือ รูปแบบการแสดงผลได้ตามที่คุณต้องการ แต่โฆษณาขนาด 125 x 125 จะไม่ค่อยยืดหยุ่นสักเท่าไหร่ โฆษณาประเภทนี้มักจะนำไปใส่ไว้ด้านข้างบล็อก
  • หลังจากที่ได้ตัดสินใจคร่าว ๆ ไว้แล้วว่าจะใช้โฆษณาแบบไหนก็ให้คุณหาตัวอยางโฆษณาแบบนั้น แล้วคัดลอกมาแปะไว้ในบล็อกคุณ แปะหลอก ๆ ไว้ก่อน เพื่อที่การออกแบบส่วนอื่น ๆ จะได้เข้ากับบล็อกของคุณได้อย่างลงตัว
  • อย่าลืมออกแบบบล็อกให้สังเกตเห็นโฆษณาได้ง่าย แต่จะต้องไม่บดบังความสำคัญของเนื้อหา ด้านข้างของบล็อกเป็นส่วนที่เหมาะสมที่สุดที่จะนำโฆษณาไปแปะและ ส่วนที่แย่ที่สุดคือการนำโฆษณาไปไว้ในที่ ๆ ผู้เยี่ยมชมจะเข้าใจผิดคิดว่าเป็นเมนูของบล็อก

Google มีโฆษณาที่เป็นชุดของลิงค์จำนวนหนึ่ง และ ผมมักจะสับสนคิดว่ามันคือเมนูของบล็อก ดังนั้น การระบุว่านี่คือโฆษณาจะช่วยแก้ปัญหานี้ได้

ที่มา http://www.divland.com/blog/2008/06/12/how-to-blog-design/

ข้อมูลจาก http://www.blogdesignblog.com/blog-design/how-to-blog-design-style-guide/

คุณอาจสนใจเรื่องนี้

Plugin WordPress เรียงลำดับ Category แบบตามใจฉัน

ใน blog ของเราตามปกติก็จะมีการแบ่งประเภท หรือหมวดหมู่ (Category) ของบทความเรื่องต่างๆ เอาไว้เพื่อความสะดวกในการค้นหา หรือให้ผู้ชมเว็บไซต์เลือกอ่านเรื่องที่สนใจได้ง่าย   ซึ่ง blog ส่วนใหญ่ก็จะแสดงหมวดหมู่เป็นเมนูไว้ที่ด้านข้าง (Sidebar) ของเว็บ ซ้ายบ้าง ขวาบ้าง ก็แล้วแต่ค่ะ  โดยที่หมวดหมู่เหล่านั้นจะเรียงลำดับตามตัวอักษร ซึ่งบางทีอาจจะไม่ตรงใจเรานัก ...

Leave a Reply

Your email address will not be published. Required fields are marked *