为什么你应该避免网页的表格

CSS是构建网页设计的最佳方式

学习写作CSS.布局可能很棘手,特别是如果您熟悉使用表来创建花式网页布局。但是HTML5.允许表格为布局,这不是一个好主意。

表无法访问

如同搜索引擎,大多数屏幕读者按照他们在HTML中显示的顺序读取网页,表格对于屏幕读者可以解析。表布局中的内容在线性时,当左右读取时并不总是有意义。另外,嵌套表格,桌面单元上的各种跨度可以使页面难以弄清楚。

这就是这样的原因HTML5规范建议反对布局表为什么HTML 4.01禁止它。可访问的网页允许更多人使用它们,并且是专业设计师的标志。

使用CSS,您可以将一个部分定义为页面左侧的部分,但将其放在HTML中。然后,屏幕读者和搜索引擎相似将读取重要的部分(内容)和最后一个重要的部分(导航)。

桌子很棘手

即使使用Web编辑器创建表,您的网页仍将复杂且难以维护。除了最简单的网页设计外,大多数布局表都需要使用大量和属性和嵌套表。

在你这样做时,建立桌子看起来很容易,但一旦完成它需要维护它。六个月下线它可能不那么容易记住你筑巢的原因或者是一行中的多少个细胞等等。更不用说,如果您将网页视为团队成员,您必须向每个人解释参与表的工作方式或期望他们需要进行更改时需要额外的时间。

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也强烈建议使用此方法。

此页面是否有帮助?