ทำเว็บไซต์ต้องเตรียมอะไรบ้าง

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

หน้าแรก

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

ส่วนที่ 0 ส่วนประกอบที่ขาดไม่ได้ในหน้าแรก

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

– สีของโลโก้ กับพื้นหลังของเว็บไซต์

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

– สัดส่วนของโลโก้ เช่น ทรงแนวนอน, ทรงแนวตั้ง, ทรงจัตุรัส เป็นต้น

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

ตัวอย่างโลโก้ที่แนะนำ

– การเตรียมไฟล์โลโก้

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

ส่วนที่ 1 คำโปรย, สโลแกน, แบนเนอร์

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

ส่วนที่ 2 บริการ หรือ สินค้า

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

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

ตัวอย่างหน้าเว็บขายสินค้าออนไลน์

ส่วนที่ 3 ผลงาน หรือ บทความ

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

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

ตัวอย่างหน้าเว็บ portfolio

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

ตัวอย่างบทความสำหรับทำเว็บไซต์

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

หน้าเกี่ยวกับเรา

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

วิธีเตรียมข้อมูลหน้าเกี่ยวกับเรา

หน้าสินค้า หรือ บริการ

กรณีที่เป็น หน้าบริการ

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

การเขียนเว็บหน้าบริการ

กรณีที่เป็น หน้าสินค้า

ประกอบด้วย

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

หน้าบทความ หรือ ผลงาน

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

บทความประกอบไปด้วย

  • รูปภาพหน้าปก
  • เนื้อหาบทความ
  • รูปภาพอื่นๆเพื่อประกอบเนื้อหา
ตัวอย่างบทความสำหรับทำเว็บไซต์

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

  • ผลงานแบบลงรูปภาพอย่างเดียวแสดงเป็นแกลเลอรี่ภาพ
  • ผลงานแบบมีรายละเอียดอธิบาย พร้อมรูปภาพประกอบ
ตัวอย่างหน้าเว็บ portfolio

หน้าติดต่อเรา

ข้อมูลหลักๆจะประกอบไปด้วย

  • ข้อมูลติดต่อทั่วไป เช่น ที่อยู่, เบอร์โทร, อีเมล
  • ช่องทางติดต่อออนไลน์ เช่น Facebook, Instagram, Twitter
  • ภาพแผนที่ หรือ ถ้าเคยปักสถานที่ไว้ใน Google maps แล้ว จะสามารถใช้แผนที่ของ Google maps มาวางได้
ออกแบบเว็บไซต์หน้าติดต่อเรา

การเตรียมรูปภาพสำหรับเว็บไซต์

รายการขนาดของรูปภาพตำแหน่งต่างๆหน่วยเป็น px (กว้าง x สูง)

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

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

สรุปการเตรียมข้อมูล

หน้าแรก

  • logo ไฟล์ .png หรือ .ai
  • รูปภาพขนาดใหญ่ สำหรับสไลด์
  • รูปภาพโปรโมชั่น (ถ้ามี)
  • ข้อความ คำโปรย สโลแกน ที่ต้องการแสดง

หน้าเกี่ยวกับเรา

  • ข้อมูลเกี่ยวกับบริษัท
  • รูปภาพประกอบ (ถ้ามี)

หน้าสินค้า หรือ บริการ

  • ภาพสินค้า และ ข้อมูลสินค้า หรือบริการ
  • หมวดหมู่สินค้า (ถ้ามี)

หน้าผลงาน หรือ บทความ

  • ผลงานต่างๆ คำอธิบาย พร้อมรูปภาพ
  • บทความ พร้อมรูปภาพ

หน้าติดต่อเรา

  • ข้อมูลติดต่อทั่วไป
  • ช่องทางติดต่อออนไลน์
  • ภาพแผนที่ หรือ Google map

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