课程基于OBE理念，采用工作流程+项目+任务驱动的教学模式，按照基础知识、操作技能、应用提高三个层次组织教学（如图所示）。
考核方式：
成绩评定：评分标准采取百分制单元测验占20%，单元作业占20%，讨论占10%，期末大作业占50%。
具备一定的计算机基础知识和操作能力。
第0单元课程介绍及导学
2：课程导学
1：课程介绍
第1单元Web基础知识
任务4：了解网站建设流程
第1单元测试
任务1：初识网页和网站
任务2：了解Web前端设计技术与工具
第1单元导学
第2单元网站策划
第2单元测试
任务2：布局设计
第2单元作业网站策划
第2单元导学
任务4：页面层次结构及目录设计
任务1：形象设计
任务3：导航及栏目设计
第3单元网站首页文档创建
任务2：理解HTML标记语法
任务3：理解HTML布局-div标记和span标记
第3单元测试
任务1：创建网站首页
任务4：理解HTML5布局标记
第3单元导学
第4单元网站首页内容编辑
任务4：应用表格和表单
任务1：插入文本及列表
任务3：设置超链接和应用框架
第4单元测试
第4单元作业网站内容编辑
任务2：插入图片和媒体
第4单元导学
第5单元网站首页样式创建
任务2：网页应用CSS样式方法
第5单元测试
任务1：理解CSS语法
任务4：理解CSS层叠性和继承性
第5单元导学
任务3：理解CSS选择器
第6单元网站首页样式设计
任务2：CSS背景和列表属性
任务4：CSS3效果应用
任务1：CSS字体和文本属性
任务3：CSS边框和表格属性
第6单元测试
第6单元导学
第7单元网站首页元素定位
第7单元测试
任务4：定位布局
第7单元作业网站样式设计及应用
任务3：浮动布局
第7单元导学
任务2：流布局
任务1：CSS盒子模型
第8单元网站页面制作完善
第8单元导学
第8单元测试
任务4：了解JavaScript应用
任务3：HTML5画布、拖放及地理定位
任务2：移动端页面制作
任务1：二级菜单制作
期末大作业
《Web前端设计基础》课程期末大作业
页面制作完善-视频
主要参考网站：
Q1.为什么网站的首页文件名为index或default？
这是一种网站首页命名规范。在浏览器地址栏输入网址，即使不输入首页名称index，浏览器也能正确找到该文件并正确显示出来，因为Web服务器默认的首页文件名是index。通过设置，Web服务器常用的默认首页文件名有index、default等。
Q2.为什么有时网页图片不可见或超链接页面找不到？
Q3.为什么制作好的网页在不同的计算机上浏览效果不一样呢？
这是因为各计算机的分辨率不同所致，可在计算机桌面单击鼠标右键，从选项菜单中选择“屏幕分辨率“操作来设置分辨率。
Q4.为什么在进行网页制作时建议尽量使用相对路径呢？
绝对路径是指提供文档完整的路径，其中包括使用的协议。而相对路径是指相对于当前文件的路径，使用相对路径可以在整个目录方便地移动内容，且测试方法比较灵活，特别是本机测试时比较方便。
Q5.为什么浏览网页时会出现乱码现象呢？
在编写网页时，如果未指定字符集就可能会出现乱码现象，可以在
区域中添加