top of page

ออกแบบเว็บไซต์ต้องทำอะไรบ้าง ฉบับมือใหม่✨


  ออกแบบเว็บไซต์ต้องทำอะไรบ้าง ฉบับมือใหม่✨  การออกแบบนั้นมีหลากหลายแขนง เมื่อพูดถึงการออกแบบก็ไม่ได้หมายความว่านักออกแบบทุกท่านจะทำทุกอย่างที่เกี่ยวกับการออกแบบได้ อาจต้องแยกออกไปตามรูปแบบสาขาที่ถนัด ที่ชื่นชอบ เช่นเดียวกันกับการออกแบบเว็บไซต์ เมื่อนักออกแบบสายงานอื่นๆ หรือผู้ที่ต้องการศึกษาอยากจะรู้ว่าการเริ่มต้นออกแบบเว็บไซต์นั้นมีอะไรบ้าง ต้องทำอย่างไรบ้าง และต้องเรียนรู้สิ่งเหล่านั้นอย่างไร บทความนี้อาจเป็นประโยชน์ต่อผู้ที่เริ่มต้นและต้องการศึกษาไม่มากก็น้อย  เพราะการออกแบบนั้นมีพื้นฐานที่ต่างกัน เราจึงจำเป็นต้องเรียนรู้หลักในการออกแบบของสิ่งที่เราต้องการออกแบบ เพื่อให้เป็นไปตามหลักการในการออกแบบสิ่งเหล่านั้นมากที่สุด ซึ่งข้อจำกัดที่แตกต่างของแต่ละงานออกแบบนั่นเองที่เป็นเสน่ห์ที่ทำให้เราจำเป็นต้องศึกษาและเรียนรู้ให้เข้าใจมากที่สุด โดยเราจะเริ่มต้นดังต่อไปนี้  เว็บไซต์มีกี่ประเภท ? จะออกแบบเว็บไซต์ได้อย่างไรถ้าไม่รู้เลยว่าเว็บไซต์มีกี่ประเภท ด้วยความที่คนเรามีความต้องการที่แตกต่างกันมากมายทำให้เว็บไซต์ประเภทต่างๆ เกิดขึ้นมากมายตามไปด้วย วันนี้เราจะขอยกตัวอย่างประเภทของเว็บไซต์ที่เรามักจะได้ออกแบบเว็บไซต์กันอยู่บ่อยๆ นั้นคือ 1. Corporate เว็บไซต์ Corporate คือเว็บไซต์ขององค์กรที่ต้องมีข้อมูลสำคัญไว้ใช้ติดต่อ (Contact) หรือข้อมูลต่างๆ เกี่ยวกับองค์กร (About us) หรือข่าวสารอื่นๆ ที่เกี่ยวกับเว็บไซต์ และยังสามารถทำ Content online marketing ผ่านบทความบนเว็บไซต์ได้อีกด้วย  2. Landing page เว็บไซต์ที่เป็นหน้าเดียว (Single page) หน้าที่ของ Landing page นั่นคือการเปลี่ยนผู้ใช้งานมาเป็นลูกค้า ดังนั้นข้อมูลที่อยู่หน้าเว็บไซต์ไม่ว่าจะเกี่ยวกับสินค้า ผลิตภัณฑ์ หรืออื่นๆ ควรจะเป็นสิ่งที่ดึงดูดให้ผู้ใช้งานสนใจและต้องการที่จะมาเป็นลูกค้าของเราให้ได้ และสิ่งที่เราต้องทำบนเว็บไซต์ประเภท Landing page นี้เองคือทำให้ข้อมูลออกมามีความน่าสนใจมากที่สุด และมีปุ่มที่เรียกว่า Call to action   3. E-commerce เป็นหนึ่งในประเภทเว็บไซต์ที่มาแรง เติบโตขึ้นอย่างมากมาย เนื่องจากคนเริ่มซื้อขายของออนไลน์กันมากขึ้นกว่าแต่ก่อน ดังนั้นใครที่ทำธุรกิจออนไลน์จึงต้องการที่จะมีเว็บไซต์ E-Commerce การออกแบบเว็บไซต์ประเภทนี้จึงเป็นที่นิยมอีกเช่นกันนั่นเอง  เมื่อรู้แล้วว่าเว็บไซต์มีกี่ประเภท ก็มาต่อกันที่ขั้นตอนการออกแบบเว็บไซต์กันเลยค่ะ 1. การกำหนดเป้าหมาย (Goal identification) เมื่อใดก็ตามที่มีการจะสร้างเว็บไซต์ขึ้น ไม่ว่ากับการบ้าน ลูกค้า หรืออะไรก็แล้วแต่ เราก็ควรจะกำหนดเป้าหมายและวัตถุประสงค์เป็นอันดับแรก  2. การกำหนดขอบเขตของเว็บไซต์ (Scope identification) เรารู้แล้วว่าเป้าหมายเราจะทำเพื่อใคร เราก็จะสามารถกำหนดขอบเขตของโปรเจคเราได้ ว่าเว็บไซต์แต่ละหน้าจะมีฟังก์ชั่น มีฟีตเจอร์อะไรบ้าง (แหมทับศัพท์) ผู้ใช้ต้องการรู้อะไรในเว็บไซต์แต่ละหน้า และก็กำหนด Timeline ให้แต่ละงานว่าจะใช้เวลาเท่าไหร่เพื่อให้งานเสร็จทัน  3. การจัดกลุ่มข้อมูลและเรียบเรียงแผนผังเว็บไซต์ (Information Architecture and Sitemap ) กำหนดสโคปงานเรียบร้อยแล้วเราก็จะได้เริ่มทำเว็บไซต์จริงๆจังๆกันซักทีเราก่อนอื่นเลยเราต้องทำการจัดการกับข้อมูลที่เราจะนำเสนอให้ผู้ใช้หรือที่เรียกว่า IA และทำแผนผังเว็บไซต์เพื่อให้ทีมได้เห็นภาพรวมของเว็บไซต์และใช้ในการพัฒนาต่อไป  4. การจัดวางองค์ประกอบภาพ (Wireframe and Visual elements) เมื่อเราได้โครงสร้างเว็บและเนื้อหาแล้วเราก็จะมาสร้างภาพลักษณ์ ภาพจำให้เว็บไซต์ของเรากัน ซึ่งมันก็จะสอดคล้องกับ Brief และ ความต้องการของลูกค้าหรือตัวเราเองอะไรก็แล้วแต่ มันก็จะล้อกับเป้าหมายที่เราตั้งอ่ะ ซึ่งการจัดวางองค์ประกอบภาพจำเป็นที่จะต้องมีความรู้ด้าน visual hierarchy บ้าง (ไม่รู้ไปเสิร์ชกูเกิ้ลเลยเด้อ) แต่โลกก็ไม่ได้โหดร้ายเสมอไปเพราะมีตัวช่วยมือดีที่ทำให้เราไม่หลุดสีหลุดตรีมนั่นก็คือ Moodboards นั่นเอง  5. การพัฒนาเว็บไซต์ (Site Development) ถึงเวลาที่ทุกคนรอคอยลอยคอนั่นก็คือเขียนโค้ดจ้า เมื่อ Design ที่ทำทั้งหมดข้างต้นเป็นการทำงานแบบเห็นภาพอยู่กับรูปภาพรูปทรงแต่ในขั้นนี้จะได้เห็นแต่โค้ดหยึ๋ยๆกันเลยทีเดียว มันคือเวลาที่จะปลดปล่อยงานออกแบบของเราทำให้ใช้งานได้จริงนั่นเอง ซึ่งภาษาที่่ใช้ก็มีหลักๆคือ HTML CSS Javascript และอีกมากมายแล้วแต่คนจะตรัสรู้  6. การทดสอบผล (Testing) ตอนนี้เราทำเว็บไซต์เสร็จแล้วเอ้าปล่อยเลยพวกเรา เย้เย้ เดี๋ยว!!! บั๊คลูกบั๊ค ใจเย็นๆ ตายละหว่าถ้าเราขาดขั้นตอนการทดสอบเว็บไซต์ของเราไปเนี่ยได้ปวดหัวอีกยาวจ้า เพราะฉะนั้นเมื่อเราทำเว็บไซต์เรียบร้อยโอเคแล้วเราก็ต้องทดสอบกันว่ามันสามารถใช้งานได้จริงหรือไม่นั่นเอง วิธีการทดสอบก็มีมากมาย ไปอ่านต่อด้านล่าง  7. การเผยแพร่เว็บไซต์ (Launch) เย้ยยยยยยยยในที่สุดเว็บเราก็ได้ปล่อยซักที ทุกอย่างสวยเป๊ะหรูดูแพง ให้ประชาชนเห็นกันแล้ว ซึ่งการเปิดตัวเนี่ยก็ไม่ใช่อยู่ดีๆจะอัพขึ้นโฮสต์จดโดเมนโอเคจบลอยแพเว็บไซต์ ไม่นาจา ทุกอย่างที่ทำมีต้นทุนเพราะฉะนั้นทำแล้วต้องเกิดกำไร แต่จะทำอย่างไรก็รอไปอ่านกันอีก  8. การปรับปรุงและพัฒนา (Site Maintenance and Development) หลังจากที่เว็บไซต์อันสวยงามของเราถูกปล่อยสู่สาธารณะประชาชีแล้วคนมาใช้เยอะใช้จนช้ำ เซิร์ฟพัง หนำซ้ำเทรนด์ดีไซน์เปลี่ยนอีก เวรล้ะจ้า เราก็ต้องดูแลปรับปรุงส่วนต่างๆของเว็บไซต์ให้เป็นปัจจุบันทันด่วนใช้งานได้ดิบได้ดีเหมือนทำใหม่อยู่เสมอนั่นเอง  นอกจากนี้ยังมีในส่วนของ - Grid  Grid คือส่วนที่ควบคุม Layout ให้กับงานออกแบบ เพราะ Grid System ในเว็บไซต์นั้นมีผลต่อการทำ Responsive ซึ่งเป็นส่วนสำคัญมากที่สุดในขณะนี้ นั่นก็เพราะว่าผู้ใช้งานส่วนใหญ่จะเข้าเว็บไซต์โดยผ่านอุปกรณ์สมาร์ทโฟนต่างๆ จากความสะดวกสบายของการใช้งาน  - ภาพ เพราะ 80% ของพื้นที่หน้าเว็บไซต์นั้นเป็นรูปภาพ และอีก 20% จะเป็น UI สำหรับการใช้งานรูปภาพนั้น รูปภาพที่ดีจะต้องมีความสวยงาม และสามารถสื่อสารข้อความได้ด้วย  - ฟ้อนต์ เมื่อคุณออกแบบเว็บไซต์ที่มีองค์ประกอบครบแล้วอย่างภาพสวย UI งาม แต่ใช้ฟ้อนต์ Tahoma จากเว็บไซต์อันสวยงามอาจจะกลายเป็นเว็บที่ดูแย่ได้ โดยเทคนิคในการจัดการกับฟ้อนต์ในงานออกแบบเว็บไซต์คือต้องกำหนดรูปแบบของฟ้อนต์เอาไว้เช่น H1 – หัวข้อเรื่องใช้ฟ้อนต์ขนาด 48px H2 – ใช้ขนาด 32px Body – ใช้ฟ้อนต์ขนาด 18px ในงานเว็บไซต์ฟ้อนต์ทุกหน้าจะต้องมีขนาดที่เท่ากันเพื่อให้ง่ายต่อการเขียน Code และดูเป็นระเบียบเรียบร้อยมากยิ่งขึ้น สำหรับฟ้อนต์ที่มีคุณภาพเราแนะนำให้ลองดู GOOGLE FONTS เพราะว่าคุณภาพดีมีให้เลือกใช้งานหลายรูปแบบหลายภาษาที่สำคัญคือใช้งานฟรี แต่ถ้าใครต้องการฟ้อนต์ที่มีเอกลักษณ์เฉพาะตัวขึ้นมาอีกลองดูที่ สุดยอดแหล่งแจก ฟ้อนต์ฟรี เราคัดแล้วคัดอีกเพื่อนักออกแบบ !! แต่อันนี้ต้องดูในเรื่องของลิขสิทธิ์ให้ดี ฟ้อนต์แต่ละตัวจะมีข้อกำหนดที่แตกต่างกัน  - สี สีที่อยู่บนเว็บไซต์นั้นจะมีการใช้สีอยู่เพียงไม่กี่สี สำหรับเทคนิคในการเลือกสีในการออกแบบเว็บไซต์ มีดังต่อไปนี้ สีหลัก = สีโลโก้ สีรอง = พื้นหลังของโลโก้หรือสีที่ขับให้โลโก้เด่นขึ้นมา สีสำหรับปุ่มกด(Call to action) = สีคู่ตรงข้ามกับสีหลักและพื้นหลังเน้นความโดดเด่น สีพื้นหลัง (BG) = เน้นไปที่สีโทนขาวหรือดำ เพราะสีสามารถมีอิทธิพลต่อผู้ใช้งานได้ การเลือกใช้สีให้เข้ากับรูปแบบเว็บไซต์จึงเป็นอีกหนึ่งตัวช่ยให้ผู้ใช้งานติดใจในเว็บไซต์ของเรานั่นเอง  - ไอคอน ในงานออกแบบเว็บไซต์เราจะต้องใช้งานไอคอนบ่อยมาก ด้วยความที่ไอคอนคือกราฟิกที่ใช้แทนคำพูดได้หรือใช้ประกอบกับข้อความ เพิ่มความน่าสนใจให้กับเว็บไซต์ บนโลกนี้มีไอคอนเป็นจำนวนมากให้เลือกใช้งานให้ลองดูจากเว็บ flaticon.com และ iconfinder.com ก็มีให้เลือกใช้งานมากมาย ถ้าใครอยากรู้วิธีนำไอคอนมาใช้งานแบบลงมือทำลองมาเรียนกับเราได้เลย  - สไตล์การออกแบบ สุดท้ายของการออกแบบเว็บไซต์คือสไตล์ในการออกแบบที่ควรจะยึดเกาะเทรนด์ในขณะนั้นให้ดี หลายครั้งที่เทรนด์เกิดจากผู้ให้บริการรายใหญ่เช่น Apple ที่เคยทำเว็บไซต์ Iphone ที่ดูเรียบง่ายไร้เงา หรือ Google ที่มี material design ของตัวเอง ถ้าใครไม่รู้จะเริ่มจากตรงไหนเราแนะนำให้ศึกษา Flat design ดูสักนิดเพราะเป็นเทรนด์ที่มีมาระยะหนึ่งเน้นการออกแบบที่ดูเรียบง่ายทำให้ง่ายต่อนักออกแบบด้วย  ----------------------------------------------------------------------------------- สนใจบริการดูแลการตลาดออนไลน์ | ทำการตลาดออนไลน์ | ทำกราฟฟิคครบวงจร | สามารถติดต่อเราได้ตลอด  | รับสร้างแบรนด์  | รับทำการตลาดออนไลน์  | รับทำแผนการตลาดออนไลน์  | รับสร้างแบรนด์  | รับดูแล Facebook แฟนเพจ  | รับดูแล LINE OA    สามารถติดต่อเราได้ตลอด 24 ชั่วโมง   รายละเอียดบริการดูแลการตลาดออนไลน์ >> https://www.chatstickmarket.com/langran  ตัวอย่าง ผลงานแบรนด์ต่างๆ ที่เราดูแลการตลาดออนไลน์ให้ >> https://www.chatstickmarket.com/portfolio  ------------------------------------------------------------------------------------  💙ปรึกษาทีมงานของเรา💙 📱Tel : 0840104252 📱0947805680 📨 Inbox : http://m.me/ChatStick.TH  ┏━━━━━━━━━┓ 📲 LINE: @chatstick ┗━━━━━━━━━┛ หรือคลิ๊ก https://goo.gl/KuzCpM  🎉รายละเอียดที่ http://www.chatstickmarket.com/langran  🎉ชมผลงานเราได้ที่ https://www.chatstickmarket.com/portfolio

