优化Safari上Web内容的显示与性能指南

下载需积分: 7 | PDF格式 | 5.96MB | 更新于2024-07-27 | 97 浏览量 | 举报

"SafariWebContent" 是一份关于如何优化网页内容在Safari浏览器及iOS设备上展示和性能表现的文档。适用于希望创建针对iOS平台的特定网页内容、使用iOS专用样式表或集成原生应用链接的开发者。特别是针对构建自定义web应用程序的人员。文档可能涵盖了以下几个关键知识点： 1. **用户界面体验**：为了确保在桌面和iOS设备上提供良好的用户体验，开发者需要了解如何适应不同屏幕尺寸、触摸交互和设备特性。这可能包括响应式设计、手势识别和优化滚动性能。 2. **HTML5兼容性**：Safari作为一款支持HTML5的浏览器，开发者应熟悉HTML5的新特性和API，如离线存储、媒体元素、Geolocation、Web Workers和Web Storage等，并确保在Safari上的正确运行。 3. **iOS特定的Web内容**：文档可能提供了关于如何编写专为iOS设备优化的代码，例如利用WebKit框架的功能，或者利用CSS3媒体查询来针对不同分辨率的iOS设备进行样式调整。 4. **iOS样式表**：Safari支持一些iOS特有的CSS扩展，如 `-webkit` 前缀的属性，用于实现如圆角、阴影、渐变等效果。开发者需要了解这些扩展并适当地应用到设计中。 5. **iOS原生应用链接**：文档可能会讲解如何通过`smart banners`或者`Universal Links`将网页内容与iOS应用关联，使得用户可以直接从网页打开应用，提高用户体验。 6. **版权和许可**：文档强调了对苹果知识产权的尊重，任何复制、存储或传播内容需遵守苹果的版权规定，但允许个人用途的存储和打印。 7. **技术授权**：虽然文档是为了帮助开发者开发应用于苹果设备的应用，但它明确指出未授予任何技术的明示或暗示许可，表明所有知识产权归苹果公司所有。 8. **Apple相关服务和品牌**：提到的iAd是苹果的广告服务，而iPhone、iPod和iPod touch是苹果的知名产品，文档可能也包含了如何在Safari中集成这些服务的相关信息。这份文档为想要在Safari和iOS平台上提供优质网络体验的开发者提供了宝贵的指南，涵盖了从基础的HTML5语法到iOS特定功能的全面指导。

Refer to Safari reference documents, such as Safari HTML Reference and Safari CSS Reference, for availability

of features on specific platforms.

Follow Good Web Design Practices

You should follow well-established rules of good web design. This section covers a few basic rules that are

critical for Safari. Read Web Page Development: Best Practices for more general advice on designing webpages.

● Add a DOCTYPE declaration to your HTML files.

Preface your HTML files with a DOCTYPE declaration, which tells browsers which specification to parse

your webpage against. See “HTML Basics” (page 95) for how to do this.

● Separate your HTML, CSS, and JavaScript into different files.

Your webpages are more maintainable if you separate page content into distinct files for mark-up,

presentation, and interaction.

● Use well-structured HTML.

You increase cross-platform browser compatibility by running your HTML files through a validator. You

should fix common problems such as missing quotes, missing close tags, incorrect nesting, incorrect

case, and malformed doctype. See http://validator.w3.org or use the validator provided by your web

development tools.

● Be browser independent.

Avoid using the user agent string to check which browser is currently running. Instead, read Object De-

tection to learn how to determine if a browser supports a particular object, property, or method, and

read Detecting WebKit with JavaScript to learn how to detect specific WebKit versions. Also use the W3C

standard way of accessing page objects—that is, use getElementByID("elementName"). Only as a

last resort, use the user agent string as described in “Using the Safari User Agent String” (page 31) to

detect Safari on iOS.

Read “HTML Basics” (page 95) and “CSS Basics” (page 101) for how to write structured HTML and add CSS to

existing HTML.

Use Security Features

Safari on all platforms uses the same SSL implementation to provide end-to-end security. The same encryption

that prevents listening on the wire is just as secure when used in a wireless situation, whether through Wi-Fi,

3G, or EDGE. Specifically, Safari supports:

● SSL 2, SSL 3, and TLS with many popular cipher suites

● RSA keys up to 4096

● HTTPS

