自考13167网页设计与制作考试大纲（2025年版）

湖南 省高 等教 育自 学考 试课 程考 试大 纲网页设计与制作 （课程代码：13167） 湖南省教育考试院组编 2025 年 6 月高等教育自学考试课程考试大纲课程名称：网页设计与制作课程代码：13167

第一部分

课程性质与目标

一、课程性质与特点

网页设计与制作是高等教育自学考试电子商务专业的必考课程。本课程主要讲述电子商务网站设计的原理和技术。从整体设计的角度探究电子商务网站的站点管理，首页设计，布局设计，交互特效设计等合理搭配，解决电子商务网站设计中的问题。本课程的技术性、应用性、综合性很强，是一门涉及网络技术基础、网站布局，图像设计、网站管理等知识的综合性课程。课程本身要求有一定的实践动手能力。

二、课程目标与基本

要求通过本课程的学习，考生将具备了解用户需求、确定网站建设的目标、主要内容和网站建设的基本能力，掌握获取企业网站需求的主要渠道，根据主流的设计技术，对网站建设、域名和服务器资源进行规划的技术、熟练掌握网站版面布局、网站设计开发、网站测试推广等方面知识。通过相关实践，考生将掌握如何根据企业需求进行网站的规划、建设和管理，从而为将来的工作奠定坚实的基础。基本要求：

1. 了解网站建设的需求获取，并能根据需求，确定网站的建设目标。

2. 掌握网站建设的基本流程和相关技术。

3. 能够熟练掌握网站的版面布局、各种页面的设计和开放、网站的具体测试过程和改进方法。

三、与本专业其他课程的关系网页设计与制作作为电子商务专业的一门重要基础课程，前期先修互联网数据库程序设计、计算机网络原理等课程。

第二部分考核内容与考核目标

第一章 赏析电子商务网站页面

通过本章的学习，掌握电商企业网站的主要结构，能够对企业电商网站进行合理的结构规划，如选择合理的布局结构，色彩样式等。本章的难点为：掌握竞品分析的主要内容，并能对竞品进行有效地分析。

（一）分析典型电商企业网站的结构（重点）识记：1.获取企业网站的需求主要渠道

2.电商企业网站的布局方式的分类理解：1.如何确定网站的主题和功能目标

2.掌握竞品分析的主要内容应用：1.基于栅格化设计原理的网页布局

2.网页中的基本元素的应用

3.网页版面布局类型及应用场景

4.电商企业网站的色彩应用（二）赏析典型电商网站（次重点）识记：1.WWW 的定义

2.网页和网站的定义理解：1.构成网页的基本元素的作用

2.各种网页布局的特点及应用场景

3.网页版面布局类型及各种类型的特点

第二章 运用

HTML5 制作招生宣传单页通过本章的学习，掌握 HTML5 的语法规范，编写简单的网页文件。能熟练地修改和调试 HTML5 代码。本章的难点为：根据要求调试 HTML5 代码，实现预期的网页显示效果。

（一）通过 HTML5 制作学院招生的基础文本单页（重点）识记：1.页面的基本结构

2.HTML 基本语法

3.HTML5 的语法理解：1.HTML 的特殊符号

2.文本格式化标签

3.移动端设备的 HTML 基本结构应用：1.HTML5 新增的结构标签

2.HTML 块级元素与内联元素（二）HTML5 制作学院招生的图文单页（重点）识记：网页常用图像格式的种类理解：1.表格标签

2.跨多行、多列的单元格

3.设置图像属性

应用：1.嵌套表格的作用

2.HTML5 视频

3.HTML5 音频

4.图像标签的应用

（三）HTML5 制作学院招生的详细咨询页（一般）识记：1.超链接的定义

2.添加背景图片

理解：1.使用 input 标签创建表单控件

2.正则表达式

3.背景设置的意义

第三章 搭建电子商务网店页面

通过本章的学习，考生能依据项目要求，完成网店各构成模块的设计与制作。

主要包括对商品图片进行处理以适应电子商务网店，对图片进行色调色泽的美化调整，抽取合适的图像素材修饰网店模块等任务。

（一）处理修饰商品图片（重点）识记：1.图层与像素的基本概念

2.色阶的概念

理解：1.自由变换

2.约束比例的作用

3.图像大小与画布大小的区别

