摘要：因为工作岗位的变换带来工作内容的变动，对于移动网站的前端开发已经疏远了好几个月，在这好几个月中有很多新的东西出现，自己所掌握的一些东西也已经陈旧，所以选择了这本书《HTML5触摸界面设计与开发》来系统地学习和整理一下关于移动网站前端开发的知识体系。 之所以选择这本书，一是因为这本书比较新，20... 阅读全文

摘要：作为一个半前端工程师，而且只会写点HTML5和CSS3的“假”前端工程师，为了能更好地理解一下前端的花花世界，最近拜读了《高性能网站建设指南》一书，对作者提出的前端性能优化的14个规则获益匪浅，为了让自己印象更深刻点，决定作此文，当做学习笔记也好，知识总结也罢，总归看过的东西要让自己很好地掌握很好地运用起来才是王道。在解读这些规则的同时，我会用我一年半多的移动网站开发经历提出一些针对移动网站的优化建议。规则01：尽量减少HTTP请求前端优化的黄金准则指导着前端页面的优化策略：只有10%-20%的最终用户响应时间花在接受请求的HTML文档上，剩下的80%-90%时间花在为HTML文档所引用的所有 阅读全文

摘要：纵观现在每家移动网站，打开首页的时候，都有各种各样的形式来提示你下载自身的移动App（Android/IOS），这是做移动客户端产品的一个很好地引流的手段。当然各家引流下载的交互和视觉各不相同，有的是完全“强奸”用户，有的是完全取悦用户。但是最终的形式就是你点击一个按钮之后，可以去下载对应的App（Android直接下载对应的Apk文件，IOS会跳转到App store的对应地址）。 之前开发这个需求的时候，就是很简单的针对用户访问的useragent进行判断，如果android设备，给出的是apk文件的下载URL，点击之后直接下载；如果ios设备，给出的是App store的URL。但... 阅读全文

摘要：移动开发的快速发展让移动用户使用移动设备变得更容易。人们通过使用移动设备可以很容易地访问移动网页。根据最近的一项研究，超过 6300万的美国人通过移动设备访问不同的移动网站，其数量预计到2013年底达到近2亿。由于使用移动设备的人数在不断增加，因此对于设计师和开发人员 来说，专门设计适应移动设备访问的网站显得十分重要。 对于开发者或者设计者来说，移动开发就技术而言，不需要再花太多的额外时间精力去学习，需要去做的就是设计移动网页，需要全新的视觉去考虑问题。在移动网 站的开发过程中有需要遵守一些规则，开发者和设计师都应该去遵守，这样从你们手下出来的移动网站才会有更好的效果。统计分析程序不可少 通过 阅读全文

摘要：我们经常在一些网站上看到一些关于公司大事记、网站更新记录之类的页面，尤其现在的一些电子商务网站，来一个以时间线为轴，来标记一些重要日子进行一些大促之类的活动，有了这样一个直观的时间轴的东东，可以让来浏览网页的用户能很快捕捉到一些有用的信息。 那么我们可不可以把这个时间轴做的动感一点？然后我们可不可以把PC上这么好玩的时间轴移植到移动网页上呢？答案当然是可以的。稍后我把代码送出来。 先来看一张截图吧，这是我最终实现之后的页面样式，因为不会截图，也没有专业的视觉设计师，所以页面的视觉风格是借鉴了别人的： 线上演示地址：http://sandbox.runjs.cn/show/phvo... 阅读全文

摘要：在github上看到有人用HTML5 + CSS3 + Javascript实现了jQuery Wheel Menu（旋转菜单），因为本人供职于移动网站的开发，又不是一个专业的前端开发，所以看到这么炫的东东肯定就垂涎三尺，想移植到移动平台，当然最好一句代码不修改直接移植过来是最省事的，但是最终发现此大牛给出的Demo在移动端上展现是有一定问题的，所以在边看中国好声音的过程中，修改了他的一部分代码，实现了在移动浏览器上可以自由使用的jQuery Wheel Menu（旋转菜单）。 既然实现了如此绚丽的菜单，那么在移动网站上究竟在怎么样的场景下可以使用呢？其实，淘宝移动主站（m.taobao... 阅读全文

