И смех смехом, но я помню времечко, когда неважно, какой ты дизайнер — ты и полиграфию делал, и фотки ретушировал, и иллюстрашки валил, и юзер-флоу, и упаковку… Почему помню? Потому что вчера это было. Я делал визитки. Очень, должен сказать, интересно было потрясти стариной.
Но это заставило меня задуматься, о скольких вещах нам нужно помнить, чтобы собрать правильный пользовательский опыт. Даже о таких, казалось бы, незначительных, как буквы в адресной строке.
Типа:
https://www.example.com:8080/store/catalog/item.php?category=shoes&size=42#reviewsА с ними всё совсем не просто. Если почитаете оригинал вот этой статьи, то вам станет понятно, что URL состоит из многих частей, которые нужно упаковывать консистентно, сродни токенам дизайн-библиотеки, чтобы сделать его читабельным и продуцирующим меньше ошибок.
Вот несколько советов по работе с урлами, которые вы можете положить к себе в DoD или DESIGN.md для проверки:
— Путь (это домен и всякие слэши) должен указывать на постоянный ресурс или понятную иерархию. Все части пути пишем маленькими буквами и разделяем в едином стиле (например, всегда через дефис, иначе тётушка Клава задолбается переводить пробельчики в %20 и вводить адрес своими большими пальчиками) 💅.
— Если структура сайта поменялась, со старых публичных ссылок нужно обязательно настроить редиректы на новые адреса, иначе мы рискуем терять людей, которые заложили себе старый URL. 🔖
— Для идентификаторов (ID) и понятных названий в ссылках (slugs) стоит продумать логику, чтобы они не менялись со временем. Это про то, что
https://www.megaman.com/blog/4533 (на конце ID) и https://www.megaman.com/blog/fight-for-juice (на конце slug) могут вести на одну и ту же страницу. Да и должны бы всегда это делать, даже если статью переименуют: slug изменится, а ID останется. 🔓— Для дополнительных фильтров и настроек отображения используйте понятные и задокументированные параметры запроса (всё, что идёт после [?] ). Массивы в параметрах всегда передаются одним, чётко задокументированным способом. Все значения из параметров нужно аккуратно раскодировать, проверять на корректность и задавать для них разумные ограничения. 👩💻
— Фрагменты (с решёткой #) лучше оставить исключительно для навигации внутри страницы или работы с состоянием на стороне клиента. 🚫
— Ну и капитанское: В ссылках не должно быть никаких паролей, секретных токенов или личных данных — безопасность превыше всего. 🇺🇸
В общем, принимайте во внимание даже такие мелочи, чтобы сделать взаимодействие максимально приятным! И да пребудет с вами дизайнерская сила.