《网页设计与制作》课程涉及网页基础、HTML标记、CSS样式、网页布局等内容。通过本课程的学习,学生能够了解HTML、CSS及JavaScript语言的发展历史及未来方向,熟悉网页制作流程、掌握常见的网页布局效果、学会制作各种企业、门户、电商类网站。学生根据实际需要自行设计网页,建立网站。最终设计制作一个具有实用意义的漂亮网站,并上传到学习用的服务器(或互联网)上。
前端工程师是互联网时代软件产品研发中不可缺少的一种专业研发角色。从狭义上讲,前端工程师使用HTML、CSS、JavaScript等专业技能和工具将产品UI设计稿实现成网站产品,涵盖用户PC端、移动端网页,处理视觉和交互问题。从广义上来讲,所有用户终端产品与视觉和交互有关的部分,都是前端工程师的专业领域。
一、明确网页设计需要学些什么
软件技能、创意表达、视觉刻画,这是网页设计师“的核心技能。网页设计是生产运营中的一个技术支撑环节,其最终的作品输出都是为企业或商业产品服务的。学会理解你的服务对象,将企业的文化价值、产品的功能属性准确传递给潜在客户,这就是网页设计的阶段性目的,也是一名好的网页设计师需要学会的东西。
二、网页设计师的工作日常
1.信息的收集整理(前期调研阶段、竞品分析、受众分析)
2.信息的归纳提炼(策划设计阶段)
把收集来的信息加以提炼,归纳整理出适合自己的网页设计的有用信息,以此来把握整体的网页设计风格及大的方向。
3.信息的视觉化表现(软件制作及执行传播阶段)
信息的视觉化表现也就是,在Photoshop软件中完成排版布局、页面的icon设计、图片的合成处理等,以及推广banner海报的设计,然后切图交接给web前端开发。
三、网页设计的常见类型
目前,关于网页设计的常见类型及方向有:淘宝天猫类型的电商视觉设计、企业官网的设计、新品宣传、活动专题类型的网页设计、后台管控类的网页端UI设计。在日常的工作中这几种也许你都会接触到。在学习之初你还得从软件技能、排版布局、图像处理、切图输出等这些具体的点着手熟悉。
信息技术基础和图形图像处理知识
项目一:网页制作基础知识-------“技能成才,强国有我”页面制作
实战演练-----制作“技能成才,强国有我”页面
任务1.3:我的第一个网页
项目一测试题
项目一作业题
项目二:HTML语言-------"类脑计算机智能技术系统"页面制作
任务2.1:HTML图像标记
任务2.3:“咸阳职院”专题页制作
任务2.4:网页布局
实战演练-----制作“类脑计算机智能技术系统”页面
项目二作业题
项目二测试题
项目三:CSS样式-------“走进陕西,体味非遗文化”页面制作
任务3.1:CSS基础选择器
任务3.2:CSS字体样式属性
任务3.3:CSS文本外观属性
任务3.4:CSS复合选择器
任务3.5:CSS新增选择器
实战演练-----制作“走进陕西,体味非遗文化”页面
项目三测试题
项目三作业题
项目四:DIV模型-------“致敬逆行者”页面制作
实战演练-----制作“致敬逆行者”页面
任务4.1:盒子模型
任务4.2:边框属性
任务4.3:内外边距属性
任务4.4:背景属性
任务4.5:盒子的宽与高
任务4.6:元素类型
任务4.7:标记
任务4.8:元素转换
任务4.9:浮动float
任务4.10:元素定位
任务4.11:Z-index
任务4.12:《我和我的祖国》首页
项目四测试题
项目四作业题
项目五:常用标记-------“时代楷模大国工匠”页面制作
任务5.1:列表标记
任务5.2:控制列表样式
任务5.3:超链接标记
任务5.4:锚点链接标记
任务5.5:伪类控制超链接
任务5.6:“穿搭速递”首页制作
实战演练-----制作“时代楷模大国工匠”页面
项目五测试题
项目五作业题
项目六:表单-------“公益爱心志愿者协会”会员注册页面制作