摘要：做成码农，我直接以代码形式来作为这篇文章的主要内容吧。 XXXXXXXX,发短信使用XXXXXXXX。 --> 移动网页的基本结构 ... 阅读全文

摘要：这篇文章主要说说在进行响应式Web设计的过程中，涉及到页面的一些需要进行优化的地方：1、 轻量级的Javascript库：针对PC端网页当然会首选jQuery来作为前端javascript库，但是针对移动端来说，jQuery太重，而现在针对移动端来说，有很多优秀的框架可供使用，jQuery Mobile、YUI、XUI等是不错的框架，但是个人比较倾向于zepto。不过zepto预定义的一些事件，比如触屏滑动的swipe事件，在ios上完美支持，但是在android上，有些浏览器确实不支持的，这时候就需要寻求与一些第三方的javascript插件库，好在现在网上有很多优秀的第三方javascri 阅读全文

摘要：介绍完响应式Web的背景和概念之后，是时候该介绍具体的实现方法了，其实响应式Web设计的方法很简单，就是利用CSS3的媒体查询Media Queries和Viewport来解决问题的。 首先我们一起来看看Media Queries，这里我只会对其做一个简单的列举介绍。（有兴趣深入的同学可以参考：http://www.w3.org/html/ig/zh/wiki/CSS3%E5%AA%92%E4%BD%93%E6%9F%A5%E8%AF%A2） 通过媒体查询的设置，我们可以根据屏幕宽度、屏幕方向等各个属性来加载不同场景下不同的CSS文件来渲染页面的视觉风格。具体的使用方法有以下两种：通过... 阅读全文

摘要：首先感谢大家对第一篇背景介绍一文的支持，今天将对响应式Web设计的概念进行一个大概的介绍，当然这一篇也不是什么干货，只是作为一个主题来说，概念的介绍必不可少，下一篇就应该有点干货了。 从背景介绍一文中，我们可以得到这样一个结论：互联网正在快速迅猛地向移动终端发展，这样对于网页就有了一个Anywhere的需求。其实网页的Anywhere就是响应式Web设计，说的再白一点，就是为了省时省力省钱，一次开发出来的网页，用一个URL，可以在不同终端设备上有不同的呈现方式。下面四张图就是一张网站所作的响应式设计。 OK！概念就是这样的，本人一直以屌丝自居，所以这个定义也多少带着点屌丝的意味，娱... 阅读全文

摘要：不是专业前端，可2011年底至今大部分时间在做着一个前端开发工程师的事情，所以多少也有点总结，多少也有点“经验”和分享。响应式Web设计不是我首创的概念，早就有了，我这里只不过把自己最近这段时间关于这方面的研究做了一个总结。至于这篇文章能给你带来多大的益处我保证不了，但是只从读完这篇文章之后你至少能明白以下几点：为什么要做响应式Web设计？什么是响应式Web设计？如何做响应式Web设计？送你几个关于响应式Web设计优化的小建议！ 在说响应式Web设计前，我们先来看看移动互联网的发展现状：移动互联网用户规模接近PC互联网用户规模，市场规模占比进一步增加，移动互联网成为主流（数据来源：CNN... 阅读全文

摘要：标题整的太大了，所以为了不让各位看官们失望，请不要抱着太大的期望来看待本文。从2011年12月开始进行移动网站的开发，经历了一年多的跌打滚爬，虽没有金刚钻，但也有点小九九。本人参照了Maximiliano Firtman的《Programming the Mobile Web》一书，其中稍微加上了点个人的一些看法，但是我不会明确告诉你们哪些是大师的，哪些是我这个鸟人的，我要沾光沾到底，好了，不扯淡了，开始吧~中国互联网正在向移动端快速地发展，艾瑞咨询集团预测到2015年中国网民将达到7.3亿，其中7.1亿的用户都是移动互联网用户，加上HTML5、CSS3的兴起，移动网站将会大放光彩。所谓移动网 阅读全文