QQREADER46B16E53C862D4FB

http://neten.cn/mobile/mobilewebrebuildintroduce2.ppt

一、Mobile web发展历史

二、手机平台

三、手机屏幕分辨率

四、手机浏览器

五、测试工具

六、语言选择

七、Mobile web现况

八、测试结果分享

九、Mobile web2.0展望

一、视频播放

现在网页上流行的在线播放视频基本都是以flash格式呈现的，多年使用下来，flash已经成为网民生活的一部分了。所以当苹果宣布在移动设备平台上与Flash划清界线后，很多人都会无法理解。当然，是好是坏就不在这评论啦，直接讲重点，下面就带大家看看如果不用FLASH，单用HTML5的应用，在线视频可以在网页上表现成什么样子吧。

这个应用叫“sublimeVideo”，通过它，你会看到与FALSH效果一样的在线视频播放。

演示地址：http://jilion.com/sublime/video

二、在线画板

在线画板也不算是什么新鲜的东西，但以前的画板多半是用flash来实现，而基于HTML5技术制作的在线画板又可以做成怎么样呢？可以看看下面的演示地址。

演示地址：http://mugtug.com/sketchpad/

三、可拖动的交互
    HTML页面一直给我的印像都是很静态的，像以下的画面：
    如果这里作为一款小游戏，需要你按先后顺序把右边选框内的答案扔到左边的垃圾桶里，正常做法只能点击每个选框进行选择，比较生硬。一般的解决方法我们会利用FLASH来做出可拖动的效果，把答案拖进垃圾桶内，使这个过程更加生动。不过现在通过HTML5应用也可以实现拖动的效果。

演示地址：http://html5demos.com/drag

四、按标准解析SWF动画文件
    虽然看了以上几个例子会觉得HTML5已经可以完成之前需要flash才能实现的效果，但其实网站还是很需要FLASH的帮助，起码个人觉得短时间内不可能取代。
    现在通过一个叫“Gordon”的应用，可以把SWF文件在HTML5的环竟中按照标准的Flash动画模式播放出来。而且在浏览的时候完全不需要Flash插件，这个应用号称：An open source Flash runtime， 利用JS＋SVG技术实现的Flash运行环境。

演示地址：http://paulirish.com/work/gordon/demos/

http://www.benjoffe.com/code/games/torus/  html5游戏应用

由于历史的原因，各个浏览器在对页面的渲染上存在差异，甚至同一浏览器在不同版本中，对页面的渲染也不同。在W3C标准出台以前，浏览器在对页面的渲染上没有统一规范，产生了差异(Quirks mode或者称为Compatibility Mode)；由于W3C标准的推出，浏览器渲染页面有了统一的标准(CSScompat或称为Strict mode也有叫做Standars mode)，这就是二者最简单的区别。

W3C标准推出以后，浏览器都开始采纳新标准，但存在一个问题就是如何保证旧的网页还能继续浏览，在标准出来以前，很多页面都是根据旧的渲染方法编写的，如果用的标准来渲染，将导致页面显示异常。为保持浏览器渲染的兼容性，使以前的页面能够正常浏览，浏览器都保留了旧的渲染方法（如：微软的IE）。这样浏览器渲染上就产生了Quircks mode和Standars mode，两种渲染方法共存在一个浏览器上。

那么浏览器究竟该采用哪种模式渲染呢？这就引出的DTD，既是网页的头部声明，浏览器会通过识别DTD而采用相对应的渲染模式：

1. 浏览器要使老旧的网页正常工作，但这部分网页是没有doctype声明的，所以浏览器对没有doctype声明的网页采用quirks mode解析。
2. 对于拥有doctype声明的网页，什么浏览器采用何种模式解析，这里有一张详细列表可参考：http://hsivonen.iki.fi/doctype/
3. 对于拥有doctype声明的网页，这里有几条简单的规则可用于判断：对于那些浏览器不能识别的doctype声明，浏览器采用strict mode解析
4. 在doctype声明中，没有使用DTD声明或者使用HTML4以下（不包括HTML4）的DTD声明时，基本所有的浏览器都是使用quirks mode呈现，其他的则使用strict mode解析。
5. 可以这么说，在现有有doctype声明的网页，绝大多数是采用strict mode进行解析的。
6. 在ie6中，如果在doctype声明前有一个xml声明(比如:)，则采用quirks mode解析。这条规则在ie7中已经移除了。

Quirks mode和Standars mode最大的不同就是提现在对盒模式的解释上，这也是我们在js里要注意的地方。
什么是盒模式？ 这是针对块级元素说的，说白了就是把块级元素想像成一个装东西的盒子，而margin,padding,border,width这些css属性构成了盒模式。

在Standars mode中：

