سؤال

هل يُنصح باستخدام الجداول في صفحات HTML (الآن بعد أن أصبح لدينا CSS)؟

ما هي تطبيقات الجداول؟ما هي الميزات/الإمكانيات الموجودة في الجداول غير الموجودة في CSS؟

أسئلة ذات صلة

هل كانت مفيدة؟

المحلول

لا - على الاطلاق.لكن استخدم الجداول للبيانات الجدولية.فقط لا تستخدمها للتخطيط العام.

ولكن إذا قمت بعرض بيانات جدولية، مثل النتائج أو ربما حتى نموذج، فاستمر في استخدام الجداول!

نصائح أخرى

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

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

الآن، الخيار ب.استخدم طاولة.اقضي حوالي 30 ثانية في كتابة علامتي <tr> و<td>، وربما لا تحتوي على CSS على الإطلاق، ولا يوجد "إصلاح" لجافا سكريبت، واعرف بالضبط كيف سيبدو بمجرد النظر إلى HTML.

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

لقد قال الجميع حتى الآن كيف يجب استخدام الجداول فقط للبيانات الجدولية، وهذا صحيح.ألقِ نظرة على مصدر HTML لأي صفحة على SO وسترى أن لديهم فكرة مختلفة...

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

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

يتمتع CSS2 بدعم لإنشاء تخطيطات شبكة مرنة دون استخدام table العنصر عبر خاصية العرض, ، ولكن هذا هو غير مدعوم في IE6 أو IE7.

ومع ذلك، بالنسبة لمعظم تخطيطات النماذج الأساسية، يجب أن يكون CSS كافيًا.

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

يمكن لجميع المتصفحات الاتفاق على كيفية وضع الجدول بالضبط.بام.منتهي.

وإليك كيف تسير حماقات CSS الخاصة بي عادةً:حاول إعداد تخطيط يشبه الجدول في CSS.اقض 20 دقيقة أو أكثر في الحصول على كل شيء في Mozilla ثم افتحه في IE.اقضِ 30 دقيقة أخرى في التغيير والتبديل بين هذين المتصفحين.تظاهر وكأن هناك متصفحين فقط في العالم لأنني في الواقع بحاجة إلى إنجاز بعض الأعمال.

أنا أؤمن بوعد CSS:فصل المخاوف.المشكلة هي أنه بالنسبة لأولئك الذين يحتاجون إلى أن يكونوا منتجين، فإن CSS ليس جاهزًا للعمل في أوقات الذروة.أو ربما تكون محركات العرض للمتصفحات - أيهما.

تكمن فائدة CSS في أنها تفصل التصميم والتخطيط عن المحتوى.

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

الجداول مخصصة لإخراج البيانات الجدولية.أي شيء قد تعرضه في جدول بيانات، أو أعمدة النتائج، أو هذا النوع من الأشياء.

إن اقتراح استخدام CSS بدلاً من الجداول مخصص للتخطيطات العمودية، والتي لم تكن في الحقيقة جداول فعلية.لم يكن القصد أبدًا اقتراح إزالة الجداول بالكامل.

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

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

أنا أعمل في شركة مالية كبيرة جدًا ونقوم بتتبع حوالي 600 وظيفة مختلفة شهريًا.... العديد منها عبارة عن حملات بريد إلكتروني متعددة.

لا يمكنك استخدام CSS للتخطيط لأي قارئ بريد.هناك عدد قليل من مواصفات CSS المضمنة التي يمكنك استخدامها والتي تتعلق باللون وشكل الخط وحجمه وحتى ارتفاع الخط متاحة على نطاق واسع إلى حد ما ولكن بالنسبة للتخطيط، يجب عليك استخدام الجداول مثل جميع برامج قراءة البريد الإلكتروني الرئيسية والثانوية (Outlook 97/ 03، Entourage، MSN إلخ) قراءتها جيدًا.

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

لذا، إذا كنت تعمل في شركة/مؤسسة كبيرة أو حصلت على عميل كبير جدًا، فكن مستعدًا للتخلص من كل التقنيات الحالية واحصل على قبعة html الخاصة بك!

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

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

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

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

عندما يتم الدفع لك مقابل تطوير موقع، فإن جزءًا من مسؤوليتك هو التخفيف من المخاطر المستقبلية وتقليل تكاليف التطوير المستقبلية، خاصة إذا كانت هذه التكاليف لا تضيف قيمة إلى الموقع (منتجك).

رأيي البسيط والأساسي في هذا الشأن هو أن الجداول موجودة للبيانات الجدولية - وليس لوضع شيء ما في الأعلى أو بجوار عنصر آخر لأنك تحب وجوده هناك.

لذلك - إذا كنت تريد عرض جدول البيانات:افعل ذلك (مع طاولة).إذا كنت تريد وضع المحتوى على الصفحة:استخدم المغلق.

