前端开发和美工工程师工作总结[本站推荐]

第一篇：前端开发和美工工程师工作总结[本站推荐]

前端开发和美工工程师工作总结

作为公司的网站前端开发和美工，2017年本人主要负责的是经文保总队的各个系统的界面设计及动态页面制作，包括以下内容：

一、吉林省单位内部安全保卫平台内网及外网设计及制作，同时包括平台下边九个子系统首页制作（包括经文保综合管理系统、散装汽油销售管理系统、安保人员考试系统、高校少数名民族学生管理系统、考试服务系统、金融服务系统等）；

二、公安内网网站吉林公安经文保信息网整站设计及动态效果制作和后期维护；

三、吉林省单位内部安防信息网协同其他行政部门联合办公系统整站设计及动态网页制作；

四、系统内警踪平台整体界面制作；

五、经文保警用手机、平板app客户端界面设计及切图；

六、移动端网站建设；

七、经文保管辖单位重点部位和检查项3d全景建模技术学习及制作，720云场景应用线上展示重点单位主要监控部位动态效果。

经文保之外的临时项目与任务，包括以下内容：

一、省移动公司处系统项目界面设计及制作，家庭宽带项目管理系统界面制作及相关临时项目需要制作；

二、省公安厅汇报项目美化设计；

三、甘南农业项目app客户端制作及后台信息管理系统界面制作；

四、吉林省网优大数据平台demo制作；

五、公司电力部和工程部各类材料、检验报告合同修改以及发票制作；

六、社保材料制作；

七、临时投标演示项目demo效果制作。

以上列出了本人2017年的工作内容，首先感谢公司提供这样优秀平台和机会，让我在工作中和公司一起度过忙碌而充实的一年，工作中努力协同后台开发人员一起完成界面系统的精美展现，同时选择当下主流框架界面，仔细研究客户的需求和业务流程，不断优化用户操作界面，提供给用户良好的用户体验和用户舒适度。

除了系统开发这一块，在经文保项目还中应用了新领域的720度3d全景动态展示技术，720全景动画展现也是近几年比较火爆市场需求，结合百度地图，实景展现任何地方的办公及生活场景。

这一年做项目过程中在本岗位上提升了自己，同时也学习了新领域的知识，不断充实自己赶在技术的前沿，随时接受新的任务和挑战。

希望公司在新的一年里拓展新领域业务，课余多开展一些培训活动，提高员工学习新技术的积极性，同时培养团队能更好的配合完成任务。

在工作之外，希望公司多组织一些体育活动和知识竟赛活动，这样在日常工作中既可以活动身心和头脑，有能找到更多的工作乐趣，劳逸结合，才能更好的钻研项目，在技术领域有更多的突破，和公司共同创新与成长，同时希望公司项目顺利开展，我会尽全力发挥自己的能力，实现个人的目标和公司的目标，在飞快发展的大环境下和公司共同进步，最后希望公司未来发展越来越好!

第二篇：什么是前端开发工程师

www.xiexiebang.com

什么是前端开发工程师

前端开发工程师是Web前端开发工程师的简称，是近五年才真正开始受到重视的一个新兴职业。Web前端开发技术是一个先易后难的过程，主要包括三个要素：HTML（标准通用标记语言下的一个应用）、CSS和JavaScript，这就要求前端开发工程师不仅要掌握基本的Web前端开发技术，网站性能优化、SEO和服务器端的基础知识，而且要学会运用各种工具进行辅助开发以及理论层面的知识，包括代码的可维护性、组件的易用性、分层语义模板和浏览器分级支持等。

前端开发工程师是一个很新的职业，在国内乃至国际上真正开始受到重视的时间2005年开始，是指Web前端开发工程师的简称。Web前端开发是从美工演变而来的，名称上有很明显的时代特征。在互联网的演化进程中，Web 1.0时代，网站的主要内容都是静态的，用户使用网站的行为也以浏览为主。

2005年以后，互联网进入Web 2.0时代，各种类似桌面软件的Web应用大量涌现，网站的前端由此发生了翻天覆地的变化。网页不再只是承载单一的文字和图片，各种富媒体让网页的内容更加生动，网页上软件化的交互形式为用户提供了更好的使用体验，这些都是基于前端技术实现的。

www.xiexiebang.com