元素真正的宽度 = margin-left + border-left-width + padding-left + width + padding-right + border-right-width + margin-right;

在Quirks mode中：

width则是元素的实际宽度，内容宽度 = width – (margin-left + margin-right + padding-left + padding-right + border-left-width + border-right-width)

1. 内联元素 ，例如|等，定义上下边界不会影响到行高（line-height），内联元素距离上一行元素的距离由行高决定，而不是填充或边界。
2. 内联元素（display: inline） 内联元素不需要在新行内显示，而且也不强迫其后的元素换行，如a|em|span等都为内联元素。内联元素可以为任何其他元素的子元素。
3. 浮动元素（无论左或者右浮动）边界不压缩 ，且若浮动元素不声明宽度，则其宽度趋向于0，即压缩到其内容能承受的最小宽度。
4. 如果盒中没有内容，则即使定义了宽度和高度都为100%，实际上只占0% ，因此不会被显示，此点在采取层布局的时候需特别注意。
5. 边界值可为负，其显示效果各浏览器可能不相同。
6. 填充值不可为负。
7. 边框默认的样式（border-style）为不显示（none）。

1．我知道公司对我的工作要求吗？

　　2．我有做好我的工作所需要的材料和设备吗？

　　3．在工作中，我每天都有机会做我最擅长做的事吗？

　　4．在过去的六天里，我因工作出色而受到表扬吗？

　　5．我觉得我的主管或同事关心我的个人情况吗？

　　6．工作单位有人鼓励我的发展吗？

　　7．在工作中，我觉得我的意见受到重视吗？

　　8．公司的使命目标使我觉得我的工作重要吗？

　　9．我的同事们致力于高质量的工作吗？

　　10．我在工作单位有一个最要好的朋友吗？

　　11．在过去的六个月内，工作单位有人和我谈及我的进步吗？

　　12．过去一年里，我在工作中有机会学习和成长吗？

WEB/wap 前端开发工程师
地点：深圳/北京
•计算机专业或相关专业大学本科以上学历，一年以上工作经验, 有wap开发经验者优先考虑
•具有很好的口头和书目的表达和沟通的能力;
•对符合web标准的网站构建有丰富经验，有成功案例，精通结构化语言xhtml、xml与解释性语言css；
•熟练使用Adobe工具: photoshop/dreamweaver
•有一定的审美能力, 对色彩, 视觉感觉, 字体等有一定感觉;
•深入了解并熟练使用html, css, javascript, ajax;
•了解jsp/php语言者优先考虑
•了解HTML5/css3者优先考虑
•腾讯粉丝者优先考虑

http://mparty.qq.com/2010Q1/job/other/other_22.html

也可以发送简历到Hoosinhu#tencent.com

按了网上一些安装还是没用
最后同事说把文件改成rar的后缀，解压，然后在解压文件里面安装，问题解决。

1.相比droid来说颗粒感更差，使用中明显可以看到许多小颗粒。
2.打电话时切换出来有一个电话类型文字没法隐藏的 bug，如图。

3.触摸起来不是很顺畅，不好控制。
4.拍摄的相片过大…可以短信分享但又缺少对相片大小处理的功能。
5.n1自带浏览器对lightbox处理有问题，一直移位，让你根本没办法选中输入框。
6.对传统页面控制有点奇怪，不好控制，在这方面比opera要差很多。.
7.经常会卡住

截屏工具:shoot me
下载地址：http://m.91.com/soft/Android/shootme-0.73.html

User Agent Switcher 0.7.2

The User Agent Switcher extension adds a menu and a toolbar button to switch the user agent of the browser.

在研读JForum源码时遇到过ClickstreamFilter.java过滤来自客户端的每个请求，源码中通过request获取请求头User-Agent信息，来判断当前请求是否来自搜索引擎和机器人。

它的功能体现主要在于，在网站规模达到一定程度时，要求针对不同的浏览客户端进行不同的显示方式，会根据这个字段信息来设置不同用户的不同访问体验。例如，当我们直接访问http://www.google.com时，Google会通过请求头User-Agent消息来判断请求是否来源自手机客户端，从而返回适合于手机浏览的页面回来。
对多种不同客户端请求进行判断提供了依据。

官方地址:
https://addons.mozilla.org/zh-CN/firefox/addon/59

XHTML Mobile Profile 0.5.3

https://addons.mozilla.org/en-US/firefox/addon/1345/?src=api

Firefox does not natively support the mime-type application/vnd.wap.xhtml+xml. This is one of the possible mime-types for XHTML Mobile Profile. This extension adds support for this mime-type. (The other, application/xhtml+xml, is supported…

With version 0.5, support for multipart/mixed content is added. This is not true support, the addon simply removes the HTML from the multipart packaging so that the browser can render it properly.