HTML: لماذا يفضل استعمال DIV ليس Table؟

لماذا يفضل استعمال DIV ليس Table

مرحبا بكم، اسمي محمد بن جامع وسأكون معكم على موعد أسبوعيا بمقال تقني في مختلف مجالات تصميم وإدارة المواقع، أرجوا الله العلي القدير أن يعم بنفعه وأن يكتبه سببا في تطور هذا المجال والإرتقاء به.
يدرك الكثير من مصممي المواقع والذين اعتادوا منذ زمن طويل على استخدام برنامج الفوتوشوب لتصميم مواقع عملائهم أن خطوة انتقالهم من عالم التحويل التلقائي (من صيغة PSD إلى صفحات HTML) نحو عالم لـ CSS باتت تشكل العائق الأكبر نحو تقدمهم في عالم تصميم الويب، دوما كان الأمر ببساطة أن يصمم ثم يقطع التصميم بأداة Slice ثم يتوجه إلى ذلك الزر السحري الذي يحول تصميمه إلى صفحة HTML متجاوزا بذلك كل ماقد يسبب له الصداع خلف ظهره، ولكنه طالما تمنى أن يكون الوضع بمرونة وإمكانيات أكبر كالتي يتمتع بها زملاؤه الذين يتقنون CSS ومع ذلك غالبا ما يجد حيلة لتأخير اتخاذ ذلك القرار بتعلمها.

كل من يمارس هذه الطريقة يعلم أن برنامج الفوتوشوب يتبع طريقة عرض محتويات الشرائح داخل خلايا جدول لتتحول الصفحة التي تم تصميمها إلى جدول كبير متعدد الخلايا والأعمدة، وهذا ما أثبت أنه عادة سيئة لدى المصممين وغير فعالة وتحمل العديد من جوانب القصور، كثيرا ما يتساءل البعض عن لماذا يعتبر التصميم بهذه الطريقة أمرا غير محبذ ولم يعتبر استخدام DIV تاج الخيار الأمثل في التصميم، كثيرا ما نسمع كبار المصممين والمبرمجين يرددون وينصحون بهذا، إليكم بعضا من هذه الأسباب:

بطء قراءة المتصفحات للجداول:

كانت هناك حيلة قديمة لدى المصممين بتلك الطريقة بأن يحددوا أبعاد كل خلية في الجدول لتسريع قراءة المتصفحات لهيكل الجدول وإظهاره بشكل أسرع، ومع أنها ساهمت في رفع أداء القراءة لهذا النوع بالفعل إلا أنه مازال هنالك فرق كبير نسبيا بين سرعة قراءة المتصفحات عموما للجداول وبين الـ DIV.

سوء مظهر عملية التحميل للجداول:

من المعروف وبالذات بين أصحاب الإتصال البطيء بالإنترنت أن عملية تحميل موقعٍ سبق وأن صمم بواسطة الجداول تبدوا غير محببة وغريبة نوعا ما، وهذا ما قد يعطي انطباعا سلبيا نحو تصميم الموقع وإن كان فعليا جميل الشكل وعملي الاستخدام.

لماذا يفضل استعمال DIV ليس Table




تقليل وزن الصفحة:

استعمال الجداول ينتج عنه الكثير من التفاصيل داخل نص الكود مما يرفع الوزن لصفحات الموقع والذي بدوره يؤثر سلبا على سرعة تحميل الصفحة وعلى معدل استهلاك البيانات (الترافك).

امتلاك الـ DIV تاج مرونة أكبر:

عند استخدام الـ DIV تاج نجد أن التكامل ما بينه وبين كل من صفحات التنسيق CSS والنصوص البرمجية المكتوبة بلغات أخرى كالـ PHP و JavaSicrpt تحمل مرونة أكبر وقدرا أقل من التعقيد.

سهولة التعديل لاحقا:

غني عن الذكر مرونة المواقع التي تستخدم حاويات DIV من ناحية سهولة إعادة التعديل والإضافة على النص بعكس الجداول التي يعتبر ايجاد الجزء المراد التعديل عليه ضربا من التعذيب.

DIV تاج صديق لمحركات البحث:

يدرك محترفوا  SEO أو ما يسمى مجازا صداقة محركات البحث أن إعداد الموقع لأداء أفضل مع محركات البحث والتعديل في الـ HTML لملائمة محركات البحث يكون أسهل وأكثر جدوى في المواقع التي تعتمد على DIV تاج في بنية الصفحة بمراحل من التي تعتمد على الجداول.
قد يكون البعض متخوفا من تغيير نمط تعود عليه لفترة طويلة، لكني أعد جميع من يصمم المواقع بواسطة الجداول فيما لو فرغ من وقته القليل لتعلم الـ HTML و CSS بحال أفضل وعمل أكثر احترافية ومرونة، ومن حسن الحظ أنها من السهولة بحيث تدخل من هنا لتتعلم كل هذه التقنيات في وقت قصير وبشكل ممتع.