Добавить в корзинуПозвонить
Найти в Дзене
Serpmonn

Новостной блок с нуля: категории, фавиконы и мультиязычность

Я разрабатываю собственный поисковик — serpmonn.ru. Без рекламы, без слежки, с играми и инструментами. Сайт работает на 40+ языках, и какое-то время на главной странице были новости — простой список: заголовок, источник, дата. Выглядело скучно. Решил переделать. Что было Обычная RSS-лента. Все новости одинаковые, никакой иерархии. Зашёл — увидел список. Ни одна новость не выделялась. Что стало Первое что видит пользователь — главная карточка с большим заголовком и кратким описанием новости. Сразу понятно что важное. Ниже — горизонтальная лента карточек. Можно листать мышкой, пальцем на телефоне или стрелками. На каждой карточке — цветная точка категории. Красная — AI, синяя — Технологии, зелёная — Наука, и так далее. Всего 12 категорий. Не нужно читать текст чтобы понять о чём новость. Рядом с названием источника — маленький фавикон сайта. Сразу видно откуда новость — из BBC, РИА или TechCrunch. При наведении рамка карточки подсвечивается под цвет категории. Мелочь, но делает интерфейс

Я разрабатываю собственный поисковик — serpmonn.ru. Без рекламы, без слежки, с играми и инструментами. Сайт работает на 40+ языках, и какое-то время на главной странице были новости — простой список: заголовок, источник, дата.

Выглядело скучно. Решил переделать.

Что было

Обычная RSS-лента. Все новости одинаковые, никакой иерархии. Зашёл — увидел список. Ни одна новость не выделялась.

Что стало

Первое что видит пользователь — главная карточка с большим заголовком и кратким описанием новости. Сразу понятно что важное.

Ниже — горизонтальная лента карточек. Можно листать мышкой, пальцем на телефоне или стрелками.

На каждой карточке — цветная точка категории. Красная — AI, синяя — Технологии, зелёная — Наука, и так далее. Всего 12 категорий. Не нужно читать текст чтобы понять о чём новость.

Рядом с названием источника — маленький фавикон сайта. Сразу видно откуда новость — из BBC, РИА или TechCrunch.

При наведении рамка карточки подсвечивается под цвет категории. Мелочь, но делает интерфейс живым.

Самое интересное

Новости теперь на языке страницы. Зашёл на русскую версию — получил русские новости. Зашёл на английскую — английские. Работает для всех 40+ языков сайта автоматически.

Итог

Блок из скучного списка превратился в что-то что хочется листать. Иногда именно такие небольшие переработки меняют ощущение от продукта.

Обновлённый новостной блок
Обновлённый новостной блок

serpmonn.ru