/ آموزش کامل روش های مختلف قرار دادن انواع فونت در صفحه وب به همراه آموزش cufon
وندا هاست
طراحی و راه اندازی وبسایت و انجمن توسط ویکی وی بی ویکی وی بی در قبال معاملات صورت گرفته با هر یک از اعضا و سفارشات طراحی خارج از این اطلاعیه هیچگونه مسئولیتی نمی پذیرد
بک لینک ها
تبلیغات شما وندا هاست
صفحه 2 از 2 نخستنخست 12
نمایش نتایج: از 11 به 17 از 17

مقاله: آموزش کامل روش های مختلف قرار دادن انواع فونت در صفحه وب به همراه آموزش cufon

    1. آموزش کامل روش های مختلف قرار دادن انواع فونت در صفحه وب به همراه آموزش cufon

      آموزش کامل روش های مختلف قرار دادن انواع فونت در صفحه وب به همراه آموزش cufon

      درود

      قبل از اینکه آموزش رو شروع کنم، لازم دونستم یک سری توضیحات رو خدمت دوستان عزیزم عرض کنم.

      تا این لحظه آموزش های زیادی در نت برای افزودن فونت به صفحه وب وجود دارد و ارسال شده است، اما این آموزش کامل ترین و جامع ترین آموزش می باشد. آموزش سعی شده در عین کامل بودن با زبانی ساده و گویا، داده شود.

      این آموزش اختصاصی ویکی وی بی می باشد، و تمامی حقوق برای این نویسنده و این سایت محفوظ می باشد.

      در این پست تمامی روش های رایجی که تا اکنون برای افزودن فونت به صفحه وب وجود دارد بیان و توضیحاتی در مورد آنها داده می شود. و در پست های بعد آموزش هرکدام قرار خواهد گرفت

      بریم سراغ آموزش.

      تا اکنون 4 روش رایج زیر برای افزودن فونت به صفحه وب وجود دارد:
      1. استفاده از عکس (جایگزین کردن متن با تصویر)
      2. استفاده از sIFR
      3. استفاده از CSS3
      4. استفاده از cufon


      1- استفاده از عکس (جایگزین کردن متن با تصویر)
      می شود گفت که اولین روش، استفاده از جایگزین کردن متن با تصویر بود. روش کار بدین صورت است که با استفاده از نرم افزارهای طراحی و گرافیکی نظیر Photoshop ، CorelDRAW و ... متن مورد نظر را با نوع فونت و سایز فونت و رنگ فونت نوشته و به تصویر تبدیل نمود و به طرح و صفحه مورد نظر خود اضافه کرد.
      از عیب مهم و اساسی این روش می توان به این اشاره کرد که باعث بالا رفتن تصاویر در صفحه وب می شود و در نهایت با افزایش تصاویر، حجم صفحه مورد نظر افزایش پیدا می کند، و باعث لود سنگین صفحه می شود.

      2- استفاده از sIFR
      روش بعدی استفاده از sIFR می باشد. روش کار بدین صورت است که با استفاده از ابزاری خاص، فونت مورد نظر را به فایل فلش تبدیل و فایل جاوا اسکریپتی را به صفحه خود اضافه می کنند.
      حال سوال این است که وظیفه این فایل جاوا اسکریپت چیست؟
      این فایل جاوا اسکریپت موظف است که در هرکجا از صفحه، که فونت مورد نظر وجود دارد، متن و نوشته آن قسمت را مخفی می کند و بجای آن فایل فلش مورد نظر را قرار می دهد که همان متن را با فونتی که در نظر گرفتید نمایش می دهد. این روش قابلیت scale (متناسب) شدن را نیز دارا است.
      اما عیوب این روش چیست؟
      از مهم ترین عیوب این روش می توان به موارد زیر اشاره کرد :
      1. عدم توانایی در نشان دادن زبان فارسی
      2. لود سنگین صفحه
      3. کاربر حتماً باید فلش و جاوا اسکریپت را بر روی مرورگرش نصب و فعال داشته باشد.


      استفاده از این روش امروزه در حد صفر است

      3- استفاده از CSS3

      با آمدن CSS3 و مرورگرهای جدید کروم، فایرفکس، اپرا، سافری ، استفاده از قابلیت CSS3 و در نتیجه آن @font-face اوج گرفت. با استفاده از این روش می توان هر فونتی را به صفحه وب خود بیافزایید. روش کار نیز بدین صورت است که اگر فونت مورد نظر در سیستم کاربر یافت نشود، فونت را از سرور دریافت می کند و بر روی سیستم کاربر قرار می دهد. این روش یک عیب مهم نیز دارد و آن این است که بعضی از فونت های فارسی نظیر BYekan با محدودیت سایز مواجه هستند.


      4- استفاده از cufon

      روش دیگری که برای افزودن فونت به صفحه وب وجود دارد، استفاده از cufon هست. روش کار نیز بدین صورت است که فونت مورد نظر را با استفاده از ابزاری خاص، به فایل جاوا اسکریپت تبدیل می کنند و در صفحه وب این فایل را قرار می دهید.البته این کار باعث لود سنگین(کند لود شدن) صفحه می شود. این روش فونت فارسی را پشتیبانی نمی کرد اما فردی ایرانی بنام آقای مرتضی فقیه شجاعی با استفاده از نرم افزاری به نام Bifun این مشکل را حل نمود.
      استفاده از این روش دارای معایب مهم و اساسی زیر می باشد:


      • بارگذاری سنگین سایت- که در صورت استفاده از هاست نامناسب، این مورد به وضوح قابل مشاهده هست.
      • اسکرول افقی گرفتن صفحه
      • در دستگاه های آندرویدی و آیفون، سایت پس از بارگذاری کامل محو می گردد (که آموزش حل این مشکل در ادامه داده خواهد شد)
      • cufon زمانی اجرا می شود که سایت شما کامل لود شود. پس تا زمانی که سایت کامل لود شود، سایت شما با ظاهری نامناسب نمایش داده می گردد.
      • عدم رعایت line-height ها.
      • عدم ساپورت از shift + j در cufon. (در صورتی که در متن های خود از shift+j استفاده کرده باشید، کلمات مربوطه در cufon به صورت جدا نمایش داده خواهند شد)
      • تغییر اعداد در cufon


      موارد ذکر شده بالا از مهمترین معایب استفاده از cufon برای فونت های فارسی می باشد.


      تا اینجا توضیحات روش های موجود افزودن فونت به صفحه وب را مطالعه کردید. از پست بعد روش های رایج را آموزش خواهم داد.

      موفق باشید.


      ادامه دارد...
      ویرایش توسط ALIREZA_2010 : 12-13-2014 در ساعت 11:19 PM
      چنانچه این مطلب مورد پسند شما واقع شده بر روی کلیک کنید .

      12 نفر از اعضا پست ALIREZA_2010 را پسندیده اند


  1. #11
    S0h3!L آنلاین نیست.
    S0h3!L
    مدير ارشد
    1,585نوشته4,899مورد پسند

    تاریخ عضویت
    Oct 2012
    شماره عضویت
    3
    پسندیده است
    4,062 پست
    بلاگ
    0 پست
    میزان امتیاز
    4885
    www.ubuntuforums.ir
    دلیلش مایکروسافت ویندوز هستمرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی
    توی گنو/لینوکس و مک و بی اس دی اصلا اینطور نیست.
    نمونه:

    5 نفر از اعضا پست S0h3!L را پسندیده اند


    مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

  2. #12
    WikiVB آنلاین نیست.
    WikiVB
    مديريت کل انجمن
    5,839نوشته26,610مورد پسند

    تاریخ عضویت
    Oct 2012
    شماره عضویت
    1
    پسندیده است
    8,003 پست
    بلاگ
    0 پست
    میزان امتیاز
    26487
    wikivb.ir
    ممنون علی جان جامع ترین آموزش فارسی بود که دیدم مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

    2 نفر از اعضا پست WikiVB را پسندیده اند


    مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

  3. #13
    mdark آنلاین نیست.
    mdark
    کاربر سايت
    191نوشته12مورد پسند

    تاریخ عضویت
    Sep 2013
    شماره عضویت
    3062
    پسندیده است
    62 پست
    بلاگ
    پست
    میزان امتیاز
    22
    No Set
    آموزش قرار دادن فونت به صفحه وب با استفاده از @font-face

    این مورد رو کمی توضیح میدید؟ برای مثال من میخوام کلا به جای cufon از این روش استفاده کنم

    کافیه با استفاده از @font-face فونت بی یکان رو به ادیشینال اضافه کنم و در سی اس اس کلاس ها (مثلا ناوبار) فونت بی یکان رو اضافه کردم

    اینجوری فونت حتی در صورت موجود نبودن در سیستم کاربر نمایش داده میشه؟

  4. #14
    Am!rH0ssein آنلاین نیست.
    Am!rH0ssein
    کاربر فعال و مفيد
    576نوشته605مورد پسند

    تاریخ عضویت
    Apr 2013
    شماره عضویت
    1583
    پسندیده است
    444 پست
    بلاگ
    پست
    میزان امتیاز
    615
    No Set
    نقل قول نوشته اصلی توسط mdark نمایش پست ها
    آموزش قرار دادن فونت به صفحه وب با استفاده از @font-face

    این مورد رو کمی توضیح میدید؟ برای مثال من میخوام کلا به جای cufon از این روش استفاده کنم

    کافیه با استفاده از @font-face فونت بی یکان رو به ادیشینال اضافه کنم و در سی اس اس کلاس ها (مثلا ناوبار) فونت بی یکان رو اضافه کردم

    اینجوری فونت حتی در صورت موجود نبودن در سیستم کاربر نمایش داده میشه؟
    بله دوست عزیز
    البته باید به صورت صحیح هر سه فرمت woff,tff,eot پیوست بشند تا در مرورگر ها و ورژن های مختلف مشکلی پیش نیاد

    کاربر زیر پست Am!rH0ssein را پسندیده است:



  5. #15
    mdark آنلاین نیست.
    mdark
    کاربر سايت
    191نوشته12مورد پسند

    تاریخ عضویت
    Sep 2013
    شماره عضویت
    3062
    پسندیده است
    62 پست
    بلاگ
    پست
    میزان امتیاز
    22
    No Set
    نقل قول نوشته اصلی توسط Am!rH0ssein نمایش پست ها
    بله دوست عزیز
    البته باید به صورت صحیح هر سه فرمت woff,tff,eot پیوست بشند تا در مرورگر ها و ورژن های مختلف مشکلی پیش نیاد
    منظور از پیوست همون اپلود در هاسته یا چیزه دیگه ایی هست دوست عزیز

  6. #16
    mdark آنلاین نیست.
    mdark
    کاربر سايت
    191نوشته12مورد پسند

    تاریخ عضویت
    Sep 2013
    شماره عضویت
    3062
    پسندیده است
    62 پست
    بلاگ
    پست
    میزان امتیاز
    22
    No Set
    اپ........

  7. #17
    mdark آنلاین نیست.
    mdark
    کاربر سايت
    191نوشته12مورد پسند

    تاریخ عضویت
    Sep 2013
    شماره عضویت
    3062
    پسندیده است
    62 پست
    بلاگ
    پست
    میزان امتیاز
    22
    No Set
    اپ........

صفحه 2 از 2 نخستنخست 12

اطلاعات موضوع

کاربرانی که در حال مشاهده این موضوع هستند

در حال حاضر 1 کاربر در حال مشاهده این موضوع است. (0 کاربران و 1 مهمان ها)

کلمات کلیدی این موضوع

مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی مجوز های ارسال و ویرایش

  • شما نمیتوانید موضوع جدیدی ارسال کنید
  • شما امکان ارسال پاسخ را ندارید
  • شما نمیتوانید فایل پیوست کنید.
  • شما نمیتوانید پست های خود را ویرایش کنید
  •  
خرید بک لینک
مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی