يمكن للمرء أن يتخيل مدى صعوبة ممارسة تصميم الويب مرة أخرى عندما يبدو كل شيء جديدًا للغاية - خلال أيام Netscape Navigator و Microsoft FrontPage. بالنظر إلى الوراء ، يبدو مثل هذا الوقت القديم في تاريخ تصميم الويب. كان من المستحيل تقريبا تصميم شيء من الإبداع الأسمى والذكي. في ذلك الوقت ، كان يُنظر إليك على أنه مبدع إذا كان لديك خلفية وامضة أو أشرطة تمرير ملونة.

لم يكن هناك الكثير من المرونة عندما جاء إلى التصميم الأنيق. كثير من التخطيطات كانت هي نفسها وحاكيت ما كان ينظر إليه في المجلات والصحف. أعني مجرد التفكير في ذلك: منذ وقت ليس ببعيد كنا قادرين على أخيرا معرفة طريقة لاستخدام الخطوط المزخرفة على الإنترنت. قبل ذلك ، كان كل شيء Arial ، كل Verdana وكل Times New Roman - في عام 2012 ، هل يمكنك تخيل الحياة تلك الحياة؟

الجداول كانت القاعدة ولم تكن مرنة للغاية. بالحديث عن المرونة ، كيف كنا نعيش بدون استجابة؟ إذا كنت ترغب في تصميم موقع ويب منذ فترة ، فأنت إلى حد كبير محاصر للعمل مع ما لديك. لم يشتك أحد بعد ذلك ، ولكن الحمد لله على التكنولوجيا التقدمية.

الآن…

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

يمكن أن تسهم التطورات في تصميم الويب في التطور المستمر لمختلف لغات التشفير. لا يمكن أن يكون لديك تصميم ويب رائع بدون تطوير كبير على الويب (والعكس صحيح). وقد تفكرون في أن الأمور قد تكون أكثر تعقيدا فيما يتعلق بالتنمية ، إلا أن الأمور قد أصبحت أسهل. ألق نظرة ، على سبيل المثال ، في HTML4 مقابل HTML5.

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

الإضافات

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

jQuery الشبكة المحمول

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

ArcText.js

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

يتوهم التحركات

الاتجاه الشائع في تصميم المواقع الحديثة هو القدرة على تحريك الأشياء. يكاد يكون من المستحيل زيارة موقع ويب ومشاهدة صور ثابتة - يستخدم كل شخص تقريبًا شريط تمرير الصور بشكل أو شكل. العديد من أشرطة التمرير هذه تلقائية وتغيير الصور في إطار زمني محدد. لا يوجد شيء خطأ في ذلك ، ولكن كيف يمكنك أن تأخذ هذا المفهوم وتجعله أكبر لتجربة المستخدم؟ يبدو أن هذا المكوّن الإضافي لـ Fancy Movies قد برز من خلال السماح للمشاهدين بالتحكم في الشريحة ، وليس فقط عن طريق النقر على السهم التالي ولكن من خلال الضغط على مفاتيح الأسهم على لوحات المفاتيح بشكل مريح.

FitText

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

تحوم تكبير

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

jRumble

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

jQSlickWrap

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

jQuery Offset الرسوم المتحركة

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

انتقل-O-راما

باستخدام اسم مثل "Scroll-O-Rama" ، يمكنك تمرير هذا المكون الإضافي ، ولكنني أنصحك بعدم القيام بذلك. بقدر ما هو ممتع ورائع مثل هذا البرنامج المساعد ، أعتقد أنه يمكن جعلك رائجة في الموقع العصري لمواقع الويب الفردية. أثناء التمرير حول مواقع ويب فردية ، تتوقع نوعًا ما حدوث شيء ما. يتيح هذا البرنامج المساعد الكثير من العناوين والرسائل النصية للرقص وأنت تمر بها. وهو مكون إضافي يستخدم بشكل أساسي لأغراض التزيين ، ولكن إذا كان بإمكانك رشه عن موقعك واستخدامه في الأماكن الصحيحة ، فيمكنك تشغيل هذا المكون الإضافي للحصول على قوة.

مسج شادو البرنامج المساعد

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

Slitslide

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

يميل

تلميحات الأدوات هي عنصر يستخدم لعدة أسباب. لجذب الانتباه أو إضافة معلومات أو أي شيء يمكن أن يصلح فيه. إنها تشبه إلى حد كبير تأثير التحويم ، حيث يمكن أن تكون فعالة للغاية إذا تم استخدامها بشكل صحيح. هناك الكثير من الإضافات jQuery التي تلبي تطوير واستخدام تلميحات الأدوات. Tipped هو مكون إضافي يعمل ويحتوي على العديد من الميزات ، معظمها قابلة للتخصيص بواسطة HTML5 و CSS ، مما يجعل عملية إنشاء سهلة وسلسة.

أنبوبي

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

jmpress

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

jQuery Knob

نحن نعيش في وقت بصري للغاية ، حيث من الأسهل رؤية الأرقام والمعلومات أكثر مما يمكن التفكير فيه. بعضنا يفضل حتى رؤية معلوماتنا قبل أن نفهمها حقًا ويمكننا استخدامها. إذا كانت لديك بعض المعلومات لتقدمها ، فهذا البرنامج المساعد رائع للمساعدة في تصور الأرقام. هو رسم بياني / دائرة تفاعلية من الأنواع التي تعمل ويسمح للمشاهدين بتغيير المعلومات أيضًا.

3d Thumbnail Hover

لقد تحدثنا بالفعل عن تأثير صورة التحويم وكيف يمكن أن يكون فعالاً للغاية لمواقع الويب. حسنا ، ماذا لو كنت تريد المزيد من الإثارة لصورك؟ يمنحك هذا المكوّن الإضافي تأثيرًا لتحريك الصورة يُظهر معلومات مع بعض التواء ثلاثي الأبعاد.

blur.js

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

استنتاج

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