Презентация Вёрстка для iPhone 16 декабря, 2008, Москва онлайн
На нашем сайте вы можете скачать и просмотреть онлайн доклад-презентацию на тему Вёрстка для iPhone 16 декабря, 2008, Москва абсолютно бесплатно. Урок-презентация на эту тему содержит всего 42 слайда. Все материалы созданы в программе PowerPoint и имеют формат ppt или же pptx. Материалы и темы для презентаций взяты из открытых источников и загружены их авторами, за качество и достоверность информации в них администрация сайта не отвечает, все права принадлежат их создателям. Если вы нашли то, что искали, отблагодарите авторов - поделитесь ссылкой в социальных сетях, а наш сайт добавьте в закладки.
Оцените презентацию от 1 до 5 баллов!
- Тип файла:ppt / pptx (powerpoint)
- Всего слайдов:42 слайда
- Для класса:1,2,3,4,5,6,7,8,9,10,11
- Размер файла:7.56 MB
- Просмотров:38
- Скачиваний:0
- Автор:неизвестен
Слайды и текст к этой презентации:
№1 слайд
Содержание слайда: Вёрстка для iPhone
16 декабря, 2008, Москва
№2 слайд
Содержание слайда: Продано более 10 000 000
№3 слайд
Содержание слайда: За следующие 12 месяцев
еще 40 000 000
№4 слайд
Содержание слайда: За следующие 12 месяцев
еще 40 000 000
85% владельцев ходили в интернет
№5 слайд
Содержание слайда: И всё равно нельзя верстать только для iPhone
№6 слайд
Содержание слайда:
№7 слайд
Содержание слайда: Don’t Build for Just One Device
Flickr
№8 слайд
Содержание слайда: Мобильные платформы
Nokia (Symbian) – WebKit
iPhone – WebKit
Android – WebKit
Не так важен сам iPhone как будущее.
№9 слайд
Содержание слайда: Чем отличается от других?
Почти полноценный браузер
№10 слайд
Содержание слайда: Чем отличается от других?
Почти полноценный браузер
Два режима (portrait+landscape)
№11 слайд
Содержание слайда: Чем отличается от других?
Почти полноценный браузер
Два режима (portrait+landscape)
Пальцы очень разные
(хоккеисты и балерины)
№12 слайд
Содержание слайда: Чем отличается от других?
Почти полноценный браузер
Два режима (portrait+landscape)
Пальцы очень разные
Нос
№13 слайд
Содержание слайда: Расписание поездов?
Одну минуту, посмотрю на сайте.
№14 слайд
Содержание слайда: ОГРАНИЧЕНИЯ
№15 слайд
Содержание слайда: Почти Safari, кроме...
Размер приложения не более 10Мб
Кеш для файлов не более 25Кб
Таймаут всего, что исполняется более 5 секунд
Клик неточный, мышки нет
Нет работы с файлами
Flash
№16 слайд
Содержание слайда: Размер экрана
№17 слайд
Содержание слайда: СЛАДКОЕ
№18 слайд
Содержание слайда: Хорошее
Нет Internet Explorer
Нет Internet Explorer и Nokia 1100!!!
AJAX отлично работает
В CSS возможно почти все что известно
Canvas
№19 слайд
Содержание слайда: 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; }
}
№20 слайд
Содержание слайда: Шрифты (Helvetica!)
№21 слайд
Содержание слайда: РАЗНЫЕ САЙТЫ ДЛЯ IPHONE
№22 слайд
Содержание слайда: Не работают
№23 слайд
Содержание слайда: Хотя бы открываются
№24 слайд
Содержание слайда: Оптимизированы
№25 слайд
Содержание слайда: Копируют интерфейс (iUI)
№26 слайд
Содержание слайда: imoviemash.com (iUI)
№27 слайд
Содержание слайда: По какому пути идти?
№28 слайд
Содержание слайда: По какому пути идти?
По правильному!
№29 слайд
Содержание слайда: По какому пути идти?
Вариант оптимизированного сайта
Запоминающийся дизайн
Не ограничены интерфейсом
Красиво
№30 слайд
Содержание слайда: ОПТИМИЗАЦИЯ САЙТА ДЛЯ IPHONE
№31 слайд
Содержание слайда: CSS для iPhone:
CSS для iPhone:
<link media="only screen and (max-device-width: 480px)"
…/>
CSS для всех остальных:
<link media="screen and (min-device-width: 481px)”
…/>
JS:
if (navigator.userAgent.indexOf('iPhone') != -1)
№32 слайд
Содержание слайда: Размер экрана
№33 слайд
Содержание слайда: 60px!: window.scrollTo(0,1)
№34 слайд
Содержание слайда: Различать ориентацию
JS:
currentWidth = window.innerWidth;
var orient = currentWidth == 320 ? "profile" : "landscape";
document.body.setAttribute("orient", orient);
CSS:
body[orient="profile"] {}
body[orient="landscape”] {}
№35 слайд
Содержание слайда:
№36 слайд
Содержание слайда: Трафик
Уменьшение HTTP-запросов
Меньше картинок
Gzip
Кеширование (файлы менее 25Кб)
Аякс (грузить части сайта)
Base64
Избегать фреймворков
№37 слайд
Содержание слайда: Оптимизация изображения
Запретить пользователю увеличивать сайт:
Одинаковый размер шрифта при поворотах:
№38 слайд
Содержание слайда: Юзабилити
Ссылки – кнопки. Большая кликабельная область.
Рекомендуемый шрифт Helvetica
Легкие странички
№39 слайд
Содержание слайда: Полезные мелочи
Звонок по клику: <a href="tel:555-1212">Call Me</a>
По умолчанию в эти поля вводятся числа:
<input name="phone_whatever"
<input name="zip"
Тултипы
№40 слайд
Содержание слайда: Тестировать
iPhoney (дизайн)
ySlow (производительность)
Обычные инструменты веб-разработки
iPhone
№41 слайд
Содержание слайда: Ссылки
Официальная документация: http://developer.apple.com/webapps/
Хороший «хакерский» ресурс http://www.iphonewebdev.com/
Фреймворк с интерфейсом под iPhone:
http://code.google.com/p/iui/
Статья на alistapart:
http://www.alistapart.com/articles/putyourcontentinmypocket
№42 слайд
Содержание слайда: СПАСИБО!
Юрий Артюх,
сайт: http://cssing.org.ua
почта: akella.a@gmail.com
Скачать все slide презентации Вёрстка для iPhone 16 декабря, 2008, Москва одним архивом:
