深圳网站建设设计

将想法与焦点和您一起共享

深圳网站建设设计 深圳网站优化排名 深圳网站设计制作欣赏

网站制作现代网页设计数据表

2017-08-02  阅读: 深圳网站建设设计

网站制作现代网页设计数据表
能够组织数据和信息是不可忽视的技巧。组织内容和文本的方式,通常称为复制,直接影响到用户如何接收内容。你必须找到一种方式来组织信息,它可扫描可以迅速被读者。以干净的方式组织信息的一种方法是使用数据表。数据表提供了显示大量信息的结构化方式。

自从Web开发开始以来,数据表一直在使用。桌子的结构没有改变,也不会改变,因为,它是一张桌子。但是,尽管结构保持不变,样式已经有了很长的路;最近的表和早期的表一样易读。


数据表的常用用法

表以简洁易读的方式组织信息非常容易。它们可以用来存储和显示大量的信息、少量的信息、静态数据,甚至是不断变化的数据。

由于表的类似图表的布局,它们对于进行比较非常有用。许多网站用它们来比较产品、服务以及如上所述的定价计划。

下表对苹果的网站比较所有的MacBook。该图表包含大量信息,但仍有组织,易于阅读。这是一个非常简单的表,但看起来不错,因为良好的间距和边界。同时,注意笔记本电脑的图像如何包含重要的信息是粗体。这使得表很可。

数据表通常用来比较定价计划。它们提供空间来显示计划的名称、价格和每个计划的独特之处。通常情况下,显示定价计划的表包含每个计划的列和每个特性的行。然后,每个单元格内部都有一个标记,指示计划是否具有该特定功能。

最后,表格经常出现在电视网络网站上以显示日程安排。它们与典型的表有点不同,由于交错的观察周期,细胞大小不同。除此之外,进度表遵循完全相同的结构。

网站制作现代网页设计数据表

有用数据表的组件

虽然几乎每个用户都知道如何理解一个表,但仍然可以做一些事情使您的可用性更高一级。


标题+标签+数据=数据表

显然,数据表由列标题、行标签和单元格中的实际数据组成。一张桌子应该是什么也没有少了。

添加颜色时,应使单元格与标签和标题形成对比。使标签和标题的背景颜色比用于核心数据的颜色不同。这使表格更容易阅读和消除混乱。

下面的表goplan使用深色的列标题和行标签。请注意,由于对比度,阅读这张表要容易得多。

网站制作现代网页设计数据表

坚持简单的网格

所有的表都是网格,它们的工作方式很好,那么为什么不同呢?网格是有效的,因为您可以在一个小范围内容纳大量的信息,并且查看器仍然能够轻松地读取内容。

使用图标

图标是减少页面上枯燥文本的好方法。图标还可以帮助组织数据表。

下面的表格可以很好地使用图标,看起来非常干净。检查标记和交叉使用代替“是”和“否”。

网站制作现代网页设计数据表
不要留下空白空间

表通常有数据不适用的单元格。避免简单地将这些空格留空,而是用一个标记填充它们,如十字(x)、图标或如下表中的破折号。

这个干净的表使用三个破折号表示数据不适用于一个单元格;这看起来比离开一个空白的空间要好得多。


突出显示重要列和行

许多数据表突出显示提供重要信息或有用信息的列和行。在定价图表中,您通常会看到突出显示的最佳方案。看看下面的桌子。最重要的一行——餐桌被观看的日程安排——用粗边框和不同背景色突出显示。


使用更大和更复杂的数据表

到目前为止,我们主要集中在小型和简单的数据表上,但对于大型、复杂和数据重的表又如何呢?对于大型数据表,有许多可用性考虑事项。

网站制作现代网页设计数据表
使可移动列

数据表在许多基于Web和安装的软件应用程序中占重要地位。通常,开发人员将创建表,以便用户可以按任何方式移动和组织列。此外,应用程序通常允许用户添加和删除列。


允许列重新排序

在具有频繁变化的大量数据或数据的表中,应该给用户重新排序内容和单元格的能力。您可以订购数据的最常见的变量包括日期、字母表和重要性。


提供大表的搜索

如果数据广泛且表很大,则应提供一个搜索框。这将提高大表的整体可用性,并使查找数据更快。

网站制作现代网页设计数据表
提供不同的观点

如果您的表包含有缩略图或其他视觉内容的信息,您可以使用的另一个可用性功能是以不同方式查看该信息的能力。提供查看所有文本、文本和缩略图或仅缩略图的选项。

看看这个基于flash的数据表。它提供了许多与大表有效的特性,如上所述,包括搜索、重新排序选项和不同视图。


设计数据表

造型,或缺乏造型,在用户如何看待表格和吸收数据方面起着重要作用。但是请记住,它仍然只是一个数据表,不应该被重载。保持简洁易读是你的总体目标。阴影和艺术边框可以与布局中的其他元素协同工作,但要远离数据表。下面是一些对数据表更有效的样式元素。


交替的颜色

任何数据表最重要的特性是可读性。实现这一点的一种方法是对列和行交替使用颜色。这使得它更容易阅读和浏览。

下面的数据表布置得很好。表的行交替颜色,提供干净、流畅、高效的布局。它有很多信息,但仍然可读。

网站制作现代网页设计数据表
边界
用边界分离细胞是非常重要的。边界使数据更易读,可以消除混乱。有了大量的信息,不同单元格中的数据可以像一个一样混合在一起,但是你想把它们分开。

充足的间距
和边界一样,数据之间的距离也有助于可用性。在每个单元格中,在边界和数据之间留出足够的填充。使用至少20像素的空间。

简单的背景颜色
正如我们一直说的,良好的数据表都是关于可读性的。色彩和可读性往往是齐头并进的。数据表应该总是简单的,简单的方法之一是使用简单的颜色。避免使用明亮、令人讨厌的背景颜色,因为这些颜色反映的数据不好。


数据表的展示
深圳网站制作正如所承诺的,下面是一些数据表正确的网站。
一个干净和基本的表格,有不错的字体和良好的调色板。

将文章分享到..