HTML-də yerləşdirilmə üçün masaları niyə istifadə etmirsiniz?

Göründüyü kimi, ümumi konsensus , cədvəllər HTML-də yerləşdirilməməsi üçün istifadə edilməməlidir.

Niyə?

Mən heç vaxt (və ya nadir, dürüst) bu üçün yaxşı arqumentlər görmüşəm. Normal cavablar:

  • Yaxşı layout məzmunu
    Ancaq bu yanlış bir mübahisə; Cliche Düşüncə . Hesab edirəm ki, düzəldilmə üçün bir masa elementindən istifadə cədvəlli məlumatlarla çox azdır. Yəni nədir Patronum kömək edirmi? İstifadəçilərim kömək edirmi?

    Bəlkə də mənə və ya bir web səhifəsinin saxlanmasına dəstək vermək lazım olan yoldaşlarımın ... Masa daha az qorumalı mı? Bir tablo istifadə div və CSS istifadə daha asan hesab edirəm.

    Yeri gəlmişkən ... niyə bir div və ya span məzmunun layoutdan yaxşı bir şəkildə ayrılması və masa deyil? Yalnız divs istifadə yaxşı bir layout əldə çox tez-tez iç içə divs tələb edir.

  • Kod oxu
    Mən bunun əksini düşünürəm. Çox insan HTML anlayır, az CSS başa düşür.

  • SEO üçün elektron tablolar istifadə etməmək yaxşıdır
    Niyə? Hər kəs bu barədə belə bir sübut göstərə bilərmi? Və ya Google-dan SEO baxımından cədvəllər cəlbedici bir ifadə?

  • Masalar yavaş.
    Əlavə tbody elementini əlavə etməlisiniz. Bu, müasir veb brauzerlər üçün bir fıstıqdır. Bir tablo istifadə edərək, səhifəni xeyli yavaşlatan bəzi testləri göstər.

  • Layihə masalarsız yenidən qurulub , bax css Zen Garden .
    Yeni məzmunu (html) yeniləmək məcburiyyətində qalan bir çox sayt. Veb saytın yeni bir versiyasının yalnız yeni bir CSS faylına ehtiyacı olduğu ssenarilər ehtimalı yoxdur. Zen Garden yaxşı bir veb saytdır, ancaq bir az nəzəri. CSS-nin düzgün istifadə edilməsindən söz etməmək.

Mən cədvəllərin yerinə divs + CSS-i istifadə etmək üçün yaxşı arqumentlər ilə maraqlanıram.

665
17 сент. Benno Richters tərəfindən təyin olunan 17 sentyabr. 2008-09-17 16:19 '08 at 4:19 pm 2008-09-17 16:19
@ 90 cavab
  • 1
  • 2
  • 3

Mən sizin arqumentlərinizi tək-tək analiz edəcəyəm və onlarda səhv göstərməyə çalışacağam.

Məzmunu düzəltmədən ayırmaq yaxşıdır, amma bu yanlış bir mübahisədir; Cliche Düşüncə.

Bu, səhv deyil, çünki HTML xüsusi olaraq hazırlanmışdır. Elemanın qeyri-qanuni istifadəsi tam ola bilməz (sonunda, yeni dillər digər dillərdə inkişaf etmişdir), lakin mümkün olan mənfi nəticələr balanslaşdırılmalıdır. Əlavə olaraq, bu gün <table> elementinin sui-istifadəsinə qarşı heç bir arqument yoxdursa, bəlkə də, sabah brauzerlər elə elementə istinad edirlər. Sonda onlar " <table> elementləri yalnız cədvəlli məlumatlar üçün" olduğunu bilirlər və bu göstəricini <table> davranışını həssas şəkildə dəyişdirən və bununla əlaqədar olduğu halları pozan bir işləmə mexanizmini təkmilləşdirmək üçün istifadə edə bilərlər əvvəllər sui-istifadə.

Yəni nədir Patronum kömək edirmi? İstifadəçilərim razıdırmı?

Bu asılıdır. Sənin patronun varmı? Sonra o, laqeyd ola bilər. Müvafiq olarsa, istifadəçilər olacaq , çünki o, qayğı olacaq .

Bəlkə də mənə və ya bir web səhifəsinin saxlanmasına dəstək vermək lazım olan yoldaşlarımın ... Masa daha az qorumalı mı? Bir cədvəl istifadə div və css istifadə daha asandır düşünürəm.

Çox professional web developers sizə qarşı görünür. [redaktə] . Bu cədvəllər əslində daha az qorumalı ola bilər. Layout üçün masaları istifadə edərək, korporativ düzeni dəyişdirmək həqiqətən hər bir səhifəni dəyişdirmək deməkdir. Bu çox bahalı ola bilər. Digər tərəfdən, CSS ilə birlikdə semantik mənalı HTML-nin həssas istifadəsi CSS-də və istifadə olunan şəkillərdə belə dəyişiklikləri məhdudlaşdıra bilər.

Yeri gəlmişkən ... niyə bir div istifadə və ya tərkibdən yaxşı bir şəkildə ayrılması və masa deyil? Yalnız divs istifadə yaxşı bir layout əldə çox tez-tez iç içə divs tələb edir.

Dərin nişanlı <div> , masalar kimi, anti-nümunələrdir. Yaxşı veb-dizaynerlərə bir çox ehtiyacları yoxdur. Digər tərəfdən, belə dərin iç içə divs belə bir çox masa düzeni problemi yoxdur. Əslində, məzmunun məntiqi bölüşdürülməsi vasitəsilə semantik strukturun yaranmasına kömək edə bilərlər.

Oxuculuq Məcəlləsi əksinə doğru hesab edirəm. Çox insan html anlayır, az css anlamır. Daha asandır.

"Çox adam" əhəmiyyəti yoxdur. Mütəxəssislər əhəmiyyətlidir. Mütəxəssislər üçün masa planları HTML + CSS-dən daha çox problem yaradır. Bu, GVim və ya Emacs istifadə etməməlisənə bənzəyir, çünki Notepad çox insan üçün daha asandır. Ya da LaTeX'i istifadə etməməm lazım olduğuna görə, MS Word çox insan üçün daha asandır.

SEO üçün elektron tablolar istifadə etməmək yaxşıdır

Bu həqiqət olub-olmadığını bilmirəm və onu argument olaraq istifadə etmirəm amma məntiqli olardı. Axtarış motorları müvafiq məlumatları axtarır. Əlbəttə ki, cədvəlli məlumatlar müvafiq ola bilər, baxmayaraq ki, istifadəçilər nadir hallarda axtarış edirlər. İstifadəçilər, səhifənin başlığında və ya oxşar görkəmli vəzifələrdə istifadə olunan şərtləri axtarmaq. Buna görə, cədvəlli məzmunu süzgəcdən kənarlaşdırmaq məntiqli olar və işləmə müddətini (və xərcləri!) Böyük bir faktorla azaldır.

Masalar yavaş. Bədənin əlavə elementi əlavə etmək lazımdır. Bu, müasir veb brauzerlər üçün bir fıstıqdır.

Əlavə maddə yavaş masalarla heç bir əlaqəsi yoxdur. Digər tərəfdən, masa düzeni alqoritmi daha mürəkkəbdir, brauzer tez-tez məzmunun yerləşdirilməsinə başlamazdan əvvəl bütün masanın yüklənməsini gözləməlidir. Bundan əlavə layout caching işləməyəcək (CSS asanlıqla cached bilər). Bütün bunlar artıq qeyd olundu.

Bir tablo istifadə edərək, səhifəni xeyli yavaşlatan bəzi testləri göstər.

Təəssüf ki, məndə nəzarət məlumatları yoxdur. Mən bunu özümə cəlb edərdim, çünki bu mübahisənin müəyyən bir elmi əsas yoxdur.

Yenilənmə ehtiyacı olan bir çox saytın yeni məzmuna ehtiyacı var (html). Veb saytın yeni bir versiyasının yalnız bir yeni CSS faylına ehtiyacı olduğu ssenarilər çox güman ki.

Hələlik deyil. Dizayn dəyişiklikləri məzmunu və dizaynı ayırmaqla sadələşdirilmiş bir neçə hallarda işləmişəm. Tez-tez, bəzi HTML kodunuzu dəyişdirməlisiniz, lakin dəyişikliklər həmişə daha çox məhdud olacaqdır. Bundan əlavə bəzən dizaynda dəyişiklik etmək lazımdır. WordPress blog sistemində istifadə edilən nümunə mühərrikləri nəzərdən keçirin. Cədvəl düzülüşləri bu sistemi sanki öldürəcəkdi. Ticarət proqramı üçün oxşar işdə çalışdım. HTML kodunu dəyişdirmədən dizaynı dəyişmək qabiliyyəti biznes tələblərindən biridir.

Başqa bir şey. Cədvəl düzeni avtomatlaşdırılmış site təhlili edir (ekran qoruyucu) daha çətin olur. Bu, əslində görünə bilər, çünki, hamı bunu kim edə bilər? Özümə şaşırdım. Sözügedən xidmətin WebService-ə alternativ təklif etmədiyi halda, ekran kazıyıcı kömək edə bilər. Bioinformatika ilə işləyirəm, bu da kədərli bir reallıqdır. Müasir veb texnologiyaları və Web Xidmətləri inkişaf edənlərin əksəriyyətinə çatmamışdır və tez-tez ekran qorunması məlumatların alınması prosesini avtomatlaşdırmağın yeganə üsuludur. Təəccüblü deyil ki, bir çox bioloq hələ də bu cür vəzifələri əllə yerinə yetirir. Minlərlə məlumat dəsti üçün.

497
17 сент. Cavab 17 dekabrda Konrad Rudolph tərəfindən verilir . 2008-09-17 19:23 '08 at 7:23 pm 2008-09-17 19:23

Burada programcı simliar ipdən cavab verir

Semantik 101

Əvvəlcə bu kodu nəzərdən keçirin və burada səhv düşünün ...

17 сент. Cavab Carl Camera tərəfindən 17 sentyabrda verilir. 2008-09-17 17:03 '08 at 17:03 'da 2008-09-17 17:03

Aşkar cavab: CSS Zen Garden-a baxın . Əgər asanlıqla bir masa düzeni ilə eyni şeyi edə biləcəyinizi (hatırla, HTML dəyişmir) söyləsəniz, hər halda, layout üçün masaları istifadə edin.

Digər iki mühüm şey isə əlçatanlıq və SEO.

Hər ikisi də məlumatın verildiyi sıraya diqqət yetirirlər. Sehrli düzeni, sayfadaki ikinci iç içe tablonun ikinci satırının üçüncü hücresine yerleştirirse, navigasyonunuzu sayfanın üst kısmında kolayca hayal edemezsiniz.

Beləliklə, cavablarınız davamlılıq, əlçatanlıq və SEO.

Tənbəl olmayın. Bir az daha öyrənmək çətin olsa belə, hər şeyi sağ və sağ edin.

104
17 сент. cavab verildi erlando 17 sep . 2008-09-17 16:33 '08 at 4:33 pm 2008-09-17 16:33

Bu dublikat sualına baxın.

Unutduğunuz bir maddə mövcudluqdur. Məsələn, ekran oxuyucusunu istifadə etməlisinizsə cədvəl düzeni də konvertasiya edilmir. Hökumətdə işlədiyiniz halda, ekran oxucuları kimi mövcud brauzerlər üçün dəstəyə ehtiyacınız ola bilər.

Mən də sizin fikrinizdə göstərdiyiniz bəzi şeylərin təsirinin az olduğunu düşünürəm. Məsələn, hər ikiniz bir geliştirici və bir proqramçıysanız, təqdimatı məzmundan necə yaxşı ayırdığını tam qiymətləndirməyiniz olmayacaq. Mağaza girməyincə, iki fərqli rolu olduğu yerlərdə faydalar daha da aydınlaşır.

Nə etdiyinizi və yaxşı vasitələrə sahib olduğunuzu bilsəniz, CSS yerləşdirmə masalarından əhəmiyyətli üstünlüklərə malikdir. Hər bir element, özü ilə birlikdə alınmış masaların reddinə haqq qazandırmır, baxmayaraq ki, bu, adətən, dəyərlidir.

91
17 сент. Sep 17-də Joel Coehoorn tərəfindən verilmiş cavab 2008-09-17 16:23 '08 at 4:23 pm 2008-09-17 16:23

Təəssüf ki, CSS Zen Garden artıq yaxşı HTML / CSS dizaynı nümunəsi kimi istifadə edilə bilməz. Ən son dizaynların hamısı bölüm başlığı üçün qrafik istifadə edir. Bu qrafik fayllar CSS-də göstərilmişdir.

Nəticədə, məzmunun tərkibinin saxlanılmasının üstünlüyünü göstərməyi hədəfləyən veb sayt, dizaynı tərkibə yerləşdirmək üçün artıq müntəzəm SİN göndərir. (HTML faylında bölüm başlığı dəyişdirilməlidirsə, görüntülenen bölüm başlığı olmayacaq).

Yalnız DIV və CSS-nin ciddi dinlərini müdafiə edənlər öz qaydalarına riayət edə bilməyəcəyini göstərir. Bunları necə təqib etdiyinizə dair bir təlimat olaraq istifadə edə bilərsiniz.

54
17 сент. Sentyabrın 17-də James Curran tərəfindən verilmiş cavab 2008-09-17 17:09 '08 at 5:09 pm 2008-09-17 17:09

Bu, hər hansı bir şəkildə son bir arqument deyil, amma CSS ilə eyni qaydada istifadə edə bilərsiniz və yaxşı bir üstünlük olan ətraf mühitə uyğun düzeni dəyişdirə bilərsiniz. Məsələn, bir çap səhifəsi üçün, məsələn, çap etmək üçün bir səhifə yaratmadan naviqasiyanı təhlükəsiz söndürə bilərsiniz. Gedin

48
17 сент. Cavabın məqsədəuyğunluğu 17 sm . 2008-09-17 16:23 '08 at 4:23 pm 2008-09-17 16:23

Layout üçün bir masa belə pis deyil. Amma çox vaxt bir masa ilə lazım olan düzeni ala bilmirsiniz. Tezliklə iki və ya üç mərtəbəli masanız var. Çox həcmli olur.

  • Oxumaq çətin. Bu fikir deyil. Kimlik etiketləri olmadan daha çox yuva etiketləri var.

  • Təqdimatdan məzmunu ayırmaq yaxşıdır, çünki nə etdiyinizi diqqətinizə çatdırır. İki xanımı qarışdırmaq çətin olan şişirilmiş səhifələrə səbəb olur.

  • Üslub üçün CSS brauzerinizin faylları önbelleğe almasına imkan verir və sonrakı sorğu daha sürətli olur. Bu çox böyükdür.

  • Masalar dizaynı bloklaşdırır. Əlbəttə ki, hər kəs CSS Zen Garden-in rahatlığına ehtiyac duymur, amma burada heç bir yerə işləməmişəm ki, orada dizaynı bir az dəyişmək lazım deyil. Bu CSS ilə daha asandır.

  • Masaların üslubları çətindir. Onlara çox rahatlıq (məsələn, masa üslublarını tam idarə etmək üçün HTML xüsusiyyətləri əlavə etməlisiniz)

4 ildən sonra, qeyri-cədvəlli məlumatlar üçün masalar istifadə etmədi. Geri dönmədim.

Mən həqiqətən Andy Budd'ın CSS ustalıqlarını oxumaq istərdim. Bu fantastikdir.

Ecx.images-amazon.com üzərindən şəkil. Http://ecx.images-amazon.com/images/I/41TH5NFKPEL._SL500_BO2,204,203,200_PIsitb-dp-500-arrow, Top.Right, 45,64_OU01_AA240_SH20_.jpg

45
17 сент. Ben Scheirman tərəfindən verilmiş cavab 17 sentyabr 2008-09-17 18:36 '08 at 18:36 2008-09-17 18:36

İçindəki məzmundan ayrılması yaxşıdır.
Ancaq bu yanlış bir mübahisə; Crishe düşüncə

Bu səhv bir dəlildir, çünki HTML masaları düzəldilmişdir! Tərkibindəki məlumatlar masa içindəki məlumatdır, təqdimat masanın özüdür. HTML-lərlə CSS-nin parçalanması bəzən çox çətin ola bilər. Təqdimatdan məzmunu ayırmırsınız, təqdimatı təqdimatdan ayırırsınız! Daxili divs bir dəstə bir masa fərqli deyil - bu yalnız bir etiket dəsti.

CSS-dən yaranan HTML ilə bağlı bir problem bir-birinə dair intim biliyə ehtiyac duyduğundan, həqiqətən, onları tamamilə ayırmaq mümkün deyil. HTML etiketi düzeni, nə etdiyinizə baxmayaraq, CSS faylı ilə yaxından əlaqələndirilir.

Hesab edirəm ki, tablolar vs divs tətbiqinizin ehtiyaclarına cavab verir.

İş yerində inkişaf etdiyimiz tətbiqdə, parçaların məzmununa görə dinamik şəkildə paylanacağı bir səhifə düzeni lazımdır. Mən CSS və DIVs ilə bu cross browser etmək üçün bir neçə gün sərf və tam bir kabus idi. Masalara köçdük və hamısı işlədi.

Bununla belə, bizim məhsulumuz üçün çox qapalı bir tamaşaçı var (biz bir web interface ilə avadanlıqların bir hissəsini satırıq) və əlçatanlıq məsələləri bizim üçün problem deyil. Ekran oxucunun niyə yaxşı başa düşmədiyini bilmirəm, amma hesab edirəm ki, əgər belədirsə, işləyənlər bununla məşğul olmalıdırlar.

36
17 сент. Cavab 26 sentyabr 17-dən 17-dək verilir . 2008-09-17 16:47 '08 at 4:47 pm 2008-09-17 16:47

"~" Mənbəyini stackoverflow səhifələrindəki səhifələrdən kimə göndərdiyini merak edirəm ~~

33
05 дек. Cavab Scott Evernden tərəfindən 05 dekabr. 2017-12-05 02:25 '17 də 2:25 2017-12-05 02:25
25
05 дек. Benno Richters tərəfindən verilmiş cavab 05 dekabr 2017-12-05 02:25 '17 də 2:25 2017-12-05 02:25

