于任何网站而言,配色方案都是其中最关键的影响因素之一。你可以使用你所熟悉的配色方案,也可以跳出来选择更加大胆、明快、更有性格的配色方案,它们或许更容易给人留下深刻的印象。
而今天我们要说的,是黄色。作为暖色调,黄色象征能量,带来温度,充满生命力,它可以让你的网站看起来更具有亲和力,舒适而温馨。毫无疑问,黄色色调的网站设计大多都非常的醒目,让人难以忽视。
但是同时,它也是一个不容易掌控的颜色,一个不小心可能会毁掉网站的整个设计。所以,你需要清楚地了解黄色的运用手法——比如先看看那些设计优秀的网站是怎样使用大面积黄色色调的。在黄色作为主色调/背景色的时候,文字内容如何展现,各种控件如何使用,这些都值得学习。
明快的黄色和动感的舞蹈有着天然的契合度,这也是为什么瑞士城市舞蹈学院选择使用黄色作为网站的主色调。为了确保网站内容的识别度,设计师采用的是黄黑搭配。
拥有韩国血统的摄影师JamesTupper 也在设计他的作品展示页的时候选择了黄色作为主色调。 在字体配色上,他同样选取了黑色。
YAY 是一个平面设计类的合集网站,黄黑的配色使得文字内容无比的醒目。
黄色的色调和其他的色彩也可以很好的搭配,重要的是控制好对比度,这里的插画的色调控制就非常合理,不会太深,但是和背景的黄色形成了很好的对比。
这是一位来自英国剑桥、获得过不少奖项的设计师的个人作品网站。网站设计大气,但是它最大的特色是交互,无论你是在桌面端、平板还是手机上访问,交互的丰富度都非常的强。
Croscon 是一个植根于设计和数字制造业的定制化软件,网站的配色主色调黄色使用了黑色和白色来做搭配。
Vivedmv 的网站所用的黄色饱和度相对较低,看起来也更加复古,搭配上复古的字体、图形元素,整体的氛围非常的一致。
这个网站在功能开发和内容策略上达到了一个不错的平衡,在色调的搭配上也很好的体现出了设计、开发和内容三方面的功力。
依然是黄、黑、白的色彩搭配,经典的黄黑支撑起整个视觉,而白色在整个配色中显得更加醒目,它承载了LOGO、副标题和关键性的按钮。
作为一个在线学习网站,Lambda 所用的主题基本上是经过深度定制的,深蓝灰和白色占据了大量的面积,而黄色在整个网站中作为提亮色,很好的强调了关键性的内容与操作。
Fitness 是一个为健身房和运动所定制的一个WP主题,极简的风格、黄黑为主的色彩搭配让这个主题在视觉上颇为突出。
Mobirise 是一个免费的BootStrap 模板,整体设计风格非常现代。和前面许多网站在配色上不同,它没有使用黄黑来搭配,而是使用偏橙色的黄色和灰色搭配起来,文字内容则使用了白色。
ENERGY 是一个运动健身类的WP主题,黄色醒目的特色在这个主题中被体现的淋漓尽致。
Ethanol Portfolio 是一个干净简约的免费Bootstrap 网站模板,这个简约的模板是多功能的。黄色的文本标题在暗色调的背景上显得无比清晰。
Xpress 用作作品展示或者时尚类的内容网站都是是相当不错的选择,黄色这一配色在网站中被很好的运用了起来。
Darklowpress 是一个WP博客主题,大量的可定制的轮播图能够让你更好的展示多媒体信息。
Pluton 是一款现代多功能的HTML5着陆页,基于BootStrap来开发的。整个网站使用了许多最新的HTML5、CSS3 和 jQuery 技术。
Agency 是一款有范儿的单页式Bootstrap主题,对于商业机构和小公司而言,这个主题相当的不错。这套主题的设计则是基于Golden PSD。
这个网站是一个为出租车公司所设计的,黄色的色调和出租车的基础色调保持了一致。
Hotel Deluxe 同样是一个响应式的网页模板,其中黄色也是网站中最醒目的色彩而起到关键性的作用。
过更多网站的浏览,我们可以看出每一个网站都有自己的特点,从页面设计上使用的颜色搭配也是不同,有些看上去很专业,有些看上去却很难看。其实,页面的颜色搭配设计也是有学问的,下面小编就来详细介绍下。
首先网站页面的颜色尽量使用安全色,即自然界中存在的颜色,而非电脑合成的颜色。背景色与文字对比度要高,一般来说白色背景常会选择黑色字体,当然这也不是绝对的,像深蓝色、灰色也是网页字体常用的色彩。
其次是不要在网站中同时出现蓝色与红色,蓝色与黄色,绿色/蓝色与红色,因为这几类颜色同时出现会给人的视觉带去不好的影响。颜色使用要始终具有同一性,在网页配色中,尽量控制在三种色彩以内,以避免网页花、乱、没有主色的显现。背景和前文的对比尽量要大,以便突出主要文字内容。
最后就是尽量少用或者不用细小的字体或蓝色表格。利用留白来平衡网站中的颜色吸引用户,始终保持颜色的统一。
按照上面的建议大家可以去试试,只要避免这些问题后,最终设计出来的网站会得到很高的分数。
文章出自畅想网络,转载地址:http://www.e-wkj.cn/xw/2153.html
TML 基础
非常简单的HTML文档
HTML 标题
HTML 段落
HTML 链接
HTML 图片
实例解析
HTML 标题
HTML 标题
在html源码中插入注释
插入水平线
实例解析
HTML 段落
HTML 段落
更多段落
本例演示在 HTML 文档中折行的使用。
HTML 格式化的某些问题。
实例解析
HTML 文本格式化
文本格式化
此例演示如何使用 pre 标签对空行和空格进行控制。
此例演示不同的"计算机输出"标签的显示效果。
此例演示如何在 HTML 文件中写地址。
此例演示如何实现缩写或首字母缩写。
此例演示如何改变文字的方向。
此例演示如何实现长短不一的引用语。
文本下划线与删除线
实例解析
HTML 样式
HTML Style 元素
背景色样式
字体样式,颜色,大小
文本对齐样式
设置文本字体
设置文本字体大小
设置文本字体颜色
设置文本字体,字体大小,字体颜色
HTML使用不同样式
没有下划线的链接
链接到一个外部样式表
实例解析
HTML 链接
创建超级链接
将图像作为链接
在新的浏览器窗口打开链接
链接到同一个页面的不同位置
跳出框架
创建电子邮件链接
创建电子邮件链接 2
实例解析
HTML 图像
插入图像
从不同的位置插入图片
排列图片
本例演示如何使图片浮动至段落的左边或右边。
制作图像链接
创建图像映射
实例解析
HTML 表格
简单的表格
没有边框的表格
表格中的表头
带有标题的表格
跨行或跨列的表格单元格
表格内的标签
单元格边距(Cell padding)
单元格间距(Cell spacing)
实例解析
HTML 列表
无序列表
有序列表
不同类型的有序列表
不同类型的无序列表
嵌套列表
嵌套列表 2
定义列表
实例解析
HTML Forms 和 Input
创建文本域(Text fields)
创建密码域
复选框
单选按钮
简单的下拉列表
预选下拉列表
本例演示如何创建一个文本域(多行文本输入控件)。
创建一个按钮
本例演示如何在数据周围绘制一个带标题的框。
带有文本域与输入域的表单
带有复选框与提交按钮的form表单
带有单选框与提交按钮的表单
发送邮件表单
实例解析
HTML iframe
内联框架 (HTML页面中插入框架)
实例解析
HTML 头部元素
描述了文档标题
HTML页面中默认的URL链接
提供文档元数据
实例解析
HTML 脚本
插入一个脚本
使用 <noscript> 标签
实例解析
如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039,我们一起飞!
*请认真填写需求信息,我们会在24小时内与您取得联系。