DIVs مقابل TABLEs الردف من فضلك

هناك الكثير من الناس يسألون "لماذا لا نستخدم الجداول لهيكلة HTML لدينا" وبينما تأتي الكثير من الإجابات ، نادرا ما أرى أي شخص يتم تحويله إلى عالم الدلالات. ومع ذلك ، فإنني لم أر أي اعتراضات مقنعة لدعم الأساس المنطقي لماذا يجب علينا (أو ربما) استخدام الجداول.

أي شخص يهتم بعرض المنطق عندما تكون الجداول عبارة عن علامات هيكلية صحيحة؟


7 نوفمبر 2008

وبالنظر إلى أن هذا السؤال لم يذهب بعيدا كما اعتقدت ، سأفترض أنه من الأفضل توضيح سؤالي وشرح وجوده.

من خلال الإحباط بعد قراءة حجة "جداول أسهل" مرة واحدة عدة مرات في أعقاب السؤال "DIVs مقابل TABLEs" كنت أرغب في فضح السؤال أكثر قليلا وعدم السماح لعشاق المائدة الحصول على إيقاف هوك بسهولة.

قد يقول كلٌّ من الأشخاص الآخرين ، ولكنني أُعطي إلى الأبد بعض التطبيقات لوضعها على مواقعنا التي تم إنشاؤها بواسطة بعض "المطورين هم أسهل" مطورًا يفرغ جزءًا من HTML المضحك إلى صفحاتي ، ولأكون صادقًا ، لا أرى ما يكفي من محبي المائدة الذين يستمعون إلى الحجج.

أي شخص يستخدم مامبو مرة أخرى في اليوم؟ أي شخص اضطر إلى اتخاذ bash في وضع تصميم على رأس Sharepoint مايكروسوفت؟ كان من الضروري أن أقاتل طريقك من خلال كل تلك الأشياء المتداخلة الجحيحة ، مع الأخذ في الاعتبار أنها كانت مكتوبة من قبل بعض المبرمجين الداميين الذين يزعجونني. لقد كان الترميز الدلالي المعقول موجودًا لفترة طويلة بما فيه الكفاية حتى لا يكون هناك سبب يدعو المطورين إلى تأييد "الجداول أسهل". الجداول ليست أسهل - فهي كسولة!

استحق سؤالي ممثل سلبي للطريقة السلبية التي قدمت بها ، ولكن ما زلت في انتظار أن يقبل الناس أن السبب الوحيد الذي يستخدمونه الجداول هو لأنهم لا يعرفون HTML. لأنه إذا فعلوا ذلك ، فهم سيفهمون ، كما يقول jjrv ، أن الجداول مخصصة للبيانات المجدولة.

0
وأضاف تحرير
الآراء: 1
يرجى طرح الأسئلة التي يمكن الإجابة عليها ، وليس مجرد مناقشتها (من صفحة طرح الأسئلة)
وأضاف المؤلف Peter Hilton, مصدر
لقد رأيت هذا يثير الكثير من الأسئلة في المستوى السفلي: لقد ألهم سؤالك ردودًا رائعة (بعضها وصل إلى +13) ، ولكن تم حفظه في -6. يرجى التصويت على هذا السؤال الفقير!
وأضاف المؤلف Dan Rosenstark, مصدر
وأنا أتفق معAviewAnew - هذا السؤال غريب ، نظرا لإجابتك لهذا الموضوع نفسه بالضبط أمس.
وأضاف المؤلف delfuego, مصدر

9 إجابة

الجداول للمطورين الذين لا يمكن إزعاجهم لعزفهم على ساعات مع CSS للحصول على قسمي columnesque مجاورين للتوسع إلى 100٪ ارتفاع وعرض بغض النظر عن المحتوى ، ثم الحصول على hack للعمل في جميع المتصفحات دون إضافة أغلفة div إضافية ثم أخيرا في مطلق الإحباط يلجأون إلى الإصلاح 5 ثانية:

<table width="100%">
<tr><td valign="top">Left nav</td><td valign="top">Main content</td></tr>
</table>

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

لدى المطورين قيود للميزانية والوقت و CSS و "جيد" يستغرق وقتًا.

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

يجب أن تجلب لنا شفرة HTML5 بعض الدقة مع العنوان الجديد ، وتذييل الصفحة ، والجزء ، والتنقل ، والعلامات الجانبية. مثال مأخوذ من Nettuts +:

<div id="content">
    <div id="mainContent">
        
<!-- Blog post -->
 
        
<!-- Comments -->
 
        <form>
            <!-- Comment form -->
        </form>
    </div>
    
 
</div>

ثم هذا لـ CSS:

#content {
    display: table;
}

    #mainContent {
        display: table-cell;
        width: 620px;
        padding-right: 22px;
    }

    aside {
        display: table-cell;
        width: 300px;
    }

هؤلاء منكم بعيون حريصة سيحبون الإحساس بالسخرية ، عندما تلاحظ أن CSS لها الخصائص: display: table؛ و display: table-cell؛ .

