شما یک سایت طراحی میکنید و خیلی هم هیجان زده اید. چندین ساعت وقت میذارید برای کوچک ترین جزئیات (مثلا پیدا کردن بهترین فونت و مناسب ترین پلت رنگ، یک آیکون رو 2 پیکسل جابه جا میکنید تا با متن هم سطر شه و...)

ولی وقتی کار طراحی قالب تموم میشه بازم  اون حس و فیدبک خوب رو نمیگیرید،  همه چیز با طرح فتوشاپ مطابقت داره ولی انگار یه چیزی این وسط کمه ... 

چیزی که در قالب فتوشاپ نیست، انیمیشن ها و Transition ها هستند و استفاده از اونها کلی تاثیر روی طرح نهایی داره.

در این مقاله 6 تا ترفند ساده برای جذاب تر شدن سایت را بیان میکنیم.

 

Hover Transitions بر روی دکمه ها و لینک ها

ساده ترین کاری که میتونید بکنید این هست که به دکمه ها و لینک های سایتتان انیمیشن و ترانزیشن اضافه کنید. و هزاران راه برای ساختنش وجود داره، اما صادقانه بگم که حتی اضافه کردن یک transition ساده برای تغییر opacity هم تاثیر مثبت خیلی زیادی داره.

 

استفاده از fades یا slides به جای show/hide

وقتی دارید از jQuery استفاده میکنید به جای show/hide کردن یک المان از slide  یا fade استفاده کنید. منظورم به طور کل این هست که وقتی مثلا یک modal رو میبندید، یک دفعه محو نشه و یک انیمیشنی داشته باشه.

 

The Font Flash

شاید اتفاق افتاده باشه که وقتی برای اولین بار یک سایت را باز میکنید، در 2 ثانیه اول، فونت های پیش فرض مثل arial را ببینید. این به این خاطر رخ میده چون اول متن (text) در صفحه بارگذاری میشود و بعد از آن جاوا اسکریپت میاد و فونت ها را لود میکند. این چیزی نیست که این روز ها رخ بده ولی اگر همچین مشکلی دارید اینجا یک راه حل ساده برای این کار است.

به طور ساده بگم که شما صفحه را بارگذاری میکنید ولی متن آنرا مخفی (hidden) میکنید و زمانی متن را نمایش میدهید که فونت بارگذاری شده باشد.

 

Page Loaders

اگر شما یک وب سایت سنگین پر از تصویر داشته باشید و سرعت  اینترنت  کاربر هم کم باشد. زمان بارگذاری صفحه میتونه طولانی بشه و کاربر هم داره در این مدت سر و کله زدن صفحه برای بارگذاری تصاویر، فونت ها و ویدیو ها را تماشا میکنه و این ممکن است خسته کننده باشد. پس چرا نیاییم زمان بارگذاری رو به یک تجربه ی fun تبدیل کنیم؟ شما میتونید یک انیمیشن جالب بسازید و به عنوان page loader از آن استفاده کنید.

 

 

فرم ها

حالا داریم به قسمت جالب ماجرا میرسیم. فرم ها یکی از بخش های تاثیرگذار سایت هستند و ساخت فرم خوب یک مقدار کار داره ولی به زحمتش می ارزه. به شخصه من خودم اگر فرم یک سایت خیلی مزخرف باشه حتی ثبت  نام هم نمیکنم، چه برسه اگه فرم گزارش باگ و... باشه.اینجا چند نمونه ازایده های  جذاب رو گذاشته که میتونید ازش ایده بگیرید.

 

Page Transition

قطعا یکی از باحال ترین ترفند ها، استفاده از AJAX page transiton هستش. خیلی اعصاب خورد کن هست که برای رفتن به هر قسمت از سایت، صفحه دوباره بارگذاری شه. برای جلوگیری از این کار از AJAX استفاده میکنند تا کاربر بتونه به راحتی و بدون بارگذاری مجدد صفحه بین بخش های سایت جا به جا شه.

 

منبع

تا کنون 0 نظر به ثبت رسیده است

برای ثبت نظر باید وارد حساب کاربری خود شوید. اگر تا کنون ثبت نام نکردید اینجا کلیک کنید