第一章 网页设计概述据中国互联网信息中心统计,全国数千万网民中37.8%有过网上购物的经历.在未来一年中,这一比例将增至50%.作为新兴零售业,网上商店显示出巨大的发展空间.我们不仅可以在网上购物,在网上开加盟店,还可以用Dreamweaver等专业网页制作工具构建商务,借助于网络将自己的产品通过自建商务推向市场.怎么样,心动了吧?快来加入网上开店之旅吧!【知识学习目标】 了解的基础知识 掌握Dreamweaver的基本操作 掌握HTML语言基础【能力学习目标】 学会欣赏，说说这些的优缺点【重 点 难 点 】 建立Dreamweaver的站点；HTML语言基础1.1网页案例赏析上的网页丰富多彩,有B2B、B2C、C2C、B2G和C2G类型。海尔集团公司的电子商务有与经销商的（B2B）业务还有企业与消费者业务的（B2C）网上商城；中国外经贸属于企业与政府之间的业务往来（B2G）；8848、卓越网上商城是属于企业与消费者业务的（B2C）；淘宝属于消费者之间的业务往来（C2C）。【案例1.1-1】：海尔集团公司电子商务是否需注明网页是什么时间的？图1.1-1 图1.1-2海尔集团公司（ :/ haier /）是一个典型的电子商务，海尔建设体现了以下特点：结构合理、层次分明、功能齐全的规划设计。整个有8个大的功能模块，每一模块又由一系列功能模块组成，如：“海儿产业”“海尔产业”模块又分为“家电”“通讯”“IT”“家居”13个子功能模块。简洁明快、风格一致的网页设计。浏览海尔，会感觉的每一个的每一个页面都体现了简洁明快的特点，同时每个网页的背景、颜色、字体、布局等都非常一致。颇具匠心的主页设计。主页除了具有简洁明快、风格一致、信息量大等特点外，在网页上不停闪烁的Flash动画为主页面又增添了几分活泼的色彩，同时清晰的导航和搜索系统设计可以引导用户浏览每一个想要浏览的页面。图1.1-3综合性较强的电子商务系统。除了具备一般信息发布型的基本内容之外，为了快速满足用户的个性化需求，还建立了完善的网上零售（B to C）体系，同时，面对供应商的企业间电子商务平台（B to B）也展示了海尔现代企业的风采。完善的电子商务系统设计。海尔电子商务最核心部分海尔商城。商城对各类产品的功能作了详尽介绍，拥有方便快捷的购物环境、清晰流畅和操作性能的购物流程。“海尔商城”的架构和设计真正体现了“想你所想”的海尔理念。独特、成熟的配送体系和发货渠道。海尔可以根据用户的地址，选择最快捷的配送方案。方便快捷的与客户经常性联系的渠道。客户可通过“服务专区”在网上反映所遇到的问题，或拨打“服务热线”要求上门服务。“FAQ”可在线与时解答用户疑问。鲜明的主题、丰富的信息含量。的每一个页面都有鲜明的主题，整个丰富的信息含量并没有使显得累赘，反而更好地体现了海尔的理念和文化。综上所述，海尔在架构和网页设计中蕴含了一整套现代网络营销思想，特别是海尔通过独特栏目的架构和设计，体现了国际化海尔的气度和经营理念。我们可以在学习和实践过程中去认真地体会和感受它，熟悉和掌握企业电子商务规划的设计思想和方法。【案例1.1-2】：中国外经贸图1.1-4设计思路“中国外经贸”（ :/ chinamarket .cn/）是外经贸领域专业站点，它面向国内外客商，能提供丰富、详实、准确、快捷、互动的信息内容，具有完善的检索功能，力求成为外商了解中国外经贸信息动态的窗口。内容和目标“中国外经贸”提供综合信息、商务信息、企业网络广告等多项服务，并且实现了供求双方的真正互动采购商需求信息发布、供应商企业与其产品信息发布。同时，“中国外经贸“与商务部、中国国际电子商务网、中商易通、在线广交会、在线义博会、中国招商网等、互通，丰富了内容。“中国外经贸“提供的服务：采购信息、企业与其产品信息的免费发布。国内外采购商、供应商可以随时发布自己的采购信息、企业与其产品信息，零成本即可获得最大的成交机会。免费查询信息。“中国外经贸“与多个保持、互通，浏览者无须付费就可通过其强大的搜索功能获取丰富信息。网络广告服务。“中国外经贸“所提供的网络广告形式生动突出，有文字、悬浮按钮广告、全屏广告、巨幅广告、擎天柱广告、通栏广告、流媒体广告、弹出窗口广告等各种形式，同时绝佳的广告位置可使外商在第一时间找到推荐的中国企业和名优产品。二级域名服务。用户可以在该注册二级域名，设立一个永久“摊位“。企业设计与制作。包括提供域名注册、虚拟主机托管、策划、网页设计与制作、数据库开发、搜索引擎加注等一系列服务。整体框架和主页设计分为以下模块：综合经贸新闻、外经贸政策发布、地区外经贸信息、中国企业、供应专区、采购互动、介绍、联系我们、产品与服务等。有中英文两个版本。风格和主页设计特点：页面设计简洁明快、色彩和谐、导航清晰、主题突出（见图1-4）。主页有以下几个区域：、 企业标志和菜单。 广告。 主要信息导航区。发布最新新闻和企业采购、供应等市场信息。 功能区。包括友情、介绍、联系关系、声明等。维护与管理“中国外经贸“本着”以企业为本，信息为龙头“的服务宗旨，十分重视的维护和管理。主要体现在以下几个方面：经常进行页面更新，给人以不断创新的形象。维护人员多，确保页面正确无误和的正常运行。提供良好的服务，对提出申请的企业，管理人员在检查该企业无误后，将其到相应的行业中，并向用户发送成功的反馈信息。反馈信息答复与时，对于用户提出的问题和要求，与时给予答复。专业的网络安全、数据库维护，确保系统使用中的安全性、快速性。【案例1.1-3】：8848网上商城图1.1-58848作为全球性的中文网上商品交易平台，提供B to C 网络平台的搭建与服务，提供完善的商品展示、结算、后台自行维护、客户关系管理等全方面的服务。特点：人性化的交易流程设计让商户在网上出价和登录商品更加便捷省力。完善的功能设计商户能轻松管理自己的网上店铺与交易商品。eStore后台帮助广大商家方便、迅速地登录商品；网上店铺给每个卖家一个展示自己个性和发展网上业务的空间。严格的网上认证制度以与专设的管理网上交易行为的部门打造了一种诚信的网上交易氛围。强大的客户服务队伍周到热心地解答用户的各类咨询，帮助您学会使用8848 eStore后台管理各项功能，并顺利完成网上交易。8848网上商城前台主要模块：网上商店图书期刊：经管、人文社科、文学等。音乐影视：电影、电视剧、流行、怀旧等。IT产品：硬件、软件、耗材、游戏等。数码摄像：MP3、数码相机、数码摄像机等。通信器材：手机、 、配件等。鲜花礼品：鲜花、时尚礼品、工艺品、蛋糕等。保健用品：保健食品、保健服装、保健器械、成人用品等。数字卡类：IP卡、 卡、上网卡、游戏卡等。化妆美容：护肤、美容、香水、美容资讯等。家用电器：小家电子、大家电、空调、冰箱等。体育用品：品牌、服装、鞋帽、器械、纪念品等。汽车用品：配件、装饰、保养、资讯等。票务中心：演唱会、音乐会、体育竞技、戏剧、休闲等。日用超市：食品、玩具、特产、宠物用品、家居用品等。金融资讯：股票分析、投资咨询、在线查询等。8848购物引擎8848购物引擎是面向中国大陆地区的专用用户产品搜索引擎。Internet用户通过8848购物引擎的搜索框输入想要购买的产品名称，就可以在几秒种内找到Internet上成百上千种电子商务经营的相关产品。用户在浏览器上可以看到产品的图像、价格和简单介绍，同时提供给用户价格比较、产品排序以与多种显示方式。用户点击搜索结果，可以直接访问提供此商品的该产品最终页面，甚至可以直接进行在线购买。大客户服务想一想：卓越网、淘宝网、阿里巴巴等网页有什么优点？8848向企业提供商务电子化解决方案，帮助企业运用现代信息技术，优化生产流程，实现企业管理网络化和电子化，从页改善企业经营管理，实现管理的系统化、规X化和科学化，降低成本，提高市场占有率。图1.1-6图1.1-7图1.1-81.2 、网页基础议一议：组成网页元素还有哪些?找一找淘宝网页上的组成元素?1.2.1网页基本组成元素网页基本组成元素有：文本、图片、超、动画、表单、音频、视频等。网页基本知识Internet又名国际互联网，或称因特网，是全球公共信息网络系统的基本构成部分，它将无数的计算机连接起来，为公众提供大量的服务，被称为信息高速公路。 和网页则是互联网的重要组成部分，也是最主要的信息交流界面，通过页面技术，世界各地的网民进行信息交换、沟通，实现了信息的共享。当然，互联网中除了外还有很多的服务，比如服务、FTP服务、TELNT服务等。 现在用的最多的WWW网（World Wide Web，万维网），1990年开始建立，同时确立了HTML语言作为信息传输语言。 网页与关系是互联网的一个节点，网页都存在于中，就象一本书一样，网页是书的每一页，封面是主页，页码就是网址，网址全称是“统一资源管理器”，即URL，URL与页面是一一对应关系。我们在浏览器的地址栏中输入网址后，按回车键就可以打开的首页，此时在网页上移动鼠标，就可以看到有时鼠标的光标变为手形，这说明该处是一个超，每个超都对应着一个网页。无论网页的数量多少，都需要建立一个独立的来存放网页。中除了网页以外，还包括网页中应用到的各种图象、音乐、视频、数据库等，也有独立于页面的图象、音乐、视频等，但它们可以通过来实现与网页的关联。1.3常用的网页制作工具网页的设计制作一般分三个阶段：一是设计，二是布局，三是动画的添加，复杂的还可以能牵涉到脚本程序，针对不同的阶段，网页的制作就需要不同应用软件的支持。 在设计阶段，常用的应用软件有Photoshop、Fireworks等专业的图形图象设计软件。在布局阶段，常用的应用软件有FrongPage、Dreamweaver等专业网页制作软件。网页动画一般都为二维动画，常用的动画软件以Flash为最佳。 FrongPageFrongPage是Microsoft推出的优秀网页制作软件，是办公软件套装Office的组件之一。它的最大特点就在于采用Word等类似的界面，所以比较容易操作。它是一种“所见即所得”的网页编辑器，用户使用FrongPage，无需懂得HTML的语法和元素，就能制作出引人入胜的具有一定专业水准的网页。图1.3-1网页三剑客Fireworks、Flash和Dreamweaver是Macromedia公司出品，通常被称为网页三剑客，它们是制作专业的必备武器。Fireworks的作用主要就是作图，它即可以制作位图，又能制作矢量图和动画。利用Fireworks可以轻松地制作出网页中的图片翻转、菜单下拉等效果，并将图片优化以适合网络应用的需要。Flash是制作动画的软件。它功能强大，采用矢量图设计，设计的文件体积小，易于网上传播。Flash除了可以制作动画外，还具有交互性，即用户可以通过鼠标、键盘等操作来实现与动画的信息交流，从而实现事件。Dreamweaver是一种和网页制作的专业化可视编辑工具。利用Dreamweaver可以轻松地制作出具有动态HTML功能的，Dreamweaver的“所见即所得”的功能使得编写JSP、ASP、PHP等变得很容易。与FrongPage相比，Dreamweaver更具有专业性，功能更强大。图1.3-2 Fireworks窗口