Browsing all articles from April, 2008

หลายคนคงได้ยินคำว่า Web 2.0 มาบ้างแล้ว
วันนี้ ผมไปเจอบทความที่อธิบายลักษณะของเจ้า Web 2.0 มา
ก็เลยขอ เอามาแบ่งปันกับทุกคน

ลักษณะการออกแบบเว็บไซต์ในยุคเว็บ 2.0 เป็นยังไงมาดูกัน

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

Layout อยู่ตรงกลาง
สาเหตุที่เลือกให้ Layout อยู่ตรงกลาง เพราะเป็นรูปแบบการวาง layout ที่เรียบง่ายที่สุด ผู้ใช้มีประสบการณ์ในการใช้งานเว็บไซต์ที่วาง layout อยู่ตรงกลางอยู่แล้ว จึงง่ายที่จะเรียนรู้ และใช้งาน

มี Column ให้น้อยที่สุด
เมื่อก่อนการใช้งาน 3 หรือ 4 Column ถือว่าเป็นเรื่องที่ปกติ แต่ในยุตเว็บ 2.0 นั้น 2 Colums ก็ถือว่ามากไปแล้ว สาเหตุที่ไม่ใช้ column มากเกินไปนั้น เพราะ ถ้าในหน้าเว็บมี column น้อยที่สุดจะมีทำให้หน้าเว็บนั้นดูแล้วไม่สับสน ดูสบายตา แต่ถ้าจะเลือกใช้งานมากกว่า 2 column ก็สามารถทำได้ขึ้นอยู่กับข้อมูลที่จะนำเสนอภายในหน้าเว็บเพจนั้น ถ้าดูแล้วข้อมูลไม่รก หรือสับสนจนเกินไปก็สามารถใช้งานได้

http://www.webdesignfromscratch.com/snippets/20-article/20-apple-expo.jpg
ตัวอย่างของคอลั่มที่จะมีในเว็บ 2.0

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

http://www.webdesignfromscratch.com/snippets/20-article/20-alsa-creations.jpg
ตัวอย่างของเฮดเดอร์

Posted By IceNaJa

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

http://www.webdesignfromscratch.com/snippets/20-article/20-ex-blogs.gif
ตัวอย่างการแบ่งการแสดงข้อมูล

ใช้ Navigation ที่ง่าย
Navigation เป็นส่วนที่ช่วยให้ผู้ใช้สามารถเข้าถึงข้อมูลที่อยู่ภายในเว็บไซต์ได้สะดวก บอกผู้ใช้ให้ทราบว่าตอนนี้อยู่ที่ส่วนใดของเว็บไซต์ และช่วยให้ผู้ใช้รู้ว่าจะสามารถทำอะไรได้บ้างจากหน้าเพจนั้นๆ เพราะฉะนั้นการออกแบบจึงจำเป็นอย่างยิ่งที่จะต้องออกแบบมาให้สามารถใช้งานได้ง่าย และไม่ซับซ้อนเกินกว่าที่ตัวของผู้ใช้งานจะสามารถเรียนรู้การใช้งานได้ด้วยตัวเอง

http://www.webdesignfromscratch.com/snippets/20-article/20-snip-nav-crossconnector.gif
ตัวอย่างของนาวิเกชั่น

Posted By IceNaJa

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

http://www.webdesignfromscratch.com/snippets/20-article/20-logos-wall.gif
ตัวอย่างของโลโก้

Posted By IceNaJa

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

http://www.webdesignfromscratch.com/snippets/20-article/20-37-signals.jpg
ตัวอย่างอักษร

Posted By IceNaJa

อักษรสำหรับ Introduction ต้องชัดเจน
อักษรที่ใช้สำหรับการแนะนำ ไม่ว่าจะเป็นการแนะนำเว็บไซต์ แนะนำการใช้งานส่วนต่างๆ จำเป็นที่จะต้องมองเห็น และสามารถอ่านได้อย่างสะดวก โดยการทำให้อักษรชัดเจนนั้นเราสามารถทำได้หลายวิธี เช่น การใช้สีที่มีความแตกต่างจากส่วนอื่น การใช้ขนาดอักษรที่ใหญ่กว่าส่วนอื่น การใส่กรอ หรือการใช้ภาพมาประกอบเป็นต้น

