الـWeb Design قصاد الـWeb Development – ازاي الاتنين بيكملوا بعض؟

Oct 26, 2018


تقريبًا مفيش ساعة بتعدي علينا من غير ما نستخدم الإنترنت، سواء كان من خلال تطبيقات الـAndroid أو مواقع الـWeb، وأكيد سألت نفسك ازاي الصفحات دي بتشتغل عشان تطلع بالشكل ده قدامنا.
مثلاً: لما بتدخل على الـFacebook بيطلب منك الـE-mail، والـPassword، وبعد ما ضغطت Log in، بينقلك على صفحتك.
ازاي عمل Check على بياناتك، وعرف إنها صح؟ وإيه اللي حصل؟
عشان تعرف اجابة السؤال ده، فانت محتاج تفهم إن صفحة الـWeb متقسمة لحاجتين:
• أول حاجة هي الـFront-end: وبتشمل التصميم الخارجي اللي بيظهر قدامك، وبتتفاعل معاه.
• تاني حاجة هي الـBack-end: وبتشمل العمليات اللي بتحصل في الخلفية، من نقل أو تخزين أو غيرها من العمليات اللي ممكن تحصل على البيانات.
اللي حصل ده بيتم عن طريق الـWeb Design والـWeb Development، وهما أساس كلامنا المقالة دي.

– الفرق بين الـWeb Design والـWeb Development، ومدى ارتباط شغلهم ببعض:

لو هنعرّف الـWeb Design بشكل مبسط، فهو المرتبط بالـFront-end، ومسئول عن الـDesign، والـLayout، والشكل الجمالي للصفحة. بالإضافة إنه بيشمل: تصميم الألوان، الخطوط، التنسيق اللي في الصفحة، والصور لما تكون بتتصفح موقع معين بتلاقي فيه، وبيكون من أهدافه كمان إن المستخدم يتفاعل معاها بشكل سهل.
والـWeb Development مرتبط بالـBack-end، وزي ما قولنا إنه مسئول عن العمليات اللي مبنشوفهاش وهنا بيكون مرتبط أكتر بلغات البرمجة أكتر من الـWeb Design، وهنستعرض في موضوعنا إيه لغات البرمجة دي.
الإتنين بالرغم من الفرق اللي بينهم، فمش منفصلين، والإتنين شغلهم مرتبط ببعض؛ عشان الـDeveloper دوره تحويل مجهود وشغل الـDesigner لحاجة يقدر المستخدم يتفاعل معاها، من خلال تقسيم الـDesign لأجزاء وبرمجتها، وإن كل ضغطة تقوم بعمل معين.

– ازاي تبدأ في أي مجال من الاتنين؟

لو عندك فكرة موقع وعاوز تطبقها، أو عاوز تبدأ تصميم أو تطوير ويب، فهنتكلم دلوقتي عن كل واحد فيهم، وإيه المطلوب منك بشكل عام:
أولاً الـWeb Design: بيكون فيه الـDesigner محتاج إنه يتعامل مع برامج زي: Adobe Photoshop، وIllustrator، وكمانInDesign، اللي من خلالها بيصمم واجهة الموقع، ده بجانب إنه يكون عارف أساسيات في لغات برمجة زي: HTML، وCSS، وعنده خلفية كويسة عنهم، وكمان يعرف أساسيات عن الـWeb Code والـWeb Hosting.
ثانيًا الـWeb Development: وده بالرغم من إن الضغطة على الصفحة تنفيذها بيستغرق مجرد ثواني، أو حتى أقل من ثانية، إلا إنه عشان ده يحصل بيكون عاوز سطور من الأكواد، بينفذها الـWeb Developer، أو اللي بيتسمى كمان بالـProgrammer. الـWeb Developer بيتعامل مع لغات برمجة زي: JavaScript، وPHP، وSQL.

– لغات البرمجة هي أساس الموقع، ومنها أعداد كبيرة جدًا، ولكل لغة برنامج مخصص بيتعامل معاها. دي أشهر اللغات اللي ممكن تحتاج تتعرف عليها اكتر، وبشكل عام الموضوع بيرجع للي تفضله من خلال شغلك معاهم:

1- HTML:

