网页设计定义和术语
网页设计已经存在一段时间了,它开发了一种复杂的、充满行话的语言。只要您迈出网页设计世界的最小一步,您就会开始听到“您想使用什么 CMS?”、“您想要固定的 CMS 吗?”布局?”、“您想使用什么虚拟主机?” 你会想知道这一切意味着什么。我们知道,试图找出所有关键的网页设计定义和术语可能会让人不知所措,特别是如果它是全新的。
网页设计涵盖了大量的工作,从编写代码的网页开发人员到从事界面工作的 UI 和 UX 设计师,再到负责网站外观和感觉的网页设计师。有很多人参与网页设计。
了解网页设计中的一些首字母缩略词和行业术语的含义可以使与您的设计师和开发人员的合作变得更加容易,还可以帮助您了解自己的网站的实际运作方式。因此,无论您是聘请帮助还是自己动手,了解网页设计和开发中最常用和最容易混淆的术语都可以派上用场。
网页设计定义
无障碍
可访问性是当今网页设计的一个大问题。从本质上讲,这意味着人们(包括任何有听力或能见度障碍的人)可以访问您的网站。在创建网站之前和创建网站时牢记这一点很重要。如果您不确定从哪里开始,请查看这六个步骤,以使您的网页设计易于访问。
折叠下方(和折叠上方)
下折和上折是两个起源于报纸的术语。“折叠”是报纸折叠的地方 上面和下面描述信息是出现在折叠的上半部分还是下半部分。对于网页,“折叠”通常定义为您必须开始滚动的点,但原理是相同的,折叠上方的信息(ATF)比折叠下方的信息(BTF)更易于访问和可见.
弹性布局
弹性布局是一种设计网页的方法,它将元素及其在页面上的位置之间的关系描述为百分比,而不是专门设计的距离和大小。这意味着网页更具适应性,无论是针对访问者在字体大小和间距方面设置的首选项,还是在优化页面以在智能手机或平板电脑上查看时。
如今,弹性布局是响应式设计方法的关键部分,但在响应式设计的概念出现之前,弹性布局提供了一种使网站具有适应性的简单方法。
Ex
Ex 是一种度量单位,它使用字体中的小写“x”作为标准度量。此高度通常为字体尺寸的一半。如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸。
固定宽度(布局)
固定宽度布局是一种设计网页的方法,设计师将指定网页的大小以及元素将在其中显示的确切位置。与弹性布局相比,这使设计人员可以更好地控制网页的设计,但会使页面对不同屏幕尺寸的适应性降低。
十六进制
十六进制,也称为“十六进制”数字,是一种基数为 16 的数字系统,这意味着它们使用 16 个符号来定义颜色。十六进制数字使用从 0 到 9 的数字和从 A 到 F 的字母。每种颜色由三对十六进制数字定义。第一对数字或字母与红色相关,第二对与绿色相关,第三对与蓝色相关。
无限滚动
无限滚动是在您继续滚动时加载新内容。这创造了一个“无限”、永无止境的卷轴。一些流行的例子是 Facebook 时间线、Pinterest 或 Twitter 提要。
视差滚动
这种滚动方法在网站设计中创造了一种深度感。当用户滚动时,网站上的元素在用户滚动时看起来处于不同的距离并以不同的速度移动。这会在平面网站上产生深度和距离的错觉。
解析度
分辨率是屏幕上显示的像素数。它是网页设计中用于指定图像大小的标准方法。图像质量通常用每英寸像素数来描述,像素数越多,图像质量越高。
响应式/移动友好/移动优化
截至 2020 年,超过一半的网络流量发生在智能手机上。这意味着网站在移动设备和桌面设备上的最佳外观变得越来越重要。使网站具有响应性/移动友好/移动优化意味着设计和开发一个网站,以适应正在查看它们的设备或屏幕。
可用性
可用性是网页设计中的一个概念,它描述了您的网站对其设计的访问者的可用性。理想情况下,访问者在第一次遇到您的网站时将能够轻松使用您的网站,并且将障碍、挫折和寻求帮助的需求降至最低。了解可用性原则是构建优秀网站的关键一步。
UX(用户研究)/UI(用户界面)
UX 和 UI 设计是改善用户体验的工作。了解UX 和 UI的差异以了解它们如何协同工作非常重要。
UX,用户研究,涉及用户与网站交互的所有方面,从开始到结束。目标是提高用户与网站之间的交互质量。
UI,用户界面,侧重于网站的视觉和交互元素,例如按钮、图标、排版。目标是改善网站的外观和功能。
前端网站剖析
面包屑
当网页向用户展示他们如何浏览网页以及如何返回主页时,通常是通过面包屑导航完成的。这通常显示为一系列嵌套类别,例如 Home > Category > Year > Month > Post。
图标
收藏夹图标是一个显示在浏览器标签栏中的小图标。它们通常为 16×16 像素(这确实非常小),并保存为 .ico、.gif 或 .png 图像。您几乎可以使用任何您喜欢的图像作为网站图标,只要它的大小合适并以正确的格式保存。
焦点
网页上的焦点是您的眼睛被吸引到的页面部分。设计师将花费大量时间确保他们设计出真正吸引观众注意力的焦点,然后将页面上最重要的东西放在焦点上。这确保它被尽可能多的人看到。
前端
这些都是人们第一次访问您的网站时会看到的所有元素,如图像、文本、页面。它本质上是人们将在网站上进行交互和参与的内容。
汉堡包图标
汉堡包图标是指在最近的程序中常见的菜单图标。它具有三个水平条(因此称为“汉堡包”)并将传统导航菜单隐藏在单个图标后面。
登陆页面
这是您网站的访问者将看到的第一个页面。在许多网站上,为了从访问者那里引出一些东西(例如共享他们的电子邮件地址,或专门用于产品的页面),使用特殊的登录页面。您的着陆页是您网站上最重要的页面之一,您应该花大量时间对其进行优化。
导航
导航是用于在网页元素之间移动的系统,并且是任何网页中最重要的元素之一。这就是为什么了解网站导航的关键原则很重要的原因。最清晰的导航示例是出现在大多数网页上的菜单。但也要密切注意页面的组织方式以及它们之间的链接。这些还可以使访问者更轻松地浏览网页。
后端网站剖析
后端
这是您的系统中有效运行您的网站的部分,但对访问者是隐藏的。有许多不同的后端可用,但它们通常都包含相同的内容——应用程序、信息结构和您的 CMS。
内容管理系统
内容管理系统——这是一个后端工具,用于运行您网站的内容、添加用户、管理评论等等。如果您曾经使用 WordPress 构建网站,那么您就使用过 CMS。CMS 使设计和构建网页变得更加容易,因为它隐藏了网站运行的大部分原始代码。
电子商务
电子商务代表“电子商务”。就像“电子邮件”代表“电子邮件”一样。您通常会在您的网站上添加一个电子商务商店,该商店将处理产品描述、购买和销售以及客户数据。
HTTP / HTTPS
这是处理浏览器、服务器和 Web 应用程序之间数据交换的系统。它定义了数据必须如何打包和发送。
HTTPS 是 HTTP 的扩展,能够通过 SSL(安全套接字层)建立连接。这是一种更安全的在线数据交换方式。如果网站使用标准 HTTP 而不是 HTTPS,许多现代 Web 浏览器会警告您。
作为网站所有者,您可以从各种提供商处购买 SSL 证书(使用 HTTPS 所需)。添加后,这将使您的网站更加安全并与您的客户建立信任。
插件
位于基本站点之上的一小部分软件,用于提供附加的安全功能。插件适用于大多数流行的 CMS 平台,可用于多种功能,从自动化博客文章到管理客户线索。
模板
模板在网页设计中的使用方式与它们用于文档和图像的方式大致相同——以提供跨许多不同页面的设计一致性。大多数 CMS 平台都会为您的网站提供一组模板,这将有助于使您的页面和设计在它们之间保持一致。
技术网络和互联网术语
锚文本
锚文本是一个短语或几个单词,其中包含一个超链接。像这样一个:锚文本解释。使用正确的锚文本可以对您的页面在搜索引擎排名中的表现产生巨大影响。
反向链接
这些是从其他网站到您网站的链接。例如,当另一个站点链接到您的站点以将其读者定向到某个资源时,您就收到了反向链接。在提高搜索排名方面,反向链接非常重要,因为来自受信任站点的多个反向链接将提高您站点的知名度。
带宽
带宽是一个在许多不同上下文中使用的术语,但它本质上是指在给定时间段内发送或接收的数据量。它可用于描述您的互联网速度,例如,通常以千比特每秒 (kbs) 为单位引用。但有时,它用于描述您每月可以使用多少数据作为您的网络托管包的一部分。
缓存
缓存是由 Web 浏览器保存的数据集合。这意味着下次用户访问该站点时,页面加载速度会更快,因为它是从本地内存加载的。
DNS
DNS 代表“域名服务”。这是您的网络浏览器用来查找网页位置的系统。当您键入99designs.com 时,您的浏览器将查看“DNS 表”,该表将这个人性化的地址转换为计算机友好的地址(即由数字组成)。DNS 系统会跟踪世界上所有网页的位置,以便您的浏览器可以找到它们。
域名
这是您网站的名称。您可以从许多公司购买域名。它们最多可以是 63 个字符。例如,99designs.com是我们的域名。
FTP
FTP 代表“文件传输协议”,是一种将文件和数据从本地存储(例如,在您的计算机上)传输到 Web 服务器的系统。为了使用 FTP,您需要下载一个称为 FTP 客户端的小软件。
永久链接
一个永久链接,允许您指定一个地址,该地址将始终指向特定的博客文章或页面,无论您如何更改围绕它的站点结构。如果您正在使用博客文章来提高站点的流量,这将非常有用,因为如果您决定重新设计站点或更改域名,则不必手动更改数十(或数百)个链接。
网址
指定可以在何处找到特定页面或其他资源的地址。
虚拟主机
网络主机是运行存储您网站的服务器的公司。正如我们在关于什么是网络托管的文章中所解释的那样,网络托管服务商提供的服务水平差异很大。一个好的网络主机将能够向您保证您的网站在 99.9% 的时间内都可以访问,并且还将为您提供确保其安全和有效的工具。
网络服务器
Web 服务器是实际存储您的网页的计算机。它可能位于您的网络主机拥有的服务器安装中,但也可以运行您自己的服务器。
Web 开发术语
CSS
CSS 代表级联样式表,与 HTML 一起,这些表是任何网页的最基本部分。十年前,网页上使用的格式(例如标题有多大或图片是否有边框)是在 HTML 代码本身中定义的。这意味着更改格式是一个费力的过程,需要遍历页面的每个元素并更改代码。
有了 CSS,事情就简单多了。页面的样式包含在一个(或多个)CSS 文件中,这些文件定义了标题的外观、图像的显示方式以及许多其他元素。这些告诉浏览器如何呈现网站。这样,只需切换一段代码就可以调整整个网站的格式。
DHTML
DHTML 代表动态超文本标记语言。这是一种将多种网页设计语言(HTML、JavaScript 和 CSS)融合为一种用于 Web 开发的超级语言的语言的术语。这通常是现代 Web 开发人员用来为您创建网站的方法。
文档类型
在 HTML 中,文档类型是对网页使用的 HTML 类型和版本的描述。浏览器使用它来检查页面的完整性,如果错误,可能会引发安全错误。
Em
Em 用于描述与页面上使用的“父”字体相关的字体大小。1Em 表示字体(或有时其他元素)与其父元素的大小相同,2em 表示它们的大小是其两倍,依此类推。
嵌入式样式
尽管 CSS(见上文)可用于一次描述整个页面的格式,但有时您只需要更改一页上的样式。这是使用嵌入式样式的时候。嵌入样式是一段写入网页标题的 CSS 代码,它仅影响该页面上的元素,而不影响整个网站的元素。
字体系列/样式/粗细
Web 设计人员和开发人员通常不使用特定字体,因为不同的浏览器并不总是共享完全相同的字体。这就是为什么在 CSS 文档中,您会看到要使用的字体被定义为一个字体系列——一组可以使用的字体,而不是一个特定的字体。除了这个定义,CSS 文档还将定义字体样式(斜体、下划线等)和粗细(粗体、浅色等)。
HTML
超文本标记语言——这是互联网的基础。所有网页至少在某种程度上都是用 HTML 编写的,HTML 被开发为尽可能容易编写。这可能是非常有益的,事实上,尝试一个HTML 代码教程,看看它是否容易编写——你会惊讶于你能在几个小时内实现什么!
元数据
元数据是包含在网页标题中的数据。这些数据可用于您的浏览器,但不会作为您正在查看的网页的一部分显示——您必须查看源代码才能访问它们。
开源
开源软件由用户维护,可以免费使用和修改。这与由特定公司拥有和维护的专有软件形成对比。大多数 Web 开发人员会使用开源软件,至少在某些时候是这样,因为它不仅更便宜,而且更安全。如今,大多数 Web 开发人员将通过使用以开源语言编码的容器来最大程度地减少安全漏洞。
临时站点
暂存网站是制作网站的几乎最终副本的过程,然后在推出网站的实时版本之前对其进行测试。大多数 Web 开发人员会在网站发布之前“暂存”网站,以检查一切是否正常工作。通常情况下,网站的重大更改会发生在临时站点而不是实时站点上。
有效的
在网页设计中,有效的网页是那些没有错误的网页。实际上,这意味着网页符合W3C 发布的 HTML 规范中规定的标准,W3C是为 Web 开发制定标准的社区。
XML
XML 代表可扩展标记语言。XML 是网页设计的基本部分,因为它充当“元语言”,将一种语言的元素转换为另一种语言。这意味着可以使用多种不同的语言构建网页,每种语言都通过 XML 进行通信。
最后一句话
当然,开始设计网站时无需了解所有这些网页设计定义和术语——无论是您自己还是在帮助下。归根结底,网页设计是一个学习过程,最好的设计是迭代的艺术作品,随着您学习新事物而不断改进。
也就是说,拥有一份有关有时复杂的网页设计世界的指南会非常有帮助,尤其是在您刚开始时。我们专业的网页设计师可以帮助您开始激动人心的网页设计世界。