文档章节

Android Web App官方文档翻译第五章:最佳实践

k
 kim366
发布于 2016/05/13 19:17
字数 908
阅读 4
收藏 0
点赞 2
评论 0

Android Web App官方文档翻译第五章:最佳实践

1. 将来自移动设备的请求重定向到专门为移动端设计的Web版本

有好几种方式可以让你使用服务端的重定向将请求重定向到你的web站点的移动版本上去。最常见的情况是通过“嗅探”(”sniffing”)web浏览器提供的用户代理字符串(User Agent string)。为了确定是否要提供一个你的站点的移动版本,你只需要在User Agent中寻找“mobile”字符串即可,它可以与很多移动设备匹配。如果需要的话,你还可以在用户代理字符串中找到特定的操作系统(比如Android 2.1)。

注意:大屏幕的Android设备需要全尺寸的网站(比如平板电脑),因此在user agent中不包含“mobile”字符串,但它的user agent的其他部分基本是一样的。由于这种情况的存在,你在发送你的站点的移动端页面的时候,一定要确认user agent中是否包含“string”字符串。

2. 使用合适于移动设备的有效的DOCTYPE标记

为移动站点设计的最常见的标记语言是 XHTML Basic。这一标准确保了特定的标记可以在移动设备上有最佳表现。例如,它不支持HTML框架或是嵌套表格,因为这些在移动设备上表现都很糟。除了声明DOCTYPE,还要声明合适的字符编码(比如UTF-8)。

例如:


    
  1. <?xml version=”1.0″ encoding=”UTF-8″?> 
  2. <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML Basic 1.1//EN” 
  3. “http://www.w3.org/TR/xhtml-basic/xhtml-basic11.dtd”> 

一定要确认你的web页面的标记对于已经声明的DOCTYPE来说是有效的。可以使用验证器(validator),比如由http://validator.w3.org提供的一个。

3. 使用viewport 元数据来将页面调整至合适大小

在你的文档的部分,你需要提供元数据来指定你希望如何在浏览器的viewport中呈现你的页面。例如,你的viewport的元数据可以指定浏览器的viewport的高和宽,最初的web页面规模甚至是目标屏幕分辨率(target screen density)。

例如:


    
  1. <meta name=”viewport” content=”width=device-width, initial-scale=1.0, user-scalable=no> 

想要获取更多关于如何为Android设备使用viewport元数据的信息,请阅读Targeting Screens from Web Apps

4. 避免多文件请求

因为移动设备通常比台式机的联网速度慢得多,因此你需要想办法让你的页面尽快加载。一种加速加载方法是避免下载额外文件,比如中的样式表和脚本文件。相反,直接在部分提供CSS或者Javascript即可(如果脚本是在页面加载完以后才用到,那么将其包含在的结束部分也可)。同样,你还可以通过类似于Minify的工具来压缩你的文件。

5. 使用一个垂直的线性布局(Use a vertical linear layout)

在导航页面的时候,要避免让用户左右拖动你的页面。对于用户来说,上下拖动更容易,也让你的页面更简单。

要想知道更多关于如何创建伟大的移动web应用,请看W3C的移动设备最佳实践。要看其他提升站点速度的建议(移动设备和桌面设备都适用),请看Yahoo!的最佳性能 指南以及Google在让web 更快的加速教程。

【编辑推荐】

本文转载自:http://blog.csdn.net/oyangyujun/article/details/44346363

共有 人打赏支持
k
粉丝 1
博文 129
码字总数 0
作品 0
朝阳
[安卓教学] 创建你的第一个安卓应用 - 课程介绍

因为最近在写一个Android App,需要看Google的Android文档,发现他们并没有提供中文文档。感觉不是很重视中国的开发者。本着为了弘扬中国文化(不是非得英文好才能成为好开发)的态度,打算翻...

夜游长空
2014/03/18
0
0
Android 应用兼容性最佳实践 | 中文教学视频

本期中文视频向各位开发者介绍如何现代化您的应用,其中包括 Android O、Android P (预览版) 的新特性、行为变更、应用开发中常见的兼容性最佳实践,以及测试、兼容系统时需要注意的一些事项...

谷歌开发者
07/16
0
0
开源电子书

目录 语言无关类 操作系统 智能系统 分布式系统 编译原理 函数式概念 计算机图形学 WEB服务器 版本控制 编辑器 NoSQL PostgreSQL MySQL 管理和监控 项目相关 设计模式 Web 大数据 编程艺术 ...

zting科技
2017/12/11
0
0
Fanta/free-programming-books-zh_CN

免费的编程中文书籍索引 免费的编程中文书籍索引,欢迎投稿。 国外程序员在 stackoverflow 推荐的程序员必读书籍,中文版。 stackoverflow 上的程序员应该阅读的非编程类书籍有哪些? 中文版...

Fanta
2016/11/14
0
0
Android动态加载jar/dex

Android动态加载jar/dex 前言 在目前的软硬件环境下,Native App与Web App在用户体验上有着明显的优势,但在实际项目中有些会因为业务的频繁变更而频繁的升级客户端,造成较差的用户体验,而...