CSS / DIV dizayner oğlanlar üçün bir işdir, deyil. DIV / CSS problemlərini düzəltmək üçün yüzlərlə saat internetdə axtarışa çıxarılıb, bəzi brauzerlər işləməyən bir brauzerlə işləyirdi - bu məni dəli edir. Bir kiçik dəyişiklik edirsiniz və bütün layout hədsiz səhv gedir - eath orada mantıksız olduğu. Bu şəkildə 3 piksel bir şey hərəkət edən saat sərf və sonra başqa bir şey başqa 2 piksel, onları bütün uyğunlaşdırmaq. Nədənsə mənə bu yanlış görünür. Bir purist olduğunuz üçün və "nə etmək lazım deyil" bir şey, n-ci dərəcədə və hər vəziyyətdə, xüsusilə də həyatınızı 1000 dəfə asanlaşdırdıqda istifadə etməyiniz demək deyil.

Beləliklə, nəhayət, kommersiya məqsədləri ilə qərar verdim, baxmayaraq ki minimum 20 saat işləməyi gözləməyəm, minimumu istifadə etməyə davam etsəm də, DIV-lərin düzgün qurulmasını gözləyərəm, mən stolun üstündə duracağam. Bu səhvdir, pirsləri pisləşdirir, lakin əksər hallarda daha az vaxt və idarə etmək ucuzdur. Sonra müştərinin tələbi ilə işləmək üçün tətbiqə diqqət yetirirəm və pirsinqçilər kimi deyiləm. Bütün bunlardan ötəri, ödənişləri ödəyirlər və CSS / DIV istifadə edərək menecerə mübahisə edirəm, yalnız müştərilərin maaşını ödəməyə çalışdığını ifadə etmək istərdim!

Bütün bu CSS / DIV arqumentlərinin yaranmasının yeganə səbəbi ilk növbədə CSS olmaması və brauzerlərin bir-biri ilə uyğun gəlməməsi ilə bağlıdır və əgər varsa, dünyada veb-dizaynerlərin yarısı işləməyəcəkdir.

Bir pəncərə formu yaratdığınız zaman, siz onları qoyduqdan sonra ətrafınızdakı idarələri hərəkət etməyə çalışmırsınız, buna görə mənə bir web formasını istifadə etmək nəyə görə bu qəribədir. Mən bu mantığımı başa düşmürəm. Düzeni başlamağa doğru düzəlt və problem nədir. Dizaynerlər yaradıcılıq ilə flört etməyi sevirlər, çünki tətbiq developers həqiqətən bir ərizə işi etmək, biznes obyektləri yaratmaq, biznes qaydalarını tətbiq etmək, müştəri məlumatlarının bitişik bir-birinə aid olmağının inkişaf etdirilməsində maraqlıdırlar. Bu şeyin gerçək dünyadakı kimi, bildiyiniz şeyin müştərilərin tələblərinə cavab verməsini təmin etmək.

Məni yanlış başa düşməyin, hər iki arqument düzgündür, amma dizayn hazırlamaq üçün daha sadə və daha mantıksal bir yanaşma seçmək üçün developersı tənqid etməyin. Bir div üzərində bir masa istifadə edərək, düzgün semantikadan daha çox əhəmiyyətli şeylərdən narahatlığa sahibik.

Bu müzakirəyə əsaslanan baxım halında, mən bir neçə mövcud tds və trs bir div çevrildi. 45 dəqiqə bir-birinə bənzəyir, hər şeyin bir-birinin yanında durmağa çalışır və mən imtina etdim. 10 saniyə sonra TD yenidən işləyir - dərhal - bütün brauzerlərdə, başqa bir şey edilməməlidir. Anlayıram ki, məni başa düşməyə çalışın - mümkün olduğundan bəhanə ilə buna görə başqa bir şəkildə bunu etmək istərdim!

23
25 нояб. Cavab 25 noyabr tarixində Tim Black tərəfindən verilmişdir. 2010-11-25 17:25 '10 at 17:25 2010-11-25 17:25

Layout sadə olmalıdır. CSS-də üstbilgi və altbilgisi olan üç sütunun dinamik yerləşdirilməsinə nail olmaq üçün necə yazılmış məqalələr var ki, bu bir pis layout sistemi. Конечно, вы можете заставить его работать, но есть буквально сотни статей в Интернете о том, как это сделать. Таких статей почти нет для аналогичного макета с таблицами, потому что это явно очевидно. Независимо от того, что вы говорите против таблиц и в пользу CSS, этот факт отменяет все: базовое расположение трех столбцов в CSS часто называется "Святой Грааль".