4.分辨率的大小与图像加载速度的关系应用：1.背景色橡皮擦的使用

2.魔术橡皮擦的使用

3.色相和饱和度的应用（二）制作网店优惠券（一般）识记：1.文本工具中的抗锯齿和变形效果

2.文字“栅格化”的概念（三）制作网店店招（次重点）识记：店招的分类和组成元素理解：1.形状工具中的形状、路径和像素的区别

2.渐变工具及类型

3.字符面板中的行间距、比例间距、字符间距和竖向偏移的应用（四）制作网店的促销海报（重点）识记：网店促销海报的分类理解：1.图层样式的定义及类型

2.画笔工具的应用场景

3.仿制图章的概念及作用应用：1.工具箱中的修复工具及应用

2.颜色替换工具的应用

3.滤镜中的液化滤镜的应用

第四章 创建电子商务网店中的动态图像

通过本章的学习，掌握如何根据项目要求设计和制作用于网店不同位置的 GIF 动态图片。本章的难点内容为：Photoshop 中的逐帧动画的制作。

（一）创建网店推广动态图像（重点）识记：1.动画的概念

2.“传播帧 1”的概念理解：1.熟悉时间轴创建帧动画的基本类型和使用场景

2.熟悉如何优化动画帧中的要素应用：1.掌握统一图层属性的应用

2.文字图层的变化和应用（二）创建促销区域动画（重点）识记：1.过渡动画帧的作用

2.导出图像序列的概念理解：1.掌握过渡动画帧的局限性，在实际制作中尽量避免

2.掌握优化动画帧中的外框和去除多余像素的作用

3.时间轴动画

应用：1.创建视频时间轴动画的基本流程和主要操作

2.制作运动模糊动画

第五章 创建与管理网站站点

通过本章的学习，掌握依据网站规划进行网站的总体设计、创建与管理的过程， 尤其掌握如何规划网站栏目和设置文件目录、创建本地站点和管理站点文件。本章的难点内容为：根据要求调试 HTML5 代码，实现预期的网页显示效果。

（一）网站文件目录的创建（重点）识记：1.网站规划的概念

2.网站链接结构的概念和类型

3.网站目录的概念

理解：1.网站栏目设置主要考虑的因素

2.网站目录结构优化的要点应用：1.网站地图的作用

2.网络型网站结构的应用（二）创建与管理网站的站点（重点）识记：1.Dreamweaver 的概念

2.使用 Dreamweaver 创建网站的基本流程

3.Git 的基本概念理解：1.理解 Dreamweaver 文档窗口视图的三种基本模式及作用

2.掌握一般网站文件目录结构

3.站点管理的主要内容

第六章 设计与制作中小企业网站首页面

通过本章的学习，掌握依据网站主题进行网站制作的标准流程，并能根据要求对页面进行设计和制作，尤其是掌握利用 Photoshop 软件完成页面效果图的切片与导出，利用 Dreamweaver 软件完成页面的具体制作。本章的难点为：如何根据网页效果图，利用 Dreamweaver 实现页面的具体制作。

（一）首页效果图切片处理及导出（重点）识记：切片的概念和作用理解：1.切片时的注意事项

2.DreamWeaver 中网页元素属性面板中主要属性的作用应用：1.掌握切片工具的使用

2.掌握切片选择工具的使用

3.DreamWeaver 的基本操作（二）公司形象网站首页的设计与制作（次重点）识记：表格的基本属性理解：1.表格的常规操作

2.掌握表格属性面板的相关属性设置应用：1.如何合理地设置单元格、行和列的属性

2.表格布局的作用

第七章 DIV+CSS 布局设置通过本章的学习，考生能够根据前期的网站策划及效果图完成整个网站的 DIV+CSS 布局，解决 DIV+CSS 的浏览器兼容问题和使用“模板和库”进行网页布局。本章的难点为：如何灵活运用 DIV+CSS 的布局思路和方法。

（一）创业园网站首页的制作（重点）识记：1.Web 标准

2.DIV 的基本概念

3.CSS 的语法规则理解：1.掌握 DIV+CSS 与传统表格布局的区别

2.盒子模型

应用：1.熟练掌握 CSS 与 HTML 的结合

