วันศุกร์ที่ 16 มีนาคม พ.ศ. 2555

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

ต้องอ่านง่ายสบายตา (Read Ability)

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

โหลดไม่ช้าหน้าไม่ยาว (Fast Load)

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

อัพเดทข่าวให้บ่อย (Update)

ส่วนนี้เป็นจุดเชิดชูของเว็บเลยนะครับ ผมขอร้องเลยครับว่าถ้าทำเว็บแล้วอย่าทำครั้งเดียวทิ้ ง ขอให้ทำแล้วทำตลอดไปเรื่อยๆเลยครับ (พวกทำครั้งเดียวแล้วไม่อัพเดทหรือนานๆทจะอัพเดท น่าจะเหมาะเว็บที่มีเนื้อหาตายตัว เช่น ประวัติศาสตร์ชาติไทย หรือ ทฤษฎี ต่างๆ ทางคณิตศาสตร์) เพราะผมเข้าไปหลายเว็บตามเว็บสมัครเล่นมีประมาณ 60% เลยครับที่ทำแล้วปล่อยทิ้งไว้ ไปดูกี่ทีกี่ครั้ง Last Update ก็ยังอยู่ที่ 02/06/1999 เจออย่างนี้ก็น่าเบื่อนะครับ ผมขอแนะนำว่า ถ้าจะให้ดีข้อมูลควร update ทุกๆ 2 - 3 วันต่อครั้ง หรือ 1 อาทิตย์ครั้ง หรือ 15 วันครั้ง หรือถ้าเดือนละครั้งอันนี้ก็ชักเริ่มไม่ไหวนะครับ แต่ถ้าท่านไม่มีเวลาจะ update จริงๆ ควรจะเขียนกล่าวไว้ที่หน้าเว็บว่าจะงด update ชั่วคราวเพื่อจะได้ไม่เสีย creadit ของตัวเองครับ และให้ลูกค้าติดตามมาดูบ่อยๆด้วย หรือถ้าเราต้องการให้เว็บเรามีความเคลื่อนไหวตลอดเวล าเราควรใช้พวกสคิ้ปมาช่วยเหลือ เช่น Webboard , Sticker , ShoutBox , Web Fetching System ซึ่งทั้งหมดนี้เราจะต้องทำทำให้มีคนติดเว็บเราเสียก่ อน ถึงจะเริ่มใช้พวกนี้ได้ แล้วการอัพเดทมันก็จะเป็นไปโดยอัตโนมัติ เช่น มีคนมาลง Sticker ใหม่ก็จะเอาขึ้นหน้าแรกเอง พร้อมกับวันนี้มีข่าวใหม่ๆ มันก็จะดีงหัวข้อข่าวมา และก็มีคนมาโพสคุยกันใน Webboard แล้วแสดงในหน้าแรก แค่นี้เว็บเราก็เป็นแบบ Interactive ย่อยๆแล้วหล่ะครับ คราวนี้เราก็จะมาอัพเดทอีกครั้งก็ตอนที่เปลี่ยนแปลงรูปแบบหรือพัฒนาสคิ้ปใหม่ เท่านั้นเองครับ

อย่าปล่อยให้มีคำผิด (Good Spelling)

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

ทุกทิศมีที่ไป (Navigation Bar)

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

เครื่องหมายมีให้ติดตาม (Use Sign)

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

ทุกคำถามต้องมีคำตอบ (FAQ)

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

ทุกคำชอบต้องมีโชว์ (Testimonial)

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

โลโก้ชัดไม่ขัดตา (Logo, Brand Name & Tel No.)

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

เพื่อลูกค้าใช้อ้างอิง (Reference Address)

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

ทุกอย่างต้องหาได้ (Search)

