บทความนี้จะมาพูดถึงการออกแบบเว็บไซต์ boxzaweb แบบชำแหละหน้าเว็บออกมาให้ดูเลยนะครับ แต่ในที่นี้จะพูดถึงการออกแบบในหน้าโฮมเพจเป็นหลักครับ เนื้อหาแบ่งเป็น 6 ส่วนดังนี้ครับ
1.ส่วนหัวเว็บไซต์
2.ภาพรวมบริการ
3.บริการ
4.จุดเด่น
5.ผลงาน
6.ติดต่อเรา
ภาพรวมของหน้าแรก / ออกแบบเน้น การสื่อสารและ seo มากกว่าเน้นสไตล์เวลาเราทำเว็บเน้นการสื่อสาร ในหน้าแรกควรวางโคงหลักว่ามีเป้าหมายอะไรและจะสื่ออะไร หน้าโฮมเพจคือหน้าที่ลูกค้าจะเห็นก่อน ดังนั้นเราต้องพยายามหาทางปรับปรุงให้ดูน่าสนใจที่สุด เปรียบก็เหมือน หน้า 1 หนังสือพิมพ์,หน้าปกหนังสือ,หน้าบ้าน,ตรงนี้ก็แล้วแต่จะจินตนาการนะครับ แต่เป้าหมายของหน้าแรกนอกจาก ต้องเน้นสร้างความประทับใจให้มากที่สุดแล้ว ต้องคำนึงถึงความง่ายที่สื่อสาร การรวบรวมข้อมูลที่น่าสนใจเบื้องต้น ความไวในการโหลดหน้าเว็บเพจและสุดท้ายโครงสร้างด้าน seo ข้อเสียของการออกแบบลักษณะนี้ คือ เวลาดูในมือถือจะเห็นเนื้อหายาวเกินไปและไม่ใช่เว็บไซต์ที่ดีในความหมายของเว็บนัก เพราะเว็บที่ดีจะเน้นนำเสนอด้วยภาพมากกว่า แต่เป้าหมายในที่นี้คือ เน้นเอาใจ google เป็นหลัก เลยให้ความสำคัญกับเนื้อหามากกว่าครับ
ภาพรวมการออกแบบ-ทำเลย์เอาท์แบบ box เพราะแบบนี้จะทำให้โหลดเพจสปีดได้ดีกว่าแบบ full width
-พยายามลดการใช่ลูกเล่นหรือ effect และบีบน้ำหนักภาพให้เบาลงทุกภาพ
-เน้นไปที่เนื้อหาเป็นหลักและลดการทำลิงค์ออกไปหน้าเว็บเพจอื่น (ลิงค์ไปเว็บเพจอื่นจะมีรายละเอียดด้าน seo ว่างๆจะนำเสนอข้อมูลอีกทีครับ)
1.ส่วนหัวเว็บไซต์เป้าหมายการสื่อสารคือ เน้นสร้างความประทับใจแรกที่เห็นหรือเน้นดึงดูด เพื่อให้ลูกค้าอยากดูเนื้ออื่นต่อไป ตรงนี้ยังไงต้องทำให้สวยที่สุด วันนี้ไม่สวย วันหน้าก็ทำเปลี่ยนใหม่
ด้าน seo : เนื่องจากเป็นภาพขนาดใหญ่เลยทำให้หน้าเว็บไซต์หนักไปด้วย ผมเลยใช้แค่ภาพเดียวไม่ทำสไลด์แล้วไปบีบน้ำหนักภาพ ข้อดีคือเบา ข้อเสียคือ มันนิ่งไม่มีการเคลื่อนไหว ทำให้น่าสนใจน้อยลง
2.ภาพรวมบริการเป้าหมายการสื่อสารคือ บอกภาพรวมบริการ ต้องพยายามเขียนให้กระชับและดูน่าสนใจ ตรงนี้ผมเองก็พยายามปรับเรื่อยๆครับ
ด้าน seo : ส่วนนี้จะเป็นส่วนของ taxt ล้วนๆและเป็นส่วนแรกของเนื้อหา ต้องเน้นที่สุดในเรื่อง keyword ที่เป็น <H1>,<H2>,<B> รวมถึงคำ suffix ที่เกี่ยวข้อง เพื่อให้ระบบ google นำปัจจัยเหล่านี้ไปประเมินเพื่อจัดอันดับการค้นหา *** google ดูคำทั้งเว็บและมองเป็นคำๆเลยนะครับ แต่ตรงนี้ผมคิดว่าต้องเน้นที่สุด
3.บริการเป้าหมายการสื่อสารคือ บอกรายละเอียดเบื้องต้นถึงบริการและให้ลูกค้าเข้าไปอ่านเพิ่มเติมครับ ตรงนี้จะพยายามเน้นให้เด่นหน่อยครับ ใจจริงอยากวางหลังจุดเด่น แต่จากการถามความเห็นคนทั่วไป ส่วนนี้คือสิ่งที่ลูกค้าอยากเห็นมากที่สุดก็เลยนำมาไว้เป็น section ที่ 3
ด้าน seo : ก็พยายามหาทางแทรก keyword เข้าไปครับแต่ไม่ควรเน้นเยอะเกินจนเหมือน spam ครับ และผมก็ดรอปสีภาพให้จางลง + กับบีบขนาดภาพ เพื่อให้เบาขึ้น
4.จุดเด่นเป้าหมายการสื่อสารคือ ให้ลูกค้ารู้สึกสนใจในบริการมากขึ้นครับ จริงเเล้วจุดเด่นข้อดีมันมีเยอะนะครับ ( แอบเชียร์สินค้า...นิดนึง ) แต่ใส่หมดก็จะมีเนื้อหาเยอะเกินไปดูน่าเบื่อ เพราะภาพรวมหน้าแรกทั้งหมดก็มีเนื้อหาเยอะพอตัวแล้วครับ เลยใส่ข้อมูลพอสังเขป
ด้าน seo : ตรงนี้ก้เหมือนเดิมครับหาทางแทรก keyword พอประมาณไม่ให้ดูสแปมจนเกินไป
5.ผลงานเป้าหมายการสื่อสารคือ ให้ลูกค้าดูตัวอย่างงานเบื้องต้น ใจจริงไม่อยากใส่ด้วยครับ แต่คำนึงว่าหน้าเเรกลูกค้าอยากเห็นภาพรวมสิ่งที่ต้องการก็เลยนำมาแสดงไว้ครับ เท่าที่สังเกตหน้าแรกจะเป็นหน้าที่ลูกค้าจะพยายามทำความเข้าใจมากที่สุดครับ
ด้าน seo : เนื่องจากส่วนนี้เป็นภาพและลูกเล่นสไลด์ ทำให้หนักทั้งขนาดภาพและโค้ด ผมก็เลยใส่ภาพไม่เยอะและที่สำคัญก็คือการบีบขนาดไฟล์เช่นเดิมครับ
6.ติดต่อเราเป้าหมายการสื่อสารคือ ให้ลูกค้ารู้ว่าจะติดต่อเราอย่างไรครับ จริงแล้วพวกช่องทางติดต่อนี่ ตามความถนัดของผู้ชมเว็บไซต์ เราควรจะนำไปไว้ส่วนบนๆด้วยครับ แต่เว็บไซต์ผมเองก็ยังไม่ได้ใส่ เดี๋ยวว่างก็ว่าจะเอาเบอร์ไปแทรกไว้ช่วงบนๆด้วยครับ และอีกส่วนคือ footer ส่วนใหญ่จะใส่ที่อยู่ รวมลิงค์ แต่ผมจะไม่ได้ทำครับเพราะว่า พื้นที่เว็บมีมากพอแล้ว ส่วนลิงค์อื่นๆจะเหมาะกับเว็บที่มีลิงค์ปลีกย่อยเยอะ เว็บผมเป็นไซต์ขนาดกลางที่ไม่ได้วับซ้อนอะไรก็เลยไม่ใส่ครับ
ด้าน seo : ส่วนนี้ก็ไม่มีอะไรมากครับ ก็เพียงเเทรก keyword และไม่่ใส่ลิงค์ปลีกย่อยเพราะจะทำให้ลดคะแนนด้าน seo ไป