国际 如果仓促而为,设计一个专题或者网站一定会成为恶梦。Web设计需要遵循一些准则并有计划地去做。
Rule #1 : 先出设计图
这是必须的。不要假设设计图在你的头脑中就开始设计web,必须要放到纸上。可以这样做:
1, 拿尺子、笔和纸,按照具体的尺寸一行一行地画下来;
2, 记得考虑分界线的长度等,这样才能符合CSS的像素;
3, 记下设计的每一个细节免得忘记,如果把所有细节都累积到最后将是巨大的麻烦。
Rule #2 :配色
这是设计的核心部分,只有颜色搭配合适才能使你的网页看起来不错。首先要决定的是主色,也即你在网页中多数使用的颜色;然后选择跟主色调搭配的第二颜色;不要选择超过三种颜色不然你的设计看起来会很乱。如果你想要更多的颜色,可以使用浅色或者深色的阴影来搭配主色调。
1, 浏览十个跟你网页有同样主色调的网页;
2, 给几个人看你的配色方案并取得反馈;
3, 从浏览的网页和反馈你将更好地完善你的颜色搭配。
Rule #3 : 从基本的版块开始着手
定下配色和设计图之后,从最基本的框架开始构建——我的意思是说不添加任何文本。因为在版面中加入文本会使得架构混乱。方法如下:
1, 每一个版块设定边界线,这样能够看到具体的尺寸和位置;
2, 对不同的版块使用不同的颜色,在完成版块后再改成你想要的颜色。
Rule #4 : 理清CSS
不要在你的HTML文件中将styling元素搞得太复杂,不然等到你修改的时候你就不得不到处搜索。所以将所有styling元素归置在一个单独的CSS文档中。
在styling之前理清你的CSS免得太过杂乱导致你多次重复同一件事。CSS支持继承,也即 parent block的style可以用于child block.,充分利用这条特性。命名CSS分类名也要易懂易记。比如使用“main_content”而不是“div_1”。
Rule #5 : 制订多重 CSS 文档
我们都知道,使用浏览器可以轻易地看到网页的输出,但使用另一浏览器的时候则可能发现输出不正常。这不是什么稀奇事儿,因为每个浏览器对HTML和CSS的处理方式都不一样。
为避免这种情况,每个浏览器准备一个CSS文档,这样所有浏览器都可以正常浏览。虽然这有一定的难度,但是记着指望一个CSS文档来满足所有浏览器是不可能的。
分享到:
相关推荐
参赛作品主要分为四类:Web应用与开发、管理信息系统、移动应用开发和算法设计与应用。每类作品需满足特定的功能需求和应用场景,能够提供信息管理、信息服务、移动便捷操作或创新算法解决方案。 二、作品基本要求 ...
Web设计进程 <br>2.1 进程需求 <br>2.2 特别的Web进程 <br>2.3 基本的Web进程模型 <br>2.3.1 修正瀑布模型 <br>2.3.2 联合应用开发模型 <br>2.4 Web站点项目的途径 <br>2.5 目标和问题 ...
### WEB前端开发规范文档知识点详解 #### 一、概述 WEB前端开发规范文档旨在通过制定一系列标准化的操作流程和规范,提升开发效率与质量,确保项目的可持续性和可维护性。该文档详细介绍了WEB前端开发的基本准则、...
例如,Struts 是一个流行的开源Web框架,适用于基于Web的应用程序。在没有特殊需求的情况下,使用此类现有框架可以节省大量时间和精力。 #### 六、合理使用调试工具 在开发过程中,使用 `System.out.println` 进行...
【高质量软件开发人员的五大习惯】是提升软件开发团队效率和产品质量的重要指南。在现代商业环境中,软件开发团队面临着来自业务团队的多重挑战。业务团队需要软件开发团队以最低的成本快速开发新功能,并确保这些...
### QTP自动化测试框架设计参考准则详解 #### 一、引言 自动化测试框架的设计是软件测试中的一个重要组成部分,尤其在QTP(Quick Test Professional)这样的自动化测试工具中更是如此。一个良好的自动化测试框架...
Web设计进程 <br>2.1 进程需求 <br>2.2 特别的Web进程 <br>2.3 基本的Web进程模型 <br>2.3.1 修正瀑布模型 <br>2.3.2 联合应用开发模型 <br>2.4 Web站点项目的途径 <br>2.5 目标和问题 ...
### Web前端开发规范知识点 #### 一、规范目的概述 本文档的核心目的是为了提升团队协作效率,确保代码质量,以及建立一套统一的编码风格规范。规范文档一经确认,所有前端开发人员都应按照该规范执行前台页面开发...
首先,我们从Web开发的五个阶段开始: 1. **规划**:此阶段旨在确定项目的基本框架,包括设定时间表、确定项目目标、Web应用的目标、开发方法以及分配任务。规划还涉及风险评估,确保项目在启动前有明确的方向。 2...
Native App和Web App开发是移动应用开发的两个主要方向,它们分别代表了原生应用程序和基于Web技术的应用程序。原生应用程序(Native App)通常是指为特定平台(如iOS或Android)专门设计的应用程序,它们可以直接访问...
- **详细说明**:NC支持多种开发模型,其中面向服务的架构(SOA)是一种常用的设计模式,它强调将复杂系统分解为多个独立的服务单元。此外,随着技术发展,越来越多的应用场景开始采用微服务架构来提升系统的灵活性和...
本系列资料将带您从零基础开始,逐步掌握SSM的核心技术和最佳实践,助您在Java Web开发领域更上一层楼。 二、资料亮点 基础教程与练习项目:从基础知识讲起,结合实际练习项目,让您轻松上手SSM开发。 进阶技术与...
本系列资料将带您从零基础开始,逐步掌握SSM的核心技术和最佳实践,助您在Java Web开发领域更上一层楼。 二、资料亮点 基础教程与练习项目:从基础知识讲起,结合实际练习项目,让您轻松上手SSM开发。 进阶技术与...
本系列资料将带您从零基础开始,逐步掌握SSM的核心技术和最佳实践,助您在Java Web开发领域更上一层楼。 二、资料亮点 基础教程与练习项目:从基础知识讲起,结合实际练习项目,让您轻松上手SSM开发。 进阶技术与...
第五章“系统测试”描述了系统上线前的测试流程,包括测试目的、准则和方法,如单元测试和综合测试,确保每个功能模块都能正常运行。系统的维护主要包括数据备份、性能优化、安全防护和故障排查等方面。 总的来说,...
本系列资料将带您从零基础开始,逐步掌握SSM的核心技术和最佳实践,助您在Java Web开发领域更上一层楼。 二、资料亮点 基础教程与练习项目:从基础知识讲起,结合实际练习项目,让您轻松上手SSM开发。 进阶技术与...
一、**基本准则** 1. **保持简洁**:重构应尽量减少冗余代码,避免复杂逻辑,使代码易于理解和修改。 2. **遵循DRY(Don't Repeat Yourself)原则**:尽量避免重复的代码,通过抽象和模块化提高代码复用性。 3. **...
网站开发规范是一套指导网站开发过程中的实践标准和准则,旨在提高代码质量、简化维护工作并确保项目的可扩展性。该规范主要涵盖以下几个方面:.NET框架使用、C#编程、数据库设计与管理以及网站的前端开发。 ### 二...