Follow Good Web Design Practices

CHAPTER 1

Creating Compatible Web Content

Know iOS Resource Limits

Your webpage performing well on the desktop is no guarantee that it will perform well on iOS. Keep in mind

that iOS uses EDGE (lower bandwidth, higher latency), 3G (higher bandwidth, higher latency), and Wi-Fi

(higher bandwidth, lower latency) to connect to the Internet. Therefore, you need to minimize the size of

your webpage. Including unused or unnecessary images, CSS, and JavaScript in your webpages adversely

affects your site’s performance on iOS.

Because of the memory available on iOS, there are limits on the number of resources it can process:

● The maximum size for decoded GIF, PNG, and TIFF images is 3 megapixels for devices with less than 256

MB RAM and 5 megapixels for devices with greater or equal than 256 MB RAM.

That is, ensure that width * height ≤ 3 * 1024 * 1024 for devices with less than 256 MB RAM.

Note that the decoded size is far larger than the encoded size of an image.

● The maximum decoded image size for JPEG is 32 megapixels using subsampling.

JPEG images can be up to 32 megapixels due to subsampling, which allows JPEG images to decode to

a size that has one sixteenth the number of pixels. JPEG images larger than 2 megapixels are

subsampled—that is, decoded to a reduced size. JPEG subsampling allows the user to view images from

the latest digital cameras.

● The maximum size for a canvas element is 3 megapixels for devices with less than 256 MB RAM and 5

megapixels for devices with greater or equal than 256 MB RAM.

The height and width of a canvas object is 150 x 300 pixels if not specified.

● JavaScript execution time is limited to 10 seconds for each top-level entry point.

If your script executes for more than 10 seconds, Safari on iOS stops executing the script at a random

place in your code, so unintended consequences may result.

This limit is imposed because JavaScript execution may cause the main thread to block, so when scripts

are running, the user is not able to interact with the webpage.

Read “Debugging” (page 89) for how to debug JavaScript on iOS.

● The maximum number of documents that can be open at once is eight on iPhone and nine on iPad.

iOS Note: In iOS 1.1.4 and earlier, the JavaScript execution time was limited to 5 seconds and the size of

allocations to 10 MB. Also, the limit on the size of canvas elements was the same as Safari on the desktop.

In iOS 2.2.1 and earlier, the sum of all of the frames needs to be less than 2 megapixels—that is, width *

height * number of frames ≤ 2 * 1024 * 1024. In iOS 3.0 and later, the limit only applies to one

frame at a time.

You also need to size images appropriately. Don’t rely on browser scaling. For example, don’t put a 100 x

100 image in a 10 x 10 <img> element. Tile small backgrounds images; don’t use large background images.

Know iOS Resource Limits 19

CHAPTER 1

Creating Compatible Web Content

剩余105页未读，继续阅读

guanjunz

粉丝: 0

优化Safari上Web内容的显示与性能指南

js左右滑屏

无需编写任何代码即可创建应用程序：Deepseek-R1 和 RooCode AI 编码代理.pdf

Heric拓扑并网离网仿真模型：PR单环控制，SogIPLL锁相环及LCL滤波器共模电流抑制技术解析,基于Heric拓扑的离网并网仿真模型研究与应用分析：PR单环控制与Sogipll锁相环的共模电流抑

培训机构客户管理系统 2024免费JAVA微信小程序毕设

基于SMIC 40nm工艺库的先进芯片技术,SMIC 40nm工艺库技术细节揭秘：引领半导体产业新革命,smic40nm工艺库 ,smic40nm; 工艺库; 芯片制造; 纳米技术,SMIC 40nm

2013年上半年软件设计师上午题-真题及答案解析

淮南市乡镇边界，shp格式

ROS下的移动机器人路径规划算法：基于强化学习算法DQN、DDPG、SAC及TD3的实践与应用,ROS系统中基于强化学习算法的移动机器人路径规划策略研究：应用DQN、DDPG、SAC及TD3算法,RO

粒子群优化算法精准辨识锂电池二阶RC模型参数：高仿真精度下的SOC估计铺垫,粒子群优化算法精准辨识锂电池二阶RC模型参数：仿真验证与SOC估计铺垫,使用粒子群优化算法（PSO）辨识锂电池二阶RC模型参

selenium环境搭建-谷歌浏览器驱动

最新资源