网站设计与建设18.ppt

网 站 设 计 与 建 设Website design and developments 18.1 网站开发设计方法 手工编写HTML 现在已有很多工具可以帮助开发者轻松设计网站， 使用设计工具对HTML、CSS、DHTML，JavaScript和Java Applets等进行可视化设计，可以大大提高设计速度和效率，并且可以大量减少页面布局和测试的时间， 理想的网站开发设计方法应该是大量使用设计工具再加上少量的手工编码。。 18.2 所见即所得设计工具特点 WYSIWYG设计工具(What You See Is What You Get，所见即所得) 1．网站设计工具独特功能 ①站点管理：通过使用各种视图、可视化对象、属性设置、统计报表和网站发布等，可以很容易地进行站点的管理。 ②页面布局和设计：可视化工具使开发者直观地看到所设计的页面，因此简化了Web页面设计，另外，开发者也很容易地使用表格、框架或者CSS进行页面布局定位。 ③数据连接：产生带有动态数据的内容已成为网站常用的技术，对数据库的连接和数据管理在网站设计中是非常重要的事情。通过网站设计工具自带的数据连接和数据管理功能，设计人员可以方便快捷地创建、增加、检索以及删除数据等。 2．网站设计工具优点 ①节省时间 ②易 用 性：不需要深入了解HTML也可以使用可视化工具，依靠下拉菜单和使用鼠标，非常容易设计HTML、CSS、DHTML、JavaScript或Java Applets。 ③面向设计： WYSIWYG 。 ④提升速度：网站设计者不需要学习并记住不同的程序语言以及规则 3．网站设计工具缺点 ①缺乏控制：需要借助选项菜单 ②非一致性： 各种设计工具创建的HTML代码不完全一致。 ③缺乏功能： 网站设计工具能提供服务扩展，但是需要服务器方面的支持，而设计工具以附件形式提供服务器扩展或者根本就不提供。如果没包括这类功能，网站开发者必须使用另外的扩展程序来完善站点。 ④不统一性： 每个设计工具有其特有的工作环境，如果要使用另一种设计工具，就必须学习使用不同的环境。 18.3 知名网站开发设计工具 DreamWeaver、 FrontPage、 IBM RAD、 IBM Portal、 Bea Weblogic Workshop、 Bea Weblogic Portal、 eclipse Adobe GoLive NetObjects Fusion v10 Namo WebEditor HotDog PageWiz等。 1．Adobe Dreamweaver CS3 () 基于Mac和Windows系统。 Dreamweaver是从新手到专业人员的非常好的选择 支持代码编辑，还可以代码窗口和可视化窗口同时展现， 利用对领先 Web 开发技术 (包括 HTML、XHTML、CSS、XML、JavaScript、Ajax、PHP、Adobe ColdFusion、ASP、ASP.NET 和 JSP) 的支持。 使用 XSL 或适合于 Ajax 的 Spry(活泼的) 框架，快速集成 XML 内容。 FLV 支持 无需任何 Flash 知识， 7．Eclipse (/) 一种基于 Java 的可扩展开源开发平台 它只是一个框架和一组服务，用于通过插件组件构建开发环境。 Eclipse 附带了一个标准的插件集，包括为人熟知的 Java 开发工具（Java Development Tools，JDT）。 Eclipse 当作 Java 集成开发环境（IDE）来使用 Eclipse 还包括插件开发环境（Plug-in Development Environment，PDE 基于 Eclipse 的应用程序的一个突出例子是 IBM? Rational? Application Developer (RAD)，它构成了 IBM Java 开发工具系列的基础。 18.4 HTML文本编辑器特点 1．HTML文本编辑器优点： ①完全控制HTML ②速度提升：使用一个HTML文本编辑器创建网站比纯手工编码要快的多，。 ③多语言支持：许多HTML文本编辑器支持其他语言和技术，例如JavaScript、PHP、ASP、JSP、Perl、Java和CSS等。设计者能够使用一个而不是很多工具来设计动态网站。 2．HTML文本编辑器缺点： ①页面布局和设计：一些HTML编辑器没有像WYSIWYG编辑器那样能让网站设计人员直接看到所创建页面的设计视图。设计者必须保存他们的页面并直接在浏览器中查看，使设计进程缓慢。 ②具备HTML知识 18.5 知名HTML文本编辑器 ①Macromedia HomeSite： 基于Windows， 其方便的鼠标右键功能菜单和强大的多文件查找替换功能，使