5250110004: Lecture

กระบวนการพัฒนาเว็บไซต์

การ จัดระบบโครงสร้างข้อมูลเป็นพื้นฐานในการออกแบบเว็บไซท์ที่ดี ได้แก่ รูปแบบการนำเสนอ ระบบการทำงานแบบจำลอง ระบบเนวิเกชัน และอินเตอร์เฟสของเว็บ ดังนั้น การจัดระบบโครงสร้างข้อมูลจึงเป็นสิ่งสำคัญที่เกี่ยวข้องอยู่ในกระบวนการออกแบบเว็บไซต์ การ จัดระบบโครงสร้างข้อมูล คือการพิจารณาว่า เว็บควรจะมีข้อมูลและการทำงานใดบ้าง โดยเริ่มจากการกำหนดเป้าหมาย กลุ่มผู้ใช้เป้าหมาย เนื้อหาและการใช้งานที่จำเป็น นำมาจัดกลุ่มให้เป็นระบบ
Phase 1 : สำรวจปัจจัยสำคัญ(Research)
1. รู้จักตัวเอง-กำหนดเป้าหมายและสำรวจความพร้อม
2. เรียนรู้ผู้ใช้-ระบุกลุ่มผู้ใช้และศึกษาความต้องการ
3. ศึกษาคู่แข่ง-สำรวจการแข่งขันและการเรียนรู้คู่แข่ง
Phase 2 : พัฒนาเนื้อหา(Site Content)
4. สร้างกลยุทธ์การออกแบบ
5. หาข้อสรุปขอบเขตเนื้อหา
Phase 3 : พัฒนาโครงสร้างเว็บไซท์(Site Structure)
6. จัดระบบข้อมูล
7. จัดทำโครงสร้างข้อมูล
8. พัฒนาระบบเนวิเกชัน
Phase 4 : ออกแบบและพัฒนาหน้าเว็บ(Visual Design)
9. ออกแบบลักษณะหน้าตาเว็บ
10. พัฒนาเว็บต้นแบบและข้อกำหนดสุดท้าย
Phase 5 : พัฒนาและดำเนินการ (Production & Operation)
11. ลงมือพัฒนาเว็บ
12. เปิดเว็บไซท์
13. ดูแลและพัฒนาต่อเนื่อง

การสร้างเอกลักษณ์

การการวางแนวความคิดของเว็บไซต์ที่ชัด ของเว็บไซต์

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

2. ลักษณะการออกแบบเว็บไซต์ รูปแบบลักษณะการออกแบบเว็บไซต์ต้องมีความโด่นเด่น และมีลักษณะเฉพาะตัวของกิจการ เช่น

การใช้สีสัน ที่มีความเป็นเฉพาะตัวและเหมาะสมกับกลุ่มเป้าหมายที่จะใช้บริการ

การวางรูปแบบบหรือเลย์เอาท์ ของตัวเว็บไซต์ ให้มีความเหมาะสมกับรูปแบบของข้อมูลและรูปแบบของเว็บไซต์

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

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

4. มีความสอดคล้องกับแบรนด์สินค้าหรือบริการหลัก

หาก กิจการมีสินค้าหรือ บริการที่มีลักษณะของแบรนด์สินค้าอย่างชัดเจน รูปแบบของเว็บไซต์ก็ควรจะสอดคล้องกับรูปแบบของแบรนด์ของกิจการด้วย ด้วยทั้งสีหรือองค์ประกอบต่างๆ ยกตัวอย่างเช่นเว็บไซต์ของHutch (www.Hutch.co.th) นั้นได้มีการนำ Brand Identity มาแสดงในเว็บไซต์ได้อย่างชัดเจนและตรงไปตรงมา ทำให้ผู้ที่เข้ามาภายในเว็บไซต์Hutch เมื่อแรกเห็นโดยยังไม่เห็นโลโก้ของHutch ก็สามารถบอกได้ทันทีว่าเป็นเว็บไซต์ของ Hutch เพราะด้วยรูปแบบและองค์ประกอบที่Hutchได้สร้างไว้ในสื่ออื่นๆ ซึ่งสร้างความต่อเนื่องให้กับผู้ใช้บริการบนเว็บไซต์ด้วย

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

