reza added some thing

master
RezaAshrafi77 3 years ago
parent 3d391f7497
commit c00b6357c8
  1. 1
      package.json
  2. BIN
      public/assets/IRANSans/About_Different_formats.pdf
  3. BIN
      public/assets/IRANSans/About_Different_formats.png
  4. BIN
      public/assets/IRANSans/Farsi_numerals/Black.ttf
  5. BIN
      public/assets/IRANSans/Farsi_numerals/Bold.ttf
  6. BIN
      public/assets/IRANSans/Farsi_numerals/English to Farsi numbers help.pdf
  7. BIN
      public/assets/IRANSans/Farsi_numerals/Farsi_numerals.png
  8. BIN
      public/assets/IRANSans/Farsi_numerals/IRANSans(FaNum).ttf
  9. BIN
      public/assets/IRANSans/Farsi_numerals/IRANSans(FaNum)_Medium.ttf
  10. BIN
      public/assets/IRANSans/Farsi_numerals/IRANSans(FaNum)_UltraLight.ttf
  11. BIN
      public/assets/IRANSans/Farsi_numerals/MobileFonts/IRANSansMobile(FaNum).ttf
  12. BIN
      public/assets/IRANSans/Farsi_numerals/MobileFonts/IRANSansMobile(FaNum)_Black.ttf
  13. BIN
      public/assets/IRANSans/Farsi_numerals/MobileFonts/IRANSansMobile(FaNum)_Bold.ttf
  14. BIN
      public/assets/IRANSans/Farsi_numerals/MobileFonts/IRANSansMobile(FaNum)_Light.ttf
  15. BIN
      public/assets/IRANSans/Farsi_numerals/MobileFonts/IRANSansMobile(FaNum)_Medium.ttf
  16. BIN
      public/assets/IRANSans/Farsi_numerals/MobileFonts/IRANSansMobile(FaNum)_UltraLight.ttf
  17. BIN
      public/assets/IRANSans/Farsi_numerals/MobileFonts/MobileFonts.png
  18. BIN
      public/assets/IRANSans/Farsi_numerals/light.ttf
  19. 281
      public/assets/IRANSans/Farsi_numerals/webFonts/IRANSans.html
  20. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/WebFonts.png
  21. 86
      public/assets/IRANSans/Farsi_numerals/webFonts/css/fontiran.css
  22. 191
      public/assets/IRANSans/Farsi_numerals/webFonts/css/style.css
  23. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/eot/IRANSansWeb(FaNum).eot
  24. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/eot/IRANSansWeb(FaNum)_Black.eot
  25. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/eot/IRANSansWeb(FaNum)_Bold.eot
  26. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/eot/IRANSansWeb(FaNum)_Light.eot
  27. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/eot/IRANSansWeb(FaNum)_Medium.eot
  28. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/eot/IRANSansWeb(FaNum)_UltraLight.eot
  29. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/ttf/IRANSansWeb(FaNum).ttf
  30. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/ttf/IRANSansWeb(FaNum)_Black.ttf
  31. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/ttf/IRANSansWeb(FaNum)_Bold.ttf
  32. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/ttf/IRANSansWeb(FaNum)_Light.ttf
  33. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/ttf/IRANSansWeb(FaNum)_Medium.ttf
  34. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/ttf/IRANSansWeb(FaNum)_UltraLight.ttf
  35. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/woff/IRANSansWeb(FaNum).woff
  36. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/woff/IRANSansWeb(FaNum)_Black.woff
  37. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/woff/IRANSansWeb(FaNum)_Bold.woff
  38. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/woff/IRANSansWeb(FaNum)_Light.woff
  39. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/woff/IRANSansWeb(FaNum)_Medium.woff
  40. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/woff/IRANSansWeb(FaNum)_UltraLight.woff
  41. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/woff2/IRANSansWeb(FaNum).woff2
  42. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/woff2/IRANSansWeb(FaNum)_Black.woff2
  43. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/woff2/IRANSansWeb(FaNum)_Bold.woff2
  44. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/woff2/IRANSansWeb(FaNum)_Light.woff2
  45. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/woff2/IRANSansWeb(FaNum)_Medium.woff2
  46. BIN
      public/assets/IRANSans/Farsi_numerals/webFonts/fonts/woff2/IRANSansWeb(FaNum)_UltraLight.woff2
  47. 18
      public/assets/IRANSans/FontLicense.txt
  48. BIN
      public/assets/IRANSans/IRANSans.ttf
  49. BIN
      public/assets/IRANSans/IRANSans5.jpg
  50. 81
      public/assets/IRANSans/IRANSans5_5.html
  51. BIN
      public/assets/IRANSans/IRANSans_Black.ttf
  52. BIN
      public/assets/IRANSans/IRANSans_Bold.ttf
  53. BIN
      public/assets/IRANSans/IRANSans_Light.ttf
  54. BIN
      public/assets/IRANSans/IRANSans_Medium.ttf
  55. BIN
      public/assets/IRANSans/IRANSans_UltraLight.ttf
  56. BIN
      public/assets/IRANSans/MobileFonts/IRANSansMobile.ttf
  57. BIN
      public/assets/IRANSans/MobileFonts/IRANSansMobile_Black.ttf
  58. BIN
      public/assets/IRANSans/MobileFonts/IRANSansMobile_Bold.ttf
  59. BIN
      public/assets/IRANSans/MobileFonts/IRANSansMobile_Light.ttf
  60. BIN
      public/assets/IRANSans/MobileFonts/IRANSansMobile_Medium.ttf
  61. BIN
      public/assets/IRANSans/MobileFonts/IRANSansMobile_UltraLight.ttf
  62. BIN
      public/assets/IRANSans/MobileFonts/MobileFonts.png
  63. BIN
      public/assets/IRANSans/MonoSpaced_Numral/IRANSansMonoSpacedNum.ttf
  64. BIN
      public/assets/IRANSans/MonoSpaced_Numral/IRANSansMonoSpacedNum_Black.ttf
  65. BIN
      public/assets/IRANSans/MonoSpaced_Numral/IRANSansMonoSpacedNum_Bold.ttf
  66. BIN
      public/assets/IRANSans/MonoSpaced_Numral/IRANSansMonoSpacedNum_Light.ttf
  67. BIN
      public/assets/IRANSans/MonoSpaced_Numral/IRANSansMonoSpacedNum_Medium.ttf
  68. BIN
      public/assets/IRANSans/MonoSpaced_Numral/IRANSansMonoSpacedNum_UltraLight.ttf
  69. BIN
      public/assets/IRANSans/MonoSpaced_Numral/MonoSpaced Numral.png
  70. BIN
      public/assets/IRANSans/MonoSpaced_Numral/OnlyNumeral/IRANSansFaNum_Black.ttf
  71. BIN
      public/assets/IRANSans/MonoSpaced_Numral/OnlyNumeral/IRANSansOnlyNumeral.ttf
  72. BIN
      public/assets/IRANSans/MonoSpaced_Numral/OnlyNumeral/IRANSansOnlyNumeral_Bold.ttf
  73. BIN
      public/assets/IRANSans/MonoSpaced_Numral/OnlyNumeral/IRANSansOnlyNumeral_Light.ttf
  74. BIN
      public/assets/IRANSans/MonoSpaced_Numral/OnlyNumeral/IRANSansOnlyNumeral_UltraLight.ttf
  75. BIN
      public/assets/IRANSans/MonoSpaced_Numral/OnlyNumeral/IRANSansOnlyNumral_Medium.ttf
  76. BIN
      public/assets/IRANSans/MonoSpaced_Numral/OnlyNumeral/woff/IRANSansOnlyNumeral.woff
  77. BIN
      public/assets/IRANSans/MonoSpaced_Numral/OnlyNumeral/woff/IRANSansOnlyNumeral_Black.woff
  78. BIN
      public/assets/IRANSans/MonoSpaced_Numral/OnlyNumeral/woff/IRANSansOnlyNumeral_Bold.woff
  79. BIN
      public/assets/IRANSans/MonoSpaced_Numral/OnlyNumeral/woff/IRANSansOnlyNumeral_Light.woff
  80. BIN
      public/assets/IRANSans/MonoSpaced_Numral/OnlyNumeral/woff/IRANSansOnlyNumeral_UltraLight.woff
  81. BIN
      public/assets/IRANSans/MonoSpaced_Numral/OnlyNumeral/woff/IRANSansOnlyNumral_Medium.woff
  82. BIN
      public/assets/IRANSans/MonoSpaced_Numral/woff/IRANSansMonoSpacedNum.woff
  83. BIN
      public/assets/IRANSans/MonoSpaced_Numral/woff/IRANSansMonoSpacedNum_Black.woff
  84. BIN
      public/assets/IRANSans/MonoSpaced_Numral/woff/IRANSansMonoSpacedNum_Bold.woff
  85. BIN
      public/assets/IRANSans/MonoSpaced_Numral/woff/IRANSansMonoSpacedNum_Light.woff
  86. BIN
      public/assets/IRANSans/MonoSpaced_Numral/woff/IRANSansMonoSpacedNum_Medium.woff
  87. BIN
      public/assets/IRANSans/MonoSpaced_Numral/woff/IRANSansMonoSpacedNum_UltraLight.woff
  88. BIN
      public/assets/IRANSans/Non_English/MobileFonts/IRAN SansMobile(NoEn).ttf
  89. BIN
      public/assets/IRANSans/Non_English/MobileFonts/IRANSansMobile(NoEn)_Black.ttf
  90. BIN
      public/assets/IRANSans/Non_English/MobileFonts/IRANSansMobile(NoEn)_Bold.ttf
  91. BIN
      public/assets/IRANSans/Non_English/MobileFonts/IRANSansMobile(NoEn)_Light.ttf
  92. BIN
      public/assets/IRANSans/Non_English/MobileFonts/IRANSansMobile(NoEn)_Medium.ttf
  93. BIN
      public/assets/IRANSans/Non_English/MobileFonts/IRANSansMobile(NoEn)_ultralight.ttf
  94. BIN
      public/assets/IRANSans/Non_English/MobileFonts/MobileFonts.png
  95. BIN
      public/assets/IRANSans/Non_English/Non_English.png
  96. 281
      public/assets/IRANSans/Non_English/WebFonts/IRANSans.html
  97. BIN
      public/assets/IRANSans/Non_English/WebFonts/WebFonts.png
  98. 84
      public/assets/IRANSans/Non_English/WebFonts/css/fontiran.css
  99. 191
      public/assets/IRANSans/Non_English/WebFonts/css/style.css
  100. BIN
      public/assets/IRANSans/Non_English/WebFonts/fonts/eot/IRANSansWeb(NoEn).eot
  101. Some files were not shown because too many files have changed in this diff Show More