Если это не означает, что вы говорите "WTF", тогда вам действительно нужно сбросить kool-помощь.

Мне нравится CSS. Он предлагает потрясающие варианты стилизации и некоторые интересные инструменты позиционирования, но в качестве механизма компоновки он недостаточен. Должна быть какая-то система динамического размещения сетки. Простой способ выравнивания ящиков на нескольких осях, не зная их размеров в первую очередь. Мне наплевать, если вы его назовете <table> или <gridlayout> или что-то еще, но это основная функция макета, отсутствующая в CSS.

Большая проблема заключается в том, что, не признавая недостающих функций, фанатики CSS удерживают CSS от всего, что может быть. Я был бы счастлив прекратить использовать таблицы, если бы CSS обеспечил достойное многоосевое позиционирование сетки, как в основном, каждый другой механизм компоновки в мире. (Вы понимаете, что эта проблема уже решена много раз на многих языках всеми, кроме W3C, верно? И никто другой не отрицал, что такая функция была полезной.)

Sigh Достаточно вентиляции. Идите вперед и верните голову в песок.

21
ответ дан needlestack 11 февр. '11 в 2:52 2011-02-11 02:52

Мне нравится этот вопрос, потому что он раскрывает то, что верно в любых дебатах.

Абсолютные утверждения: always обычно неверно.

Я слышу повторяющуюся мантру эхо-камеры: "Никогда не используйте таблицы для макета, используйте CSS, это семантический" бла-бла-бла ".

Истина

  • В большинстве случаев используйте CSS для компоновки.
  • В редких случаях используйте таблицы для компоновки.
  • Изучите HTML/CSS, получите опыт, затем вы сможете распознать правильные и неправильные случаи.

Я так расстраиваюсь, когда слышу, как разработчики повторяют то, что они читают, не думая о себе.

19
ответ дан Christopher Altman 05 дек. '17 в 2:25 2017-12-05 02:25

В соответствии с соглашением 508 (для экранных читателей для визуально оспариваемых) таблицы должны использоваться только для хранения данных, а не для макета, поскольку это заставляет читателей экрана волноваться. Или так мне сказали.

Если вы назначаете имена для каждого из div, вы можете скрыть их все вместе, используя CSS. Они всего лишь немного больнее, чтобы сидеть так, как вам нужно.

19
ответ дан Rob 17 сент. '08 в 16:21 2008-09-17 16:21

Вот раздел html из недавнего проекта:

 <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:> 

Единственная чистота, которую я вижу в макете на основе таблицы, - это тот факт, что я чрезмерно изощрен с моим отступом. Я уверен, что раздел содержимого будет содержать еще две встроенные таблицы.

Еще о чем подумать: filesizes . Я обнаружил, что раскладки на основе таблиц в два раза чаще, чем их собственные аналоги. На нашей высокоскоростной широкополосной сети, которая не является большой проблемой, но она предназначена для тех, у кого есть модемы с набором номера.

18
ответ дан Ross 18 сент. '08 в 13:10 2008-09-18 13:10

Попробуйте сделать страницу с тремя столбцами, заголовком и нижним колонтитулом с div, который обладает тем свойством, что ВСЕ из трех столбцов должны быть одинаковой высоты, где общая высота этих столбцов должна быть в зависимости от (самого длинного) содержимого в только один из них. В итоге вы получите много (вложенных) div и сложную таблицу стилей, полную трюков.

Использование простой таблицы с тремя рядами/3-столбцами (с объединением для верхнего и нижнего колонтитула) для основного макета намного проще. Div - вовсе не святой Грааль. Google для веб-сайтов, пытающихся придумать приличный и легкий CSS с div для вышеупомянутого макета....

15
ответ дан Dutchie 05 дек. '17 в 2:25 2017-12-05 02:25

Я хотел бы добавить, что макеты div-оснований проще упростить, развить и реорганизовать. Просто некоторые изменения в CSS для изменения порядка элементов, и это делается. По моему опыту, редизайн макета, который использует таблицы, является кошмаром (больше, если есть вложенные таблицы).

Ваш код также имеет значение из semantic .

14
ответ дан Guido García 17 сент. '08 в 16:28 2008-09-17 16:28

CSS-макеты, как правило, намного лучше для доступности, при условии, что контент приходит в естественном порядке и имеет смысл без таблицы стилей. И это не только экраны, которые борются с табличными макетами: они также значительно усложняют работу мобильных браузеров.

Кроме того, с макетом на основе div вы можете легко делать классные вещи с помощью таблицы стилей печати, например, исключая заголовки, нижние колонтитулы и навигацию с печатных страниц. Я думаю, что было бы невозможно или, по крайней мере, намного сложнее сделать это с табличным расположением.

