Tagged

移动互联网

A collection of 9 posts

mobile

移动端webapp开发必备知识

转载自:移动终端开发必备知识 请尊重版权,转载请注明来源,多谢~~ 移动设备的用户越来越多,每天android手机的激活量都已经超过130万台,所以我们面向移动终端的WebAPP也开始跟进了。本文主要介绍webapp的开发与调试的相关知识和经验,以及给出几种可选的解决方案。 基本概念 CSS pixels与device pixels CSS pixels: 浏览器使用的抽象单位, 主要用来在网页上绘制内容。 device pixels: 显示屏幕的的最小物理单位,每个dp包含自己的颜色、亮度。 等值的 CSS pixels在手机屏幕上占多大的位置,这不是固定的,这取决于很多属性。经过分析和总结,我们可以得出这么一条公式: 1 CSS pixels = (devicePixelRatio)^2 device pixels (^2是平方的意思,至于 devicePixelRatio是什么东西,后面会讲解) 。 PPI/DPI PPI,有时也叫DPI,所表示的是每英寸所拥有的像素(pixel)数目,数值越高,即代表显示屏能够以越高的密度显示图像。

iphone

主流移动设备的屏幕参数

iPhone 5昨夜发布,早上起来看到了一些新iPhone的参数信息,于是好奇历代iPhone的屏幕参数,然后在维基百科发现了大部分主流移动设备的屏幕信息,这比iPhone 5本身给我的惊喜还要大!! 这些信息包括屏幕分辨率、宽高比、ppi、aspect ratio、css pixel ratio等,对我们开发面向移动终端的网站比如响应式设计可以提供比较全面的参考信息。 这里不多罗列,直接访问维基百科的页面吧~~

移动互联网

85个很赞的响应式网页设计

整理自:85 Amazing Showcase of Responsive Web Design 中文原文:85个很赞的响应式网页设计 请尊重版权,转载请注明来源,多谢! 上一篇中我们了解了一下响应式网页设计是什么,现在趁热打铁,来欣赏一些国外的一些很赞的响应式网页设计,看看他们是如何实现对PC端浏览器和移动终端的全面支持的。 想要查看效果很简单,打开这些页面,然后缩放浏览器窗口就可以了——当然,要用 chrome/safari/firefox/opera 等浏览器,IE请绕道~~ 当然,如果你有发现国内有好的类似设计,欢迎推荐! 前端观察 food sense Forefathers Form CMS Havoc Inspired Jet Cooper Filidor Wiese Conferencia Rails Designing With Data The Happy

移动互联网

响应式网页设计

这个话题最近很火爆,我也一直在关注,响应式网页设计和移动互联网密切相关,并因移动终端的丰富和普及而兴盛,并且是一个颇具争议的话题,我今天将和大家探讨下。 上周写了个简单的ppt在组内大概介绍了下,感兴趣的话可以先看下这个PPT。 移动互联网的现状和未来 在说到这个话题前,我们先看下网页设计和前端开发的现状: 全球有超过53亿手机用户(包括传统手机) 国内3G用户超过1亿 iPhone4手机在2010年出货量超过3000万部; iPhone 4S上市前3天卖掉400万部; Android手机每天激活超过50万部; iPad出货量已经超过2.5亿部; 预计到2015年,移动互联网的数据流量将超越桌面端的流量。 。。。 嗯,大家也许已经开始注意到,自己和身边的朋友也都越来越多的用上了iPhone或者android手机或平板——一两年前我们预料的移动互联网时代即将来临,现在已然实现了——我们正处在移动互联网快速发展的时代——已经不再是起步阶段了。 那么,什么是响应式网页设计? 响应式网页设计是Ethan Marcotte在去年5月份提出的一个概念,简而言之,就是一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本。这个概念可以说是是为移动互联网而生的! 或许大家之前会注意到,有很多知名网站都推出了iPhone或针对智能手机的专门网站,比如3g.qq.com、m.taobao.com、ipad.xxx.com等等。。。甚至前端观察之前也尝试过用wordpress插件实现m.qianduan.

mobile

