Начальная

Windows Commander

Far
WinNavigator
Frigate
Norton Commander
WinNC
Dos Navigator
Servant Salamander
Turbo Browser

Winamp, Skins, Plugins
Необходимые Утилиты
Текстовые редакторы
Юмор

File managers and best utilites

Проверка того, как будет выглядеть ваш WordPress-сайт на мобильных устройствах. Онлайн эмулятор мобильного устройства


Как протестировать свой сайт на мобильных устройствах

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

Данные инструменты во много раз упростят тестирование вашего сайта на адаптивность, правильность отображения сайта на мобильных устройствах и планшетах.

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

Вам не стоит забывать, что правильно оптимизированный сайт поможет вам заработать, ведь сайты для этого и создаются 🙂

TestiPhone

Это симулятор на основе веб-браузера для быстрого тестирования веб-приложений iPhone.

Screenfly

Протестируйте ваш сайт на различных устройствах, включая ПК, планшетах, ТВ и мобильных телефонах

The Responsinator

Данный сервис спроектирован для того, чтобы вы могли протестировать веб-сайт на различных разрешениях мобильных устройств.

Mobile Phone Emulator

Mobile phone emulator что позволяет проверить отображение любого веб-сайта во многих мобильных телефонах.

ProtoFluid

ProtoFluid упрощает разработку отзывчивых и адаптивных макетов

iPhoney

iPhoney является веб-симулятором iPhone. Он предназначен для разработчиков и дизайнеров которые разрабатывают веб-сайтовы и приложения для iPhone.

ResponsiView

Еще один сервис для тестирования адаптива вашего сайта, пробуйте.

Ripple Emulator

App для Google Chrome, основан на HTML5 поможет разрабатывать приложение и сразу их тестировать.

Resize My Browser

Простой, удобный и красивый «ресайзер» для браузера. Кликните по нужному вам разрешению и Resize My Browser создаст новое окно нужного размера

iPhone Tester

Название говорит само за себя, любители iPhone 😉

Demonstrating Responsive Design Tool

Сервис поможет протестировать адаптивность вашего сайта.

Responsive Test

Тестируйте адаптивные сайты.

Responsivepx

Данный сервис позволяет позволяем вам вводить нужные размеры окна для тестирования вашего сайта на различных устройствах.

Responsivepx

Responsive Test

Mobile Emulator by Brickandmobile

Протестируйте ваш сайт на мобильном телефоне через наш мобильный эмулятор.

Matt Kersley’s Responsive Design Tool

Очередной сервис для тестирования отзывчивого дизайна

CrossBrowserTesting

Данный сервис позволяет протестировать кросс-браузерность макета в десятках браузеров с мгновенным результатам.

Multi-Browser Viewer

Еще один сервис для тестирования кросс-браузерности сайта

Browshot

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

Opera Mini Simulator

pontyk.com.ua

Тестирование мобильной версии сайта без мобильного устройства

Автор: Франсуа Ле Нотр (Francois Le Notre)

Оригинал статьи: https://www.lyontesting.fr/en/testing-mobile-website-without-any-mobile-device-at-what-cost

Перевод: Ольга Алифанова

Эта статья – продолжение статьи Стефана про разнообразие методик для тестирования мобильных приложений в условиях нехватки физических устройств: ‘Как тестировать на мобильных телефонах, не имея телефонов?’

Учитывая, что современные репрезентативные смартфоны стоят недешево, и несмотря на то, что некоторые платформы – например, французская BackMarket – продают их по сниженной цене, очень заманчиво использовать бесплатные и простые способы тестировать мобильные версии сайтов – например, браузерные симуляторы – вместо устройств как таковых.

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

Можно выиграть и больше времени: в ситуации с iOS-платформой и ее XCode IDE запуск симулятора с последними сборками избавляет от проблем с сертификатами, которые требуются для установки сборки на реальное устройство. Если у вас нет минимального представления, что именно нужно делать, то по опыту могу сказать, что решение этих вопросов может занять длительное время – минимум полчаса – и потребовать подключения к процессу коллег, что повышает риски и усложняет зависимости в задаче.

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

Я три года проработал для сайта Net-a-porter.com (группа компаний Yoox) в команде, ответственной за мобильные приложения для iOS и Android. То, чему я научился в плане тестирования без использования физических устройств,  я и изложу в этой статье, посвященной мобильным версиям сайтов.

User Agent

Пример: расширение User Agent Switcher для Chrome

