《众妙之门——网页排版设计制胜秘诀》——3.4 展现品牌视觉的同时保持网页的可读性...

本节书摘来自异步社区《众妙之门——网页排版设计制胜秘诀》一书中的第3章,第3.4节,作者: 【德】Smashing Magazine 译者: 侯景艳 , 范辰 更多章节内容可以访问云栖社区“异步社区”公众号查看。

3.4 展现品牌视觉的同时保持网页的可读性

为了让网页在浩瀚的互联网世界中脱颖而出,设计师需要让网页的视觉设计保持很高的质量。在某些情况下,这意味着你要对网页进行精心的设计。随着演示性和风格性的网站越来越受欢迎,一定要为网页挑选最适合的版式,这一点特别重要。下面,让我们来看一些风格独特的网站,它们都在设计中使用了丑和脏的元素。我们已经在文章“The Secrets Of Grunge Design”中看过了这些网站,只是形式不太一样罢了。

在Pain is Good网站,品牌理念主导着网页的设计(见下页)。网页上大多数文字都被图片所替代,这让设计师能够充分利用品牌识别的力量。

当我们把字体嵌入图像中,就能以各种富有创意的方式来利用它们。设计师为了强调品牌理念,在商标中使用了“pain(痛苦)”字样,但因为是图像而非文字,所以将会被搜索引擎屏蔽。而且顶部的导航栏也做了非常规的处理,致使导航栏元素间的对比很弱,虽然能看清楚,但还是应该稍作改善。


d1387045abdd711fbe225a7addf81545e9036c35

Bart-Jan Verhoef网站则更注重文字而不是视觉元素。设计师精心挑选了一些品牌和设计元素用图像来表达,但是大部分仍是文字表述。设计氛围通过背景图片

营造出来,而文字的功能性未受影响。

这种方式既能营造出“脏”设计的感觉,又能很好地满足用户的需求。下面即将讲述“将文字看作用户界面”部分,先读一读这个章节的内容,再回过头看上面的设计,你就能体会个中内涵。


27738003e0739432bd472c4c30894840b6eb0e49

这是一个结合了美观与可读性的出色例子:www.subdued.net。

当然,设计师和艺术家还会继续在可读性的范畴中探索。最佳的方式就是在个人的设计案例中进行各种设计实践,比如下面的网站Exp Typo。注意,页面左下角与旧打字机图片交叠部分的文字很难辨认。


ec42c2932d669f66536a14336de3785122afeed9

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/259001.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

vs2013创建及使用DLL

这几天看了许多关于生成Dll的博文,很有感触,遂整理在此,以供自己后续参考。 VS2013创建DLL 我们使用vs2013来生成Dll,其实使用其他的版本也是同理如此。步骤如下: 单击“新建项目”,选择“Win32 项目”&a…

iOS UISegmentedControl 的使用

当用户输入不仅仅是布尔值时,可使用分段控件(UISegmentedControl)。分段控件提供一栏按钮(有时称为按钮栏),但只能激活其中一个按钮。分段控件会导致用户在屏幕上看到的内容发生变化。它们常用于在不同类别…

js粘贴板为什么获取不到图片信息_【第1829期】复制黏贴上传图片和跨浏览器自动化测试...

前言这个操作体验倒是不错。今日早读文章由丁香园蒋璇投稿分享。蒋璇, 前端开发攻城狮, 现任职于丁香园. 英语爱好者, 测试驱动开发(TDD)&行为驱动开发(BDD)推崇者. 先专注于 https://github.com/Jiang-Xuan/tuchuang.space 项目的测试驱动开发探索正文从这开始~~在网页中上…

《淘宝网开店 拍摄 修图 设计 装修 实战150招》一一2.7 横式构图和竖式构图...

本节书摘来自异步社区出版社《淘宝网开店 拍摄 修图 设计 装修 实战150招》一书中的第2章,第2.7节,作者: 葛存山,更多章节内容可以访问云栖社区“异步社区”公众号查看。 2.7 横式构图和竖式构图 横幅画面,即画面底边…

python request file upload_Python基于requests实现模拟上传文件

方法1: 1.安装requests_toolbelt依赖库 #代码实现 def upload(self): login_token self.token.loadTokenList() for token in login_token: tempPassword_url self.config[crm_test_api]/document/upload tempPassword_data self.data_to_str.strToDict(title:1.…

《OpenGL ES 2.0游戏开发(上卷):基础技术和典型案例》——6.5节光照的每顶点计算与每片元计算...

本节书摘来自异步社区《OpenGL ES 2.0游戏开发(上卷):基础技术和典型案例》一书中的第6章,第6.5节光照的每顶点计算与每片元计算,作者 吴亚峰,更多章节内容可以访问云栖社区“异步社区”公众号查看 6.5 光照…

如何在Debian上安装配置ownCloud

如何在Debian上安装配置ownCloud 据其官方网站,ownCloud可以让你通过一个Web界面或者WebDAV访问你的文件。它还提供了一个平台,可以轻松地查看、编辑和同步您所有设备的通讯录、日历和书签。尽管ownCloud与广泛使用Dropbox非常相似,但主要区别…