หากเว็บคุณเป็นเว็บขายสินค้าหลายๆประเภทหรือมีบทความ หลายๆเรื่องหรือข้อมูลมากมายแล้วหละก็ ขาดไม่ได้เลยครับสำหรับ เครื่องมือที่ที่ไว้สำหรับ Search ในเว็บของเราเอง เพื่อการค้นหาที่สะดวกขึ้นและ ลดระยะเวลาของลูกค้าไปในตัวด้วย และที่สำคัญในการทำเว็บทุกหน้าคุณควรกำหนด META Tag ไว้ทุกหน้าครับ ในส่วนของ Description ให้อธิบายถึงเว็บของคุณ และใน Keyword ให้อธิบายคำต่างๆโดยใช้รูปแบบดังนี้ thai,free,source,sourcecode,download,free,... ซึ่งคำเหล่านี้เองจะทำให้พวก Search Engine เจอเว็บคุณบ่อยขึ้นถ้ายิ่งมีมากและยิ่งมีคำที่ผู้คนทั่วไปค้นบ่อยๆ และคำที่ผู้คนค้นบ่อยๆ เช่น thai,web,sex,free,download,service,email และในปัจจุบันคุณไม่ต้องเขียนสคิ้ปเองเพื่อให้มี Search ในเว็บคุณแต่คุณสามารถไปขอบริการได้ฟรีจาก Google.com ครับ (แต่ต้องหากันสักหน่อย มันจะอยู่ในส่วนของ Service)

ทุกอย่างง่ายทำได้เอง (Help)

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

ท่องไซต์ให้ครื้นเครง (Fun Stuff)

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

ต้องเกรงใจลูกค้า (Friendly Dialog)

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

ลดขนาดภาพให้เล็กสวยคงเดิม (Fix Image Size)

การลดขนาดของรูปในที่นี้ผมไม่ได้หมายความว่า ให้เอารูปขนาด 500 x 500 มาย่อในโปรแกรมเขียนเว็บให้เลือก 200 x 200 นะครับ เพราะการย่อแบบนั้น มันย่อให้รูปที่เราเปิดดูเล็กลงได้จริงแต่ขนาดหรือ Size นั้นก็ยังเท่าเดิม เวลาโหลดก็โหลดนานเท่าเดิมดังนั้นมันจะไม่ช่วยอะไรขึ้นมาเลย แต่สิ่งที่ผมจะบอกคุณคือ ให้ย่อขนาด หรือลดขนาดของภาพ โดยใช้โปรแกรมพวก Photoshop หรือโปรแกรมเกี่ยวกับการแต่งภาพอื่นๆ เพราะการย่อขนาดในนั้นจะช่วยทำให้ภาพของคุณ ลดขนาดตามไปด้วย แต่การลดขนาดนั้นคุณก็ต้องมีความรู้ทางโปรแกรมกราฟฟิ กนั้นไม่น้อยเหมือนกัน เพราะเราต้องลดขนาดรูปให้ได้เยอะที่สุดแต่ยังสวยคงเดิม (คงเคยเห็นนะครับ รูปที่ ขนาด 50KB กับ 30KB สวยเหมือนกัน เพราะคนที่ย่อขนาดนั้นมีความสามารถในการปรับแต่งพอสม ควร) แต่ปัจจุบันมีโปรแกรมออกมาเพื่อการลดขนาดของรูปโดยเฉ พาะ ซึ่งผมจะนำมาให้ download กัน ก็ลองติดตามนะครับ

เรื่องของ Tag เปิดบ่อยๆ (Open tag)

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

Link ผิดต้องอย่าปล่อย (Link Break)

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

ลดขนาด file เว็บเรา ( Fix File Size)

 ขนาดของ file html นั้น แต่ก่อนไม่ค่อยมีการออกเว็บเท่าไรจึงมีขนาดไม่เกิน 20 -30 kb แต่ปัจจุบันมีการเล่นสคิ้ปและรูปแบบและเนื้อหามากขึ้ น ขนาดจึง ไปอยู่ที่ 70 - 150 kb แต่ตามความคิดผมไม่ควรจะเกิน 50 - 80 kb ครับ เพราะยิ่ง มากก็ยิ่งช้า เหมือนกับเรากำลัง download file ชนิดหนึ่งที่มีขนาด 100 kb คุณว่านานไหมล่ะ(แค่ตัวหนังสือไม่รวมรูปหรืออื่นๆนะ) แต่ถ้าจำเป็นก็ไม่เป็นไรครับ เพราะปัจจุบัน เรื่องของ Internet เร็วพอสมควร และพอมีวิธีแก้ไขบ้างคือให้ตัดช่วงของข้อมูลไปหลายๆห น้าเพื่อลดความยาวและขนาดไฟล์ลงด้วย

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

