草庐IT

html - 为什么不在 HTML 中使用表格进行布局？

coder 2023-04-23 原文

就目前而言，这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持，但这个问题可能会引起辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the help center为指导。




9年前关闭。










锁定。这个问题及其答案是locked因为这个问题是题外话，但具有历史意义。它目前不接受新的答案或互动。








好像是general opinion表格不应该用于 HTML 中的布局。

为什么？

我从来没有(或说实话很少)看到这方面的好论据。通常的答案是:

  • 好到separate content from layout但这是一个错误的论点； Cliche Thinking .我想确实使用表格元素进行布局与表格数据几乎没有关系。所以呢？我的老板在乎吗？我的用户关心吗？也许我或我的开发人员必须维护网页关心...表格的可维护性较低吗？我认为使用表格是 easier比使用 div 和 CSS。顺便说一句......为什么使用 div 或 span 可以很好地将内容与布局和表格分开？仅使用 div 获得良好的布局通常需要大量嵌套的 div。
  • 代码的可读性我认为恰恰相反。大多数人了解 HTML，很少有人了解 CSS。
  • SEO最好不要用表格为什么？有人能拿出一些证据证明它是吗？或者谷歌声明从 SEO 的 Angular 不鼓励使用表格？
  • 表格较慢。必须插入额外的 tbody 元素。这是现代网络浏览器的花生。向我展示一些基准测试，其中使用表格会显着减慢页面速度。
  • 没有表格，布局检修更容易，请参阅 css Zen Garden .大多数需要升级的网站也需要新内容 (HTML)。不太可能出现网站的新版本只需要一个新的 CSS 文件的情况。 Zen Garden 是一个不错的网站，但有点理论化。更不用说它的misuse的CSS。

    • 我对使用 divs + CSS 而不是表格的好论据真的很感兴趣。

    最佳答案

    我将一个接一个地审查你的论点，并试图指出其中的错误。

    It's good to separate content from layout But this is a fallacious argument; Cliché Thinking.



    这完全没有错，因为 HTML 是有意设计的。一个元素的滥用可能并非完全没有问题(毕竟，其他语言中也出现了新的习语)，但必须抵消可能产生的负面影响。此外，即使没有反对滥用 <table> 的论据。今天的元素，明天可能会有，因为浏览器供应商对元素应用特殊处理的方式。毕竟，他们知道“<table>元素仅用于表格数据”，并且可能会利用这一事实来改进渲染引擎，在此过程中巧妙地改变了 <table> s 的行为，从而打破了以前被滥用的情况。

    So what? Does my boss care? Do my users care?



    依靠。你的老板是尖头吗？那么他可能不在乎。如果她有能力，那么她会关心，因为用户will .

    Perhaps me or my fellow developers who have to maintain a web page care... Is a table less maintainable? I think using a table is easier than using divs and css.



    大多数专业 Web 开发人员似乎都反对您 [需要引用]。表实际上不易维护应该是显而易见的。使用表格进行布局意味着更改公司布局实际上意味着更改每一页。这可能非常昂贵。另一方面，明智地将语义上有意义的 HTML 与 CSS 结合使用可能会将此类更改限制在 CSS 和所使用的图片中。

    By the way... why is using a div or a span good separation of content from layout and a table not? Getting a good layout with only divs often requires a lot of nested divs.



    深度嵌套 <div> s 是一种反模式，就像表格布局一样。优秀的网页设计师不需要很多。另一方面，即使是这种嵌套很深的 div 也不会有很多表格布局的问题。事实上，它们甚至可以通过逻辑地将内容分成几部分来形成语义结构。

    Readability of the code I think it's the other way around. Most people understand html, little understand css. It's simpler.



    “大多数人”并不重要。专业人士很重要。对于专业人士来说，表格布局比 HTML + CSS 产生的问题更多。这就像说我不应该使用 GVim 或 Emacs，因为记事本对大多数人来说更简单。或者我不应该使用 LaTeX，因为 MS Word 对大多数人来说更简单。

    It's better for SEO not to use tables



    我不知道这是否属实，也不会将此用作论据，但这是合乎逻辑的。搜索引擎搜索相关数据。虽然表格数据当然可能是相关的，但用户搜索的内容很少。用户搜索页面标题或类似显着位置中使用的术语。因此，将表格内容排除在过滤之外是合乎逻辑的，从而大大减少处理时间(和成本!)。

    Tables are slower. An extra tbody element has to be inserted. This is peanuts for modern web browsers.



    额外的元素与表格变慢无关。另一方面，表格的布局算法要困难得多，浏览器通常必须等待整个表格加载完毕才能开始布局内容。此外，布局的缓存将不起作用(CSS 可以轻松缓存)。这一切都在前面提到过。

    Show me some benchmarks where the use of a table significantly slows down a page.



    不幸的是，我没有任何基准数据。我自己也会对它感兴趣，因为这个论点缺乏一定的科学严谨性是对的。

    Most web sites that need an upgrade need new content (html) as well. Scenarios where a new version of a web site only needs a new css file are not very likely.



    一点也不。我处理过几个案例，其中通过内容和设计的分离来简化设计的更改。通常仍然需要更改一些 HTML 代码，但更改将始终受到限制。此外，有时必须动态进行设计更改。考虑模板引擎，例如 WordPress 博客系统使用的模板引擎。表格布局真的会扼杀这个系统。我曾为商业软件处理过类似的案例。能够在不更改 HTML 代码的情况下更改设计是业务需求之一。

    另一件事。表格布局使网站的自动解析(屏幕抓取)变得更加困难。这听起来可能微不足道，因为毕竟是谁做的？我自己也很惊讶。如果相关服务不提供 WebService 替代方案来访问其数据，则屏幕抓取会很有帮助。我在生物信息学工作，这是一个可悲的现实。现代 Web 技术和 Web 服务尚未普及到大多数开发人员，通常，屏幕抓取是自动化获取数据过程的唯一方法。难怪许多生物学家仍然手动执行此类任务。对于数以千计的数据集。

    关于html - 为什么不在 HTML 中使用表格进行布局？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/83073/

    htmlbrblockquotenoreferrercss

    有关html - 为什么不在 HTML 中使用表格进行布局？的更多相关文章

    1. ruby - 如何使用 Nokogiri 的 xpath 和 at_xpath 方法 - 2

      我正在学习如何使用Nokogiri，根据这段代码我遇到了一些问题:require'rubygems'require'mechanize'post_agent=WWW::Mechanize.newpost_page=post_agent.get('http://www.vbulletin.org/forum/showthread.php?t=230708')puts"\nabsolutepathwithtbodygivesnil"putspost_page.parser.xpath('/html/body/div/div/div/div/div/table/tbody/tr/td/div

    2. ruby - 使用 RubyZip 生成 ZIP 文件时设置压缩级别 - 2

      我有一个Ruby程序，它使用rubyzip压缩XML文件的目录树。gem。我的问题是文件开始变得很重，我想提高压缩级别，因为压缩时间不是问题。我在rubyzipdocumentation中找不到一种为创建的ZIP文件指定压缩级别的方法。有人知道如何更改此设置吗？是否有另一个允许指定压缩级别的Ruby库？ 最佳答案 这是我通过查看ruby​​zip内部创建的代码。level=Zlib::BEST_COMPRESSIONZip::ZipOutputStream.open(zip_file)do|zip|Dir.glob("**/*")d

    3. ruby - 为什么我可以在 Ruby 中使用 Object#send 访问私有(private)/ protected 方法？ - 2

      类classAprivatedeffooputs:fooendpublicdefbarputs:barendprivatedefzimputs:zimendprotecteddefdibputs:dibendendA的实例a=A.new测试a.foorescueputs:faila.barrescueputs:faila.zimrescueputs:faila.dibrescueputs:faila.gazrescueputs:fail测试输出failbarfailfailfail.发送测试[:foo,:bar,:zim,:dib,:gaz].each{|m|a.send(m)resc

    4. ruby-on-rails - 使用 Ruby on Rails 进行自动化测试 - 最佳实践 - 2

      很好奇，就使用ruby​​onrails自动化单元测试而言，你们正在做什么？您是否创建了一个脚本来在cron中运行rake作业并将结果邮寄给您？git中的预提交Hook？只是手动调用？我完全理解测试，但想知道在错误发生之前捕获错误的最佳实践是什么。让我们理所当然地认为测试本身是完美无缺的，并且可以正常工作。下一步是什么以确保他们在正确的时间将可能有害的结果传达给您？ 最佳答案 不确定您到底想听什么，但是有几个级别的自动代码库控制:在处理某项功能时，您可以使用类似autotest的内容获得关于哪些有效，哪些无效的即时反馈。要确保您的提

    5. ruby - 在 Ruby 中使用匿名模块 - 2

      假设我做了一个模块如下:m=Module.newdoclassCendend三个问题:除了对m的引用之外，还有什么方法可以访问C和m中的其他内容？我可以在创建匿名模块后为其命名吗(就像我输入“module...”一样)？如何在使用完匿名模块后将其删除，使其定义的常量不再存在？ 最佳答案 三个答案:是的，使用ObjectSpace.此代码使c引用你的类(class)C不引用m:c=nilObjectSpace.each_object{|obj|c=objif(Class===objandobj.name=~/::C$/)}当然这取决于

    6. ruby - 使用 ruby​​ 和 savon 的 SOAP 服务 - 2

      我正在尝试使用ruby​​和Savon来使用网络服务。测试服务为http://www.webservicex.net/WS/WSDetails.aspx?WSID=9&CATID=2require'rubygems'require'savon'client=Savon::Client.new"http://www.webservicex.net/stockquote.asmx?WSDL"client.get_quotedo|soap|soap.body={:symbol=>"AAPL"}end返回SOAP异常。检查soap信封，在我看来soap请求没有正确的命名空间。任何人都可以建议我

    7. python - 如何使用 Ruby 或 Python 创建一系列高音调和低音调的蜂鸣声？ - 2

      关闭。这个问题是opinion-based.它目前不接受答案。想要改进这个问题？更新问题，以便editingthispost可以用事实和引用来回答它.关闭4年前。Improvethisquestion我想在固定时间创建一系列低音和高音调的哔哔声。例如:在150毫秒时发出高音调的蜂鸣声在151毫秒时发出低音调的蜂鸣声200毫秒时发出低音调的蜂鸣声250毫秒的高音调蜂鸣声有没有办法在Ruby或Python中做到这一点？我真的不在乎输出编码是什么(.wav、.mp3、.ogg等等)，但我确实想创建一个输出文件。

    8. ruby-on-rails - Rails - 子类化模型的设计模式是什么？ - 2

      我有一个模型:classItem项目有一个属性“商店”基于存储的值，我希望Item对象对特定方法具有不同的行为。Rails中是否有针对此的通用设计模式？如果方法中没有大的if-else语句，这是如何干净利落地完成的？ 最佳答案 通常通过Single-TableInheritance. 关于ruby-on-rails-Rails-子类化模型的设计模式是什么？，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.co

    9. ruby-on-rails - 按天对 Mongoid 对象进行分组 - 2

      在控制台中反复尝试之后，我想到了这种方法，可以按发生日期对类似activerecord的(Mongoid)对象进行分组。我不确定这是完成此任务的最佳方法，但它确实有效。有没有人有更好的建议，或者这是一个很好的方法？#eventsisanarrayofactiverecord-likeobjectsthatincludeatimeattributeevents.map{|event|#converteventsarrayintoanarrayofhasheswiththedayofthemonthandtheevent{:number=>event.time.day,:event=>ev

    10. ruby-on-rails - 'compass watch' 是如何工作的/它是如何与 rails 一起使用的 - 2

      我在我的项目目录中完成了compasscreate.和compassinitrails。几个问题:我已将我的.sass文件放在public/stylesheets中。这是放置它们的正确位置吗？当我运行compasswatch时，它不会自动编译这些.sass文件。我必须手动指定文件:compasswatchpublic/stylesheets/myfile.sass等。如何让它自动运行？文件ie.css、print.css和screen.css已放在stylesheets/compiled。如何在编译后不让它们重新出现的情况下删除它们？我自己编译的.sass文件编译成compiled/t

    随机推荐