فرصتی برای دگرگونی وب سایت شما!

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

سادگی در طراحی

در طی سال های اخیر، هزینه ی بسیار زیادی به منظور ساخت وب سایت های جذاب صرف شده است. هم اکنون این گرایش به سمت یک طراحی ساده رفته است که تجربه ی کار با آن برای کاربر بهینه و مطلوب باشد. وب سایت های ساده و سبک نه تنها راحت تر قابل استفاده هستند، بلکه سریع تر نیز بارگذاری می شوند و از محتوای چندرسانه ای ادغام شده بهتر پشتیبانی می کنند. پیشرفت های حاصله در HTML5 و CSS3 ارائه ی طرح های جذاب و نیز کاربردی را آسان تر از همیشه نموده اند.

طراحی واکنش گرا

شرکت Mashable سال ۲۰۱۳ را به عنوان سال طراحی های واکنش گرا اعلام نمود و همچنین پیش بینی کرد تمایل به طراحی وب به صورت واکنش گرا تا اواخر سال نیز ادامه خواهد یافت. در طراحی وب به شکل واکنش گرا از امکانات HTML در جهت “انعطاف پذیر” کردن وب سایت ها و قادر ساختن آن ها به تطبیق در دستگاه های مختلف استفاده می گردد. طراحی واکنش گرا به علت ایجاد تغییرات چشمگیری در عادات استفاده از وب محبوبیت یافت. تحلیلگری به نام مری میکر، یکی از شرکای کمپانی سرمایه گذاری KCPB، پیش تر در سال جاری پیش بینی کرده بود که استفاده از اینترنت همراه تا سال ۲۰۱۴ از اینترنت سیستم های خانگی پیشی خواهد گرفت. در این دوره از اینترنت همراه، طراحان وب چابک بیشتر از همیشه از طراحی واکنش گرا بهره می برند.

 

رابط های برنامه مانند

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

 

شفافیت صفحه

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

طراحان وب به منظور سازگارتر کردن وب سایت ها با هر گونه دستگاهی، به جای استفاده از فلش که چندان انعطاف پذیر نیست، به طور فزاینده ای در حال به کار گیری HTML و Javascript/JQuery  می باشند. با استفاده از جاوا اسکریپت ترفندهای جالبی را می شود اجرا کرد. گرایش های امسال شامل موارد زیر می گردد:

  • پیمایش منطبق (پارالاکس): پیمایش منطبق در سال ۲۰۱۳ نسبتا محبوب شد. این بدان معنی است که موقعیت یک یا چند شیء در صفحه با پیمایش در صفحه ارتباط داشته باشد. پارالاکس معادل یونانی واژه ی “تغییر” است. پوسته ی Balloons برای وردپرس، یا وب سایت کمپانی کیف سازی Bagigia، مثال های خوبی هستند. پیمایش منطبق تصور عمق داشتن را القا می کند، و نیز می توان آن را برای ایجاد تجربه ی پیمایش روان در وب سایت های قصه گو به کار برد.
  • پیمایش بی نهایت: پیمایش بی نهایت بدان معنی است که محتوای صفحه با رسیدن به انتهای آن به صورت اتوماتیک بارگذاری می شوند. لازم نیست که کاربر چیزی را کلیک یا صفحه را مجددا بارگذاری کند. ممکن است مثال هایی از پیمایش بی نهایت را هنگام پیمایش در صفحه ی فیسبوک خود یا برد های پینترست مشاهده کرده باشید.
  • پنل های لغزان: پنل های لغزان صفحات وب روشی برای جابجا شدن صفحات با انیمیشن لغزش است، که تنوع خوبی در مقایسه با نوع معمولی می باشد. از پنل های لغزان به منظور جلب توجه به یک ویژگی خاص در صفحه ی وب نیز استفاده نمود.

 

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

 

تایپوگرافی

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

 

پشتیبانی از رتینا

این روزها صحبت از رزولوشن صفحه نمایش ها بدون اشاره به صفحه های رتینا واقعا غیر ممکن است. اپل نخستین بار این ویژگی را با آیفون ۴ محبوب ساخت، و از آن زمان، در محصولات خود بیشتر از آن استفاده نموده است. هم اکنون، این گرایش به سمت صفحه نمایش های با پیکسل های متراکم در حرکت است. طراحان وب نیز با طراحی تصاویر پاسخگو قادر به استفاده از آن هستند؛ یعنی یک طرح برای صفحه نمایش های عادی، و یک طرح با رزولوشن دو برابر که در صفحه نمایش های رتینا به خوبی نشان داده می شود. برای فهم بهتر چگونگی انجام این عمل، مقاله ی لی مانروی، ۵ چیزی که یاد گرفتم برای صفحه نمایش های رزولوشن بالای رتینا طراحی کنم  را مشاهده نمایید.

 

وب سایت های تک صفحه ای

