作者微信 bishe2022

代码功能演示视频在页面下方,请先观看;如需定制开发,联系页面右侧客服

为了更加规范的添加和修改【实例】,请上传者遵循以下准则

  1. 请提供资源的详细描述          描述与实际不合不予通过

  2. 资源有相应的效果图,请上传相应的图片



实例模板:

   【实例描述】

   【实例详情】

   【实例截图】

注:  一旦审核通过,可获得5个积

前端设计

 

一、 题目

设计响应式网站前端页面,应用背景自己选择确定,最好贴近实际应用,但同班同学之间所设计页面不能雷同。

二、技术和平台

开发语言与组件库:HTML5CSSJavascriptjQueryBootstrap

开发工具:BracketSublimeHbuilder等。

三、作业要求

结合应用需求,设计网站前端页面,包括首页和其他重要页面,总计至少3个页面以上,总代码量500行以上。

网站界面采用浮动或者栅格系统布局,三张页面总计至少包含30个栅格。组件种类应包括输入类、表格类、导航类、按钮类、图片类等总计20个组件。

2个以上的JavaScript函数,函数需要在页面中使用,函数需要有参数。

网站具有响应式功能,分别设计首页桌面电脑、平板电脑和手机屏幕上的显示方式。

网站必须在Chrome V65以上测试正常显示。

最后要对页面设计中的关键难点技术进行分析,说明解决方法。

所提交内容不要打包压缩,最终目录结构为:

全部位数学号+姓名-项目名称

|

|-----源代码

|------全部位数学号+姓名-项目名称.docx

四、违纪处理

每位同学在和小组团队协作的基础上独立完成各自的模块目开发,不得抄袭他人,如果项目的页面和代码与他人相同,双方都按0分处理,该课程考核为不及格。

五、项目提交和答辩

1. 项目提交截止时间:第15周周三晚22点。

2. 项目审核时间:第16周周二。

3.审核要求:学生自带电脑进行演示,并按项目评分标准和扣分标准进行评定。

 

考核评分标准,项目总分100

分类

考核项目

满分

说明

栅格数量与布局合理性

总计具有30个栅格

20

每个栅格1分,最多30

布局合理性

10

最低要求无不必要空白,排列整齐可得6分以上

组件数量与合理性

组件数量

20

每个组件1分,最多20分。

组件合理性

5

每个组件都有实际用处

JavaScript函数

两个JavaScript函数

10

每个5分,最多10

响应式功能

平板电脑显示

8

显示区域小于576px,两个组件可以并列,显示5个以上组件

手机屏幕显示

7

显示区域小于960 px,每个组件单独一行显示,菜单缩小为菜单切换图标,显示5个以上组件

3个页面的设计合理性,理由阐述充分,每张页面设计阐述文字不少于5行。

5


说明文档

关键技术分析与详细解决方法说明

8

分析说明不少于5

规范性与创新性

编程规范性与页面整体美观性

7

根据元素名、函数名、缩进、变量名是否规范、整体美观程度确定分数


合计

100


项目扣分:

扣分项目

扣分说明

页面导航失败

每次错误扣分1分,扣5分为止。

代码异常

程序出现异常,每次扣1分。扣5分为止。

Table元素作为布局工具

局部布局每次扣5分,页面整体布局每次扣15分。

Fixed定位不当应用

每次扣5分。

 

分, 描述不详细的,不予通过

Home