http://www.webdesignfromscratch.com/snippets/20-article/20-apple-home.jpg
ตัวอย่างของ Introduction

Posted By IceNaJa

ใช้สีที่ชัดเจน
สีถือเป็นอีกองคประกอบหนึ่งที่สำคัญในการออกแบบเว็บไซต์ เพราะสีสามารถสื่อถึงความเป็นตัวตนของเว็บไซต์ได้ ยกตัวอย่างเช่น เว็บไซต์ของฟาร์มเลี้ยงสัตว์ ก็น่าจะใช้สีเขียวเป็นหลักในการออกแบบ เว็บไซต์ของสวนส้ม ก็ควรจะใช้สีส้น เพื่อสื่อถึงเนื้อหาภายในเว็บไซต์นั้นๆ ในเว็บ 2.0 นั้น สีที่ใช้มักจะนิยมใช้สีที่สด สว่าง เช่นสีเขียว สีชมพู สีฟ้า เป็นต้น

http://www.webdesignfromscratch.com/snippets/20-article/20-treo.jpg
ตัวอย่างของการใช้สี

Posted By IceNaJa

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

http://www.webdesignfromscratch.com/snippets/20-article/20-surface-apple.jpghttp://www.webdesignfromscratch.com/snippets/20-article/20-surface-aurum.jpg
ตัวอย่างของพื้นผิว

Posted By IceNaJa

Gradients
เป็นการไล่สี ซึ่งเป็นเทคนิคหนึ่งในการสร้างพื้นผิวของเว็บเพจให้มีความน่าสนใจ การใช้งานก็ไม่ควรใช้มากเกินไปจนทำให้เว็บเพจรก ซึ่งส่วนใหญ่จะใช้สำหรับการทำพื้นหลังของหน้าเว็บเพจ

http://www.webdesignfromscratch.com/snippets/20-article/20-artypapers.jpg
ตัวอย่างของการไล่สี

Posted By IceNaJa

Reflections
เป็นเทคนิคที่ทำให้ภาพเหมือนเกิดเงาสะท้อนขึ้น ซึ่งก็เป็นเทคนิคอีกเทคนิคหึ่งในการสร้างพื้นผิวของหน้าเว็บเพจให้น่าสนใจ

http://www.tag.in.th/images/logo.gif
ตัวอย่างของรีเฟ็คชั่น

Posted By IceNaJa

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

http://www.webdesignfromscratch.com/snippets/20-article/20-icons-scribble.gif
ตัวอย่างไอคอนทั่วๆ ไป

Posted By IceNaJa

- Icon น่ารักๆ เป็น Icon ที่ใช้เพื่อสร้างความสวยงามให้กับหน้าเว็บเพจ แต่ไม่สื่อว่า Icon นั้นหมายถึงอะไร เพราะฉะนั้นการใช้งานจึงนิยมนำมาทำเป็น Icon ที่ว่าไว้หน้า link ที่เป็นตัวอักษรมากกว่าการใช้งานโดดๆ

http://www.webdesignfromscratch.com/snippets/20-article/20-icons-6.jpg
ตัวอย่างไอคอนน่ารักๆ

Posted By IceNaJa

- Icon ที่มีรายละเอียดในตัว โดยมากจะเป็น Icon ที่ใช้ประกอบเช่นเดียวกับ Icon น่ารักๆ การใช้งานจึงมีลักษณะเหมือนกัน แต่ตัวภาพ Icon จะมีรายละเอีดที่สูงกว่า

http://www.webdesignfromscratch.com/snippets/20-article/20-icons-4.jpg
ไอคอนที่มีรายละเอียดในตัว

Posted By IceNaJa

Star flashes
เป็นกราฟฟิกอีกรูปแบบหนึ่งที่นิยมใช้เพื่อดึงดูดสายตา ของผู้ใช้งานให้มาสนใจในส่วนนั้นๆ