ออกแบบเว็บไซต์ต้องทำอะไรบ้าง ฉบับมือใหม่✨


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


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


เว็บไซต์มีกี่ประเภท ?

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

1. Corporate

เว็บไซต์ Corporate คือเว็บไซต์ขององค์กรที่ต้องมีข้อมูลสำคัญไว้ใช้ติดต่อ (Contact) หรือข้อมูลต่างๆ เกี่ยวกับองค์กร (About us) หรือข่าวสารอื่นๆ ที่เกี่ยวกับเว็บไซต์ และยังสามารถทำ Content online marketing ผ่านบทความบนเว็บไซต์ได้อีกด้วย


2. Landing page

เว็บไซต์ที่เป็นหน้าเดียว (Single page) หน้าที่ของ Landing page นั่นคือการเปลี่ยนผู้ใช้งานมาเป็นลูกค้า ดังนั้นข้อมูลที่อยู่หน้าเว็บไซต์ไม่ว่าจะเกี่ยวกับสินค้า ผลิตภัณฑ์ หรืออื่นๆ ควรจะเป็นสิ่งที่ดึงดูดให้ผู้ใช้งานสนใจและต้องการที่จะมาเป็นลูกค้าของเราให้ได้ และสิ่งที่เราต้องทำบนเว็บไซต์ประเภท Landing page นี้เองคือทำให้ข้อมูลออกมามีความน่าสนใจมากที่สุด และมีปุ่มที่เรียกว่า Call to action


