โปรโมชั่นพิเศษ
! - จ่ายแล้วใช้ให้คุ้ม

ทำเว็บไซต์กับ iRookie บริการใจดีตลอดปี ไม่จำกัด (Unlimited) ในราคาเท่าเดิม หมดปัญหา เรื่องพื้นที่ ไม่พอใช้ไปได้เลย?

แท็ก "ปรับปรุงเว็บ"

การเขียน Website แบบ CSS (Cascading Style Sheets)

Wednesday, July 22nd, 2009

การเขียน Website แบบ CSS เป็นการเขียน Website ที่ทางบริษัท ครีเอเจอร์แลบ เน็ตเวิร์กโซลูชั่น จำกัด นำมาใช้กับลูกค้าทุกท่าน

CSS ใช้ในการจัดรูปแบบของเอกสารที่เขียนในภาษามาร์กอัป CSS เป็นภาษาที่สำคัญตัวหนึ่งในการเขียนเว็บเพจ ซึ่งเขียนในภาษา HTML และ XHTML แต่ก็ยังสามารถประยุกต์ใช้กับใน XML ซึ่งรวมถึง SVG และ XUL ด้วย มาตรฐาน CSS นั้น สร้างโดยกลุ่ม World Wide Web Consortium (W3C)

อธิบายให้เข้าใจง่ายก็คือ การเขียนแบบ CSS เป็นการเขียนเว็บไซต์ลักษณะที่ใหม่ และนิยมเป็นอย่างมาก เนื่องจากข้อดีของมันก็คือ จะแยกเขียนเป็นส่วนๆ และสามารถดึงส่วนนั้นๆ มาใช้ได้ คล้ายๆ กับการเขียนเป็น ฟังก์ชั่น ข้อดีอีกข้อนึงก็คือ สามารถทกให้ Search Engine หรือ Google ,Yahoo สามารถเห็น Website ของเราเป็นลำดับต้นๆ

สนใจสอบถามข้อมูลเพิ่มเติมในการจัดทำ Website โทร 086-568-6096 (ชานน)

การตั้งชื่อเว็บไซต์

Monday, January 12th, 2009

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

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

1. ชื่อสั้น จำง่าย พิมพ์ง่าย
อาจ จะไม่จำเป็นต้องมีความหมาย ก็ได้ แต่ถ้ามีความหมายด้วยก็ดี เช่น google , yahoo , amazon , ebay , sanook , pantip ฯลฯ แต่ในปัจจุบันนี้ ชื่อ สั้นๆ สวยๆ มักจะหาได้ยาก อาจจะต้องมีการ ผสมคำ รวมคำ ที่มีความหมาย หรือ อ่านแล้ว สละสรวย พ้องเสียง ดูแล้ว พ้องรูป นะครับ

2. ชื่อเป็น Keyword
สำหรับ กรณีนี้ ถ้าจะหาชื่อที่เป็น Keyword เดี่ยวๆ คำเดียว คงจะหาได้ยากแล้ว เข้าใจว่า คำทุกๆ คำที่อยู่ใน Dictionary ได้ถูกนำไปใช้เป็นชื่อโดเมนไปหมดแล้ว แต่ว่า เราสามารถ ใช้คำที่เป็น Keyword อย่างน้อย 2 คำ มาผสมกันได้ เช่น คำว่า Thailand + …….. เช่น ThailandShop , ThailandMarket , ThailandTravel เป็นต้น

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


ข้อห้าม ในการจดชื่อโดเมนเนม

1. อย่าจดชื่อที่เป็น Brand Name ของสินค้า หรือ ชื่อที่มีลิขสิทธิ์
เพราะเราอาจจะถูกฟ้อง หรือ ต้องยอมยกเว็บไซต์ นั้นๆ ให้เจ้าของไปเลยก็ได้

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

3. อย่าใช้ “-” คั่นระหว่างชื่อ
เช่น Thailand-Travel เพราะว่า นอกจากจะเป็นชื่อที่คล้ายกับ ชื่อ ThailandTravel แล้ว (ผิดกฏข้อ 2) ชื่อยังจะเรียกยาก พิมพ์ยากกว่า แบบ ไม่มีขีด คั่นกลาง

ปัจจุบัน Search Engine สามารถแยกคำที่เป็น Keyword ออกจากกันได้ ถ้าเราไม่สามารถหาชื่อที่ มี Keyword 2 คำติดกันได้ ก็อย่าใช้ชื่อนั้นเลยจะดีกว่า

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

โครงสร้างการออกแบบเว็บไซต์

Monday, November 24th, 2008

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

1. เว็บที่มีโครงสร้างแบบเรียงลำดับ (Sequential Structure)

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

2. เว็บที่มีโครงสร้างแบบลำดับขั้น (Hierarchical Structure)

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

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

3. เว็บที่มีโครงสร้างแบบตาราง (Grid Structure)

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

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

4. เว็บที่มีโครงสร้างแบบใยแมงมุม (Web Structure)

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

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