2.掌握类别选择器、标记选择器和 ID 选择器的应用（二）创业园网站子页面的制作（次重点）识记：模板的概念理解：1.Float 属性的设置与页面布局的效果

2.利用模板创建网页的基本过程

3.DIV 与 SPAN 的基本区别应用：“库”元素在网页中的应用

第八章 设计与制作网页的交互特效

通过本章的学习，考生能够根据具体项目的要求完成页面的各种特效制作，如能利用 CSS 实现图片的放大特效，利用 CSS 和 JavaScript 实现广告图片的自动轮换特效。本章的难点为：利用 JavaScript 实现浮动广告特效。

（一）图片放大特效的制作（重点）识记：1.CSS 控制图片的基本概念和原理

2.文字跟随鼠标效果的原理理解：1.掌握控制图片的主要参数如页边距、填充、边框大小和图片定位等

2.掌握 JavaScript 获取鼠标位置，并根据鼠标位置重新设置文字位置，文字位置通过 CSS 属性中的 position 绝对定位来确定

3.JavaScript 动态调整文字位置的原理应用：熟练掌握创建样式文件实现图片放大特效的操作过程（二）广告图片自动轮换的制作（次重点）识记：1.广告图片自动轮换的概念

2.脚本语言的概念

3.CSS 中 revealtrans 滤镜的语法基本格式理解：1.自定义 JavaScript 函数的使用

2.掌握 JavaScript 格式应用：1.熟练掌握 JavaScript 基本语句代码

