《网页设计与前端开发 Dreamweaver+Flash+Photoshop+HTML+CSS+JavaScript 从入门到精通》——1.3 网页设计的原则
2023-09-11 14:17:36 时间
本节书摘来自异步社区《网页设计与前端开发 Dreamweaver+Flash+Photoshop+HTML+CSS+JavaScript 从入门到精通》一书中的第1章,第1.3节,作者: 何新起 , 任慎存 , 田月梅更多章节内容可以访问云栖社区“异步社区”公众号查看。
1.3 网页设计的原则设计是有原则的,网页设计遵循以下几个原则:统一、连贯、分割、对比及和谐。
统一是指网页的整体性和一致性。网页的整体效果是至关重要的,网页中各个版块设计风格要一致协调。图1-17所示的网页整体看起来就比较统一。![446ab3f0163c634a0a1c0944d6d6fb0b415f8c91](https://yqfile.alicdn.com/446ab3f0163c634a0a1c0944d6d6fb0b415f8c91.png)
连贯是指要注意页面的相互关系。设计中要注意各组成部分在内容上的内在联系和表现形式上的相互呼应,并注意整个页面设计风格的一致性,实现视觉上和心理上的连贯,使整个页面设计的各个部分融洽得犹如一气呵成。 分割是指将页面分成若干小块,小块之间有视觉上的不同,这样可以使浏览者一目了然。图1-18所示的网页分成了若干小块。
![e55b8b61a4b666f12f602221e1da497436b15de8](https://yqfile.alicdn.com/e55b8b61a4b666f12f602221e1da497436b15de8.png)
对比就是通过矛盾和冲突,使设计更加富有生气。对比的手法很多,如多与少、曲与直、强与弱、长与短、粗与细、主与次、黑与白、动与静及美与丑等。在使用对比的时候应慎重,对比过强容易破坏美感,影响统一。图1-19所示的网页设计中运用了对比效果。
![9d11daea00411bd27b437d713b68f5c7398672ce](https://yqfile.alicdn.com/9d11daea00411bd27b437d713b68f5c7398672ce.png)
和谐是指整个页面符合美的法则,浑然一体。网页不仅仅是色彩、形状、线条等的随意混合。
《Adobe Dreamweaver CS6中文版经典教程》——导读 Adobe Dreamweaver CS6是行业领先的Web内容制作程序。无论你是为了生活还是为了自己的事业而创建网站,Dreamweaver都提供了你所需的所有工具,帮助你达到专业水平。
异步社区 异步社区(www.epubit.com)是人民邮电出版社旗下IT专业图书旗舰社区,也是国内领先的IT专业图书社区,致力于优质学习内容的出版和分享,实现了纸书电子书的同步上架,于2015年8月上线运营。公众号【异步图书】,每日赠送异步新书。
相关文章
- 基于HTML,css,jQuery,JavaScript,MySQL搭建博客系统
- [Javascript] Filter out Duplicates from Flat JavaScript Array with array.filter / reduce / Set
- [Javascript] Construct a Regex to Match Twitter Mentions with Regexr
- [Javascript] Convert a Callback-Based JavaScript Function to a Promise-Based One
- [Javascript] Replicate JavaScript Constructor Inheritance with Simple Objects (OLOO)
- [Javascript] Iterate Over Items with JavaScript's for-of Loop
- [Javascript] JavaScript Array Methods in Depth - push
- [Whole Web] [AngularJS + Grunt] Using ng-html2js to Convert Templates into JavaScript
- [Javascript] Filter out Duplicates from Flat JavaScript Array with array.filter / reduce / Set
- [Javascript] Safely Access a Property on a JavaScript Array with Optional Chaining
- [Javascript] Natively Format JavaScript Dates and Times
- [Javascript] Wait for the Fastest JavaScript Promise to Be Fulfilled with Promise.any()
- [Javascript] Use requestIdleCallback to schedule JavaScript tasks at an optimal time
- [Javascript] Link to Other Objects through the JavaScript Prototype Chain
- [Javascript] JavaScript Array Methods in Depth - push
- [Javascript] How to use JavaScript's String.replace
- [Javascript] What is JavaScript Function Currying?
- [Javascript] Linting JavaScript with ESLint
- JavaScript如何执行上下文
- 一段诡异的JavaScript代码,其实考察的是一些JavaScript的基础知识
- 分享一个开源的JavaScript统计图表库,40行代码实现专业统计图表
- Javascript定义类(class)的三种方法
- Atitit.线程 死锁 跑飞 的检测与自动解除 与手动解除死锁 java c# .net php javascript.
- brython 文档之javascript模块
- javascript
- web前端框架Javascript开发基础之JavaScript作用域
- 基于JavaScript水果库存系统主页面操作