LiSteven
2013/06/03
0
1
【原创译文】深入理解Android为什么不允许Room数据库对象间(外键)引用

【原创译文】深入理解Android为什么不允许Room数据库对象间(外键)引用 译者zhangphil@csdn注:当我开始使用Android Room技术时候,Room明确禁止对象间外键引用,让我感觉不可思议,也觉得不...

开开心心过
2017/11/24
0
0
[安卓教学] 添加操作栏(Action Bar) - 课程介绍

操作栏是应用(App)的activity最重要的设计元素之一。它提供一些涉及用户界面的功能,通过提供跨不同应用的统一行为,将可以使你的应用让用户立即感觉熟悉。一些关键的功能包括: 为你应用的...

夜游长空
2014/03/24
0
0
Android mock location

Mock Location 简介 借助 mock location, 在测试LBS应用时不必进行路测就可以生成位置数据。 总的来说,使用 mock location 有以下好处: + 可以生成特定的模拟数据而不必真的移动物理设备+...

chenming
2014/04/20
0
0
最美应用-从Android研发工程师的角度之[最美时光]

最美应用-从Android研发工程师的角度之最美时光 @author ASCE1885的 Github 简书 微博 CSDN 最近发现最美应用这样一个网站,它会定期推介一些很有意思的app,作为开发者,每次看到很棒的app...

2tman
2015/08/19
0
0
OSChina 开源周刊第三十三期 —— Node.js 和 io.js 准备合作!

每周技术抢先看,总有你想要的! 开源资讯 Node.js 和 io.js 准备合作!合久必分,分久必合? Nervana 开源深度学习软件,性能超 Facebook、Nvidia产品 B 站建开源工作组 多 APP 使用其开源项...

OSC编辑部
2015/05/09
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

rabbitmq学习记录(五)交换机Exchange-fanout

之前学习的都是一条消息发给一个消费者,下面开始记录如何把一条信息发给多个消费者 这边我们用到了交换机Exchange 交换机模式:fanout 模式特点:生产者把消息发送给Exchange之后,Exchang...

人觉非常君
22分钟前
0
0
sqoop导入数据到Base并同步hive与impala

使用Sqoop从MySQL导入数据到Hive和HBase 及近期感悟 基础环境 Sqool和Hive、HBase简介 Sqoop Hive HBase 测试Sqoop 使用Sqoop从MySQL导入数据到Hive 使用复杂SQL 调整Hive数据类型 不断更新 ...

hblt-j
28分钟前
0
0
Dart 服务端开发 文件上传

clent端使用angular组件 upload_component.html form id="myForm" method="POST" enctype="multipart/form-data"> <input type="file" name="fileData"> <!-- file field --></form>......

scooplol
28分钟前
0
0
apache和tomcat同时开启,乱码问题

tomcat和apache同时开启,会走apache的转发,执行的是AJP/1.3协议。所以在tomcat的配置文件server中, <Connector port="8009" protocol="AJP/1.3" redirectPort="8443" useBodyEncodingForU......

Kefy
44分钟前
0
0
使用ssh-keygen和ssh-copy-id三步实现SSH无密码登录 和ssh常用命令

ssh-keygen 产生公钥与私钥对. ssh-copy-id 将本机的公钥复制到远程机器的authorized_keys文件中,ssh-copy-id也能让你有到远程机器的home, ~./ssh , 和 ~/.ssh/authorized_keys的权利 第一步...

xtof
今天
0
0
orcale 查询表结构

SELECT t.table_name, t.colUMN_NAME, t.DATA_TYPE || '(' || t.DATA_LENGTH || ')', t1.COMMENTS FROM User_Tab_Cols t, User_Col_Comments t1WHERE t.table_name......

wertwang
今天
0
0
Java 之 反射

反射,剖析 Java类 中的 各个组成部分,映射成 一个个 Java对象,多用于 框架和组件,写出复用性高的通用程序。 测试类代码如下: class Person { private String name; public St...

绝世武神
今天
0
0
华为nova3超级慢动作酷玩抖音,没有办法我就是这么强大

华为nova3超级慢动作酷玩抖音,没有办法我就是这么强大!华为nova3超级慢动作酷玩抖音,没有办法我就是这么强大! 在华为最新发布的nova 3手机上,抖音通过华为himedia SDK集成了60fps、超级...

华为终端开放实验室
今天
0
0
多 SSH Key 实现同一台服务器部署多 Git 仓库

本文以以下需求为背景,介绍详细的做法: 需在同一台服务器同时部署两个不同的 Github 仓库(对 Bitbucket 等 git 服务同样适用) root 用户可在远程登录 SSH 后附上预期的 SSH Key 进行 gi...

yeahlife
今天
0
0
003. es6数值的扩展

一、普通扩展 Number 方法,将字符串、数值转为十进制 : Number('0b111') Number.isFinite() 用来检查一个数值是否为有限的:Number.isFinite(15) Number.isNan() 用来检查一个值是否为NaN N...

秋季长青
今天
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部