2.熟练掌握 revealtrans 滤镜中 translation 的参数值对应的效果，并能应用于网页设计中（三）浮动广告的制作（次重点）识记：图片浮动函数的基本作用理解：1.createElement(）函数的使用

2.appendChild(）函数的使用应用：获取当前页面滚动条的纵坐标位置，实现两侧广告随滚动条移动而改

第三部分

有关说明与实施要求

一、考核的能力层次表述

本大纲在考核目标中，按照“识记”“理解”“应用”三个能力层次规定其应达到的能力层次要求。各能力层次为递进等级关系，后者必须建立在前者的基础上， 其含义是：识记：能知道有关的名词、概念、知识的含义，并能正确认识和表述，是低层次的要求。

理解：在识记的基础上，能全面把握基本概念、基本原理、基本方法，能掌握有关概念、原理、方法的区别与联系，是较高层次的要求。

应用：在理解的基础上，能运用基本概念、基本原理、基本方法联系学过的多个知识点分析和解决有关的理论问题和实际问题，是最高层次的要求。

二、教材

指定教材：《电子商务网页设计与制作》，商玮、傅俊，中国人民大学出版社， 2020 年版

三、

自学方法指导

1．在开始阅读指定教材某一章之前，先翻阅大纲中有关这一章的考核知识点及对知识点的能力层次要求和考核目标，以便在阅读教材时做到心中有数，有的放矢。

2．阅读教材时，要逐段细读，逐句推敲，集中精力，吃透每一个知识点，对基本概念必须深刻理解，对基本理论必须彻底弄清，对基本方法必须牢固掌握。

3．在自学过程中，既要思考问题，也要做好阅读笔记，把教材中的基本概念、原理、方法等加以整理，这可从中加深对问题的认知、理解和记忆，以利于突出重点，并涵盖整个内容，可以不断提高自学能力。

4．完成书后作业和适当的辅导练习是理解、消化和巩固所学知识，培养分析问题、解决问题及提高能力的重要环节，在做练习之前，应认真阅读教材，按考核目标所要求的不同层次，掌握教材内容，在练习过程中对所学知识进行合理的回顾与发挥，注重理论联系实际和具体问题具体分析，解题时应注意培养逻辑性，针对问题围绕相关知识点进行层次（步骤）分明的论述或推导，明确各层次（步骤）间的逻辑关系。

四、对社会助学的要求

1．应熟知考试大纲对课程提出的总要求和各章的知识点。

2．应掌握各知识点要求达到的能力层次，并深刻理解对各知识点的考核目标。

3．辅导时，应以考试大纲为依据，指定的教材为基础，不要随意增删内容，以免与大纲脱节。

4．辅导时，应对学习方法进行指导，宜提倡“认真阅读教材，刻苦钻研教材，主动争取帮助，依靠自己学通”的方法。

5．辅导时，要注意突出重点，对考生提出的问题，不要有问即答，要积极启发引导。

6．注意对考生能力的培养，特别是自学能力的培养，要引导考生逐步学会独立学习，在自学过程中善于提出问题，分析问题，作出判断，解决问题。

7．要使考生了解试题的难易与能力层次高低两者不完全是一回事，在各个能力层次中会存在着不同难度的试题。

8．助学学时：本课程共 4 学分，建议总课时 72 学时，其中助学课时分配如下：

章次章节名称学时

第一章

赏析电子商务网站页面

第二章

用 HTML5 制作招生宣传单页

第三章

搭建电子商务网店页面

第四章

创建电子商务网店中的动态图像

第五章

创建与管理网站站点

第六章

设计与制作中小企业网站首页面

第七章

DIV+CSS 布局设置

第八章

设计与制作网页的交互特效合计

五、关于命题考试的若干规定

1．本大纲各章所提到的内容和考核目标都是考试内容。试题覆盖到章，适当突出重点。

2．试卷中对不同能力层次的试题比例大致是：“识记”为 30%、“理解”为 40%、“应用”为 30%。

3．试题难易程度应合理：容易、中等、难比例为 3:4:3。

4．每份试卷中，各类考核点所占比例约为：重点占 60%，次重点占 30%，一般占 10%。

5．试题类型一般分为：单项选择题、填空题、名词解释题、简答题、综合题。

6．考试采用闭卷笔试，考试时间 150 分钟，采用百分制评分，60 分合格。

六、题型示例（样题）

一、单项选择题

（本大题共 20 小题，每小题 1 分，共 20 分）在每小题列出的四个备选项中只有一个是符合题目要求的，请将其选出并将“答题卡”上的相应字母涂黑。错涂、多涂或未涂均无分。

1．如果要在表单中采集用户密码，则 input 标签对应的 type 应该使用A．text B．radio C．password D．number

二、填空题

（本大题共 5 小题，每小题 1 分，共 5 分）

21．移动设备无法将普通网页全屏显示在设备屏幕上，为了适配移动设备的全屏显示，需要在<head>中添加的元数据标签是______。

三、名词解释题

（本大题共 5 小题，每小题 3 分，共 15 分）

26．WWW

四、简答题

（本大题共 5 小题，每小题 6 分，共 30 分）

31．简述 HTML5 自带的两种表单验证方式。

五、综合题

（本大题共 2 小题，每小题 15 分，共 30 分）

36．请设计如题 36 图所示的商品购买意见调查的网页，部分代码如下，请根据网页效果图，将代码中的（1）~（10）空补充完整。

题 36 图实现网页的部分代码如下：

<h1>（1）</h1> <form action=”/submit_survey” method=”post”> <label for=”name”>姓名：</label> <input type=”（2）” id=”name” name=”name” required> <label for=”email”>电子邮箱：</label> <input type=”email” id=”email” name=”email” （3）> <label for=”product”>您购买的商品名称：</label> <input type=”（4）” id=”product” name=”product” required>

<label>（5):</label> <div class=”rating”> <label><input type=”radio” name=”satisfaction” value=”5″ required>（6）</label> <label><input type=”radio” name=”satisfaction” value=”4″>满意</label> <label><input type=”radio” name=”satisfaction” value=”（7）”>一般</label> <label><input type=”radio” name=”satisfaction” value=”2″>不满意</label> <label><input type=”radio” name=”satisfaction” value=”1″>非常不满意</label> <label for=”quality”>您对商品质量的评价：</label> <select id=”quality” name=”quality” required> <option value=””>（8）</option> <option value=”excellent”>非常好</option> <option value=”good”>好</option> <option value=”average”>一般</option> <option value=”poor”>差</option> </select> <label for=”price”>您认为商品价格：</label> <select id=”price” name=”price” required> <option value=””>请选择</option> <option value=”very_expensive”>非常贵</option> <option value=”expensive”>有点贵</option> <option value=”reasonable”>合理</option> <option value=”cheap”>便宜</option> </select> <label for=”suggestions”>您的改进建议：</label> <textarea id=”suggestions” name=”suggestions”></textarea> <label><input type=”（9）” name=”contact” value=”yes”>我愿意接受后续回访 </label> <button type=”（10）” class=”submit-btn”>提交问卷</button>