Если вы сомневаетесь в том, что разделение содержимого из макета проще с помощью div, чем с таблицами, посмотрите HTML-код на основе div CSS Zen Сад , посмотрите, как изменение таблиц стилей может кардинально изменить макет и подумать о том, можно ли достичь одного и того же разнообразия макетов, если HTML был основан на таблице... Если вы делаете табличный макет, вы вряд ли будет использовать CSS для управления всем интервалом и заполнением в ячейках (если бы вы были, вы почти наверняка находили бы проще использовать плавающие div и т.д.). Без использования CSS для управления всем этим и из-за того факта, что в таблицах указывается порядок слева-направо и сверху-снизу вещей в HTML, таблицы, как правило, означают, что ваш макет очень сильно исправляется в HTML.

Реально я думаю, что очень сложно полностью изменить макет дизайна на основе div и CSS, не изменяя немного div. Однако с помощью макета на основе div-и-CSS гораздо проще настраивать такие вещи, как расстояние между различными блоками и их относительные размеры.

13
ответ дан MB. 17 сент. '08 в 16:37 2008-09-17 16:37

Тот факт, что это горячо обсуждаемый вопрос, свидетельствует о том, что W3C не ожидает многообразия схем компоновки, которые будут предприняты. Использование divs + css для семантически-дружественного макета - отличная концепция, но детали реализации настолько ошибочны, что они фактически ограничивают свободу творчества.

Я попытался переключить один из наших сайтов компании с таблиц на divs, и это была такая головная боль, что я полностью отказался от часов работы, которые я вложил в нее, и вернулся к столам. Пытаясь бороться с моими дивами, чтобы получить контроль над вертикальным выравниванием, я проклинал меня основными психологическими проблемами, которые я никогда не буду дрожать, пока эти дебаты бушуют.

Тот факт, что люди часто придумывают сложные и уродливые обходные пути для достижения простых целей проектирования (например, вертикальное выравнивание), настоятельно указывает на то, что правила не достаточно гибкие. Если спецификации достаточны, то почему высокопрочные сайты (например, SO) считают необходимым сгибать правила, используя таблицы и другие обходные пути?

13
ответ дан DLH 09 авг. '10 в 16:10 2010-08-09 16:10

Никакие аргументы в DIVs не поддерживают меня.

Я бы сказал: если обувь подходит, носите ее.

Стоит отметить, что трудно, если не невозможно, найти хороший метод DIV + CSS для рендеринга содержимого в двух или трех столбцах, который согласован во всех браузерах и по-прежнему выглядит так, как я предполагал.

Это немного напоминает баланс в таблицах в большинстве моих макетов, и, хотя я чувствую себя виноватым в их использовании (dunny, почему, люди просто говорят это плохо, поэтому я пытаюсь их выслушать), в конце концов, прагматичный взгляд для меня просто проще и быстрее использовать ТАБЛИЦЫ. Я не буду платить по часам, поэтому столы дешевле для меня.

13
ответ дан Radu094 17 сент. '08 в 16:48 2008-09-17 16:48

Я предполагаю, что использование элемента таблицы для макета имеет мало общего с табличными данными. И что? Помогает ли мой босс? Удовлетворяют ли мои пользователи?

Google и другие автоматизированные системы do заботятся, и они так же важны во многих ситуациях. Семантический код легче обрабатывать и обрабатывать неинтеллектуальную систему.

12
ответ дан ceejayoz 17 сент. '08 в 16:23 2008-09-17 16:23

После работы с веб-сайтом, в котором было задействовано 6 слоев вложенных таблиц, сгенерированных некоторым приложением, и, если бы он породил недействительный HTML, на самом деле это была 3-часовая работа, чтобы исправить ошибку, вызвав незначительные изменения.

Это, конечно, крайний случай, но дизайн на основе таблиц не поддается. Если вы используете css, вы разделяете стиль, поэтому, исправляя HTML, вы можете меньше беспокоиться о нарушении.

Также попробуйте это с помощью JavaScript. Переместите одну ячейку таблицы из одного места в другое место в другой таблице. Довольно сложно выполнить, где div/span просто будет работать с копированием в паттерн.

"Помогает ли мой босс"

Если бы я был твоим боссом. Тебе все равно.;) Если вы цените свою жизнь.

8
17 сент. Cavab Kent Fredrik tərəfindən verilir . '08 в 16:26 2008-09-17 16:26

