ออกแบบเว็บไซต์ กับเราบริการออกแบบเว็บไซต์.คอม

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

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

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

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

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

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

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

ตัวอย่างการทำ Sitemap หรือ โครงสร้างเว็บไซต์

1. หน้าแรก
2. เกี่ยวกับเรา
   • ประวัติ
   • ความเป็นมา
3. บริการ/สิ้นค้า
   • product 1
   • product 2
4. ถามตอบ
5. ติดต่อเรา

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

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

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

วันนี้ขอแนะนำอีกบทความหนึ่งที่เขียนถึงขอดีของการใช้ CMS ในการสร้างหรือออกแบบเว็บไซต์ครับ

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

ข้อดี 10 ประการของการทำเว็บสำเร็จรูปด้วย CMS เปรียบเทียบกับเว็บสำเร็จรูปทั่วไป

เว็บไซต์ที่สร้างด้วย mambo (แมมโบ้) Joomla!TM (จูมล่า) ทำให้คุณมีเว็บไซต์ของตัวเอง โดยไม่ผูกติดกับเว็บไซต์ของผู้ให้บริการเหมือนเว็บไซต์สำเร็จรูปทั่วๆ ไป

ไม่เชื่อมต่อกับฐานข้อมูลของผู้ให้บริการเว็บไซต์สำเร็จรูป แต่มีฐานข้อมูลของตัวเอง

สามารถจัดการ Hosting และเลือก Hosting ของเว็บไซต์ตัวเองได้

สามารถจัดการโดเมนของเว็บไซต์ตัวเองได้

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

มีโปรแกรมเสริมมากมายให้ดาวน์โหลดฟรี

ติดตั้งง่าย ใช้งานง่าย สามารถบริหารจัดการเว็บไซต์ด้วยตัวเองได้ไม่ต่างจากเว็บสำเร็จรูป

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

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

Mambo เหมาะสำหรับการนำไปใช้กับเว็บไซต์ทุกประเภท ไม่จำเพาะเจาะจงว่าต้องนำมาใช้กับเว็บไซต์อีคอมเมิร์ซ หรือเว็บไซต์องค์กรเท่านั้น

แหล่งที่มาของบทความ

http://www.marvelic.co.th/articles.html

หลักการออกแบบเว็บไซต์

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

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

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

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

5. เทคนิคที่ดีต้องเลือกใช้ให้เป็น หลายครั้งที่นักออกแบบเว็บไซต์หลายคนมีความรู้ด้านการใช้เทคนิคทั้งจาก Flash Ajex Java CSS เพื่อเพิ่มความโดดเด่นให้กับเว็บไซต์แต่การใช้สิ่งเหล่านี้มากเกินไปก็จะทำให้เกิดข้อเสียทั้งในด้านความเร็ว เป็นหา Error ของเว็บเบราเซอร์ได้ง่าย พึงระลึกเสมอว่าไม่ใช่ทุกคนที่จะมีคอมพิวเตอร์คุณภาพดี เราต้องออกแบบและใช่คอมพิวเตอร์เครื่องเก่า ๆ เปิดเช็คงานว่ายังทำงานได้ดีอยู่รึเปล่าด้วยเสมอ

กว่าจะมาเป็นงานออกแบบเว็บไซต์แต่ละชิ้น ไม่ง่ายเลย

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

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

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

หลายทางท่านอาจจะไม่รู้ว่าจริง ๆ แล้วการออกแบบเว็บไซต์นั้นก็มีมาตราฐานเหมือนกัน ซึ่งถ้าถามว่าไอ้เว็บมาตราฐานนี้หน้าตาเป็นอย่างไร ผมก็คงบอกว่าที่จริงก็คือเว็บที่เราเห็นกันนิแหละครับ แต่ทุกเว็บจะทำตามมาตราฐานรึเปล่าอันนี้ผมก็คงไม่ได้นั่งตรวจสอบ แต่การออกแบบเว็บไซต์มาตราอย่างถูกต้องจะมีข้อดีก็คือได้ความเป็นสากล ซึ่งในที่นี้ก็คือการรองรรับเบราเซอร์ต่าง ๆ นั้นเอง ซึ่งประเทศไทยนั้นส่วนใหญ่ คนไทยจะดูเว็บไซต์ด้วย ie6 และ ie7 แต่ในต่างประเทศหรือแม้แต่ในประเทศไทยเองก็อาจจะมีกลุ่มคนที่นิยมเบราเซอร์ตัวอื่น ๆ อยู่เช่นเดี่ยวกัน ซึ่งเบราเซอร์แต่ละตัวก็อาจจะมีปัญหาด้านการแสดงผลบางอย่างที่ต่างกันเช่น ie6 ไม่รองรับไฟล์ PNG ไม่รองรับเว็บภาษาไทย เป็นต้น ซึ่งสิ่งเหล่านี้เราต้องมาดูกันว่าเว็บไซต์ที่เราต้องการามีกลุ่มคนอยู่กลุ่มไหน แต่ถ้าเราต้องการออกแบบเว็บเพื่อให้แสดงผลได้อย่าถูกต้องและครอบคุมทุกกลุ่มคนผู้ใช้เว็บมาตราการออกแบบ w3c ก็เป็นอีกสิ่งที่จะมองข้ามไม่ได้เลย นอกจากนี้ข้อดีอีกอย่างของเว็บที่ออกแบบโดยมาตราฐาน w3c คือการที่หน้าเว็บจะโหลดได้เร็วและส่งผลต่ออันดับการทำ seo ได้ดีด้วย แต่มาตราฐานการออกแบบเว็บของ w3c ก็มีหลายมาตราฐานอีกเช่นเดี่ยวกันดังนั้นผู้ออกแบบต้องมีความรู้ไม่มากก็น้อยในการออกแบบซึ่งปัจจุบันที่นิยมกันคือ DTD XHTML 1.0 Transitional & DTD XHTML 1.0 Strict นอกจากนี้ในอนาคตอันใกล้นี้มาตราฐานใหม่อย่าง HTML5 ก็กำลังจะมาแต่ปัจจุบันยังไม่เป็นที่นิยมมากนัก

ดังนั้นมาตราฐาน w3c ก็เป็นอีกสิ่งหนึ่งที่ไม่ควรมองข้ามนะครับ

ทุกวันนี้การออกแบบเว็บไซต์นอกจากที่เราจะเขียนโดยใช้ HTML โดยทั่วไป การเขียนควบคุมโครงสร้างด้วย CSS นั้นจะช่วยให้งานออกแบบเป็นไปอย่างมีระเบียบ และยังช่วยให้การเขียนโครตลดรูปลงไปได้เยอะมาก อีกประเด่นที่น่าสนใจคือการเขียนเว็บไซต์โดยแยกไฟล์ CSS นั้นช่วยให้การเขียนเว็บมีประสิทธิภาพเพิ่มมากขึ้น และมีเลเอาท์ที่อิสระมากยิ่งขึ้น แม้การออกแบบเว็บไซต์จะใช้ Div เป็นส่วนใหญ่ผมก็ยังแนะนำให้หลายคนเลือกใช้งานเขียนโครตแบบปกติถ้าจะช่วยให้งานเขียนเว็บไซต์ง่ายขึ้น เหตุผลเพราะบางครั้งขนาดเว็บไซต์ขนาด ๆ  10 - 20 kb ของสมัยนี้ไม่ได้มีผลต่อการโหลดมากนะ ไม่เหมือนสมัยก่อนที่การออกแบบนอกจากความส่วนงามยังต้องใส่ใจเรื่องของขนาดเว็บไซต์อีกด้วย

CSS คือ ชุดคำสั่งที่ใช้สำหรับการกำหนดการแสดงผลข้อมูลหน้าเว็บพจ ซึ่งคำเต็ม ๆ ของ CSS คือ Cascading Style Sheets เป็นมาตราฐาน หนึ่งของ W3C ที่กำหนดขึ้นมา เพื่อใช้ในการตบแต่งหน้าเอกสารเว้บเพจโดยเฉพาะ การใช้งาน CSS จะเข้ามาช่วยเพิ่มความสามารถให้กับ HTML เดิมที่เราใช้งานกันอยู่ในปัจจุบัน ซึ่งในปัจจุบันนี้ CSS ได้มาอยู่บนมาตราฐานที่เวอร์ชั่น 2.0 (CSS2.0)

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

การใช้สีในการออกแบบเว็บไซต์

