网站建设中导航设计的原则你了解多少?
对于网站建设中导航设计的原则你了解多少?网站的导航,包括顶部、底部和侧面的导航都应该尽可能地对用户友好、易用,保证用户看到的在尽可能的显眼位置,网站建设各导航间应该反映出各个目录和子目录,以及各个主题之间的逻辑性、相关性,帮助用户找到主要相关内容。下面小编来讲解下网站建设中导航设计的原则:网站LOGO链接 每一个出现的网站LOGO都要加上回到网站首页的链接,用户已经习惯了点击网站LOGO作为回到网站首页的方法。辅助导航 为用户提供一个直观的指示,让用户知道现在所在网站的位置,每一级位置的名称都得有链接可返回,在每一个网页都必须包括辅助导航以及左上角的网站LOGO标识。联系信息 进入联系我们网页的链接或者直接呈现详细的联系方式都必须在网站的任何一个网页中可以找到。导航条的位置 主导航条的位置应该在接近顶部或网页左侧的位置,如果因为内容过多需要子导航时,要让用户容易地分辨出哪个是主导航条,哪个是某主题的子导航条。导航使用的简单性 导航的使用必须得尽可能的简单,避免使用下拉或弹出式菜单导航,如果没办法一定得用,那么菜单的层次不要超过两层。登陆退出口 登陆入口和退出登陆出口要在全网站的每一个网页都可以找到,让用户进入任一网页都可以登陆和退出。导航设计功能性问题。导航的功能设计可以提高或降低整个网站的表现,功能完善的导航可以让用户快速地找到他们想要的东西,否则就会赶走用户。网页指示 应该让用户知道现在所看的网页是什么和与现在所看网页的相关网页是什么,例如通过辅助导航首页新闻频道新闻全名里的对所在网页位置的文字说明,同时配合导航的颜色高亮,可以达到视觉直观指示的效果。已浏览网页的指示 最简单地可以通过已点击超链后的变色,如果不在同一网页的超链接网页,可以在其它位置显示用户已浏览过的内容。准确的导航文字描述 用户在点击导航链接前对他们所找的东西有一个大概的了解,链接上的文字必须能准确描述链接所到达的网页内容。导航内容明显的区别 导航的目录或主题种类必须得清晰,不要让用户困惑,而且如果有需要突出主要网页的区域,则应该与一般网页在视觉上有所区别。导航的链接必须全是有效链接 无论是一般导航还是有下拉菜单的导航,里面的所有文字都应该是有效的链接。
网页设计制作作业的任务要求
任务 1: 学会基本的HTML(5)标签骨架以及基本服务器概念1.开发基础百度首页要求:· 学会配置开发环境· 学会使用基本的HTML结构搭建骨架· 基本符合视觉上的要求· 让整块在页面大致垂直居中· 页面的点击全部为真实点击· 并不要求CSS2.开发课程表要求:· HTML&HTML5标签及表格table的使用;· 代码结构的处理· HTML5语义的使用· 提前学习,使用了css进行美化。任务 2: 学会HTML5新增元素及CSS核心技术1.制作一个由5个100*100DIV组成的十字架要求:· 制作一个由5个100*100DIV组成的十字架(如),· 中间放一张icon(自己喜欢的64*64的小图片)在DIV里垂直水平居中,· 十字架页面垂直居中水平居中,每一个DIV要有边框阴影尽量的让其漂亮。2.制作家教网注册页面要求:· 青岛家教网注册页面是一个N年前非常传统的老式页面,很陈旧,需要大家用自己新学过的HTML&HTML5&CSS&CSS3的知识,一些新的表单元素,重新实现和改良这个页面,达到熟悉表单元素的目的(传统input和H5的混用达到全部熟悉的目的)。· 具体要制作的页面,入口在 /member/register_1.asp(不需要做),先填写一些资料后进入下一个页面/member/register_2.asp就是我们需要制作的。3.让百度首页样式完全与官网样式完全一致要求:· 试着使用HTML5元素改良百度首页且样式尽可能完全与官网完全一致(仅要求谷歌浏览器)。· 本题难点在于百度首页顶部菜单鼠标悬浮下拉菜单的效果,当前阶段未学JS, 可以参考使用伪类:hover尽可能去实现,但不做太多要求。4.实战盒子模型与弹性盒模型。要求:· 正常盒子与怪异盒子对比· 弹性盒子水平分栏,垂直分栏,排序(flex),cloumn分栏· 旧版弹性盒子居中布局· 美观程度任务 3: 学会CSS常用布局技巧以及绘制特殊图形和动画1.CSS3开发3D魔方要求:· 使用CSS3开发炫酷的3D魔方效