项目评分标准
项目作品提交须知
最终的作品，为便于教师测评，也是方便用户访问，请务必做到如下：
- 提供明显的入口链接提示，或者单独做一个站点说明或使用指南的页面，附上各功能的入口
- 涉及表单功能的页面，请预置缺省值或相关数据，如新增内容中各字段的缺省值，如用户账户名和密码（不要让用户再次注册）
- 代码必须托管于gitte之上，并推荐部署在github pages 或类似静态站点空间中（务必在网站首页提供相关链接）。
总体评分原则
- 以实现一个单机版本（本地化持久存储）、支持动态增删改的单页应用为目标。
- 功能的完成项、技术难度系数、代码质量（模块化程度、是否符合前端规范等）
分值比例
- html相关: 30%
- css相关: 30%
- javascript: 40%
以下是具体评分项目，每项一般为5分
网站基本结构
- 常见的页面类型齐全，即：首页、列表页、详细页、表单页、站点使用指南页面
- url及项目文件布局合理有规律，符合主流约定，参考 http://books.openxy.com/web_front/blog/%E5%B8%83%E5%B1%80.html 或 vue项目等文件布局及文件命名等
- 文件名命名遵行一定的规则，如：index.html、 show.html、new.html、edit.html、form.html等
- css、js等基本为外联文件，且归类放置在各目录下,如 /css，/js等
- 图片等附件文件有统一的格式，譬如png或jpg，且放置在统一的目录下，如/img等
基本语义结构
合理使用语义标记刻画文档结构，以markdown所支持的标记为基本子集，如：
- 基本文档标记
<h1-h6>、<p>、<em>1分 - 二维类标记
<ul>、<table>等 2分 - 需要转义处理的相关标记
<pre>、<code>1分 - 容器类标记
<div>、<span>、<article>、<section>、<header>、<main>、<footer>、<section>、<aside>、<nav>1分 - 元标记:
<title>、<meta>1分
多媒体
- 正确表达和处理各类多媒体资源，如图片、音频、视频等
- 音视频等请注意gitee等对二进制文件的尺寸限制，尽量使用使用外链或限制文件尺寸
- 基本属性2分，可访问性1分、动态控制或特效2分
表单控件
至少包含五类控件，如单行文本、多行文本、单选、多选、下拉列表等，各1分
基本排版
基本的版面效果适合阅读，重点如下
- 字体声明：安全字体（fallback机制） 1分
- 字体单位的合理使用：em、rem等 1分
- 基于normalize.css的基本样式扩展 3分
定位
使用绝对定位、固定定位、相对定位等任一方式实现前端特效，如菜单、悬浮窗等等不限，以实现的技巧性或复杂度为标准
布局
- 基本的三行两列布局
- 使用flex、float等布局技术
响应式设计
站点对不同设备或尺寸的自适应性的解决
- 移动优先的设计原则和viewport元标记的设置 1分
- media query的使用 1分
- 断点breakpoint的设置 1分
- 响应式设计效果，如不同尺寸屏幕采用不同布局或图片集设置等 2分
DOM
结合 DOM API 实现页面元素的动态增删改
数据存取
结合 AJAX、本地存储等技术实现数据的动态读取与存储
- 基于ajax数据的GET 2分
- 数据的存储和读取（基于本地存储） 2分
- 基于ajax数据的POST 1分
为保证项目部署到github上仍能正常运行，请使用本地存储。如果你要使用服务端存储，请务必保证后端服务可用，以免造成前端界面无法运行的后果。 对大部分同学，建议你在项目报告中讨论即可。
表单处理
基于客户端脚本，实现表单的本地提交与处理，包括：
- 表单填写流程的处理与跳转(正确、错误等情况) 3分
- 客户端字段验证 1分
- 表单填写错误的信息提示 1分
前端模板
合理使用前端模板引擎库，如站点中各处的重复部分、动态内容的渲染等。评分标准：
- 模板的设计和实现，如对模板语言特性的充分使用、模板文件的划分(独立性、共享性)等 3分
- 模板的调用 2分
前端路由
基于浏览器api或第三方插件，实现站点各页面的前端路由化，即可分享、可收藏。评分标准：
- 页面路由的合理设计，即路由表的设计、各路由url的命名有规律。 2分
- 单页化spa：整个站点只有一个入口页面(即index.html)，但可动态生成多个页 3分
前端项目包管理
- 利用node和npm进行开发，如使用simple http server 之类的本地Web服务器进行开发 1分
- 引用的第三方javascript库，如Jquery等，统统通过npm的方式引入和管理 2分
- 编写简单的构建脚本对项目进行构建（譬如sass之类文件的转译、代码压缩等 ） 2分
扩展技术 30分
合理使用以下任意技术，每一项一般为3分，可累加，但不超过各部分的分值比例：
- 雪碧图
- 图标字体（含字体集定制）
- CSS渐变、转换
- CSS动画
- cookies 的使用
- jquery plugin的使用
- 各种浏览器api 的使用
- sass/scss的使用
- js的高级特性，如定时器等
- 浏览器兼容性处理
- 可访问性：如对听觉设备、打印设备的优化
- 代码规范 (如BEM规范)
- 代码检查工具的使用，如eslint等工具的引入和配置
- 使用github pages 进行公开部署
- 其它用到的技术，请在报告中自行指出和说明
其它说明
- 只依赖Web服务器，不依赖jsp、php等后端脚本技术
- 仅允许使用jquery、ES6（但需转换为plain js）
- 不允许使用vue、react、bootstrap等库
- 如果有同学希望将个人网站的功能、界面做得较为完整和精美，不得不采用框架，则允许采用如下方案
- 提供一个无框架的基础版本，可以较为简陋，体现出各类技术即可，类似于个人网站的原型或概念版。
- 再提供一个基于框架的完整版。