[图表]移动互联网的现状和趋势

国外网站webhostingbuzz发布了最近的移动互联网的现状和未来趋势的图表,很全面,值得一看。 移动互联网是未来的趋势,前端开发们需要跟上了。 html5和css3的时代已经到来,但对于移动互联网,它们显然并不是全部,我们需要了解和做的要更多。 PS:本来想要翻译一下,发现都是些常见的单词,不认识的翻下词典哈,不懂的可以留言来问~~ 来源:http://www.webhostingbuzz.com/blog/2011/10/19/mobile-internet-trends/

mobile css

移动网站开发——CSS

上一篇我们谈到了移动网站中的标签,想必很多人也很想了解Mobile CSS的情况吧,本文将和大家一起探讨移动网站中的CSS标准。 介绍 Mobile css的标准也是有些复杂的,与前一篇文章中提到的类似,之前存在着一个W3C制定的CSS Mobile Profile 1.0以及OMA的WAP CSS 1.0,事实上它们都是CSS 2.1的子集,而且内容非常接近,不同的是,WAP CSS 1.0针对移动设备加入了一些扩展,这些扩展通过-wap-前缀来实现。 后来,W3C将二者进行了整合,吸收了WAP CSS1.0的一些优点,推出了CSS Mobile Prifile 2.0规范,它也是CSS 2.1的一个子集。我们本文将主要讨论这个规范。 CSS Mobile Profile 2.0中的CSS支持 因为这是CSS 2.1的一个子集,那么我们对这个规范的内容应该不会陌生,我们通过这个表格可以很直观的看到CSS

HTML

移动网站开发——标记语言

移动互联网被称为“第五次科技革命”,而随着iPhone和Android等智能手机的日渐流行和iPad等平板电脑的出现,移动互联网的潜力和趋势也愈发显现,针对移动设备的网站开发越来越受到关注,国内很多公司也开始重视面向所有移动设备的网站开发。 一般来说,对于移动网站可以采取两种方式: 专门开发一个独立的移动版本 使用media type和media query控制网站在移动浏览器的表现 本文和下一篇文章将介绍第一种方案,后面的文章将介绍第2种方案。 本文我们先了解一下移动网站的标记语言。 移动网站标记语言的演进 我们先看一下 @AdrianF2E 分享的一张《移动web相关标记语言的演进》的图表,一目了然: 这张图形象的展示了标记语言的发展历程,包括移动网站标记语言。 移动网站开发要比普通的网站开发复杂的多,选择一种用于移动网站的标记语言同样相当纠结。 在最初,WAP论坛(后来和NTT合并,组成OMA,Open Mobile Alliance)创建了一种基于XML的语言,称为WML,这是用于WAP网站的标记语言。它并不是理想的方案,因为它将网站分割为两部分:普通页面使用(X)HTML,而移动网站使用WML。网站开发者想要做一个移动网站也不得不学习一种新的语言而不是转换技术,“一站式”的信条也被打破,用户不能访问他们喜欢的网站并且不得不发现这个网站的WAP版本——如果它们存在的话。另外日本的NTT创建了他们自己的语言cHTML(compact HTML)

Opera

Opera Mini 5 网站开发速记

前几天,Opera宣布其用户已经超过1亿——桌面版和手机版均超过5000万。Opera Mini是一个很优秀的手机浏览器,对手机用户而言,Opera Mini为锅牛般的手机互联网访问提供了更快更好的体验。而最近最让iPhone用户惊喜的是,Opera mini 5通过了水果店的审核,已经可以免费下载。现在Opera mini 5已经发布了对各平台的版本,包括Android/oPhone、Windows mobile、黑莓、Java等,支持绝大部分手机平台。 Opera Mini 5被称为Opera公司的“下一代”手机浏览器,可见它与Opera 10.5x一样,也是一个很重要的里程碑,那么今天就让我们看一看Opera Mini 5对移动网站开发的影响吧。 Opera Mini 5的特性 Opera Mini 5使用Presto 2.4的引擎,渲染能力与Opera Mobile 10(只有Windows Mobile和S60版本)基本持平; 由于Opera的