Блог Андрея Ереса

Самый полезный хоткей в браузере

Просто попробуйте — ⌘L, вам понравится. Странно, что этот хоткей не прописан ни в одном хелпе к браузеру.

А вот ещё классный хоткей — ⌘G. Нажмите на странице ⌘F (поиск по странице) и запишите поисковую фразу. Теперь, чтобы перейти к следующему результату поиска, нажмите не стрелочку у окошка поиска, а хоткей ⌘G. Круто? А ведь этот хоткей работает не только в браузере, но и во всяких Заметках и Саблаймах, а может и везде, где можно искать.

Пришлите мне ещё классных хоткеев, если знаете. С ними быстрее работается.

Список хоткеев

⌘L — открыть адресную строку.

⌘G — следующий элемент в поиске по странице. ⌘⇧G — предыдущий.

Как снять ретиновый скриншот сайта на обычном мониторе

  1. Открыть сайт в Хроме:
  1. Нажать правой клавишей мыши в пустом месте страницы и в контекстном меню выбрать Inspect.
  1. В веб-инспекторе нажать на иконку с телефоном.
  1. В верхней строке выбрать:
  • Responsive;
  • 1200×700 — нужный размер окна в обычных пикселях;
  • 79% — масштаб просмотра, можно выбрать любой, на скриншот не влияет;
  • DPR: 2.0 — для двойного размера скриншота;
  • остальное оставить как есть — на скриншот не влияет.
  1. Нажать три точки в правом конце верхней строки и в контекстном меню выбрать Capture screenshot.
22 июня   работа   скриншоты

Перевёрстка графика уборки в подъездах

Мы решили устроить небольшую перевёрстку.

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

До, после и процесс:

Не серите в интерфейсах

Мне скинули ссылку на файлообменник. Открываю, а там…

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

Кажется, люди берутся за серый в двух случаях:

  • Хочется сделать модненько.
  • В макете уже каша стилей, приходится как-то разделять слои.

Модненько делается и без серого, а разделять слои надо на картах и схемах, вовсе не на сайтах.

Случаи, когда серый текст оправдан

Показать неактивные элементы интерфейса:

Написать подсказки в поле формы:

Написать подсказки в пустом состоянии страницы:

Пишите в коменты, если что-то забыл.

Решать не задачу, а проблему

История раз

С утра слышу — дети дерутся. Старший кричит: «Отдай, мне надо зубы почистить!». Это младшая забрала тюбик с пастой и не хочет отдавать.

Я: «Тебе же нужен не тюбик, а зубы почистить». Прошу младшую намазать пасту на щётку. Старший чистит зубы, младшая играет с тюбиком. Все довольны.

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

История два

Я сам оказался не умнее.

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

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

Что было неверно. Надо было решать уравнение «Растущий заголовок не сдвигает фильтр», а не «Растущий заголовок умещается в одну строку».

Чек-лист самому себе на будущее

  1. Получить задачу.
  2. Разобраться в проблеме.
  3. Уточнить задачу.
  4. Решить.
Ранее Ctrl + ↓