编写Iphone Web App的三个主要技术是HTML, CSS, Javascript，不需要在Iphone上安装，也不要用Objective-C来写，所以对于前端来说算是比较容易上手。相对于Native App来说，Web App的优点是开发周期比较快而且可以运行在任何Web浏览器中并且开发不只是在Mac OS上，缺点是你不可以访问Iphone的一些硬件特性而且很难实现一些高级的UI效果。
有一些需要注意的地方整理了一下：
1.准备一个Iphone的样式表
<link rel=”stylesheet” type=”text/css” href=”iphone.css” media=”only screen and (max-width: 480px)” />
2.控制页面的缩放，如果不指定的话Iphone会认为你的网页宽度为950px
<meta name=”viewport” content=”user-scalable=no, width=device-width” />
3.添加Home页图标，如果用户要添加你的Web App到Home页的快捷方式的话，需要指定一个ICON，有两种
<link rel=”apple-touch-icon” href=”myCustomIcon.png” />
<link rel=”apple-touch-icon-precomposed” href=”myCustomIcon.png” />
4.全屏模式
<meta name=”apple-mobile-web-app-capable” content=”yes” />
5.状态栏
<meta name=”apple-mobile-web-app-status-bar-style” content=”black” />
6.自定义启动图片，这个png图片的尺寸是320px X 460px
<link rel=”apple-touch-startup-image” href=”myCustomStartupGraphic.png” />
7.使用JQTouch来实现动画
JQTouch是一个基于Jquery的手机Web开发的插件，下载地址：http://jqtouch.com/
8.使用HTML5来实现客户端数据存储
HTML5提供了LocalStorage, SessionStorage和客户端数据库
9.使用HTML5来实现离线应用
离线应用需要在服务器端存放一个manifest文件，然后<html manifest=”demo.manifest”>，如果你在使用Apache或其它的Web服务器，需要添加一个.htaccess文件到你的网站目录，里面的内容为：AddType text/cache-manifest .manifest
manifest的文件格式如下：
CACHE MANIFEST
index.html
scripts/demo.js
styles/screen.css
NETWORK:———–>FALLBACK:
logo.jpg ————>logo.jpg offline.jpg
NETWORK表示的是在线文件白名单，如果你离线的话，这个图片不会显示，如果想让其它图片替换这个图片的话，可以改成箭头所示。
10.使用PhoneGap让你的Web App变成Native App
PhoneGap是一个连接Web应用程序和手机设备桥梁的开源开发工具。
了解更多请阅读“Building iPhone Apps with HTML, CSS, and JavaScript”这本书以及云谦的“iPhone 上的Web前端开发”。
级联菜单有很多种，有固定级数的级联，有无限级数的级联，有静态的级联，也有动态的级联(ajax加载选项)。设计级联菜单需要用到HTML的Select控件，Option控件，下面是几个级联菜单的例子。
1.静态数据级联，最多四级。
2.静态数据级联，最多三级。（网上的）
3.动态数据，无限级。
参考：
Select 对象集合
集合 描述
options[] 返回包含下拉列表中的所有选项的一个数组。
Select 对象属性
属性 描述
disabled 设置或返回是否应禁用下拉列表。
form 返回对包含下拉列表的表单的引用。
id 设置或返回下拉列表的 id。
length 返回下拉列表中的选项数目。
multiple 设置或返回是否选择多个项目。
name 设置或返回下拉列表的名称。
selectedIndex 设置或返回下拉列表中被选项目的索引号。
size 设置或返回下拉列表中的可见行数。
tabIndex 设置或返回下拉列表的 tab 键控制次序。
type 返回下拉列表的表单类型。
Select 对象方法
方法 描述
add() 向下拉列表添加一个选项。
blur() 从下拉列表移开焦点。
focus() 在下拉列表上设置焦点。
remove() 从下拉列表中删除一个选项。
Select 对象事件句柄
事件句柄 描述
onchange 当改变选择时调用的事件句柄。
Option 对象
Option 对象代表 HTML 表单中下拉列表中的一个选项。在 HTML 表单中 <option> 标签每出现一次，一个 Option 对象就会被创建。您可通过表单的 elements[] 数组访问一个 Option 对象，或者通过使用 document.getElementById()。
Option 对象的属性
属性 描述
defaultSelected 返回 selected 属性的默认值。
disabled 设置或返回选项是否应被禁用。
form 返回对包含该元素的 <form> 元素的引用。
id 设置或返回选项的 id。
index 返回下拉列表中某个选项的索引位置。
label 设置或返回选项的标记 （仅用于选项组）。
selected 设置或返回 selected 属性的值。
text 设置或返回某个选项的纯文本值。
value 设置或返回被送往服务器的值。
周六在北京银科大厦腾讯公司参加了“WEB标准化交流会”，这次会议的主要内容是“研发流程、协同规范和有效沟通”。交流会来的大部分都是各个互联网公司的前端工程师，有大公司的，也有小公司的，在研发流程方面，总的感觉大公司的流程基本一致，如淘宝和百度的工作流程就很类似，在项目前期会有一个项目评审，然后产品和设计师讨论PRD，前端进行页面开发，后端进行代码逻辑开发，开发的方式基本遵循MVC的工作流程。
关于规范，我觉得设计师有设计师的规范，前端也该有前端的规范，一旦规范制定起来并形成文档之后，如果遇到问题就可以参考规范去执行从而避免一些问题。期间还谈到了标准，我个人认为不必完全拘泥于是否通过W3C验证，而是要保证项目的质量，因为前端的职责就是实现人机交互的展现，并且给网站带来更好的用户体验，只要你的HTML代码够简洁，够语义话，CSS代码够重用，Javascript够高效，你就可以称得上是一个合格的前端工程师了，再要去成为一个专业的前端工程师则需要以更加专业的技能与经验去解决实际问题，期间克军还讨论了前端架构师的职责是什么，我觉得前端架构师应该能够为整个前端小组解决一些基础的问题，如一个网站的CSS规划，框架，组件等的实现并且了解前后端技术以及新技术。
关于有效沟通，我觉得月影举的一个例子挺好，如果有两个杯子，怎样让这两个杯子里面的水一样，做法就是把每杯水都倒掉然后两个杯子叠在一起就可以了。这个例子告诉我们在沟通前要先把自己的观点丢掉，然后从对方的角度来考虑问题再去沟通，才能取得双赢的效果。
【读书笔记】
在面向对象领域，已经有许多成熟的问题解决方式，这些方式的抽象化就形成了设计模式。Flash的设计模式有下面几种：
1.观察者模式
事件处理的基本过程为：发送者发送事件，接收者接收事件。为了保证接收者能接收到事件，首先要把接收者告诉发送者，这个过程一般称为注册事件。在使用观察者模式编写的类中：只需要两个类：一个类表示接收者，一个类表示发送者。在发送者中，要有注册事件的方法，用来注册接收者；相应的，要有移除事件方法，用来移除接收者；当发送者发出事件时，会通知注册的接收者，因此还需发送事件方法。
2.MVC模式
MVC模式是“Model-View-Controller”的缩写，中文翻译为“模式-视图-控制器”，MVC应用程序总是由这3个部分组成。事件导致Controller改变Model或View，或者同时改变两者。只要Controller改变了Model的数据或者属性，所有依赖的View都会自动更新。类似的，只要Controller改变了View, View会从潜在的Model中获取数据来刷新自己。、
3.工厂模式
一般来说，在创建类的实例时，都会采用下面的方式：var ins:MyClass = new MyClass(); 从实际应用的角度考虑，构造函数被调用时经常要做些初始化的工作，例如，变量的初始化等。生成实例时，需要向构造函数传递参数：var ins:MyClass = new MyClass(参数); 如果构造函数的参数很多，说明构造函数中放置了大量代码，一般来说，这样的构造函数会进行调整，让创建实例所需要的大量初始化工作从构造函数中分离出去。同时如果MyClass有大量的子类，需要实例化的类就很多，这时并不需要一个一个去实例化，使用工厂模式就可以了：
package{
public class Factory{
public static function create(i:int):MyClass{
if(i==1){
return new MyClass1();
}else if(i==2){
return new MyClass2();
}
}
}
}
有了上面的代码之后，就可以这样来创建实例: Factory.create(1);由于在create()方法中可以放置很多代码，可以很灵活来控制类的实例化，特别是控制多个类的实例化，因此，在实际应用中会经常用到这种方法。由于create()能像工厂生产产品一样，产生一个个实例，所以把这种方法成为工厂方法。
4.单例模式
在前面编写的类中，都是直接调用类的构造函数来创建类的实例，多次调用就会产生多个实例。实际上，有些类的实例不需要有多个，只需要一个就行，因此就需要对构造函数进行控制，使其只能被调用一次，解决这个问题已经有现成的答案，即使用单例模式。
5.模板方法模式
模板方法模式是设计模式中的一种，是基于继承的代码复用的基本技术。模板方法模式的基本思路是：由父类给出某个算法的框架，但并不一定给出全部算法的每一步，因为在不同的情况下，算法中的某些小步可能是不同的，这些不同的小步由不同的子类实现，这样，通过不同的子类就可以实现不同的需求。在模板方法模式下，实现具体的小步的方法称为基本方法，而将这些小步合起来的方法称为模板方法。
最近公司在招前端工程师，我有幸面试了一些应聘者，其中不乏合格的工程师。下面是我给应聘者准备的一些面试题目草稿(这篇文章发了后再面试的话可能就不是这些题目了，哈哈)：
HTML && CSS
1.Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义? 行内元素有哪些？块级元素有哪些？CSS的盒模型？
2.CSS引入的方式有哪些? link和@import的区别?
3.CSS选择符有哪些？哪些属性可以继承？优先级？内联和important哪个优先级高？
4.经常遇到的浏览器的兼容性有哪些？怎么会出现？解决方法是什么？
5.如何居中一个浮动元素?
6.HTML5和CSS3的了解情况
7.你怎么来实现下面这个设计图
Javascript
1.怎样添加、移除、移动、复制、创建和查找节点
2.怎样使用事件以及IE和DOM事件模型之间存在哪些主要差别
3.面向对象编程:b怎么继承a
4.看看下面alert的结果是什么
function b(x, y, a) {
arguments[2] = 10;
alert(a);
}
b(1, 2, 3);
如果函数体改成下面，结果又会是什么？
a = 10;
alert(arguments[2] );
5.请编写一个JavaScript函数 parseQueryString，它的用途是把URL参数解析为一个对象，如：var url = ”http://www.taobao.com/index.php?key0=0&key1=1& key2=2…..”
var obj = parseQueryString(url);
alert(obj.key0) // 输出0
(来自淘宝网校园招聘笔试题)
6.ajax是什么? ajax的交互模型? 同步和异步的区别? 如何解决跨域问题?
7.什么是闭包？下面这个ul，如何点击每一列的时候alert其index?
<ul id=”test”>
<li>这是第一条</li><li>这是第二条</li><li>这是第三条</li>
</ul>
8.最近看的一篇Javascript的文章
9.你如何去实现这个Tabview
10.常使用的库有哪些？常用的前端开发工具？开发过什么应用或组件？
11.性能-Yslow
小结：面试只是一个检测技能的手段，我个人更看重面试者分析问题和解决问题的能力以及对前端的热爱。
关于网站的可访问性，Wikipedia的描述是“可访问性是一个产品、设备、服务或环境可以被大多人访问的一个通用的规则”，不论是对于什么样的用户或是他们所用的什么设备还是他们处于什么样的环境都要让他们能够直接地访问到你的网页内容。而WAI-ARIA（富互联网应用程序可访问性小组）定义了一种使网页内容更加可访问性的方法
请看这个slide