3. E-commerce

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


เมื่อรู้แล้วว่าเว็บไซต์มีกี่ประเภท ก็มาต่อกันที่ขั้นตอนการออกแบบเว็บไซต์กันเลยค่ะ

1. การกำหนดเป้าหมาย (Goal identification)

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


2. การกำหนดขอบเขตของเว็บไซต์ (Scope identification)

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


3. การจัดกลุ่มข้อมูลและเรียบเรียงแผนผังเว็บไซต์ (Information Architecture and Sitemap )

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


4. การจัดวางองค์ประกอบภาพ (Wireframe and Visual elements)

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


5. การพัฒนาเว็บไซต์ (Site Development)

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


6. การทดสอบผล (Testing)

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


7. การเผยแพร่เว็บไซต์ (Launch)

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


8. การปรับปรุงและพัฒนา (Site Maintenance and Development)

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


นอกจากนี้ยังมีในส่วนของ

- Grid

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


- ภาพ

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


- ฟ้อนต์

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

H1 – หัวข้อเรื่องใช้ฟ้อนต์ขนาด 48px

H2 – ใช้ขนาด 32px

Body – ใช้ฟ้อนต์ขนาด 18px

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


- สี

สีที่อยู่บนเว็บไซต์นั้นจะมีการใช้สีอยู่เพียงไม่กี่สี

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

สีหลัก = สีโลโก้

สีรอง = พื้นหลังของโลโก้หรือสีที่ขับให้โลโก้เด่นขึ้นมา

สีสำหรับปุ่มกด(Call to action) = สีคู่ตรงข้ามกับสีหลักและพื้นหลังเน้นความโดดเด่น

สีพื้นหลัง (BG) = เน้นไปที่สีโทนขาวหรือดำ

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


- ไอคอน

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


- สไตล์การออกแบบ

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


-----------------------------------------------------------------------------------

สนใจบริการดูแลการตลาดออนไลน์ | ทำการตลาดออนไลน์ | ทำกราฟฟิคครบวงจร | สามารถติดต่อเราได้ตลอด | รับสร้างแบรนด์ | รับทำการตลาดออนไลน์ | รับทำแผนการตลาดออนไลน์ | รับสร้างแบรนด์ | รับดูแล Facebook แฟนเพจ | รับดูแล LINE OA สามารถติดต่อเราได้ตลอด 24 ชั่วโมง

รายละเอียดบริการดูแลการตลาดออนไลน์

ตัวอย่าง ผลงานแบรนด์ต่างๆ ที่เราดูแลการตลาดออนไลน์ให้

------------------------------------------------------------------------------------


💙ปรึกษาทีมงานของเรา💙

📱Tel : 0840104252 📱0947805680

┏━━━━━━━━━┓

📲 LINE: @chatstick

┗━━━━━━━━━┛

หรือคลิ๊ก https://goo.gl/KuzCpM

🎉รายละเอียดที่ http://www.chatstickmarket.com/langran

🎉ชมผลงานเราได้ที่ https://www.chatstickmarket.com/portfolio

ดู 14 ครั้ง

Comments


CS_Redesign_คอนเทนต์เดิม2_2.png
CS_Redesign_คอนเทนต์เดิม3.png
Recent Posts
c24f0332fa3b87f8a304140403b893510_64100212_210625.jpg
244712625_300456528129611_2152723951836713111_n.jpg
5.png
4.png
Button Event สติกเกอร์.png
2.png
Button ChatStick Market.png
bottom of page