@ -67,6 +67,7 @@
"react": "^17.0.2",
"react-app-polyfill": "^2.0.0",
"react-audio-player": "^0.17.0",
"react-bootstrap": "^1.6.1",
"react-dev-utils": "^11.0.3",
"react-dom": "^17.0.2",
"react-elastic-carousel": "^0.11.5",

Binary file not shown.

After

Width:  |  Height:  |  Size: 162 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 124 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 102 KiB

@ -0,0 +1,281 @@
<!doctype html>
<html lang="fa">
<head>
<meta charset="utf-8">
<title>IRANSans Family Type face: خانواده فونت ایران سن سریف</title>
<meta name="fontiran.com:license" content="کد ۵ رقمی لایسنس">
<link href="css/style.css" rel="stylesheet">
</head>
<body dir="rtl">
<div class="wrapper">
<div class="mainbox">
<div class="titelbox">
<h1>بِسْمِ الله الرَّحْمَنِ الرَّحِيمِ</h1>
</div>
<div class="alphabet" style="line-height:210px" > د </div>
<div class="rightbox">
<br>
<span class="text-xlarge">ن وَالْقَلَمِ وَ مَا يَسْطُرُون</span>
<br>
<span class="text-xlarge"> نون؛ سوگند به قلم و آنچه می نويسند. </span>
<br>
<span class="text-large"> Noon. I swear by the pen and what the angels write </span>
<br>
<br>
</div>
</div>
<div class="mainbox">
<div class="titelbox">
<h1>نکاتی درباره تایپوگرافی وب</h1>
</div>
<div class="alphabet" style="line-height:330px" > خ </div>
<div class="rightbox">
<p>از زمان پیدایش نخستین وب سایت، متن ها یکی از اجزای مهم صفحات وب بودند. هر چند به مرور زمان با ورود تصاویر، صوت و فیلم کمی از بار مسئولیت متون کم شد اما هنوز جایگاه خود را از دست نداده اند و بخش مهمی از کار را به عهده دارند.</p>
<p>بسیاری از طراحان وب سایت به صورت تجربی بهترین ترکیب و ظاهر را برای نمایش متن ها انتخاب می کنند. اما اصولی وجود دارد که با رعایت آن ها، تاثیرپذیری و زیبایی سایت چند برابر خواهد شد.</p>
<p>در ادامه مطلب قصد داریم تعدادی از اصول مقدماتی تایپوگرافی را به اختصار مرور کنیم. هرچند بسیاری از دوستان با این نکات آشنا هستند؛ اما شاید مرور آن ها خالی از لطف نباشد.</p>
</div>
</div>
<div class="mainbox">
<div class="titelbox">
<h1>تاثیر اندازه فونت و سلسله مراتب تگها</h1>
</div>
<div class="alphabet" style="line-height:170px"> پ </div>
<div class="rightbox">
<p>فونت های داخل سایت باید به گونه ای قرار گیرند که کاربر به راحتی بتواند آن ها را بخواند. نوع فونت، وزن و کوچک (یا بزرگ) بودن اندازه آن ممکن است تمایل کاربر برای بازگشت به وب سایت را کاهش دهد. قواعد و قوانین زیادی برای انتخاب بهترین فونت وجود دارد.</p>
<p>در زیر می توانید ۵ وزن مختلف <strong>خانواده فونت ایران سن سریف</strong> را در شرایط یکسان مشاهده کنید. لازم به ذکر است برای این صفحه از وزن نازک (Light) استفاده شده است.</p>
</div>
</div>
<div class="mainbox">
<div class="mainbox2">
<div class="text-ultralight" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Ultra Light)</div>
<div class="text-light" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Light)</div>
<div class="text-regular" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Regular)</div>
<div class="text-medium" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Medium)</div>
<div class="text-bold" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Bold)</div>
<div class="text-black" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Black)</div>
</div>
</div>
<div class="mainboxnegativ">
<div class="mainbox2">
<div class="text-ultralight" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Ultra Light)</div>
<div class="text-light" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Light)</div>
<div class="text-regular" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Regular)</div>
<div class="text-medium" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Medium)</div>
<div class="text-bold" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Bold)</div>
<div class="text-black" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Black)</div>
</div>
</div>
<div class="mainbox">
<div class="titelbox">
<h1>تگهای هدینگ</h1>
</div>
<div class="alphabet" style="line-height:150px"> ی </div>
<div class="rightbox">
<p>در این بین، استفاده از تگ های هدینگ مناسب و رعایت سلسله مراتب آن ها، هم مفهوم نوشته را بهتر منتقل می کند و هم تاثیر قابل توجهی در نتایج موتورهای جستجو خواهد داشت. این نکته یکی از فاکتورهای مهم در بهینه سازی وب سایت برای موتورهای جستجو (Search Engine Optimization) است.</p>
<p>نمونه ای از خروجی تگ های هدینگ با سایز استاندارد مربوطه به فونت های <a href="http://fontiran.com" target="_blank">فونت ایران</a> را در زیر مشاهده می کنید.</p>
</div>
</div>
<div class="mainbox">
<div class="mainbox2">
<h1>(H1) نابرده رنج گنج میسر نمی شود. No gain without pain </h1>
<h2>(H2) نابرده رنج گنج میسر نمی شود. No gain without pain</h2>
<h3>(H3) نابرده رنج گنج میسر نمی شود. No gain without pain</h3>
<h4>(H4) نابرده رنج گنج میسر نمی شود. No gain without pain </h4>
<h5>(H5) نابرده رنج گنج میسر نمی شود. No gain without pain</h5>
<h6>(H6) نابرده رنج گنج میسر نمی شود. No gain without pain</h6>
</div>
</div>
<div class="mainboxnegativ">
<div class="mainbox2">
<h1>(H1) نابرده رنج گنج میسر نمی شود. No gain without pain </h1>
<h2>(H2) نابرده رنج گنج میسر نمی شود. No gain without pain</h2>
<h3>(H3) نابرده رنج گنج میسر نمی شود. No gain without pain</h3>
<h4>(H4) نابرده رنج گنج میسر نمی شود. No gain without pain </h4>
<h5>(H5) نابرده رنج گنج میسر نمی شود. No gain without pain</h5>
<h6>(H6) نابرده رنج گنج میسر نمی شود. No gain without pain</h6>
</div>
</div>
<div class="mainbox">
<div class="titelbox">
<h1>سطر و ستون بندی</h1>
</div>
<div class="alphabet" style="line-height:200px"> م </div>
<div class="rightbox">
<p>معمولاً هرگاه مقدار نوشته از یک سطر بیشتر شود ناگزیر به ستون بندی هستیم. و این کار ما را با چند متغییر مواجه خواهد کرد:</p>
<p>۱- <strong>عرض ستونهای متنی</strong> که حاوی حداقل۷ کلمه باشد بهترین انتخاب است. اگر ستون کوتاهتر باشد چشم بیننده در اثر حرکتهای زود به زود از پایان یک سطر به ابتدای سطر بعدی خسته خواهد شد. علاوه بر این لبه ستونهایی با عرض کم نیز همیشه دندانه ای و بی نظم خواهد بود. ستونهایی با عرض طولانی هم برای خواننده آزار دهنده است چرا که چشم در حرکت بازگشت از انتهای یک سطر به ابتدای سطر بعدی ممکن است دچار اشتباه شود.
<p>۲- <strong>لدینگ یا همان فاصله سطر </strong> هم در ستون بندی اهمیت دارد. ستونهای فشرده اگرچه به لحاظ گرافیکی منسجم و زیبا هستند اما عمل خواندن را مختل می کنند و در مقابل، فاصله سطر زیاد نیز باعث نازیبایی و خستگی چشم خواننده میشود. فاصله سطر همیشه می تواند با توجه به نوع فونت و عرض ستونها تغییر کند. بدین ترتیب که فونتهایی با دندانههای بلندتر و ستونهایی با عرض بیشتر به لدینگ بیشتری نیاز دارند.
<p>۳- <strong>همترازی </strong> هم یکی از متغییرهای پر بحث در ستون بندی است. اما به طور کوتاه و خلاصه باید گفت که بهتر است در متن فارسی از همترازی یا همان Justification استفاده نکنید. این عمل اگرچه لبه پاراگراف شما را مرتب خواهد کرد اما تنظیمات فاصله حروف را تغییر خواهد داد و در نتیجه باعث کاهش خوانایی خواهد شد. </div>
</div>
<div class="mainbox">
<div class="mainbox2negativ">(IRANSans Ultra Light)</div>
<div class="farsiparagraph"><span class="text-ultralight"> ایران سن سریف IRANSans سبکی ساده و ضخامت یکسان از قلم ایران است که با وجود حفظ ساختار قلمهای رایج ایرانی حال و هوای مدرن و امروزی دارد. سادگی شکل حروف و استفاده از حداقل شکستگی باعث شده است این تایپ فیس علاوه بر خوانا بودن زیبا و چشم نواز نیز باشد. این فونت با سبکهای طراحی کمینهگرا Minimal سازگاری خوبی دارد و همنشین مناسبی برای فونتهای سنسریف لاتین است. خانواده فونت ایران سنسریف در سال ۱۳۹۴ پرطرفدارترین فونت فارسی بوده است.</span></div>
<div class="englishparagraph"><span class="text-ultralight">
Roboto has a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves. While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types.
</span></div>
</div>
<div class="mainbox">
<div class="mainbox2negativ">(IRANSans Light)</div>
<div class="farsiparagraph"><span class="text-right">ایران سن سریف IRANSans سبکی ساده و ضخامت یکسان از قلم ایران است که با وجود حفظ ساختار قلمهای رایج ایرانی حال و هوای مدرن و امروزی دارد. سادگی شکل حروف و استفاده از حداقل شکستگی باعث شده است این تایپ فیس علاوه بر خوانا بودن زیبا و چشم نواز نیز باشد. این فونت با سبکهای طراحی کمینهگرا Minimal سازگاری خوبی دارد و همنشین مناسبی برای فونتهای سنسریف لاتین است. خانواده فونت ایران سنسریف در سال ۱۳۹۴ پرطرفدارترین فونت فارسی بوده است.</span></div>
<div class="englishparagraph"><span class="text-right">
Roboto has a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves. While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types.
</span></div>
</div>
<div class="mainbox">
<div class="mainbox2negativ">(IRANSans Regular)</div>
<div class="farsiparagraph"><span class="text-regular">ایران سن سریف IRANSans سبکی ساده و ضخامت یکسان از قلم ایران است که با وجود حفظ ساختار قلمهای رایج ایرانی حال و هوای مدرن و امروزی دارد. سادگی شکل حروف و استفاده از حداقل شکستگی باعث شده است این تایپ فیس علاوه بر خوانا بودن زیبا و چشم نواز نیز باشد. این فونت با سبکهای طراحی کمینهگرا Minimal سازگاری خوبی دارد و همنشین مناسبی برای فونتهای سنسریف لاتین است. خانواده فونت ایران سنسریف در سال ۱۳۹۴ پرطرفدارترین فونت فارسی بوده است.</span></div>
<div class="englishparagraph"><span class="text-regular">
Roboto has a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves. While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types.
</span></div>
</div>
<div class="mainbox">
<div class="mainbox2negativ">(IRANSans Medium)</div>
<div class="farsiparagraph"><span class="text-medium">ایران سن سریف IRANSans سبکی ساده و ضخامت یکسان از قلم ایران است که با وجود حفظ ساختار قلمهای رایج ایرانی حال و هوای مدرن و امروزی دارد. سادگی شکل حروف و استفاده از حداقل شکستگی باعث شده است این تایپ فیس علاوه بر خوانا بودن زیبا و چشم نواز نیز باشد. این فونت با سبکهای طراحی کمینهگرا Minimal سازگاری خوبی دارد و همنشین مناسبی برای فونتهای سنسریف لاتین است. خانواده فونت ایران سنسریف در سال ۱۳۹۴ پرطرفدارترین فونت فارسی بوده است.</span></div>
<div class="englishparagraph"><span class="text-medium">
Roboto has a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves. While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types.</span>
</div>
</div>
<div class="mainbox">
<div class="mainbox2negativ">(IRANSans Bold)</div>
<div class="farsiparagraph"><span class="text-bold">ایران سن سریف IRANSans سبکی ساده و ضخامت یکسان از قلم ایران است که با وجود حفظ ساختار قلمهای رایج ایرانی حال و هوای مدرن و امروزی دارد. سادگی شکل حروف و استفاده از حداقل شکستگی باعث شده است این تایپ فیس علاوه بر خوانا بودن زیبا و چشم نواز نیز باشد. این فونت با سبکهای طراحی کمینهگرا Minimal سازگاری خوبی دارد و همنشین مناسبی برای فونتهای سنسریف لاتین است. خانواده فونت ایران سنسریف در سال ۱۳۹۴ پرطرفدارترین فونت فارسی بوده است.</span></div>
<div class="englishparagraph"><span class="text-bold">
Roboto has a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves. While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types.</span>
</div>
</div>
<div class="mainbox">
<div class="mainbox2negativ">(IRANSans Black)</div>
<div class="farsiparagraph"><span class="text-black">ایران سن سریف IRANSans سبکی ساده و ضخامت یکسان از قلم ایران است که با وجود حفظ ساختار قلمهای رایج ایرانی حال و هوای مدرن و امروزی دارد. سادگی شکل حروف و استفاده از حداقل شکستگی باعث شده است این تایپ فیس علاوه بر خوانا بودن زیبا و چشم نواز نیز باشد. این فونت با سبکهای طراحی کمینهگرا Minimal سازگاری خوبی دارد و همنشین مناسبی برای فونتهای سنسریف لاتین است. خانواده فونت ایران سنسریف در سال ۱۳۹۴ پرطرفدارترین فونت فارسی بوده است.</span></div>
<div class="englishparagraph"><span class="text-black">
Roboto has a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves. While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types.</span>
</div>
</div>
<div class="mainbox">
<div class="titelbox">
<h1>اعداد و علائم در فونت فارسی</h1>
</div>
<div class="alphabet" style="line-height:470px"> ظ </div>
<div class="rightbox">
<p><span class="text-xlarge">اعداد فارسی: <strong>۱۲۳۴۵۶۷۸۹۰</strong></span><br>
<span class="text-xlarge">اعداد عربی: <strong>۱۲۳٤٥٦۷۸۹۰</strong></span><br>
<span class="text-xlarge">اعداد انگلیسی: <strong>1234567890</strong></span></p>
<p>برای تایپ اعداد فارسی در محیط وب از <a href="https://fa.wikipedia.org/wiki/%D9%88%DB%8C%DA%A9%DB%8C%E2%80%8C%D9%BE%D8%AF%DB%8C%D8%A7:%D9%81%D8%A7%D8%B1%D8%B3%DB%8C%E2%80%8C%D9%86%D9%88%DB%8C%D8%B3%DB%8C">کیبورد استاندارد فارسی</a> استفاده کنید. در ویندوز ۸ و یا بالاتر این کیبورد، با نام Persian(Standard)Keyboard در لیست کیبوردهای ویندوز وجود دارد. همچنین می توانید از <a href="http://persian-computing.ir/download/Iranian_Standard_Persian_Keyboard_(ISIRI_9147)_(Version_2.0).zip">این آدرس</a> آن را دانلود و نصب کنید.</p>
<span>
<p>با استفاده از کیبورد استاندارد میتوانید ممیز فارسی را تایپ کنید.<br>
<span>میانبر این علامت کلیدهای <span class="text-medium">Shift+3</span> است. به این شکل: <strong class="text-xlarge">۳٫۱۴</strong></span><br>
<span >ممیز فارسی با علامت اسلش تفاوت دارد :<strong class="text-xlarge">۳/۱۴</strong></span>
</p>
<p>با استفاده از کیبورد استاندارد میتوانید جداکننده هزارگان فارسی را تایپ کنید.<br>
<span>میانبر این علامت کلیدهای <strong>Shift+2</strong> است. به این شکل: <strong class="text-xlarge">۹٬۲۱۰٬۰۰۰</strong></span><br>
<span >این علامت با جدا کننده هزارگان انگلیسی تفاوت دارد : <strong class="text-xlarge">۹,۲۱۰,۰۰۰</strong></span>
</p>
</div>
</div>
<div class="mainbox">
<div class="titelbox">
<h1> نسبتهای طلایی</h1>
</div>
<div class="alphabet2">
<div style="padding-left:20px">
۳٫۷۷۷ &divide; ۱٫۶۱۸ = <span class="text-regular text-underline">۲٫۳۳۵</span>
<br>
۶٫۱۱۲ &divide; ۱٫۶۱۸ = <span class="text-regular text-underline">۳٫۷۷۷</span>
<br>
۹٫۸۸۹ &divide; ۱٫۶۱۸ = <span class="text-regular text-underline">۶٫۱۱۲</span>
<br>
۱۶ &divide; ۱٫۶۱۸ = <span class="text-regular text-underline">۹٫۸۸۹</span>
<br>
.......................................
<br>
۱۶ &times; ۱٫۶۱۸ = <span class="text-regular text-underline">۲۵٫۸۸۸</span>
<br>
۲۵٫۸۸۸ &times; ۱٫۶۱۸ = <span class="text-regular text-underline">۴۱٫۸۸۷</span>
<br>
۴۱٫۸۸۷ &times; ۱٫۶۱۸ = <span class="text-regular text-underline">۶۷٫۷۷۳</span>
<br>
۶۷٫۷۷۳ &times; ۱٫۶۱۸ = <span class="text-regular text-underline">۱۰۹٫۶۵۶</span>
</div>
</div>
<div class="rightbox">
<p>اهمیت اندازه فونت در خوانایی و زیبا شدن صفحه وب سایت بر کسی پوشیده نیست. در کنار این بحث، موارد دیگری مانند ارتفاع خطوط، فاصله ها، ابعاد قسمت های مختلف و ... نیز در بحث تایپوگرافی اهمیت زیادی دارند.</p>
<p>برای محاسبه این اعداد می توانیم از سری اعداد متناسب (Modular Scale) استفاده کنیم. در حقیقت از تعدادی عدد پشت سر هم که بر اساس مضرب خاصی تشکیل شده اند برای تنظیمات ارتفاع خط، فاصله ها، ابعاد و ... استفاده می کنیم. نسبت (عدد) طلایی همان مضرب اعداد است.</p>
<p>به عنوان مثال می خواهیم از سایز 16px <strong>فونت ایران سن سریف</strong> به عنوان فونت و سایز اصلی متن صفحات استفاده کنیم. عدد فی (phi) یونانی که معادل ۱٫۶۱۸۰۳۳۹۸۸۷ (به اختصار ۱٫۶۱۸) است را به عنوان نسبت طلایی در نظر می گیریم. بنابراین سری اعدادی به شکل روبرو خواهیم داشت:</p>
<p>
به کمک این اعداد و استفاده از آن ها در صفحات وب سایت خود می توانیم خوانایی و زیبایی آن را افزایش دهیم. علاوه بر آن، اگر از واحدهای نسبی مانند em استفاده شود، امکانات بیشتری در اختیار طراح و بازدیدکننده خواهد بود. البته <strong>سری اعداد بر مبنای نسبت طلایی</strong> فقط در تایپوگرافی وب سایت کاربرد ندارد.
این اعداد می تواند ادامه داشته باشد (<span class="text-regular text-underline">۱٬۲۱۵٫۹۸۱</span> ، <span class="text-regular text-underline">۱٬۹۶۷٫۴۵۷</span> ، <span class="text-regular text-underline">۳٬۱۸۳٫۳۴۵</span> و ...).
</p>
</div>
</div>
<div class="mainbox">
<div class="titelbox"><h1>خوانایی لینکها</h1> </div>
<div class="alphabet" style="line-height:470px"> غ </div>
<div class="rightbox">
<p>شاید بتوانیم از لینک ها (hyperlinks) به عنوان مهم ترین بخش وب سایت ها در ارتباط با سئو (SEO) و نیز یکی از پرکاربردترین اجزای وب سایت نام ببریم. بنابراین بازدیدکننده باید بتواند به راحتی آن ها را از سایر محتوای صفحه تشخیص داده و متن لینک شده را به سرعت و بدون مزاحمت مشاهده کند.</p>
<p>به صورت پیش فرض، متن هایی که داخل یک هایپرلینک قرار می گیرند، زیر خط دار یا underline می شوند (مانند این <a href="http://fontiran.com" target="_blank">لینک یا پیوند به صفحه اصلی فونت ایران</a>). در بسیاری از فونت های فارسی، این خط روی متن و نقطه ها قرار می گیرد (مانند این <a href="http://fontiran.com" target="_blank" style="font-family: Tahoma;">لینک یا پیوند به صفحه اصلی فونت ایران با فونت تاهوما</a>).</p>
<p>در صورت بروز این مشکل، یا باید خط زیرین تمام تگ های «a» غیر فعال شود و یا با ترفندهایی به شکل دیگر ایجاد شود (مانند قرار دادن border-bottom برای تگ های «a»).</p>
<p>همچنین پیشنهاد می کنیم از قراردادن افکت ها و transition های آزاردهنده روی لینک ها پرهیز کرده و برای راحتی کاربر از padding و color با کانتراست مناسب نسبت به زمینه استفاده کنید.</p>
</div>
</div>
<div class="mainbox">
<div class="rightbox">
<br>
در این فایل سعی کردیم همراه با یک مطلب آموزشی کوتاه، نحوه استفاده از خانواده فونت ایران سن سریف و پیش نمایشی از قسمت های مختلف آن را مرور کنیم.
<br>
برای مشاهده راهنمای نحوه قراردادن فونت ها در وب سایت خود، به <a href="http://fontiran.com/?p=874" target="_blank">این آدرس</a> مراجعه کنید.
<br>
<br>
</div>
<div class="alphabet" style="line-height:60px">ء</div>
</div>
<br>
<div class="footer">
Copyright (c) 2015 by <a href="http://fontiran.com">www.fontiran.com</a> (Moslem Ebrahimi). All rights reserved.
<br>
To use this font, it is necessary to obtain the license from www.fontiran.com
</div>
</div>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 109 KiB

