ما هو Parallax Scrolling

Parallax Scrolling

كثير منا أصبح يسمع في هذه الأيام عن ال Parallax Scrolling , ولكن كم منا يعلم عن هذا ال technique  , سنحاول هنا بإذن الله تعالى التطرق الى مفهوم ال Parallax Scrolling و ما هي مميزاته, وما هي عيوبه, ومدى تطور البحث واستخدام هذا الأسلوب...

أولا: تعريف ال Parallax Scrolling:

يوجد لهذه التقنية أكثر من تعريف جميعها يقود الى نفس الفكرة أو الهدف وسأذكر من التعريفات

1)  هي تقنية متقدمة تقدم خصائص وسمات لعملية ال Scrolling بحيث تأثر على الواجهات الرسومية على شاشة  الحاسوب, بحيث تتحرك الخلفية (وتكون صورة) بشكل أبطئ أو مختلف مع ما يأتي فوق هذه الخلفية, كصور أو كتابات ..الخ

2) هي وسيلة لرفع تفاعلية المستخدمين مع الموقع بحيث يظهر مجموعة من الأحداث (effect) التي تثير المستخدم وتجذبه للموقع, ومدأ عمل هذه الوسيلة اشراك العمل البصري والوظيفي للمستخدم معا, وذلك أثناء استخدام الموقع والتحرك لأسفل أو لأعلى.

أول ظهور لهذه الفكرة كان أيام ظهور لالعاب الفيديو, حيث كان ال effect 2d , وكان يقوم مبدء عمله على جعل مجموعة من الطبقات تختلف بسرعاتها لتأثر على العمق البصري أثناء اللعب, ومن هنا انطلق المحاولة وانطلقت القاعدة الآن لبناء ال parallax scrolling.

ثانيا: مميزات هذه التقنية:

1) اسلوب عرض رائع لأي مستخدم يستعرض الموقع منة خلال شكل عرض المعلومات وال effect الخاصة بها.

2) يسرد هذا الأسلوب المحتوى على شكل قصة (story).(ذلك بسبب عملية ظهور واختفاء الأحداث أثناء ال Scrollling)

3) هذا النوع من الصفحات أصبح الأكثر اثارة لفضول المستخدمين وهذا يجعل الزوار يقومون بتصفح جميع الموقع أو المحتوى.

4) يظهر المحتوى بشكل كامل يدعو المستخدم للعمل على الموقع مباشرة.

5) تزداد مصداقية الموقع والموثوقية لدى المستخدمين.

ثالثا: عيوب هذا النظام:

1) أهم عيب من عيوب هذا النظام هو SEO وذلك بسبب استخدام h1 واحدة, metatag واحدة, url واحد ..(يعني محسنات المواقع في البحث ستكون في صفحة واحدة فقط) .

2) سرعة تحميل الموقع بطيئة .

3) يوجد صعوبة في التحكم اذا وجد هناك تعدد للصفحات.

4) لا يوجد parallax responsive scrolling .. لذلك يتم عرض الموقع بدون effect parallax أثناء التصفح من الهاتف.

بعض الحلول لمواجهة هذه السيئات:

1) وضع loader جميل وبشكل عصري يجذب المسخدمين أثناء انتظارهم تحميل الموقع, والآن غالبا ما يستخدم ال css3 لهذا الغرض.

2) يمكن وضع صفحات أخرى يتم تصميم شكلها ومحتوياهتها كالمواقع العادية وتبقى الصفحة الرئيسية فقط هي ال parallex scrolling وبذلك تحافظ على الاثنين معا.

3) ان قمت باستخدام الأسلوب السابق فإنك ستزيد وتحسن من محرك البحث وذلك لوجود صفحات أخرى.

رابعا: مدى استخدام وتطور هذه التقنية على مستوى البحث في العالم:

خامسا: بعض المواقع كأمثلة على parallax scrolling

(حذفت الروابط)

**) في الأمثلة السابقة تتنوع الأفكار والملاحظات, وطرق العرض, وهناك أيضا طرق كثيرة تختلف من موقع لآخر.

سادسا: بعض الوسائل البرمجية للبرمجة بهذا الأسلوب:

1) https://github.com/Prinzhorn/skrollr

 (يمكنك تعلم الكثير من هنا https://ihatetomatoes.net/how-to-create-a-parallax-scrolling-website/)

2) http://johnpolacek.github.io/superscrollorama/

3) https://github.com/IanLunn/jQuery-Parallax#readme

3) https://github.com/peachananr/onepage-scroll ( one page scrolling)

والحمد لله رب العالمين.