موضوع: با پارالاکس در طراحی سایت آشنا شوید

پارالاکس تکنولوژی جدید در زمینه [برای مشاهده لینک ها باید عضو انجمن ها باشید . ] است که اخیرا در ایران هم رواج پیدا کرده . در این سایت ها که معمولا تک صفحه ای یا single page هستند ، با اسکرول صفحه و یا حرکت موس افکتی در صفحه و روی عناصر صفحه اتفاق می افتد. برای مثال پس زمینه blur و یا جابجا میشه ، تصاویر و نوشته ها حرکت می کنند ، بعضی از عناصر و المنت ها با افکتی در صفحه ظاهر می شوند و … . دقت داشته باشید که هر افکتی که با اسکرول و یا حرکت موس اجرا شود با برگشت موس و یا برگشت اسکرول افکت هم به همان حالت قبل برمی گردد .
افکت دیگری که ممکن است در پارالاکس دیده شود این هست که شما با حرکت موس از سمت راست صفحه به سمت چپ (یا بالعکس) میتوانید میدان دید خود را گسترش دهید و از عرضی که در مانیتور مشاهده میکنید فراتر روید و به عبارتی دیگر منظره را بصورت ۱۸۰ درجه ببینید، به نحوی که عناصر و اجزای صفحه در جای خود قرار دارند و شما میتوانید عرض صفحه را از سمت راست به چپ و از سمت چپ به راست و فراتر از عرض ثابت صفحه مشاهده کنید.
مانند این است که دوربینی در دست شماست و در حال مشاهده ی یک منظره هستید. زمانی که شما دوربین را به راست یا چپ بچرخانید ، درختان و اجزای طبیعت سرجای خود هستند اما میدان دید شما حرکت خواهد کرد و زوایایی که بطور مستقیم در میدان دید شما نیست را با چرخاندن دوربین به چپ و راست خواهید دید.
در نمونه ای دیگر از طرح های پارالاکس ، چند لایه روی هم قرار می گیرد و یک تصویر ترکیبی را تشکیل خواهد داد و افکت هر لایه با سرعت خاصی اجرا می شود که این نمونه از نظر من جذابیت بیشتری به طرح می دهد.
گاهی اوقات شما حتی میتوانید با ترکیب برخی تکنولوژی ها با پارالاکس یک انیمیشن هم برای وب سایت خود طراحی کنید. در مجموع این تکنولوژی در حال حاضر بین کاربران ایرانی محبوبیت پیدا کرده.
چگونه یک سایت پارالاکس طراحی کنیم؟
طراح گرافیک سایت های پارالاکس باید تا حدودی با سایت های پارالاکسی آشنایی داشته باشد تا بتواند بصورت استاندارد [برای مشاهده لینک ها باید عضو انجمن ها باشید . ] را انجام دهد و برنامه نویس هم بتواند آن طرح را با تکنولوژی پارالاکس به درستی پیاده کند.
برای پیاده سازی این تکنولوژی پلاگینهایی هم وجود دارد مثل parallax.js که شما می توانید استفاده کنید. در آینده ساخت صفحات پارالاکس را به شما آموزش خواهیم داد.

منبع : [برای مشاهده لینک ها باید عضو انجمن ها باشید . ]