موضوع مهم جداً يعرفك كيف تبدأ لتصميم الويب , بداية من البرامج التي تحتاجها حتى الشروحات التي تجعلك مصمم ويب.

تعلم تصيم الويب

تعريف مصمم الويب : مصمم الويب بإختصار هو الذي يهتم بالشكل الخارجي للموقع , يقوم بتصميم الازرار والالوان والشعار , فهو عامل مثل الشخص الذي يدهن المنزل او يقوم بتصميم بألوان جميله.

الادوات اللازمه في تصميم الويب | مسار مصمم الويب

تحتاج الى كتابة اكواد , وهذه تكون في محررات مخصصه لها وليس الكابه في ملف نصي او ملف وورد , فيمكن ان تختار احد افضل برامج كتابة الاكواد البرمجه من هذا الموضوع "أفضل 5 برامج لكتابة الأكواد البرمجية"

ماذا تحتاج لتعلم تصميم الويب

(1) لغة HTML : هي لغه تعمل على بناء هيكل صفحات الويب {كورسات HTML}
(2) لغة CSS : لغة جميله تغير الوان الموقع والاحجام و نوع الخط {كورسات CSS}
(3) دروس مهمه جداً:
كيف تتجنب الوقوع في اخطاء HTML {هنا}
كيف تتجنب الوقوع في اخطاء CSS {هنا}

-----------------------------

بعد تعلم كل هذا , نأتي التطبيق العملي , وذلك بتصميم الكثير من التطبيقات لتحترف أكثر وتتعلم من أخطائك , لذلك تحتاج الى تعلم التخطيط أولاً.

كورس التخطيط {هنا}

كورس التطبيق الاول على HTML + CSS {هنا}

نأتي لمرحلة التطوير وهي على HTML5 و CSS الجديده

لغة HTML5 متطوره , فيه مفيده وتحتاجها في عملك , تم تطوير الوسوم واضافة مميزات جديده , وايضا توفر عليك جهد ووقت اثناء التصميم.

تعلم HTML5 الجديد {هنا}

تعلم CSS الجديده {هنا}

-----------------------------

ماذا بعد ؟

تعلم مكتبة jQuery , مكتبه مشهوره مبنية على Javascript , فمن خلالها تضيف لمسات سحريه في الموقع , وهي مكتبه سهله ومهمه جداً لتصنع شكل جميل للموقع بدلا من ان يكون الموقع صامت.

تعلم Javascript , وطبعا Javascript مهمه ومن خلالها تفهم مكتبة jQuery لاني ذكرت ان jQuery مبنيه على Javascript , وايضا الـ Javascript بعد تعملها تفيدم في التطوير في المستقبل و وتساعدك على تعلم لغات برمجه لان يوجد لغات برمجه متشابهه.

تعلم jQuery , بعد تعلم هذه المكتبه , طبق ما تعلمته من {هنا} , {هنا}

كورس Javascript الأساسي لإتقان اللغة
كورس Javascript DOM للتعامل مع صفحة الويب
كورس Javascript BOM للتعامل مع المتصفح

-----------------------------

اطار العمل Framework : ربما سمعت عن Bootstrap فهنا نتعرف على البوتستراب , فهو اطار جميل ويعمل التصميم بسهوله ويوفر عليك الوقت والجهد الكثير في كتابة الاكواد , مع Bootstrap يسهل عليك الانتهاء من العمل المطلوب منك في وقت وجيز ويكون الموقع متوافق مع Responsive , يعني متوافق مع الاجهزه المختلفه , سواء موبايل او تاب او كمبيوتر وهكذا ....الخ , تعلم Bootstrap 3 من قناة الزيرو لاني لم اجل الكثير من الشروحات العربيه لـ Bootstrap 3

تعلم Bootstrap 3
تحويل PSD لتصميم بواسطة البوتستراب
كيفية عمل إطار عمل خاص بك تستخدمه في جميع تصميماتك ليوفر عليك الوقت والجهد

-----------------------------

تعلم Responsive لتجعل التصميم متجاوب مع الاجهزه المختلفه

ماهو Responsive : هذذ يجعل تصميم الموقع متجاوب ومتوافق مع الاجهزه المختلفه مثل الموبايل و التاب و اللاب توب وعرض الشاشات المختلفه , فهو مهم جدا جدا

شرح "Responsive" من البدايه

-----------------------------

مواقع مهمه قد تحتاجها
MDN
SitePoint

Bootstrap