Как тестировать сайт на совместимость со всеми устройствами

Из собственного опыта делаю вывод: в среднем за 5-6 лет происходит моральное устаревание компьютерной техники, и она ложится на полку или выбрасывается в мусор. Но всё-таки устройствами выпущенными за последних 5 лет люди пользуются. И качественно сделанный сайт должен нормально на них работать.

Если сейчас 2018 год, то нормальный сайт должен работать на устройствах выпущенных от 2013 года и по сегодня. Подумаем над этим. Если у пользователя Персональный Компьютер, выпущенный в 2013 году, то на нем установлен Windows 7, 8 или 10. На таком компьютере Firefox или Chrome автоматически обновятся до самой новой версии. И проблем с совместимостью не будет.

Ну а что делать с телефонами и планшетами на Adroid или iPhone. Не все пользователи умеют устанавливать Opera, у многих вообще нет профиля в GMail, соответственно Google Play для них недоступен. А встроенный браузер связан с версией операционной системы, и не может быть обновлен на более новый.

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

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

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

После прочтения статьи в Википедии о Android я выяснил, что в 2013 году было выпущено версию 4.4.

Сначала скачаем установочную версию Android x86 4.4 по ссылке ниже:

android-x86-4.4-r5.iso

Теперь нужно установить программу "виртуальный компьютер". Лучшая на данный момент такая программа - это Oracle VirtualBox. Ее базовая версия бесплатная и для частного и для коммерческого применения. Загружаем ее с www.virtualbox.org и устанавливаем.

Запускаем ее и создаем новую виртуальную машину:

• Тип Linux
• Версия Other Linux 32 bit
• Без жесткого диска

Теперь открываем настройки и указываем:

• Размер оперативной памьяти 1024Мб
• Чипсет ICH9
• Мышка PS/2
• Включить I/O APIC

• Количество процессоров равное количеству ядер в Вашем компьютере

• Видео память 128 Мб

• Сеть 1 - NAT
• Сетевой адаптер AMD PCNet FAST III

• Без звуковой карты

Теперь создаем новый SATA жесткий диск объемом 4Гб. А также IDE привод для дисков. Вставляем в него файл android-x86-4.4-r5.iso

Запускаем виртуальную машину. Чтобы вывести мышь из виртуальной машины назад в Windows нужно нажать правый <Ctrl>.

В меню с диска выбираем "Installation - Install Android-x86 to harddisk". Создаем новый раздел на весь размер виртуального жесткого диска. Указываем тип файловой системы ext2.

Во всех дальнейших диалогах жмем Yes, кроме "Do you want to intsall EFI GRUB2".

После окончания установки выбираем Reboot. Выключаем виртуальную машину и достаем диск из виртуального привода.

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

Если виртуальная машина "зависнет", то, возможно, она просто перешла в режим ожидания. Чтобы ее пробудить нажмимаем кнопку "Меню":

Чтобы выключить виртуальную машину нажимаем: <Right Ctrl> + H

Я в своей роботе использую для тестирования две виртуальные машины с разными разрешениями. Одна 1024х768х16, другая 320х480х16. Чтобы смотреть страницы на потенциальном смартфоне и планшете.
Итак, настроим виртуальный Android под разрешение 320х480х16. Выключаем виртуальную машину и запускаем снова в режиме отладки Android:

Теперь в Windows создаем новый cmd файл с таким содержанием:

"c:\Program Files\Oracle\VirtualBox\VBoxManage.exe" setextradata "android44" "CustomVideoMode1" "320x480x16"
pause

Где "c:\Program Files\Oracle\VirtualBox\VBoxManage.exe" должно содержать Ваш путь к VirtualBox,  а "android44" должно содержать Ваше имя виртуальной машины с Android.

Запускаем cmd файл. Он должен отработать без ошибок.

Теперь переходим в виртуальную машину с Android и вводим команды
mount -o remount,rw /
mkdir /mnt/sda1
mount -t ext2 /dev/block/sda1 /mnt/sda1
vi /mnt/sda1/grub/menu.lst

Нам откроется файл menu.lst в текстовом редакторе vi. Для начала редактирования нужно нажать i. Для сохранения <Esc>:wq

После "androidboot.hardware=android_x86" дописываем "vga=ask"

После сохранения изменений выполняем:
umount /mnt/sda1

Выключаем виртуальную машину, и включаем снова. После загрузки у нас должен появиться список видео режимов. Находим номер видео режима с разрешением 320x480x16 и вводим его.

Android загрузится с разрешением 320x480x16

Чтобы постоянно не набирать номер видео режима, его можно прописать вместо ask в файле menu.lst, но с префиксом 0x (например vga=0x360)

Также, для лучшего тестирования, можно в настройках Android включить экранную клавиатуру.

Аналогичным способом можно устанавливать в виртуальный компьютер более новые версии Android. Установочные образы Android x86 доступны здесь.

В дальнейших статьях напишу о тестировании сайтов под Mac и iPhone.