ความสำเร็จของเว็บไซต์ของคุณขึ้นอยู่กับลักษณะที่ปรากฏอย่างมาก การมีชุดสีและธีมที่เหมาะสมจะทำให้ผู้เยี่ยมชมเว็บไซต์ของคุณนานขึ้นเล็กน้อย นอกจากจานสีและโครงสร้างของเว็บไซต์แล้ว แบบอักษรที่คุณเลือกยังมีบทบาทสำคัญในการรักษาผู้ชมให้มีส่วนร่วม
บางทีคุณอาจเจอไซต์ที่น่าสนใจขณะท่องเว็บ และต้องการทราบว่าใช้แบบอักษรใด ด้วยส่วนขยายออนไลน์และเครื่องมือตรวจสอบองค์ประกอบในตัวของเบราว์เซอร์ การระบุแบบอักษรทำได้ง่ายและรวดเร็ว
วิธีค้นหาแบบอักษรโดยใช้เครื่องมือตรวจสอบองค์ประกอบ
ในกรณีที่คุณไม่ทราบ เครื่องมือตรวจสอบองค์ประกอบในตัวของเบราว์เซอร์ช่วยให้คุณตรวจสอบซอร์สโค้ดของเว็บไซต์ได้ คุณสามารถเข้าใจองค์ประกอบการออกแบบของไซต์ได้โดยดูที่ CSS, HTML และข้อมูลอื่นๆ เป็นวิธีที่ดีในการสร้างแรงบันดาลใจในการออกแบบไซต์ของคุณเอง
ขั้นตอนการระบุแบบอักษรโดยใช้เครื่องมือตรวจสอบองค์ประกอบนั้นค่อนข้างง่าย และคุณไม่จำเป็นต้องมีทักษะการเขียนโค้ดใดๆ เครื่องมือนี้ใช้ได้กับทุกเบราว์เซอร์ในตลาด และแต่ละอันมีเลย์เอาต์ที่คล้ายกัน
ต่อไปนี้เป็นวิธีระบุแบบอักษรโดยใช้เครื่องมือตรวจสอบของเบราว์เซอร์
- เปิดเว็บไซต์ที่คุณต้องการใช้
- เน้นข้อความที่มีแบบอักษรที่คุณต้องการระบุ แล้วคลิกขวา
- คลิกที่ ตรวจสอบ จากเมนูบริบท
- เมื่อเมนูตรวจสอบเปิดขึ้น ให้คลิกที่ คำนวณแล้ว .
- เลื่อนลงเพื่อค้นหา Font-Family ส่วน. คุณสามารถค้นหาชื่อแบบอักษรและรูปแบบ รวมทั้งขนาดได้ที่นี่
วิธีอื่นๆ ในการใช้เครื่องมือตรวจสอบ
หากคุณต้องการวิธีที่รวดเร็วกว่าในการค้นหาแบบอักษรของเว็บไซต์โดยใช้เครื่องมือตรวจสอบ ให้ลองใช้วิธีนี้แทน:
- เปิดเว็บไซต์ที่คุณต้องการใช้
- กด Ctrl + Shift + C (คำสั่ง + Shift + C บน Mac)
- วางเมาส์เหนือข้อความเพื่อแสดงรูปแบบแบบอักษร ขนาด รหัสสี และระยะขอบ
คุณยังสามารถตรวจสอบรายการแบบอักษรที่ใช้บนเว็บเพจได้โดยใช้เครื่องมือตรวจสอบ วิธีการมีดังนี้:
- ไปที่หน้าเว็บ
- เปิดซอร์สโค้ดโดยกด Ctrl + Shift + I (คำสั่ง + Shift + ฉัน บน Mac)
- คลิก เครือข่าย แท็บ จากนั้นเลือก แบบอักษร แท็บ
- ที่นี่ คุณจะเห็นรายการแบบอักษรทั้งหมดที่ใช้บนหน้าเว็บ
หากต้องการดูรายการแบบอักษรทั้งหมดแบบเรียลไทม์ คุณอาจต้องรีเฟรชหน้าเว็บ
วิธีระบุแบบอักษรโดยใช้ส่วนขยายเบราว์เซอร์
หากคุณต้องการวิธีที่สะดวกกว่าในการระบุแบบอักษร คุณอาจต้องติดตั้งส่วนขยายเบราว์เซอร์ค้นหาแบบอักษร แม้ว่าจะมีส่วนขยายเบราว์เซอร์หลายตัวที่ช่วยตรวจจับแบบอักษรบนเว็บ แต่ส่วนขยายที่ได้รับความนิยมสูงสุด 2 รายการคือ WhatFont และ Font Finder .
มาดูกระบวนการระบุแบบอักษรโดยใช้ส่วนขยายทั้งสองกัน
1. WhatFont
WhatFont เป็นที่นิยมกันอย่างแพร่หลายสำหรับการตรวจจับแบบอักษรหลายตัวอย่างรวดเร็วในคราวเดียว วิธีใช้เครื่องมือนี้
- เมื่อเปิดใช้งาน WhatFont ในเบราว์เซอร์ของคุณ ให้วางเมาส์เหนือข้อความเพื่อแสดงแบบอักษร
- เมื่อคุณคลิกที่ข้อความ หน้าต่างป๊อปอัปจะปรากฏขึ้นพร้อมกับรายละเอียดแบบอักษรที่เหลือ เช่น ขนาดแบบอักษร สี และรูปแบบ
- นอกจากนี้ คุณสามารถเลือกข้อความหลายส่วนพร้อมกันเพื่อเปรียบเทียบแบบอักษรต่างๆ ในหน้าเดียวกันได้
2. ตัวค้นหาแบบอักษร
Font Finder ยังแสดงรายละเอียดแบบอักษรเมื่อคุณวางเมาส์เหนือข้อความบนเว็บไซต์ อย่างไรก็ตาม มีรายละเอียดทางเทคนิคมากมาย ดังนั้นอาจสร้างความสับสนเล็กน้อยหากคุณไม่คุ้นเคยกับการออกแบบเว็บ
ที่กล่าวว่า Font Finder เหมาะสำหรับนักพัฒนาเว็บที่ต้องการแทนที่ฟอนต์ที่มีอยู่ด้วยฟอนต์ใหม่ในแบบเรียลไทม์ ทำให้ง่ายต่อการทดสอบแบบอักษรก่อนทำการเปลี่ยนแปลงถาวร
วิธีทดสอบแบบอักษรโดยใช้ Font Finder มีดังนี้:
- เน้นส่วนของข้อความจากหน้าเว็บ
- คลิกขวาที่ไอคอนแล้วเลือก Font Finder จากเมนูบริบท
- เลือก แทนที่แบบอักษรด้วย และป้อนชื่อแบบอักษร มาเพิ่ม Calibri และดูว่ามันเปลี่ยนฟอนต์อย่างไรในการแสดงตัวอย่าง
- หากคุณต้องการรีเซ็ตฟอนต์ ให้รีเฟรชหน้า
แล้วการตรวจสอบแบบอักษรในรูปภาพล่ะ
หากคุณต้องการระบุแบบอักษรในรูปภาพ ส่วนขยายของเบราว์เซอร์และเครื่องมือตรวจสอบของเบราว์เซอร์อาจไม่ช่วยอะไร อย่างไรก็ตาม คุณสามารถลองใช้เครื่องมือตรวจสอบรูปภาพออนไลน์ เช่น WhatFontIs, FontSquirrel, Fontspring, WhatTheFont และอื่นๆ อีกมากมาย
กระบวนการในการระบุแบบอักษรจากรูปภาพส่วนใหญ่จะเหมือนกันในทุกเครื่องมือ มาลองระบุแบบอักษรในรูปภาพโดยใช้ WhatTheFont
- หากยังไม่ได้ดาวน์โหลด ให้ดาวน์โหลดรูปภาพที่ต้องการใช้
- นำเข้ารูปภาพไปยัง WhatTheFont
- WhatTheFont จะตรวจจับข้อความในภาพของคุณโดยอัตโนมัติ ย่อหรือขยายกล่องครอบตัดให้ล้อมรอบแบบอักษรที่คุณต้องการระบุ กด ปุ่มลูกศร เมื่อเสร็จแล้ว.
- จากนั้น WhatTheFont จะจับคู่แบบอักษรในรูปภาพกับแบบอักษรในแกลเลอรี และจะแสดงแบบอักษรที่เกี่ยวข้องกันอย่างใกล้ชิด
- หากไม่พบที่ตรงกันในทันที คุณสามารถคลิก แสดงผลลัพธ์เพิ่มเติม เพื่อดูแบบอักษรที่เกี่ยวข้องเพิ่มเติม
ตรวจหาแบบอักษรจากเว็บและนำไปใช้ในการออกแบบของคุณ
แบบอักษรมีบทบาทสำคัญในความสำเร็จของเว็บไซต์หรือการออกแบบกราฟิก หากคุณสะดุดกับแบบอักษรที่น่าสนใจขณะท่องเว็บ คุณสามารถตรวจพบแบบอักษรได้อย่างง่ายดายโดยใช้วิธีการด้านบน