تصميم مواقع الانترنت :     

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

مراحل تصميم مواقع الإنترنت التخطيط لبنية الموقع :

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

تصميم شكل وألوان الموقع :

يتم التصميم للشكل الخارجي، وصفحاته الداخليّة من الصفر باستخدام أحد برامج التصميم؛ مثل: Adobe Photoshop, Adobe Illustrator، ويقوم بهذه المهمة قسم التصميم في العادة، وذلك كونها مهمة تصميميّة لا تحتاج إلى خبرة في لغة html أو php الخاص بتصميم المواقع، كما يمكن استخدام القوالب الجاهزة في تصميم المواقع، والمتوفرة بشكلٍ كبير على الإنترنت سواء كانت مجانيّة أو مدفوعة الثمن، وفي الغالب تكون هذه القوالب على شكل ملفات فوتوشوب psd مفتوحة حتى يتمكن المستخدم من التعديل عليها.

تحويل التصميم إلى صفحة html :

يتم تحويل التصمي من مجرّد صورة إلى صفحة html خالية من البيانات، وهذا ما يتطلّب وجود خبرة في هذه اللغة، والقدرة على استخدام أنماط CSS والعديد من الأشياء الأخرى، كما سيكون هناك حاجة لاستخدام برنامج الفوتوشوب للتمكن من التعامل مع التصميم الأساسي، وتصدير عناصر إلى صفحة html النهائيّة، كما سيستخدم في هذه المرحلة برامج إدارة المواقع؛ مثل: Adobe Dreamweaver, Frontpage.

وضع البيانات في الصفحات وربطها :

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

رفع الموقع ونشره على الإنترنت :

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

 

 

 

 

