دانلود فونت آراد (Arad)
فونت آراد (Arad) یکی از فونتهای فارسی-عربی مدرن و هندسی است که با هدف ارائه یک تایپ فیس خوانا، کاربردی...
فونت آراد (Arad) یکی از فونتهای فارسی-عربی مدرن و هندسی است که با هدف ارائه یک تایپ فیس خوانا، کاربردی و متنوع برای استفاده در متن، رابط کاربری و تیترها طراحی شده است. این فونت ادامهای بر ایده و ساختار فونت شبنم محسوب میشود و در نسخههای جدید، طراحی و امکانات گسترده تری ارائه می دهد.
در این صفحه میتوانید فونت آراد را برای استفاده در ویندوز، نرمافزارهای طراحی و همچنین طراحی وب دانلود کنید. بسته فونت علاوه بر نسخههای معمولی، شامل نسخه Variable نیز است که امکان کنترل پیوسته وزن فونت را در اختیار طراح قرار میدهد.
فونت آراد تحت مجوز SIL Open Font License (OFL) منتشر شده و بر اساس مستندات رسمی پروژه، امکان استفاده از آن برای کاربردهای مختلف وجود دارد.
فونت آراد چه ویژگیهایی دارد؟
آراد در دسته فونتهای Sans قرار میگیرد و در میان فونتهای فارسی، ساختاری هندسی دارد. همین ویژگی باعث شده بتوان از آن در پروژههای مختلف، از متنهای طولانی گرفته تا رابط کاربری و تیترهای بزرگ استفاده کرد.
این فونت در وزن های مختلفی ارائه شده است:
- Thin – نازک
- ExtraLight – فوق سبک
- Light – سبک
- Regular – معمولی
- Medium – متوسط
- SemiBold – نیمه ضخیم
- Bold – ضخیم
- ExtraBold – فوق ضخیم
وجود وزنهای متعدد باعث میشود طراح بتواند برای بخشهای مختلف یک رابط کاربری یا صفحه وب، سلسلهمراتب بصری مناسبی ایجاد کند. برای مثال میتوان از وزن Regular برای متن، Medium یا SemiBold برای عناصر رابط کاربری و Bold یا ExtraBold برای تیترها استفاده کرد.
پشتیبانی از زبانهای مختلف
فونت آراد تنها برای متون فارسی طراحی نشده و از چند زبان و مجموعه نویسه پشتیبانی میکند. طبق مستندات رسمی پروژه، زبانهای زیر در فونت پشتیبانی میشوند:
- فارسی
- عربی
- ترکی آذری
- اردو
- کردی
- انگلیسی
برای نوشتههای لاتین نیز فونت Kanit بهعنوان همنشین طراحی آراد در نظر گرفته شده است و نسخه مورد استفاده در پروژه تغییراتی متناسب با فونت آراد دارد.
دانلود فونت آراد در فرمتهای مختلف
در بسته فونت آراد نسخهها و فایلهای مختلفی وجود دارد که هرکدام برای کاربرد خاصی مناسب هستند.
نسخه Static
نسخههای Static همان فایلهای معمولی فونت هستند که هر وزن در یک فایل جداگانه قرار میگیرد. برای مثال نسخههای Regular، Medium و Bold فایلهای جداگانه دارند.
این نسخه برای استفاده معمول در نرمافزارهای طراحی، سیستمعامل و پروژههایی که تنها به چند وزن مشخص نیاز دارند، گزینه مناسبی است.
نسخه Variable
یکی از مهمترین امکانات فونت آراد، ارائه نسخه Variable Font است.
در فونت های معمولی، برای استفاده از وزنهای مختلف باید فایلهای جداگانهای مانند Regular، Medium، Bold و … را بارگذاری کنید؛ اما فونت Variable میتواند محدودهای از وزنها را در یک فایل واحد در اختیار شما قرار دهد.
نسخه Variable آراد برای استفاده در وب اهمیت ویژهای دارد، زیرا میتواند تعداد فایلهای فونت موردنیاز و در نتیجه تعداد درخواستهای مرورگر را کاهش دهد. همچنین به جای محدود شدن به وزنهای از پیش تعیین شده، امکان انتخاب وزن در یک بازه پیوسته وجود دارد.
در این بسته، نسخه Variable در فرمتهای TTF و WOFF2 ارائه شده است. برای وب، استفاده از WOFF2 انتخاب مناسب تری است.
آموزش استفاده از فونت آراد در سایت
اگر قصد دارید فونت آراد را در سایت خود استفاده کنید، پیشنهاد میشود نسخه WOFF2 را در پوشه فونتهای پروژه قرار دهید.
برای نسخه Variable میتوانید فونت را با @font-face تعریف کنید:
@font-face {
font-family: 'Arad-VF';
src: url('fonts/AradVF.woff2') format('woff2');
font-weight: 100 800;
font-style: normal;
font-display: swap;
}
سپس فونت را روی عناصر موردنظر اعمال کنید:
body {
font-family: 'Arad-VF', sans-serif;
font-weight: 400;
}
h1 {
font-weight: 700;
}
h2 {
font-weight: 600;
}
در نسخه Variable میتوانید وزن را در محدوده تعریفشده تنظیم کنید و لازم نیست برای هر وزن، @font-face جداگانه تعریف کنید. مستندات رسمی پروژه نیز برای فونت Variable محدوده وزن 100 تا 800 را در نمونه کد خود مشخص کرده است.
استفاده از نسخه Static در سایت
اگر ترجیح میدهید از فایلهای جداگانه استفاده کنید، میتوانید وزنهای موردنیاز را به شکل زیر تعریف کنید:
@font-face {
font-family: 'Arad';
src: url('fonts/Arad-Regular.woff2') format('woff2');
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Arad';
src: url('fonts/Arad-Medium.woff2') format('woff2');
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Arad';
src: url('fonts/Arad-Bold.woff2') format('woff2');
font-weight: 700;
font-style: normal;
font-display: swap;
}
نمونه CSS در پوشه ها با نام help.css موجود هست .
فعال کردن اعداد فارسی در فونت آراد
یکی از قابلیتهای کاربردی آراد، امکان تبدیل اعداد انگلیسی و عربی به شکل فارسی بدون نیاز به استفاده از فونت جداگانه است.
برای این کار از ویژگی OpenType با نام ss01 استفاده میشود.
در CSS:
.fa-numbers {
font-feature-settings: "ss01";
}
سپس:
<span class="fa-numbers">
۱۲۳۴۵۶۷۸۹۰
</span>
در واقع فونت میتواند شکل نمایش اعداد را تغییر دهد و این کار را میتوان تنها برای بخشهایی از سایت فعال کرد. به همین دلیل نیازی نیست کل سایت را با نسخه هک شده اعداد فارسی نمایش دهید. مستندات رسمی آراد نیز فعال کردن ss01 را روش پیشنهادی برای این کار معرفی میکند.
در فایل CSS همراه فونت نیز همین قابلیت با کلاس جداگانه و font-feature-settings: "ss01" تعریف شده است.
نمایش اعداد فارسی بهصورت همعرض
برای بعضی رابطهای کاربری، جدولها، گزارشها، فاکتورها و اطلاعات آماری بهتر است تمام اعداد عرض یکسانی داشته باشند.
ویژگی OpenType tnum برای این کاربرد در نظر گرفته شده است:
.tabular-numbers {
font-feature-settings: "tnum";
}
برای مثال:
<div class="tabular-numbers">
11111
</div>
در این حالت، عرض اعداد یکسان میشود و قرارگیری آنها در جدولها و اطلاعات عددی منظمتر خواهد بود.
ترکیب اعداد فارسی و همعرض
اگر میخواهید هم اعداد فارسی باشند و هم عرض یکسان داشته باشند، میتوانید هر دو ویژگی را همزمان فعال کنید:
.fa-tabular-numbers {
font-feature-settings: "ss01", "tnum";
}
فعال کردن قابلیتهای ویژه حروف و نمادها
فونت آراد علاوه بر وزنهای مختلف، تعدادی قابلیت OpenType دارد که میتوان آنها را در CSS فعال کرد.
تغییر حالت ک و گ
با استفاده از ss02 میتوان حالت جایگزین حروف ک و گ را فعال کرد:
.kaf-gaf {
font-feature-settings: "ss02";
}
تغییر حالت ی
ویژگی ss03 برای تغییر حالت ی در نظر گرفته شده است:
.reversed-yeh {
font-feature-settings: "ss03";
}
نمادهای ریال، تومان و درهم
برای نمادهای مرتبط با ارز نیز ویژگی ss04 وجود دارد:
.currency-symbols {
font-feature-settings: "ss04";
}
اعداد و علائم مناسب رابط کاربری
ویژگی ss05 برای مجموعهای از اعداد و علائم مناسب UI در نظر گرفته شده است:
.ui-numbers {
font-feature-settings: "ss05";
}
این ویژگیها مستقیماً در فایل CSS همراه فونت نیز مشخص شدهاند.
فعال کردن Swash در فونت آراد
فونت آراد قابلیت Swash نیز دارد که میتواند شکل برخی حروف را به حالت جایگزین و تزئینی تغییر دهد.
برای فعال کردن آن در CSS:
.arad-swash {
font-feature-settings: "swsh";
}
Swash بیشتر برای طراحیهای گرافیکی، لوگوتایپ، تیترها و بخشهایی که ظاهر متفاوت حروف اهمیت دارد کاربرد دارد و معمولاً برای متنهای طولانی پیشنهاد نمیشود.
تغییر حالت نقاط در نسخه Variable
یکی از قابلیتهای جالب نسخه Variable آراد، امکان تغییر حالت نقاط حروف با محور اختصاصی DSTY است.
برای نمونه:
body {
font-family: 'Arad-VF';
font-variation-settings: "wght" 400, "DSTY" 2;
}
همچنین میتوان وزن و حالت نقاط را همزمان تغییر داد:
h1 {
font-family: 'Arad-VF';
font-variation-settings: "wght" 700, "DSTY" 2;
}
در این حالت، wght وزن فونت را کنترل میکند و DSTY حالت نقاط را تغییر میدهد. مستندات رسمی فونت آراد استفاده از همین محور را برای نسخه Variable توضیح داده است.
استفاده همزمان از نسخه Variable و Static برای سازگاری بیشتر
اگر پروژهای دارید که میخواهید حتی مرورگرهای قدیمی تر را نیز بهتر پوشش دهد، مستندات رسمی آراد یک روش ترکیبی پیشنهاد میکند.
در این روش ابتدا یک نسخه Static بهعنوان حالت پایه تعریف میشود و سپس با @supports، در مرورگرهایی که از Variable Font پشتیبانی میکنند، نسخه Variable مورد استفاده قرار میگیرد.
نمونه:
@font-face {
font-family: 'Arad-VF';
src: url('fonts/variable/Arad-VF.woff2') format('woff2 supports variations'),
url('fonts/variable/Arad-VF.woff2') format('woff2-variations');
font-weight: 100 800;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Arad';
src: url('fonts/Arad-Regular.woff2');
font-weight: 400;
font-display: fallback;
}
@font-face {
font-family: 'Arad';
src: url('fonts/Arad-Bold.woff2');
font-weight: 700;
font-display: fallback;
}
body {
font-family: 'Arad';
font-weight: 400;
}
h1 {
font-family: 'Arad';
font-weight: 700;
}
@supports (font-variation-settings: normal) {
body,
h1 {
font-family: 'Arad-VF', 'Arad';
}
}
این روش در راهنمای رسمی پروژه برای افزایش سازگاری مرورگرها پیشنهاد شده است. همچنین اگر از
font-variation-settingsاستفاده میکنید، مستندات پروژه تأکید میکند که این ویژگی را در بخش@supportsقرار دهید.
فونت Arad برای چه پروژههایی مناسب است؟
به دلیل داشتن وزنهای متنوع و طراحی هندسی، آراد را میتوان در پروژههای مختلف استفاده کرد، از جمله:
- طراحی سایت و وبلاگ
- رابط کاربری و UI
- طراحی داشبورد
- فروشگاههای اینترنتی
- سایتهای شرکتی
- اپلیکیشنهای فارسی
- تیتر و عنوان صفحات
- بنر و محتوای گرافیکی
- طراحی رابط کاربری موبایل
- صفحات فرود
- فاکتور و گزارشهای عددی
- پروژههایی که به اعداد فارسی و قابلیتهای OpenType نیاز دارند
برای متنهای طولانی بهتر است وزنهای معمولی مانند Regular و Medium را امتحان کنید و برای تیترها از وزنهای سنگینتر استفاده کنید تا سلسلهمراتب بصری صفحه حفظ شود.
کدام نسخه فونت آراد را برای وب انتخاب کنیم؟
اگر هدف شما استفاده از فونت آراد در یک وبسایت مدرن است، نسخه Variable با فرمت WOFF2 انتخاب بسیار مناسبی است.
مزیت اصلی این روش این است که به جای قرار دادن تعداد زیادی فایل برای وزنهای مختلف، میتوان یک فایل Variable را بارگذاری کرد و وزن موردنظر را با CSS تغییر داد.
اگر پروژه شما فقط به یک یا دو وزن مشخص نیاز دارد، استفاده از نسخه Static نیز میتواند منطقی باشد؛ برای مثال فقط Regular و Bold.
بهصورت خلاصه:
| کاربرد | نسخه پیشنهادی |
|---|---|
| وبسایت مدرن | Variable WOFF2 |
| استفاده از چند وزن مختلف در وب | Variable WOFF2 |
| استفاده در نرمافزارهای گرافیکی | Static / TTF |
| نصب معمول روی سیستم | TTF |
| پروژهای با تعداد وزن محدود | Static WOFF2 |
| کنترل پیوسته وزن | Variable |
| کاهش تعداد فایلهای فونت در وب | Variable WOFF2 |
ساختار فایلهای بسته فونت آراد
در بسته رسمی فونت، فایلها برای کاربردهای مختلف دسته بندی شدهاند. از جمله نسخه اصلی، فونتهای Variable، فایلهای Static، نسخه مخصوص اعداد فارسی و نسخه بدون حروف انگلیسی.
نسخه بدون حروف انگلیسی میتواند زمانی کاربرد داشته باشد که بخواهید فونت انگلیسی دیگری را در کنار آراد انتخاب کنید یا حجم فونت را برای یک کاربرد خاص کاهش دهید. نسخه مخصوص اعداد فارسی نیز اعداد انگلیسی و عربی را به شکل فارسی نمایش میدهد، هرچند راهنمای رسمی، استفاده از قابلیت ss01 را برای این منظور پیشنهاد میکند.
جمع بندی
فونت آراد یک فونت فارسی-عربی هندسی با قابلیتهای متنوع OpenType است که علاوه بر استفاده معمول در طراحی و نرمافزارهای گرافیکی، امکانات مناسبی برای استفاده در وب دارد.
پشتیبانی از نسخه Variable، قابلیت تنظیم وزن، محور اختصاصی تغییر حالت نقاط، تبدیل اعداد به فارسی، اعداد همعرض، Swash و مجموعهای از ویژگیهای جایگزین حروف و نمادها باعث شده آراد برای پروژههایی که کنترل بیشتری روی تایپوگرافی فارسی نیاز دارند، گزینهای انعطافپذیر باشد.
برای استفاده در وب، نسخه Variable WOFF2 انتخاب مناسبی است و با استفاده از @font-face میتوان آن را در سایت بارگذاری کرد. همچنین در صورت نیاز میتوان از ویژگیهای OpenType مانند ss01، ss02، ss03، ss04، ss05، tnum و swsh مستقیماً در CSS استفاده کرد. نمونههای CSS این قابلیتها در فایل آموزشی همراه فونت نیز ارائه شدهاند.
اگر به دنبال یک فونت فارسی مدرن برای طراحی سایت، رابط کاربری، داشبورد، فروشگاه اینترنتی یا محتوای گرافیکی هستید، میتوانید فونت آراد را از همین صفحه دانلود کرده و متناسب با نوع پروژه، نسخه Static یا Variable آن را انتخاب کنید.
آراد
هر متنی را وارد کنید و وزنها و اندازههای مختلف فونت را مشاهده کنید.