建站百科 Website News

本经验讲解如何使用Dreamweaver来开发网站的高级工作流程，从而建设出一个相对完整的网站（注：了解 Web 域、HTML、CSS 、JavaScript及jQUery方面处于初级到中级阶段）。

工具/原料

方法/步骤

（一）Web 开发第一阶：规划，给‘我’一个坚持的理由

首先要分析受众、市场需求，掌握相关技术，接着收集有关设计和网站发布所需信息，明确目标才能提供动力方向，步步为营，步步为赢！拔营起行之前，先考考自己以下问题，查漏补缺，弥补不足，减少在开发网站时的困扰。

自己已整装待发，对网站开发、托管已有清楚了解，并选择Dreamweaver 和 Creative Cloud 用于 Web 开发流程，则可谓人心思顺，即时投袂而起。

（二）资源准备

检查您是否有设计网站所需的所有资源，可在本地文件夹或 Creative Cloud Libraries 中收集和整理它们。

（三）文档创建

使用以下项在 Dreamweaver 中创建新文档：

· 新的空白文档

· 起始页模板（Ctrl+N 快捷键）

· 其他人创建的模板文件 (*.dwt)

（注:起始页模板适用于Dreamweaver初学者和Web 开发新手，在参考页面的同时了解良好网页设计应具备哪些要素）。

（四）熟悉 Dreamweaver 工作区

找到适合您的工作区，设置颜色主题，以适合您的方式重新组织面板布置。

（五）站点设置

已定好架构，文件、资源及文本信息一应俱全，只欠东风，这时就可创建文件夹结构，以设定站点（注：在此阶段，建议设置远程服务器连接，如有动态内容，还需设置测试服务器）。

0Dw怎样编辑站点

（六）视图转换

“代码”视图中可编写代码， “设计”/“实时”视图中可设计网页。如需用到 Photoshop 复合，可将复合图层提取到Dreamweaver并处理它们。

（七）CSS的应用

使用 CSS 确定网页外观样式，可采用不同方式在 Dreamweaver 中处理 CSS，可手动编写 CSS 代码。对创建 CSS 页只得一知半解，可使用 CSS Designer 面板帮助生成 CSS。

更热衷使用 Sass 和 Less 文件，将 Sass 和 Less 文件导入 Dreamweaver 站点并处理它们。Dreamweaver 然后自动编译它们（或手动编译它们）并实时查看 CSS 更改的结果。

（八）设置 Web 应用程序：创建动态内容

许多 Web 站点都包含了动态页，访问者可从动态页中查看存储在数据库中的信息，一般允许某些访问者在数据库中添加新信息或编辑信息。创建此类页面，先设置 Web 服务器和应用程序服务器，编辑Dw站点，然后连接到数据库。

（九）创建动态页

先定义动态内容来源，其中包括从数据库提取记录集、表单参数和 JavaBeans 组件。然后将动态内容拖放到网页，即可完成添加。

设置页面，可同时显示一个或多个记录，还可显示多页记录。添加用于在记录页之间来回移动的特殊链接，以及创建记录计数器来，帮助用户跟踪记录。

10

（十）测试、预览和发布网站

在创建页面后，预览以查看网站是否符合设计目标。

在“拆分”视图下中， “编码”视图和“实时”视图并排放置，编码同时可预览效果。另外，还可在设备上实时预览网页（响应式网页），或在浏览器中预览。已实现远程连接，可向远程服务器上传文件，发布您的网站。

END

注意事项

经验内容仅供参考，如果您需解决具体问题(尤其法律、医学等领域)，建议您详细咨询相关领域专业人士。