วิธีการใช้รูปภาพในการออกแบบเว็บไซต์?

เผยแพร่แล้ว: 2021-07-03

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


ภาพการออกแบบเว็บไซต์: 18 เคล็ดลับ

1. เลือกภาพที่มีความละเอียดดี

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

ภาพแสดงความละเอียด 1200x800 แสดงวิธีใช้ภาพในการออกแบบเว็บ

2. จำกัดรูปภาพขนาดใหญ่ไว้เหนือครึ่งหน้า

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

เว็บไซต์ที่มีภาพขนาดใหญ่อยู่ครึ่งหน้าบน

3. ใช้รูปภาพปลอดลิขสิทธิ์

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

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


4. ลดขนาดไฟล์

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

กำลังแปลงไฟล์รูปภาพให้เล็กลง

5. พิจารณาจ้างช่างภาพหรือนักวาดภาพประกอบ

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

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

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

คนถือกล้อง

6. ใช้รูปภาพประเภทต่างๆ

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

โทรศัพท์ที่มีกราฟวงกลมต่างๆ อยู่

7. ใช้ประโยชน์จากคอนทราสต์

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

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

คนที่สวมเสื้อสเวตเตอร์สีแดงบนหิมะแสดงความคมชัด

8. สร้างสรรค์!

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

คนที่มีกล้องรอบตัวแล้วแยกหน้าจอกาแฟเป็นวงกลมบนโต๊ะ

9. ระวังอย่าหักโหมจนเกินไปเมื่อแก้ไขรูปภาพของคุณ

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

ภาพที่ตัดต่อแล้ว

10. เพิ่มข้อความ

หากคุณต้องการให้คนอื่นโต้ตอบกับรูปภาพของคุณด้วยวิธีง่ายๆ ให้เพิ่มข้อความ! ให้คำแนะนำว่าพวกเขาควรทำอย่างไรต่อไป ตัวอย่างเช่น “คลิกที่นี่เพื่อดูรายละเอียดเพิ่มเติม”

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

เซ็นชื่อด้วย Do Something Creative Everyday เขียนไว้บนนั้น

11. ภาพถ่ายทั้งหมดไม่ได้ถูกสร้างขึ้นอย่างเท่าเทียมกัน

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

คนในชุดตาหมากรุกผมสีแดงยืนอยู่ในสระ

12. อย่าลืมเรื่องสี!

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

มาโครสีชมพูข้างกล้วยสีเหลืองกับก. พื้นหลังสีแดง

13. ใช้ภาพที่มีความหมาย

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

เด็กน้อยนอนบนพรมนุ่มๆ

14. อย่าใช้ภาพถ่ายสต็อกเพื่อทุกสิ่ง

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

ภาพบุคคลของพนักงาน WebCit

15. ใช้รูปภาพเพื่อเล่าเรื่อง

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

นักเขียนแบบพิมพ์ดีดเรื่องราว

16. ใช้รูปภาพเพื่อแบ่งกลุ่มข้อความ

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

โดยพื้นฐานแล้ว รูปภาพช่วยให้ผู้อ่านได้เห็นภาพที่จำเป็นมากจากเนื้อหา ซึ่งทำให้มีเวลาแยกแยะสิ่งที่พวกเขาเพิ่งอ่าน

บุคคลภายนอกบนม้านั่งโดยใช้ iPad

17. ใช้รูปภาพเพื่อเน้น

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

เลมอนที่มีสีน้ำเงินด้านนอกและด้านในสีเหลืองบนพื้นหลังสีน้ำเงิน

18. ใช้รูปภาพเพื่อให้ความรู้

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

กระดาษกรอบที่มีรายการอยู่

บทสรุป

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

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