إعتمد تقنية Css في موقعك ووفر الكثير

[العقيد ركن طيار]

السلام عليكم ورحمة الله وبركانه

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

- ما معنى تقنيّــة CSS ؟

يرمز لهذه التقنية بالأحرف " CSS " و هي إختصار للجملة Cascading Style Sheets والتي معناها باللغة العربية ( صفحات الأنماط الإنسيابية ) .

- ما الفائدة من هذه اللغة ؟

هل فكرت يومياً كيف يستطيع متصفح الانترنت (browser) فهم صفحات موقعك الـXML بوجود وسوم أنت مخترعها ؟
فكيف يعرف مثلاً أن الكمات الموجودة داخل الوسم تريد ظهورها بالخط المائل ؟
توجد عدة طرق لإخبار المتصفح بقيمة الوسوم وفي هذا الدرس نتعلم مبادئ أحد هذه الطرق
والتي تدعى CSS وهي أسهل طريقة موجودة لإخراج ملفات لغة الـ XML لشبكة الانترنت .

- ما هي مميزات هذه اللغة ؟

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

- ما هي فـــوائد هذه الـCSS ؟

-- الفائدة الاولى :
فصل البيانات عن التصميم : من أهم فوائد هذه التقنية بإنها تفصل المحتويات و المادة العلمية للموقع عن التصميم !
بحيث ان تكون لغة عمل صفحات الموقع سواء كانت HTML أو xHTML تحتوي على محتويات الموقع بإستخدام الأوسمة Tages كمثال
أوسمة ( div , body ... الخ ) و يحتوي ملف الـCSS على طريقة عرض هذه المحتويات ..
أي ان صفحات موقعك ستكون مرنه للغــاية .. فأنت كلما أردت التعديل على صفحات موقعك تعدّل على ملف الـCSS من دون المساس بصفحات
الـxHYML !

-- الفائدة الثانيه :
سهولة و سرعة تغيير و تعديل المحتويات و التصميم : بإمكانك تغيير جميع صفحات موقعك ( أو صفحتك ) من خلال ملف الـCSS
و من دون المساس بكـود xHTML .. كمثال انظر الموقع التــالي :: [فقط الأعضاء المسجلين والمفعلين يمكنهم رؤية الوصلات . إضغط هنا للتسجيل]
حاول إختيار أي تصميم آخر للموقع عن طريق القائمة اليمنى .. ستلاحظ بإن الذي يتغير فقط هو شكل الموقع ! و لا تتغير المحتويات و البيانات به و طبعاً
هذا نتيجة تغير ملف الـ CSS المرتبط بصفحات الموقع !

-- الفائدة الثالثه :
اختصار كود الـxHTML : الكثير من المواقع من يستخدم التصميم عن طريق الجداول Tables و لكن للأسف قد أصبحت هذه الطريقة
من الطرق الصعبة و المعقدة لكثرة أوسمة td و tr في كود الـHTML ، مما يصعب علينا الوصول لمعلومة معينه في الكود لتعديلها ..
لكن مع إستخدام الـ CSS سيكون كود الـxHTML مرتب و نظيف و سيقل بنسبة 60% ..

-- الفائدة الرابعة :
تقليل الاستهلاك من كمية نقل البيانات ( Bandwidth ) : كما أسلفنا بإن الـ CSS تقلل لك الكثير من كود الـxHTML فسيقل بالـتأكيد
حجم صفحات الـHTML مما يقلل من كمية البيانات Bandwith الذي يستهلك من موقعك .. و ستلمس الفرق الكبير اذا كان موقعك كبير جداً !

-- الفائدة الخامسة :
سهولة التحكم بمظهر موقعك : بالتأكيد بعد ان تمارس و تعتمد لغة CSS ستستطيع التحكم بجميع أمور تصميم موقعك و حتى أدق التفاصيل به بكل سرعة و سهولـة !


- هل تقنية الـ CSS متوافقة مع جميع المتصفحات ؟ و ما هي مشاكلها ؟

نعم بالطبع جميع المتصفحات تستطيع التعامل و فهم تطبيقات الـ CSS على إختلاف مستوياتها .. إذاً لا داعي للقلق !
أما بالنسبة لمشاكلها فليس لها أي مشاكل تذكر مع أي متصفح سوى مشاكل صغيرة جداً و يمكن التغلب مع متصفح
Internet Explorer و هي في الحقيقة لا أعتبرها مشاكل ، كمثال :
أن السطر في هذه اللغة يجب أن لا يبدأ بالرمز النجمة ( * ) لكن لو كتبنا التالي في ملف الـ CSS التابع للصفحـــة

فإن جميع المتصفحات لن تستطيع قرائتها ! إلا ان متصفح IE سيقوم بقرائتها و سيقوم بعمل خلفية الصفحة حمراء !!
هذه بعض المفارقات البسيطة و المؤمل حلّها في النسخة الجديدة من هذه المتصفح إن شاء اللـــه ..

الآن و بعد ان ادركت ما هي تقنية الـ CSS و أهم فوائدها ، أظن انك تشوقت لمعرفتها و تحويل موقعك إلى إليها ، أليس كذلك ..
إليك أفضل هذه المواقع لتعليم هذه اللغــة السهلة و الرائعــة :

1- [فقط الأعضاء المسجلين والمفعلين يمكنهم رؤية الوصلات . إضغط هنا للتسجيل]
2- [فقط الأعضاء المسجلين والمفعلين يمكنهم رؤية الوصلات . إضغط هنا للتسجيل]
3-[فقط الأعضاء المسجلين والمفعلين يمكنهم رؤية الوصلات . إضغط هنا للتسجيل]
4- [فقط الأعضاء المسجلين والمفعلين يمكنهم رؤية الوصلات . إضغط هنا للتسجيل]

ملاحظة : تم تجميع هذا المقال من عدة مصادر و التصرف بها أهمها - شبكة المصمم و سوالف سوفت


كل الحب والتقدير

العقيد ركن طيار