أعتقد أنك قد تكون مرتبكًا بعض الشيء.CSS هي طريقة لتصميم مستندات HTML، سواء كان ذلك عنصر جدول أو "div".

كان من المعتاد استخدام الجداول في HTML لتصميم تخطيط الصفحة بالكامل.كان من الشائع رؤية العديد من الجداول المتداخلة (عادةً ما يتم إنشاؤها بواسطة برامج WYSIWYG مثل Dreamweaver)، مما يؤدي إلى كابوس الصيانة.

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

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

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

هث

أعتقد وآمل أن يكون عصر استخدام الجداول للتخطيط قد انتهى.ببساطة: الطاولة هي الطاولة، لا شيء آخر.

ما أعتقد أنه سيكون موضوع حرب اللهب الجديد والمشابه في السنوات القليلة القادمة هو:هل يجب أن أستخدم ميزة CSS الجديدة؟ عرض: طاولة, خلية الجدول, صف الجدول إلخ.للتخطيط؟؟؟:-)

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

ردًا على وسيطة "البنية"... بحكم التعريف، لا يتم استخدام جداول html التي تعطي بنية للبيانات بحيث يمكنك تعريفها على أنها "جدولية".سواء كان ذلك باستخدام CSS أو html، فأنت تتحكم في تدفق البيانات وتخطيطها.سواء كانت جدولية أو غير ذلك..

إذا كانت جداول CSS مهمة جدًا (وأنا متأكد من أن إجابتي ستبدأ نوعًا من حرب اللهب) فلماذا لا توجد آلية في Visual Studio لإنشاء تخطيط باستخدام CSS؟أوه، أنت لم تتحقق من ميزة التخطيط في VS؟نعم، يمكنك الحصول على الجداول مباشرة من Microsoft.أنا لا أشكو، فقط أوضح أنه إذا كان ذلك يعني الكثير لبقية العالم فسوف ترى MS يتحول إلى CSS.

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

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

IMHO، يجب استخدام الجداول فقط عند تقديم الجداول.أبدا لأغراض التخطيط.

تستخدم الجداول لعرض البيانات الجدولية.ليس هناك الكثير لأضيفه :-D

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

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

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

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

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

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

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

نصيحة أخرى هي استخدام الجدول فقط مع الحد > 0.بهذه الطريقة، يمكنك استخدام الجداول فقط عندما يقصد تريد جدولاً (وليس للتخطيط).

@ toddhd، إن الدعوة إلى استخدام الجداول للتخطيط لمجرد توفير الوقت هو أمر غير مقبول.إذا كان الوقت هو المشكلة، فيمكنك إنشاء تخطيط عمودي بسرعة بدون جداول باستخدام إطار عمل مثل مخطط CSS أو 960 الشبكة.

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

أنا لا أحب الاستمرار في فعل نفس الأشياء مرارًا وتكرارًا لأنها سهلة وأعرف كيفية القيام بها. هذا أمر ممل.أفضل أن أتعلم تقنيات جديدة بدلاً من رفض شيء ما لأنني لا أعرف كيفية استخدامه أو أعتقد أنه ليس لدي الوقت للتعلم.

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

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

تكون الجداول منطقية فقط عندما تحاول عرض البيانات الجدولية وهذا كل شيء.بالنسبة للتخطيطات، يجب عليك دائمًا استخدام DIVs والتلاعب بمواضع CSS.

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

كثير من الناس يتداولون مصطلح "نقي".هذا هو القمامة.هل ستطبع نسخة من الجريدة في كتاب؟هل يمكنك تصميم كتيب باستخدام برنامج Excel؟لا؟إذن لماذا تستخدم جدولاً لعرض البيانات غير الجدولية؟

في معظم الأوقات، تكون الصعوبات التي يواجهها الأشخاص في التخلي عن الجداول للتخطيط نتيجة لجهلهم بمبادئ HTML/CSS/التصميم الجيد.على الرغم من أنك قد تجد صعوبة في جعل التخطيطات متعددة الأعمدة تمتد بشكل متساوٍ في الاتجاه الرأسي، فقد تفكر في تجربة طريقة مختلفة.DIVs ليست جداول.يمكنك إنشاء أعمدة زائفة باستخدام حدود عريضة وخلفيات صفحات وما إلى ذلك.اقض بعض الوقت في تعلم فعل ما تنوي القيام به، أو سيُنظر إليك إلى الأبد كشخص ليس لديه أي نوع من المهارات المفيدة.(http://www.alistapart.com ستكون بداية جيدة)

أنا مندهش بصراحة من ظهور هذا السؤال في عام 2008.ظهرت DIVs عندما كنت في المدرسة الثانوية.التوقف عن كونك مستجد.

وكما ذكر أعلاه، تفشل الجداول بشدة على الأجهزة المحمولة وأجهزة قراءة الشاشة.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top