Представьте, что User Agent – это краткий список характеристик, которые браузер отправляет на сервер для авторизации, похожий на паспортные данные: дата рождения, пол, и т. д. Имеющиеся в наличии плагины позволяют легко имитировать специфическую "личность" – сервер может "увидеть" вас как iPhone, хотя вы просматриваете сайт через десктопный Chrome, и покажет вам содержание и форматирование сайта так, как будто вы пользуетесь реальным смартфоном. Позволяющий это полезный плагин User Agent Switcher доступен в магазине Chrome.

Достоинство этого инструмента – это возможность быстро протестировать текстовые поля и, тестируя локализацию, найти непереведенные участки текста и места, где текст вообще не отображается.

Однако он только имитирует отображение для определенной платформы, и неверно масштабирует дисплей. В результате проверить, к примеру, длинные названия полей на немецком и убедиться, что они не ломают верстку или расположение кнопок, довольно сложно.

Преимущества

  • Быстрая проверка текстов на сайте (переводы, юридическая информация…)

Недостатки

  • Нерелевантен для всех прочих тестов, так как зависит от десктопной платформы, не коррелирующей с реальными физическими смартфонами.

Инструменты разработчика

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

Комбинируя эти инструменты с User Agent, можно быстро собрать информацию, которая остается невидимой глазу, если вы тестируете на реальном устройстве: во вкладке "Сеть" будут подсвечиваться отклики сервера, и медленный отклик или пропавшие запросы помогут разобраться в причинах непредвиденного поведения системы. При помощи этих инструментов можно также управлять cookie-файлами, тестируя безопасность.

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

Преимущества:

  • Адаптивные инструменты позволяют быстро протестировать верстку.
  • Легко получить доступ к разнообразным эффективным инструментам.

Недостатки

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

Симулятор

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

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

Стоит, однако, учитывать, что при использовании симулятора вы кликаете мышью на экране, а не используете тап на небольшом дисплее смартфона: соответственно, невозможно получить представление о реальном пользовательском опыте. Кроме того, симуляторы тоже используют ресурсы настольного ПК, и вы не можете судить о скорости отклика, производительности и отклику приложения на тап.

Еще один недостаток симуляторов – это баги, всплывающие в мобильном браузере, но отсутствующие в симуляторе: например, это редиректы URL, затрудняющие доступ к таким страницам, как пользовательское соглашение.

Преимущества

  • Позволяют провести большую часть функционального тестирования – ограничения описаны в разделе недостатков ниже.
  • Можно использовать для smoke-тестирования
  • Улучшают тестовое покрытие, позволяя тестировать на конфигурациях железа, недоступных внутри компании.

Недостатки

  • Зачастую требуют установки целой экосистемы, что может занять много времени: IDE, подписки и учетки для iOS-платформы, одна версия SDK для каждой версии OS, нуждающейся в тестировании.
  • Невозможно оценить пользовательский опыт: отклик на тап, проблемы "толстых пальцев", соответствие расположения элементов друг другу в процессе использования, и т. д.
  • Полагаются на ресурсы компьютера, невозможно оценить реальную производительность.
  • Не дают доступа к всем функциям ОС/устройства/браузера (например, к камере).

Эмулятор

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

Облачные сервисы

Их уже описал Стефан в своей статье, и ими я тоже не пользовался.

Физическое устройство

Не будем забывать про "Геракла" мобильного тестирования, физические устройства!

О чем мы пока не говорили, так это о качестве изображений: симулятор полагается на характеристики вашего настольного монитора, и в результате тяжело обнаружить изображения плохого качества и размытые картинки, которые сразу бросятся в глаза на мобильном экране. Мой опыт общения с iOS показывает, что ресурсы для Retina-дисплеев требуют особого уровня качества (например, для iPad версии 3 и выше) и отличаются от обычных дисплеев (iPad версии 2 и ранее). Это "скрытое" функциональное требование, и про него легко позабыть в юзер-стори, если оно явно не прописано в критериях приемки.

Преимущества

  • Наилучший инструмент для тестов, опирающийся на реальные ресурсы железа и ПО.
  • Позволяет оценить качество изображений.

Недостатки

  • Стоимость устройств, которую необходимо закладывать в бюджет.
  • Необходимость делиться устройствами с другими членами команды может превратиться в "бутылочное горло" проекта: распланируйте управление устройствами внутри команды заранее!

В чем ценность этой статьи?

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

Обсудить в форуме

www.software-testing.ru

Проверка того, как будет выглядеть ваш WordPress-сайт на мобильных устройствах

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

