2024年2月10日发(作者：)

第45届世界技能大赛网站设计与开发项目

山东省选拔赛技术工作文件

2018年1月

1

目 录

1.

网站设计与开发项目描述 ................................................................ 3

1.1网站设计与开发技术描述 ........................................................ 3

1.2能力要求 ................................................................................... 3

2.

裁判和选手 ....................................................................................... 6

2.1

裁判长的职责 ............................................................................ 6

2.2

裁判员的条件和组成 ................................................................ 6

2.3

选手的条件和要求 .................................................................... 8

3.

选拔赛的题目 ................................................................................... 9

3.1

竞赛项目的模式和结构 ............................................................ 9

3.2

竞赛项目要求 ............................................................................ 9

3.3

配分比例 ................................................................................. 10

4.

选拨赛命题方式 ............................................................................. 10

5. 成绩评判 .......................................................................................... 10

6．软件环境和硬件配置 ...................................................................... 11

7.竞赛流程与规则 ................................................................................ 12

8.封闭赛场 ............................................................................................ 13

2

1. 网站设计与开发项目描述

1.1网站设计与开发技术描述

网站设计与开发项目是指根据项目需求进行站点整体风格与布局的设计，根据设计的页面实现在各种终端上的页面效果、交互效果以及后台相应功能的竞赛项目。

选手需要熟练地进行图形图像处理，设计站点的logo、页面的整体风格与版面布局，并在各版面中应用这些元素，同时还需关注站点的受众群体，让制作的网站更受欢迎；使用HTML5及CSS3按设计稿实现页面，并完成各种交互效果的开发。此外还要处理好代码编写过程中发生的异常。最终的作品同常用浏览器以及软硬件之间的兼容性也是十分重要的，需要妥善处理。

在实际工作中，网页设计者要能理解网页制作的技术和艺术价值。技术的运用是为了帮助网站经营者更好更高效地工作（自动化）。网站的颜色、字体、图形以及布局则需要富有创意的设计技巧。用户界面要确保具有良好的可用性。网站制作者也必须理解项目工作、内容制作和网站管理的基础知识。

1.2能力要求

网站设计与开发竞赛是对上述技能的展示与评估，主要测试各个网站设计与实施技能在操作方面的能力。参赛选手要按照赛题中网站设计与开发的要求展示网站设计的技能。

1.2.1 能力要求细则

1）平面设计

选手必须知道并理解：

 如何创建图形文件、图片并具备审美价值观

 如何根据要求有效使用提供的文字简介进行设计

3

 在设计网站颜色、排版和图像时所需要的创意和技巧

 如何凸显站点的目标受众群体

 如何运用用户中心的设计

 如何为网站创建动画

 如何在网站中嵌入所创建的动画、音频和视频

选手必须能够：

 导入并编辑图像

 为网页优化图像

 使用某种图像处理软件创作图像

 使用某种图像处理软件对图片进行切片

 选用可以增强设计效果的布局版式

 为不同的屏幕分辨率进行设计；对给定的分辨率进行优化并且页面在不同分辨率的设备中良好工作

 为各种自适应的站点页面设计合适的效果

 创建高效、直观、易用的网站导航

 创建的页面布局包含：流式页面、网格页面、页面留白、均衡的文字图像，清晰的层次

2）页面交互

 使用jQuery、bootstrap或其他一些插件实现页面交互及一些动画效果

 不能使用flash创建动画

3） 通过PHP及MYSQL进行服务器端编程

选手必须知道并理解：

 如何进行服务器端编程（PHP）

 如何设计数据库(MySQL)

4

选手必须能够：

 创建、修改服务器端应用程序（如CMS系统、网络数据库）

 使用服务器端组件（如缩略图、ZIP文件和PDF文件）

4）通过开放源码库和框架实现客户端

选手必须知道并理解：

 如何使用开放源码库和框架来编码

选手必须能够：

 通过开放源码和框架创建客户端和服务器端

5）可用性及可及性

选手必须知道并理解：

 如何使用最新的设计技术和编码技术制作遵循行业标准且具有良好持续性、一致性的网站

选手必须能够：

 使用JavaScript、JQuery等工具来实现页面各部分内容

 使用CSS或其他的外部文件来对整个网站样式进行修改

 能在两种不同的浏览器（最新、稳定的版本）上优化页面，获得较好的跨浏览器兼容性

 所创建的网站内容在不同分辨率的屏幕上要保持一致且结构良好

 对于自适应的页面设计能使用合适的样式和脚本代码来实现页面

 所创建网站要符合当前的W3C标准(HTML5.0 CSS3.0)

1.2.2 必须具备的理论知识，但不直接测试

 色彩构成理论

 图片制作、加工、处理的要素

5

 HTML、javascript、JQuery、PHP、MySql、CSS等语言和工具的语法和使用规则

 使用MVC框架结构来对网站服务器端进行编码

 开源代码库及框架的使用

 站点设计和受众分析

 所有需要使用的软件的操作知识

 网站设计与开发的步骤以及每个步骤需要完成的任务