ولقد أصبح تصميم المواقع الإلكترونية في الآونة الأخيرة طريقة جيّدة لكسب المال، حيث إنّ صناعة المواقع الإلكترونية أصبحت من الصناعات كثيرة الانتشار والمدرّة للأموال، وهناك الكثير من المواقع الإلكترونية في حياتنا والتي نتعامل معها بشكل يومي، ومن أشهرها (Facebook, Twitter, LinkedIn,…)، ولتعلم تصميم المواقع الإلكترونية عليك ان تتعلم مجموعة من لغات البرمجة في البداية ستجد الأمر صعباً وقد تشعر أنّه يشكل تحدياً لك، لكن مع مرور الوقت ستجد الأمر مثيراً للاهتمام وممتعاً جداً. لغات البرمجة المستخدمة كما ذكرت سابقاً تعلم تصميم المواقع الإلكترونية يحتاج لتعلم مجموعة من لغات البرمجة، ومن لغات البرمجة التي تدخل في تصميم المواقع الإلكترونية لغة (PHP, HTML, CSS, JavaScript, XML, AJAX, SQL) سأبدأ بالتعريف بكل لغة على حدة، بالإضافة إلى ذكر أفضل المواقع لتعلّم كل منها. اللغات الأساسية اللغات الأساسية المطلوبة في أي موقع والتي يجب على المبتدئين تعلمها: (PHP(Hypertext Preprocessor: هي لغة برمجة مفتوحة بمعنى أنّ هذه اللغة وأكوادها البرمجية متوفرة مجاناً للجميع، وتستخدم من قبل السيرفر، وهي جزء لا يتجزّأ من لغة البرمجة (HTML)، وتستخدم لإنشاء صفحات الإنترنت وأيضاً يمكن التنقل بينها وبين HTML بكل سهولة. في بداية 2013 استخدمت في أكثر من 240 مليون موقع إلكتروني وفي 2.1 مليون ويب سيرفر، ابتكرها Rasmus Lerdorf في عام 1994، وتبدأ أكواد PHP بوسموتنتهي ، ومن افضل المواقع لتعلم PHP: W3School. Lynda.com. PHP.net. (HTML(HyperText Markup Language: لغة تستخدم في تصميم صفحات الإنترنت وتعدّ HTML من أقدم لغات البرمجة التي تستخدم في تصميم صفحات الإنترنت وأكثرها استخداماً، HTML لغة برمجة من نوع Markup Language حيث إنّها تستخدم في ترتيب محتويات صفحة الإنترنت وطريقة عرضها وترتيب شكل الصفحة ولا يوجد لها أي استخدام في تنفيذ الأوامر، ومبتكر HTML هو الفيزيائي (Tim Berners-Lee) وتبدأ أكواد HTML بوسم وينتهي ، ويمكن تعلّمها عن طريق W3School. cascading style sheet) CSS): هي أيضاً لغة برمجة من نوع Markup Language، مثل HTML تستخدم لتنسيق صفحات الإنترنت وتهتم بشكل الصفحة وخاصاً ترتيب وتنسيق (الألوان، وإعدادات الخط، والصور،...إلخ)، ويفضل دائماً كتابة كود CSS في ملف خاص، ثم ربطه مع كود البرمجة لصفحة الإنترنت ممّا يسهل التعامل معه، وظهرت هذه اللغة في هام 1996، ويمكن تعلمها عن طريق W3School. Structured Query Language) SQL): هي لغة متخصّصة في إدارة قواعد البيانات (Database) وتحديد العلاقات بينها، حيث يمكن من خلال استخدام هذه اللغة تخزين البيانات في قاعدة البيانات (Database) وحفظها وإجراء العديد من العمليات عليها مثل: (تعديلها، وحذفها، وإضافة بيانات عليها، قراءتها،...إلخ)، تم تطويرها من خلال شركة IBM عام 1970.، وأفضل المواقع لتعلم SQL SQLCourse.com. Lynda.com SQLZoo.net. اللغات الاحترافية JavaScript: لغة برمجة تستخدم في تطوير المواقع الإلكترونية تم تطويرها من قبل Netscape بهدف إضافة عناصر ديناميكية وتفاعلية للموقع، وبالرغم من أنّ اسمها JavaScript إلّا أنّها لا تشبه لغة البرمجة Java ، حيث إنّها اقرب إلى لغة C أكثر. JavaScript هي client-side language أي يتم معالجها على متصفح الويب (web browser) الخاص بالزبون (client) بعكس لغة PHP التي هي server-side language، وأفضل المواقع لتعلم JavaScript: Code School. W3School . Codecademy. Extensible Markup Language) XML): هي Markup Language تستخدم لوصف البيانات ويمكن ربطها مع قاعدة البيانات، AJAX، JavaScript. وهي ليست محصورة على المواقع الإلكترونية حيث يمكن استخدامها في تطوير وبرمجة بعض تطبيقات سطح المكتب. يمكن تعلمها عن طريق W3School. Asynchronous JavaScript and XML)AJAX): طريقة لبناء مواقع وتطبيقات تفاعلية، وهي عبارة عن مزيج من JavaScript، XML، dynamic HTML. يمكن تعلمها عن طريق W3School. نصائح لبناء موقع إلكتروني تعلّم لغات البرمجة السابق ذكرها مفيد جداً في بناء موقع جيد. إنّ أصعب مرحلة في بناء أي موقع إلكتروني بعد تعلم لغات البرمجة المطلوبة هو تحديد الهدف من هذا الموقع وما هي فائدته واستخداماته. عند بدء العمل على موقعك احرص كل الحرص على استخدام ألوان مناسبة للعين والعدم الإكثار من الأشكال المتحركة أو الإعلانات على موقعك. عليك أن تعلم أنه بعد الانتهاء من بناء موقعك فإنّك تحتاج إلى اسم نطاق (Domain Name)، وهناك الكثير من الشركات المسؤولة عن تزويدك بنطاق لموقعك مقابل مبلغ من المال حيث تعمل هذه الشركات على استضافة موقعك لديها، ومن الشركات العالمية المستضيفة هناك شركة: I Web. Host Monster. تنويه: يجب ان يكون لقارئ هذا المقال معرفة ببعض المفاهيم كمفهوم البرمجةDomain Name, Webserver, server and client