Гибкость компоновки
Представьте, что вы создаете страницу с большим количеством миниатюр.
DIVs :
Если вы поместите каждую миниатюру в DIV, поплыв по левому краю, возможно, 10 из них подойдут к строке. Сделайте окно более узким, а BAM - 6 в строке, или 2, или сколько угодно. Таблица:
Вы должны явно указать количество ячеек в строке. Если окно слишком узкое, пользователь должен прокручивать по горизонтали.

ремонтопригодность
В той же ситуации, что и выше. Теперь вы хотите добавить три миниатюры в третью строку.
DIVs:
Добавьте их. Макет будет автоматически настраиваться.
Таблица: Вставьте новые ячейки в третий ряд. Ой! Теперь там слишком много предметов. Отрежьте некоторые из этой строки и поместите их в четвертый ряд. Теперь там слишком много предметов. Вырезать некоторые из этой строки... (и т.д.)
( Конечно, если вы создаете строки и ячейки с помощью сценариев на стороне сервера, это, вероятно, не будет проблемой. )

7
ответ дан Nathan Long 17 сент. '08 в 18:09 2008-09-17 18:09

Я думаю, что лодка плыла. Если вы посмотрите на направление, которое заняла индустрия, вы заметите, что победителями этой дискуссии являются CSS и Open Standards. Это, в свою очередь, означает, что для большинства html-работ, за исключением форм, дизайнеры будут использовать divs вместо таблиц. Мне сложно с этим справиться, потому что я не гуру CSS, но так оно и есть.

7
ответ дан Thomas Wagner 17 сент. '08 в 18:43 2008-09-17 18:43

Один из менее очевидных моментов. Таблица может быть отображена только после полного анализа браузером, что приведет к замедлению загрузки страницы.

6
ответ дан bastos.sergio 05 дек. '17 в 2:25 2017-12-05 02:25
  • 508 Compliance - возможность для чтения с экрана читать вашу разметку.
  • Ожидание рендеринга - таблицы не отображаются в браузере, пока не дойдут до конца элемента </table> .
5
ответ дан Rick Glos 17 сент. 2008-09-17 17:10 '08 saat 17:10 'da 2008-09-17 17:10

Вся идея вокруг семантической разметки - это разделение разметки и презентации, которая включает в себя макет.

Div не заменяет таблицы, они сами используют их для разделения содержимого на блоки связанного контента (,). Когда вы не обладаете навыками и полагаетесь на таблицы, вам часто приходится отделять ваш контент от ячеек, чтобы получить желаемый макет, но вам не нужно прикасаться к разметке, чтобы достичь презентации при использовании семантической разметки. Это действительно важно, когда создается разметка, а не статические страницы.

Разработчикам необходимо прекратить предоставление разметки, что предполагает компоновку, чтобы те из нас, кто имеет навыки представления контента, могут работать с нашими заданиями, а разработчикам не нужно возвращаться к их коду, чтобы вносить изменения, когда потребности в презентации изменение.

5
ответ дан Steve Perks 17 сент. '08 в 17:52 2008-09-17 17:52

Похоже, вы просто привыкли к таблицам и этому. Помещение макета в таблицу ограничивает вас только тем макетом. С помощью CSS вы можете перемещать бит вокруг, взгляните на http://csszengarden.com/ И нет, макет обычно не требует много вложенных div.

Без таблиц для макета и правильной семантики HTML намного чище, поэтому его легче читать. Почему кто-то, кто не может понять CSS, пытается его прочитать? И если кто-то считает себя веб-разработчиком, то хорошим пониманием CSS является необходимость.

Преимущества SEO зависят от способности иметь самый важный контент выше страницы и с улучшенным отношением к разметке.

http://www.hotdesign.com/seybold/

5
ответ дан Rimantas 17 сент. '08 в 16:31 2008-09-17 16:31

Кроме того, не забывайте, что таблицы не очень хорошо отображаются в мобильных браузерах. Конечно, у iPhone есть браузер для кик-аза, но у всех нет iPhone. Отображение таблицы может быть арахисами для современных браузеров, но это куча арбузов для мобильных браузеров.

Я лично обнаружил, что многие люди используют слишком много тегов <div> , но в умеренных количествах он может быть чрезвычайно чистым и легким для чтения. Вы отмечаете, что людям труднее читать CSS, чем таблицы; с точки зрения "кода", который может быть правдой; но с точки зрения чтения содержимого (view > source), гораздо проще понять структуру с таблицами стилей, чем с таблицами.

5
ответ дан Swati 17 сент. '08 в 16:30 2008-09-17 16:30

От парня, который зачислен как первый, чтобы использовать таблицы для макета: Сеть разрушена, и я ее разрушил

4
ответ дан Rob 05 дек. '17 в 2:24 2017-12-05 02:24
  • 1
  • 2
  • 3

Другие вопросы по меткам или Задайте вопрос