1.2.3必须了解的标准和法规，但不直接测试

 网页的W3C标准

 网站版权法规

2. 裁判和选手

2.1 裁判长的职责

裁判长（由承办院校聘请报省厅审核）在选拔赛中不直接参与评分，主要工作职责是：

1) 制定比赛具体流程和安排，对各裁判组进行工作任务分配。

2) 组织裁判根据自身专业长项进行分组，任命各组的组长，并对分组情况进行合理调剂。

3) 对所有裁判的评分工作进行技术监督。对评判中存在的技术问题提出整改，组织裁判组对于争议情况进行重新评判打分。

4) 对比赛过程中选手的各类突发情况以及场地设备异常情况进行处理。

5) 维护整理选拔赛全程的各类原始资料和文档。

2.2 裁判员的条件和组成

由于世界技能大赛全国选拔赛“网站设计与开发”项目对于选派的裁判员专业能力要求较高，所以根据要求，申报的裁判人员除符合 6

部中心135号文中技术规则文件中对于裁判员的一般条件外，还须符合以下专业要求：

2.2.1裁判员的条件

符合以下条件之一者有资格成为本项目评分裁判员（请在报名表中注明）

1) 曾担任过41、42、43、44届世界技能大赛网站设计与开发（原网站设计）项目专家、技术翻译、教练（以发文名单或证书为准）

2) 曾参与过2012年42届、2014年43届、2016年44届世赛大赛网站设计全国选拔赛评分工作（注明并由竞赛组委会审核认定）

3) 在网站、信息系统开发类企业工作3年以上，具备完整项目开发经验的工程师（提供单位在职证明和详细项目开发履历）

4) 在校从事软件开发、网站设计等相关课程讲授，具有中级以上职称，具备相关3级以上职业资格证书（网页制作员、数据库管理员、计算机程序设计员等）的老师（学校提供在职、职称和授课情况证明）

本次比赛裁判分为平面设计组和程序设计组。

 所有申报平面设计组人员应精通以下专业技术能力（请在报名表中注明）

1) 熟练掌握一种以上设计软件：Photoshop、illustrator、Dreamweaver等；

2) 熟悉视觉设计、对色彩构成有良好理解并具有应用色彩感觉；

 所有申报程序设计组人员应精通以下专业技术能力三项以上（请在报名表中注明）

1） 熟悉W3C标准，擅长html5、css3、javascript等；能处理网

页在不同浏览器下差异；

7

2） 熟悉jQuery框架，并能熟练运用；

3） 熟悉页面响应式设计；

4） 熟悉各类主流编码框架的使用及简单原理如thinkphp，yii，

laravel等；

5） 熟悉PHP面向对象的设计方法，理解MVC，并具有很好的代

码编写能力和良好的代码编程习惯。

注：裁判报到后在赛前培训期间将对其专业能力进行审核，未达以上规定要求的裁判将不得参与任何评分及有关工作。评分裁判需要全程参与、选拔赛现场执裁、主观、客观评分以及监督成绩汇总统计过程等技术工作。

2.2.2裁判员的组成

裁判员将被分为平面设计组和程序设计组，分别负责两个比赛模块的评分，成员由参赛院校申报，每个参赛院校每组裁判限报1人，每组裁判中有1名组长，裁判组组长由外聘专家（由承办院校聘请报省厅审核）担任。组长组织并参与评分，对于评分过程中出现的争议问题组织组内裁判员进行重新评判打分。

2.3 选手的条件和要求

1) 1997年1月1日以后出生的人员。

2) 思想品德优秀，身心健康。

3) 具备扎实的基本功和相应的技能水平，具有较强的学习领悟能力、良好的身体素质、心理素质及应变能力等综合素质。

4) 男、女选手裸眼视力或矫正视力应达到正常标准。无色盲、色弱，无任何影响电脑操作的先天或生理性疾病/缺陷。并能适应长时间、高强度坐姿工作。

5) 选手必须严格遵守考场有关规定，自觉服从裁判长、裁判员、 8

考场工作人员的管理。如有作弊情况，将取消比赛成绩。

3. 选拔赛的题目

3.1 竞赛项目的模式和结构

本项目比赛时间为一天，上午9点开始，16点结束，共计7个小时，所有时间都计算在内。本项目共两个模块，每个模块独立评分，总分为100分。每个模块都基于不同的网页设计技能领域，相对其他模块可独立存在。模块的配套素材，会在比赛开始前发给选手。选手需要遵守组委会安排的时间表，在规定的结束时间前完成作品的存盘，将由工作人员进行作品拷贝并由选手进行最终确认。

当选手完成了平面设计模块，就可以继续完成程序设计模块。将最终的作品保存到如下命名的文件夹中：

 XX_Module_A

文件夹中应包含PSD格式分层文件和JPG格式效果文件

 XX_Module_B

文件夹中应包含所有的源代码文件和数据库文件

上面的‘xx’是你的机器（抽签）号，只有按规定正确保存的文件才会被评分。