2) Graphic for web (Create template)-Photoshop

Photoshop

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

Illustrator

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

3) Animation for web

เป็นการสร้างอนิเมชั่นให้ไปอยู่บนเว็บไซต์ ซึ่งเป็นการตกแต่งไซ โดยมีภาพเครื่อนไหว 2มิติ หรือ เกิดจากการเปลี่ยนตำแหน่งของวัตถุ ที่เราอยากให้เคลื่อนที่ โดยใช้หลักภาพลวงตา ให้ดูเหมือนว่าภาพนิ่งเหล่านั้น มีการเคลื่อนไหว โปรแกรมที่ใช้สร้าง เช่น
Flash
อุดมไปด้วยภาพเคลื่อนไหว วีดีโอที่นำไปใส่ตกแต่งไว้ในเว็บ ที่ใช้บ่อยสำหรับการโฆษนา เกมส์แฟลชจัดการเวกเตอร์และราสเตอร์กราฟิกเพื่อให้การเคลื่อนไหวของข้อความ, ภาพวาด, และภาพนิ่ง ซึ่งแฟลตสนับสนุนงานแบบสตรีมมิ่งโปรแกรมเอาไว้เล่นไฟล์ flash มักมาในรูปแบบ plugin ในบราวเซอร์ต่างๆ ถ้าลงโปรแกรมนี้ลงไป ก็จะสามารถเปิดเว็บที่มีเนื้อหาเป็น flash ได้
Image ready
โปรแกรมที่มากด้วยความสามารถ เช่น สร้างภาพเคลื่อนไหวได้ดีเยี่ยม ตัดแบ่งภาพออกเป็นส่วนๆ สร้างเทคนิคตัวอักษรหลากหลาย และอื่นๆ image ready เปนโปรแกรมที่มาพร้อมกับ photoshop เมื่อติดตั้ง

Photoshop ลงไปในเครื่องเสร็จแล้ว imageready จะถูกติดตั้งมาด้วยเพื่อผู้ใช้สามารถใช้โปรแกรมร่วมกัน โดย image ready จะสนับสนนการออกแบบภาพเคลื่อนไหวสำหรับเว็บโดยสามารถทำงานสะดวก รวดเร็วและสวยงาม
Swish
สำหรับศิลปินกราฟิกหรือเว็บแบบมืออาชีพ เครื่องมือวาดภาพขั้นสูงสคริปต์วิดีโอ flash ใช้งานได้ง่าย แม้จะไม่มีสมบูรณ์เท่า macromedia flash แต่ก็ใช้สร้างแฟ้ม swf ได้ดีเป็นที่น่าพอใจ เช่น การใส่ภาพนิ่ง ภาพเคลื่อนไหว เสียง หรือการใส่ action อย่างง่าย




 
4) Website Language
HTML ย่อมาจาก Hypertext Markup Language

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

PHP: Hypertext Preprocessor

PHP เป็นวัตถุประสงค์ทั่วไปในฝั่งเซิร์ฟเวอร์ ภาษาสคริปต์ออกแบบมาสำหรับการพัฒนาเว็บในการผลิตหน้าเว็บแบบไดนามิก พัฒนาด้านเซิร์ฟเวอร์ภาษาสคริปต์

ASP

