возможно заказать разработку или сопровождение, услуги вашего сайта/блога


обновлено: 2016-10-16 в теме: Браузеры -обозреватели
Запросто с WordPress создание и продвижение сайтов ATs media

Тестирование сайта web-инструментами Яндекс.Браузера

Однажды неожиданно для себя рассмотрел браузер Яндекса поближе, а именно его инструментарий для web-разработчика.

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

 

Я, как и многие, крепко привык к старинке: «родному» бардачку Firefox с расширением Firebug и т.п. и ничего не хотел видеть кроме. Однако!.. …тем, которые обеспокоены адаптивной доводкой своего блога, будет полезно ознакомиться возможностями Я.Браузера:


 

консоль отладчика Яндекс Браузера

 

 

Откройте браузер или скрин и посмотрите на полезные дополнения:

 

Ф .2

 

 

консоль отладчика Яндекс браузера

 

 

 

Отличительной особенностью для новичка (и не только) будет наглядная приборная панель! Кстати сказать — тестерами вроде этого и этого я пользуюсь крайне редко, ибо нахожу ощутимые расхождения с реальными девайсами… а в инструментарии браузера-яшки максимально, на мой взгляд, приближено к реалиям; к тому же, коли иметь в виду реальную погрешность, к примеру, настоящего телефона, то всё вообще замечательно — возможна точнейшая доводка геометрики сайта вплоть до 1px и 02% путём стягивания внутреннего консольного окна.

 

Предположим: тестируем примерное отображение сайта на различных планшетах или телефонах…

 

Всё как обычно: открываем браузер — первая клава мыши, выбираем «посмотреть код», выбираем «мобильник» (кнопочка в панели слева) и…

 

 

 

Web-инструменты Яндекс браузера

 

…стягиваем окно тестера… (не браузера)

 

Фото 2 подчёркнуто зелёным: активная шкала в px или (подчерк красным) можно выбрать стандартные расширения виртуальных окон девайсов.

 

А нам остаётся наблюдать, если случится, переломные моменты сайта и экспериментально поправлять тут же в панели ниже — окошко правее (не забывайте сохранять наработки, чтобы перенести в действительный файл стилей — тестер браузера только тестер — поправки не сохраняет).

 

Кроме того…

Чтобы взглянуть на файлы стилей своего сайта, достаточно кликнуть «Sources» (чуть вправо, на фотке выше) и пройти «по папочкам» до нужного файла… Это иногда полезно для того, чтобы тут же отследить какие величины в селекторах CSS конфликтуют.

 

Небольшой прейскурант горячих клавкиных комбинаций…

 

Ctrl+F — искать на странице.

Ctrl+U — исходный код страницы.

Ctrl+Shift+I — открыть код.

 

 

Думаю, пошагово описывать прелести струмента-браузера не имеет смысла: сами разберётесь… Всё в общем-то понятно…

 

Но о факте того, что Яша Browser имеет неплохие инструменты в помощь адаптивной вёрстке, хотелось доложить.

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

И пусть коллеги простят мою некомпетентность, коли я разглядел лихость Я.Б поздновато)

 

вероятно, имеет смысл подписаться (впереди более подробный разбор бардачка интернетинга, в котором великое множество непостигнутого)):

 

 


подписка feedburner Online консультация по настройкам и созданию сайтов на WordPress

 

 


...вопросы в комментариях - помогу, в чём дюжу...
mihalica.ru !


Михаил ATs - владелец блога запросто с Вордпресс - в сети нтернет давным-давно...

...веб разработчик студии ATs media: помогу в создании, раскрутке, развитии и целенаправленном сопровождении твоего ресурса в сети... - заказы, вопросы... разработка...





Нажатия на кнопочки определяют Ваше высокое гражданское сознание

Поделитесь соображениями: Ваши мысли очень важны!

Внимание! Обязательные поля помечены *

  отныне доступен плагин: ats privacy policy ©