1_网页设计概述

网页设计概述基础网页分类网页设计软件与编程语言Web站点的规划与设计主要内容1.，wordwideweb,译做“万维网”，提供网页浏览服务。服务器的计算机组成，它将不同的信息资源有机地组织到一起，通过浏览器进行浏览。1)信息的组织形式网页：用HTML写的文档，可以用浏览器进行浏览（webpage）。网站：网站在逻辑上可视为一个整体的一系列页面的有机集合（website）。首页：为一个组织或个人在（或其他Web）上开始点的页面（Homepage）。站内目录结构1.）超文本与超链接所谓“超文本”是指信息的组织形式不是简单的顺序排列，而是复杂的网状交叉索引方式，对不同来源的信息加以链接。可链接的有文本、图像、动画、声音或影像等，而这种链接关系则成为“超链接”。1.）超文本与超链接超链接1超链接2超链接3超链接4超链接1超链接2超链接3超链接4超链接1超链接2超链接3超链接4超链接1超链接2超链接3超链接1超链接2超链接3超链接4超链接5超链接6超链接1超链接2超链接3超链接4超链接53）统一资源定位器（URL,UniformResourceLocator）URL四部分组成：网络协议、域名、路径、网页文件。其基本形式为：“How://Who/Where/What”。例如：基础1.））静态文本和图片2）网页动画3）动态内容和网页特效4）交互式网页内容静态网页动态网页网页内容不会随着浏览者的不同或浏览时间等的不同而改变，要改变网页内容，必须由设计者在设计状态下改变。网页内容会随着浏览者的不同或浏览时间等的不同而改变。3.网页编辑软件和编程语言1）网页编辑软件2）静态网页编程语言3）网页特效编程语言4）交互式网页编程语言5）网页设计辅助工具MicrosoftFrontPageDreamWeaverHTML(HypertextMarkupLanguage)CSS(CascadingStyleSheet)XML（eXtensibleMarkupLanguage）JavaScriptVBScriptASP(ActiveXServerPage)PHP(HypertextPreprocessor)JSP(JavaServerPage)PhotoshopFireworksFlash网页编辑工具HTML编辑器HotDogBBEdit（Mac）CuteHTML记事本frontpageDREAMWEAVER素材处理与创作工具图像浏览与处理ACDSeePhotoshopFireworksPhotoImpact矢量图创作工具FreeHandCorelDrawIllustrator素材处理与创作工具多媒体制作工具FlashDirectorAuthorwareLiveMotion特效制作工具AnfyCool3DGIFAnimator为了提高网页的视觉吸引力，有效地传达信息，给人以审美感受，网页文件的创意非常重要。只有做好网页文件的规划与创意，才能很好地组织起丰富的网页素材以实现网页设计的目标。4.Web站点的规划与设计1）明确网站的目标和用户需求公司、单位信息发布出版物，即电子报刊个人主页在线购物站点专题介绍实用信息服务4.Web站点的规划与设计2）素材的准备与组织4.Web站点的规划与设计3）站点结构规划分级结构线性结构Web结构主页页面1页面2页面3页面4页面5页面6页面7一级标题二级标题分级结构4.Web站点的规划与设计主页页面1页面2页面3线性结构4.Web站点的规划与设计主页页面1页面2页面3页面4页面5页面7页面8一级标题二级标题Web结构页面64.Web站点的规划与设计4）网页组成标题正文插图背景动画网页特效4.Web站点的规划与设计5）网页布局T字型口字型对称型海报型4.Web站点的规划与设计6）网页中的一些其它构成元素Logo（网站标志）Banner（网页广告）导航栏Flash动画多媒体（网页中的声音、视频）4.Web站点的规划与设计新浪网易小结1.理解了解网站规划的步骤要网站元素判断正误（1）网站就是一个链接的页面集合。（）（2）将网页上传到Internet时通常采用FTP方式。（）选择题（单选）（1）是———的意思。A．网页B．万维网C．浏览器D．超文本传输协议（2）浏览器是一种_________。A．系统程序B．客户端程序C．服务器端程序D．编程工具简答题：简要列举网页制作的语言、分类以及制作工具？思考题：假如你要开发一个网站，你认为需要哪些工作流程？课后作业：上网搜集一些自己喜欢的网页，并将其保存起来，分析它的布局与规划。•1.确立建站目标•2.推导出一个最合适的网站框架（规划）•3.内容的建设•4.确定栏目与版块•5.确定网站的目录结构与链接结构•6.确定网站的整体风格,创意设计•7.根据受众反馈意见,重复修订