web前端实习报告

《web前端实习报告》由会员分享，可在线阅读，更多相关《web前端实习报告（13页珍藏版）》请在装配图网上搜索。

1、实习报告学生姓名： 学 号： 专业班级： 实习单位：_实习时间： 校外指导教师： 校内指导教师： 绩： 目录1 实习背景1.1 实习目的 11.2 实习起止时间 11.3 实习内容概要 12 实习内容 . 12.1 实习过程 12.2 实习内容 52.3 主要成果 5总结3.1网页游戏的认识 3.2 实习的自我评价1 实习背景1.1 实习目的了解软件开发的各种模式，开发流程，以及各种形式的建模 详细学习敏捷开发的各个流程，并通过实习 来体会敏捷开发所带来的效率掌握 HTML5 CSS JAVASCRIPT 等技术1.2 实习起止时间开始时间： 2015 年 7 月 12 号截止时间： 2015

2、 年 7 月 18 号1.3 实习内容概要学习软件开发的各种模式，重点学习了敏捷开发（专业老师讲授）学习HTML5 CSS JAVASCRIF技术（形式：观看视频）按照敏捷开发的流程，学员分组，制定每日的站立会议时间 观看实习内容例子的视频，分工合作 提交实 习成果，老师检查打分2 实习内容2.1 实习过程可以以周为时间单位概述实习各阶段所从事的主要工作等；学习阶段开发模式1) 软件生命周期同任何事物一样 , 一个软件产品或软件系统也要经历孕育、诞生、成长、成熟、 -衰 亡等阶 段，这一般称为软件生命周期。软件开发生命周期(SDLC)是指软件开发的全部过程、活动和任务的结构框架。SDLC的一般

3、步骤包括：确定问题、可行性分析与开发计划、收集需求、分析与设计、编码开 发、测试、安装、维护。2) 软件生命周期模式 典型的几种生命周期模式包括：瀑布模式、演化模式、螺旋模式、快速原型 模式、喷泉模式和混合模式等。3) 敏捷开发敏捷开发( Agile )是一种关注价值、消除浪费、以人为核心、迭代、循序渐进的开 发方法。 特点：a) 是一种开发方法学( Methodology )，可以应对客户快速变 更的需求。b) 强调以人为核心，采用迭代的方式，循序渐进地开发软件。c) 在敏捷开发过程中，软件项目被划分成多个相互联系但也能独立运行的子项 目。d) 每个子项目在开发、测试直至完成的过程中一直保持

4、可使用的状态。e) 这个过程就是要形成开发过程中团队之成员之间更加有效的合作关系，使其 灵活性 更高，以适应不断变化的需求。技术讲解1) 讲解内容：HTML5 CSS JAVASCRIPT技术2) HTML5HTML5 是一个描述用于帮助开发者创建下一代网站和应用的HTML、 CSS 和JavaScript规格的涵盖性术语。这个定义中最显眼的三个部分是：HTML CSS和JavaScript 。他们定义了开发者如何使用优化标记，风格更丰富的性能，以及新JavaScript API来制作最新的网络开发功能。简单而言，HTML5=HTML+CSS+JavaScript特性：a) 语义特性( Cla

5、ss ： Semantic )b) 本地存储特性( Class: OFFLINE & STORAGE)c) 设备兼容特性 (Class: DEVICE ACCESS)d) 连接特性( Class: CONNECTIVITY)e) 网页多媒体特性 (Class: MULTIMEDIA)f) 三维、图形及特效特性( Class: 3D, Graphics & Effects )g) 性能与集成特性( Class: Performance & Integration )h) CSS3 特性(Class: CSS3)3) CSSCSS(层叠样式表)是一种用来表现HTML(标准通用标记语言的一个应用)或

6、XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS 使用方法：a) 外联式 Linking (也叫外部样式) ：将网页链接到外部样式表。b) 嵌入式 Embedding (也叫内页样式)：在网页上创建嵌入的样式表。c) 内联式 Inline (也叫行内样式) ：应用内嵌样式到各个网页元素。CSS 布局特点：a) 精简代码，降低重构难度b) 网页访问速度c) SEO 优化d) 浏览器兼容性基础语法：a) CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。b) 选择器 宣言 1; 宣言 2; . 宣言 N c) 选择器通常是您需要改变样式的 HTML 元素。d) 每条声

7、明由一个属性和一个值组成。e) 属性(property)是您希望设置的样式属性(style attribute )。每个属性有一个值。属性和值被冒号分开。f）选择器 property: value4）JAVASCRIPTJavaScript 一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言， 内置支持 类型。它的解释器被称为 JavaScript 引擎，为浏览器的一部分，广泛用于 客户端的脚本语言， 最早是在HTML （标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。组成a）ECMAScript，描述了该语言的语法和基本对象。b）文档对象模型（DOM,描述处

8、理网页内容的方法和接口。c）浏览器对象模型（BOM,描述与浏览器进行交互的方法和接口。特点a）是一种解释性脚本语言（代码不进行预编译） 。b）主要用来向HTML （标准通用标记语言下的一个应用）页面添加交互行为。c）可以直接嵌入HTML页面，但写成单独的js文件有利于结构和行为的分离。d）跨平台特性，在绝大多数浏览器的支持下，可以在多种平台下运行（如 Windows、Linux 、Mac、Android 、iOS 等）。开发阶段开发第一天站立会议：8.00 8.15 会议内容：小组分工，制定站立会议时间，了解每个人的学习情况，交流学习的内容 任务内容：“打地鼠”网页游戏的网页布局一一HTML5

