تعلم تفكيكك صفحات ال html

لا بد من المران الجيد لكي تبدع كتابة كود HTML ولن يتأتى ذلك إلا بالدخول إلى صفحة الكود والتجريب فبها بالتعديل والإضافة والحذف .ويمكن الوصول لصفحة كود source بطريقتين : الأولى من خلال قائمة View > source أو المفاتيح وهي Ctrl+U في الفايرفوكس .. و Ctrl+F3 في الأوبرا .. .. ولكن هذه الطريقة بتفتح لنا صفحة داخل نافذة المتصفح فلا يمكن التعديل أو الكتابة فيها وإنما القراءة فقط .
والطريقة الثانية هي كليك يمين سواء بالماوس أو بالمفتاح بجوار مفتاح ألت الأيمن .. ثم فتح الملف ببرنامج المفكرة | نوت باد .. وحينها يمكنك الكتابة والتعديل على سبيل التجريب والتعلم .
وكذلك هناك طريقة ثالثة وهي أن تفتح الملف ببرنامج دريم ويفر ثم تطلب منه أن يعرض لك المستند مع صفحة الكود في نفس الوقت .
الآن سوف تحتاج لأداتين في منتهى الأهمية وهما وسيلة البحث داخل الصفحة عن كلمة ما وذلك بمفتاحي Ctrl+F واستبدال كلمة بكلمة أخرى وذلك بمفتاحي Ctrl+H .. .. والآن يمكنك أن تأخذ جولة داخل صفحة الكود لتتعرف على محتويات جزء الهيد وجزء البودي .
وعندما قمت بتطبيق ذلك على ملفات المنتدى وجدت مثلاً أن تاج table بيتكرر 20 مرة في الصفحات التي بها موضوع واحد بدون ردود .. أما في حالة وجود رد واحد حينها يتكرر تاج table 25 مرة .. وطبعاً ليست الجداول كلها فوق بعض ولكن أغلبها عبارة عن جداول داخل جداول .. .. كما أن بعض الجداول بيأخذ إسم رتبة | كلاس وهو tablebg .. فذهبت - كما يفعل المتصفح - إلى ملف الستايل الخارجي لكي أرى ما هي مواصفات كلاس tablebg فوجدت أن لون الخلفية هو #A9B8C2 وهو لون يميل للزرقة لأن C2 أقوى من B8 ومن A9 . وبنفس الطريقة يمكن دراسة باقي عناصر الصفحة .
ولا يفوتني أن أنصح من يريد أن يتقن لغة HTML أن يحتفظ بكشكول وأن يخصص صفحة لكل تاج من التاجز لكي يدوّن بها كل ما يقابله من أتريبيوت attributes لكل تاج .. وذلك أن عالم الأتريبيوت لا ينتهي .. وكل يوم هناك جديد .. وهذا أمر طبيعي مع التطور المتلاحق للمتصفحات .
أما الذين هجروا الورق وأصبح كل شغلهم ديجيتال فيمكنهم عمل ملف نوت باد لكل تاج .. ويجمعوهم في مجلد وليكن إسمه attributes & styles .
ويجب ملاحظة أن صياغة syntax الكود إذا أردنا إعطاء صفة أو قيمة لعنصر ما تختلف في الأتريبيوت عنها في الستايل .. فمثلاً خاصية إعطاء لون معين كخلفية للجدول إذا أردنا صياغتها كأتريبيوت فإننا نكتب bgcolor وإذا أردنا صياغتها كستايل فإننا نكتب background-color ... وكذلك خاصية وضع صورة كخلفية للجدول إذا أردنا صياغتها كأتريبيوت فإننا نكتب background أما إذا أردنا صياغتها كستايل فإننا نكتب background-image .
مع الأخذ في الإعتبار أننا في الأتريبيوت بنضع علامة يساوي بين الصفة والموصوف .. بينما بنضع بينهما نقطتين فوق بعضهما في حالة الستايل .
كذلك من الإختلافات الأخرى أننا بنفرق بين كل أتريبيوت والتالي بمسافة فاضية .. بينما في الستايل فنحن نفرق بينهما بفاصلة منقوطة .