ASP(Active Server Page) เป็นเทคโนโลยีที่ทำงานทางฝั่งด้านเซิร์ฟเวอร์ ที่ถูกออกแบบมาให้ง่ายต่อการพัฒนาแอพพลิเคชั่นผ่านเว็บเซิร์ฟเวอร์สำหรับนักพัฒนาเว็บไซต์
การใช้งาน ASP สามารถกระทำได้โดยเขียนคำสั่งหรือสคริปต์ต่างๆ ในรูปของเท็กซ์ไฟล์ธรรมดาทั่วๆไป แล้วนำมาเก็บไว้ที่เซิร์ฟเวอร์ เมื่อมีการเรียกใช้งานจากบราวเซอร์ ไฟล์เอกสาร ASP ก็จะถูกแปลโดย Server Interpreter แล้วส่งผลที่ได้ส่งกลับไปเป็นภาษา HTML ให้บราวเซอร์ที่เรียกดังกล่าว
เนื่องจาก ASP สามารถรองรับได้หลายภาษา เช่น VBScript ,Jscript ,Perl และภาษาสคริปต์อื่นๆ ดังนั้นนักพัฒนาเว็บไซต์จึงไม่มีความจำเป็นต้องมีความรู้หรือต้องศึกษาในทุกภาษาเนื่องจาก ASP ได้ถูกออกแบบมาให้ขึ้นกับความรู้ของนักพัฒนาเว็บไซต์นั่นเอง
การทำงานของโปรแกรม ASP นั้นจะทำงานอยู่ที่ฝั่งของ Server เท่านั้น เราจึงเรียกว่าเป็นการทำงานแบบ Server Side ซึ่งจากการทำงานทางฝั่ง Server ของ ASP นั้น ทำให้ Web Browser ของฝั่ง Client จะทำหน้าที่เพียงรับผลลัพธ์ที่ได้จากการทำงานทางฝั่ง Server เท่านั้น

CSS

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

SQL

SQL เป็นภาษามาตรฐานที่ใช้ติดต่อกับระบบฐานข้อมูลเชิงสัมพันธ์ (Relational Database Management System) หรือ RDBMS ซึ่ง ANSI ได้ประกาศออกมาอย่างเป็นทางการ ดังนั้น ผู้ที่ทำงานกับฐานข้อมูลในปัจจุบันจำเป็นต้องรู้ เนื่องจากระบบฐานข้อมูลที่มีอยู่ในปัจจุบันเกือบทั้งหมดเป็นระบบฐานข้อมูลแบบ RDBMS

SQL สามารถแบ่งคำสั่งออกเป็น 4 กลุ่ม คือ

1. Data Manipulate(DML) เป็นคำสั่งจัดการข้อมูล ได้แก่ INSERT, UPDATE, DELETE, ROLLBACK, COMMIT

2. Data Definition (DDL) เป็นคำสั่งจัดการกับไฟล์ในฐานข้อมูล ได้แก่ CREATE, ALTER, DROP

3. Query เป็นคำสั่งการเรัยกดูข้อมูล คือ SELECT

4. Data Control เป็นคำสั่งจัดการความปลอดภัย

Javascrip

คือ ภาษาโปรแกรมคล้ายภาษาซี ถูกใช้ร่วมกับภาษาเอชทีเอ็มแอลในการพัฒนาเว็บเพจ ประมวลผลในเครื่องของผู้ใช้ ช่วยให้การนำเสนอเป็นแบบโต้ตอบกับผู้ใช้ได้ในระดับหนึ่ง ภาษาโปรแกรมที่มีโครงสร้างคล้ายภาษาซี ทำหน้าที่แปลความหมาย และดำเนินการทีละคำสั่ง ภาษานี้มีชื่อเดิมว่า LiveScript ถูกพัฒนาโดย Netscape Navigator เพื่อช่วยให้เว็บเพจสามารถแสดงเนื้อหา ที่มีการเปลี่ยนแปลงได้ ตามเงื่อนไข หรือสภาพแวดล้อมที่แตกต่างกัน หรือโต้ตอบกับผู้ใช้ได้มากขึ้น เพราะภาษา HTML ที่เป็นภาษาพื้นฐานของเว็บเพจ ทำได้เพียงแสดงข้อมูลแบบคงที่ (Static Display)