الجداول تعود مرة أخرى! تسلل من خلال الباب الخلفي لـ HTML5 ؛ -)

0
وأضاف
عرض: الجدول والعرض: خلية الجدول لا علاقة مع HTML5 ، وكانت موجودة لفترة طويلة (على الرغم من عدم تنفيذها بشكل جيد).
وأضاف المؤلف Matt Sach, مصدر

الجداول صالحة عندما يكون لديك جدول بيانات. رأيت أدوات الشبكة التفاعلية حيث يخرجون من طريقهم لاستخدام مجموعة من divs لتجنب علامة الجدول اللعين. عندما تكون البيانات مجدولة ، اجعلها جدولاً.

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

0
وأضاف

يتم دعم الجداول حتى في متصفحات HTML v1.0 القديمة. إذا كان السوق المستهدف يشمل الأشخاص الذين يستخدمون متصفحات مضمنة في الهواتف المحمولة من التسعينيات ، فقد يكون ذلك سببًا جيدًا للذهاب إلى الجداول.

يستخدم الكثير من HTML الحالي الذي تم إنشاؤه تلقائيًا الجداول. إذا كانت شفرتك تحتاج إلى التفاعل مع تلك الجداول أو تضمينها ، فمن الأفضل أن تكون متناسقًا.

0
وأضاف
النقطة الكاملة للترميز الدلالي و CSS هي أن صفحتك ستظل منطقية ، حتى في متصفح HTML v1 قشري قديم. ستعطيك الجداول التناقضات والكوابيس. عناوين جيدة والفقرات ، وهذا سوف يعطيك pae منظم بشكل جميل يجعل من المنطقي تماما.
وأضاف المؤلف roryf, مصدر
لم تتم إضافة الجداول إلى HTML حتى HTML 3.2.
وأضاف المؤلف Jim, مصدر

أود أن أقول أن jjrv هو حق في أن الجداول ممتازة للبيانات المجدولة ، والخروج من طريقك لجعل شيء "العمل" مثل الجدول بدلا من مجرد استخدام الجدول هو الحد الفاصل المتخلف.

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

إذا كنت بحاجة إلى التعامل مع المتصفحات القديمة بالفعل ، وهذا هو قبل ie6 اللعين ، ثم سيكون لديك الكثير من المشاكل في المغلق ، وبالنظر إلى إحصاءات الاستخدام الحالية آمن جدا لنفترض أن كل شخص سيكون لديه متصفح "حديث" يدعم تنسيقات CSS.

كل هذا يقال وهي أوقات عندما تضرب رأسك بالحائط على تخطيط وترغب/تقول من خلاله في جدول ويعمل. آمل أن تكون هذه ممارسة متوقفة ، ولكن في هذا الحَلَث يعطي نتائج متوقعة.

0
وأضاف

إن استخدام الترميز الدلالي الحديث يكون أسهل بكثير عند إضافة ميزات أو إصلاح الأخطاء أو تغيير مظهر موقع ويب معتمد على البيانات. إضافة ميزات AJAX أو أي نوع من البرامج النصية التفاعلية ستعمل بشكل أفضل مع DIVs و CSS أكثر من TABLE.

سيكون من السهل جدًا الانتقال إلى مدير محتوى مثل دروبال أو جملة أو WordPress أو ما شابه ذلك إذا كنت مُنظَّمًا باستخدام الترميز الدلالي أيضًا.

ستدعم إصدارات المتصفح الجديد أيضًا ترميزًا حديثًا بكفاءة أكبر وسيتم عرض موقعك بشكل أسرع. يمكن أن يؤدي إعادة ترتيب كل تلك الجداول إلى أوقات عرض بطيئة.

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

أما بالنسبة للترميز البنيوي الصحيح ، فهناك: الجداول هي طريقة رائعة لعرض البيانات المجدولة ، مثل جداول البيانات أو جداول البيانات. فهي ليست ترميزًا صالحًا لأي شيء آخر.

0
وأضاف

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

0
وأضاف

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

0
وأضاف

تتعلق ملاحظة مهمة بتطبيقات جافا سكريبت شديدة التعقيد. إذا اخترت Gmail أو تقويم Google باستخدام Firebug ، فسترى أن الجداول مستخدمة على نطاق واسع ، حتى بالنسبة للتخطيط. ومن المسلم به أنه عادة ما يتم توليدها ديناميكيًا ولكن هذا يوضح أنه في حالات نادرة ، تكون بعض واجهات المستخدم التفاعلية المعقدة للغاية معقدة بصعوبة بالغة باستخدام وحدات DIV فقط.

0
وأضاف

الطاقة المتجددة: لماذا الجداول؟

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

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

ويبقى عالمهم سعيدًا وغير متغير ، ويتلاشى أكثر في الماضي وأعمق في التقادم *

وهذا هو "لماذا الجداول". النهاية.

(* فيما عدا أنها مناسبة تمامًا لرسائل HTML البرمجية)

0
وأضاف