网页设计制作需要
PC端UI设计尺寸规范?
对于刚入行的UI设计师，最容易犯的错就是在设计移动APP时，不懂什么尺寸或者用哪种屏幕的尺寸是最适当的？为了解决这个问题，今天我们就简单的为大家整理做UI时最基础的尺寸规范。现象首先说现象，大家都知道移动端设备屏幕尺寸非常多，碎片化严重。尤其是Android，你会听到很多种分辨率：480×800, 480×854, 540×960, 720×1280, 1080×1920，而且还有传说中的2K屏。近年来iPhone的碎片化也加剧了：640×960, 640×1136, 750×1334, 1242×2208。不要被这些尺寸吓倒。实际上大部分的app UI设计和移动端网页，在各种尺寸的屏幕上都能正常显示。说明尺寸的问题一定有解决方法，而且有规律可循。像素密度要知道，屏幕是由很多像素点组成的。之前提到那么多种分辨率，都是手机屏幕的实际像素尺寸。比如480×800的屏幕，就是由800行、480列的像素点组成的。每个点发出不同颜色的光，构成我们所看到的画面。而手机屏幕的物理尺寸，和像素尺寸是不成比例的。最典型的例子，iPhone 3gs的屏幕像素是320×480，iPhone 4s的屏幕像素是640×960。刚好两倍，然而两款手机都是3.5英寸的。所以，我们要引入最重要的一个概念：像素密度，也就是PPI（pixels per inch）。这项指标是连接数字世界与物理世界的桥梁。Pixels per inch，准确的说是每英寸的长度上排列的像素点数量。1英寸是一个固定长度，等于2.54厘米，大约是食指最末端那根指节的长度。像素密度越高，代表屏幕显示效果越精细。Retina屏比普通屏清晰很多，就是因为它的像素密度翻了一倍。倍率与逻辑像素再用iPhone 3gs和4s来举例。假设有个邮件列表界面，我们不妨按照PC端网页设计的思维来想象。3gs上大概只能显示4-5行，4s就能显示9-10行，而且每行会变得特别宽。但两款手机其实是一样大的。如果照这种方式显示，3gs上刚刚好的效果，在4s上就会小到根本看不清字。在现实中，这两者效果却是一样的。这是因为Retina屏幕把2×2个像素当1个像素使用。比如原本44像素高的顶部导航栏，在Retina屏上用了88个像素的高度来显示。导致界面元素都变成2倍大小，反而和3gs效果一样了。画质却更清晰。在以前，iOS应用的资源图片中，同一张图通常有两个尺寸。你会看到文件名有的带@2x字样，有的不带。其中不带@2x的用在普通屏上，带@2x的用在Retina屏上。只要图片准备好，iOS会自己判断用哪张，Android道理也一样。由此可以看出，苹果以普通屏为基准，给Retina屏定义了一个2倍的倍率（iPhone 6plus除外，它达到了3倍）。实际像素除以倍率，就得到逻辑像素尺寸。只要两个屏幕逻辑像素相同，它们的显示效果就是相同的。Android的解决方法类似，但更复杂一些。因为Android屏幕尺寸实在太多，分辨率高低跨度非常大，不像苹果只有那么几款固定设备、固定尺寸。所以Android把各种设备的像素密度划成了好几个范围区间，给不同范围的设备定义了不同的倍率，来保证显示效果相近。像素密度概念虽然重要，但用不着我们自己算，iOS与Android都帮我们算好了。如图所示，像素密度在120左右的屏幕归为ldpi，160左右的归为mdpi，以此类推。这样，所有的Android屏幕都找到了自己的位置，并赋予了相应的倍率：ldpi [0.75倍]mdpi [1倍]hdpi [1.5倍]xhdpi [2倍]xxhdpi [3倍]xxxhdpi [4倍]各型号iPhone的倍率比较简单，我们后面会讲到。那么Android手机那么多，具体怎么分？哪些手机是几倍的倍率呢？我们先看一张表，这是友盟2014年10月到2015年03月的数据：就目前市场状况而言，各种手机的分辨率可以这样粗略判断。虽然不全面，但至少在1年内都还有一定的参考意义：ldpi 如今已绝迹，不用考虑mdpi [320x480]（市场份额不足5%，新手机不会有这种倍率，屏幕通常都特别小）hdpi [480x800、480x854、540x960]（早年的低端机，屏幕在3.5英寸档位；如今的低端机，屏幕在4.7-5.0英寸档位）xhdpi [720x1280]（早年的中端机，屏幕在4.7-5.0英寸档位；如今的中低端机，屏幕在5.0-5.5英寸档位）xxhdpi [1080x1920]（早年的高端机，如今的中高端机，屏幕通常都在5.0英寸以上）xxxhdpi [1440x2560]（极少数2K屏手机，比如Google Nexus 6）自然地，以1倍的mdpi作为基准。像素密度更高或者更低的设备，只需乘以相应的倍率，就能得到与基准倍率近似的显示效果。不过需要注意的是，Android设备的逻辑像素尺寸并不统一。比如两种常见的屏幕480×800和1080×1920，它们分别属于hdpi和xxhdpi。除以各自倍率1.5倍和3倍，得到逻辑像素为320×533和360×640。很显然，后者更宽更高，能显示内容。所以，即使有倍率的存在，各种Android设备的显示效果仍然无法做到完全一致。单位不难发现，真正决定显示效果的，是逻辑像素尺寸。为此，iOS和Android平台都定义了各自的逻辑像素单位。iOS的尺寸单位为pt，Android的尺寸单位为dp。说实话，两者其实是一回事。单位之间的换算关系随倍率变化：1倍：1pt=1dp=1px（mdpi、iPhone 3gs）1.5倍：1pt=1dp=1.5px（hdpi）2倍：1pt=1dp=2px（xhdpi、iPhone 4s/5/6）3倍：1pt=1dp=3px（xxhdpi、iPhone 6）4倍：1pt=1dp=4px（xxxhdpi）单位决定了我们的思考方式。在设计和开发过程中，应该尽量使用逻辑像素尺寸来思考界面。设计Android应用时，有的设计师喜欢把画布设为1080×1920，有的喜欢设成720×1280。给出的界面元素尺寸就不统一了。Android的最小点击区域尺寸是48x48dp，这就意味着在xhdpi的设备上，按钮尺寸至少是96x96px。而在xxhdpi设备上，则是144x144px。无论画布设成多大，我们设计的是基准倍率的界面样式，而且开发人员需要的单位都是逻辑像素。所以为了保证准确高效的沟通，双方都需要以逻辑像素尺寸来描述和理解界面，无论是在标注图还是在日常沟通中。不要再说“底部标签栏的高度是96像素，我是按照xhdpi做的”这样的话了。Web怎么办移动端页面的绝对单位仍然是px，至少代码里这么写，但它的道理也和app一样。由于像素密度是设备本身的固有属性，它会影响到设备中的所有应用，包括浏览器。前端技术可以善加利用设备的像素密度，只需一行代码，浏览器便会使用app的显示方式来渲染页面。根据像素密度，按相应倍率缩放。以iPhone 5s为例，屏幕的分辨率是640×1136，倍率是2。浏览器会认为屏幕的分辨率是320×568，仍然是基准倍率的尺寸。所以在制作页面时，只需要按照基准倍率来就行了。无论什么样的屏幕，倍率是多少，都按逻辑像素尺寸来设计和开发页面。只不过在准备资源图的时候，需要准备2倍大小的图，通过代码把它缩成1倍大小显示，才能保证清晰。实际应用大家最关心的还是实际运用，画布该怎么设置。我们就iOS、Android、Web三个平台来分别梳理一下。不过在这之前，我要为使用PS进行设计的朋友介绍一个小技巧。之前我说过，我们要以逻辑像素尺寸来思考界面。体现到设计过程中，就是要把单位设置成逻辑像素。打开PS的首选项——单位与标尺界面，把尺寸和文字单位都改成点（Point）。这里的点也就是pt，无论设计iOS、Android还是Web应用，单位都用它。当然，各平台单位名称还是要记住的。这里我们用的只是它的原理，不用在意名称。要调节倍率，则通过图像大小里的DPI来控制。这个DPI，其实就是PPI，像素密度。有个常识大家都知道，屏幕上的设计DPI设成72，印刷品设计DPI设成300。为什么是这两个数字？首先说300，这和人眼的分辨能力有关。由于1英寸是固定长度，每1英寸有多少个像素点决定了画质清晰程度。之前说过，这就是像素密度，也就是DPI。DPI达到300以上，其细腻程度就会给人真实感，像真实世界中的物件。相反，DPI只有10的话，在你一个食指指节大小的长度内只有10个像素，这明显就是马赛克了。所以印刷品要设成300，才能保证清晰。再说72，这有一定的历史原因。最早的图形设计是在mac电脑上进行的，mac本身的显示器分辨率就是72。PS中把图像DPI也设成72，就能保证屏幕上显示的尺寸和打印尺寸相同，便于设计。72的PC显示器分辨率逐渐成为一种默认的行业标准，这套规则就这么沿用下来。现在回到正题，我们怎么通过DPI来调节倍率？既然屏幕本身的分辨率是72，DPI设成72刚好是1倍尺寸，那设成72的两倍就是倍率为2的屏幕了，就这么简单。下面来看看3个平台各自的画布设置：IPhoneiPhone的屏幕尺寸各不相同，我说的是逻辑像素尺寸，这确实是让人很头疼的事情。如果想用一套设计涵盖所有iPhone，就要选择逻辑像素折中的机型。从市场占有率数据来看，目前最多的是iPhone5/5s的屏幕。倍率为2，逻辑像素320×568。上升势头最猛，未来有望登上第一的是iPhone 6的屏幕。倍率为2，逻辑像素375×667。按照这两种尺寸来设计，都是比较主流的做法。可以兼顾短一些的iPhone 4s，大一点的6 plus也不会过于空旷。不过在切图的时候要注意，由于iPhone 6 plus的3倍图是由2倍图放大而来，所以位图要注意保证清晰。Android都说Android碎片化严重，但它现在反而比iOS好处理。因为如今的Android屏幕逻辑像素已经趋于统一了：360×640，就看你设成几倍了。想以xhdpi为准，就把DPI设成72×2=144。想以xxhdpi为准，就把DPI设成72×3=216。对于那些比较老的低端机，宽度是480px的那批，画面确实会小一些，显示内容会更少。稍微留意一下，重要内容尽量保持在界面中上部分。当然，这些机型不出一年就会被边缘化，基本淘汰。现在能运转的也是当作功能机在用，软件多了必卡无疑，用户体验无从谈起。不作考虑也是OK的。Web手机端网页就没有统一标准了，比较流行的做法是按照iPhone 5的尺寸来设计。倍率2，逻辑像素320×568。这样的做法比较实在，倍率2的屏幕无论在iOS还是Android方面都是主流，而且又是2倍屏幕中逻辑像素最小的。所以图片的尺寸可以保持在较小的水平，页面加载速度快。当然，缺点就是在倍率3的设备上看，图片不是特别清晰。如果追求图片质量，愿意牺牲加载速度，那么可以按照最大的屏幕来设计。也就是iPhone 6 plus的尺寸，倍率3，逻辑像素414×736。总结移动端的尺寸比PC端复杂，关键就在倍率。但也正因为倍率的存在，把大大小小的屏幕拉回到同一水平线，得以保证一套设计适应各种屏幕。站在这条水平线的角度看，会发现它很好理解。
怎样在网页设计中把所需的文字从左到右滚动
14 <marquee> width="300px" height="200px" behavior="scroll"direction="left" scrollamount="50" loop="10" 限制滚动文字的范围 限制滚动文字的范围 限制滚动文字的行为（alternate：来回、scroll：循环滚动、slide：只滚动一次） 滚动的方向（left、right、down、up） 设置文字滚动的速度 设置滚动的次数 看看 有用吗？
网页制作与网站设计报告书
网站项目管理规范 一.概念 网站项目管理就是根据特定的规范、在预算范围内、按时完成的网站开发任务。 二.需求分析 1.项目立项 我们接到客户的业务咨询，经过双方不断的接洽和了解，并通过基本的可行性讨论够，初步达成制作协议，这时就需要将项目立项。较好的做法是成立一个专门的项目小组，小组成员包括：项目经理，网页设计，程序员，测试员，编辑/文档等必须人员。项目实行项目经理制。 2.客户的需求说明书 第一步是需要客户提供一个完整的需求说明。很多客户对自己的需求并不是很清楚，需要您不断引导和帮助分析。曾经有一次，我问客户：“您做网站的目的是什么？”他回答：“没有目的，只是因为别人都有，我没有！”。这样的客户就需要耐心说明，仔细分析，挖掘出他潜在的，真正的需求。 配合客户写一份详细的，完整的需求说明会花很多时间，但这样做是值得的，而且一定要让客户满意，签字认可。把好这一关，可以杜绝很多因为需求不明或理解偏差造成的失误和项目失败。糟糕的需求说明不可能有高质量的网站。那么需求说明书要达到怎样的标准呢？简单说，包含下面几点： 1.正确性：每个功能必须清楚描写交付的功能； 2.可行性：确保在当前的开发能力和系统环境下可以实现每个需求； 3.必要性：功能是否必须交付，是否可以推迟实现，是否可以在削减开支情况发生时"砍"掉； 4.简明性：不要使用专业的网络术语； 5.检测性：如果开发完毕，客户可以根据需求检测。 三.系统分析 1.网站总体设计 在拿到客户的需求说明后，并不是直接开始制作，而是需要对项目进行总体设计，详细设计，出一份网站建设方案给客户。总体设计是非常关键的一步。它主要确定： 1.网站需要实现哪些功能； 2.网站开发使用什么软件，在什么样的硬件环境； 3.需要多少人，多少时间； 4.需要遵循的规则和标准有哪些。 同时需要写一份总体规划说明书，包括： 1.网站的栏目和版块； 2.网站的功能和相应的程序； 3.网站的链接结构； 4.如果有数据库，进行数据库的概念设计； 5.网站的交互性和用户友好设计。 2.网站建设方案 在总体设计出来后，一般需要给客户一个网站建设方案。很多网页制作公司在接洽业务时就被客户要求提供方案。那时的方案一般比较笼统，而且在客户需求不是十分明确的情况下提交方案，往往和实际制作后的结果会有很大差异。所以应该尽量取得客户的理解，在明确需求并总体设计后提交方案，这样对双方都有益处。网站建设方案的包括以下几个部分： 1.客户情况分析； 2.网站需要实现的目的和目标； 3.网站形象说明； 4.网站的栏目版块和结构； 5.网站内容的安排，相互链接关系； 6.使用软件，硬件和技术分析说明； 7.开发时间进度表； 8.宣传推广方案； 9.维护方案； 10.制作费用； 11.本公司简介：成功作品，技术，人才说明等。 当您的方案通过客户的认可，您可以开始动手制作网站了。但还不是真正意义上的制作，你需要进行详细设计： 3.网站详细设计 总体设计阶段以比较抽象概括的方式提出了解决问题的办法。详细设计阶段的任务就是把解法具体化。详细设计主要是针对程序开发部分来说的。但这个阶段的不是真正编写程序，而是设计出程序的详细规格说明。这种规格说明的作用很类似于其他工程领域中工程师经常使用的工程蓝图，它们应该 包含必要的细节，例如：程序界面，表单，需要的数据等。程序员可以根据它们写出实际的程序代码。 四. 项目实施 1.整体形象设计 在程序员进行详细设计的同时，网页设计师开始设计网站的整体形象和首页。 整体形象设计包括标准字，Logo，标准色彩，广告语等。 首页设计包括版面，色彩，图像，动态效果，图标等风格设计，也包括banner，菜单，标题，版权等模块设计。首页一般设计1-3个不同风格，完成后，供客户选择。 记住：在客户确定首页风格之后，请客户签字认可。以后不得再对版面风格有大的变动，否则视为第二次设计。 开发制作 2.开发制作 到这里，程序员和网页设计师同时进入全力开发阶段，需要提醒的是，测试人员需要随时测试网页与程序，发现Bug立刻记录并反馈修改。不要等到完全制作完毕再测试，这样会浪费大量的时间和精力。项目经理需要经常了解项目进度，协调和沟通程序员与网页设计师的工作。 调试完善 3.调试完成 在网站初步完成后，上传到服务器，对网站进行全范围的测试。包括速度，兼容性，交互性，链接正确性，程序健壮性，超流量测试等，发现问题及时解决并记录下来。 为什么要记录文档呢？其实本软件工程本身就是一个文档，是一个不断充实和完善的标准。通过不断的发现问题，解决问题，修改，补充文档，使这个标准越来越规范，越来越工业化。进而使得网站开发趋向规范，趋向合理。 4.宣传推广 宣传推广的基本方法有： 1.网页里设置适当的META标签； 2.各搜索引擎登录； 3.准备新闻稿件在各新闻公告板发表； 4.合理使用Email邮件列表； 5.广告条交换； 6.付费广告。 至此，网站项目建设完毕，将有关网址，使用操作说明文档等提交客户验收。如果需要维护，另行签定维护项目。 五.维护 网站成功推出后，长期的维护工作才刚刚开始，需要做到的是: 1.及时响应客户反馈；例如可以采取Email自动回复功能，然后在1-3个工作日里解决问题，再次回复； 2.网站流量统计分析和相应对策； 3.尽量推广和使用您的网址； 4.网站内容的及时更新和维护。 六.遵循的规范 1.网站建设目录规范 2.网站文件命名规范 3.网站建设尺寸规范 4.网站首页head区代码规范 5.网站连接结构规范 网站开发规范 任何一个项目或者系统开发之前都需要定制一个开发约定和规则，这样有利于项目的整体风格统一、代码维护和扩展。由于Web项目开发的分散性、独立性、整合的交互性等，所以定制一套完整的约定和规则显得尤为重要。定制一系列约定和规则，包括组件团队、文件夹命名规则、文件名命名规则、程序代码编程风格、数据库设计约定。这些规则和约定需要与开发人员、设计人员和维护人员共同讨论定制，将来开发都将严格按规则或约定开发。每个团队开发都应有自己的一套规范，一个优良可行的规范可以使我们工作得心应手事半功倍，这些规范都不是唯一的标准不存在对与错，也许有些地方与你当前使用的习惯相驳，很多地方都有争议。。 非常明显在Web项目开发中有前后台开发之分，前台开发主要是指非程序编程部分，主要职责是网站AI设计、界面设计、动画设计等。而后台开发主要是编程和网站运行平台搭建，其主要职责是设计网站数据库和网站功能模板的实现。下面的这些规范主要是从这2个方面来定制的，这些规范是工作中总结的一点经验，本文档比较适合中小型网站或者Web项目的开发规范。 一．组建开发团队 在接手项目后的第一件事是组建团队。根据项目的大小团队可以有几十人，也有可以是只有几个人的小团队，在团队划分中应该含有6个角色，这6个角色是必须的，分别是项目经理，策划，美工，程序员，代码整合员，测试员。也许你的团队还没有6个人，没有关系一个人可以有多个角色，比如项目经理还可以有策划这个角色，如程序员还可以含有代码整合和测试这2个角色，如果你的项目够大人数够多那就分为6个组，每个组分工再来细分。下面简单介绍一下这6个角色的具体职责。 项目经理，项目总体设计，开发进度的定制和监控，定制相应的开发规范，负责各个环节的评审工作，协调各个成员(小组)之间开发。策划，提供详细的策划方案和需求分析。还包括后期网站推广方面的策划。美工，根据策划和需求设计网站AI，界面，Logo等。程序员，根据项目总体设计来设计数据库和功能模块的实现。代码整合员，负责将程序员的代码和界面融合到一起，代码整合员可以制作网站的相关页面，测试员，负责测试程序。 二．开发工具 Web开发工具主要分为3部分，第一部分是网站前台开发工具，第二部分是网站后台开发环境，第三部分是项目管理和辅助软件。下面分别简单介绍这三部分需要使用的软件。 网站前台开发主要是指Web界面设计。包括网站整体框架建立、常用图片、Flash动画设计等等，主要使用的相关软件是：Adobe Illustrator 、Adodb Photoshop、Dreamweaver MX、Flash MX等。 网站后台开发主要指网站动态程序开发、数据库建模，主要使用的相关软件是： PowerDesigner（数据库建模），PowerDesigner在数据库设计方面应用非常强大，用它可以快速创建数据库概念和物理模型，我最喜欢的还是它生成数据库Report的功能太方便了，设计数据库强烈推荐用它。Rational Rose（程序建模），如果你的项目功能模块不是特别复杂那就剩了它吧，这样会节省一些时间和开发的复杂度，不过我个人认为不管是大项目还是小项目都应该画画Rose图。 网站项目管理主要指对开发进度和代码版本的控制。开发进度用Microsoft Project来制定，代码版本控制采用Visual SourceSafe，当然还有其他的选择比如CVS和Rational ClearCase。网站测试采用VS.net的附带工具Microsoft Application Center Test，它可以进行并行、负载测试等。程序文档编写采用Word，用WPS也可以。 三.网站开发流程 在项目开始实施之前应该有一个工作步骤也就是工作流程，在项目开发中最需要时间的是总体设计和系统测试，而程序编写代码所占的时间并不多，但有的团队就急于开发写代码，先把程序写出来再说，没有注重评审和测试这2个环节，结果造成返工，我在一家比较大的公司中都遇到多次这种情况。所以项目来了不要急于开工写代码，应该一步一步慢慢来，只有走的慢才能走得稳走得远。图1的开发流程比较好地体现开发的整个环节。 图 1 从图1可以看到2条主线，这2条主线分别是前台开发和后台开发。前后台开发在项目开发早期互相没有交叉，当然不是绝对没有，Web策划和需求分析都是互相有关系的，一个是网站表现形式和风格的策划另一个是网站功能的策划，它们是衣服和躯干的关系。到了开发后期就需要把界面和功能模块结合起来形成一个统一，也就即将发布的网站。 四．数据库开发规范 数据文件命名采用系统名+_+文件类型，比如系统名为kupage,则数据库文件命名为kupage_database.mdf，有的数据库文件有多个，比如SQL Server就有2个，一个是数据库文件，另一个是日志文件，那么他们的文件命名分别为kupage_database.mdf，kupage_log.log。文件名全部采用小写。 数据库表命名规范，表名长度不能超过30个字符，表名中含有单词全部采用单数形式，单词首写字母要大写，多个单词间不用任何连接符号。若库中有多个系统，表名采用系统名称+单词或多个单词，系统名是开发系统的缩写，系统名称全部采用小写英文字符,如bbsTitle,bbsForumType。若库中只含有一个系统，那么表名仅用一个单词或多个单词。单词选择能够概括表内容的一个或多个英文单词，如UserInfo,UserType。关连表命名规则为Re_表A_表B,Re是Relative的缩写，如：Re_User_ArticleType, Re_User_FormType。 数据库字段命名规范，数据库字段名全部采用小写英文单词，单词之间用”_”隔开，命名规则是表别名+单词，如：user_name,user_pwd。表别名规则，如果表名是一个单词，别名就取单词的前4 个字母；如果表名是两个单词，就各取两个单词的前两个字母组成4 个字母长的别名；如果表的名字由3 个单词组成，你不妨从头两个单词中各取一个然后从最后一个单词中再取出两个字母，结果还是组成4 字母长的别名。 视图名采用规则View_表A_表B_表C,View表示视图。这个视图由几个表产生就用”_”连接几个表的名，如果表过多可以将表名适当简化，但一定要列出所有表名。 存储过程命名规则P_表名_存取过程名(缩写)，比如P_User_Del，P_ArticleType_AddData。 SQL语句编写规则，关键字必须大写，其他书写按上述命名规则，比如： SELECT user_id, user_name FROM User WHERE user_id = ‘tom’ 五．文件夹文件名命名规范 文件夹命名一般采用英文，长度一般不超过20个字符，命名采用小写字母。除特殊情况才使用中文拼音，一些常见的文件夹命名如：images(存放图形文件)，flash（存放Flash文件），style(存放CSS文件)，scripts（存放Javascript脚本），inc(存放include文件)，link（存放友情链接）,media(存放多媒体文件)等。 文件名称统一用小写的英文字母、数字和下划线的组合。命名原则的指导思想一是使得你自己和工作组的每一个成员能够方便的理解每一个文件的意义，二是当我们在文件夹中使用“按名称排例”的命令时，同一种大类的文件能够排列在一起，以便我们查找、修改、替换、计算负载量等等操作 。 1、图片的命名原则名称分为头尾两部分，用下划线隔开，头部分表示此图片的大类性质例如广告、标志、菜单、按钮等等。 放置在页面顶部的广告、装饰图案等长方形的图片取名： banner 标志性的图片取名为： logo 在页面上位置不固定并且带有链接的小图片我们取名为 button 在页面上某一个位置连续出现，性质相同的链接栏目的图片我们取名： menu 装饰用的照片我们取名： pic 不带链接表示标题的图片我们取名： title 下面是几个范例： banner_sohu.gif 、banner_sina.gif、 menu_aboutus.gif 、menu_job.gif、 title_news.gif、 logo_police.gif、 logo_national.gif 、pic_people.jpg 。 2、动态语言文件命名规则性质_描述，描述可以有多个单词，用”_”隔开，性质一般是该页面得概要。 范例：register_form.asp，register_post.asp,topic_lock.asp 六．程序代码编程规范 一个良好的程序编码风格有利于系统的维护，代码也易于阅读查错。在此只讨论ASP的编程风格和约定。在ASP中所有变量是弱变量，无需定义就可以直接使用，而且代码不区分大小写。但其他语言一般这些都要定义的，为了养成良好的编程习惯，编写代码务必按照一下规则。 1、每个变量名必须定义，在ASP文件的最开始添加语句，强制定制每个变量。 2、出于易读和一致性的目的，在代码中使用以下变量命名约定： 子类型 前缀 示例 Boolean bln blnFound Byte byt bytRasterData Date (Time) dtm dtmStart Double dbl dblTolerance Error err errOrderNum Integer int intQuantity Long lng lngDistance Object obj objCurrent Single sng sngAverage String str strFirstName 3、程序代码需要有缩进，缩进采用键盘Tab键，不采用空格键。并且”＝”或者链接字符串时需要左右空一格，如下： 4、函数过程编写的约定。函数或者过程命名采用动作+名词，每个函数需要给出相应的注释，函数功能，传入变量，以及作者和修改相关信息。如下面函数: <% '[功能] 返回一个参数的值 '[参数] strParameterName 参数名称 '[作者] icefire 2002/8/20 am Function GetParameterValue(strParameterName) Dim objRS, strSQL, strParameterValue strSQL = "SELECT ParameterValue FROM damsParameters WHERE ParameterName = '" & strParameterName & "'" . . . GetParameterValue = strParameterValue Set objRS = Nothing End Function 5、ASP内置对象区分大小写。如下代码片断 strUserName = Request.Form(“UserName”) Set conn = Server.CreateObject("ADODB.Connection") 6、数据库连接一个库只能有一个数据库连接文件，创建数据库对象得原则是尽可能晚地打开数据库，尽可能早地关闭数据库。创建数据库对象调用统一地创建函数。如下： Sub OpenConn(ByRef conn) Dim strDBPath, strDBConnection strDBPath = Server.MapPath("database/tax.mdb") strDBConnnection = "Driver={Microsoft Access Driver (*.mdb)}; DBQ=" & strDBPath Set conn = Server.CreateObject("ADODB.Connection") conn.Open strDBConnnection End Sub 7、当一个对象不在使用时要释放对象资源，比如objFSO,objRS对象等。采用统一函数调用。函数如下： Sub CloseObj(ByRef obj) If IsObject(obj) Then obj.Close Set obj = nothing End If End Sub 8、时间全部以字符串的形式保存到数据库中，这样做能够是日期在不同的数据库中都能良好地保存，也方便数据库地迁移。时间用14位字符串保存，日期用8位字符串保存。 七．网站首页head区代码规范 head区是指首页HTML代码的<head>和</head>之间的内容。 必须加入的标签 1.公司版权注释 <!--- The site is designed by Maketown,Inc 06/2004 ---> 2.网页显示字符集 简体中文：<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb2312"> 繁体中文：<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=BIG5"> 英 语：<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1"> 3.网页制作者信息 <META name="author" content="webmaster@maketown.com"> 4.网站简介 <META NAME="DESCRIPTION" CONTENT="本站是一个医疗站点…"> 5.搜索关键字 <META NAME="keywords" CONTENT="xxxx,xxxx,xxx,xxxxx,xxxx,"> 6.网页的css规范 <LINK href="style/style.css" rel="stylesheet" type="text/css"> (参见目录及命名规范) 7.网页标题 <title>xxxxxxxxxxxxxxxxxx</title> 8.可以选择加入的标签 1.设定网页的到期时间。一旦网页过期，必须到服务器上重新调阅。 <META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT"> 2.禁止浏览器从本地机的缓存中调阅页面内容。 <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> 3.用来防止别人在框架里调用你的页面。 <META HTTP-EQUIV="Window-target" CONTENT="_top"> 4.自动跳转。 <META HTTP-EQUIV="Refresh" CONTENT="5;URL=http://www.yahoo.com"> 5指时间停留5秒。 5.网页搜索机器人向导.用来告诉搜索机器人哪些页面需要索引，哪些页面不需要索引。 <META NAME="robots" CONTENT="none"> CONTENT的参数有all,none,index,noindex,follow,nofollow。默认是all。 6.收藏夹图标 <link rel = "Shortcut Icon" href="favicon.ico"> 所有的javascript的调用尽量采取外部调用. <SCRIPT LANGUAGE="javascript" SRC="script/xxxxx.js"></SCRIPT> 附<body>标签： <body>标签不属于head区，这里强调一下，为了保证浏览器的兼容性，必须设置页面背景<body bgcolor="#FFFFFF"> 八．网站建设尺寸规范 1. 页面标准按800*600分辨率制作，实际尺寸为778*434px 2. 页面长度原则上不超过3屏，宽度不超过1屏 3. 每个标准页面为A4幅面大小，即8.5X11英寸 4. 全尺寸banner为468*60px，半尺寸banner为234*60px，小banner为88*31px 5. 另外120*90，120*60也是小图标的标准尺寸 6. 每个非首页静态页面含图片字节不超过60K，全尺寸banner不超过14K
制作一个公司网站需要什么流程？
一个完整的网站建设流程基本上包括域名注册查询、网站策划、网页设计、网站功能、网站优化技术、网站内容整理、网站推广、网站评估、网站运营、网站整体优化、网站改版等。细化的来说就从以下六方面来看：第一、客户提出网站建设的需求，根据客户提出的具体的网站建设要求，网站制作公司进行全方位的评估以及了解第二、制定网站建设方案，针对客户提出的网站建设需求，设计出整体的网站建设方案，并与客户进行再次商谈，就网站建设的风格，主题以及相关的细节进行详细的沟通，与客户达到共识之后进行网站建设。第三、设计方案达成共识，预付款项，安庆宜采软件认为在双方就网站建设的具体细节达到共识之后，客户便需要支付一部分的网站建设费用，作为预付款，通常需要支付百分之五十左右。第四、网站建设初稿，敲定细节，在与客户达成共识，并且收付预付款之后，网站建设公司便开始着手进行网站建设的工作，在双方约定的时间内给出客户网站建设的初稿，就双方约定的网站风格、网站建设主题、网站设计内容等进行初步的审核。第五、网站建设完成，进行验收，网站建设完成之后，需要网站制作公司进行反复的审核以及试验之后才能交付给客户完工，在交付客户之前，所有的网站制作商都要对网站进行反复的测试，特别是对于网站的核心功能模块，要进行不断的测试，反复的测试才可以交付客户。第六：网站后期维护工作，网站交付给客户之后，并不意味着所有工作结束，还要对客户进行指导，以及网站的维护保养工作。
手机网站网页设计应该注意什么问题
我们对手机网站制作中需要注意哪些方面的问题展开分析，为各位手机网站制作的用户们提供一些参考，现总结几点如下： 1、明确自己想在手机网站上展示哪些信息： 在手机网站制作之前应该明确自己想在手机网站上展示什么，分析一下可能的浏览者会有哪些，然后有针对性地策划和设计网站上的相关内容，这样才能做到有的放矢，不至于手机网站制作好了却没人浏览，或者浏览了不感兴趣。如果能做到有针对性的进行手机网站制作，通常手机网站在推广之后都会为企业带来一定量的潜在用户。 2、在手机网站制作时要尽量符合滑动屏幕的方式： 一般的手机屏幕，画面都不如桌上电脑那么大，尤其是阅读文字时更需要加以放大。即使智能手机具有网页放大缩小功能，但是观看起来也较为麻烦，因为网页放大后，很可能还要左右滑动才能浏览网页，浏览后还要缩小回原大小。因此在设计手机网页时，应能够以滑动屏幕的方式来阅读网页，因为滑动网页操作比着放大网页观看来要简单得多。 3、不能参照PC端网站来设计手机网站上的导航功能： 手机网页与跟一般的PC端网页不同，由于受到手机屏幕大小和屏幕操作的限制，在设计导航功能时应该按照手机屏幕来设计，不能完全照搬PC端网站，该简单的地方简单化，该去掉的去掉，同时在当阅读文章到最后时，要方便于用户回到最前头，减少卷动画面的机会，让网页变得更容易于移动设备上阅读。 4、手机网站制作也要考虑多种浏览器的兼容： 现在的移动浏览器能够处理大多数网站，一般的浏览器都能够正常浏览网页。但由于手机上的浏览器也有多种，比如UC浏览器、360浏览器、搜狗浏览器、其他浏览器，如此多的浏览器在浏览网页的时候，如果手机网站的兼容性差，就很可能会出现在某些浏览器上出现网页变形、内容显示不全的情况。因此，手机网站制作必须考虑到兼容于多种浏览器。 5、在手机网站制作时一定要减少用户文字输入操作： 现在智能手机一般都没有实体的键盘，或仅只有12键的电话输入功能，因此在输入文字上会比起使用电脑键盘麻烦得多。因此，减少使用者输入文字的机会，例如用户名、密码等，都是手机网站制作时要尽力避免的。 6、在手机网站制作时就应该考虑到日后的推广和宣传： 在手机网站制作时，不要忽略了用户体验，否则在日后的网站推广时将会遇到麻烦。任何一个手机网站，都必须经过广策划、设计和推广的过程，在手机网站制作时需要考虑日后的推广，手机网站应该在丰富站内内容的同时，提供详尽的产品信息以及联系方式，并收集有关产品的用户满意度和顾客需求方面的反馈信息。这样的手机网站上线后，其推广工作也会非常有效果。 7、手机网站制作要兼顾非触摸屏幕的设计： 虽然大多数手机都是智能手机，但也有为数不少的传统手机，不具备触摸的功能，使用的是传统的控制方向键做为滑动的工具，这时候，手机网页的制作应兼顾到非触摸屏的手机浏览。比如减少画面中超链接的数量、加大文字以减少误点。 8、在手机网站制作时要记得要简化网页内容： 一般的手机、平板电脑等移动设备，由于屏幕大小的限制，不易容纳下个人电脑的大容量的网页资讯，因此手机网站制作的首要一点就是减少网页内容，最好不用图片或是影音视频等，文字也应该精简，但要保持网页内容的可读性。只需要将最重要的资讯放入移动版网页，不太重要的内容内容，可以略去，或者通过超链接链接到新网页上。 9、手机网站制作要注重网页产品和服务的展示： 企业在手机网站上，需要表现的重点仍然是产品和服务的展示。移动用户访问企业手机网站往往是有备而来，想了解某个产品或者服务的详细价格、服务内容和功能。所以企业在手机网站上的产品和服务展示，可选择企业的主要产品，对其各类参数或价格加以详细说明，对于企业的新产品，也可以适当的加以介绍，必要时可以采用图文并茂的方式，但图片的体积应尽量小。 以上是在手机网站制作中需要注意的几个方面，手机网站页面设计需要符合用户体验，以方便用户操作为准则，能够为用户带来切实的帮助，这是手机网站制作上的基本要求，也是满足用户需求的基本原则。
网页设计自学要多久
网页设计自学,其实有计算机知识基础，不看编程语言只需要几天就绝对OK了。网页设计的步骤大概是这样的：PS/Fireworks> + >>>dreamweaver >flash > >>>>网站》浏览器》客户端 数据库》JSP/ASP/PHP>其实编程不难，个人建议先学个基础部分然后实例练习需要什么知识学什么知识，这样算就是基础部分以一天6小时算最多4——5天就OK。盛下的时间就看你自己的努力了主要的就是多做，学的再多都没用，不做什么都不会。有不懂的可以来找我，有时间一起探讨。发消息给我知道就行给你几个示例的好网站：http://www.cnwebshow.com/?P_AVPASS=PHDGBITAVPASST还有教程：http://tech.163.com/special/000915SN/Dreamweaver01.html
要做网页设计师，编程是不是一定要学呢？
网页设计师主要是指精通Photoshop，Coreldraw,Frontpage,Dreamweaver等多项网页设计工具的网页设计人员。其实一般大一点的公司，都把网页设计师分为美工和前端两个职位，美工（UI设计师）负责网页设计，使用photoshop，Coreldraw，只负责网页的设计与搭色生产原图；前端工程师使用Dreamweaver,Frontpage负责把图片变成html+css+js的静态页面和页面效果 ；其实在工作中要看偏重前端还是ui设计，其中前端需要js（javascript）编程（往往需要学习jquery），这就对js编程要求很好才行。
网页设计采用了哪些主要技术
HTML，CSS，Javascript，平面设计。这些都是网页设计需要的技术。如果要加上动态程序功能，还至少需要有一种服务端脚本技术，比如php,jsp,.net
网页设计要用到哪些软件?
网页设计人员需要对计算机硬件有一些了解,至少要懂得机器的硬件一般由哪些构成。要对网页设计常用软件很精通,一般常用的网页设计软件包括Photoshop,fflash,dreamweaver,当然了,还要精通HTML标记代码,他可是所有设计的根本。还有一些网页特效的使用,所以,您还需要学习有关CSS,JSP的有关知识. 有了以上这些,可以做出一个相当不错的网页了,但是要是做一个网站,或是可以进行交互式的网页,还需要了解有关ASP,还有ACCESS或者是SQL数据库方面的知识才可以 . 如果要发布到互联网上,还需要了解一些关于FTP方面的知识,以便于可以迅速的上传你的网页. 在本机调试网站时,我们一般会使用一些工具在本机进行调式,还需要学习有关WEB服务器架设方面的常识,常用的有MICROSOFT WINDOWS自带的IIS或是阿帕奇等. 为了推广网站,在各大搜索引擎进行登记也是必需的,所以,还需要有一些关于互联网使用方面的常识. 网页设计常用软件有以下三个： 1、Dreamweaver 这个是网页编辑代码的专业软件。也是做网页设计的必须懂得操作的软件。 2、Photoshop 这个是做图片处理，美化网页的，工作中也非常的常用。 3、flash 很多时候图片没有一个flash好看，就用这个制作flash动画，可以加到你的网页中。 一个网页设计人员必须要掌握文中介绍的这三个软件，如果不会的可以先去到智通培训学习学习一下网页设计方面的课程。学会以后就可以找一份高薪的网页设计工作。
