Advertisement
-
เรียบง่าย
ความเรียบง่ายหมายถึงการใช้จำนวน pixel ตามที่ต้องใช้เพื่อให้สื่อสารสิ่งที่ต้องการให้ได้และในการสื่อสารนั้นก็ประกอบไปด้วย ข้อมูลหลัก hard data และ เนื้อหาที่ซ่อนอยู่ soft information
ตัวอย่างของข้อมูล
-
Hard data - ข้อมูล สาระ เนื้อหาสำคัญที่ต้องการจะสื่อ เช่น ข่าว ราคาสินค้า ตารางเวลารถไฟ
-
Soft Information - ความรู้สึก บรรยกาศของหน้าเว็บ เปรียบเทียบได้กับความรู้สึกเมื่อแรกพบของผู้ชมที่มีต่อเว็บ ว่าน่าไว้ใจแค่ไหน จะเหมาะสมกับผู้ใช้หรือไม่
ตัวอย่างที่ดี
ดี เพราะ ละเอียด ตื่นตา น่าสนใจ แต่ก็เรียบง่ายในขณะเดียวกัน
ตัวอย่างที่ไม่ดี
![](http://www.divland.com/blog/wp-content/2007/11/20-yaxay.jpg)
![](http://www.divland.com/blog/wp-content/2007/11/20-yaxay-detail.jpg)
ไม่ดี เพราะ ยุ่งเหยิง มีขีดเส้นมากมายที่ไม่ได้ช่วยเป็นส่วนประกอบในการสื่อสาร หาเมนูได้ยากไม่โดดเด่น มีลายเส้นที่เบี่ยงเบนความสนใจของสายตามากไป
-
เนื้อหาอยู่กึ่งกลาง
จากที่เคยกล่าวถึงไปเมื่อบทความก่อนหน้านี้ evolution of css layout ว่าหน้าเว็บในปัจจุบันเริ่มถูกออกแบบให้มีเนื้อหาอยู่กึ่งกลาง ตอนนี้เราก็สรุปได้แล้วว่าการวางเนื้อหาไว้ตำแหน่งกลางหน้าเว็บนั้น เป็นหลักการออกแบบที่ดีของดีไซน์ยุค 2.0
ซึ่งเหตุผลก็คือ การวางเนื้อหาไว้กึ่งกลางหน้าเว็บนั้น สามารถแสดงถึงความเรียบง่าย และตรงไปตรงมาได้ และจากการที่เราใช้จำนวน pixel อย่างประหยัดทำให้เราไม่ถูกกดดัน ให้ยัดเยียดเนื้อหาจำนวนมาก ไว้ในพื้นที่เล็กๆ เราสามารถสื่อได้มากกว่าจากความเรียบง่าย และเหตุผลเดียวที่เราอาจจะไม่เลือก ที่จะออกแบบเนื้อให้อยู่กึ่งกลางหน้าเว็บ คือ กรณีที่เราต้องการยัดเนื้อหาไว้ในหน้าเว็บเยอะๆ อย่างเช่น หน้าเว็บของ web application
-
น้อยคอลัมน์
เมื่อไม่กี่ปีก่อนเราจะเห็นหลายๆเว็บแบ่งเนื้อหาในหน้าเว็บเป็น 3-4 คอลัมน์ แต่ปัจจุบันส่วนใหญ่จะใช้แค่ 2 คอลัมน์ หรืออย่างมากก็ 3 เข้าข่ายยิ่งน้อยยิ่งดี ซึ่งเป็นผลพวงมาจากการที่จัดให้หน้าเว็บอยู่กึ่งกลางจอด้วย ทำให้เราไม่ต้องบรรจุเนื้อหาให้เต็มหน้าจอ และเราก็ไม่จำเป็นต้องใช้คอลัมน์จำนวนมากในการสื่อสาร แค่ใช้คอลัมน์ที่จำเป็น ที่ได้เลือกและคัดสรรค์มาแล้ว ทำให้เรียบง่ายกว่า ตรงไปตรงมา และสื่อสารได้มีประสิทธิภาพมากว่า
ตัวอย่างที่ดี
![](http://www.divland.com/blog/wp-content/2007/11/20-apple-expo.jpg)
ดี เพราะ คอลัมน์ที่เลือกใช้ เป็นคอลัมน์ที่ได้คัดสรรค์เลือกมาอย่างดีแล้ว ว่าคอลัมน์นั้นๆเป็น คอลัมน์ที่จำเป็นต้องมี
ตัวอย่างที่ไม่ดี
![](http://www.divland.com/blog/wp-content/2007/11/20-all-things-web-20.jpg)
ไม่ดี เพราะ แต่ละคอลัมน์ไม่มีอะไรโดดเด่นขึ้นมา ทำให้ไม่สามารถกำหนดได้ว่าควรจะมองที่ตรงไหนก่อน ทุกคอลัมน์มีความสำคัญเท่ากันหมดซึ่งทำใหดูกลืนเข้าไปในหน้าเว็บ
ตัวอย่างที่ใช้หลายคอลัมน์ได้
![](http://www.divland.com/blog/wp-content/2007/11/20-amazon-uk.jpg)
ที่สามารถใช้ได้หลายคอลัมน์เพราะแต่ละคอลัมน์ได้ถูกออกแบบ แยกสัดส่วนมาอย่างชัดเจน ว่าด้านซ้ายเป็นเมนู ตรงกลางเป็นสินค้าซึ่งถูกแบ่งโดยช่องว่าง ทำให้ไม่ดูรกตา
-
แยกส่วนหัวของหน้าเว็บอย่างชัดเจน
หมายถึงการทำให้ส่วนหัวของหน้าเว็บซึ่งหมายถึงส่วนโลโก้และเมนู โดดเด่นขี้นมาจากส่วนอื่นๆ
เทคนิคนี้ไม่ใช่อะไรที่ใหม่ มีการประยุกต์ใช้มานานแล้ว เพราะเป็นเทคนิคที่ดี แต่ปัจจุบันมีการนำมาใช้มากขึ้นเป็นพิเศษ และได้มีการแบ่งสัดส่วนอย่างขัดเจนมากขึ้นดังเช่นตัวอย่างต่อไปนี้
![](http://www.divland.com/blog/wp-content/2007/11/20-simplebits.jpg)
![](http://www.divland.com/blog/wp-content/2007/11/20-alsa-creations.jpg)
การแบ่งสัดส่วนหัวของหน้าเว็บไว้อย่างชัดเจนนั้นดีตรงที่ ได้แบ่งสัดส่วนให้แน่ชัดว่าส่วนไหนคือส่วนเริ่มของหน้าเว็บ ซึ่งเป็นการเน้นหลักการดีไซน์สไตล์ยุค 2.0 ที่ต้องการแสดงเนื้อหาอย่างหนักแน่น เรียบง่ายและตรงไปตรงมา
และการแยกส่วนหัวของหน้าเวปนั้นสามารถทำได้หลายวิธีเช่น ใช้สีที่โดดเด่นแตกต่างจากเนื้อหาที่เหลือดังเช่นตัวอย่างข้างต้น หรือจะใช้เส้นขีดแบ่งดังตัวอย่างต่อไปนี้ก็ได้
![](http://www.divland.com/blog/wp-content/2007/11/20-ex-blogs.gif)
หรือจะแค่วางโลโก้ไว้ข้างนอกเนื้อหาดังตัวอย่าง
-
แยกส่วนต่างๆของหน้าเว็บอย่างชัดเจน
ส่วนต่างๆของหน้าเว็บประกอบไปด้วย
-
เมนู
-
พื้นหลัง
-
เนื้อหา
-
ส่วนอื่นๆ
-
ลิงค์
การที่จะจัดกลุ่มแบ่งแยกส่วนต่างๆได้อย่างชัดเจนที่สุดคือการเล่นสี
![](http://www.divland.com/blog/wp-content/2007/11/20-curve2.jpg)
![](http://www.divland.com/blog/wp-content/2007/11/20-jeremy-boles.jpg)
แต่การใช้ช่องว่างก็สำคัญไม่แพ้กัน
ข้อควรระวังของการเล่นสีคือ สีสรรคต่างๆจะดึงดูดความสนใจไปจากเนื้อหาที่สำคัญ ดังนั้นการวางเนื้อหาลงบนผืนผ้าใบที่ขาวสะอาดจะช่วยให้ผู้ชมรู้สึกผ่อนคลายมากขึ้น
-
เมนูเรียบง่าย
เมนูหลักของหน้าเว็บควรมีสักษณะโดดเด่น สังเกตุเห็นและมองออกได้ง่ายว่าเป็นเมนู โดยการใช้ font ที่หนาใหญ่สะอาดและชัดเจน รวมถึงลิงค์ต่างๆในเนื้อหาควรดูโดดเด่นแตกต่างจากเนื้อหาที่เหลือ
![](http://www.divland.com/blog/wp-content/2007/11/20-snip-nav-tradingeye.jpg)
เพราะ เราต้องการให้ผู้เยี่ยมชมเว็บไซด์ของเราบอกได้ว่าส่วนไหนเป็นเมนู เพื่อให้รับทราบถึงข้อมูลต่างๆว่า
-
ตอนนี้อยู่ที่จุดไหนแล้ว
-
สามารถไปที่ไหนได้อีก
-
แสดงทางเลือกต่างๆให้ชัดเจน
เราสามารถทำให้เมนูดูโดดเด่นได้โดย
-
แยกส่วนออกมาจากเนื้อหา
-
ทำให้ดูแตกต่าง โดยใช้โทนสี และรูปร่าง
-
ใช้ตัวใหญ่และหนา
-
ใช้ภาษาที่ชัดเจนและเป็นสากลเพื่อไม่ให้เกิดความสับสน
สิ่งสำคัญคือต้องทำให้ลิงค์และเมนูดูโดดเด่นแตกต่างจากเนื้อหาส่วนที่ไม่ได้เป็นลิงค์
-
โลโก้ตัวหนา
สอดคล้องไปกับหลักการดีไซน์ยุค 2.0 เพื่อสร้างภาพลักษณ์ที่ชัดเจนและหนักแน่น
ตัวอย่างโลโก้ดังต่อไปนี้เป็นขนาดจริง สังเกตุได้ว่าขนาดจะค่อนข้างใหญ่
![](http://www.divland.com/blog/wp-content/2007/11/20-logos-wall.gif)
คุณสมบัติของโลโก้
-
แสดงออกให้มองเห็นได้อย่างชัดเจน
-
จำได้ง่ายและแตกต่าง
-
เป็นตัวแทนภาพลักษณ์
-
ตัวอักษรตัวใหญ่
เว็บดีไซน์ยุค 2.0 มีการใช้ตัวอักษรตัวใหญ่ขึ้นเมื่อเทียบกับเว็บสไตล์เก่าๆ การที่เราไม่ได้พยายามยัดเยียดเนื้อหาทำให้เรามีพื้นที่มากขึ้น และทำให้สามารถที่จะเลือกทำให้สิ่งสำคัญมีขนาดใหญ่กว่าสิ่งที่ไม่สำคัญ ซึ่งตัวอย่างการใช้งานที่ผ่านมาได้แก่การใช้ตัวอักษรใหญ่สำหรับหัวข้อต่างๆ
การใช้ตัวอักษรตัวใหญ่ทำให้เราสามารถเข้าถึงกลุ่มเป้าหมายได้มากขึ้น ไม่ว่าจะเป็นคนสายตาสั้น ผู้อ่านที่อ่านผ่านๆ ผู้คนที่นั่งห่างไกลจากจอ หรือผู้ใช้จอ LCD ภายใต้แสงแดด
![](http://www.divland.com/blog/wp-content/2007/11/20-browse-happy.jpg)
![](http://www.divland.com/blog/wp-content/2007/11/20-aurum3.jpg)
ถึงกระนั้นเราก็ควรมีเหตุผลในการกำหนดว่าส่วนไหน ควรจะใช้ตัวอักษรตัวใหญ่ ให้ใช้เฉพาะกับส่วนที่สำคัญ เพื่อกำหนดความโดดเด่นหลังจากที่ได้เคลีย พื้นที่แล้ว ไม่ใช่สักแต่ว่าทำให้ดูใหญ่ไปหมด จะทำให้ดูรก และไม่ได้ผล ถ้าต้องการจุเนื้อหาที่มีความสำคัญพอๆกัน จำนวนมากควรคงขนาดตัวอักษรให้ตัวเล็กเท่าๆกัน
-
ตัวอักษรแนะนำตัวหนา
เป็นการสื่อข้อความหลักของเนื้อหา ซึ่งส่วนใหญ่จะเป็นตัวอักษรกราฟฟิกมากกว่าตัวอักษรธรรมดา เนื่องจากนักออกแบบต้องการจะควบคุมสิ่งที่หน้าเว็บต้องการจะสื่ออย่างชัดเเจน
![](http://www.divland.com/blog/wp-content/2007/11/20-apple-home.jpg)
![](http://www.divland.com/blog/wp-content/2007/11/20-37-signals.jpg)
แนะนำให้ใช้เมื่อเป็นสโลแกนหลักเท่านั้น
-
สีสันสดใส
สีสันที่สดใสมีคุณสมบัติในการดึงดูดสายตา เราสามารถใช้สีที่ตัดกันแบ่งส่วนต่างๆของหน้าเว็บ หรือกำหนดให้ส่วนที่สำคัญดูโดดเด่นขึ้นมาได้
![](http://www.divland.com/blog/wp-content/2007/11/20-treo.jpg)
![](http://www.divland.com/blog/wp-content/2007/11/20-colorschemer.gif)
แต่ก็ควรระวังไม่ใช้สีสดเกินไปล้อมรอบเนื้อหา เพราะจะทำให้สายตาถูกดึงหนีไปจากเนื้อหาหลัก ดังเช่นตัวอย่างต่อไปนี้
![](http://www.divland.com/blog/wp-content/2007/11/20-giddykippa.jpg)
แล้วก็อย่าลืมว่าการที่จุดนึงในหน้าเว็บจะดึงดูดสายตาได้ด้วยสีสันที่สดใส สีในจุดอื่นๆก็ควรจะอ่อนลงตามความสำคัญ มิฉะนั้นจะทำให้หน้าเว็บดูสับสนและยุ่งเหยิง
-
มีลูกเล่นบนพื้นผิว
ลูกเล่นต่างๆบนพื้นผิวไม่ว่าจะเป็นการเล่นแสงเงาหรือการไล่สีให้เป็นสามมิติเล็กน้อย ทำให้ภาพกราฟฟิคต่างๆดูเสร็จสมบูรณ์เรียบร้อยและดูเสมือนวัตถุจริง ไม่ว่าจะเป็น คาร์บอนไฟเบอร์
![](http://www.divland.com/blog/wp-content/2007/11/20-surface-i-hate-clowns-redesign.jpg)
หรือพลาสติกเงา
![](http://www.divland.com/blog/wp-content/2007/11/20-surface-apple.jpg)
เทคนิคนี้จะใช้ได้ผลก็ต่อเมื่อเราทำให้หน้าเว็บมีส่วนที่เป็นสามมิติเพียงเล็กน้อยเพื่อเน้นความโดดเด่นเท่านั้น การทำให้ทุกอย่างเป็นสามมิติไปหมดนั้นไม่ใช่สิ่งที่ดี เพราะจะลดความเด่นของสิ่งที่เราต้องการที่จะเน้น และทำให้โหลดช้า
-
ไล่เฉดสี
การไล่เฉดสีสามารถ สร้างมิติ และ กำหนดบรรยากาศของหน้าเว็บได้
![](http://www.divland.com/blog/wp-content/2007/11/20-artypapers.jpg)
![](http://www.divland.com/blog/wp-content/2007/11/20-3d-aurum.jpg)
มีการนำมาใช้ให้ดูเป็นเงา หรือนำมาใช้บนปุ่มเมนู
-
เงาสะท้อน
มีหลักๆอยู่ 2 แบบคือ
-
เงาสะท้อนบนพื้นผิวของตัววัตถุเอง
-
และเงาสะท้อนบนพื้นผิวที่วัตถุวางอยู่
หรือจะนำมาประยุกต์ใช้ให้วัตถุมีเงาสะท้อนบนกลับไป บนพื้นผิวของตัววัตถุเอง ก็จะได้ภาพกราฟฟิคที่น่าสนใจและสวยงาม
-
Icon น่ารัก
ไอคอนต่างๆมีบทบาทมากขึ้นในดีไซน์ยุค 2.0 ปัจจุบันเราเลือกที่จะใช้ไอคอนจำนวนน้อยลง แต่มีความหมายมากขึ้น
การใช้ไอคอนจะมีประโยชน์ก็ต่อเมื่อมองออกได้ง่าย และสื่อสารความหมายได้อย่างชัดเจน
ในอดีตได้มีการใช้ไอคอนมากเกินไป เช่นใช้กับทุกเมนูที่มี ซึ่งปัจจุบันเรานิยมที่จะใช้ตัวอักษรที่สื่อความหมาย ได้อย่างชัดเจนกว่าและไม่ทำให้หน้าเว็บรกไปด้วยไอคอน
เราจะนำไอคอนมาใช้ในจุดที่สำคัญเท่านั้น
-
ป้ายดาว
ควรใช้เพื่อดึงดูดสายตาไปยังสิ่งที่สำคัญจริงๆเท่านั้น และไม่ควรใช้เกิน 1 ดาวต่อ 1 หน้า
![](http://www.divland.com/blog/wp-content/2007/11/20-flashes1.jpg)
![](http://www.divland.com/blog/wp-content/2007/11/20-flashes3.jpg)
ทั้งนี้ทั้งนั้นเราไม่จำเป็นต้องใช้หลักการพวกนี้ทั้งหมด เพื่อให้เว็บมีหน้าตาเป็น 2.0 และการใช้หลักการออกแบบดังกล่าว ก็ไม่สามารถทำให้หน้าเว็บ มีรูปแบบที่ดีเสมอไป แต่การออกแบบหน้าเว็บให้มีความเหมาะสม และพอดีกับเนื้อหา และสิ่งที่ต้องการจะสื่อต่างหากที่สำคัญ
วันที่ 4 มิ.ย. 2552
Advertisement
![สร้างความสงบสยบวันว้าวุ่น.... สร้างความสงบสยบวันว้าวุ่น....](news_pic/arrow.jpg) เปิดอ่าน 6,436 ครั้ง ![ค่าของคน... ค่าของคน...](news_pic/p89757001640.jpg) เปิดอ่าน 6,406 ครั้ง ![ดูสบายตา อ่านแล้วสบายใจ (7)) ดูสบายตา อ่านแล้วสบายใจ (7))](news_pic/p83324762055.jpg) เปิดอ่าน 6,420 ครั้ง ![ไม่มีอะไรยาก ไม่มีอะไรยาก](news_pic/p30449260804.jpg) เปิดอ่าน 6,426 ครั้ง ![โปรดใช้วิจารณญาณในการอ่าน แต่ควรอ่านให้จบ!!!!! โปรดใช้วิจารณญาณในการอ่าน แต่ควรอ่านให้จบ!!!!!](news_pic/p88957102021.jpg) เปิดอ่าน 6,446 ครั้ง ![การรู้จักเลือกซื้ออาหาร...หน้าร้อน การรู้จักเลือกซื้ออาหาร...หน้าร้อน](news_pic/p20884322129.jpg) เปิดอ่าน 6,414 ครั้ง ![การเจริญเติบโตของสิ่งมีชีวิต การเจริญเติบโตของสิ่งมีชีวิต](news_pic/arrow.jpg) เปิดอ่าน 7,714 ครั้ง ![วันนี้วันพระ..เลิก ลด ละ..กิเลส... วันนี้วันพระ..เลิก ลด ละ..กิเลส...](news_pic/arrow.jpg) เปิดอ่าน 6,416 ครั้ง ![เสนอแนวคิด...กระท่อมพอเพียง.. เสนอแนวคิด...กระท่อมพอเพียง..](news_pic/arrow.jpg) เปิดอ่าน 6,418 ครั้ง ![เชิญประชุม เชิญประชุม](news_pic/p17512881623.jpg) เปิดอ่าน 6,427 ครั้ง ![รูปภาพ ไอเดียสุดบรรเจิด เท่ห์โคตร!!!! รูปภาพ ไอเดียสุดบรรเจิด เท่ห์โคตร!!!!](news_pic/arrow.jpg) เปิดอ่าน 6,432 ครั้ง ![ภาพรีสอร์ทในหุบเขา3 ภาพรีสอร์ทในหุบเขา3](news_pic/arrow.jpg) เปิดอ่าน 6,416 ครั้ง ![รักนี้ชั่วนิรันดร์_10 (แด่ความรักที่เป็นไปไม่ได้) รักนี้ชั่วนิรันดร์_10 (แด่ความรักที่เป็นไปไม่ได้)](news_pic/arrow.jpg) เปิดอ่าน 6,418 ครั้ง ![เซ็งเพราะสภาพจำเจ....ความเซ็งระดับแรกนี้ยังน่ารัก เซ็งเพราะสภาพจำเจ....ความเซ็งระดับแรกนี้ยังน่ารัก](news_pic/p64299591948.jpg) เปิดอ่าน 6,415 ครั้ง ![เปิดเทอม >>> เติมใจให้เพื่อนครู....สู้ สู้ สู้ เราคือวิญญูชน เปิดเทอม >>> เติมใจให้เพื่อนครู....สู้ สู้ สู้ เราคือวิญญูชน](news_pic/p44413870431.jpg) เปิดอ่าน 6,418 ครั้ง ![รู้จักวิธีคิด.....ชีวิตเป็นสุข....(วิธีคิดแบบโยนิโสมนสิการ ) รู้จักวิธีคิด.....ชีวิตเป็นสุข....(วิธีคิดแบบโยนิโสมนสิการ )](news_pic/p69551851123.jpg) เปิดอ่าน 6,515 ครั้ง
|
![การประเมินสถานศึกษาขั้นพื้นฐาน ประจำปีงบประมาณ พ.ศ.2553 การประเมินสถานศึกษาขั้นพื้นฐาน ประจำปีงบประมาณ พ.ศ.2553](news_pic/p43260631448.jpg)
เปิดอ่าน 6,417 ☕ คลิกอ่านเลย |
![ปรัชญาครูดี ที่ควรอ่าน!! ปรัชญาครูดี ที่ควรอ่าน!!](news_pic/arrow.jpg)
เปิดอ่าน 6,442 ☕ คลิกอ่านเลย | ![Detox เพื่อลดน้ำหนักและควบคุมน้ำหนัก Detox เพื่อลดน้ำหนักและควบคุมน้ำหนัก](news_pic/p95426821824.jpg)
เปิดอ่าน 6,407 ☕ คลิกอ่านเลย | ![มหัศจรรย์....ของใช้ไฮเทค จากญี่ปุ่น มหัศจรรย์....ของใช้ไฮเทค จากญี่ปุ่น](news_pic/p35631570525.jpg)
เปิดอ่าน 6,416 ☕ คลิกอ่านเลย | ![....เกิดจากกรรม ....เกิดจากกรรม](news_pic/arrow.jpg)
เปิดอ่าน 6,429 ☕ คลิกอ่านเลย | ![<ช่างซ่อมรถอุบลฯดวงเฮงถูกหวยรางวัลที่ 1 รับทรัพย์กว่า 8 ล.> <ช่างซ่อมรถอุบลฯดวงเฮงถูกหวยรางวัลที่ 1 รับทรัพย์กว่า 8 ล.>](news_pic/p26678811415.jpg)
เปิดอ่าน 6,424 ☕ คลิกอ่านเลย | ![ออกกำลัง.....ตามนิสัย... ออกกำลัง.....ตามนิสัย...](news_pic/p53298510506.jpg)
เปิดอ่าน 6,423 ☕ คลิกอ่านเลย |
|
≡ เรื่องน่าอ่าน/สาระน่ารู้ ≡ ![8 ข้อปฏิบัติอยู่อย่างเป็นสุข 8 ข้อปฏิบัติอยู่อย่างเป็นสุข](news_pic/p86250540517.jpg)
เปิดอ่าน 11,031 ครั้ง | ![ทำไมคำว่า"ไทย" ต้องมี "ย" ยักษ์ ทำไมคำว่า"ไทย" ต้องมี "ย" ยักษ์](news_pic/p87949950041.jpg)
เปิดอ่าน 21,126 ครั้ง | ![Franck Muller นาฬิกาไม่เรียงเลข โดดไปมา คลิกดูซิว่าทำงานยังไง Franck Muller นาฬิกาไม่เรียงเลข โดดไปมา คลิกดูซิว่าทำงานยังไง](news_pic/p22025220814.jpg)
เปิดอ่าน 22,961 ครั้ง | ![ครูแท้แพ้ไม่เป็น ตอนที่3 ครูแท้แพ้ไม่เป็น ตอนที่3](news_pic/p33573690847.jpg)
เปิดอ่าน 9,576 ครั้ง | ![คุณประโยชน์ของ "มะเขือเทศ" ที่ดีต่อร่างกาย คุณประโยชน์ของ "มะเขือเทศ" ที่ดีต่อร่างกาย](news_pic/p54393200639.jpg)
เปิดอ่าน 28,575 ครั้ง |
|
|