师：同学们，今天我们学习粤教粤科版九年级下册第6课个性化网页设计。本课学习目标有两个，一是了解网页的构成与形式、美感特征；二是体验网页设计制作的方法与过程。同学们，你们习惯通过什么渠道了解时事新闻？比如2022年北京冬奥会与冬残奥会的资讯，你们是从哪里了解到的呢？看电视、听广播、读报纸，还是上网社交平台？老师会在2022年冬奥会与冬残奥会的官网上面观看开闭幕式直播，了解比赛信息，欣赏比赛精彩照片。在网页上我们可以获取丰富的时事新闻。那么同学们，你们是什么时候开始上网冲浪的？请边观看视频边思考网页与我们日常生活的联系。
网络对人们的工作生活有着举足轻重的影响，随着网络迅速发展，人们能够及时共享数据、更新数据。中国互联网信息中心在京发布第39次中国互联网络发展状况统计报告，截至2016年12月，中国网民规模已达7.31亿，相当于欧洲人口总量。网民中使用手机上网人群占比95.1%，比2015年提升了5%。
大家还记得自己第一次接触互联网的场景吗？几十年过去，从几KB到几百兆，从互联网专线到移动互联，从电子邮件到人工智能，互联网发展浪潮波澜壮阔。社交、支付、娱乐、教育、医疗，我们生活的方方面面都发生了翻天覆地的变化，而且这种变化并未停止。就在昨天下午，第六届世界互联网大会还发布了15项世界互联网领先科技成果，这些成果还将继续改变世界，改变生活。
如今，社交网站吸引了全球数量庞大的网络用户，同时越来越多的平台类网站出现，一个全人类参与、全人类分享的网络生态环境逐渐形成。人们现在的生活与互联网水乳交融、密不可分，可以说互联网推动了生活生产方式的进步，而生活生产方式的进步又对互联网提出了新要求。
网页就是这个大时代最重要的缩影，相关技术设计伴随着信息共享，推动着整个时代向前发展。我们今天就来了解和体会互联网网页设计的智慧之美。什么是网页设计呢？网页设计是根据网站需求，以图形化规则编排网页要素。网页设计涉及艺术与技术两方面知识。在网页设计行业里，艺术类设计称为UI，技术类设计称为UX。UI控制着网页的外观，是图文、色彩和排版等视觉化设计，网页是否吸睛由它决定。UX控制着用户的体验感受，是交互、动态等体验的设计，决定了我们使用时是否顺畅舒适。
我们这节课主要认识UI设计方面的知识。首先要知道一个网页由哪些要素构成，网页的最小构成单位称为网页的构成要素。对照课本19页，分辨以下网页的六大构成要素有哪些。这是中华慈善总会首页，它由六大构成要素组成：网页名称、背景、标题、文字、图表、图形、动画、视频。同学们挑战一下，来指出这个网页中的六大构成要素分别是什么？
生：网页名称、背景、标题、文字、图表、图形、动画、视频。
师：网页要素繁多，怎样布局才富有美感呢？为方便人们查找阅读，设计师会利用网格设计法把网页要素进行分区布局。网格设计法有什么好处呢？网格就像我们练字时使用的田字格规划字体结构一样，利用网格规划网页要素，强调视觉上的秩序感，以平衡且有组织的美感形式呈现内容，这是网页设计最常见的方法。在网页设计规范里，最基础的网格把网页规划为几个大的构成部件，分别是标题栏、导航栏、首栏、正文栏、底部信息栏和操作按钮。
利用网格分区，我们可以把网页界面从上到下垂直分区，称为单列布局，简单明了是它的美感特点，适用于一些内容少的网站。如果把单列布局的正文栏分为左右两个区域，称为双列布局。双列布局可以是左右对称，也可以是左右面积不等，可以一边图一边文，也可以是对称的图文结合，双列布局给人带来稳定大方的审美感受。
如果把正文栏分为左、中、右三个区域，称为三列布局，适合用于大型综合网站，如一些新闻网站、购物网站或办事平台都会使用这种布局方式。当然，在实际网页设计过程中，设计师会根据客户需求，综合运用上述几种布局方法，力求网页构成达到独特的个性化效果和便利的浏览体验感。可见，网页的构成要素、构成部件和布局形式是常见的网页设计规则，是重要的网页设计基础。通过一系列网页设计规范学习，相信同学们对网页设计有了基本认识。好的网页设计要运用怎样的美术形式呢？请同学们进行下一环节探索：网页的设计风格。请说这些网页是以什么构成元素为主？
生：这个网页是以图片为主的。
师：一些与艺术有关的网站常以图片为主的设计风格，营造强烈的视觉冲击力，让人眼前一亮。请说这个网页是以什么构成要素为主？
生：这个网页是以文字为主的。
师：很棒。以文字为主的网页能够传达更多实际资讯，也有利用字体创意设计来装饰网页的范例。这个网页是以什么构成要素为主？
生：图文并茂的设计风格符合大多数网站的需求，但要注意图文编排规律，毫无规律会使界面杂乱。
师：这个网页又是以什么构成要素为主的？
生：这个网页突出了色块。
师：突出色块的设计风格，利用了色彩的冲击力，第一时间抓住眼球，让人产生年轻活力的视觉感受。讲到色彩，网页设计常用的色彩策略有哪些？我们回想一下，日常浏览的网页，怎样的网页色彩让您印象深刻？这是一个精美的单页网页，带有统一青绿色调子的插画，既显示了网页园艺的主题，也提供了美观的色彩氛围。它运用的色彩策略是统一了主色调。网页设计还有哪些色彩策略？这是一个年轻时尚的独立设计工作室的网站，它的色彩策略是运用炫彩的背景色衬托图文内容。
网页中的图片该怎么挑选？这是一个家居网站，它选取的家居环境图片都是米黄色调，温馨舒适的色调是图片色调统一的典型范例。而对于像人民日报、海外网这样以文字为主的综合性新闻网站，通常会利用按钮的色彩点缀页面，在规范正式的风格中透出一点活泼的美。
最后请同学们思考这些网页运用了哪些典型形式美？比如说构图形式美方面，这个页面运用了哪种构图形式？