برگزیده های پرشین تولز

متن ها و محتویات صفحات وب سایتتان را حرفه ای انتخاب کنید

academyIT

کاربر تازه وارد
تاریخ عضویت
12 اکتبر 2015
نوشته‌ها
63
لایک‌ها
14
سن
38
یکی از مسائلی که در زمینه کاربر پسند بودن وب سایت بسیار مهم است و باعث میشود کاربران بیشتر در وب سایت شما بماند استفاده صحیح از تایپوگرافی و فونت است که در این فایل قصد داشتیم تمام موارد مورد نیاز را به اشاره کنیم تا رعایت این اصول بتواند بهترین کمک را به شما دوستان عزیز بکند .
همونطور که شما هم میدونید بیشتر محتویات صفحات وب سایت ها متن و نوشته است ، این نوشته ها رو مینویسیم تا کاربرای سایتمون اونا رو بخونن و برای اینکه کمک کنیم تا این اتفاق راحت تر بیفته یه سری نکات رو باید رعایت کنیم .

سعی کردم تمام نکات مورد نیاز رو اینجا بیارم تا با رعایت کردن این نکات فضای مطلوب تری رو از لحاظ نوشتاری برای کاربراتون ایجاد کنید و کارایی کلی وبسایتتان را ارتقا بدید :
معمولا وقتی یاد میگیریم فونت ها رو داخل صفحه وب سایتمون اضافه کنیم سعی میکنیم تعداد زیادی از این فونت ها رو استفاده کنیم ، این کار درست نیست شما بایدحداکثر از 2 تا فونت یکی برای تیتر ها و یکی برای نوشته ها طولانی تر استفاده کنید. شاید شما ندونی که چطور میتونی فونت به صفحه وب سایتت اضافه کنی ، مشکلی نیست همین حالا یادش بگیر :

اول لازم داری که یک پکیج استاندارد فونت فارسی داشته باشی که میتونی از این آدرس اونو دانلود کنی : http://webfont.academy-it.ir/fonts.zip
مرحله دوم اینه که پوشه فونت رو extract کنی و اونو داخل فولدر اصلی سایتت قرار بدی مثلا توی این آدرس : css/fonts
حالا لازمه که توی فایل CSS این دستور رو بنویسی :

@font-face{
font-family: 'yekan';
src: url(fonts/Yekan.eot);
src:url(fonts/Yekan.eot?#iefix) ormat("embedded-opentype"), url(fonts/Yekan.woff) format("woff"), url(fonts/Yekan.ttf) format("truetype"), url(fonts/Yekan.svg#BYekan) format("svg");
font-weight: normal;
font-style: normal
{



توی خط اول یه اسم برای فونتمون در نظر گرفتیم که کاملا اختیاریه ، خط های بعدی هم آدرس ورژن های مختلف فایل فونت رو میدیم که توی پوشه CSS کپی کردیم ، توی خط های بعدی هم کنترل میکنیم که به صورت پیشفرض هیچ استایل خاصی نداشته باشه .
مرحله بعدی مربوط به فراخونی هست که هرجا خواستیم از این فونت استفاده کنیم باید به روش زیر عمل کنیم : مثلا میخواهیم برای همه تگ های p فونت رو فراخوانی کنیم :p{ font-family: 'yekan';}

برای متن های نسبتا طولانی به جای فونت‌های زائده‌دار (serif) از فونت‌های بدون زائده (sans serif) استفاده کنید جون زمانی که این فونت ها (serif) در ابعاد ریز زائده هایی که دارن باعث میشه خیلی خوانا نباشن ، مثلا همین فونت یکان که ما استفاده کردیم یه فونت (sans serif) هستش که برای نوشته های طولانی فونت بسیار کارآمدیه و در مقابل فونت هایی مثل Kourosh و TitrTGEBoldفونت هایی هستن که برای تیتر ها مناسب تر هستن .
از فونت‌های پر کاربرد که چشم کاربران بیشتر بهش عادت داره استفاده کنید چرا که راحت تر میتونن نوشته های وب سایت شما رو بخونن .
برای نوشته ها و تیتر های وب سایت مطمئن بشید که از سایز مناسبی استفاده کردید که هم خوانا باشه و هم خیلی بزرگ نباشه .• سعی کنید به صورت مناسب از کاراکتر فاصله استفاده کنید که نه متن شما خیلی متراکم به نظر برسه و نه اینکه خیلی فاصله زیادی بین کلمات شما باشه (منظورم خصوصیت word-spacingدر CSS هست)
• استفاده از رنگ‌های متنوع برای نوشته ها باعث میشه کاربر موقع خواندن مطلب ما خسته بشه ، البته این نکته در رابطه با bold کردن بیش از حد کلمات هم صدق میکنه و باعث میشه کاربر خیلی تمایلی به خوندن این جور متن ها نداشته باشه .

• برای نوشته ها و یا حتی بعضی از کلمات از رنگ آبی استفاده نکنید: رنگ آبی در وب سایت رنگ استاندارد لینک هست و همین کاربر رو به اشتباه میندازه که این کلمه آبی حتما لینک بوده و حالا سایت شما خرابه که هرچی روش کلیک میکنه به مقصد نمیرسه !!!
• برای پس‌زمینه از طیف رنگ یا همون گرادینت و یا تصاویر استفاده نکنید این کار باعث میشه بک گراند روی چشم کاربری که در حال مطالعه مطلب ماست تاثیر بذاره و اونو خسته کنه .
وقتی از اعداد استفاده میکنید که تعداد رقم اونا زیاده حتما از جداکننده های سخ رقمی استفاده کنید این کار باعث خوانا تر شدن رقم مورد نظر ما میشه : 25487925 یا 25.487.925 شما کدوم رو ترجیح میدی ؟
• از متن‌های متحرک یا چشمک زن استفاده نکنید : درسته که این تکنیک ها یه روزی باعث میشد وب سایت ها پویا تر به نظر برسن ولی دیگه از زمان استفاده اونها خیلی میگذره ولی متاسفانه هنوز هم توی بعضی از وب سایت ها این نوع متن ها رو میبینیم که نه تنها باعث نمیشه وب سایت ما جلوه بیشتری داشته باشه بلکه باعث میشه وب سایت ما ضعیف و قدیمی جلوه کنه !

لیست کامل فونت های استاندارد برای وب
 
بالا