เทคนิคการทำ SEO

             การทำ SEO หรือ Search Engine Optimizer นั้นเป็นการทำให้โครงสร้างข้อมูลภายในเว็บของเราที่บรรจุอยู่ใน HTML ของเรา และพวกURL ของเรานั้น มีความหมายและทำให้ Crawler (ซึ่งต่อไปจะขอเรียกเป็น Search Engine เพื่อให้เข้าใจตรงกัน) นั้นสามารถเข้ามาเก็บข้อมูลในเนื้อหาของเราได้ง่าย และตรงกับความต้องการให้ได้มากที่สุด
          ซึ่งโดยปกติแล้วจะแนะนำให้ใช้ XHTML ร่วมกับ CSS โดยที่XHTML นั้นเป็นส่วนที่ใช้สำหรับใส่ข้อมูลและมี Tag พวก XHTML ต่าง ๆ เข้ามายุ่งเกี่ยวกับเนื้อหาให้น้อยที่สุด โดยมีแต่ส่วนที่กำหนดพื้นที่สำหรับแสดงผลต่าง ๆ เป็นชื่อที่สื่อความหมาย โดยใช้พวก <div> และ<span> แล้วกำหนดพื้นที่ของ Layout ด้วยชื่อที่กำหนดใน id หรือclass และโยนหน้าที่การกำหนด Layout ต่าง ๆ ไปที่ CSS ทั้งหมด เพื่อลดขนาดของไฟล์ HTML ที่ตัว Search Engine จะดึงไปเพื่อทำการParse ข้อมูลออกมา ทำให้ Search Engine ใช้เวลาประมวลผลต่าง ๆ ลดลงได้มากด้วย แถมลด B/W ลงไปได้เยอะมาก ๆ ในกรณีที่เว็บของเรานั้นมี Priority ในการเข้ามา index ข้อมูลของ Search Engine สูง ๆ
         1.ใส่ Keywords หลัก ๆ ลงบน Title เพราะเป็นพื้นที่ที่ระบบSearch Engine ใช้ในการเข้ามา index ข้อมูลอันดับแรก ๆ

2. ใช้ tag Heading (พวก <h*></h*> ต่าง ๆ) ให้เป็นประโยชน์เพื่อให้ Search Engine นั้นเข้าถึงข้อมูลสำคัญ ๆ ในส่วนนี้ก่อนเสมอ เพราะ Search Engine จะมองว่า Heading เป็นเหมือนหัวหลักของเนื้อหาเพื่อนำไปใช้สรุปเนื้อหาตอนค้นหาต่อไป

3. ใช้ alt, title, id, class และพวก caption ต่าง ๆ ที่ใช้อธิบายข้อมูลนั้น ๆ เพราะ Search Engine ไม่เข้าในว่ารูปภาพ หรือข้อมูลพวกBinary ต่าง ๆ ว่ามันคืออะไร

เช่น <img src=”dog.jpg” alt=”Dog jumping into the air” />

4. ใช้ META Tag ถึงแม้ว่า META Tag จะเป็นเทคนิคเก่า ๆ นับตั้งแต่มี WWW แต่ก็เป็นการดีที่เราควรจะมีไว้ เพราะ Search Engine ยังคงใช้ข้อมูลนี้เพื่อการจัดอับดับข้อมูลของเรา ในกรณีที่ข้อมูลในหน้านั้น ๆ มีมากเกินไป

5.ใช้ Sitemap โดยการสร้าง Sitemap นั้นมีเครืองมือให้ใช้อยู่มากมาย และยิ่งใช้พวก CMS/Blogware ต่าง ๆ พวก Drupal, Wordpress, XOOP, Joomla/Mambo, PHP-nuke ฯลฯ ก็มีmodule/component/plug-in เข้ามาช่วยสร้าง Sitemap ให้แทบทั้งนั้น โดยประโยชน์ของ Sitemap นั้นช่วยให้ตัว Search Engine นั้น ไม่ต้องวิ่งไต่ไปตามลิงส์ต่าง ๆ ของเว็บของเราเพื่อเข้าถึงข้อมูลทั้งหมด และยิ่งเว็บมีขนาดใหญ่และซับซ้อนมาก ๆ ยิ่งทำให้หน้าที่อยู่ในส่วนของรากลึก ๆ ต้นไม้ที่เป็นลำดับของลิงส์นั้นเข้าถึงยาก การมี Sitemap จึงช่วยในการบ่งบอกกับ Search Engine ได้ว่าเว็บของเรามีหลายอะไรอยู่บ้าง เพื่อให้ตัวSearch Engine เข้ามา Index ข้อมูลได้รวดเร็วและสะดวกขึ้น

6.ทำ URL Friendly หรือ Rewrite URL การทำ URL Friendly นั้นช่วยให้ Search Engine เข้าใจ URL ของเราและทำให้การเก็บ URL และแสดงผล URL เพื่อลิงส์กลับมาหน้าต่าง ๆ ของเว็บเรานั้นทำได้ง่ายมากขึ้น

หน้าเว็บ

Lecture

Chat Zaaaaa