@ -0,0 +1,86 @@
/**
*
* Name: IRAN Sans-Serif Font
* Version: 5.0
* Author: Moslem Ebrahimi (moslemebrahimi.com)
* Created on: Dec 25, 2012
* Updated on: Sep 01, 2017
* Website: http://fontiran.com
* Copyright: Commercial/Proprietary Software
--------------------------------------------------------------------------------------
فونت های ایران سن سریف یک نرم افزار مالکیتی محسوب می شود. جهت آگاهی از قوانین استفاده از این فونت ها لطفا به وب سایت (فونت ایران دات کام) مراجعه نمایید
--------------------------------------------------------------------------------------
IRAN Sans-serif fonts are considered a proprietary software. To gain information about the laws regarding the use of these fonts, please visit www.fontiran.com
--------------------------------------------------------------------------------------
This set of fonts are used in this project under the license: (.....)
--------------------------------------------------------------------------------------
*
**/
@font-face {
font-family: IRANSans;
font-style: normal;
font-weight: 900;
src: url('../fonts/eot/IRANSansWeb(FaNum)_Black.eot');
src: url('../fonts/eot/IRANSansWeb(FaNum)_Black.eot?#iefix') format('embedded-opentype'),
/* IE6-8 */ url('../fonts/woff2/IRANSansWeb(FaNum)_Black.woff2') format('woff2'),
/* FF39+,Chrome36+, Opera24+*/ url('../fonts/woff/IRANSansWeb(FaNum)_Black.woff') format('woff'),
/* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('../fonts/ttf/IRANSansWeb(FaNum)_Black.ttf')
format('truetype');
}
@font-face {
font-family: IRANSans;
font-style: normal;
font-weight: bold;
src: url('../fonts/eot/IRANSansWeb(FaNum)_Bold.eot');
src: url('../fonts/eot/IRANSansWeb(FaNum)_Bold.eot?#iefix') format('embedded-opentype'),
/* IE6-8 */ url('../fonts/woff2/IRANSansWeb(FaNum)_Bold.woff2') format('woff2'),
/* FF39+,Chrome36+, Opera24+*/ url('../fonts/woff/IRANSansWeb(FaNum)_Bold.woff') format('woff'),
/* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('../fonts/ttf/IRANSansWeb(FaNum)_Bold.ttf')
format('truetype');
}
@font-face {
font-family: IRANSans;
font-style: normal;
font-weight: 500;
src: url('../fonts/eot/IRANSansWeb(FaNum)_Medium.eot');
src: url('../fonts/eot/IRANSansWeb(FaNum)_Medium.eot?#iefix') format('embedded-opentype'),
/* IE6-8 */ url('../fonts/woff2/IRANSansWeb(FaNum)_Medium.woff2') format('woff2'),
/* FF39+,Chrome36+, Opera24+*/ url('../fonts/woff/IRANSansWeb(FaNum)_Medium.woff')
format('woff'),
/* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('../fonts/ttf/IRANSansWeb(FaNum)_Medium.ttf')
format('truetype');
}
@font-face {
font-family: IRANSans;
font-style: normal;
font-weight: 300;
src: url('../fonts/eot/IRANSansWeb(FaNum)_Light.eot');
src: url('../fonts/eot/IRANSansWeb(FaNum)_Light.eot?#iefix') format('embedded-opentype'),
/* IE6-8 */ url('../fonts/woff2/IRANSansWeb(FaNum)_Light.woff2') format('woff2'),
/* FF39+,Chrome36+, Opera24+*/ url('../fonts/woff/IRANSansWeb(FaNum)_Light.woff') format('woff'),
/* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('../fonts/ttf/IRANSansWeb(FaNum)_Light.ttf')
format('truetype');
}
@font-face {
font-family: IRANSans;
font-style: normal;
font-weight: 200;
src: url('../fonts/eot/IRANSansWeb(FaNum)_UltraLight.eot');
src: url('../fonts/eot/IRANSansWeb(FaNum)_UltraLight.eot?#iefix') format('embedded-opentype'),
/* IE6-8 */ url('../fonts/woff2/IRANSansWeb(FaNum)_UltraLight.woff2') format('woff2'),
/* FF39+,Chrome36+, Opera24+*/ url('../fonts/woff/IRANSansWeb(FaNum)_UltraLight.woff')
format('woff'),
/* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('../fonts/ttf/IRANSansWeb(FaNum)_UltraLight.ttf')
format('truetype');
}
@font-face {
font-family: IRANSans;
font-style: normal;
font-weight: normal;
src: url('../fonts/eot/IRANSansWeb(FaNum).eot');
src: url('../fonts/eot/IRANSansWeb(FaNum).eot?#iefix') format('embedded-opentype'),
/* IE6-8 */ url('../fonts/woff2/IRANSansWeb(FaNum).woff2') format('woff2'),
/* FF39+,Chrome36+, Opera24+*/ url('../fonts/woff/IRANSansWeb(FaNum).woff') format('woff'),
/* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('../fonts/ttf/IRANSansWeb(FaNum).ttf')
format('truetype');
}

@ -0,0 +1,191 @@
@import url(fontiran.css); /* لینک فایلی که وظیفه بارگذاری فونت ها را برعهده دارد */
body {
font-family: IRANSans !important;
font-weight: 300;
direction: rtl;
background-color: #e2e2e2;
margin: 0;
}
h1,
h2,
h3,
h4,
h5,
h6,
input,
textarea {
font-family: IRANSans !important;
}
h1 {
font-weight: bold;
}
.wrapper {
max-width: 900px;
margin: 0 auto;
}
.ltr {
direction: ltr;
}
.text-right {
text-align: right;
}
.text-center {
text-align: center;
}
.text-left {
text-align: left;
}
.text-small {
font-size: 0.8em;
}
.text-xsmall {
font-size: 0.6em;
}
.text-large {
font-size: 1.2em;
}
.text-xlarge {
font-size: 1.4em;
}
.text-underline {
text-decoration: underline;
}
.text-ultralight {
font-weight: 200;
}
.text-light {
font-weight: 300;
}
.text-regular {
font-weight: normal;
}
.text-medium {
font-weight: 500;
}
.text-bold {
font-weight: bold;
}
.text-black {
font-weight: 900;
}
blockquote {
font-weight: 500;
padding: 10px;
border: 1px dashed #666666;
}
.mainbox {
width: 100%;
background-color: #efefef;
display: table;
margin-bottom: 30px;
border-right: 8px solid #ffff33;
}
.mainboxnegativ {
width: 100%;
background-color: #000000;
display: table;
margin-bottom: 30px;
border-right: 8px solid #ffff33;
color: #f9f9f9;
}
.mainbox2 {
font-size: 1em;
width: 90%;
padding-right: 20px;
padding-top: 10px;
padding-bottom: 10px;
}
.mainbox3 {
width: 100%;
background-color: #b8b8b8;
display: table;
margin-bottom: 30px;
border-right: 8px solid #bd70ff;
}
.mainbox2negativ {
font-size: 1em;
color: #f9f9f9;
background-color: #000000;
padding-right: 20px;
}
.farsiparagraph {
font-size: 1em;
width: 47%;
float: right;
padding-right: 20px;
padding-top: 10px;
padding-bottom: 10px;
}
.englishparagraph {
font-size: 1em;
width: 47%;
float: left;
direction: ltr;
padding-left: 20px;
padding-top: 10px;
padding-bottom: 10px;
}
.rightbox {
width: 60%;
padding-right: 20px;
padding-left: 5px;
float: right;
margin-left: 10px;
margin-bottom: 0px;
min-width: 0px;
background-color: #f7f7f7;
}
.titelbox {
width: 60%;
padding-right: 25px;
padding-left: 0px;
float: right;
margin-left: 10px;
margin-bottom: 0px;
min-width: 0px;
background-color: #f2f2f2;
color: #4b4b4b;
}
.lefttbox {
padding-right: 20px;
padding-left: 4px;
float: right;
margin-bottom: 10px;
min-width: 0px;
}
.alphabet {
width: 35%;
float: left;
font-size: 21em;
text-align: center;
font-weight: 500;
color: #999999;
}
.alphabet2 {
width: 35%;
float: left;
direction: ltr;
font-size: 1.6em;
text-align: left;
font-weight: 500;
color: #333333;
margin-top: 100px;
}
.footer {
font-weight: 300;
font-size: 0.7em;
text-align: center;
direction: ltr;
margin-bottom: 0px;
padding-bottom: 0px;
}

@ -0,0 +1,18 @@
IRAN Sans-serif fonts are considered a proprietary software.
To gain information about the laws regarding the use of these fonts, please visit www.fontiran.com
This set of fonts are used in this project under the license: (.....)
'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
In case you use this set of fonts in a software product, write the license code in the specified place and place this file next to the fonts.
'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
فونت های ايران سنسریف يک نرم افزار مالکيتی محسوب می شود جهت آگاهی از قوانين استفاده از اين فونتها لطفاً به وبسايت
www.fontiran.com
مراجعه نماييد
اين مجموعه فونت تحت اجازه نامه
(.....)
در اين پروژه استفاده می شود
'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
در صورت استفاده از این مجموعه فونت در یک محصول نرم افزاری یا وبسایت کد ۵ رقمی لایسنس خود را در محل مشخص شده (.....) درج کنید و این فایل را در کنار فونت ها قرار دهید.

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

@ -0,0 +1,81 @@
<!DOCTYPE html>
<html lang="fa">
<head>
<meta charset="utf-8" />
<title>IRANSans Family Type face: خانواده فونت ایران سن سریف</title>
<meta name="fontiran.com:license" content="کد ۵ رقمی لایسنس" />
<link href="WebFonts/css/style.css" rel="stylesheet" />
<style type="text/css">
a:link {
color: #9600f0;
text-decoration: none;
}
a:visited {
color: #9600f0;
text-decoration: none;
}
a:hover {
color: #ff0093;
text-decoration: none;
}
a:active {
color: #ff0033;
text-decoration: none;
}
</style>
</head>
<body dir="rtl">
<div class="wrapper">
<p></p>
<br /><br /><br />
<div class="mainbox3">
<div class="titelbox">
<h1>اگر از خدمات فونت ایران رضایت دارید:</h1>
</div>
<div style="float: left">
<br />
<br />
<img alt="" src="IRANSans5.jpg" width="324" height="366" />
</div>
<div class="rightbox">
<p>
<br />
<span class="text-xlarge" style="padding-right: 22px">لطفاً:</span>
<br />
<span class="text-xlarge"> ۱) فایلهای درون این بسته را به اشتراک نگذارید.</span>
<br />
<span class="text-xlarge"> ۲) همکاران خود را به خرید این محصول ترغیب کنید.</span>
<br />
<span class="text-xlarge"> ۳) برای محصولات خود اجازهنامه تهیه کنید.</span>
<br />
<span class="text-xlarge"
>۴) طبق راهنما، کد ۵ رقمی اجازهنامه را در محصول خود درج کنید و کاربران خود را از
کپیرایت این محصول آگاه کنید.</span
><br />
</p>
<p>
<a href="http://fontiran.com/licenses"
>کدامیک از محصولات و شرکتها با خرید اجازهنامه از حقوق ما حمایت کردهاند؟</a
>
</p>
<p>
<a href="http://fontiran.com/?p=1039"
>کدام سایتها و نرم افزارها بدون اجازهنامه از فونت ایران استفاده میکنند؟</a
>
</p>
<br />
</div>
</div>
<br />
</div>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 102 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 147 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 102 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 123 KiB

