تعلم الكتابة CSS يمكن أن تكون التخطيطات خادعة ، خاصة إذا كنت معتادًا على استخدام الجداول لإنشاء تخطيطات رائعة لصفحات الويب. ولكن في حين HTML5 يسمح للجداول بالتخطيط ، إنها ليست فكرة جيدة.
لا يمكن الوصول إلى الجداول
مشابه ل محركات البحث، فإن معظم برامج قراءة الشاشة تقرأ صفحات الويب بالترتيب الذي تظهر به في HTML ، وقد يكون من الصعب جدًا على برامج قراءة الشاشة تحليلها. المحتوى الموجود في تخطيط الجدول ، بينما يكون خطيًا ، لا يكون دائمًا منطقيًا عند القراءة من اليسار إلى اليمين ومن أعلى إلى أسفل. بالإضافة إلى ذلك ، باستخدام الجداول المتداخلة والمسافات المختلفة على خلايا الجدول يمكن أن يجعل اكتشاف الصفحة أمرًا صعبًا.
هذا هو السبب في أن مواصفات HTML5 توصي ضد جداول للتخطيط ولماذا لا يسمح HTML 4.01 بذلك. تسمح صفحات الويب التي يمكن الوصول إليها لمزيد من الأشخاص باستخدامها وهي علامة للمصمم المحترف.
باستخدام CSS ، يمكنك تحديد قسم على أنه ينتمي إلى الجانب الأيسر من الصفحة ولكن يمكنك وضعه في الجزء الأخير في HTML. ثم تقرأ برامج قراءة الشاشة ومحركات البحث على حد سواء الأجزاء المهمة (المحتوى) أولاً والأجزاء الأقل أهمية (التنقل) أخيرًا.
الجداول صعبة
حتى إذا قمت بإنشاء جدول باستخدام محرر ويب ، فستظل صفحات الويب الخاصة بك معقدة ويصعب صيانتها. باستثناء أبسط تصميمات صفحات الويب ، تتطلب معظم جداول التخطيط استخدام الكثير من السمات والجداول المتداخلة.
قد يبدو بناء الطاولة سهلاً أثناء قيامك بذلك ، ولكن بمجرد الانتهاء من ذلك ، ستحتاج إلى صيانته. بعد ستة أشهر ، قد لا يكون من السهل تذكر سبب تداخل الجداول أو عدد الخلايا الموجودة في الصف وما إلى ذلك. ناهيك عن أنه إذا كنت تحتفظ بصفحات الويب كعضو في الفريق ، فعليك أن تشرح للجميع كيفية عمل الجداول أو تتوقع منهم أن يأخذوا وقتًا إضافيًا عندما يحتاجون إلى إجراء تغييرات.
يمكن أن تكون CSS معقدة أيضًا ، ولكنها تحافظ على العرض التقديمي منفصلاً عن المحتوى وتجعل من السهل الحفاظ عليه على المدى الطويل. بالإضافة إلى ذلك ، باستخدام تخطيط CSS ، يمكنك كتابة ملف CSS واحد وتصميم جميع صفحاتك لتبدو بهذه الطريقة. ثم عندما تريد تغيير تخطيط موقعك ، يمكنك ببساطة تغيير ملف CSS واحد ، والكل تغييرات الموقع — لن تمر بعد الآن في كل صفحة واحدة في كل مرة لتحديث الجداول لتحديث نسق.
الجداول غير مرنة
في حين أنه من الممكن إنشاء تخطيطات جدول ذات عروض نسبية ، إلا أنها غالبًا ما تكون أبطأ في التحميل ويمكن أن تغير شكل التخطيط الخاص بك بشكل كبير. ولكن إذا كنت تستخدم عروض محددة لجداولك ، فسينتهي بك الأمر بتخطيط صارم للغاية لن يبدو جيدًا على الشاشات ذات الأحجام المختلفة عن تلك الخاصة بك.
يعد إنشاء تخطيطات مرنة تبدو جيدة على العديد من الشاشات والمتصفحات والدقة أمرًا سهلاً نسبيًا. في الواقع ، باستخدام استعلامات وسائط CSS ، يمكنك إنشاء تصميمات منفصلة لشاشات مختلفة الأحجام.
الجداول تضر محرك البحث الأمثل
يستخدم التخطيط الأكثر شيوعًا الذي تم إنشاؤه بواسطة الجدول شريط تنقل على الجانب الأيسر من الصفحة والمحتوى الرئيسي على اليمين. عند استخدام الجداول ، يتطلب هذا الأسلوب (بشكل عام) أن يكون المحتوى الأول الذي يتم عرضه في HTML هو شريط التنقل الأيمن. تصنف محركات البحث الصفحات بناءً على المحتوى ، وتحدد العديد من المحركات أن المحتوى المعروض في أعلى الصفحة أكثر أهمية من المحتوى الآخر. لذلك ، ستظهر الصفحة ذات التنقل الأيسر أولاً أنها تحتوي على محتوى أقل أهمية من التنقل.
باستخدام CSS ، يمكنك وضع المحتوى المهم أولاً في HTML الخاص بك ثم استخدام CSS لتحديد المكان الذي يجب وضعه في التصميم. هذا يعني أن محركات البحث سترى المحتوى المهم أولاً ، حتى لو وضعه التصميم في أسفل الصفحة.
لا تطبع الجداول جيدًا دائمًا
لا تتم طباعة العديد من تصميمات الجداول بشكل جيد لأنها ببساطة واسعة جدًا بالنسبة للطابعة. لذلك ، لجعلها مناسبة ، قامت المستعرضات بقص الجداول وطباعة الأقسام أدناه مما أدى إلى فصل الصفحات. في بعض الأحيان ينتهي بك الأمر بصفحات تبدو على ما يرام ، لكن الجانب الأيمن بالكامل مفقود. ستطبع صفحات أخرى أقسامًا على أوراق مختلفة.
باستخدام CSS ، يمكنك إنشاء ورقة أنماط منفصلة فقط لطباعة الصفحة.
جداول التخطيط غير صالحة في HTML 4.01
ال حالات مواصفات HTML 4: "لا ينبغي استخدام الجداول فقط كوسيلة لتخطيط محتوى المستند لأن هذا قد يؤدي إلى مشاكل عند التقديم إلى الوسائط غير المرئية."
لذلك ، إذا كنت تريد كتابة HTML 4.01 صالح ، فلا يمكنك استخدام الجداول للتخطيط. يجب عليك فقط استخدام الجداول للبيانات المجدولة ، وتبدو البيانات المجدولة عمومًا كشيء قد تعرضه في جدول بيانات أو ربما في قاعدة بيانات.
ومع ذلك ، غيّرت HTML5 القواعد والآن تعتبر جداول التخطيط ، على الرغم من عدم التوصية بها ، HTML صالحة. تنص مواصفات HTML5 على ما يلي: "لا يجب استخدام الجداول كأدوات مساعدة في التخطيط." وذلك لأن جداول التخطيط يصعب على برامج قراءة الشاشة التمييز بينها ، كما ذكرنا سابقًا.
يعد استخدام CSS لتحديد موضع صفحاتك وتخطيطها هو طريقة HTML 4.01 الصالحة الوحيدة للحصول على التصميمات التي استخدمتها لاستخدام الجداول في الإنشاء ، ويوصي HTML5 بشدة بهذه الطريقة أيضًا.