Разработка веб-контента для Safari
Safari является полнофункциональным веб-браузером для Mac OS и iOS. Вы не должны добавлять специфичные для Safari тонкие настройки, чтобы заставить Ваш веб-сайт работать с Safari или заставить Ваш веб-сайт работать над основанными на iOS устройствами. Если Вы разрабатываете свой веб-сайт с помощью стандартов W3C для HTML, CSS и JavaScript, и не полагаетесь на сторонние плагины, пользователи могут просмотреть и взаимодействовать с веб-сайтом с помощью Safari на всех поддерживаемых платформах.
Создание веб-сайтов работать с Safari является просто первым шагом, как бы то ни было. Это должна быть Ваша цель оптимизировать веб-сайты для создания лучшего опыта для всех пользователей, включая людей, использующих Safari на карманных устройствах с сенсорными экранами. Используйте CSS для изменения расположения веб-сайта в портрете или альбомных режимах, например; добавьте поддержка жеста и касание; анимируйте изменения в свойствах CSS для пользователей Safari и т.д.
Сразу
Существует три основных области для фокусирований на при создании веб-контента для Safari:
Удостоверьтесь, что Ваш веб-сайт совместим с Safari.
Улучшите пользовательский опыт в Safari, особенно на мобильных устройствах.
Лучше всего используйте динамичное изменение сетевой пропускной способности при поставке аудио и видео.
То, чтобы заставлять его работать
Safari имеет массив встроенных инструментов для того, чтобы быстро определить несовместимости и отладить проблемы. Если Вы имеете веб-сайт и выполнение, и получаете жалобы, что сайт не работает с Safari, это обычно из-за одной из следующих проблем:
Сайт использует расширения Internet Explorer, которые не поддерживают другие браузеры.
Сайт включает носители, сжатые в формат, который не поддерживает Safari.
Сайт полагается на плагины для обработки аудио, видео или анимации.
Используйте Ошибочную Консоль, чтобы сразу идентифицировать и определить местоположение любого неподдерживаемого HTML, CSS или JavaScript, упрощая исправлять.
Существуют совместимые с Safari форматы носителя и методы встраивания для каждого задания. Safari поддерживает аудио носители в AAC, MP3, AIFF и форматах WAVE на всех платформах. Safari поддерживает закодированное использование видео носителей сжатие H.264, обычно используемое в формате MPEG 4, на всех платформах. Карманные устройства поддерживают несколько более ограниченный набор профилей MPEG 4, чем настольные устройства.
Safari на рабочем столе поддерживает плагины. Существуют совместимые версии Safari всех общих плагинов, включая QuickTime, Flash и Silverlight. Safari на iOS не поддерживает плагины. Для создания веб-сайта доступными карманными устройствами использования не полагайтесь на плагины для отображения содержания. Используйте HTML5 <audio> и <video> теги для встраивания аудиофайлов и видеофайлов в поддерживаемых форматах, с нейтрализацией к плагину для более старых браузеров на рабочем столе. Используйте CSS или Холст, чтобы встроить анимацию и создать специальные эффекты.
Улучшение пользовательского опыта
Улучшите опыт пользователя путем обеспечения различных макетов страницы для карманных и настольных устройств с помощью простого CSS и обнаружения JavaScript и расположения CSS. Можно также обнаружить портретную и альбомную ориентацию на карманных устройствах и автоматически переключиться между разметками с помощью изящного CSS и синтаксиса JavaScript.
Просто добавить касание и поддержку жеста путем добавления нескольких обработчиков событий к сайту. Сделайте навигацию проще для пользователей с сенсорным экраном путем создания ссылок достаточно большими для надежного удара с пальцем, и путем окружения ссылок достаточным количеством пробела, чтобы избежать случайно поражать неправильную ссылку. Оставьте пустое поле или граничьте со страницей также, таким образом, пользователь может легко прокрутить экран с пальцем, не касаясь ссылки.
специфичные для iOS улучшения могут превратить Ваш веб-сайт в веб-приложение, ведущее себя как собственное приложение для iOS. Оптимизируйте веб-сайты для iOS путем обеспечения значка для домашнего экрана пользователя путем превращения веб-сайта в полноэкранное веб-приложение, и включением ссылок, набирающих телефонный номер, открывающих приложение Карт или открывающих другие встроенные приложения для iOS.
Используйте кэширование и хранение клиентской стороны, чтобы заставить Ваш веб-сайт работать, даже когда пользователь является оффлайновым, или устройство пользователя теряет сетевое соединение. Safari поддерживает хранение клиентской стороны HTML5 и кэширование, «ленивое» кэширование для оффлайнового чтения и методы для разрешения веб-игр работать оффлайн.
Как использовать этот документ
Можно считать этот документ от начала до конца, или можно перейти к определенной главе для выполнения задачи.
При создании нового веб-сайта и плана поддерживать Safari и устройства на iOS считайте остальную часть глав в порядке.
При изменении существующего веб-сайта для работы с Safari, считайте Создающий Совместимый веб-контент.
Если Вы демонстрируете приложение на своем веб-сайте, считайте Приложения Продвижения с Умными Баннерами Приложения.
При использовании видео на веб-сайте считайте Видео Создания.
Предпосылки
Вам нужно существенное понимание HTML, знакомства с JavaScript и основного понимания CSS для лучшего использования этот документ.
См. также
Веб-инспектор Safari Гуид — Как использовать встроенные инструменты Safari для отладки и оптимизации.
Аудио Safari HTML5 и Видео Руководство — Как встроить аудио и видео, не используя плагины, или при помощи плагина как нейтрализация.
Руководство по Холсту Safari HTML5 — Как добавить сложную анимацию и интерактивные игры к веб-сайту, не используя плагины.
Руководство по Визуальным эффектам CSS Safari — Как улучшить веб-сайты с помощью расширений WebKit для масок, градиентов, отражений, анимации CSS и 3D трансформаций.
Хранение Клиентской стороны Safari и Оффлайновое Руководство по программированию Приложений — Как создать веб-сайты, работающие, когда пользователь является оффлайновым, или которые содержат базы данных клиентской стороны HTML5.
Живой Обзор Потоковой передачи HTTP — Как оптимизировать сетевую пропускную способность для потокового аудио и видео от стандартного веб-сервера.
Safari Ссылка HTML — элементы HTML и атрибуты поддерживается в Safari.
Свойства Safari CSS Reference — CSS и классы поддерживаются в Safari.
Safari Дополнительная Ссылка DOM — События и другие дополнения DOM поддерживается в Safari.