คำแนะนำเกี่ยวกับ Google Font API
เผยแพร่แล้ว: 2021-08-03นักออกแบบเว็บไซต์ต่างชื่นชมยินดีเมื่อเว็บไซต์มีความสวยงามมากขึ้นเนื่องจากความก้าวหน้าล่าสุดของเทคโนโลยีฟอนต์
ทั้งหมดนี้ต้องขอบคุณสิ่งที่เรียกว่าแบบอักษรของเว็บ ซึ่งเป็นชุดเครื่องมือที่สามารถใช้เพื่อฝังแบบอักษรบนหน้าเว็บ เป็นเครื่องมือสำคัญสำหรับนักพัฒนา เนื่องจากช่วยให้พวกเขาสร้างเว็บไซต์ที่มีเอกลักษณ์และน่าสนใจได้ เราไม่บังคับให้ใช้ Ariel หรือ Times New Roman กับทุกโครงการเว็บอีกต่อไป!
คำแนะนำต่อไปนี้จะให้ข้อมูลโดยละเอียดเกี่ยวกับวิธีใช้ Google Font API เพื่อใช้แบบอักษรของเว็บ แหล่งข้อมูลนี้ฟรีและง่ายสำหรับทุกคนที่มีการเข้าถึงอินเทอร์เน็ต ดังนั้นจึงคุ้มค่าที่จะใช้ประโยชน์จากเครื่องมือที่ยอดเยี่ยมนี้!
คำแนะนำเกี่ยวกับ Google Font API
Google Font API คือชุดเครื่องมือที่ใช้ในการฝังแบบอักษรบนเว็บเพจ เป็นเครื่องมือที่สำคัญสำหรับนักพัฒนา เนื่องจากช่วยให้พวกเขาสร้างเว็บไซต์ที่มีเอกลักษณ์และน่าสนใจได้ Google Fonts เป็นวิธีที่รวดเร็วและง่ายดายในการเพิ่มแบบอักษรลงในไซต์ของคุณโดยไม่ต้องเขียนโปรแกรมที่ซับซ้อนใดๆ เพียงป้อนข้อความและเลือกแบบอักษรที่คุณต้องการใช้ – voila! เว็บไซต์ของคุณได้รับการอัปเดตด้วยตัวอักษรที่สวยงามทันที
ข้อดีของการใช้ Google Font API
หากคุณต้องการใช้ Font API ของ Google ก็มีคุณสมบัติที่มีประโยชน์มากมาย
ใช้ข้อความ HTML ต่อไป
การพิมพ์เว็บเป็นความพยายามที่จริงจัง และเป็นเรื่องยากมากขึ้นที่จะบรรลุความสมดุลที่สมบูรณ์แบบของความสวยงามและการเพิ่มประสิทธิภาพกลไกค้นหา โชคดีที่ @font-face ช่วยได้! นักวิจัยของ Google ต่างจากการใช้รูปภาพหรือการเปลี่ยนภาพพื้นหลัง CSS เป็นวิธีแก้ปัญหาสำหรับการพิมพ์เว็บที่สวยงามยิ่งขึ้น วิธีนี้ได้รับการพิสูจน์โดยนักวิจัยของ Google ว่าเป็นมิตรกับ SEO
เว็บที่เข้าถึงได้
โปรแกรมอ่านหน้าจอไม่เหมือนกับรูปภาพ CSS เนื่องจากโปรแกรมอ่านหน้าจอสามารถอ่านข้อความ HTML ได้ จึงไม่ส่งผลต่อผู้ที่ใช้
รวดเร็วและง่ายดาย
สิ่งที่คุณต้องทำคืออ้างอิงแบบอักษรสำหรับเนื้อหาของคุณ แล้วเพิ่มการตั้งค่า CSS บางอย่างเพื่อให้ปรากฏบนหน้าจอ เมื่อตั้งค่าแล้ว รหัสเหล่านี้ก็เปลี่ยนได้ง่ายเช่นกัน! Google Font API จัดการกับลักษณะเฉพาะของเว็บเบราว์เซอร์ จัดการไฟล์หลายประเภท และทำให้เข้าใจ @font-face ได้ง่าย
ใช้งานฟรี
แบบอักษร Google ใช้งานได้ฟรีและได้รับการสำรองข้อมูลโดย Google ซึ่งหมายความว่าคุณสามารถออกแบบเว็บไซต์ของคุณได้อย่างมั่นใจโดยไม่ต้องเสี่ยงกับปัญหาในการใช้แบบอักษรที่คุณไม่ควรทำ
นี่เป็นสิ่งที่ดีเพราะจะทำให้ต้นทุนรวมของเว็บไซต์ของคุณลดลง หากคุณสงสัยว่าเว็บไซต์ทั่วไปมีค่าใช้จ่ายเท่าไร ลองอ่านบทความในบล็อกของเราว่าเว็บไซต์ของฉันมีค่าใช้จ่ายเท่าไร เพื่อดูว่าคุณต้องใช้งบประมาณประเภทใดเพื่อสร้างเว็บไซต์ที่สมบูรณ์แบบของคุณ!
รวดเร็วและเชื่อถือได้
เมื่อเบราว์เซอร์ของคุณโหลดหน้าเว็บ เบราว์เซอร์จะตรวจสอบแคชของผู้ใช้เพื่อดูว่ามีแบบอักษรที่ใช้ในไซต์อื่นหรือไม่ หากเป็นเช่นนั้น จะเป็นการเร่งความเร็วในการโหลดสำหรับหน้าต่างๆ เนื่องจากฟอนต์จะพร้อมใช้งานในแคชของเว็บแล้ว และไม่จำเป็นต้องโหลดจากเซิร์ฟเวอร์อีก
ทางเลือกที่ยิ่งใหญ่
ด้วยฟอนต์กว่า 850 แบบที่ปลายนิ้วของคุณ คุณจะสามารถค้นหาฟอนต์ที่สมบูรณ์แบบสำหรับโปรเจ็กต์ล่าสุดของคุณ คุณสามารถใช้ Google Font Directory เพื่อให้การค้นหารวดเร็วและไม่ยุ่งยาก
การใช้ Google Fonts API อาจเป็นตัวบ่งชี้ที่ยิ่งใหญ่ของเว็บไซต์ที่สร้างขึ้นอย่างพิถีพิถัน! นอกจากนั้น เรามีรายการคุณลักษณะอื่นๆ อีก 10 ประการของการออกแบบเว็บระดับไฮเอนด์ที่คุณอาจต้องการเลียนแบบบนเว็บไซต์ของคุณ
จะใช้ Google Font API ได้อย่างไร?
ในการใช้แบบอักษร Google ในเอกสาร HTML ของคุณ ก่อนอื่นคุณต้องอ้างอิงสไตล์ชีต CSS โดยเพิ่มลงในแท็ก <head> ตรวจสอบให้แน่ใจว่าข้อมูลอ้างอิงนี้รวมอยู่ในทุกหน้าที่คุณต้องการให้แบบอักษรปรากฏ ด้วย WordPress คุณสามารถทำได้โดยเพิ่มการอ้างอิงไปยังเทมเพลตของธีม
<title>Home Page</title> <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=FontName"> </head>ถึงเวลาที่จะใช้ CSS เพื่อระบุวิธีที่คุณต้องการใช้แบบอักษรใหม่ของคุณ คุณจะใช้รหัสต่อไปนี้หากคุณต้องการให้ H1 ทั้งหมดของคุณมีแบบอักษร Google:
h1 { font-family: 'FontName', serif; font-size: 12px; }คุณสังเกตเห็นว่าฉันรวมฟอนต์ serif ด้วยหรือไม่ ฉันได้ทำไปแล้วเพราะแนะนำให้มีแบบอักษรสำรอง โดยทั่วไป หมายความว่าเบราว์เซอร์จะใช้ฟอนต์ serif โดยอัตโนมัติ หากมีปัญหากับฟอนต์ Google
เครื่องมือแบบอักษรของ Google
แพลตฟอร์มแบบอักษรของ Google ได้สร้างเครื่องมือมากมายที่จะช่วยให้คุณใช้งานได้ง่ายขึ้น คุณสามารถใช้ Font Directory, Previewer และ Web Font Loader ซึ่งควบคุมโดย Google API ทั้งหมด ด้านล่างนี้เราจะให้ภาพรวมของแต่ละเครื่องมือโดยละเอียด เพื่อให้ทุกคนที่มีความหลงใหลในฟอนต์สามารถเริ่มต้นได้!
ไดเรกทอรีแบบอักษรของ Google
ด้วยฟอนต์มากมายให้เลือก จึงเป็นเรื่องยากที่จะหาฟอนต์ที่สมบูรณ์แบบสำหรับโปรเจกต์ของคุณ โชคดีที่ Google ได้รวบรวมรายชื่อแบบอักษรทั้งหมดไว้ในไดเร็กทอรีที่เข้าถึงได้ง่าย ซึ่งคุณสามารถเริ่มต้นการเลือกแบบอักษรที่เหมาะกับคุณ! เมื่อคุณคลิกที่แท็บ "รับโค้ด" ระบบจะแสดงรายการรหัสที่สามารถคัดลอกและวางเพื่อให้แบบอักษรนี้ทำงานได้
โปรแกรมดูตัวอย่างแบบอักษรของ Google
ด้วย Google Font Previewer คุณสามารถดูลักษณะแบบอักษรแต่ละแบบและปรับแต่งตามที่คุณต้องการได้ คุณมีตัวเลือกมากมายทั้งขนาด สไตล์ (ตัวแปร) และระยะห่าง!
ตัวโหลดแบบอักษรเว็บ
นักพัฒนาเว็บสามารถควบคุมฟอนต์ Google ของตนเองได้มากขึ้นโดยใช้ไลบรารี JavaScript นักพัฒนาสามารถผูกฟังเหตุการณ์สำหรับขั้นตอนใดๆ ในลำดับการโหลดฟอนต์ และเพิ่มฟังก์ชันการทำงานตามสิ่งที่เกิดขึ้นในแต่ละเฟส
ใครเป็นคนสร้างแบบอักษร?
Google Fonts เป็นโครงการโอเพ่นซอร์สที่ช่วยให้ผู้คนสามารถใช้แบบอักษรเหล่านี้ได้ฟรี ความหลากหลายของแบบอักษรที่มีอยู่ในปัจจุบัน ต้องขอบคุณชุมชนการออกแบบทั่วโลกของนักออกแบบประเภทและโรงหล่อ
มีอะไรอยู่ในนั้นสำหรับ Google
Google รักข้อมูล! ลิงก์ Google Fonts API สามารถพบได้ในหลายเว็บไซต์ และแต่ละลิงก์แสดงถึงโอกาสที่ Google จะขุดข้อมูลเพิ่มเติม แต่เราสามารถขอบคุณที่งานของพวกเขาได้แก้ปัญหาอื่นสำหรับผู้ใช้อินเทอร์เน็ต
บทสรุป
โดยสรุป Google Font API เป็นเครื่องมือที่ทรงพลังสำหรับนักพัฒนาและนักออกแบบที่สามารถช่วยสร้างเว็บไซต์ที่มีเอกลักษณ์และน่าสนใจ มันยังใช้งานง่ายอีกด้วย ดังนั้นหากคุณต้องการเพิ่มความหลากหลายให้กับการออกแบบเว็บไซต์ของคุณหรือทดลองฟอนต์ในโครงการล่าสุดของคุณ เราขอแนะนำให้คุณลองดู!