9、+CS技术开发第二天站立会议： 8.00 8.15会议内容：小组分工，完成情况，了解每个人的进度，交流学习的内容 任务内容：“打地鼠”网页 游戏的功能实现开发第三天站立会议： 8.00 8.15会议内容：小组分工，完成情况，查漏补缺，测试软件，寻找bug，交流学习的内容任务内容：“打地鼠”网页游戏的软件测试，寻找不足，确认无误，提交实习结果2.2 实习内容项目介绍 “打地鼠”网页游戏是安卓版“打地鼠”游戏的进一步开发，可以实现在网页中构建游戏的所 有功能，并且不用下载安装既可以用的游戏，网页版游戏的市场前景潜力无限，国内逐渐发展 起来一批喜欢网页游戏的用户群，并且网页游戏属于中小型的项目，易于

10、开发，应用于敏捷开 发的流 程，效率十分高。我的任务 “打地鼠”网页游戏网页布局的调整，以及“打地鼠”之所谓“打”的动画实现，还有最后的 “软件测试”。软硬件平台dreamweaver6,s Mozilla Firefox 浏览器，photoshop cs使用技术HTML5CssJAvAsCRipT浏览器中的开发人员调试photoshop cs的图片处理技术JAVASCRIPT 的进阶一一JQERY 技术2.3 主要成果“打地鼠”网页游戏的成功开发，基本功能：打地鼠的动画，游戏的时间限制，统计分数，开始游BUG 比如动画的迟戏，暂停游戏，结束游戏，走马灯介绍等等。但是在实际测试的时候仍然出现了

11、一些缓（主要是因为动画的缓冲没有做好） ，还有一些分数的统计不甚合理，这在我们应用的时候及时的发 现，并且处 理了这样的问题。3.1 网页游戏的认识网页游戏又称Web游戏，无端网游，简称页游。是基于Web浏览器的网络在线多人互动游戏，无需下载客户端，不存在机器配置不够的问题，最重要的是关闭或者切换极其方便，尤其适合上班族。在那个网络泡沫经济高速扩张的年代，在那个大量菜鸟网民拥入网络的年代，在那个文字MUDB 经逐渐衰退而网络游戏又尚未兴起的年代，这种新颖玩意儿的推出，无疑让很多人为之惊艳。仅仅通过简 单注册，就 可以边玩游戏边泡论坛。尽管只有简陋的游戏界面、一堆文字、几张图片，游戏方式也不过

12、是刷新页面而已，但 WebGam 却带来了无限的乐趣和遐想，同时还演绎了让无数人刻骨铭心的爱恨情仇。 如今网络游戏百花争鸣，到处 充斥着唯美的人物和绚丽的光影。你会偶尔缅怀那些逝去的岁月吗？至少 在我心底，一直有数款难以忘怀的WebGanmeWebGam，顾名思义就是基于Web浏览器的网络在线多人游戏。从诞生发展至今，WebGam大概分为三种类型：一是基于Web浏览器，使用PHP/ASP/Perl等解释语言建设的虚拟社区；二是基于Web浏览器，使 用Flash/JAVA技术制作的游戏；三是需要下载客户端并连接专用服务器运行的游戏。网页游戏尽管EBS将国内WebGam的发展往前推了一把，但是一段

13、时间后，这类WebGam的弱点逐渐暴露出来。一些架设 WebGam 供网民免费游玩的站点，由于质量和管理不过关、服务器负载过大，丢 失了不少 玩家。同时，比WebGam华丽N倍的网络游戏兴起后，WebGam自然就逐渐没落了。传统意义上的 WebGam 依然为少部分热爱者延续至今，而且游戏性与游戏素材比以前丰富许多。前景分析网页游戏的市场潜力巨大，与其他类型网游相比有着强劲优势 网页游戏的用户群逐渐培养起来，极 有可能成为未来网游用户的一支主力军 避大型网游之锋芒，坚持走游击路线。坚持和中小站长合作 针对用户群大胆创新，敢于突破固有模式游戏特点 混搭式类型成主流策略游戏不断丰富 游戏内容多样化

14、消费群体不断成熟 市场集中度提高 游戏跨形态融合 产品结构渐丰富 步入全球化运作 企业品牌意识增强3.2 实习的自我评价这次实训充分利用了课堂所学，掌握了许多关键技术，例如模版技术， CSS 样式，使得制作过程方 便了很多。在完成基本要求得基础上，文件夹、文件命名规范；文件存放位置合理； 制作完成之后进 行过现场清 理：没有无用的文件、文件夹，没有断链 （ 外部链接不算 ） ；工作量饱满：内容较丰富、自己 设计制作的素材 应用多； 色系、 布局合理美观、 考虑用户访问方便； 采用各种特效、 并且运用合理。 不 过也有些不足，比如 一开始没有把几个人制作的文件夹分开，导致后面汇总时比较麻烦。还有就是文件 名字开始中文命名，有的时候链 接错误。这次的作业随说我是在网上找了很多做好的模板但是我还是很 有成就感， 觉得自己很不错。 不过总的来 说， 对这次的作品相当满意， 不仅选择了我们自己喜欢的内容， 而且在我们的水平上把它做的很精美。 在这个过 程中我们意识到了自己在相关技术上的不足， 通过学习， 知道了如何改进我们的缺点，相信在以后的应用中，我们 会做的更加完美！