[互联网]网站设计流程.ppt

2) 表格布局 表格布局好像已经成为一个标准，随便浏览一个站点，它们一定是用表格布局的。表格布局的优势在于它能对不同对象加以处理，而又不用担心不同对象之间的影响。而且表格在定位图片和文本上比起用CSS更加方便。表格布局唯一的缺点是当用了过多表格时，页面下载速度受到影响。 3. 网页版面布局的技术 3) 框架布局 可能是因为框架布局的兼容性，框架结构的页面开始被许多人否定。但从布局上考虑，框架结构不失为一个好的布局方法。它如同表格布局一样，把不同对象放置到不同页面加以处理，因为框架可以取消边框，所以一般来说不影响整体美观。 3. 网页版面布局的技术 4.6 实训：网上商城的规划设计4.6.1 实训目的4.6.2 实训内容4.6.3 实训过程4.6.4 实训总结 4.6.3 实训过程 1. 确定建立网站的目的 在建立一个网站前首先要确定建立的目的，这是制作网站的依据，只有有了这个依据，才能确定这个网站到底向哪个方向发展。既然是网上商城，那么建站的目的就应该是给企业宣传产品，让用户了解商品。 2. 确定网站的整体风格 当确定建立网站的目的后，就可以根据网站的目的确定整个网站的风格。我们这个网上商城实质就是电子商务，那么它就符合电子商务网站的整体风格。 商务网站，实用性为根本，但仅仅实用并不能将一个有着购买欲望的普通用户变成你的购买者。购买是一个过程，网站应该尽量将这个过程缩短，让用户不需经过繁琐的操作就可买到他们喜欢的产品。 根据实际生活中的习惯，将主题分成3步进行阐述：商品查找、商品查看、交易。1) 商品查找 (1) 帮助文件 登录网站的用户，并不是每一位都熟悉我们的购买流程，先做什么，后做什么，所以最好在醒目的位置做一个“Help”或“帮助”的链接，以帮助那些不清楚具体操作步骤的用户。 如图所示，购物指南是当当网站为不熟悉购买流程的用户制作的【帮助】文件。 (2) 关键字查找 我们的商品琳琅满目，为用户提供了最大限度的可挑选性，但如何让用户最快地找到所需要的商品呢？可以提供一个输入关键字然后进行快速查找的功能。 如图4.3所示，【快速搜索】提供了关键字的查找功能。 图4.3 关键字查找示例 (3) 产品分类 产品分类是非常重要的一环，分类尽量详细、科学，以方便查找。如图4.4所示，这里只是截取了部分分类。 图4.4 产品分类示例 2) 商品查看 用户找到他感兴趣的产品后，应为用户提供更详细的产品信息。(1) 在产品名中尽量标出与其他同类产品不同的特性，这也是针对缩短用户购买的中间过程所做的。难以想像当用户面对一大串同类产品信息时还能保持耐心，如图4.5所示。 图4.5 同类产品信息 (2) 详细的产品信息。包括详细的文字信息与产品图片，文字信息应尽可能详细地介绍性能及功能，以便用户最直观地获取产品信息。最好再添加通过单击打开链接的大幅图像的功能。如图4.6所示，产品下有产品信息，并且单击【单击进入】按钮后，可进入详细的产品介绍页面。 图4.6 产品介绍示例 3) 加上厂家主页链接地址 加上厂家主页链接地址以便于用户对产品做出更多的了解。也许你会担心用户会离开网站而改在厂家购买，实际上这种现象是很少的。 3. 确定网页的布局 对于商业网站，能吸引客户注意是最主要的，所以说网站的首页布局非常重要。对于商务网站一定要加上相应商品的图片，这样更能直观地让客户了解某个商品。所以对于当当网来说，肯定要在它的商品上加上一个图片，这样既能展示商品又能吸引客户的目光。如图4.7所示是当当网中关于两本书的介绍，就加上了这两本书的封面。 图4.7 给商品加图片 关于网页版式布局，由于在当当网中需要展示的商品类别比较多，所以最好采用表格布局的方式。如图4.8所示是当当网的首页，它采用的就是一种表格布局，通过这种布局能使不同类别的商品放在一块，给客户一种非常规范的感觉。 在主页链接到后面的网页中，最好使用导航条，因为这样客户能随时返回到某一类型的商品页面上，而且还可以知道现在客户所处的位置。 图4.8 表格布局示例 4. 确定网页的内容5. 网站测试和改进 6. 内容更新 网站测试完后，就可以把网站发布到网上。对于在网上发布的信息一定要及时更新，确保把最新的信息展示给客户。(1) 培训员工经常使用域名使其推广。 (2) 实物宣传。在公司名片、信封、文具、宣传刊物等对内外资料中须标明网址；在公司所有对外广告中、留念品中添加网址宣传；借助相关媒体进行适当宣传 .(3)