随着Web 2.0概念的普及和W3C组织的推广，网站重构的影响力正以惊人的速度增长。XHTML+CSS布局、DHTML和Ajax像一阵旋风，铺天盖地席卷而来，包括新浪、搜狐、网易、腾讯、淘宝等在内的各种规模的IT企业都对自己的网站进行了重构。

（ps：本文章由北大青鸟广安门校区搜集自互联网）

第三篇：前端开发心得

web前端核心技术

从事前端开发工作1年多了，从最初的DIV+CSS学起，到现在学到html5、css3、javascript，jquery等等，我觉得前端要学的技术太多了，很多人认为前端开发要掌握的技能简单，就是网页制作，其实不然，前端开发是网站的前台代码实现，包括基本的HTML和CSS以及JavaScript/ajax，现在最新的高级版本是HTML5、CSS3，以及SVG等。JavaScript作为最难的语言之一，许多编程高手也不敢妄自菲薄、自封精通。

关于兼容性的问题我相信对于每个做前端开发的人来讲是一个很头疼的问题，互联网目前主流浏览器有IE6789，Firefox，Chrome，Opera，Safari，遨游，包括国内主流的搜狗，腾讯 TT，360等等；从内核上讲主要有IE的，遨游版IE，safari，firefox以及opera的，这些都是大家常见的。所谓的浏览器兼容性问题，是指因为不同的浏览器对同一段代码有不同的解析，造成页面显示效果不统一的情况。在大多数情况下，用户用什么浏览器来查看同一网站，都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。这个时候就需要针对不同的浏览器写不同的CSS，这个过程叫CSS hack。虽然我们写代码都要求按照标准，不写hack代码，但实际工作中为了兼容主流浏览器，hack代码是免不了的，所以这也应该是每个前端开发人员必备的技能。

前端的开发工具很多，比较常见的有Dreamweaver，Notepad，webstrom，Sublime Text等等，我现在在使用webstorm，强大的提示功能可以帮助我们很快的熟悉并掌握网页布局,检查错误等。调试代码的工具我使用的Firebug。Firebug是网页浏览器Mozilla firefox 下的一款开发类插件，它集HTML查看和编辑、Javascript控制台、网络状况监视器于一体，是开发JavaScript、CSS、HTML和Ajax的得力助手。Firebug如同一把精巧的瑞士军刀，从各个不同的角度剖析Web页面内部的细节层面，给Web开发者带来很大的便利。Firebug也是一个除错工具。用户可以利用它除错、编辑、甚至删改任何网站的CSS、HTML、Dom 以及Javascript代码。

以上是自己做前端开发的一点心得，它所涵盖的知识面远远不止这些，我也在不断的学习，不断地丰富自己，希望自己能在前端这个职位上开阔自己的一片天地！

第四篇：前端工程师常用工具

前端工程师常用工具

虽然有一段时间不做前端工程师，但还是免不了做前端的思维，碰到了很好的前端实用工具帖还是忍不住转了过来。这个帖子被转了好多次了，也不知道原本的作者是谁，但无论是谁都是万分的感谢，没有您的整理也没有大家的方便。

帖子整理了前端工程师常用的工具手册以及一些著名的相关博客，是工作中不可缺少的资料。概要：

 



  

   IE下的调试工具前端开发者社区及权威网站前端开发工具集

在线工具集



o o o o 

o o o o 弃他了



o

o o 

o

o o 其他：—— 做某些东西(Firefox插件)时需要唯一资源标志符时用CSS类： CSS选择器性能测试—— CSS格式化工具 CSS Compressor —— CSS压缩 书籍类： Book Shelf 2.0 beta —— 荐，分类很清晰，下载很方便原版图书免费下载链接收集站JavaScript类：—— JavaScript格式化工具，效果很理想 AJAX Libraries API—— 以前一直用这个压JS，自从有了TBCompressor，就放

常用Firefox插件

  支付宝安全控件 和 旺旺协议 —— 网购专用，Firefox+浦发网银，无敌了—— 这个不用介绍了吧，附空帏的外部编辑器乱码修正版

