Инструментарий веб-разработчика под мобильные устройства

    С каждым днем количество веб-сайтов и сервисов под мобильные платформы становится все больше и больше. Я уже как то писал про эмуляторы, а сейчас хочу представить несколько полезных инструментов, начиная от самых простых, показывающих как будет сайт выглядеть на том или ином устройстве, заканчивая различными оптимизаторами контента.

    1. iPhoney


    image
    Данное приложение не является эмулятором в полном смысле этого слова, однако оно быстро может показать, что и как будет выглядеть ваш сайт для разрешения 320 на 480px. Вы сразу увидите, везде ли влезли картинки, не уехал ли тот или иной пиксель куда-то не туда, и как вообще все выглядит по цветам. Ну и можно сделать скриншоты и провести с ними презентацию =)

    2. W3C mobileOK Checker



    image
    Онлайн валидатор вашего сайта, нужен чтобы показать насколько ваш сайт дружен с мобильниками. Проверка проводится в соответствии с вот этим набором тестов.

    3. iPad Peek


    image
    Сервис аналогичный первому, но предназначен для айпада. Использовать лучше в вебкит браузерах, из них все же лучше смотреть в Сафари.

    4. Modify Headers — плагин для Firefox


    image
    Интересный плагин под огнелиса, позволяющий изменять данные таким образом, что создает впечатление, будто мы используем мобильное устройство. Для этого нам надо менять значение User Agent Profile, полный их список можно найти вот тут. Вообще, есть аналогичный плагин под Хром, под названием User-Agent Switcher. Но и это еще не все, так как есть десктопное приложение Fiddler Web Debugger, позволяющее менять HTTP запросы.

    5. Adobe Device Central CS5



    image
    Device Central является частью Adobe Creative Suite. Он позволяет эмулировать поведение HTML страниц и Flash приложений. Отличная штука для тех, кто работает с другими адобвскими приложениями, так как все всегда будет под рукой.

    6. Google Mobilizer


    image
    Простой веб инструмент, который по адресу вашего сайта, загружает весь контент и пытается его сжать. Хорошее средство для улучшения производительности.

    7. Gomez


    image
    Gomez mobile readiness test является анализатором вашего сайта — он ставит оценки по различным шкалам для кода страницы, содержимого, стилей, изображений и прочего. Дает повод призадуматься над тем, что и где можно улучшить. Интересный момент, для проведения теста он требует ввести ваш email, страну, zip code и телефонный номер. Большой брат?

    8. MobiReady


    image
    Так же как и Gomez, MobiReady является онлайн инструментом для аудита вашего сайта, но при этом является более мощным по своим возможностям. Например, он тестирует на соответствие W3C mobileOk tests, проводит HTTP тесты, проверяет качество кода и многое многое другое. Что называется must use.

    9. DotMobi Emulator


    image
    Еще один псевдоэмулятор, главной особенностью которого является возможность посмотреть вид сайта на старых девайсах. При этом требуется ява плагин для браузера.

    10. Opera Mini Simulator


    image
    Завершает нашу 10 эмулятор для, наверное, самого популярно мобильного браузера — Opera Mini. О его популярности говорит тот факт, что он является предустановленным браузером на 120 миллионах мобильных
    устройствах. Так что спасибо тем, кто приложил руку для создания этого отлично эмулятора.

    Источник
    Поделиться публикацией
    Похожие публикации
    AdBlock похитил этот баннер, но баннеры не зубы — отрастут

    Подробнее
    Реклама
    Комментарии 22
    • 0
      Спасибо за подборку!
      Не прожигать же трафик на своём мобильнике, пытаясь понять, правильно ли всё отображается. :)
      • +1
        и не звонить «Вася, посмотри у тебя на айфоне как сайт выглядит?» =)
        Спасибо)
        • 0
          недавно работал с редиректами на уже готовую мобильную версию сайта — и именно так и делали. Сначала я тестировал на айфоне, потом менеджер на блэкберри :)
          • 0
            как это потетично — «Сначала я тестировал на айфоне, потом менеджер на блэкберри :) „
            • +2
              простите, «патетично»
        • 0
          все равно придется, потому что для них делается, а не для эмулей
          • 0
            ну, хотя бы на некоторой начальной стадии…
          • 0
            а что мешает по WiFi соединяться?
            • 0
              например, его отсутствие :)
          • +3
            Кроме того, есть Opera Mobile emulator.
            • +2
              Завершает нашу 10 эмулятор для, наверное, самого популярно мобильного браузера — Opera Mini. [...] Так что спасибо компании Опера, за создание этого отлично эмулятора.
              Компания Opera создала браузер Opera Mini, а MicroEmulator — это проект open-source сообщества, и на него честно стоит ссылка:
              Powered by MicroEmulator, a pure Java implementation of Java 2 Micro Edition in Java 2 Standard Edition licensed under LGPL.
              • –1
                Firefox (+User Agent Switcher +Web Developer +FireBug) больше ничего не надо. Разве что Safari или Chrome для работы с HTML5/CSS3 в WebKit — несмотря на то, что в 4-ой версии фокса всё есть, но на iPhone и Android CSS3 работает только с префиксом -webkit.

                Большинство эмуляторов не способны ничего показать кроме резолюции дисплея. Фонты, языки, особенности браузера — всё это приходится проверять на самих устройствах. Я уже столько собак съел, что пора просить гражданство в Корее…
                • 0
                  Кстати да, тестирование на самих девайсах надо начинать как можно раньше, а то реальность преподносит массу сюрпризов, и очень часто неприятных.
                  • –7
                    Это больше пересказ. Было бы больше текста — было бы переводом.
                    • +2
                      Источник все равно было бы не лишним указать.
                  • 0
                    Всё равно вёрстку в iPoney не колбасит так, как в родном браузере айфона. Разве что флеш не отображает в качестве закоса под девайс ;-)
                    • НЛО прилетело и опубликовало эту надпись здесь
                      • 0
                        Спасибо, как раз на днях собирался искать подобное :)
                        В закладки.
                        • 0
                          Спасибо! Тоже в закладки)
                          Кстати, если сделаете подборку эмуляторов для «таблеток», была бы также крайне признательна.
                          • +1
                            В процессе =) Сейчас обобщаю эту и еще несколько статей, чтобы перевести и опубликовать в Smashing Magazine. Русский вариант будет у меня в блоге. Постараюсь найти как можно больше для «таблеток», так как в этом сейчас пробел.

                          Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.