@ -0,0 +1,281 @@
<!doctype html>
<html lang="fa">
<head>
<meta charset="utf-8">
<title>IRANSans Family Type face: خانواده فونت ایران سن سریف</title>
<meta name="fontiran.com:license" content="کد ۵ رقمی لایسنس">
<link href="css/style.css" rel="stylesheet">
</head>
<body dir="rtl">
<div class="wrapper">
<div class="mainbox">
<div class="titelbox">
<h1>بِسْمِ الله الرَّحْمَنِ الرَّحِيمِ</h1>
</div>
<div class="alphabet" style="line-height:210px" > د </div>
<div class="rightbox">
<br>
<span class="text-xlarge">ن وَالْقَلَمِ وَ مَا يَسْطُرُون</span>
<br>
<span class="text-xlarge"> نون؛ سوگند به قلم و آنچه می نويسند. </span>
<br>
<span class="text-large"> Noon. I swear by the pen and what the angels write </span>
<br>
<br>
</div>
</div>
<div class="mainbox">
<div class="titelbox">
<h1>نکاتی درباره تایپوگرافی وب</h1>
</div>
<div class="alphabet" style="line-height:330px" > خ </div>
<div class="rightbox">
<p>از زمان پیدایش نخستین وب سایت، متن ها یکی از اجزای مهم صفحات وب بودند. هر چند به مرور زمان با ورود تصاویر، صوت و فیلم کمی از بار مسئولیت متون کم شد اما هنوز جایگاه خود را از دست نداده اند و بخش مهمی از کار را به عهده دارند.</p>
<p>بسیاری از طراحان وب سایت به صورت تجربی بهترین ترکیب و ظاهر را برای نمایش متن ها انتخاب می کنند. اما اصولی وجود دارد که با رعایت آن ها، تاثیرپذیری و زیبایی سایت چند برابر خواهد شد.</p>
<p>در ادامه مطلب قصد داریم تعدادی از اصول مقدماتی تایپوگرافی را به اختصار مرور کنیم. هرچند بسیاری از دوستان با این نکات آشنا هستند؛ اما شاید مرور آن ها خالی از لطف نباشد.</p>
</div>
</div>
<div class="mainbox">
<div class="titelbox">
<h1>تاثیر اندازه فونت و سلسله مراتب تگها</h1>
</div>
<div class="alphabet" style="line-height:170px"> پ </div>
<div class="rightbox">
<p>فونت های داخل سایت باید به گونه ای قرار گیرند که کاربر به راحتی بتواند آن ها را بخواند. نوع فونت، وزن و کوچک (یا بزرگ) بودن اندازه آن ممکن است تمایل کاربر برای بازگشت به وب سایت را کاهش دهد. قواعد و قوانین زیادی برای انتخاب بهترین فونت وجود دارد.</p>
<p>در زیر می توانید ۵ وزن مختلف <strong>خانواده فونت ایران سن سریف</strong> را در شرایط یکسان مشاهده کنید. لازم به ذکر است برای این صفحه از وزن نازک (Light) استفاده شده است.</p>
</div>
</div>
<div class="mainbox">
<div class="mainbox2">
<div class="text-ultralight" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Ultra Light)</div>
<div class="text-light" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Light)</div>
<div class="text-regular" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Regular)</div>
<div class="text-medium" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Medium)</div>
<div class="text-bold" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Bold)</div>
<div class="text-black" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Black)</div>
</div>
</div>
<div class="mainboxnegativ">
<div class="mainbox2">
<div class="text-ultralight" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Ultra Light)</div>
<div class="text-light" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Light)</div>
<div class="text-regular" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Regular)</div>
<div class="text-medium" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Medium)</div>
<div class="text-bold" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Bold)</div>
<div class="text-black" style="font-size:1.4em">بیانِ زبان با گذشت زمان کهنه می شود و بیانِ قلم برای همیشه باقی می ماند (Black)</div>
</div>
</div>
<div class="mainbox">
<div class="titelbox">
<h1>تگهای هدینگ</h1>
</div>
<div class="alphabet" style="line-height:150px"> ی </div>
<div class="rightbox">
<p>در این بین، استفاده از تگ های هدینگ مناسب و رعایت سلسله مراتب آن ها، هم مفهوم نوشته را بهتر منتقل می کند و هم تاثیر قابل توجهی در نتایج موتورهای جستجو خواهد داشت. این نکته یکی از فاکتورهای مهم در بهینه سازی وب سایت برای موتورهای جستجو (Search Engine Optimization) است.</p>
<p>نمونه ای از خروجی تگ های هدینگ با سایز استاندارد مربوطه به فونت های <a href="http://fontiran.com" target="_blank">فونت ایران</a> را در زیر مشاهده می کنید.</p>
</div>
</div>
<div class="mainbox">
<div class="mainbox2">
<h1>(H1) نابرده رنج گنج میسر نمی شود. No gain without pain </h1>
<h2>(H2) نابرده رنج گنج میسر نمی شود. No gain without pain</h2>
<h3>(H3) نابرده رنج گنج میسر نمی شود. No gain without pain</h3>
<h4>(H4) نابرده رنج گنج میسر نمی شود. No gain without pain </h4>
<h5>(H5) نابرده رنج گنج میسر نمی شود. No gain without pain</h5>
<h6>(H6) نابرده رنج گنج میسر نمی شود. No gain without pain</h6>
</div>
</div>
<div class="mainboxnegativ">
<div class="mainbox2">
<h1>(H1) نابرده رنج گنج میسر نمی شود. No gain without pain </h1>
<h2>(H2) نابرده رنج گنج میسر نمی شود. No gain without pain</h2>
<h3>(H3) نابرده رنج گنج میسر نمی شود. No gain without pain</h3>
<h4>(H4) نابرده رنج گنج میسر نمی شود. No gain without pain </h4>
<h5>(H5) نابرده رنج گنج میسر نمی شود. No gain without pain</h5>
<h6>(H6) نابرده رنج گنج میسر نمی شود. No gain without pain</h6>
</div>
</div>
<div class="mainbox">
<div class="titelbox">
<h1>سطر و ستون بندی</h1>
</div>
<div class="alphabet" style="line-height:200px"> م </div>
<div class="rightbox">
<p>معمولاً هرگاه مقدار نوشته از یک سطر بیشتر شود ناگزیر به ستون بندی هستیم. و این کار ما را با چند متغییر مواجه خواهد کرد:</p>
<p>۱- <strong>عرض ستونهای متنی</strong> که حاوی حداقل۷ کلمه باشد بهترین انتخاب است. اگر ستون کوتاهتر باشد چشم بیننده در اثر حرکتهای زود به زود از پایان یک سطر به ابتدای سطر بعدی خسته خواهد شد. علاوه بر این لبه ستونهایی با عرض کم نیز همیشه دندانه ای و بی نظم خواهد بود. ستونهایی با عرض طولانی هم برای خواننده آزار دهنده است چرا که چشم در حرکت بازگشت از انتهای یک سطر به ابتدای سطر بعدی ممکن است دچار اشتباه شود.
<p>۲- <strong>لدینگ یا همان فاصله سطر </strong> هم در ستون بندی اهمیت دارد. ستونهای فشرده اگرچه به لحاظ گرافیکی منسجم و زیبا هستند اما عمل خواندن را مختل می کنند و در مقابل، فاصله سطر زیاد نیز باعث نازیبایی و خستگی چشم خواننده میشود. فاصله سطر همیشه می تواند با توجه به نوع فونت و عرض ستونها تغییر کند. بدین ترتیب که فونتهایی با دندانههای بلندتر و ستونهایی با عرض بیشتر به لدینگ بیشتری نیاز دارند.
<p>۳- <strong>همترازی </strong> هم یکی از متغییرهای پر بحث در ستون بندی است. اما به طور کوتاه و خلاصه باید گفت که بهتر است در متن فارسی از همترازی یا همان Justification استفاده نکنید. این عمل اگرچه لبه پاراگراف شما را مرتب خواهد کرد اما تنظیمات فاصله حروف را تغییر خواهد داد و در نتیجه باعث کاهش خوانایی خواهد شد. </div>
</div>
<div class="mainbox">
<div class="mainbox2negativ">(IRANSans Ultra Light)</div>
<div class="farsiparagraph"><span class="text-ultralight"> ایران سن سریف IRANSans سبکی ساده و ضخامت یکسان از قلم ایران است که با وجود حفظ ساختار قلمهای رایج ایرانی حال و هوای مدرن و امروزی دارد. سادگی شکل حروف و استفاده از حداقل شکستگی باعث شده است این تایپ فیس علاوه بر خوانا بودن زیبا و چشم نواز نیز باشد. این فونت با سبکهای طراحی کمینهگرا Minimal سازگاری خوبی دارد و همنشین مناسبی برای فونتهای سنسریف لاتین است. خانواده فونت ایران سنسریف در سال ۱۳۹۴ پرطرفدارترین فونت فارسی بوده است.</span></div>
<div class="englishparagraph"><span class="text-ultralight">
Roboto has a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves. While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types.
</span></div>
</div>
<div class="mainbox">
<div class="mainbox2negativ">(IRANSans Light)</div>
<div class="farsiparagraph"><span class="text-right">ایران سن سریف IRANSans سبکی ساده و ضخامت یکسان از قلم ایران است که با وجود حفظ ساختار قلمهای رایج ایرانی حال و هوای مدرن و امروزی دارد. سادگی شکل حروف و استفاده از حداقل شکستگی باعث شده است این تایپ فیس علاوه بر خوانا بودن زیبا و چشم نواز نیز باشد. این فونت با سبکهای طراحی کمینهگرا Minimal سازگاری خوبی دارد و همنشین مناسبی برای فونتهای سنسریف لاتین است. خانواده فونت ایران سنسریف در سال ۱۳۹۴ پرطرفدارترین فونت فارسی بوده است.</span></div>
<div class="englishparagraph"><span class="text-right">
Roboto has a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves. While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types.
</span></div>
</div>
<div class="mainbox">
<div class="mainbox2negativ">(IRANSans Regular)</div>
<div class="farsiparagraph"><span class="text-regular">ایران سن سریف IRANSans سبکی ساده و ضخامت یکسان از قلم ایران است که با وجود حفظ ساختار قلمهای رایج ایرانی حال و هوای مدرن و امروزی دارد. سادگی شکل حروف و استفاده از حداقل شکستگی باعث شده است این تایپ فیس علاوه بر خوانا بودن زیبا و چشم نواز نیز باشد. این فونت با سبکهای طراحی کمینهگرا Minimal سازگاری خوبی دارد و همنشین مناسبی برای فونتهای سنسریف لاتین است. خانواده فونت ایران سنسریف در سال ۱۳۹۴ پرطرفدارترین فونت فارسی بوده است.</span></div>
<div class="englishparagraph"><span class="text-regular">
Roboto has a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves. While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types.
</span></div>
</div>
<div class="mainbox">
<div class="mainbox2negativ">(IRANSans Medium)</div>
<div class="farsiparagraph"><span class="text-medium">ایران سن سریف IRANSans سبکی ساده و ضخامت یکسان از قلم ایران است که با وجود حفظ ساختار قلمهای رایج ایرانی حال و هوای مدرن و امروزی دارد. سادگی شکل حروف و استفاده از حداقل شکستگی باعث شده است این تایپ فیس علاوه بر خوانا بودن زیبا و چشم نواز نیز باشد. این فونت با سبکهای طراحی کمینهگرا Minimal سازگاری خوبی دارد و همنشین مناسبی برای فونتهای سنسریف لاتین است. خانواده فونت ایران سنسریف در سال ۱۳۹۴ پرطرفدارترین فونت فارسی بوده است.</span></div>
<div class="englishparagraph"><span class="text-medium">
Roboto has a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves. While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types.</span>
</div>
</div>
<div class="mainbox">
<div class="mainbox2negativ">(IRANSans Bold)</div>
<div class="farsiparagraph"><span class="text-bold">ایران سن سریف IRANSans سبکی ساده و ضخامت یکسان از قلم ایران است که با وجود حفظ ساختار قلمهای رایج ایرانی حال و هوای مدرن و امروزی دارد. سادگی شکل حروف و استفاده از حداقل شکستگی باعث شده است این تایپ فیس علاوه بر خوانا بودن زیبا و چشم نواز نیز باشد. این فونت با سبکهای طراحی کمینهگرا Minimal سازگاری خوبی دارد و همنشین مناسبی برای فونتهای سنسریف لاتین است. خانواده فونت ایران سنسریف در سال ۱۳۹۴ پرطرفدارترین فونت فارسی بوده است.</span></div>
<div class="englishparagraph"><span class="text-bold">
Roboto has a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves. While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types.</span>
</div>
</div>
<div class="mainbox">
<div class="mainbox2negativ">(IRANSans Black)</div>
<div class="farsiparagraph"><span class="text-black">ایران سن سریف IRANSans سبکی ساده و ضخامت یکسان از قلم ایران است که با وجود حفظ ساختار قلمهای رایج ایرانی حال و هوای مدرن و امروزی دارد. سادگی شکل حروف و استفاده از حداقل شکستگی باعث شده است این تایپ فیس علاوه بر خوانا بودن زیبا و چشم نواز نیز باشد. این فونت با سبکهای طراحی کمینهگرا Minimal سازگاری خوبی دارد و همنشین مناسبی برای فونتهای سنسریف لاتین است. خانواده فونت ایران سنسریف در سال ۱۳۹۴ پرطرفدارترین فونت فارسی بوده است.</span></div>
<div class="englishparagraph"><span class="text-black">
Roboto has a dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time, the font features friendly and open curves. While some grotesks distort their letterforms to force a rigid rhythm, Roboto doesn’t compromise, allowing letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types.</span>
</div>
</div>
<div class="mainbox">
<div class="titelbox">
<h1>اعداد و علائم در فونت فارسی</h1>
</div>
<div class="alphabet" style="line-height:470px"> ظ </div>
<div class="rightbox">
<p><span class="text-xlarge">اعداد فارسی: <strong>۱۲۳۴۵۶۷۸۹۰</strong></span><br>
<span class="text-xlarge">اعداد عربی: <strong>۱۲۳٤٥٦۷۸۹۰</strong></span><br>
<span class="text-xlarge">اعداد انگلیسی: <strong>1234567890</strong></span></p>
<p>برای تایپ اعداد فارسی در محیط وب از <a href="https://fa.wikipedia.org/wiki/%D9%88%DB%8C%DA%A9%DB%8C%E2%80%8C%D9%BE%D8%AF%DB%8C%D8%A7:%D9%81%D8%A7%D8%B1%D8%B3%DB%8C%E2%80%8C%D9%86%D9%88%DB%8C%D8%B3%DB%8C">کیبورد استاندارد فارسی</a> استفاده کنید. در ویندوز ۸ و یا بالاتر این کیبورد، با نام Persian(Standard)Keyboard در لیست کیبوردهای ویندوز وجود دارد. همچنین می توانید از <a href="http://persian-computing.ir/download/Iranian_Standard_Persian_Keyboard_(ISIRI_9147)_(Version_2.0).zip">این آدرس</a> آن را دانلود و نصب کنید.</p>
<span>
<p>با استفاده از کیبورد استاندارد میتوانید ممیز فارسی را تایپ کنید.<br>
<span>میانبر این علامت کلیدهای <span class="text-medium">Shift+3</span> است. به این شکل: <strong class="text-xlarge">۳٫۱۴</strong></span><br>
<span >ممیز فارسی با علامت اسلش تفاوت دارد :<strong class="text-xlarge">۳/۱۴</strong></span>
</p>
<p>با استفاده از کیبورد استاندارد میتوانید جداکننده هزارگان فارسی را تایپ کنید.<br>
<span>میانبر این علامت کلیدهای <strong>Shift+2</strong> است. به این شکل: <strong class="text-xlarge">۹٬۲۱۰٬۰۰۰</strong></span><br>
<span >این علامت با جدا کننده هزارگان انگلیسی تفاوت دارد : <strong class="text-xlarge">۹,۲۱۰,۰۰۰</strong></span>
</p>
</div>
</div>
<div class="mainbox">
<div class="titelbox">
<h1> نسبتهای طلایی</h1>
</div>
<div class="alphabet2">
<div style="padding-left:20px">
۳٫۷۷۷ &divide; ۱٫۶۱۸ = <span class="text-regular text-underline">۲٫۳۳۵</span>
<br>
۶٫۱۱۲ &divide; ۱٫۶۱۸ = <span class="text-regular text-underline">۳٫۷۷۷</span>
<br>
۹٫۸۸۹ &divide; ۱٫۶۱۸ = <span class="text-regular text-underline">۶٫۱۱۲</span>
<br>
۱۶ &divide; ۱٫۶۱۸ = <span class="text-regular text-underline">۹٫۸۸۹</span>
<br>
.......................................
<br>
۱۶ &times; ۱٫۶۱۸ = <span class="text-regular text-underline">۲۵٫۸۸۸</span>
<br>
۲۵٫۸۸۸ &times; ۱٫۶۱۸ = <span class="text-regular text-underline">۴۱٫۸۸۷</span>
<br>
۴۱٫۸۸۷ &times; ۱٫۶۱۸ = <span class="text-regular text-underline">۶۷٫۷۷۳</span>
<br>
۶۷٫۷۷۳ &times; ۱٫۶۱۸ = <span class="text-regular text-underline">۱۰۹٫۶۵۶</span>
</div>
</div>
<div class="rightbox">
<p>اهمیت اندازه فونت در خوانایی و زیبا شدن صفحه وب سایت بر کسی پوشیده نیست. در کنار این بحث، موارد دیگری مانند ارتفاع خطوط، فاصله ها، ابعاد قسمت های مختلف و ... نیز در بحث تایپوگرافی اهمیت زیادی دارند.</p>
<p>برای محاسبه این اعداد می توانیم از سری اعداد متناسب (Modular Scale) استفاده کنیم. در حقیقت از تعدادی عدد پشت سر هم که بر اساس مضرب خاصی تشکیل شده اند برای تنظیمات ارتفاع خط، فاصله ها، ابعاد و ... استفاده می کنیم. نسبت (عدد) طلایی همان مضرب اعداد است.</p>
<p>به عنوان مثال می خواهیم از سایز 16px <strong>فونت ایران سن سریف</strong> به عنوان فونت و سایز اصلی متن صفحات استفاده کنیم. عدد فی (phi) یونانی که معادل ۱٫۶۱۸۰۳۳۹۸۸۷ (به اختصار ۱٫۶۱۸) است را به عنوان نسبت طلایی در نظر می گیریم. بنابراین سری اعدادی به شکل روبرو خواهیم داشت:</p>
<p>
به کمک این اعداد و استفاده از آن ها در صفحات وب سایت خود می توانیم خوانایی و زیبایی آن را افزایش دهیم. علاوه بر آن، اگر از واحدهای نسبی مانند em استفاده شود، امکانات بیشتری در اختیار طراح و بازدیدکننده خواهد بود. البته <strong>سری اعداد بر مبنای نسبت طلایی</strong> فقط در تایپوگرافی وب سایت کاربرد ندارد.
این اعداد می تواند ادامه داشته باشد (<span class="text-regular text-underline">۱٬۲۱۵٫۹۸۱</span> ، <span class="text-regular text-underline">۱٬۹۶۷٫۴۵۷</span> ، <span class="text-regular text-underline">۳٬۱۸۳٫۳۴۵</span> و ...).
</p>
</div>
</div>
<div class="mainbox">
<div class="titelbox"><h1>خوانایی لینکها</h1> </div>
<div class="alphabet" style="line-height:470px"> غ </div>
<div class="rightbox">
<p>شاید بتوانیم از لینک ها (hyperlinks) به عنوان مهم ترین بخش وب سایت ها در ارتباط با سئو (SEO) و نیز یکی از پرکاربردترین اجزای وب سایت نام ببریم. بنابراین بازدیدکننده باید بتواند به راحتی آن ها را از سایر محتوای صفحه تشخیص داده و متن لینک شده را به سرعت و بدون مزاحمت مشاهده کند.</p>
<p>به صورت پیش فرض، متن هایی که داخل یک هایپرلینک قرار می گیرند، زیر خط دار یا underline می شوند (مانند این <a href="http://fontiran.com" target="_blank">لینک یا پیوند به صفحه اصلی فونت ایران</a>). در بسیاری از فونت های فارسی، این خط روی متن و نقطه ها قرار می گیرد (مانند این <a href="http://fontiran.com" target="_blank" style="font-family: Tahoma;">لینک یا پیوند به صفحه اصلی فونت ایران با فونت تاهوما</a>).</p>
<p>در صورت بروز این مشکل، یا باید خط زیرین تمام تگ های «a» غیر فعال شود و یا با ترفندهایی به شکل دیگر ایجاد شود (مانند قرار دادن border-bottom برای تگ های «a»).</p>
<p>همچنین پیشنهاد می کنیم از قراردادن افکت ها و transition های آزاردهنده روی لینک ها پرهیز کرده و برای راحتی کاربر از padding و color با کانتراست مناسب نسبت به زمینه استفاده کنید.</p>
</div>
</div>
<div class="mainbox">
<div class="rightbox">
<br>
در این فایل سعی کردیم همراه با یک مطلب آموزشی کوتاه، نحوه استفاده از خانواده فونت ایران سن سریف و پیش نمایشی از قسمت های مختلف آن را مرور کنیم.
<br>
برای مشاهده راهنمای نحوه قراردادن فونت ها در وب سایت خود، به <a href="http://fontiran.com/?p=874" target="_blank">این آدرس</a> مراجعه کنید.
<br>
<br>
</div>
<div class="alphabet" style="line-height:60px">ء</div>
</div>
<br>
<div class="footer">
Copyright (c) 2015 by <a href="http://fontiran.com">www.fontiran.com</a> (Moslem Ebrahimi). All rights reserved.
<br>
To use this font, it is necessary to obtain the license from www.fontiran.com
</div>
</div>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 109 KiB

