网站制作流程方案模板.doc

网站制作流程方案网站制作是一项很复杂的工程, 网站制作从大的一方面讲能够称之为是生物学的延续, 是工程学的集中表现。但网站制作, 更是一个深入浅出的过程。网站制作一切以人为本, 用户体验始终放在第一位, 不但仅注重外表的美观, 华而不实的外壳。网页设计, 网站架构, 代码编写也不但仅是一个复制粘贴的过程。网站制作要突出个性, 注重浏览者的综合感受, 令其在众多的网站中脱颖而出。网站制作的目的是经过网站达到开展网上营销, 实现电子商务的目的。西安做网站-大国网络目录什么是网站制作 什么是网站制作师 第一步: 确定网站主题 第二步: 做好网站规划 第三步: 选择好域名 第四步: 掌握建网工具 第五步: 确定网站界面 1. 1.栏目与板块编排 2. 2.目录结构与链接结构 3. 3.进行形象设计第六步: 确定网站风格 第七步: 有创意的内容选择 第八步: 选购网站空间 网站制作入门 LOGO知识介绍 什么叫javascript? 网页设计是不是越华丽越好? 1. 网站制作必须要注意的事项: 网页设计中HTML常范的五个错误 1. 1. 增加对比 2. 2. 渐变 3. 3. 色彩 4. 4. 字符间距 5. 5. 大小写 6. 6. 消锯齿网站制作后搜索引擎收录时间 网站制作步骤 选购网站空间 网站制作的基础 1. 1.页面尺寸: 2. 2.整体造型: 3. 3.页头: 4. 4.文本: 5. 5.页脚: 6. 6.图片 7. 7.多媒体网站制作专业要求 网站制作用到的语言 网站制作用到的友情链接 网站制作前期准备工作 1. 1.网站框架频道 2. 2.网站风格要求 3. 3.网站的针对对象 4. 4.网站的预算网站制作的相关法律法规 网站制作分类 网站制作发展趋势 网站制作栏目 网站制作步骤 网站制作具体流程 网站制作六大关键步骤什么是网站制作什么是网站制作师第一步: 确定网站主题第二步: 做好网站规划第三步: 选择好域名第四步: 掌握建网工具第五步: 确定网站界面 1. 1.栏目与板块编排 2. 2.目录结构与链接结构 3. 3.进行形象设计第六步: 确定网站风格 第七步: 有创意的内容选择 第八步: 选购网站空间 网站制作入门 LOGO知识介绍 什么叫javascript? 网页设计是不是越华丽越好? 1. 网站制作必须要注意的事项: 网页设计中HTML常范的五个错误 1. 1. 增加对比 2. 2. 渐变 3. 3. 色彩 4. 4. 字符间距 5. 5. 大小写 6. 6. 消锯齿 网站制作后搜索引擎收录时间 网站制作步骤 选购网站空间 网站制作的基础 1. 1.页面尺寸: 2. 2.整体造型: 3. 3.页头: 4. 4.文本: 5. 5.页脚: 6. 6.图片 7. 7.多媒体 网站制作专业要求 网站制作用到的语言 网站制作用到的友情链接 网站制作前期准备工作 1. 1.网站框架频道 2. 2.网站风格要求 3. 3.网站的针对对象 4. 4.网站的预算 网站制作的相关法律法规 网站制作分类 网站制作发展趋势 网站制作栏目 网站制作步骤 网站制作具体流程 网站制作六大关键步骤展开什么是做网站什么是网站制作呢? 通俗的来说就是网站经过页面结构定位, 合理布局, 图片文字处理, 程序设计, 数据库设计等一系列工作的总和。也是将网站设计师的图片用HTML方式展示出来, 属于前台工程师的一项任务, 前台工程师任务包括 网站设计、 网站用户体验、 网站JAVA效果、 网站制作等工作。西安做网站 什么是网站制作师是将网站设计师的图片用HTML方式展示出来的工程师, 偏代码方向。 是当前网站制作方面的一种职位, 实现网站图片设计, 代码编写等工作。 第一步: 确定网站主题做网站, 首先必须要解决的就是网站内容问题, 即确定网站的主题。美国个人电脑杂志(PC Magazine)评出了99年度排名前100位的全美知名网站的十类题材: 第1类: 网上求职; 第2类: 网上聊天/即时信息/ICQ; 第3类篬url网上社区/讨论/邮件列表; 第4类: 计算机技术, 如第5类: 网页/网站开发; 第6类: 娱乐网站; 第7类: 旅行; 第8类: 参考/资讯; 第9类: 家庭/教育; 第10类: 生活/时尚。我们能够参看上面 网站制作的分类, 继续细分。如果自己在某些方面有兴趣, 或掌握的资料较多, 也能够做一个自己感兴趣的东西, 一者, 你能够有自己的看法, 做出自己的特色; 二者, 在制作网站时不会觉得无聊或者力不从心。兴趣是制作网站的动力, 没有创作热情, 很难设计制作出优秀的作品。 对于内容主题的选择, 要做到小而精, 主题定位要小, 内容要精。不要去试图制作一个包罗万象的站点, 这往往会失去网站的特色, 也会带来高强度的劳动, 给网站的及时更新带来困难。记住: 在互联网上只有第一, 没有第二! 有些网站设计都在网站上加入许多不相关的内容, 想以此吸引浏览者, 但往往会适得其反。 编辑本段第二步: 做好网站规划规划的内容应该主要包括但不局限于如下几项: 1、 域名和主机的选择( 域名需要依靠网站主题以及用户范围来选择, 主机则根据网站在大小、 安全、 稳定上的需求) 2、 网站的定位( 如定位于赢利 性 网站, 还是企业网站, 或是公益性的) 3、 网站的用途( 是用来赢利的, 还是做产品线上营销的, 或是做品牌推广和整合的) 4、 网站的发展目标 ( 需要达到的目标, 需要为这个目标而努力的) 5、 网站的拓扑图构画( 网站包括哪些栏目, 采用什么样的制作结构) 6、 网站制作技术的采用( 用哪种语言开发, 在什么平台上开发) 7、 网站的推广( 需要做具体什么样的工作去推广网站, 是否需要在前期开发的时候就考虑到后期的推广, 如SEO专家的建议) 8、 网站的维护( 是自主维护, 还是外包维护, 维护的内容包括哪些, 后期改版的时间间隔安排等) 9、 网站安全 (网站定期进行安全检测及备份等安全操作) 10、 网站的主题颜色( 网站颜色能够直接反应出企业的行业所属) 第三步: 选择好域名域名 是网站在互联网上的名字, 是在互联网上相互联络的网络地址。一个非产品推销的纯信息服务网站, 其所有建设的价值, 都凝结在其网站域名之上。失去这个域名, 就将前功尽废。 当前, 做个人网站的很多都依赖免费个人空间, 其域名也是依赖免费域名指向, 如网易的虚拟域名服务, 其实这对个人网站的推广与发展很为不利, 不光是它”适时”开启的窗口妨碍了浏览者的视线和好感, 让人一看就知道是个人网站, 而且也妨碍了网页的传输速度。因此, 就我个人观点来讲, 首先花点钱去注册一个域名, 独立的域名就是个人网站的第一笔财富, 要把域名起得形象、 简单、 易记。 第四步: 掌握建网工具网络技术的发展带动了软件业的发展, 因此用于制作Web页面的工具软件也越来越丰富。从最基本的HTML编辑器到现在非常流行的Flash互动网页制作工具, 各种各样的Web页面制作工具, 下面是几款具有代表性的网页制作器: 1.HTML编辑器。虽然HTML代码复杂, 编辑和调试要花费大量的时间, 但因HTML的稳定性、 广泛支持性及可创立复杂的页面效果, 仍受高级网页制作人员的青睐。就当前来说, 有众多的编辑器供选择, 这些编辑器广泛支持复杂页面创立及高级HTML规范, 使用较为普遍的有Hotdog等专业HTML编辑器。 2.所见即所得的网页编辑器。其中以Microsoft Frontpage为代表, 它具有如Word一样的操作界面, 熟知Word功能的操作者, 只要稍加培训就能轻松编制网页。而且, Frontpage还能解析网页的HTML源代码, 并提供了预览支持。但Frontpage的一些特殊显示功能并不能在其它非IE浏览器下实现。因此Frontpage是一款非常适合初、 中级网页制作人员使用的工具软件。 3.现在非常流行的 Macromedia公司(已被Adobe公司收购)出品的Flash互动网页制作工具。这是是一款功能非常强大的交互式矢量多媒体网页制作工具。能够轻松输出各种各样的动画网页, 它不需要特别繁杂的操作, 也比JAVA小巧精悍! 但它的动画效果、 互动效果、 多媒体效果十分出众。而且还能够在Flash动画中封装Mp3音乐、 填写表单等; 而且由于Flash编制的网页文件比普通网页文件要小得多, 因此大大加快了浏览速度。这是一款十分适合动态Web制作的工具。 4.Dreamweaver: Dreamweaver是美国MACROMEDIA公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器, 它是第一套针对专业网页设计师特别发展的视觉化网页开发工具, 利用它能够轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。 另外, 个人网站制作者还需了解W3C的HTML4.0规范、 CSS层叠样式表的基本知识、 javascript、 VBScript的基本知识。对于常见的一些脚本程序如ASP、 CGI、 PHP也要有适当了解, 还要熟练使用图形处理工具和动画制作工具以及矢量绘图工具, 并能部分了解多种图形图像动画工具的基本用法, 熟练使用FTP工具以及拥有相应的软硬件和网络知识也是必备的。 当然, 互联网还是一个免费的资料库。编制网页需要多种多样的按钮、 背景还有各种各样图形、 图片。如果这些都要靠自己完成, 既浪费时间又浪费金钱, 而且还需要强大的图形、 图片制作技术。因此, 为了省却这些麻烦, 网站制作者完全能够从网上下载各种精美实用的图片、 按钮、 背景等网页素材。 第五步: 确定网站界面界面就是网站给浏览者的第一印象, 往往决定着网站的可看性, 在确定网站的界面时要注意以下三点: 1.栏目与板块编排构建一个网站就好比写一篇论文, 首先要列出提纲, 才能主题明确、 层次清晰。网站建设初学者, 最容易犯的错误就是: 确定题材后马上开始制作, 没有进行合理规划。从而导致网站结构不清晰, 目录庞杂混乱, 板块编排混乱等。结果不但浏览者看得糊里糊涂, 制作者自己在扩充和维护网站也相当困难。因此, 我们在动手制作网页前, 一定要考虑好栏目和板块的编排问题。 网站的题材确定后, 就要将收集到的资料内容作一个合理的编排。比如, 将一些最吸引人的内容放在最突出的位置或者在版面分布上占优势地位。栏目的实质为一个网站的大纲索引, 索引应该将网站的主体明确显示出来。在制定栏目的时候, 要仔细考虑, 合理安排。在栏目编排时需要注意的是: 尽可能删除那些与主题无关的栏目; 尽可能将网站内最有价值的内容列在栏目上; 尽可能从访问者角度来编排栏目以方便访问者的浏览和查询; 辅助内容, 如站点简介、 版权信息、 个人信息等大可不必放在主栏目里, 以免冲淡主题。 另外, 板块的编排设置也要合理安排与划分。板块比栏目的概念要大一些, 每个板块都有自己的栏目。举个例子: ENET硅谷动力的站点分新闻、 产品、 游戏、 学院等板块, 每个板块下面又各有自己的主栏目。一般来说, 个人站点内容较少, 只要分个栏目也就够了, 不需要设置板块。如果有必要设置板块的, 应该注意: 各板块要有相对独立性; 各板块要有相互关联; 各板块的内容要围绕站点主题; 2.目录结构与链接结构网站的目录是指建立网站时创立的目录。例如: 在用Frontpage建立网站时都默认建立了根目录和Images子目录。目录的结构是一个容易忽略的问题, 大多数站长都是未经规划, 随意创立子目录。目录结构的好坏, 对浏览者来说并没有什么太大的感觉, 可是对于站点本身的维护, 以后内容的扩充和移植有着重要的影响。因此建立目录结构时也要仔细安排, 比如: 不要将所有文件都存放在根目录下。有网站制作者为了方便, 将所有文件都放在根目录下。这样就很容易造成: 文件管理混乱, 搞不清哪些文件需要编辑和更新, 哪些无用的文件能够删除, 哪些是相关联的文件, 影响工作效率; 上传速度变慢, 服务器一般都会为根目录建立一个文件索引, 如果将所有文件都放在根目录下, 那么即使只上传更新一个文件, 服务器也需要将所有文件再检索一遍, 建立新的索引文件, 很明显, 文件量越大, 等待的时间也将越长。 按栏目内容建立子目录。子目录的建立, 首先按主栏目建立。友情连接内容较多, 需要经常更新的能够建立独立的子目录。而一些相关性强, 不需要经常更新的栏目, 例如: 网站简介、 站长情况等能够合并放在一个统一目录下。所有程序一般都存放在特定目录, 例如: CGI程序放在cgi-bin目录, 所有提供下载的内容也最好放在一个目录下, 便于维护管理。 在每个主目录下都建立独立的Images目录。一般来说, 一个站点根目录下都有一个默认地Images目录。将所有图片都存放在这个目录里很是不方便, 比如在栏目删除时, 图片的管理相当麻烦。因此为每个主栏目建立一个独立的Images目录是方便管理的。原因很简单, 就是方便维护与管理。 其它需要注意的还有: 目录的层次不要太深, 不要超过3层; 不要使用中文目录, 使用中文目录可能对网址的正确显示造成困难; 不要使用过长的目录, 太长的目录名不便于记忆; 尽量使用意义明确的目录, 以便于记忆和管理。 网站的链接结构是指页面之间相互链接的拓扑结构。它建立在目录结构基础之上, 但能够跨越目录。形象的说: 每个页面都是一个固定点, 链接则是在两个固定点之间的连线。一个点能够和一个点连接, 也能够和多个点连接。更重要的是, 这些点并不是分布在一个平面上, 而是存在于一个立体的空间中。一般的, 建立网站的链接结构有两种基本方式: 树状链接结构( 一对一) , 这类似DOS的目录结构, 首页链接指向一级页面, 一级页面链接指向二级页面。这样的链接结构浏览时, 一级级进入, 一级级退出, 条理比较清晰, 访问者明确知道自己在什么位置, 不会”不知身在何处”, 可是浏览效率低, 一个栏目下的子页面到另一个栏目下的子页面, 必须回到首页再进行。 星状链接结构( 一对多) , 类似网络服务器的链接, 每个页面相互之间都建立有链接。这样浏览比较方便, 随时能够到达自己喜欢的页面。可是由于链接太多, 容易使浏览者迷路, 搞不清自己在什么位置, 看了多少内容。 因此, 在实际的网站设计中, 总是将这两种结构混合起来使用。网站希望浏览者既能够方便快速地达到自己需要的页面, 又能够清晰地知道自己的位置。因此, 最好的办法是: 首页和一级页面之间用星状链接结构, 一级和二级页面之间用树状链接结构。关于链接结构的设计, 在实际的网页制作中是非常重要一环, 采用什么样的链接结构直接影响到版面的布局。 3.进行形象设计网站的设计能够从以下几点出发: 设计网站标志(LOGO)。LOGO是指网站的标志, 标志能够是中文、 英文字母, 也能够是符号、 图案等。标志的设计创意应当来自网站的名称和内容。比如: 网站内有代表性的人物、 动物、 植物, 能够用它们作为设计的蓝本, 加以卡通化或者艺术化; 专业网站能够以本专业有代表的物品作为标志。最常见和最简单的方式是用自己网站的英文名称作标志, 采用不同的字体、 字母的变形、 字母的组合能够很容易制作好自己的标志。 设计网站色彩。网站给人的第一印象来自视觉冲击, 不同的色彩搭配产生不同的效果, 并可能影响到访问者的情绪。”标准色彩”是指能体现网站型象和延伸内涵的色彩, 要用于网站的标志, 标题, 主菜单和主色块。给人以整体统一的感觉。至于其它色彩也能够使用, 但应当只是作为点缀和衬托, 绝不能喧宾夺主。一般来说, 一个网站的标准色彩不超过3种, 太多则让人眼花缭乱。适合于网页标准色的颜色有: 蓝色, 黄/橙色, 黑/灰/白色三大系列色。 设计网站字体。和标准色彩一样, 标准字体是指用于标志, 标题, 主菜单的特有字体。一般网页默认的字体是宋体。为了体现站点的”与众不同”和特有风格, 能够根据需要选择一些特别字体。制作者能够根据自己网站所表示的内涵, 选择更贴切的字体。需要说明的是: 使用非默认字体只能用图片的形式, 因为很可能浏览者的计算机里没有安装特别字体, 那么辛苦设计制作便可能付之东流了。 设计网站宣传语。也能够说是网站的精神、 主题与中心, 或者是网站的目标, 用一句话或者一个词来高度概括。用富有气势的话或词语来概括网站, 进行对外宣传, 能够收到比较好的结果。西安网络公司 第六步: 确定网站风格”风格”是抽象的, 是指站点的整体形象给浏览者的综合感受。这个”整体形象”包括站点的CI( 标志, 色彩, 字体, 标语) 、 版面布局、 浏览方式、 交互性、 文字、 语气、 内容价值等等诸多因素, 网站能够是平易近人的、 生动活泼的也能够是专业严肃的。不论是色彩、 技术、 文字、 布局, 还是交互方式, 只要你能由此让浏览者明确分辨出这是你网站独有的, 这就形成了网站的”风格”。 风格是有人性的, 经过网站的色彩、 技术、 文字、 布局、 交互方式能够概括出一个站点的个性: 是粗犷豪放的, 还是清新秀丽的; 是温文儒雅的, 还是执著热情的; 是活泼易变的, 还是墨守成规的。 总之, 有风格的网站与普通网站的区别在于: 在普通网站上你看到的只是堆砌在一起的信息, 你只能用理性的感受来描述, 比如信息量多少, 浏览速度快慢等; 在有风格的网站上你能够获得除内容之外的更感性的认识, 比如站点的品位, 对浏览者的态度等。 在明确自己想给人以怎样的印象后, 要找出网站中最有特色的东西, 就是最能体现网站风格的东西。并以它作为网站的特色加以重点强化、 宣传。总之, 风格的形成不是一次定位的, 你能够在实践中不断强化、 调整、 改进。 第七步: 有创意的内容选择好的内容选择需要有好的创意, 作为网页设计制作者, 最苦恼的就是没有好的内容创意。网络上的最多的创意即是来自于虚拟同现实的结合。创意的目的是为了更好的宣传与推广网站, 如果创意很好, 却对网站发展毫无意义, 那么, 网站设计制作者也应当放弃这个创意。另外, 主页内容是网站的根本之所在, 如果内容空洞, 即使页面制作地再怎样精美, 依然不会有多少用户。从根本上说, 网站内容依然左右着网站流量, 内容为王( Content Is King) 依然是个人网站成功的关键。 第八步: 选购网站空间这个一步应该是和选好域名的时候已经确定网站空间放在那里。在网络服务器上开辟出一定配额的磁盘空间供用户放置网站、 文件等内容, 最基本的虚拟主机功能包含web访问和文件传输功能。 做网站入门1、 什么是首页? 首页是指一个网站的主索引页, 是令访客了解网站概貌并引导其调阅重点内容的向导。首页设计要求在保障整体感的前提下, 根据大多数人的阅读习惯以色彩、 线条、 图片等要素将导航条、 各功能区以及内容区进行分隔。首页设计采用客户的既定标准色, 注重协调各区域的主次关系, 以营造高易用性与视觉舒适性的人机交互界面为终极目标。 2、 什么是形象页? 形象页是指一个网站的欢迎页面, 可引入的元素大致有: 企业名称、 LOGO、 形象图片、 网址、 宣传语、 首页链接、 其它语种页面链接等。将客户选定的元素创造性地布局后进行整体化设计, 建立亲和、 亮丽的视觉效果, 达到提高企业形象, 宣传企业理念的功效。 3、 什么是入口页? 入口页又称Coverpage, 顾名思义如果把网站比作一本杂志, 入口页(Coverpage)就是封面了。此页面的元素一般只有企业的名称, 企业的LOGO以及表现企业形象的背景图片等。 适用于突出体现企业形象、 企业理念或者为了让网站艺术型。但不适用于功能性强、 交互频繁的站点。 4、 网页同Word页面是一样的吗? 网页是由HTML( 超文本标记语言) 编写的。过去制作网页都要有专门的技术人员一行一行代码的编写非常费事, 而如今有了FrontPage 和DreamWeaver这样可视化的编辑工具使得不再那么困难, 同时也能够实现更多强大的功能。 5、 什么叫网站策划? 网站是企业发布信息、 收集反馈、 提供服务的综合平台。信息结构的设置能否符合访客的使用习惯将在很大程度上影响网站的实际功效。我们将圈定客户网站的主要目标访客群体后进行网站整体结构及栏目的策划, 出具详细的各页页面布局图与细节说明, 并据此与客户讨论布局、 设计风格、 以及各页面间的勾接关系等。 6、 什么叫形象页设计? 形象页是指一个网站的欢迎页面, 可引入的元素大致有: 企业名称、 LOGO、 形象图片、 网址、 宣传语、 首页链接、 其它语种页面链接等。将客户选定的元素创造性地布局后进行整体化设计, 建立亲和、 亮丽的视觉效果, 达到提高企业形象, 宣传企业理念的功效。 7、 什么叫栏目页设计? 据网站结构及信息类别的分类, 确定需要独立设计的栏目页和内容页模板文件的总数。设计中兼顾并继承首页的设计风格, 保障模板在各具体页面套用过程中的适用性和灵活性。 8、 什么叫动态效果? 在策划阶段根据不同页面的需要, 设置Javascript、 DHTML特效若干。例如: 走马灯、 分时问好、 弹出窗口等。各种特效不分难易, 采用统一价格计算。 9、 什么是Flash动画? Flash动画是一种矢量动画格式, 它是用Macromedia公司的Flash4软件编辑而成, 具有体积小、 兼容性好、 直观动感、 互动性强大、 支持MP3音乐等诸多优点, 是当今最流行的Web页面动画格式 10、 什么是超文本 超文本是一种新的文件形式, 指一个文件的内容能够无限地与相关资料链接。超文本是自然语言文本与计算机交互、 转移和动态显示等能力结合, 超文本系统允许用户任意构造链接, 经过Hyperlink来实现。 LOGO知识介绍一、 什么是LOGO:翻开字典, 我们能够找到这样的解释: ” logo: n.标识语 ”。在电脑领域而言, LOGO是标志、 徽标的意思。而本站主要所收集的LOGO, 是互联网上各个网站用来与其它网站链接的图形标志。 二、 LOGO的作用:1.LOGO是与其它网站链接以及让其它网站链接的标志和门户。 INTERNET之因此叫做”互联网”, 在于各个网站之间能够联接。要让其它人走入你的网站, 必须提供一个让其进入的门户。而LOGO图形化的形式, 特别是动态的LOGO, 比文字形式的链接更能吸引人的注意。在如今争夺眼球的时代, 这一点特别重要。 2.LOGO是网站形象的重要体现。 试问一个衣冠楚楚的人怎么能让自己的名片污渍不堪? 就一个网站来说, LOGO即是网站的名片。而对于一个追求精美的网站, LOGO更是它的灵魂所在, 即所谓的”点睛”之处。 3.LOGO能使受众便于选择。 一个好的LOGO往往会反映网站及制作者的某些信息, 特别是对一个商业网站来话, 我们能够从中基本了解到这个网站的类型, 或者内容。在一个布满各种LOGO的链接页面中, 这一点会突出的表现出来。想一想, 你的受众要在大堆的网站中寻找自己想要的特定内容的网站时, 一个能让人轻易看出它所代表的网站的类型和内容的LOGO会有多重要。 三、 LOGO的国际标准规范: 为了便于INTERNET上信息的传播, 一个统一的国际标准是需要的。实际上已经有了这样的一整套标准。其中关于网站的LOGO, 当前有三种规格: 1.88*31 这是互联网上最普遍的LOGO规格, 本站所收集的均是这种大小。 2.120*60 这种规格用于一般大小的LOGO。 3.120*90 这种规格用于大型LOGO。 四、 LOGO的制作工具和方法 仿佛当前并没有专门制作LOGO的软件, 其实也并不需要这样的一种软件。我们平时所使用的图像处理软件或者还加上动画制作软件( 如果你要做一个动画的LOGO的话) 都能够很好地胜任这份工作, 如PHOTOSHOP、 FIREWORKS等。而LOGO的制作方法也和制作普通的图片及动画没什么两样, 不同的只是规定了它的大小而已。 五、 一个好的LOGO应具备的条件: Poorfish认为, 一个好的LOGO应具备以下的几个的条件, 或者具备其中的几个条件: 1.符合国际标准( 废话) 2.精美、 独特 3.与网站的整体风格相融 4.能够体现网站的类型、 内容和风格 什么叫javascript? JavaScript 是一种居于 Java 程序语言的脚本语言。JavaScript 语言设计出来是用在居于 web 的网页( 包括客户端和服务器端) 上的, 这个文档里的内容只涉及了客户端的 JavaScript(它是被嵌入到网页中的 HTML 代码中, 而且由浏览器来执行的脚本语言)。 JavaScript 语言能够设计和访问一个 web 页面中的所有元素, 如: 图片元素( images) 、 表单元素( form elements) 、 链接( links) 等等。 这些对象属性等在 JavaScript 程序运行中能够被复制、 修改。JavaScript 还能够捕捉客户端用户对当前网页的动作, 如: 鼠标的点击动作或者键盘的输入动作等等。JavaScript 的这些功能使我们能够对用户的输入等动作做出想对应的反应动作, 从而实现一些交互性,还有一些平常经常见到的 JavaScript 的例子, 如鼠标移动、 表单过滤、 动画等等。 网页设计是不是越华丽越好? 不是这样, 对于大多数企业来讲设计网页的目的传达给来访者更多的实际的信息也就是内容, 这样才能 网站制作让来访者更好的了解企业并发生互动的可能。因此说网页的形式是为内容而服务的。设计精美的网页能够吸引来访者的视线, 而过于华丽则有些喧宾夺主了。 就像有些创意独特的时装手表, 你已无法用它来判断时间。在企业网站策划中应该考虑设计精美的同时, 考虑网站线索的清晰, 使用的方便, 功能的体现等因素。 做网站必须要注意的事项: 你应当有一个很清晰的网站介绍, 告诉访问者你的网站能够提供些什么, 以便访问者能找到想要的东西。可是, 许多设计者都没有这样做。有效的导航条和搜索工具使人们很容易找到有用的信息, 这对访问者很重要。告诉访问者你所提供的正是她们想要的信息。 ”网站一旦发布, 网站设计的优点和缺陷全都公布于世。没有什么方法使你能够比从自己的错误、 倾听其它人的建议和用户反馈意见中学到更多的东西。” 专家忠告 闪烁让人头痛 经过使用标识能够吸引访问者对你的主页特殊部分的注意, 但这也让你的访问者头痛。如果你想使访问者再次光顾你的网站, 就少用此方法。 背景颜色 背景颜色也会产生一些问题, 可能会使网页难于阅读。你应当坚持使用白色的背景和黑色的文本, 另外还应当坚持使用通用字体。 向前和向后按钮 应当避免强迫用户使用向前和向后按钮。你的设计应当使用户能够很快地找到她们所要的东西。绝大多数好的站点在每一页同样的位置上都有相同的导航条, 使浏览者能够从每一页上访问网站的任何部分。 ”坚持你的信念。严格遵守各种规则。避免想当然。绝不停止学习。” 专家忠告 点击记数器 不要轻易考虑在你的网站上放置一个醒目的点击记数器。你设计网站是为了给访问者提供服务, 而不是推销你自己认为重要的东西。大多数浏览者认为计数器毫无意义, 它们很容易被做假, 浏览者也不想看广告。如果你显示你的网站是多么受欢迎, 你最好提供一个链接, 显示访问日志。 不要用框架 与记数器一样, 框架在网页上越来越流行。在大多数网站上, 在屏幕的左边有一个框架。可是设计者马上就发现, 在使用框架时产生了许多的问题。使用框架时如果没有17英寸的显示屏几乎不可能显示整个网站。框架也使得网站内个人主页不能够成为书签。可能更重要的是, 搜索引擎常常被框架混淆, 从而不能列出你的网站。 去掉图像 在浏览器中即使去掉了图像功能, 也要保证访问者能够在你的网站上获得满意的效果。对于那些使用ISDN连接而且关掉了图像功能的访问者, 还能获得好的网页加载性能。能够经过在网页底部提供另外的链接和使用替代文字, 而不是图像来满足访问者的需要。 重复使用图像 一些网站由于使用大量不重复的图像而错过了使用更好的技巧的机会。在创立商标时, 在网页上多次使用同样的图像是一个好的方法, 而且一旦它们被装入, 以后重新载入就会很快。 避免使用过大的图像 不要使用横跨整个屏幕的图像。避免访问者向右滚动屏幕。占75%的屏幕宽度是一个好的建议。 ”避免使用炫耀的技巧。” 专家忠告 选择使用Flash动画 许多使用比较慢的计算机的访问者发现动画图标很容易耗尽系统资源, 使网站的操作变得很困难, 因此, 应该给用户一个跳过使用Flash动画的选择。 尽量少使用Flash插件 虽然许多Web设计者认为Flash功能很强大, 而且Netscape5.0将支持Flash, 在使用时不必再下载任何插件。 可是, 最好还是取消使用Flash做各接口的想法。 让用户先预览小图像 如果不得不放置大的图像在网站上, 就最好使用Thumbnails软件, 把图像的缩小版本的预览效果显示出来, 这样用户就不必浪费金钱和时间去下载她们根本不想看的大图像。 动画与内容应有机结合 确保动画和内容有关联。它们应和网页浑然一体, 而不是干巴巴的。动画并不只是Macromedia Director等制作的东西的简单堆积。 慎用声音 声音的运用也应得到警惕。内联声音是网页设计者的另一个禁地。因为过多地使用声音会使下载速度很慢, 同时并没有带给浏览者多少好处。首次听到鼠标发出声音可能会很有趣, 可是多次以后肯定会很烦人。使用声音前, 应该仔细考虑声音将会给你带来什么。 少用Java 和AxtiveX 在网页上应尽量少使用Java 和AxtiveX。因为并不是每一种浏览器都需要使用它, 只有那些Netscape 和Explorer的早期版本的使用者才需要它。另外Mac在处理Java时也存在问题, 过分地使用Java, 会使Mac崩溃。 超级链接 超级链接是WWW的神经系统, 它也是向导, 把你从一个网页带到另一个网页, 或者从网页的某一部分引导到另一部分。超级链接是用特殊的文本或图象来实现链接的, 单击它就能够实现它的功能。 网页设计中HTML常范的五个错误1.网页背景色的设置 犯错机率: 很大 普遍性: 较广 犯错可能性: 懒/不知道 2.Align center( 自动居中) 的滥用 犯错机率: 非常大 普遍性: 非常广 犯错可能性: 以为方便/以为好用 3.重复使用实现相同功能的代码、 或杂七杂八的乱套代码 犯错机率: 非常普遍 普遍性: 非常普遍 犯错可能性: 复杂多样 4.表格不正确嵌套 犯错机率: 一般 普遍性: 普遍 犯错可能性: 对这个不了解 5.写代码缩进的时候, 不是使用Tab而是使用空格 犯错机率: 一般 普遍性: 较少 犯错可能性: 不知道Tab更好用 使用空格有二大坏处: 1、 缩进速度慢、 修改速度慢。2、 增大网页体积, 会影响速度。 十个最重要的网站制作技巧复杂的网站设计总是很花时间, 高级效果为设计增色不少, 但如果用的不对, 只会影响用户对重点内容的关注。高级效果可能正好是一项好的设计的冲击力所在, 但即便如此, 也还是需要一些更简单的效果与其配合。 简单的效果和技巧是建造当今设计的基石。比喻说, 如果你都不知道如何正确选择颜色和文字效果, 灿烂的星光效果又能有什么用? 本着Less is more的理念, 我们为你精选了十个简单好用的设计技巧, 它们能大大提升你设计的专业性和感染力。 基础先行。 学会走之前要先学会爬, 让我们从最基础的简单有效的网站设计的概念开始。 1. 增加对比很可惜, 添加额外的对比是最被忽视和弃用的技巧之一。 Joost de Valk 采用了细的高对比度边线, 让访客能更容易区分页面的不同区域。在上图中放大了的部分, 你能够看到, 大多数时候这种对比只是一条1像素的高亮线挨着1像素的暗线。 不过, 这个页面上的”More”和”Go”按钮与周围的对比度太小, 即使你刻意在找也很容易被忽略掉。 WordPress 为页面中最受欢迎的链接 ”Download(下载)” 使用了对比色。 这种红色在冷灰色调的页面中自己跳了出来。但这红色在明度方面有所收敛, 避免了影响页面整体效果。 如果你对于该不该使用对比犹豫不决, 就把这一决定过程当做是化妆。你要做的不是让人们大吼”看呐, 对比色!”, 你需要的是自然而然的吸引她们注意页面中重要的内容, 高亮出已经存在的重点。 2. 渐变技术的发展为所有想使用渐变的人提供了各种创造渐变的工具。但渐变真的很好么? Media Temple 网站的每一个页面都使用了渐变, 不过其渐变使用的节制和精妙才是设计成功的关键。logo, 大标题, 按钮和背景都有细微的或者镜像的渐变, 以强调内容。最复杂的渐变用在了那些简单的120像素宽的按钮(子页面中的”ACTIVATE”和”LEARN MORE”)上, 因为它们是需要访客注意的重点。 Commission Junction的渐变运用远没有Media Temple的细致, 而且采用了过于丰富的渐变类型: 从黑色到灰色的水平线性渐变, 位于页面顶部 页眉处的绿色径向渐变 登陆框背景的”CJ” 标志上方模糊的斜向渐变 输入框背景中淡淡的垂直线性渐变 导航条背景的垂直渐变 Webinar广告中明亮的线性渐变 另一个垂直线性减弱, 用在了大标题处 这种设计有点冒险, 大部分渐变式有用的, 但还是存在一些问题。最突出的一点是, 设计丧失了一致性。同选择可辨性强的色彩组合一样的道理, 设计师也需要为每个