5) WYSWYG
Dreamweaver       โปรแกรมช่วยเขียนโฮมเพจคุณภาพสูง มีเครื่องมือหลายๆที่ช่วยให้คุณเขียนโฮมเพจได้สะดวกสะบายขึ้น และนอกจากนี้แล้ว โปรแกรมนี้ก็ยังรองรับการเขียนภาษาDHTML หรือที่รู้จักกันในนามของ Dynamic HTML ซึ่งมันจะเป็นตัว ที่ช่วยเพิ่มลูกเล่นให้กับเว็บเพจ อีกทั้งมีระบบช่วยเติม Source code ของภาษา Html อย่างอัตโนมัติ และยังสามารถช่วยจัดการกำหนดค่าของรูปภาพที่จะนำมาใส่ประกอบในเว็บได้อย่างสะดวก .... โปรแกรมนี้ได้เป็นที่นิยมกันมาก นะครับผม ในหมู่ของ เวบมาสเตอร์ ต่างๆ ทั้งในเมืองไทย และ ในต่างประเทศ นะครับผม และ ทั้งมือเก่าและมือใหม่ อีกด้วย
6) VDO on website
 เป็นการแทรกวีดีเข้าไปหน้าเว็บของเราผู้ใช้สามารถดูออไลน์ได้ดโดยไม่ต้องดาวโหลดน์เหมือนกับเราดูในเว็บyoutube

7) Google friendly
      ซึ่งถ้าผู้ใช้พิมพ์ข้อความอะไรก็ได้ที่จะหาใน Google เนื้อหาของเราก็จะขึ้นมาก่อน ทำให้เว็บไซต์ของเรามีคนเขาถึงได้มากอย่างง่ายดาย
การจะทำให้เนื้อหาของไซต์เราขึ้นเนื้อหาแรก ๆ การทำเช่นนี้เราต้องไปสมัคร กับ Google ก่อน
ขั้นตอนของเว็บไซต์ที่เป็นมิตรกับ Google เริ่มต้นจากการเกิดของเว็บไซต์ในเวลาเดียวกันคุณเลือกชื่อโดเมน คุณควรเลือกชื่อโดเมนที่จะบอกเกี่ยวกับเรื่องของเว็บไซต์ของคุณ คุณควรมีสมาธิในรูปแบบหนึ่งที่มีเว็บไซต์หนึ่ง เพียงแค่เติมเว็บไซต์ของคุณด้วยเนื้อหาที่เฉพาะเจาะจงเท่านั้น
คือ นำเสนอเนื้อหาที่มีคุณภาพสูงบนหน้าเว็บของเราโดยเฉพาะหน้าแรก หากหน้าเว็บของเรามีข้อมูลที่เป็นประโยชน์ เนื้อหาของเรา จะดึงดูดผู้เข้าชมจำนวนมาก และดึงดูดเว็บมาสเตอร์เพื่อเชื่อมโยงไปยังเว็บไซต์ของเรา ในการสร้างประโยชน์เว็บไซต์ที่มีข้อมูลจะเขียนหน้าได้อย่างชัดเจนและถูกต้องอธิบายหัวข้อของเราได้ก่อนเสมอ เกี่ยวกับคำที่ผู้ใช้จะพิมพ์เพื่อค้นหาหน้าเว็บของเรา และรวมคำเหล่านั้นในเว็บไซต์เรา
8) CMS
เป็นระบบที่นำมาช่วยในการสร้างและบริหารเว็บไซต์แบบสำเร็จรูป โดยในการใช้งาน CMS นั้นผู้ใช้งานแทบไม่ต้องมีความรู้ในด้านการเขียนโปรแกรม ก็สามารถสร้างเว็บไซต์ได้ โดยที่ตัว CMS เองมีโปรแกรมประยุกต์ แบบพร้อมใช้งานอยู่ภายในมากมายอาทิ ระบบจัดการบทความและข่าวสาร(News and Story) ระบบจัดการบทวิจารณ์ (Review), ระบบจัดการสมาชิก(Mamber) ระบบสืบค้นข้อมูล(Search) ระบบจัดการไฟล์ดาวน์โหลด(Download), ระบบจัดการป้ายโฆษณา(Banner), ระบบการวิเคราะห์และตรวจสอบสถิติความนิยมในเว็บไซต์ (Analysis, Tracking and Statistics) เป็นต้น
Joomla
ใช้ภาษาในการเขียนเว็บไม่กี่ภาษา มาเป็นใช้ภาษาหลาย ๆ ภาษาร่วมกัน ไม่ว่าจะเป็นภาษา HTML, DHTML, PHP, ASP ฯลฯ นอกจากนี้หากต้องการให้เว็บไซต์ของเรามีความสวยงามก็จะต้องมีความรู้ทางด้านกราฟฟิกส์อีกด้วย ไม่ว่าจะเป็นการตัดต่อ ย่อ ขยาย รูปภาพ สร้างภาพที่เป็น GIF Animation หรือจะให้ดูนุ่มนวลก็จะต้องมีความรู้เกี่ยวกับการสร้าง Flash ด้วยความหลายกหลายที่จำเป็นจำต้องมีในเว็บไซต์นั้น การที่จะสร้างเว็บส่วนตัว หรือองค์กรให้สวยงามและมีประสิทธิภาพ ด้วยคนเพียงคนเดียวนั้นอาจต้องใช้เวลานานมาก ด้วยเหตุนี้ปัจจุบันจึงมีกลุ่มคนที่รวมตัวกัน และร่วมกันพัฒนา ต้องขอใช้คำว่า "เว็บไซต์กึ่งสำเร็จรูป" ขึ้นมา เพื่อเป็นการลดภาระการทำงานหลาย ๆ ด้าน ให้มีความง่าย และสะดวกมากยิ่งขึ้น โดยให้ความหมายกับสิ่งที่พวกเขาได้พัฒนาขึ้นว่า CMS
9) Web brower
Web Browser คือเป็นโปรแกรมใช้สำหรับการท่องเว็บไซต์ ท่องโลกอินเตอร์เน็ท เป็นโปรแกรมแสดงเว็บเพจหรือเว็บไซต์ที่โดนสร้างขึ้นมาจากภาษา HTML ที่จัดเก็บไว้ที่ระบบบริการเว็บหรือเว็บเซิร์ฟเวอร์ หรือระบบคลังข้อมูลอื่น ๆ โดยโปรแกรมค้นดูเว็บเปรียบเสมือนเครื่องมือในการติดต่อกับเครือข่ายคอมพิวเตอร์ขนาดใหญ่ที่เรียกว่าเวิลด์ไวด์เว็บ