http://www.wish.in.th/images/control/bot-mainsignup.gif
ตัวอย่าง Star flashes

ทั้งหมดนี้เป็๋นลักษณะการออกแบบเด่นๆ ในยุคเว็บ 2.0 ครับ
และ ขอขอบคุณข้อมูลดีๆจาก webdesignfromscratch.com

จากที่มีคอมเมนต์เมื่อตอนกลางวันจากคุณ… (ชื่ออะไรอ่ะครับ)
เกี่ยวกับ WordPress theme สวยๆ
ผมลองๆ หาดูแล้ว ส่วนมากที่สวยๆ มักจะไม่ฟรี

แต่ก็ เจอสวยๆ ดีๆ และที่สำคัญฟรีด้วย
ลองดูจากเว็บนี้นะครับ

http://wordpresstemplates.name

http://www.fresheezy.com

http://www.wpskins.org/

วันนี้ขอแนะนำแค่ 3 เว็บนี้ก่อนนะครับ

คำแนะนำก่อนจะ install ควรเช็คให้ดีก่อนว่า Template นั้น
ใช้ได้กับเวอร์ชั่นWordPressที่เรากำลังใช้อยู่หรือป่าว
ไม่งั้นมันจะแสดงออกมาไม่ต้องตามที่เราต้องการ

การลง Theme เพิ่มก็ไม่มีอะไรมากครับ ดาวน์โหลดไฟล์มา
จากนั้นทำการแตกไฟล์ที่เขาทำการบีบอัดออกมา
คัดลอกไฟล์ที่ได้นี้ ไปเก็บไว้ในไดเร็กทอรี่ Theme ของ WordPress
จากนั้นทำการ Login เข้าระบบโดย Admin
ไปที่เมนู Presentation หรือ Design
เลือก Theme ที่ต้องการให้แสดง เป็นอันเสร็จครับ

เปลี่ยน Theme ใหม่แล้วอย่าลืมเอามาโชว์กันบ้างนะครับ

สวัสดีตอนสายๆ ครับ

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

เว็บสอนการหารายได้จาก Adsense

https://www.google.com/adsense/login/th/ เว็บของ Google Adsense มีรายละเอียดภาษาไทย
http://www.adsthai.net/ อันนี้สอนเป็นภาษาไทย อ่านแล้วทำตามได้ง่ายๆ
http://www.basicstep.net/adsense/what-is-google-adsense/ สอนตั้งแต่เริ่มต้นเหมือนกัน

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

ขอตัวไปทำงานต่อแล้วครับ

Page 1 of 41234

About

Generated Image
iAke หนุ่มน้อยจากพังงา
คนใต้ขนานแท้ ตัวดำแต่ใจดี
iAke on Facebook
iAke on LinkedIn
iAke on hi5
iAke on Twitter

Tags

Adsense clip FHM girl google google adsense magazine make money sexy Thai volumn web WordPress youtube คลิป คุยเรื่องทั่วไป คุยเรื่องหนัง คุยเรื่องเพลง ชมพู่ ดารา ดาราถ่ายแบบ ดี ถ่ายรูป ถ่ายแบบ ทำเว็บ นิตยสาร นิตยสาร IN พันทิป ฟังเพลง มาฟังเพลงกัน มาริโอ มาวเรอร์ ละคร สาวสวย หมา หารายได้ หาเงิน ออนไลน์ อารยา เอ ฮาร์เก็ต เช็ค เพลงเก่า เพลงใต้ แพรว แอดเซ้น โฆษณา โทรศัพท์

Links

iAke Friend Links

กำลังเปิดรับแลกลิงค์ครับ สนใจก็บอกไว้ในคอมเม้นต์ได้เลยครับ

Milli Mind บล็อกแอ๊บแบ๊ว
GoodFeeling
Shine Diary
แทนเจ้น
Panugan
SE7EN
You are what you sing
peepo.net
ping.in.th

LeftHit.com
Powered by  MyPagerank.Net
ThaiBlog.info

Thaibloglink.com

free stats

eXTReMe Tracker