این گرایش در سال ۲۰۱۳ به محبوب بودن خود در طراحی وب سایت های ساده مانند صفحات مقصد یا برنامه های موبایل ادامه می دهد. یک وب سایت تک صفحه ای می تواند زمان بارگذاری را کاهش دهد. در نظر داشته باشید که اگر وب سایت شما محتوای زیادی داشته باشد، این فرمت به خوبی پاسخگوی شما نخواهد بود. برای مشاهده ی ایده های تک صفحه ای عالی، به One Page Love و One Page Mania مراجعه کنید.

 

استفاده از تصاویر بزرگ به عنوان تصویر پس زمینه

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

 

نوار سربرگ های ثابت

سربرگ های ثابت به طور شگفت انگیزی عملی هستند و باعث بهتر شدن تجربه ی کاربری می شوند. یک سربرگ ثابت به گونه ایی است که هر چقدر به سمت پایین پیمایش کنید، باز هم در بالای صفحه باقی خواهد ماند. ایجاد این عنصر در صفحه نیز آسان است. تنها کافی است در CSS خود مقدار fix برای ویژگی position استفاده کنید تا به نتیجه ی مطلوب برسید.

 

همان طور که می بینید، گرایش های اصلی طراحی وب در سال ۲۰۱۳، همگی سعی در دستیابی به یک تجربه ی کاربری بهتر، و نه لزوما تاثیرگذارتر دارند. جدا از همه، به نظر می آید سهولت در استفاده و مفید بودن کاربران را بیشتر از دنگ و فنگ و زیبایی ظاهری به یک وب سایت جذب می کنند. سعی در به کار گیری چند مورد از این گرایش ها در وب سایت خود داشته باشید تا بتوانید در پاییز امسال آن را بالا بکشید.

حسین جاهدی

مهندس فناوری اطلاعات IT علاقه مند به مباحث امنیت شبکه ، برنامه نویسی و طراحی وب - مدیر راهبردی و نویسنده آی تی پورت

View Comments

  • ممنون جالب بود

    خسته نباشید

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

    امیدوارم طراحان عزیز به این نکات توجه کنن

    موفق باشی حسین جان

    • ممنون جناب حدادکار
      آره متاسفانه
      مثل بازی فوتبالی هستش که هر جا توپ بره تمام بازی کنان زمین اونجا جمع میشند :|

      به امید پیشرفت

  • مقاله لی مانروی رو مطالعه کردم، به نکات خوبی پرداخته بود

    عالی بود جناب جاهدی

    ممنون

    • خواهش می کنم
      خوشحالیم مفید واقع شده :)

  • سلام

    سایته خوبیه ممنون

    من چند تا مطلب ازش یاد گرفتم

    بخصوص این که نکته به نکته آموزش می دین کسی که مثه من خیلی چیزی از کامپیوتر بلد نیست خوب یاد می گیره

    • سلام
      خوشحالیم آی تی پورت می تونه کمک حالتون باشه :)

  • عالی بود.فقط اینکه آقای جاهدی چرا ادامه ی جاوا رو شروع نمی کنید.

    • ممنون
      حمایت خیلی خوبی نمیشد از آموزش ها و بنده هم وقتم خیلی پر شده بود به همین خاطر بنده یک مدتی میشه آموزش تهیه نمی کنم.
      انشاالله که دوبار در آینده استارتش بخوره

  • خیلی جالب بود ( لطفا بیشتر این نوع اموزش ها در سایتون بذارین)

    با تشکر

Recent Posts

نکات ضروری برای دانلود ایمن؛ چگونه از ورود به دام سایت‌های مخرب جلوگیری کنیم؟

در دنیای بی‌پایان نرم‌افزارها و فایل‌های دیجیتال، امنیت در دانلود و استفاده از آنها یک…

10 ماه ago

معرفی و بررسی سری های لپ تاپ ایسوس

شرکت ایسوس یکی از پیشتازان در صنعت فناوری اطلاعات و الکترونیک است که در زمینه…

11 ماه ago

آموزش دستورات پاورشل به همراه فهرست کامل کد های ویندوز پاورشل

آیا شما هم به دنبال کار با کد های پاورشل برای هک هستید؟ در این…

12 ماه ago

شغل ادمین اینستاگرام چیست و چگونه ادمین اینستاگرام شویم؟

این روزها که همه افراد به دنبال یک شغل پردرآمد می گردند، مشغول به کار…

12 ماه ago

آموزش حل مشکل page isn’t available right now در اینستاگرام

خطای page isn’t available right now یکی از آزار دهنده ترین مشکلاتی است که کاربران…

1 سال ago

ویندوز پاورشل چیست ؟ کاربرد ها و نحوه فعال سازی powershell

ویندوز پاورشل چیست؟ پاورشل ابزاری قدرتمند به حساب می آید که همه افراد علاقه مند…

1 سال ago