Web Browser มีการแสดงข้อมูลในรูปของ ข้อความ ภาพ และระบบมัลติมีเดียต่างๆ ทำให้การดูเอกสารบนเว็บมีความน่าสนใจมากขึ้น

Web Browser ที่นิยมใช้อย่างแพร่หลาย

Internet Explorer
Mozilla Firefox
Google Chrome
Safari


10) FTP

FTP คือการแลกเปลี่ยนข้อมูลแบบ FTP หมายถึง การดาวน์โหลด หรือย้ายไฟล์ในระบบอินเตอร์เน็ตมายังเครื่องคอมพิวเตอร์ เช่นเดียวกันก็สามารถนำไฟล์จากเครื่องคอมพิวเตอร์ไปไว้ในพื้นที่เก็บข้อมูลโดยผ่านโปรแกรม FTP สามารถดาวน์โหลดไฟล์ได้หลายประเภทแล้วแต่ว่าผู้ใช้จะต้องการใช้งานไฟล์ประเภทใด จุดเด่นสามารถนำไปใช้รวมกับระบบการการทำเว็บไซต์ , เป็นช่องทางเก็บหรือส่งข้อมูลหาลูกค้าหรือภายในองค์กรได้ ที่ webmaster ใช้ นั่นคือ การ ftp อัพไฟล์ ขึ้นโฮส (host)
เอฟทีพี (FTP) ย่อมาจากภาษาอังกฤษว่า File Transfer Protocal : FTP หมายถึง การดึงไฟล์จากคอมพิวเตอร์ในเครือข่ายอินเทอร์เน็ตมายังเครื่องคอมพิวเตอร์ของเราหรือของผู้ใช้คนอื่น โดยปกติการดึงไฟล์จากอินเทอร์เน็ต เราจะต้องติดต่อไปยังผู้ให้บริการ ซึ่งเรียกว่า เอฟทีพีไซต์ (FTP Site) เอฟทีพีไซต์ที่สำคัญในอดีตจะเป็นหน่วยงานของรัฐบาล หรือมหาวิทยาลัย

FTP เป็นโปรแกรมที่ใช้สำหรับ upload/download หรือดูโครงสร้างของไฟล์และ directory ใน Server