ستأخذ HTML مصمم الويب فقط حتى الآن ، وإذا كنت تريد إنشاء تصميم ويب ديناميكي وجذاب وتفاعلي ، فإنك تحتاج إلى تعلم وتطبيق CSS. لا يمكنك فقط إنشاء عناصر تصميم محسنة لصفحاتك ، ولكن يمكنك توقع الاستمتاع بأوقات تحميل أسرع ، وسهولة في الصيانة ، ووقت أقل لإنشاء صفحات جديدة أو تحديث الصفحات الحالية.

فيما يلي 15 من أفضل مواقع CSS المتاحة التي تقدم أساليب مختلفة لمرحلة تصميم الويب. اجمع بعض الأفكار الملهمة ، واحصل على نصائح CSS ، وقم بتطبيقها على التصميم الخاص بك.

Beercamp

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

Beercamp

Inzeit

في حين أنه قد يبدو أكثر قليلا من موقع ثابت كبير يبحث Inzeit الصفحة الرئيسية تأتي حرفيا على قيد الحياة عند بدء التمرير أسفل الصفحة. تتحرك طبقات مختلفة في اتجاهات مختلفة وبسرعات مختلفة. وبينما يحتاج الزوار إلى تشجيعهم على اتخاذ الإجراءات الصحيحة ، يصبح الموقع نشطًا حيث يتم اتخاذ الإجراء بحيث يتم مكافأة الزوار على اتخاذ إجراء.

Inzeit

ShockBlast

Shockblast هو موقع معرض الصور الفوتوغرافية ، ومن الثاني الذي تحمّله الصفحة ، كل تحوم بالماوس يساعد على جعل الصفحة على قيد الحياة. لا تعرض الصفحة الرئيسية الكثير من عينات الصور الفوتوغرافية الرائعة فحسب ، بل تتيح أيضًا لـ ShockBlast تصنيف الصور وتصنيفها إلى صفحات مما يجعل التنقل بسيطًا وفعالًا للغاية أيضًا.

TepTek

ال TepTek الموقع هو آخر يضم عددا من الطبقات مصممة بشكل معقد في تصميم واحد. يتغير العرض الأولي أثناء التمرير لأسفل وعندما تظهر الإطارات في أسفل الصفحة ، تظهر أرقام الصفحات وتختفي. يوفر اللونين الأسود والأبيض لمسة نهائية وأنيقة بحيث يركز الزائر بشكل كامل على المحتوى.

TepTek

FineGoods

ال FineGoods يحتوي موقع الويب على عدد قليل من المفاجآت الصغيرة التي تنتظرك وأنت تحوم فوق أدراج التنقل ، وقم بالتمرير لأسفل الصفحة ، وحتى يمكنك إلقاء نظرة فاحصة على علامات الأسعار (نص HTML). قد يكون اختيار السلع محدودًا ولكن هذا جزء من السبب وراء نجاح التصميم الفريد.

FineGoods

الحسد مختبرات

الحسد مختبرات هي واحدة من المفضلة لدينا. تُستخدم تحويلات CSS لإنشاء دائرة دوارة دوّارة وعند النقر على الرموز "التالية" و "السابقة" ، تشاهد دائري التدوير حتى يتم عرض الصورة التالية. ما تبقى من الصفحة هو تصميم بسيط نسبياً ولكنه فعال للغاية يستخدم CSS في مجموعة متنوعة من الطرق الأخرى.

Envy Labs

نادي السائق

ال نادي السائق تم تصميم موقع الويب لـ Ubisoft عند إصدار لعبة Driver الجديدة وبمجرد زيارة الموقع يمكنك رؤية الرابط بين موقع الويب واللعبة. استخدام آخر عظيم للتحويلات يعني أنه أثناء التمرير لأسفل ، يبدو أن موقع الويب بأكمله يأتي إلى الحياة حتى مع ظهور أرصدة متدحرجة.

Drive Club

ماموث بوث

ماموث بوث هو مفضل آخر وهو يلعب على نظرية أننا جميعا نريد ما لا ينبغي لنا. انقر فوق الزر Fire وتتسلسل سلسلة من الصور على الشاشة وإنشاء كشك صور. يُعد الموقع الإلكتروني طريقة رائعة لترويج خدمة كشك الصور التي تقدمها الشركة.

Mammoth Booth

Jeclat

دخول Jeclat الموقع وستتم دعوتك للإبحار حول العالم ، والتحقق من المعالم ، والأجزاء الجانبية المفتوحة. التمرير الجانبي هو أمر غير معتاد بالنسبة للكثير من مستخدمي الإنترنت الآن ، ومن خلال الاضطرار إلى الحصول على التمثال ، فإنه يبني دسيسة ومشاركة من المستخدم أيضًا.

JeClat

فاشيرون كونستانتين ‬

ال فاشيرون كونستانتين ‬ الموقع باللغة الفرنسية ولكنه يستحق الزيارة حتى إذا لم تقرأه. انقر مع الاستمرار على زر التمرير لأسفل الصفحة واستمتع بالعرض. موقع أنيق المظهر لا يعرض فقط الساعات الأنيقة بشكل متساوٍ لكنه يظهر أيضًا مصدر إلهام التصميمات.

Vacheron Constantin

رفع التفاعلية

في بعض الأحيان ، قد تكون محاولة وضع عدد كبير جدًا من الأنماط والتأثيرات على صفحة واحدة مكلفًا مع تعطل الصفحة ، ولكن هذا ليس صحيحًا رفع التفاعلية . زيارة والتمتع بالعديد من الحيل. ألقِ نظرة على تأثيرات الكتاب ثلاثي الأبعاد بالإضافة إلى حركة الطبقات لصور الرأس.

LiftInteractive

VZug

ال VZug الموقع هو جدول زمني ديناميكي. بدلاً من مجرد عرض صورة بسيطة وبسيطة على صفحة ثابتة ، أثناء التمرير لأسفل الخط الزمني الديناميكي ، ستختبر تصميمًا جذابًا للصفحات وصفحة توضيحية. يهدف الموقع إلى الاحتفال بمرور 100 عام على تاريخ الشركة ، كما يساعد التصميم على القيام بذلك بشكل جيد.

VZug

ديغو

أي شخص لعب لعبة Little Big Planet سيتعرف على أسلوب الموقع الذي ينتمي إليه ديغو وكالة تصميم. يأخذ التنقل اتجاهًا عشوائيًا على ما يبدو ، ويأخذك عبر المراحل العديدة التي يدعي فريق تصميم Dego أنها تأخذ عملائها والعملاء المحتملين عليها.

WeAreX3

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

Cymetriq

Cymetriq هو موقع إلكتروني آخر مصمم بطريقة رائعة يجمع بين عدد من العناصر والأساليب المختلفة في موقع واحد فريد يبحث عن العمل. قم بالتمرير لأسفل لنماذج المعرض ، وقم بالمرور فوق شريط التنقل لعناصر CSS ، واستمر في التمرير من أعلى إلى أسفل للحصول على بعض التصميمات والتصميمات الفريدة.

Cymetriq

هل فاتتنا واحدة من المفضلة لديك؟ هل تجاوزتم أحد الأمثلة هنا؟ اسمحوا لنا أن نعرف في التعليقات.