Вёрстка для iPhone
16 декабря, 2008, Москва
- Главная
- Разное
- Дизайн
- Бизнес и предпринимательство
- Аналитика
- Образование
- Развлечения
- Красота и здоровье
- Финансы
- Государство
- Путешествия
- Спорт
- Недвижимость
- Армия
- Графика
- Культурология
- Еда и кулинария
- Лингвистика
- Английский язык
- Астрономия
- Алгебра
- Биология
- География
- Геометрия
- Детские презентации
- Информатика
- История
- Литература
- Маркетинг
- Математика
- Медицина
- Менеджмент
- Музыка
- МХК
- Немецкий язык
- ОБЖ
- Обществознание
- Окружающий мир
- Педагогика
- Русский язык
- Страхование
- Технология
- Физика
- Философия
- Химия
- Шаблоны, картинки для презентаций
- Экология
- Экономика
- Юриспруденция
Презентация на тему Вёрстка для iPhone
Презентация на тему Вёрстка для iPhone, предмет презентации: Образование. Этот материал содержит 42 слайдов. Красочные слайды и илюстрации помогут Вам заинтересовать свою аудиторию. Для просмотра воспользуйтесь проигрывателем, если материал оказался полезным для Вас - поделитесь им с друзьями с помощью социальных кнопок и добавьте наш сайт презентаций ThePresentation.ru в закладки!
Слайды и текст этой презентации
Продано более 10 000 000
За следующие 12 месяцев
еще 40 000 000
За следующие 12 месяцев
еще 40 000 000
85% владельцев ходили в интернет
И всё равно нельзя верстать только для iPhone
Don’t Build for Just One Device
Flickr
Мобильные платформы
Nokia (Symbian) – WebKit
iPhone – WebKit
Android – WebKit
Не так важен сам iPhone как будущее.
Чем отличается от других?
Почти полноценный браузер
Чем отличается от других?
Почти полноценный браузер
Два режима (portrait+landscape)
Чем отличается от других?
Почти полноценный браузер
Два режима (portrait+landscape)
Пальцы очень разные
(хоккеисты и балерины)
Чем отличается от других?
Почти полноценный браузер
Два режима (portrait+landscape)
Пальцы очень разные
Нос
Расписание поездов?
Одну минуту, посмотрю на сайте.
ОГРАНИЧЕНИЯ
Почти Safari, кроме...
Размер приложения не более 10Мб
Кеш для файлов не более 25Кб
Таймаут всего, что исполняется более 5 секунд
Клик неточный, мышки нет
Нет работы с файлами
Flash
Размер экрана
СЛАДКОЕ
Хорошее
Нет Internet Explorer
Нет Internet Explorer и Nokia 1100!!!
AJAX отлично работает
В CSS возможно почти все что известно
Canvas
CSS3 и анимация
.divSlide {
-webkit-animation-name: "slide-me-to-the-right";
-webkit-animation-duration: 1s;
}
@-webkit-keyframes "slide-me-to-the-right" { from { left: 0px; }
to { left: 100px; }
}
Шрифты (Helvetica!)
РАЗНЫЕ САЙТЫ ДЛЯ IPHONE
Не работают
Хотя бы открываются
Оптимизированы
Копируют интерфейс (iUI)
imoviemash.com (iUI)
По какому пути идти?
По какому пути идти?
По правильному!
По какому пути идти?
Вариант оптимизированного сайта
Запоминающийся дизайн
Не ограничены интерфейсом
Красиво
ОПТИМИЗАЦИЯ САЙТА ДЛЯ IPHONE
Как узнать iPhone? Handheld?
CSS для iPhone:
…/>
CSS для всех остальных:
Размер экрана
60px!: window.scrollTo(0,1)
Различать ориентацию
JS:
currentWidth = window.innerWidth;
var orient = currentWidth == 320 ? "profile" : "landscape";
document.body.setAttribute("orient", orient);
CSS:
body[orient="profile"] {}
body[orient="landscape”] {}
landscape
profile
Трафик
Уменьшение HTTP-запросов
Меньше картинок
Gzip
Кеширование (файлы менее 25Кб)
Аякс (грузить части сайта)
Base64
Избегать фреймворков
Оптимизация изображения
Запретить пользователю увеличивать сайт:
Одинаковый размер шрифта при поворотах:
Юзабилити
Ссылки – кнопки. Большая кликабельная область.
Рекомендуемый шрифт Helvetica
Легкие странички
Полезные мелочи
Звонок по клику: Call Me
По умолчанию в эти поля вводятся числа:
Тултипы
Тестировать
iPhoney (дизайн)
ySlow (производительность)
Обычные инструменты веб-разработки
iPhone
Ссылки
Официальная документация: http://developer.apple.com/webapps/
Хороший «хакерский» ресурс http://www.iphonewebdev.com/
Фреймворк с интерфейсом под iPhone:
http://code.google.com/p/iui/
Статья на alistapart:
http://www.alistapart.com/articles/putyourcontentinmypocket
СПАСИБО!
Юрий Артюх,
сайт: http://cssing.org.ua
почта: akella.a@gmail.com
Похожие презентации
Обратная связь
Если не удалось найти и скачать презентацию, Вы можете заказать его на нашем сайте. Мы постараемся найти нужный Вам материал и отправим по электронной почте. Не стесняйтесь обращаться к нам, если у вас возникли вопросы или пожелания:
Email: Нажмите что бы посмотреть
Что такое ThePresentation.ru?
Это сайт презентаций, докладов, проектов, шаблонов в формате PowerPoint. Мы помогаем школьникам, студентам, учителям, преподавателям хранить и обмениваться учебными материалами с другими пользователями.