Hacker News Digest

В статье утверждается, что JavaScript-библиотеки для выбора даты, такие как Pikaday, часто не нужны и могут приводить к ошибкам и брошенным формам. Вместо этого рекомендуется использовать нативные HTML-инпуты: date для дат, time для времени и datetime-local для их комбинации. Эти решения требуют всего одной строки кода, обеспечивают лучшую доступность, производительность и интернационализацию, работают без JavaScript и позволяют браузеру обрабатывать сложные детали.

В качестве альтернатив предлагаются раздельные инпуты для дня, месяца и года (особенно полезно для запоминающихся дат), селекты при ограниченном наборе вариантов и маскированные инпуты с плейсхолдерами. Для улучшения опыта можно использовать атрибуты: inputmode="numeric" для отображения цифровой клавиатуры, maxlength для ограничения ввода, pattern для валидации, autocomplete для автозаполнения и min/max для ограничений диапазона. Автор подчеркивает важность прогрессивного усиления и учета пользователей без JavaScript.

• Пользователи жалуются на нативные пикеры из-за необходимости тысяч кликов, чтобы выбрать дату рождения, и наоборот — кастомные пикеры не позволяют вводить дату текстом.
• Разработчики отвечают, что нативный <input type="date"> не поддерживает форматов вроде «MM/DD/YYYY» и не даёт контроля над UI, а кастомные пикеры не решают проблему с доступностью и не имеют единого UX.
• В итоге спор сводится к тому, что нативный пикер не решает проблему, а кастомный — не решает её лучше.
• Пользователи также жалуются на то, что нативный пикер не позволяет вводить дату текстом, а кастомный — не позволяет вводить дату текстом.
• В итоге, обсуждение сводится к тому, что нативный пикер не решает проблему, а кастомный — не решает её лучше.

Минимальный CSS для приятного сайта включает базовые стили, улучшающие типографику и читаемость. Начните с ограничения ширины медиа-контента: img, svg, video { max-width: 100%; display: block; } предотвращает переполнение. Для типографики используйте system-ui как безопасный шрифт, увеличьте размер до 1.25rem и установите line-height в 1.5 для лучшей читаемости.

Добавьте поддержку тёмной темы через html { color-scheme: light dark; }, но учтите, что пользователям может потребоваться ручное переключение. Ограничьте ширину основного контента с помощью main { max-width: min(70ch, 100% - 4rem); margin-inline: auto; } для оптимальной длины строки в 45–90 символов. Этот подход избегает избыточного кода и обеспечивает адаптивность.

• Обсуждаются минималистичные подходы к CSS, включая сброс стилей, базовые настройки для типографики и ограничения ширины контента для улучшения читаемости.
• Поднимается вопрос о реализации темной темы, важности ручного переключения пользователем и проблемах с "миганием" при загрузке.
• Критикуются стандартные системные шрифты и обсуждаются потенциальные проблемы с их отображением в разных ОС и локалях.
• Упоминаются различные инструменты и философии (например, SSG, Tailwind, Every-Layout) для создания простых и эффективных сайтов.
• Высказывается мнение, что пользователь должен иметь максимальный контроль над стилизацией контента, а не сайт.

Нажмите ' в Firefox — появится быстрый поиск по ссылкам. Начните печатать, нужная ссылка подсветится, Enter — и вы по ней переходите.

Проблема: современные сайты вместо ссылок используют кнопки и div’ы. Обычный поиск (/ или Ctrl+F) их найдёт, но Enter после закрытия панели поиска ничего не делает.

Решение: крошечное расширение Click on Selection with Enter. Оно вешает обработчик keydown на Enter и «кликает» по элементу, в котором находится текущее выделение.

addEventListener('keydown', e => {
  if (e.key !== 'Enter' || e.shiftKey) return;
  const el = getSelection()?.anchorNode?.parentElement;
  if (!el) return;
  el.click();
  getSelection()?.removeAllRanges();
});

Получаем полноценную навигацию с клавиатуры без мыши.

• Участники активно делятся расширениями для навигации без мыши: Vimium, Vimium C, Surfingkeys, Tridactyl, Qutebrowser и ShortCat.
• Подчёркиваются проблемы стандартной клавиатурной прокрутки: полосы прокрутки скрывают контент, а PageUp/PageDown и стрелки ведут себя непредсказуемо.
• Предлагаются «хаки» без расширений: Ctrl+F → Esc → Enter для клика по найденной ссылке в Firefox.
• Упоминаются специализированные инструменты вроде leopard links, BrowseCut, FocusToScroll и собственные микро-расширения.
• Сетуют на то, что большинство сайтов всё чаще перехватывают быстрый поиск и используют кастомные элементы вместо обычных кнопок и ссылок.