摘要：
首先感谢原作者：webApp赵海洋附上文章原地址：移动前端工作的那些事---前端制作之自适应制作篇随着移动前端的手机屏幕分辨率越来越多，自适应设计制作显得越来越重要。如何自适应屏高和屏宽是每个设计和制作人员共同需要考虑的事情。设计人员需要考虑N多分辨率的情况，而制作人员则需要考虑如何自适应布局等等。我先从设计的角度来阐述这个问题，首先要考虑如何进行自适应设计。这个需要和制作人员进行沟通后决定，如果制作人员采用响应式布局（稍后会介绍此布局）的制作方案的话，则需要设计人员根据不同的屏宽来设计不同的效果图以便提供给制作人员进行响应式布局制作。如果制作人员采用高宽最大化（稍后会介绍此布局）来进行布局制 阅读全文
摘要：
首先感谢原作者：webApp赵海洋附上文章原地址：移动前端工作的那些事---前端制作篇之框架篇--jQTouch框架移动前端框架有许多，这次简要的介绍jQTouch框架。jQTouch也是轻量级框架、它的语言基于jquery语言。上手容易。加载时间比较快，优点是动画切换很流畅、在Android和IOS上表现都不错。缺点是与其搭配的插件较少，需要一些外包插件来进行某些效果的支持,无法自定义布局样式等。首先，我们先熟悉一下jQTouch的结构代码：<!doctype html><html><head><meta charset="UTF-8&qu 阅读全文
摘要：
首先感谢原作者：webApp赵海洋附上文章原地址：移动前端工作的那些事---前端制作篇之框架篇--jqMobi框架上文中，提到了许多的移动前端框架，这次主要介绍jqMobi框架。jqMobi也是轻量级框架、它的语言基于jquery语言。并对其进行了简化，更有利于在移动设备上进行应用，并且速度很流畅。上手很容易。首先，我们要先部署jqMobi的环境，以下是代码：<!DOCTYPE html><!--HTML5 doctype--><html><head><title>jqmobi精简版本</title><meta ht 阅读全文
摘要：
首先感谢原作者：webApp赵海洋附上文章原地址：移动前端工作的那些事---前端制作篇之框架篇为了更好的提升用户体验，移动端逐渐出了许多的移动端的框架，比如Sencha Touch、JQTouch、Jquery-moblie、jqMobi等等。这些框架都有优缺点，不同的框架应用在不同的项目中。现简单阐述一下各框架的优缺点：一、Sencha Touch框架是一个重量级的框架、它上手较难，代码复杂，并且需要较强的程序基础才能学习，最开始的时候因为一个项目，想使用Sencha Touch框架，后来工期实在太紧张，根本没时间学习它并使用。所以最后转投其他框架。这个框架兼容性很高，运行起来的速度一般，需 阅读全文
摘要：
首先感谢原作者：webApp赵海洋附上文章原地址：移动前端工作的那些事---前端制作篇之javascript篇（二）在互联网中，一般用户都是通过鼠标点击、鼠标悬停、鼠标离开等执行一些前端的事件，但是在移动前端，用户却是通过手指来进行操作。从而衍生出移动前端的手势事件。鼠标中的click事件虽然也可以在移动前端进行触发，但这个事件在移动端会有大约半秒中的延迟。所以一般都不采用。在移动端的手势事件一般有四种情况：touchstart:手指放到屏幕上的时候触发touchmove:手指在屏幕上移动的时候触发touchend:手指从屏幕上拿起的时候触发touchcancel:系统取消touch事件的时候 阅读全文
摘要：
首先感谢原作者：webApp赵海洋附上文章原地址：移动前端工作的那些事---前端制作篇之javascript篇javascript(简称js)语言在移动前端应用很广。可以说必不可少，许多效果都是和js相关的。包括现在移动端的一些框架。jqmobi、jqtouch、sencha touch、jquerymobile等等。这些都是基于js而进行编写的。这篇暂时不讨论这些框架。以后会慢慢介绍其中的一两个框架的具体使用方法。这篇主要讨论一下部分常用的js事件在移动端的使用。举几个例子：1、隐藏地址导航栏：<script type="text/javascript">// 阅读全文
摘要：
首先感谢原作者：webApp赵海洋附上文章原地址：移动前端工作的那些事---前端制作篇之link标签篇上文的meta标签中，提到了部分功能要结合link标签进行使用。下面详细的解释一下移动端的link标签。link标签主要是存放CSS文件的地方，同时还有一些专属的移动端设置在这里体现。结合以下代码进行说明：<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="viewport" content="wi 阅读全文
摘要：
首先感谢原作者：webApp赵海洋附上文章原地址：移动前端工作的那些事---前端制作篇之meta标签篇移动端前端制作有些地方不同于互联网，这篇主要讨论的是meta标签。meta标签位于之间。是主要辅助HTML结构层的。meta标签不管在互联网前端还是在移动端都起了很重要的作用。这里只讨论移动端。附上代码进行说明：<!DOCTYPE html><!--HTML5 doctype--><html><head><title>xxx</title><meta http-equiv="Content-type&quo 阅读全文
摘要：
首先感谢原作者：webApp赵海洋附上文章原地址：移动前端工作的那些事---前端制作篇之css3简要介绍再谈CSS3之前，有必要先说一下webapp的页面结构。页面结构总体说来是由三个层组成。它们分别是：html结构层、css表现层和javascript行为层。三个层相互独立而又相互依存。理顺了三者之间的关系。对于前端制作大有益处。css表现层起的主要作用是修饰HTML结构层的外观。外观包括：位置、颜色、大小等等。延伸到css3时又增加了许多新的功能。如形状、动画等等。由于IOS系统移动端坚决抵制FLASH等插件登陆其移动端浏览器。所以CSS3在移动端有了很大的用途。它的用途也是主要体现在形状 阅读全文
摘要：
首先感谢原作者：webApp赵海洋附上文章原地址：移动前端工作的那些事---UE/UI架构原型搭建和前端设计之结构示意图每个工种都有自己的工作范围，在工作中，提高工作效率是每个人必要的发展方向。每个工种之间不光是完成自身的工作，同时更重要的是要进行如何衔接。对于每个工种来讲，一定要将你下一个工种作为客户来对待。如何让人家快速的接手，工作起来容易顺畅，才是一个好的工作者应有的态度。在架构原型搭建篇，其实不光是搭建各个页面。同时还有一个步骤应该加上各个页面之间的链接关系。形成一个整体。转到设计时，设计在完成页面的同时，应该继续继承各个页面之间的链接关系，做一个简要的链接关系图，交给后面的制作人员。 阅读全文
摘要：
首先感谢原作者：webApp赵海洋附上文章原地址：移动前端工作的那些事---UE/UI架构原型搭建和前端设计之前端设计一个好的成功的架构原型，决定后面的后续工作是否能够顺利进行。架构清晰，布局合理会给UI前端设计带来很大的便利性。架构原型就好比房屋的主体结构。而UI前端设计则是内部装修。二者相辅相成缺一不可。关于UI前端设计，在架构原型的基础上进行加添视觉效果、美化等工作。让产品有了一个更加直观的印象。可以这么说，一个产品的关键之处，就决定于这个步骤。这个就像是一个门脸房一样。打扮的越漂亮。就越受欢迎。有一次，我在网上看了一则这样的新闻报道。是关于苹果公司的。大体内容综合是这样的。“在微软公司 阅读全文
摘要：
首先感谢原作者：webApp赵海洋附上文章原地址：移动前端工作的那些事---UE/UI架构原型搭建和前端设计之UE架构原型搭建谈到前端的建设初始，是先要知道客户的需求是什么。以及所要面对的使用人群是什么。一个好的产品体现在很多开始细节的处理上。让用户使用客户的产品，在使用的产品过程中，既要保证产品的功能需求，又要有很好的用户操控体验。这才是前端建设初始的最终目的。只有先期做好了这些工作。才会有后面的完善工作，最终成为一个好的产品。如果前期马虎应付，到后期很可能该项目面临改需求、改版、甚至胎死腹中。造成很多的无用功。由于移动前端有一个共性，就是移动终端的屏幕相比较电脑屏幕而言小了很多。一些发生在 阅读全文
摘要：
首先感谢原作者：webApp赵海洋附上文章原地址：移动前端工作的那些事---前言篇在写内容前，有必要先讨论一下什么是HTML5？什么是app？什么是webapp？一、什么是HTML5？这个问题很多朋友和客户都问过我，在这里先简要说明一些关于它的官方的一些定义。HTML5是继HTML4.01,XHTML 1.0和DOM2 HTML后的又一个重要版本，旨在消除富Internet程序对FLASH、Silverlight、JavaFX一类浏览器插件的依赖。 HTML5是HTML下一个主要的修订版本，目前它现在仍处于发展的阶段。它的目标是取代1999年所制定的HTML 4.01和XHTML 1.0 标准 阅读全文