Фреймы
Дата публикации: 17.06.2011
Фреймы — одна из тех функций, использования которых лучше избегать в мобильной разработке. Помню 1997 год (эпоха Microsoft FrontPage) — все радостно пользовались методом фреймов, создавали фиксированные меню и соединяли фреймы между собой ссылками. И это было счастливое время, которое закончилось, когда на сцену вышли поисковые роботы и сразу фреймы стали худшей вещью, которую ты мог сделать на своем сайте. Да, может фоновая музыка на сайте гораздо хуже, но факт остается фактом — использование фреймов сегодня подходит только для сайтов интранет и приложений. Подобную функциональность сегодня может дать намного более универсальный Ajax.
Механизм HTML-фреймов позволяет разделить документ на «n» под-документов, по вертикали и/или по горизонтали. Каждый фрейм является отдельным документом (и это проблема для поисковых роботов) и каждый фрейм управляется отдельной полосой прокрутки (и это уже проблема для мобильного мира).
Мы уже знаем, что даже при большой области просмотра в мобильном устройстве экран все равно остается маленьким. Разделение этого экрана на более мелкие экраны (фреймы) может создать дополнительные трудности. Единственная ситуация, в которой фреймы могут быть полезны — это определение фиксированного тулбара в верхней или нижней части документа. Но и такой вариант по-прежнему создает проблемы с поисковой системой и, кроме этого, многие мобильные браузеры не работают с фреймами.
Как мы увидим позже, в некоторых high-end браузерах фиксированный тулбар может быть заменен плавающим. В браузере iOS есть скроллинг двумя пальцами для прокрутки во фрейме.
Давай я подведу итог: не используй фреймы в мобильной разработке. Встроенный фрейм (или iframe) — современный способ создания фреймов (хоть этот метод и был представлен в Internet Explorer в 1997 году). Тег <iframe> не является частью стандартов XHTML, но, при этом, в мобильных браузерах он дает лучшие результаты, чем фреймы. Сегодня iframes часто используются для размещения рекламы, котороя расположена на стороннем сервере… Если есть возможность — постарайся обходиться без использования iframes, если такой возможности нет — сначала изучи таблицу 6.18, где перечислены браузеры с поддержкой iframes.
| Браузер/ Платформа | Фреймы | iframes |
|---|---|---|
| Safari | Да | Да |
| браузер Android | Да | Да |
| Symbian/S60 | Да | Да |
| Nokia Series 40 | Да в 6-м выпуске Нет до 6-го выпуска |
Да, на устройствах с экраном 240px шириной Нет в выпусках Lite |
| webOS | Да | Да |
| BlackBerry | Да, но показывает их один под другим вертикально. | Да с версии 4.0, Нет до версии 4.0 |
| NetFront | Да с версии 3.4 | Да с версии 3.4 только в некоторых устройствах |
| Openwave (Myriad) | Показывает фреймы как ссылки | Нет |
| Internet Explorer | Да | Да |
| Motorola Internet Browser | Не показывает фреймы на серии v3 и показывает фреймы в более новых устройствах | Нет |
| Opera Mobile | Да | Да |
| Opera Mini | Да с версии 4.0 | Да |
i-mode XHTML
В японских устройствах NTT DoCoMo используется их собственная версия XHTML с основанными на старом cHTML расширениями для XHTML и CSS. Для обслуживания (передачи) файлов i-mode XHTML требуется новый DOCTYPE и кодировка UTF-8 или Shift-JIS (для японских символов). Например, в последней версии первые строки файла будут примерно такими:
<?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/2.3) 1.0//EN" "i-xhtml_4ja_10.dtd">
На время написания этой статьи последней версией i-mode XHTML была 2.3, а есть еще не-XML версия, которая называется i-mode HTML (текущая версия 7.2). i-mode Browser 2.0 — браузер, который присутствует на устройствах, выпущенных после мая 2009 года и он включает последние версии режимов i-mode HTML и XHTML.
Есть отличный англоязычный портал для i-mode Browser версий 1.0 и 2.0 на http://www.nttdocomo.co.jp/english/service/imode/make/content/browser.
Но есть хорошая новость: в последних версиях i-mode HTML и i-mode XHTML поддерживаются практически все теги из XHTML MP. Перечень поддерживаемых атрибутов немного отличается, но многие новые атрибуты и значения доступны в качестве расширений i-mode. Например, у элемента <li> может быть атрибут type со значением circle, числовое текстовое поле ввода определяется при помощи type=»text» и istyle=»3″.
Куда дальше
- следующая — Плагины и расширения
- предыдущая — Таблицы
- содержание