تُستخدم لغة الـ CSS التي هي اختصار لـ Cascading Style Sheets في تحديد شكل صفحات الويب، فيمكنك عن طريق أكواد ورموز CSS أن تعدل كيفما شئت على الألوان والخلفيات والخطوط والأبعاد والصور وغيرها. تختلف تقنية CSS عن الـ HTML، فبالرغم من أن كلاهما يستخدم في إنشاء صفحات الويب، ولكن هناك إختلافًا جذريًا بينهم، لغة HTML تستخدم في بناء الهيكل الأساسي للصفحة على شكل أكواد ورموز. في المقابل، CSS هي المسؤولة عن التصميم والشكل العام لصفحات الويب. تعرّف معنا على أهم مصادر تعلم CSS من البداية حتى مرحلة الاحتراف والتمكّن:
ما الذي تحتاجه لتبدأ تعلم CSS؟
تُتيح تقنية CSS خيارات سهلة وبسيطة ومميزات عدّة يمكنك استخدامها للتحكم كليًا بشكل صفحات الويب المُراد إنشاءها، ولا تحتاج للكثير لتبدأ تعلم CSS. فكل ما تحتاجه لتبدأ التعلم هو:
1. محرر CSS
محرر CSS هو البرنامج الذي تكتب فيه الشيفرات والرموز الخاصّة بتقنية CSS، ومنه تتحوّل إلى صفحات ويب بأشكالها المألوفة، ومن أفضل برامج التحرير:
- Stylizer
Stylizer محرر فريد من نوعه، يركز على عملية التحرير الفوري، حيث أنه يعرض النتيجة لكل رمز أو كود CSS تكتبه على الفور. بالإضافة إلى أنه يتميز ببساطته وسهولة التعامل معه، كما أنه يتحقّق من صحة الشيفرات والرموز التي تدخلها.
- Top Style
محرر TopStyle بإصداره الجديد TopStyle5 يدعم أحدث خصائص ووسوم CSS3 وHTML5. يحتوي على عدة مزايا فريدة من نوعها منها المُحقّق “Validator” الذي يبحث ويدقق ويعدل الأخطاء في الشيفرات والوسوم، وكذلك يوفّر المعاينة المباشرة لنتيجة ما تكتبه من رموز وشيفرات، كما يتميّز بالإكمال الذاتي للشيفرات مما يُقلل نسبة الخطأ، وغيرها الكثير من المزايا.
- Notepad++
من برامج تحرير لغات البرمجة الكلاسيكية وأكثرها استخدامًا، قد تحتاج استخدامها أثناء تعلم CSS. يتميّز ببساطته وبساطة تصميمه الذي يساعدك على إتمام ما تريد في وقت أسرع وبجهد أقل. ومن اللغات التي يدعمها Notepad++: جافا Java وجافا سكريبت JavaScript وروبي Ruby وبايثون Python وغيرها من اللغات بجانب طبعًا HTML و CSS. كما يوجد العديد من البرامج الأخرى التي بإمكانك استخدامها لتحرير رموز وأكواد CSS مثل: Rapid CSS وEspresso.
2. متصفح للإنترنت
لتجربة ما كتبته من رموز وشيفرات ووسوم، ينبغي أن يحتوي جهازك على برنامج متصفح الإنترنت، ومن أشهر برامج التصفح: Google Chrome وMozilla Firefox وOpera وSafari. بعدها، ستكون مُهيأ لتبدأ تعلم css، فقد عرفت كل ما يلزمك من برامج لتبدأ رحلتك في التعرف على شيفرات CSS حتى مرحلة الاحتراف، بقي أن تبدأ التعليم. ويجب أن نتعرّف على أفضل طرق للتعلّم، وأفضل المصادر لكل طريقة منهم.
كيفية تعلم CSS وإتقانها
لإتقان CSS، يجب عليك أولًا حسن التركيز والإنصات حتى تدرك ما تتعلّمه، ثم تتدرب على ما تعلمته وتكتب الشيفرات بنفسك، وتعاين النتائج وتعدلها. بإمكانك التدرّب على كتابة الشيفرات والرموز عن طريق برامج التحرير التي تُتيح لك المعاينة، أو كتابة الشيفرات ومعاينتها عن طريق المتصفح، أو حتى عن طريق بعض مواقع الإنترنت التي تمكنك من ذلك.
أفضل مصادر تعلم CSS
تتوفر العديد من المصادر التي تُسهل لك عملية تعلم CSS بكل سهولة، عن طريق دروس وسلسلة شروحات متعددة، ومن أفضل هذه المصادر:
أكاديمية حسوب
تُعد أكاديمية حسوب أحد أفضل مصادر التعليم العربية، حيث تُتيح الأكاديمية للمستخدمين دروسًا وشروحات في مجالات عدّة منها البرمجة وريادة الأعمال والتصميم والعمل الحر وغيرها من المجالات. ومن المجالات العديدة الموجودة بالأكاديمية هي مجال تعلم CSS، وستجد عشرات الدروس المفيدة التي ستجعلك تتقن CSS وتتعلم خباياها ومهاراتها.
كما توفر الأكاديمية دورة “تطوير واجهات المستخدم من الألف إلى الياء” دون الحاجة لامتلاك أي معرفة سابقة بالبرمجة، وما يميز الدورة أنها عملية بالكامل، وهذا هو مفتاح تعلم أي شيء جديد، ليس المحتوى التعليمي إنما التطبيق العملي كمشاريع حقيقية مثل بناء متجر إلكتروني متكامل أو موقع شركة والتعامل مع الخدمات الخارجية مثل خرائط جوجل. تستمر الدورة على 18 ساعة ويحصل المتعلم بنهايتها على شهادة معتمدة من حسوب.
CodeCademy
يوفر موقع CodeCademy دروس وشروحات تعلم CSS من مرحلة التعرّف عليها حتى مرحلة الاحتراف. ومن أفضل مزايا الموقع تلك المساحة التي يوفرها لمعاينة نتيجة ما كتبت من أكواد ووسوم، يوفر أيضًا عدة مشاريع لإنجازها أثناء مدّة التعلم للتدريب.
Saylor.org
بعد المرور بعملية التسجيل البسيطة بالموقع، سيعبر بك Saylor.org عدة مراحل بدايةً من التعريف بأساسيات تعلم CSS و HTML عن طريق المواد المقروءة ومقاطع الفيديو، وكذلك يوفر لك بعض التدريب والتمارين للتأكد من إدراكك للمعلومات بالشكل الصحيح. وبانتهاء المنهج المحدد من قبل الموقع ستكون قد حصلت على قدر كبير من المعلومات، أدركه جيدًا وتأهّب للامتحان النهائي.
Mozilla Developer Network
يُوصى بشبكة موزيلا للمطوّرين MDN كمصدر جيد من أجل تعلم CSS من قبل المحترفين والمبتدئين على حد سواء، تعد هذه الدروس الموضّحة في الصورة السابقة دليلًا مفصّلًا لمن يريد دخول طريق تقنية CSS، فالدروس والشروحات تبدأ من التعريف بمعنى CSS وما أهميتها، ثم يبدأ في شرح المهام والخواص لـ CSS خطوة بخطوة حتى الاحتراف والإلمام بها.
The New Boston
بوجود أكثر من 4000 فيديو للشروحات في عدة مجالات، تعد قناة The New Boston من أفضل قنوات اليوتيوب لتعلم CSS، ولهذا فإن القناة تحظى بمتابعة أكثر من 2 مليون مشترك بها وقد حصلت على ملايين المشاهدات. تضم القناة شروحات تعلم CSS وHTML وGit وPython وSEO وLinux وWindows Command Line وغيرها من التقنيات ولغات البرمجة.
CodeCourse
بوجود أكثر من 300 ألف مشترك، تضم قناة CodeCourse دروس وشروحات لمجالات عديدة متعلقة بأساسيات البرمجة والتقنية وتصميم المواقع، وحصلت القناة على أكثر من 16 مليون مشاهدة.
DevTips
تضم قناة DevTips أكثر من 300 ألف مشترك مهتم بما تقدمه القناة من دروس وشروحات لمجالات عدّة، عشرات مقاطع الفيديو تشمل دروس في البرمجة والتقنية وتصميم المواقع.
1st Web Designer
تعد قناة 1st Web Designer وجهة أكثر من 50 ألف مهتم بشؤون تصميم المواقع وتطويرها، أكثر من 2 مليون مشاهدة للدروس التي تقدمها في هذا المجال ومختلف التقنيات مثل تعلم CSS وHTML وUI وUX وJavaScript.
Adam Khoury
أكثر من 100 ألف متابع لقناة Adam Khoury التي تضم مئات الشروحات في مجالات تقنية عديدة مثل جافا Java وجافا سكريبت JavaScript وHTML وCSS وغيرها من التقنيات. كما يمكنك متابعة بعض القنوات الأخرى التي ستستفيد منها حتمًا مثل Tuts + Web Design وLevelUpTuts وJream.
والآن، لديك كل ما تحتاجه حتى تتقن تعلم CSS، كل ما عليك هو التحلي بالشغف والمثابرة وتبدأ التعلم، ضع خطة واضحة لفترة التعلم والتدريب. ولا تنس مشاركتنا رحلتك في التعلم والمصادر الأخرى التي ساعدتك في تعلم CSS في التعليقات.
تم النشر في: تعلم البرمجة
الحقيقة موضوع رائع و شامل و مفيد .
وطبعا من أفضل الكورسات فيها الخاصه بالاستاذ اسامه صاحب قناه الزيرو من أفضل القنوات في تعليم لغات برمجة الويب
ومن أفضل المصادر اليوتيوب مثل عبد الرحمن جمال