[转]js判断url是否有效

本文转自:http://www.cnblogs.com/fumj/p/3490121.html 方法一:(仅适用于ie) function CheckStatus(url){XMLHTTP new ActiveXObject("Microsoft.XMLHTTP")XMLHTTP.open("HEAD",url,false)XMLHTTP.send()return XMLHTTP.status200}function Ne…

32位md5解密_冰蝎特征检测及报文解密

点击“蓝字”关注我们,不迷路~‍‍前言19年驻场于某金融单位。参加19年9月、11月两次攻防演练,负责攻防演练组织、技术支持和复盘。期间,多个攻击队伍使用冰蝎 webshell ,防守方监测时确实各 IDS 确实报出 webshell 连接&#xff…

《移动App测试的22条军规》—App测试综合案例分析23.13节测试微信App的流量和电量消耗...

本节书摘来自异步社区《移动App测试的22条军规》一书中的App测试综合案例分析,第23.13节测试微信App的流量和电量消耗,作者黄勇,更多章节内容可以访问云栖社区“异步社区”公众号查看。 23.13 测试微信App的流量和电量消耗关于微信App消耗流…

python做数据可视化的代码_Python数据可视化正态分布简单分析及实现代码

Python说来简单也简单,但是也不简单,尤其是再跟高数结合起来的时候。。。 正态分布(Normaldistribution),也称“常态分布”,又名高斯分布(Gaussiandistribution),最早由A…

wpf window 不执行show 就不能load执行_Numpy反序列化命令执行漏洞分析(CVE-2019-6446)附0day...

1、介绍 NumPy 是 Python 机器学习库中之一,主要对于多为数组执行计算。NumPy 提供大量的 函数和操作,能够帮助程序员便利进行数值计算。在 NumPy 1.16.0 版本之前存在反序列化 命令执行漏洞,用户加载恶意的数据源造成命令执行。2、环境 软件…

使用Def文件导出dll

前面我们介绍了dll的生成,大多数是使用extern "C"__declspec(dllexport)函数名的方法导出dll。其实我们还有另一种方法来导出dll。 先介绍参考文献: 1.dll导出声明相关 2.VS2012中 C创建DLL图解 3.DLL中导出函数的两种方式(dllexport与.…

XML语法学习

本文章集合两篇博文而写&#xff0c;两篇博文地址&#xff1a; XML学习总结(二)——XML入门&#xff1a; XML基础<第一篇> XML简介 XML是一种标记语言&#xff0c;用于描述数据&#xff0c;它提供一种标准化的方式来来表示文本数据。XML文档以.xml为后缀。需要彻底注…

FM实现F4帮助系列三:弹出框多筛选…

FM实现F4帮助系列三&#xff1a;弹出框多筛选条件的搜索帮助&#xff08;根据搜索帮助筛选字段&#xff09;函数&#xff1a;F4IF_GET_SHLP_DESCRF4IF_START_VALUE_REQUEST效果图&#xff1a;本例子代码&#xff1a;找到需要的帮助:*&------------------------------------…

《计算复杂性:现代方法》——0.2 判定问题/语言

本节书摘来自华章计算机《计算复杂性&#xff1a;现代方法》一书中的第0章&#xff0c;第0.2节&#xff0c;作者 &#xff3b;美&#xff3d;桑杰夫阿罗拉&#xff08;Sanjeev Arora&#xff09;&#xff0c;博阿兹巴拉克&#xff08;Boaz Barak&#xff09;&#xff0c;译 骆吉…

python从date目录导入数据集_使用python划分数据集

无论是训练机器学习或是深度学习&#xff0c;第一步当然是先划分数据集啦&#xff0c;今天小白整理了一些划分数据集的方法&#xff0c;希望大佬们多多指教啊&#xff0c;嘻嘻~ 首先看一下数据集的样子&#xff0c;flower_data文件夹下有四个文件夹&#xff0c;每个文件夹表示一…

开源牛人 zcbenz

事情是这样的&#xff0c;微软推出了Visual Studio Code&#xff0c;我很好奇他怎么做跨平台的&#xff0c;所以就找找资料&#xff0c;在他的网站中是这么描述的&#xff1a; Architecturally, Visual Studio Code combines the best of web, native, and language-specific t…

eclipse 与 tomcat 的那些路径

我们用mvn创建了一个web工程&#xff0c;同时希望在eclipse里调试开发。mvn有mvn的路径要求&#xff0c;eclispe有eclipse的默认路径&#xff0c;怎么整合二者&#xff1f; 首先介绍一下eclipse的默认路径。 重点在Server Locations里面。 下面我们把[workspace]/.metadata\.pl…

python数据处理常用函数_pandas数据分析常用函数总结大全:上篇

基础知识在数据分析中就像是九阳神功&#xff0c;熟练的掌握&#xff0c;加以运用&#xff0c;就可以练就深厚的内力&#xff0c;成为绝顶高手自然不在话下&#xff01; 为了更好地学习数据分析&#xff0c;我对于数据分析中pandas这一模块里面常用的函数进行了总结。整篇总结&…