С каждым днем количество веб-сайтов и сервисов под мобильные платформы становится все больше и больше. Я уже как то писал про эмуляторы, а сейчас хочу представить несколько полезных инструментов, начиная от самых простых, показывающих как будет сайт выглядеть на том или ином устройстве, заканчивая различными оптимизаторами контента.
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/594/14f/40c/59414f40cba2f268eea82401e76a87b7.jpg)
Данное приложение не является эмулятором в полном смысле этого слова, однако оно быстро может показать, что и как будет выглядеть ваш сайт для разрешения 320 на 480px. Вы сразу увидите, везде ли влезли картинки, не уехал ли тот или иной пиксель куда-то не туда, и как вообще все выглядит по цветам. Ну и можно сделать скриншоты и провести с ними презентацию =)
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/d81/fab/d50/d81fabd505d49ed2cdf7b2b57618f942.jpg)
Онлайн валидатор вашего сайта, нужен чтобы показать насколько ваш сайт дружен с мобильниками. Проверка проводится в соответствии с вот этим набором тестов.
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/eab/16a/e2c/eab16ae2c7732eb79f0c9c7e922cb9cd.jpg)
Сервис аналогичный первому, но предназначен для айпада. Использовать лучше в вебкит браузерах, из них все же лучше смотреть в Сафари.
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/afd/5ad/48c/afd5ad48c1e03b10344110fbc50a4c7e.jpg)
Интересный плагин под огнелиса, позволяющий изменять данные таким образом, что создает впечатление, будто мы используем мобильное устройство. Для этого нам надо менять значение User Agent Profile, полный их список можно найти вот тут. Вообще, есть аналогичный плагин под Хром, под названием User-Agent Switcher. Но и это еще не все, так как есть десктопное приложение Fiddler Web Debugger, позволяющее менять HTTP запросы.
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/6aa/3ae/3c2/6aa3ae3c25dc8dad108f5b6621ddef38.jpg)
Device Central является частью Adobe Creative Suite. Он позволяет эмулировать поведение HTML страниц и Flash приложений. Отличная штука для тех, кто работает с другими адобвскими приложениями, так как все всегда будет под рукой.
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/d78/5bc/a6b/d785bca6bbab30748016ad8ea017b02c.jpg)
Простой веб инструмент, который по адресу вашего сайта, загружает весь контент и пытается его сжать. Хорошее средство для улучшения производительности.
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/6a1/eb1/a27/6a1eb1a27191a1f766b4c134485c65eb.jpg)
Gomez mobile readiness test является анализатором вашего сайта — он ставит оценки по различным шкалам для кода страницы, содержимого, стилей, изображений и прочего. Дает повод призадуматься над тем, что и где можно улучшить. Интересный момент, для проведения теста он требует ввести ваш email, страну, zip code и телефонный номер. Большой брат?
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/ef1/f55/46e/ef1f5546eeede9ba955a589c3edc6077.jpg)
Так же как и Gomez, MobiReady является онлайн инструментом для аудита вашего сайта, но при этом является более мощным по своим возможностям. Например, он тестирует на соответствие W3C mobileOk tests, проводит HTTP тесты, проверяет качество кода и многое многое другое. Что называется must use.
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/cac/d29/5ab/cacd295ab18caa5e5c840c4e167d8670.jpg)
Еще один псевдоэмулятор, главной особенностью которого является возможность посмотреть вид сайта на старых девайсах. При этом требуется ява плагин для браузера.
![image](https://habrastorage.org/r/w780q1/getpro/habr/post_images/ae0/28d/192/ae028d192bc2cb2fab638a7b0672f92d.jpg)
Завершает нашу 10 эмулятор для, наверное, самого популярно мобильного браузера — Opera Mini. О его популярности говорит тот факт, что он является предустановленным браузером на 120 миллионах мобильных
устройствах. Так что спасибо тем, кто приложил руку для создания этого отлично эмулятора.
Источник
1. iPhoney
![image](https://habrastorage.org/getpro/habr/post_images/594/14f/40c/59414f40cba2f268eea82401e76a87b7.jpg)
Данное приложение не является эмулятором в полном смысле этого слова, однако оно быстро может показать, что и как будет выглядеть ваш сайт для разрешения 320 на 480px. Вы сразу увидите, везде ли влезли картинки, не уехал ли тот или иной пиксель куда-то не туда, и как вообще все выглядит по цветам. Ну и можно сделать скриншоты и провести с ними презентацию =)
2. W3C mobileOK Checker
![image](https://habrastorage.org/getpro/habr/post_images/d81/fab/d50/d81fabd505d49ed2cdf7b2b57618f942.jpg)
Онлайн валидатор вашего сайта, нужен чтобы показать насколько ваш сайт дружен с мобильниками. Проверка проводится в соответствии с вот этим набором тестов.
3. iPad Peek
![image](https://habrastorage.org/getpro/habr/post_images/eab/16a/e2c/eab16ae2c7732eb79f0c9c7e922cb9cd.jpg)
Сервис аналогичный первому, но предназначен для айпада. Использовать лучше в вебкит браузерах, из них все же лучше смотреть в Сафари.
4. Modify Headers — плагин для Firefox
![image](https://habrastorage.org/getpro/habr/post_images/afd/5ad/48c/afd5ad48c1e03b10344110fbc50a4c7e.jpg)
Интересный плагин под огнелиса, позволяющий изменять данные таким образом, что создает впечатление, будто мы используем мобильное устройство. Для этого нам надо менять значение User Agent Profile, полный их список можно найти вот тут. Вообще, есть аналогичный плагин под Хром, под названием User-Agent Switcher. Но и это еще не все, так как есть десктопное приложение Fiddler Web Debugger, позволяющее менять HTTP запросы.
5. Adobe Device Central CS5
![image](https://habrastorage.org/getpro/habr/post_images/6aa/3ae/3c2/6aa3ae3c25dc8dad108f5b6621ddef38.jpg)
Device Central является частью Adobe Creative Suite. Он позволяет эмулировать поведение HTML страниц и Flash приложений. Отличная штука для тех, кто работает с другими адобвскими приложениями, так как все всегда будет под рукой.
6. Google Mobilizer
![image](https://habrastorage.org/getpro/habr/post_images/d78/5bc/a6b/d785bca6bbab30748016ad8ea017b02c.jpg)
Простой веб инструмент, который по адресу вашего сайта, загружает весь контент и пытается его сжать. Хорошее средство для улучшения производительности.
7. Gomez
![image](https://habrastorage.org/getpro/habr/post_images/6a1/eb1/a27/6a1eb1a27191a1f766b4c134485c65eb.jpg)
Gomez mobile readiness test является анализатором вашего сайта — он ставит оценки по различным шкалам для кода страницы, содержимого, стилей, изображений и прочего. Дает повод призадуматься над тем, что и где можно улучшить. Интересный момент, для проведения теста он требует ввести ваш email, страну, zip code и телефонный номер. Большой брат?
8. MobiReady
![image](https://habrastorage.org/getpro/habr/post_images/ef1/f55/46e/ef1f5546eeede9ba955a589c3edc6077.jpg)
Так же как и Gomez, MobiReady является онлайн инструментом для аудита вашего сайта, но при этом является более мощным по своим возможностям. Например, он тестирует на соответствие W3C mobileOk tests, проводит HTTP тесты, проверяет качество кода и многое многое другое. Что называется must use.
9. DotMobi Emulator
![image](https://habrastorage.org/getpro/habr/post_images/cac/d29/5ab/cacd295ab18caa5e5c840c4e167d8670.jpg)
Еще один псевдоэмулятор, главной особенностью которого является возможность посмотреть вид сайта на старых девайсах. При этом требуется ява плагин для браузера.
10. Opera Mini Simulator
![image](https://habrastorage.org/getpro/habr/post_images/ae0/28d/192/ae028d192bc2cb2fab638a7b0672f92d.jpg)
Завершает нашу 10 эмулятор для, наверное, самого популярно мобильного браузера — Opera Mini. О его популярности говорит тот факт, что он является предустановленным браузером на 120 миллионах мобильных
устройствах. Так что спасибо тем, кто приложил руку для создания этого отлично эмулятора.
Источник