تعتبر من أسهل وأكتر اللغات المنتشرة في برمجة المواقع، وأسرعها في التعلّم، وهي اختصار لـHyperText Markup Language. الـHyperText هو الطريقة اللي بتنقلك بين المواقع، وبيكون على شكل Link لما بتضغط عليه بينقلك لصفحة تانية، الـHTML في الأساس بيكون عبارة عن Text بس الـBrowser بيقدر يحوله لشكل الموقع اللي بنشوفه. وممكن بعد ما تتعلم HTML، تتعرف على HTML5 وهي مجرد شكل أحدث للـHTML، وبيستخدم نفس الأساسيات.

2- CSS:

اختصار لـCascading Style Sheets، والـCSS هي اللي بتنظم شكل المحتوى الموجود في ملف الـHTML، وبتوصف ازاي هيكون الـStyle العام للصفحة من خلال: الألوان، الخطوط، الصور، وغيرها. وزي الـHTML5، هنا موجود تحديث على لغة CSS من خلال CSS3، اللي هيكون مفيد إنك تتعلمها.

3- JavaScript:

دي Scripting Language بتسمحلك بتنفيذ حاجات معقدة علي صفحة الويب. ميزتها أنها مش بتعرض Static Information، لكن بتعرض تحديثات المحتوى في الوقت المناسب. بالإضافة للخرائط التفاعلية، ورسومات 2D و3D، ومقاطع فيديو قابلة للتمرير. دا غير انها كمان Client-Side Script، يعني انت بتكتبها داخل صفحة الـHTML. معظم الـFunctions والتطبيقات اللي بتخلي الإنترنت بالنسبة لنا لا غنى عنه، الـJavaScript Coding داخل فيها.

4- PHP:

اللغة دي مخصصة للـWeb Development، وهي اختصار لـHyper Preprocessors، ومن خلالها تقدر تعالج البيانات اللي بتدخل الـPage، وبتشتغل عن طريق الـWeb Server، والأهم إنها Open-Source Language، وده اللي بيميزها عن لغات تانية زي الـPython والـJavaScript، وبتتميز كمان إنها بتتعامل مع Databases كتير أهمها الـMySQL، ومواقع “Facebook” و”Wikipedia” من أمثلة المواقع اللي بتستخدم لغة الـPHP.

5- SQL:

اختصار لـStructured Query Language، هدفها الأساسي الوصول والتعامل مع الـDatabases أو قواعد البيانات، ودورها مهم مع تعلم البرمجة، وواحد من الأنظمة اللي بتعتمد عليها هو MySQL، ومن مميزاتها إن استخدامها سهل، بتعالج البيانات بسرعة، ممكن نعتمد عليها بشكل كبير، وكمان سهولة التعديل عليها.

وبكده تكون اتعرفت على أساسيات الـWeb Design والـWeb Development، وازاي الاتنين بيكملوا بعض عشان يعرضوا قدامك أي موقع بتشوفه اونلاين. بتحديد هدفك، والتعليم، والتطبيق المتواصل هتقدر توصل لمستوى كويس في أي لغة منهم، وفي النهاية هتقدر تبني موقع خاص بيك انت.


Technology



مقالات ذات صلة





الـDNS – طريقك المختصر لمواقع الويب

Apr 16, 2019

Section |  Technology

لما بتفكر تبعت رسالة لشخص تعرفه في البريد فأنت محتاج تكون عارف عنوانه كويس؛ علشان تبقى ضامن إن الرسالة توصله شخصياً ومتوصلش لأي حد تاني، نفس الكلام موجود وبيحصل في عالم الإنترنت. كل….

...اقرأ المزيد


التكنولوجيا هي الدرع الخفي في حرب البقاء

May 19, 2020

Section |  Technology

تخيل إنك في مكان ضلمة، وبيهاجمك وحش، وكمان مش قادر تشوفه، إيه اللي ممكن يحصل؟  طيب تخيل إن المكان اللي أنت فيه بدأ ينور، وبدأت رؤيتك ليه توضح، والوحش اللي كان بيهاجمك، ومكنتش….

...اقرأ المزيد


الـWordPress وأسباب سيطرته على الـWCMS

Oct 11, 2018

Section |  Technology

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

...اقرأ المزيد