设计一个网站

视频: 如何设计一个漂亮的Wordpress网站 - 2021 - 零基础教程，一步步详细演示，初学者宝典

内容

踩
方法1之2：3条基本规则
方法2之2：准则
尖端
警示语

设计一个出色的网站似乎是一项艰巨的任务，但是只要牢记基础知识，您就会发现该过程有趣而有趣。不仅仅是美观！我们将向您展示基础知识和一些通用准则，以帮助您设计人们会一次又一次访问的网站。

踩

方法1之2：3条基本规则

规则1：听你的客户。您可能正在设计“有史以来最伟大的网站”，其中包含丰富的黑色，精致的字体以及明亮的艺术色彩，而这个网站却在尖叫着“让我探索！”。不幸的是，您的客户想要一个带有明亮的粉红色和橙色字母的橙色菜单栏。您已经被炒鱿鱼了，而客户有权访问的有史以来最好的网站就位于其备份磁盘上，而没有人再次看到它。
- 研究您客户的企业形象。让客户向您展示一些他们喜欢的网站。这不仅会让您了解他们的喜好，还会为您提供一些您可能没有想到的设计想法。
- 如果您认为我们在开玩笑的是橙色和粉红色的网站，请考虑以下酷炫，精致的网站：
规则2：了解您的听众以及他们在寻找什么，并相应地调整您的设计。人们拥有网站的原因是因为他们希望其他人看到它们。它可以提供信息，也可以进行商业宣传，也可以招待特定的目标受众。作为设计师的工作是要知道要为谁设计，并在他们到达那里时将其保留在页面上。
- 您可能会想，“如果看起来不错，他们会留下来的。”但这不一定是事实。以房地产为例。这是一个设计简洁有趣的网站。它有很多白色空间，给人以开放的外观，明亮的色彩和现代的宽屏格式，并在醒目位置提供了链接：
- 现在来看一下在同一地区出售房地产的这种方法：凌乱且非常忙碌，色彩沉闷且覆盖广告。
- 猜猜哪一个对寻找房屋的人更合适？是的，那一处房屋！当人们搜索“圣莫尼卡待售房屋”时，他们并不关心网站的外观。他们不想阅读有关房地产经纪人的信息，也不希望看到城市的漂亮图片。他们想看房子。
规则3：听你自己。您了解客户的需求，也知道您的市场在寻找什么。现在终于是时候关注您，设计师！
- 在您选择的图形软件中构建模板。将页面的元素放在不同的图层上（以便以后可以调整内容而不破坏整个模板）。这些元素可以是：
  - 标头。这是一个元素，在您网站的每个页面上都相同。标题包括网站的标题和徽标，以及网站其他部分的链接（例如，关于，联系方式等）。在视觉上和实践上，这将把它们绑在一起。优良作法是将菜单栏上的第一个按钮链接回首页。
  - 例如，让我们看一下Apple：
  - 与大多数Apple产品一样，其主页设计非常简洁明了。请注意顶部的菜单栏，每个按钮带有逻辑主题，外加一个搜索字段-如果您的站点支持它总是一个好主意。现在，让我们看一下其中一个按钮（iPad）的登录页面，以了解一些元素：
  - 菜单栏仅通过使iPad按钮变暗来更改。
  - 登陆页面的主题以黑色大字体显示。
  - 将会出现一个新的子菜单，以便您可以了解有关该产品的更多信息。如果单击这些按钮之一，您将看到每个页面根据主题提供新内容，但布局和设计将相同。
  - 通常，菜单栏中的每个主要主题都会有不同的子标题供您填写。除了创建第二个菜单栏，您还可以使用像Musicians Friend这样的示例中的弹出菜单：
  - 侧边栏。这将显示在您网站的许多页面上，但不一定显示在所有页面上（取决于上下文）。但是，它是非常重要的元素，必须仔细设计以使其直观且不会过于混乱。与菜单栏不同，侧栏的内容可以非常动态。查看来自房地产营销商Trulia的这两个侧边栏第一个是针对购买者的：

方法2之2：准则

设计一个良好的用户界面。 将网站的各种元素（例如标题，侧边栏，徽标，图像和文本）放置在每个页面上的同一位置，以使您的网站易于导航和直观。
- 在每个页面的顶部保留相同的标题。无论您网站的内容是否包含很多重复元素，请确保每个页面的顶部都相同。
- 在设计中使用逻辑。单个页面上的元素应按重要性或主题进行逻辑排序；网站上的不同页面也应该如此。
创建一致的样式。 如果布局应使站点结构一致，则样式应提供主题和谐。
- 坚持使用两种或三种主要颜色，并确保它们配合得很好。
- 避免使用太多的字体样式或大小；如果要交替显示，请在每页上以相同的方式使用它们。
- 使用级联样式表（CSS）可以保持统一的样式，并使在整个网站上更改元素变得更加容易，而不必分别转到每个页面。
最大化可读性。 为了使文本更易于阅读，可以将其拆分为较小的部分。
- 使用字幕和适当的间距分隔每个部分。
- 使用粗体字母或其他大小显示主题的层次结构和重要性。
- 注意您如何对待文本。不要将字体设置得太小，而要增加行距，以使大块的文本更易于阅读。大块的文本更难以阅读；将其分解为较小的段落。
使您的网站具有普遍可读性。 使用标准HTML，避免使用仅适用于一种品牌或版本的浏览器的标签，功能和插件。
- 尽管大多数现代浏览器和计算机都可以处理复杂的图像，但是如果您缩小并优化Web图像，一切都会显得更加流畅。权衡质量的重要性和速度的重要性。
测试您的网站。 确保 每个链接都有效 如您所愿，并且图像正确显示。
- 您可能希望通过让目标受众的成员测试设计的清晰度和易用性并提供有关您的网站的反馈来组织一些用户测试。
发布您的网站。 如果尚未购买域名。定期检查链接是否仍然有效，并听取访问者通过电子邮件向您发送的建议。

尖端

尽管您可以根据自己的个人见解或在其他站点上看到的东西来自由设计布局，但购买现成的设计会更容易。
不要用可爱，特殊的照片轰炸访客。 Flash动画，鲜艳的色彩，有图案的背景以及在页面加载时自动播放的音乐在90年代是有趣的实验，但现在它们会吓跑用户。坚持使用与文字颜色形成对比的简单背景，以最大程度地提高可读性。
您始终可以使用CSS优化段落间距。
对于有听觉或视觉障碍的访客，您可以为视频加上字幕，转录音频并添加可访问性消息。尽管表格是组织信息的有效方法，但是使用屏幕阅读器软件的视障访客可能无法正确地听取材料。
让您的访客节省墨水：对打印页面使用单独的样式表。
- 设置打印参数时，请关闭背景图像。
- 在白色背景上使用黑色文字。
- 删除菜单栏和不必要的图像。