第7课　网页结构设计　课件　2023—2024学年江西科教版（2022）初中信息技术七年级上册

网页结构设计 网页规划和设计 2 　学习内容： 一、学会需求分析确定网站主题 二、学会设计网站的页面结构 三、学会设计网页布局 四、素材准备 网页规划和设计 3 网站欣赏之门户网站 新浪网 网页规划和设计 门户网站 主页内容很丰富，色彩鲜艳并有许多大幅广告和浮动广告栏，面向对象很广泛。 4 网页规划和设计 百度网 网站欣赏之搜索网站 5 网页规划和设计 6 搜索网站 　　内容简单明了，可以根据关键字，提供用户想要的相关信息，服务对象也很广泛。 网页规划和设计 联想官网 网站欣赏之公司网站 7 网页规划和设计 8 公司网站 内容比较专一，内容非常有条理、栏目突出，没有凌乱的感觉。 面向的对象为：公司产品的使用者。 网页规划和设计 个人主页 网站欣赏之个人主页 9 网页规划和设计 看起来更简单，内容也不够丰富，但感觉非常清晰。 个人主页 10 网页规划和设计 1 :确定网站的名称 2 :确定面向的对象 3 :确定将在网站中表达的内容 4 :选择要使用的素材 一、需求分析确定网站主题： 11 网页规划和设计 小组讨论完成下表： 12 讨论内容 讨论结果 网站的名称是什么？ 在网站中表达什么内容？ 可能用到哪些素材？ 网页规划和设计 二、设计网站结构之一级页面 13 网页规划和设计 设计网站结构之二级页面 14 网页规划和设计 设计网站结构之三级页面 15 网页规划和设计 一级页面：莲塘一中(首页） 二级页面：一中新闻、一中概况、校务公开、教学沙龙、德育天地、园丁风采、学科资源、党政建设、校庆专栏、校长专栏。 莲塘一中网站的页面结构 16 网页规划和设计 莲塘一中网站的页面结构 三级页面（一中新闻包含的）学校快讯、校园视频、校园广角、青荷基金、国际教育。 17 网页规划和设计 一级页面 ↓ 二 级 页 面 ↓ 三级页面 莲塘一中网站的页面结构表 18 莲塘一中(首页） 一中新闻 一中概况 校务公开 教学沙龙 德育天地 园丁风采 学科资源 党政建设 校庆专栏 校长专栏 学校快讯 校园视频 校园广角 青荷基金 国际教育 网页规划和设计 讨论：此网站的页面结构完成表格 19 网页规划和设计 19 一级页面 ↓ 二 级 页 面 ↓ 三级页面 县科体局网页的页面结构表 20 网页规划和设计 一级页面 ↓ 二 级 页 面 ↓ 三级页面 县科体局网页的页面结构表（答案） 21 网站首页 概况信息 新闻中心 政务公开 教育教研 教育技术 师资培训 招生考试 群众体育 科技长廊 专题聚焦 素养视窗 学科天地 一句话新闻 图片新闻 视频新闻 其他新闻 重要新闻 网页规划和设计 一级页面 ↓ 二 级 页 面 ↓ 三级页面 小组讨论：怎样设计网页的页面结构表 22 网页规划和设计 页面中标题、栏目、文字、图片等摆放位置的过程，就是页面布局的设计过程。根据摆放位置的不同，页面布局的类型也不相同。 页面布局 23 网页规划和设计 1：上中下型 2：左右框架型 3：上下框架型 4：标题正文型等 三、网站页面布局基本类型： 24 网页规划和设计 观察莲塘一中一级页面、二级页面、三级页面、四级页面，分析相应的页面布局。 网站页面布局分析： 25 网页规划和设计 莲塘一中一级页面（首页）的布局是上中下型中又应用左右