Использование смартфонов в 2012 году, по данным Cisco, составило 81%, потому есть хороший шанс увеличить количество посетителей вашего сайта за счет реализации его мобильной версии.

Однако как проверить работоспособность сайта не только на телефонах с Android, но и на устройствах iOS Ipad, на десктопах и ноутбуках? Возможно, некоторых из этих устройств имеются у вас под рукой – в таком случае вы можете самостоятельно вбить адрес своего сайта в браузер и посмотреть, как будет выглядеть ваш сайт. Однако как протестировать сайты для широкого спектра различных устройств? Ведь не каждый обладает сразу всеми возможными девайсами в своем распоряжении. Не стоит переживать, поскольку выход есть: достаточно воспользоваться эмуляторами мобильных устройств.

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

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

Просмотр сайта с iPad и iPhone

iPad Peek – прекрасный ресурс, позволяющий посмотреть, как будет выглядеть ваш сайт на небольшом экране популярного планшетного устройства от Apple. Также вы можете оценить, как будет работать ваш сайт на iPhone с текущей поддержкой версий 4 и 5.

mobile-preview-ipad-peek

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

Эмулятор разных устройств

Mobile Phone Emulator – еще один бесплатный сервис, позволяющий просматривать и тестировать свой сайт на различных устройствах. У этого эмулятора мобильных устройств в настоящее время имеется поддержка широкого спектра смартфонов от Apple, Samsung, BlackBerry и HTC. Данный сайт – прекрасный выбор для тестирования своего сайта в различных браузерах разных мобильных устройств.

mobile-preview-mobile-emulator

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

Устанавливаем свой собственный размер экрана

Онлайн-сервис Screenfly от Quirk Tools позволяет просматривать свои сайты на разнообразных размерах экрана. В списке доступных устройств значатся не только планшеты и смартфоны, но и также телевизоры, нетбуки и настольные компьютеры с любыми размерами экрана.

mobile-preview-screenfly

Несмотря на то что этот сервис не отображает контур или корпус устройства, он предлагает гораздо больше в плане различных возможностей и размеров экрана. Сервис поддерживает значительное количество разных устройств, включая даже Kindle Fire и Motorola Razr. Самая интересная возможность – ввод своих собственных разрешений экрана для проверки совместимости с некоторым диапазоном экранных размеров.

Opera Mobile Emulator

Это бесплатное десктопное приложение для разработчиков, которые желают проверить работу сайтов в браузере Opera, используемом в многочисленных современных мобильных устройствах.

mobile-preview-opera

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

mobile-preview-opera-phone

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

Плагин MobiLead Magnet

Этот премиум-плагин для WordPress не только позволяет просматривать сайт на небольших экранах iPhone, но также дает возможность сравнить два разных сайта, и затем показать клиентам результаты предполагаемого веб-дизайна.

mobile-preview-mobilead

Эта возможность идеальна при общении с клиентами. Вы можете показать две версии одного сайта – одну дружественную к мобильным устройствам, а вторую обычную, чтобы люди могли сравнить их и увидеть разницу. Когда клиент увидит, как будет выглядеть его сайт на смартфонах, ему будет очень трудно отказаться от вашего предложения по созданию адаптивного дизайна.

С помощью плагина MobiLead Magnet вы можете создавать бесчисленное количество страниц сравнения – для каждого потенциального клиента, к которому вы обращаетесь. Плагин также предлагает возможность отправки по почте своих предложений (лидов) с произвольным сообщением и ссылкой на страницу сравнения, которая покажет людям, как будет выглядеть веб-сайт на мобильном устройстве.

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

Другие тесты совместимости с мобильными устройствами

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

Mobi Ready: получите подробную информацию о том, как ваш сайт выполняется на мобильном устройстве.

Google PageSpeed Insights: определите показатель PageSpeed — метрику, которую использует Google для ранжирования сайтов.

Chrome Dev Tools: выполните мобильную эмуляцию, включая сенсорные действия, в браузере Chrome.

Источник: www.wpkube.com

oddstyle.ru


 

..:::Новинки:::..

Windows Commander 5.11 Свежая версия.

Новая версия
IrfanView 3.75 (рус)

Обновление текстового редактора TextEd, уже 1.75a

System mechanic 3.7f
Новая версия

Обновление плагинов для WC, смотрим :-)

Весь Winamp
Посетите новый сайт.

WinRaR 3.00
Релиз уже здесь

PowerDesk 4.0 free
Просто - напросто сильный upgrade проводника.

..:::Счетчики:::..