@ -0,0 +1,84 @@
/**
*
* Name: IRAN Sans-Serif Font
* Version: 5.0
* Author: Moslem Ebrahimi (moslemebrahimi.com)
* Created on: Dec 25, 2012
* Updated on: Sep 01, 2017
* Website: http://fontiran.com
* Copyright: Commercial/Proprietary Software
--------------------------------------------------------------------------------------
فونت های ایران سن سریف یک نرم افزار مالکیتی محسوب می شود. جهت آگاهی از قوانین استفاده از این فونت ها لطفا به وب سایت (فونت ایران دات کام) مراجعه نمایید
--------------------------------------------------------------------------------------
IRAN Sans-serif fonts are considered a proprietary software. To gain information about the laws regarding the use of these fonts, please visit www.fontiran.com
--------------------------------------------------------------------------------------
This set of fonts are used in this project under the license: (.....)
--------------------------------------------------------------------------------------
*
**/
@font-face {
font-family: IRANSans;
font-style: normal;
font-weight: 900;
src: url('../fonts/eot/IRANSansWeb(NoEn)_Black.eot');
src: url('../fonts/eot/IRANSansWeb(NoEn)_Black.eot?#iefix') format('embedded-opentype'),
/* IE6-8 */ url('../fonts/woff2/IRANSansWeb(NoEn)_Black.woff2') format('woff2'),
/* FF39+,Chrome36+, Opera24+*/ url('../fonts/woff/IRANSansWeb(NoEn)_Black.woff') format('woff'),
/* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('../fonts/ttf/IRANSansWeb(NoEn)_Black.ttf')
format('truetype');
}
@font-face {
font-family: IRANSans;
font-style: normal;
font-weight: bold;
src: url('../fonts/eot/IRANSansWeb(NoEn)_Bold.eot');
src: url('../fonts/eot/IRANSansWeb(NoEn)_Bold.eot?#iefix') format('embedded-opentype'),
/* IE6-8 */ url('../fonts/woff2/IRANSansWeb(NoEn)_Bold.woff2') format('woff2'),
/* FF39+,Chrome36+, Opera24+*/ url('../fonts/woff/IRANSansWeb(NoEn)_Bold.woff') format('woff'),
/* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('../fonts/ttf/IRANSansWeb(NoEn)_Bold.ttf')
format('truetype');
}
@font-face {
font-family: IRANSans;
font-style: normal;
font-weight: 500;
src: url('../fonts/eot/IRANSansWeb(NoEn)_Medium.eot');
src: url('../fonts/eot/IRANSansWeb(NoEn)_Medium.eot?#iefix') format('embedded-opentype'),
/* IE6-8 */ url('../fonts/woff2/IRANSansWeb(NoEn)_Medium.woff2') format('woff2'),
/* FF39+,Chrome36+, Opera24+*/ url('../fonts/woff/IRANSansWeb(NoEn)_Medium.woff') format('woff'),
/* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('../fonts/ttf/IRANSansWeb(NoEn)_Medium.ttf')
format('truetype');
}
@font-face {
font-family: IRANSans;
font-style: normal;
font-weight: 300;
src: url('../fonts/eot/IRANSansWeb(NoEn)_Light.eot');
src: url('../fonts/eot/IRANSansWeb(NoEn)_Light.eot?#iefix') format('embedded-opentype'),
/* IE6-8 */ url('../fonts/woff2/IRANSansWeb(NoEn)_Light.woff2') format('woff2'),
/* FF39+,Chrome36+, Opera24+*/ url('../fonts/woff/IRANSansWeb(NoEn)_Light.woff') format('woff'),
/* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('../fonts/ttf/IRANSansWeb(NoEn)_Light.ttf')
format('truetype');
}
@font-face {
font-family: IRANSans;
font-style: normal;
font-weight: 200;
src: url('../fonts/eot/IRANSansWeb(NoEn)_UltraLight.eot');
src: url('../fonts/eot/IRANSansWeb(NoEn)_UltraLight.eot?#iefix') format('embedded-opentype'),
/* IE6-8 */ url('../fonts/woff2/IRANSansWeb(NoEn)_UltraLight.woff2') format('woff2'),
/* FF39+,Chrome36+, Opera24+*/ url('../fonts/woff/IRANSansWeb(NoEn)_UltraLight.woff')
format('woff'),
/* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('../fonts/ttf/IRANSansWeb(NoEn)_UltraLight.ttf')
format('truetype');
}
@font-face {
font-family: IRANSans;
font-style: normal;
font-weight: normal;
src: url('../fonts/eot/IRANSansWeb(NoEn).eot');
src: url('../fonts/eot/IRANSansWeb(NoEn).eot?#iefix') format('embedded-opentype'),
/* IE6-8 */ url('../fonts/woff2/IRANSansWeb(NoEn).woff2') format('woff2'),
/* FF39+,Chrome36+, Opera24+*/ url('../fonts/woff/IRANSansWeb(NoEn).woff') format('woff'),
/* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('../fonts/ttf/IRANSansWeb(NoEn).ttf') format('truetype');
}

@ -0,0 +1,191 @@
@import url(fontiran.css); /* لینک فایلی که وظیفه بارگذاری فونت ها را برعهده دارد */
body {
font-family: IRANSans, Roboto, Arial !important;
font-weight: 300;
direction: rtl;
background-color: #e2e2e2;
margin: 0;
}
h1,
h2,
h3,
h4,
h5,
h6,
input,
textarea {
font-family: IRANSans, Roboto, Arial !important;
}
h1 {
font-weight: bold;
}
.wrapper {
max-width: 900px;
margin: 0 auto;
}
.ltr {
direction: ltr;
}
.text-right {
text-align: right;
}
.text-center {
text-align: center;
}
.text-left {
text-align: left;
}
.text-small {
font-size: 0.8em;
}
.text-xsmall {
font-size: 0.6em;
}
.text-large {
font-size: 1.2em;
}
.text-xlarge {
font-size: 1.4em;
}
.text-underline {
text-decoration: underline;
}
.text-ultralight {
font-weight: 200;
}
.text-light {
font-weight: 300;
}
.text-regular {
font-weight: normal;
}
.text-medium {
font-weight: 500;
}
.text-bold {
font-weight: bold;
}
.text-black {
font-weight: 900;
}
blockquote {
font-weight: 500;
padding: 10px;
border: 1px dashed #666666;
}
.mainbox {
width: 100%;
background-color: #efefef;
display: table;
margin-bottom: 30px;
border-right: 8px solid #ffff33;
}
.mainboxnegativ {
width: 100%;
background-color: #000000;
display: table;
margin-bottom: 30px;
border-right: 8px solid #ffff33;
color: #f9f9f9;
}
.mainbox2 {
font-size: 1em;
width: 90%;
padding-right: 20px;
padding-top: 10px;
padding-bottom: 10px;
}
.mainbox3 {
width: 100%;
background-color: #b8b8b8;
display: table;
margin-bottom: 30px;
border-right: 8px solid #bd70ff;
}
.mainbox2negativ {
font-size: 1em;
color: #f9f9f9;
background-color: #000000;
padding-right: 20px;
}
.farsiparagraph {
font-size: 1em;
width: 47%;
float: right;
padding-right: 20px;
padding-top: 10px;
padding-bottom: 10px;
}
.englishparagraph {
font-size: 1em;
width: 47%;
float: left;
direction: ltr;
padding-left: 20px;
padding-top: 10px;
padding-bottom: 10px;
}
.rightbox {
width: 60%;
padding-right: 20px;
padding-left: 5px;
float: right;
margin-left: 10px;
margin-bottom: 0px;
min-width: 0px;
background-color: #f7f7f7;
}
.titelbox {
width: 60%;
padding-right: 25px;
padding-left: 0px;
float: right;
margin-left: 10px;
margin-bottom: 0px;
min-width: 0px;
background-color: #f2f2f2;
color: #4b4b4b;
}
.lefttbox {
padding-right: 20px;
padding-left: 4px;
float: right;
margin-bottom: 10px;
min-width: 0px;
}
.alphabet {
width: 35%;
float: left;
font-size: 21em;
text-align: center;
font-weight: 500;
color: #999999;
}
.alphabet2 {
width: 35%;
float: left;
direction: ltr;
font-size: 1.6em;
text-align: left;
font-weight: 500;
color: #333333;
margin-top: 100px;
}
.footer {
font-weight: 300;
font-size: 0.7em;
text-align: center;
direction: ltr;
margin-bottom: 0px;
padding-bottom: 0px;
}

Some files were not shown because too many files have changed in this diff Show More

Loading…
Cancel
Save