สีสันบนหน้าเว็บเป็นสิ่งที่สื่อและบ่งบอกความหมายของเว็บไซต์ให้เห็นได้อย่างชัดเจน การเลือกใช้สีให้เหมาะสมไม่เพียงแต่สร้างความกลมกลืน แต่ยังสร้างความรู้สึกความพึงพอใจตลอดจนถึงความง่ายในการเข้าถึงเนื้อหาให้กับผู้ใช้ นอกจากนี้สียังเป็นองค์ประกอบหลักสำหรับการตกแต่งเว็บ จึงจำเป็นอย่างยิ่งที่จะต้องทำความเข้าใจเกี่ยวกับการใช้สี ระบบสีที่แสดงบนจอคอมพิวเตอร์ มีระบบการแสดงผลผ่านหลอดลำแสงที่เรียกว่า CRT (Cathode ray tube) โดยมีลักษณะระบบสีแบบบวก อาศัยการผสมของของแสงสีแดง สีเขียว และสีน้ำเงิน หรือระบบสี RGB สามารถกำหนดค่าสีจาก 0 ถึง 255 ได้ จากการรวมสีของแม่สีหลักจะทำให้เกิดแสงสีขาว มีลักษณะเป็นจุดเล็ก ๆ บนหน้าจอไม่สามารถมองเห็นด้วยตาเปล่าได้ จะมองเห็นเป็นสีที่ถูกผสมเป็นเนื้อสีเดียวกันแล้ว จุดแต่ละจุดหรือพิกเซล (Pixel) เป็นส่วนประกอบของภาพบนหน้าจอคอมพิวเตอร์ โดยจำนวนบิตที่ใช้ในการกำหนดความสามารถของการแสดงสีต่าง ๆ เพื่อสร้างภาพบนจอนั้นเรียกว่า บิตเด็ป (Bit-depth) ในภาษา HTML มีการกำหนดสีด้วยระบบเลขฐานสิบหก ซึ่งมีเครื่องหมาย (#) อยู่ด้านหน้าและตามด้วยเลขฐานสิบหกจำนวนอักษรอีก 6 หลัก โดยแต่ละไบต์ (byte) จะมีตัวอักษรสองตัว แบ่งออกเป็น 3 กลุ่ม เช่น #FF12AC การใช้ตัวอักษรแต่ละไบต์นี้เพื่อกำหนดระดับความเข้มของแม่สีแต่ละสีของชุดสี RGB โดย 2 หลักแรก แสดงถึงความเข้มของสีแดง 2 หลักต่อมา แสดงถึงความเข้มของสีเขียว 2 หลักสุดท้ายแสดงถึงความเข้มของสีน้ำเงิน

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

1.    สีโทนร้อน (Warm Colors) เป็นกลุ่มสีที่แสดงถึงความสุข ความปลอบโยน ความอบอุ่น และดึงดูดใจ สีกลุ่มนี้เป็นกลุ่มสีที่ช่วยให้หายจากความเฉื่อยชา มีชีวิตชีวามากยิ่งขึ้น
2.    สีโทนเย็น (Cool Colors) แสดงถึงความที่ดูสุภาพ อ่อนโยน เรียบร้อย เป็นกลุ่มสีที่มีคนชอบมากที่สุด สามารถโน้มนาวในระยะไกลได้
3.    สีโทนกลาง (Neutral Colors) สีที่เป็นกลาง ประกอบด้วย สีดำ สีขาว สีเทา และสีน้ำตาล กลุ่มสีเหล่านี้คือ สีกลางที่สามารถนำไปผสมกับสีอื่น ๆ เพื่อให้เกิดสีกลางขึ้นมา

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

เรื่องที่ต้องคิดก่อนการออกแบบเว็บไซต์

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

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

กำหนดเป้าหมายของเว็บไซต์

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

กำหนดกลุ่มผู้ใช้เป้าหมาย

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

มองสิ่งที่ผู้ใช้ต้องการจากเว็บ

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

ข้อมูลหลักที่ควรมีอยู่ในเว็บไซต์

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

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

1. ความเป็นเอกลักษณ์ (Identity)

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

2. เนื้อหา (Useful Content)

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

3. ระบบเนวิเกชั่น (User-Friendly Navigation)

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

4. คุณภาพของสิ่งที่ปรากฏให้เห็นในเว็บไซต์ (Visual Appeal)

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

5. ความสะดวกของการใช้ในสภาพต่าง ๆ (Compatibility)

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

6. ความคงที่ในการออกแบบ (Design Stability)

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

7. ความคงที่ของการทำงาน (Function Stability)

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

การออกแบบเว็บไซต์ที่ควรรู้ของยุคนี้ ไม่ใช่แค่ออกแบบเพราะมันมีอะไรมากกว่านั้น

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