网站设计应该注意些什么用眼球跟踪改善网页设计

首页> 缘震优势

缘震优势

2015-11-02 00:00:00

你在看机器，机器也在看你。最近眼球跟踪技术诞生了不少的应用案例。比方说，Intel 研发 3D 笔记本摄像头，可以追踪眼球读懂情绪;上海琢视的纯软件眼球追踪可支持用眼睛玩打飞机游戏等。现在EyeQuant则利用先进的神经技术研究用户眼球看网页时的运动，从而生成设计元素和网页区域的热点图(即用户的注意力集中的区域)，再研究如何改进网页设计。以下就是他们的发现。
Web设计应该注意什么
眼球跟踪技术的第一个发现是，Web 的 F 和 E 形模式布局设计(利用用户大都最喜欢观看左侧屏幕的特点进行布局)未必就是对的。只要内容吸引眼球，不在 F 或 E 形模式区的地方一样会受人关注。比方说，高对比度、中心布置及排列整齐的内容。实际上，Web设计时应该更关注3W：网页要说什么(What)，用户为什么要关注(Why)以及接下来要去哪里(Where)。
某些Web设计的最佳实践受挑战
还有一些 Web 设计的最佳实践受到了眼球跟踪技术的挑战。比方说，传统观点认为人总是会注意脸部。EyeQuant 在用眼球跟踪技术研究了数千个不同网站后发现，脸部和注意力的确存在关系，但是人却未必总是关注脸部。另一个 Web 设计的观点是要想让文字突出，就得把字体放大。但研究发现，尽管有些页面的字体很大却被用户无视。
关于图库的选择与使用
要想图片引人注目，最重要的是要有高反差—不仅图片本身要有高反差，而且相对于页面的其他内容也要形成强烈对比。这不光是颜色的对比，在亮度上也要有反差。图片需放在上半版面，位于中间或者坐上位置。而且不要放得太凌乱，应该给页面留点空白的空间。
像旋转横幅和幻灯片这样的重图像元素有效性如何?
运动的确可以在开始时吸引注意。换句话说，也可能造成干扰，而这些元素往往只跟一部分浏览网页的用户相关，所以对于商业网站来说，这些元素反而会对转化率产生负面影响。
像苹果用的那种日渐流行的大英雄区域是否有效?
所谓的大英雄区(Big hero area)是指大幅图像伴随少量文字的布局，苹果尤其擅长使用。如图像是相关的话，大英雄区极其有效，否则的话就会造成干扰。如果采用图库的图片的话，必须挑选可支持希望传递信息的图片，而且不要过多分散对页面其他关键内容的注意力。
长幅滚动页面还是让重要元素保持在上半版面?
部分长幅面的滚动页面的确非常成功，而且用户对此似乎也越来越习惯。但是数据表明一般用户仍把大部分时间花在上半版面。
链接按钮应该如何设计?
人是对比生物，所以按钮与背景色之间，按钮文字和按钮之间都必须形成鲜明对照。
用户会看哪里?
作为设计师应该有能力影响用户看什么地方，而不应该成为某个布局或模式的奴隶。元素在页面的布置只是影响用户关注的其中一个因素。只要理解了注意力的建构要素，你想让他们看哪里他们就会看哪里。哪些是影响注意力的要素呢?这四个：对比，位置，大小和空白区域。

网站的基本原理有哪些？

流行网站建设.jpeg

网站的基本原理主要涉及以下几个方面： **一、技术架构** 1. 客户端-服务器模型 - 网站基于客户端-服务器架构运行。客户端通常是用户使用的浏览器，如 Chrome、Firefox、Safari 等。当用户在浏览器中输入网址（URL）并按下回车键时，浏览器会向服务器发送请求。 - 服务器是存储网站文件和数据的计算机系统。服务器接收到客户端的请求后，会根据请求的内容返回相应的文件和数据。 2. 服务器端技术 - 服务器端通常使用服务器软件，如 Apache、Nginx、IIS 等，来处理客户端的请求。服务器软件负责接收请求、解析请求、查找相应的文件和数据，并将其返回给客户端。 - 服务器端还可以使用编程语言和框架，如 PHP、Python、Java、Ruby on Rails 等，来动态生成网页内容。这些编程语言和框架可以与数据库系统（如 MySQL、PostgreSQL、MongoDB 等）进行交互，获取和存储数据。 3. 客户端技术 - 客户端主要使用 HTML、CSS 和 JavaScript 等技术来显示网页内容和实现交互功能。HTML（超文本标记语言）用于定义网页的结构和内容，CSS（层叠样式表）用于控制网页的外观和布局，JavaScript 用于实现网页的交互效果和动态功能。 **二、工作流程** 1. 用户请求 - 用户在浏览器中输入网址或点击链接，浏览器会向服务器发送 HTTP 请求。请求中包含了要访问的网页的 URL、请求方法（如 GET、POST 等）、请求头和请求体等信息。 2. 服务器响应 - 服务器接收到请求后，会根据请求的 URL 和服务器的配置，查找相应的文件和数据。如果请求的是静态文件（如 HTML、CSS、JavaScript、图片等），服务器会直接将文件返回给客户端。如果请求的是动态内容（如由服务器端编程语言生成的网页），服务器会执行相应的程序代码，生成网页内容，并将其返回给客户端。 - 服务器返回的响应通常包括响应状态码（如 200 OK、404 Not Found 等）、响应头和响应体等信息。响应体中包含了网页的内容，可以是 HTML 代码、JSON 数据、图片等。 3. 浏览器渲染 - 客户端浏览器接收到服务器的响应后，会根据响应的内容进行渲染。浏览器首先解析 HTML 代码，构建网页的结构。然后，浏览器会应用 CSS 样式，控制网页的外观和布局。最后，浏览器会执行 JavaScript 代码，实现网页的交互效果和动态功能。 - 浏览器在渲染网页的过程中，可能会向服务器发送额外的请求，如获取图片、视频、字体等资源。这些请求也会按照上述的工作流程进行处理。 **三、数据存储和传输** 1. 数据存储 - 网站的数据可以存储在服务器端的数据库系统中，也可以存储在文件系统中。数据库系统通常用于存储结构化的数据，如用户信息、文章内容、订单数据等。文件系统通常用于存储非结构化的数据，如图片、视频、音频等。 2. 数据传输 - 客户端和服务器之间的数据传输通常使用 HTTP 协议。HTTP 是一种无状态的协议，即服务器不会记住客户端的请求历史。为了实现状态管理，网站通常会使用 Cookie 和 Session 等技术。Cookie 是存储在客户端浏览器中的小文件，用于存储用户的信息和状态。Session 是存储在服务器端的会话数据，用于跟踪用户的会话状态。总之，网站的基本原理是基于客户端-服务器模型，通过 HTTP 协议进行数据传输，使用 HTML、CSS 和 JavaScript 等技术来显示网页内容和实现交互功能，使用数据库系统和文件系统来存储数据。理解网站的基本原理对于网站开发、维护和优化都非常重要。