3.2 竞赛项目要求

模块A：平面设计

该网站应包含以下元素：

1.前端

1) 主页：包含LOGO设计、导航条设计和Banner设计

2) 用户登录和注册

3) 信息展示区

2.后台

9

每位选手根据给定的半成品素材完善统一风格

模块A的设计稿应该具有原创性，不应和其他选手有相同或者几

乎一致的布局、元素及色调。

模块B：程序设计

选手将A模块设计的页面使用HTML 5、CSS 3来实现排版，符合原设计稿的排版布局和各种设定。此外还需要制作一些前端的交互动态效果，用Javascrip、JQuery完成。

使用php语言实现网站要求的功能，构建MySQL数据库。

选手可以选择使用thinkphp框架（thinkphp框架源文件及开发手册赛前统一发放）或自己编写，实现网站功能即可。

注意：选手在比赛现场将只能查看赛题文档，不被提供评分表！

3.3 配分比例

各模块分值分布（主观和客观），满分为100分。

模块

模块A

模块B

平面设计

程序设计

总分

评分标准

分数

主观分

10

10

20

客观分

25

55

80

合计

35

65

100

4. 选拨赛命题方式

本次选拨赛使用闭卷形式进行。所命题内容参考44届世界技能大赛全国选拨赛的技术要求。

5. 成绩评判

本部分主要说明裁判对竞赛项目、模块评分的方法，同时明确评分细则框架和评分要求。

采用综合评价（裁决）方式。所有裁判各自单独评分，A模块总分分差不能大于等于5分，B模块总分分差不能大于等于10分，否 10

则，需要给出确切理由并在小组长或裁判长的监督下进行重新评判打分。

6．软件环境和硬件配置

软件环境

操作系统

WIN 7 Prof 64bit

AdobePhotoshopCC2017

开发工具

AdobeDreamweaverCC2017

XAMPP 3.2.2

Firefox 33.1以上版本

浏览器 Chrome 39.0 以上版本

Internet Explorer 11 (64bit)

浏览器

JRE 7

插件

MS Office Prof Version 2010

HBuilder 8.9/Edit plus 3.6 / Notepad++ 6.5 / Net beans

for PHP 8.0

辅助软件

Filezilla Client 3.6 以上版本

win RAR

jdk 7 （供Net beans等软件安装使用）

Thinkphp3.2.3框架

代码库

jquery-2.1.1

11

硬件配置（不低于此配置）

CPU

内存

硬盘

显卡

显示器

键盘鼠标

Intel酷睿i5

8G DDR3 1600MHz

独立分区，选手可用的临时文件容量8G以上

核心集成显卡 1G显存

19" 宽屏LCD *2 1920*1080

3键有线光电鼠标、标准美式键盘

在比赛开始前，选手们将得到一切必需的素材。选手有责任检查所提供的材料是否完整可用并签字确认。

7.竞赛流程与规则

1）早上8：00，赛前1小时，由竞赛现场裁判长组织参赛选手抽签，并由各参赛选手对抽签结果签字确认。

2）赛前20分钟，参赛选手必须持本人身份证、学生证并携（佩）带参赛证进入与抽签号对应的工位进行竞赛前的各项准备工作。竞赛裁判员负责对各参赛选手的身份检查。

3）参赛选手应严格遵守赛场纪律，操作技能竞赛除携带竞赛必备的用具外，不得带入任何技术资料和工具书。所有通讯工具、摄像工具及其它包含存储器的设备一律不得带入竞赛现场。进入赛场前，签署诚信保证书，并将手机、U盘等考场违禁设备放到指定地点。

4）选手在竞赛过程中不得擅自离开赛场，如有特殊情况，需经裁判长同意后作特殊处理。竞赛过程中，选手若需休息、饮水、午餐或去洗手间（监考人员陪同），一律计算在比赛时间内。

5）上午9：00比赛正式开始，中午12：00为午餐时间（午餐由监考人员送入考场），16：00比赛结束。

12

6）参赛选手在竞赛过程中，如遇问题需举手向监考人员提问，选手之间不得互相询问，否则按作弊处理。

7）比赛开始2小时后选手可以提交作品离场，如果选手提前结束竞赛，应举手向监考人员示意。竞赛终止时间由监考人员记录在案，选手提前结束比赛后不得再进行任何加工并立即离开赛场。

8）选手提交作品时应按要求保存文件，并请监考人员到工位处确认。同时，参赛选手在监考人员记录的竞赛情况记录表上签字确认。

9）竞赛结束前30分钟，监考人员提醒选手注意时间。考试结束后，由参赛选手进行工位的清理工作。经监考人员检查许可后，参赛选手方可离开竞赛场地。

10）各参赛选手必须严格遵守考场纪律，如出现较严重的违纪情况，将立即取消竞赛资格。

8.封闭赛场

1) 比赛期间，为不影响选手比赛，赛场只允许选手和监考人员进入，如遇特殊情况，裁判长方可进入 。

2) 比赛承办方积极做好竞赛的宣传工作。

13