o o o o o 

      —— 支持Cookie的查看和编辑—— 调试性能的，用起来比较麻烦，没试过—— Why Slow? YUI出品—— 把设计稿直接拖到Firefox里进行对比—— JS高亮，性能不是很理想—— 简化在Firefox里切换Fiddler的操作，感谢Taobao UED的空帏同学—— 把Html, Dom, JavaScript等手册放在侧栏里，可以自定义增加，快捷键Ctrl+F9。可以在找到更多的Package。—— 针对每个站点发送想要的HTTP Referer—— 看某个网站不爽，写个小脚本来优化下还是不错的—— 查看当前Http链接状态，类似IE下的HttpWatch—— 切换User-Agent，同时开发iphone和web版本的时候很方便—— 穿墙工具，配合使用很和谐

IE下的调试工具

—— 非常强悍的一款http流查看工具，默认支持IE，其他浏览器可以设置将

{Document}ScriptsBrowserPAC.js设为代理进行使用。Firefox下可用上述”Fiddler 开关”进行快速切换。支持插件。

 —— 查看元素、禁用缓存、禁用CSSJS、Outline元素、查看生成的源码等功能，IE8自带了一个加强版的。+—— 调试JS用，虽然报错还是有误差，但是

我已经满足了。安装顺序是：Microsoft Script Debugger，Companion.JS，在”IE选项-高级”里取消禁用脚本调试。



o

o 多版本IE共存两种方案： IE7/8 +—— 大众型配置，可以基本满足日常需要。IE6 +—— 在IE 6用户占绝对优势以及IE 6神奇bug

满天飞的时代，我还是推荐这种方案，因为只有神奇的原装IE 6，才能抵挡运营神奇的问题。另外如果还有其他机器可供支配的话，建议再装个IE 8 + IE Tester，因为IE 8下的Developer Toolbar还是有很大改进的，调试起来会方便一些。



o o o 以下三个软件相对不重要些：—— http流查看—— 可查看JS生成的源码—— 网速限制

参考手册



资料。







 苏昱的CSS中文手册和Dom中文手册XMLHTTP参考手册—— 整理的版本，包含了W3C手册以及其他有用的 





   和()PHP手册

批处理工具

  —— 淘宝UED的JS/CSS压缩工具，详见—— png优化工具—— jpeg去冗余meta工具

IDE及其他工具



 

—— 灰常灰常好用，灰常灰常移动，见

Bookmarklet(右键另存)

   ——————，—— for IE 开发者社区及权威网站

     

       (Web 前端开发技术专题)—— 在线PPT分享，资源丰富—— Web开发人员的百科全书(香港，维基百科

推荐订阅的博客和网站(排名不分先后)



o

o

o



o

o

o 国内 内容聚合：，，团队Blog：淘宝，口碑，阿里巴巴国际站，阿里巴巴中文站，阿里巴巴中文站前端开发团队(方凳)，阿里妈妈，支付宝，阿里软件，19楼，九天音乐，金蝶与友商网 个人Blog，这里列出的是原创并更新相对频繁的博客，如有遗漏，请告之：怿飞，手气不错，Realazy，old9(需穿墙术)，沙滩凉鞋(空帏)，射雕(玉伯)，Aether，振之，嗷嗷，，，，，，，卢力，CSS森林(Ghost)，Twinsen，Gulu77，Rlog，Dlog，子鼠，西风坊 …

 





用







浮动标签清除浮动方法小结 前端工程师国外 内容聚合：，，，，团队Blog：，个人Blog：John Resig，PPK: QuirksMode，Douglas Crockford，Dean Edwards，，，

第五篇：WEB前端开发工程师笔试试题（范文模版）

WEB前端开发工程师笔试试题

1.HTML的含义是什么?其主体部分由什么标记构成?

2.说明在网页设计中div标签的作用

3.CSS指的是什么?在网页制作中为什么要使用CSS技术

4.css 中id和class如何定义,哪个定义的优先级别高?如class定义一个html元素没有边框,而id定义这个元素有边框,结果呢?

5.IE6下为什么无法定义1px左右高度的容器

6.怎么样才能让层显示在FLASH之上？

7.怎样使一个层垂直居中于浏览器中（代码实现）？

8.firefox嵌套div标签的居中问题，假定有如下情况：

如果要实现b在a中居中放置，该如何实现？

9.web标准网站有哪些优点？

10.怎样解决超链接访问过后hover样式就不出现的问题？