پیدا کردن فونتهای مورد استفاده در یک وبسایت میتواند به دلایل مختلفی مفید باشد؛ از جمله طراحی سایت مشابه، بهبود خوانایی، یا الهام گرفتن برای پروژههای طراحی گرافیکی. در این مقاله، به شما نشان خواهیم داد که چگونه میتوانید فونتهای استفاده شده در یک وبسایت را شناسایی کرده و با چند روش و نحوه تشخیص فونت سایت آشنا خواهید شد.
اکثر مرورگرهای وب مدرن، ابزارهایی برای توسعهدهندگان ارائه میدهند که میتوانند به شما کمک کنند تا فونتهای استفاده شده در یک وبسایت را پیدا کنید. برای اینکه بتوانید تشخیص دهید فونت استفاده شده در سایت مورد علاقه تان نامش چیست روشی وجود دارد که در زیر برای هر مرورگر آموزش می دهیم:
1. Google Chrome
• باز کردن ابزارهای توسعهدهنده: روی صفحه راست کلیک کرده و گزینه “Inspect” یا “Inspect Element” را انتخاب کنید. همچنین میتوانید از کلیدهای ترکیبی `Ctrl + Shift + I` (در ویندوز) یا `Cmd + Option + I` (در مک) استفاده کنید.
• انتخاب عنصر: از ابزار انتخاب عنصر (آیکون فلش) در بالا سمت چپ پنجره ابزارهای توسعهدهنده استفاده کنید و بر روی متنی که میخواهید فونت آن را شناسایی کنید، کلیک کنید.
• مشاهده استایلها: در پنل سمت راست، به تب “Computed” یا “Styles” بروید و به دنبال بخش “font-family” بگردید. در این بخش، فونتهای استفاده شده نمایش داده میشوند.
2. Mozilla Firefox
• باز کردن ابزارهای توسعهدهنده: راست کلیک کرده و گزینه “Inspect Element” را انتخاب کنید یا از کلیدهای ترکیبی `Ctrl + Shift + C` (در ویندوز) یا `Cmd + Option + C` (در مک) استفاده کنید.
• انتخاب عنصر: از ابزار انتخاب عنصر استفاده کرده و روی متنی که میخواهید فونت آن را بدانید، کلیک کنید.
• مشاهده استایلها: در پنل سمت راست، به تب “Fonts” بروید. در این بخش، جزئیات مربوط به فونتهای استفاده شده نمایش داده میشوند.
اگر به دنبال روشی سریعتر و سادهتر هستید، میتوانید از افزونههای مرورگر استفاده کنید. برخی از محبوبترین افزونهها عبارتند از:
1. WhatFont
این افزونه برای مرورگرهای کروم و سافاری موجود است و استفاده از آن بسیار ساده است.
• نصب افزونه: به فروشگاه وب کروم یا فروشگاه افزونههای سافاری بروید و افزونه WhatFont را نصب کنید.
• فعال کردن افزونه: روی آیکون افزونه در نوار ابزار مرورگر کلیک کنید.
• شناسایی فونت: روی هر متنی که میخواهید فونت آن را بدانید، حرکت کرده و کلیک کنید. جزئیات فونت بلافاصله نمایش داده میشود.
2. FontFace Ninja
این افزونه نیز برای کروم و فایرفاکس موجود است و به شما امکان میدهد تا فونتهای استفاده شده در صفحات وب را شناسایی کنید.
• نصب افزونه: به فروشگاه وب کروم یا فروشگاه افزونههای فایرفاکس بروید و افزونه FontFace Ninja را نصب کنید.
• فعال کردن افزونه: روی آیکون افزونه در نوار ابزار مرورگر کلیک کنید.
• شناسایی فونت: روی متنی که میخواهید فونت آن را بدانید، کلیک کنید. افزونه فونت را شناسایی و نمایش میدهد.
برخی از ابزارهای آنلاین نیز وجود دارند که میتوانند به شما در شناسایی فونتهای استفاده شده در یک وبسایت کمک کنند. این ابزارها به شما امکان میدهند تا URL صفحه وب را وارد کرده و فونتهای استفاده شده را مشاهده کنید.
1. WhatFontIs
این وبسایت به شما امکان میدهد تا تصویری از متن را آپلود کرده یا URL صفحه وب را وارد کنید و فونتهای استفاده شده را شناسایی کنید.
• بازدید از وبسایت: به سایت WhatFontIs بروید.
• آپلود تصویر یا وارد کردن URL: تصویر متن را آپلود کرده یا URL صفحه وب را وارد کنید.
• شناسایی فونت: ابزار به طور خودکار فونتهای استفاده شده را شناسایی و نمایش میدهد.
2. Fonts Ninja
این ابزار نیز به صورت آنلاین قابل دسترسی است و میتوانید از آن برای شناسایی فونتهای استفاده شده در صفحات وب استفاده کنید.
• بازدید از وبسایت: به سایت Fonts Ninja بروید.
• وارد کردن آدرس URL صفحه مورد نظر در سایت: URL صفحه وب را وارد کنید.
• شناسایی فونت: ابزار فونتهای استفاده شده را نمایش میدهد.
اگر دسترسی به فایلهای CSS یک وبسایت دارید، میتوانید به طور مستقیم فونتهای استفاده شده را شناسایی کنید.
• دسترسی به فایلهای CSS: به فایلهای CSS وبسایت دسترسی پیدا کنید.
• جستجو برای “font-family”: در فایلهای CSS به دنبال خطهایی که شامل “font-family” هستند بگردید. این خطها فونتهای استفاده شده در سایت را نشان میدهند.
شناسایی فونتهای استفاده شده در یک وبسایت میتواند به شما در بهبود طراحی وبسایت و یا الهام گرفتن برای پروژههای طراحی کمک کند. با استفاده از ابزارهای مرورگر، افزونههای مرورگر، ابزارهای آنلاین و بررسی فایلهای CSS، میتوانید به راحتی فونتهای استفاده شده در هر وبسایتی را پیدا کنید.