แบบอักษรเว็บไซต์ที่ดีที่สุดและวิธีเลือกแบบอักษรที่ถูกต้อง

เผยแพร่แล้ว: 2022-02-11

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

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

สารบัญ แสดง
  • เปิด Sans
  • ลาโต้
  • Helvetica
  • Merriweather
  • การแสดงเพลย์แฟร์
  • มอนต์เซอร์รัต
  • ลิเบรอ บาสเกอร์วิลล์
  • Caudex
  • บาร์โลว์
  • Roboto
  • วิธีการเลือกแบบอักษรที่เหมาะสม?
    • เลือกแบบอักษรตามเนื้อหาของเว็บไซต์
    • แบบอักษรสามประเภท
    • รู้พื้นฐาน
    • อย่าลืมเกี่ยวกับเวลาโหลด

เปิด Sans

โอเพ่น-ซาน-ฟอนต์

Open Sans เป็นส่วนหนึ่งของแบบอักษร sans serif ที่ให้ความสามารถในการอ่านและประสบการณ์ผู้ใช้สูงสุด แบบอักษรเว็บนี้เป็นตัวเลือกที่ดีที่สุดสำหรับเว็บไซต์มินิมอลที่มีข้อมูลให้บริโภคมากมาย (บล็อก บทความที่ให้ความรู้ ฯลฯ) ข้อดีอีกอย่างของฟอนต์นี้คือเข้ากันได้กับสไตล์ที่แตกต่างกันมากมาย

แนะนำสำหรับคุณ: แบบอักษรที่ดีที่สุดที่จะใช้ในอินโฟกราฟิก

ลาโต้

Lato-ฟอนต์

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

Helvetica

Helvetica-แบบอักษร

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

Merriweather

Merriweather-แบบอักษร

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

การแสดงเพลย์แฟร์

Playfair-Display-font

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

มอนต์เซอร์รัต

มอนต์เซอร์รัต-ฟอนต์

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

ลิเบรอ บาสเกอร์วิลล์

Libre-Baskerville-font

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

Caudex

Caudex-ฟอนต์

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

บาร์โลว์

บาร์โลว์ฟอนต์

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

Roboto

Roboto-ฟอนต์

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

คุณอาจชอบ: แบบอักษรออกแบบโลโก้ที่สวยงาม 20 แบบที่นักออกแบบที่ยอดเยี่ยมทุกคนต้องการ

วิธีการเลือกแบบอักษรที่เหมาะสม?

typography-fonts-characters-letters-design

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

เลือกแบบอักษรตามเนื้อหาของเว็บไซต์

best-website-fonts-choose-right-one-point-1

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

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

แบบอักษรสามประเภท

best-website-fonts-choose-right-one-point-2

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

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

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

วิชาการพิมพ์

รู้พื้นฐาน

best-website-fonts-choose-right-one-point-3

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

แบบอักษร Serif:

จะใช้เป็นประจำเมื่อข้อมูลที่คุณกำลังพิมพ์จะถูกพิมพ์ออกมาในที่สุด แบบอักษร serif แบบคลาสสิกและมีสไตล์มักไม่นิยมใช้เป็นแบบอักษรของเว็บเนื่องจากมีความสง่างาม อย่างไรก็ตาม หากคุณเลือกที่จะเขียนเกี่ยวกับการเงิน กฎหมาย หรือแฟชั่น นี่คือสิ่งที่คุณเลือก Times New Roman, Georgia และ Bodoni เป็นฟอนต์เซอริฟ

ฟอนต์ Sans serif:

ฟอนต์เหล่านี้ไม่มีบรรทัด serif ที่ส่วนท้ายของตัวอักษรเหมือนกับฟอนต์ serif นักออกแบบเว็บไซต์สมัยใหม่และตรงไปตรงมามักใช้แบบอักษรเหล่านี้เนื่องจากมีลักษณะเป็นกลาง แบบอักษรเหล่านี้สามารถใช้ได้โดยไม่คำนึงถึงหัวข้อที่คุณกำลังเขียน พวกเขามักจะเหมาะสมอย่างยิ่งสำหรับมวลของปัญหา Helvetica, Robotica และ Open Sans คือตัวอย่างแบบอักษร Sans serif ที่มีชื่อเสียง

แบบอักษรสคริปต์:

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

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

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

คุณอาจชอบ: 5 Web Safe Fonts ที่คุณสามารถใช้ได้ในเว็บไซต์ของคุณ

อย่าลืมเกี่ยวกับเวลาโหลด

best-website-fonts-choose-right-one-point-4

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

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