网页设计实训报告

电子商务网页设计与制作实训报告

班级：电商1302班

姓名:张涛

学号：0804130239

2015年1月7日

目录

一、网站基础识 (3)

1.网站与网页的关系 (3)

2.网站、域名、空间的关系 (3)

3.网站的制作方式 (3)

二、所做网页内容 (4)

1.女娲网站 (4)

2.休闲食品项目网站食品页面 (4)

三、所做网页详解 (4)

1.女娲网站所做工作 (4)

2.休闲食品项目网站所做工作 (5)

四、实训网站制作思路 (5)

1.女娲网站思路 (5)

2.休闲食品项目网站思路 (5)

五、实训网站详细制作过程 (5)

六、实训总结 (7)

七、.对课程及实训环节的建议 (8)

一、网站基础知识

1.网站与网页的关系

网站是一个整体，网页是一个个体，一个网站是由很多网页构建而成。网站和网页的关系就像家庭和家人一样。

网页与网站的区别简单的来说：网站是由网页集合而成的，而大家通过浏览器所看到的画面就是网页，网页说具体了是一个html文件，浏览器是是用来解读这份文件的。也可以这样说：网页是有许多html文件集合而成。至于要多少网页集合在一起才能称作网站，这可就没有规定了，即使只有一个网页也能被称为网站。

而我们想要制作一个网站，就需要单独编辑若干个html文件，然后通过“超链接”把它们连接在一起，这样一个属于自己的网站就制作出来了。总体来说就是网站有网页组成。

2.网站、域名、空间的关系

域名（Domain Name），是由一串用点分隔的名字组成的Internet上某一台计算机或计算机组的名称，用于在数据传输时标识计算机的电子方位网站空间英文名：Webhost。简单地讲，就是存放网站内容的空间，网站空间也称为虚拟主机空间，通常企业做网站都不会自己架服务器，而是选择以虚拟主机空间做为放置网站内容的网站空间。网站空间只能存放网站文件和资料，包括文字、文档、数据库、网站的页面、图片等文件的容量。

所以它们三个的关系是：网站先储存在网络空间中，访问者需要通过IP地址也就是域名来登录这个空间找到网站存放的地址。那么网站就能打开并能够向浏览者展示自己的能容了。

3.网站的制作方式

网站制作通俗的来说就是网站通过页面结构定位，合理布局，图片文字处理，程序设计，数据库设计等一系列工作的总和，也是将网站设计师的图片用HTML 方式展示出来，属于前台工程师的一项任务，前台工程师任务包括：网站设计、网站用户体验、网站JAVA效果、网站制作等工作。网站制作是易雅达网站策划师、网络程序员、网页设计师等岗位，应用各种网络程序开发技术和网页设计技术，为企事业单位、公司或个人在全球互联网上建设站点，并包含域名注册查询和主机托管等服务的总称。

一、申请域名[CN域名须审核];

二、申请空间[通过接入商进行ICP备案];

三、定位网站

四、分析网站功能和需求(网站策划)

五、网站风格设计;

六、网站代码制作;

七、测试网站;

九、网站维护。

网站制作需要网站虚拟空间、域名以及动态网站的数据库这三个最基本的条件。网站虚拟空间是用来存放网站文件，如：图片信息，html文件，php文件等，相当于一个硬盘空间，域名即指访问网站的地址。动态网站的数据库用来存放网站数据的空间，这里的网站数据并非网站的html文件、图像信息等，指的是如网站访客提交的留言，个人信息等，传统的静态网站无需数据库支持。随着浏览器和W3C标准一致性的改善，以及无表格网页设计的认同性增加，超文件标示语言与层叠样式表共同用作网页内容的设计已经被广泛的接受和使用。最新的标准和建议则是朝着浏览器的能力扩充和改善发展，使之能够不需要插件程序也能够给用户传输多媒体信息和更多的选择。

二、所做网页内容

1.女娲网站

女娲首页以深色调为主，显示Lady King(女娲)品牌女式服装的高贵、魅力。

女娲网站主要包括三个网页，一个首页，两个子页。首页内容包括导航栏，女娲动态，新闻资讯，产品图片，等。新品上市子页主以产品图片为主。来客留言主要有呢称，E-mail，联系方式，备注等。

2.休闲食品项目网站食品页面

休闲食品网页以以绿色主色调，辅助色为白色，黑色。总体呈现热情、鲜明、简洁的特征。网站的标准字体:以宋体为主，楷体为辅。网站的宣传标语:休闲生活，自然美味。主要包括一个首页，7个子页。

三、所做网页详解

1.女娲网站所做工作

在photoshop中制作首页，做宽1003px高：85px的导航栏背景，用渐变填充，用图形工具做出LOGO，做中间的背景图，从资料中选取素材，添加新闻动态的几行文字，右边导入资料中的图片进行修正并输入文字。滚动栏部分从资料中选择4个图片进行裁剪放到合适位置，底栏部分填充颜色并添加文字。

2.休闲食品项目网站所做工作

在photoshop中制作首页，首先用图形工具做出LOGO，接着做宽1003px高：85px的导航栏背景，用渐变填充，在用文字工具在导航栏做出7个子页的链接。打开标尺，把首页分成四个不烦并在各个区域内注入预定的内容。最后再尾页写入专利号及相关信息。

四、实训网站制作思路

1.女娲网站思路

女娲网页以深色调为主，显示Lady King(女娲)品牌女式服装的高贵、魅力。字体以宋体为主，楷体为辅，主色调以深红色为主，灰色和黑色为辅。以红色调为主是为了彰显品牌服饰的高贵，大气，简单，富有魅力。

2.休闲食品项目网站思路

休闲食品网页以以绿色主色调，辅助色为白色，黑色。总体呈现热情、鲜明、简洁的特征。以天然绿为主色调，让浏览者重回大自然，绿意盎然，食欲大开。主要起到以大自然为主题，休闲美食，品味生活，让购买者有一种眼前一亮的感觉，视觉和味觉的双重冲击。