grabowski.ru

Со временем сайт постепенно разрастался и в итоге разросся настолько, что даже сам владелец иногда приходил в ужас от его структуры. Поэтому при переделке сайта одной из основных задач стала полная ревизия содержимого: что-то оставить как есть, что-то объединить, а что-то удалить.

Сразу становится понятным, что меню должно иметь минимальное количество разделов и располагаться горизонтально сверху. Рисуем очень примерный эскиз и заодно составляем список страниц, чтобы понять, что со всем этим наследием можно сделать:

Наконец определяемся, что сайт будет состоять из пяти разделов, каждый из которых будет иметь своё «лицо» (как это было в предыдущей версии), причём из соображений преемственности лица будут уже знакомыми. Рисуем макет главной страницы:

Не то — лица слишком разные, фоны слишком сложные, а потому меню выглядит каким-то пёстрым и разношёрстным. Возникает идея упростить портреты и по возможности сделать их в одном стиле, а заодно каждый пункт меню выделить своим цветом:

Вот теперь просто прекрасно.

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

После долгих раздумий и сомнений отказываемся от этой идеи и приходим к выводу, что нужно собрать все картинки в кучу и разбить их по годам. Попутно выясняется, что разделу «Go west!» на новом сайте не место, поэтому меню сокращается до четырёх позиций. Рисуем новое меню и смотрим, как можно расположить превьюшки (их пока оставляем того же размера, что и в предыдущей версии):

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

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

Теперь есть и подписи, и даты, но пустоты стало больше. К тому же, это повторение пройденного, а потому не годится. Пробуем сделать превьюшки достаточно большими, чтобы под ними уместились подписи и получилось некое подобие галереи:

Останавливаемся на этом варианте.

В процессе сортировки картинок по годам выясняется, что картинки из раздела «Открытки» должны быть представлены отдельно. Решаем сделать для них отдельный раздел, поэтому меню снова становится пятиместным. И кроме того, делаем фон сайта тёмным, потому что хватит уже белого:

Примеряем эту же сетку на другие разделы, где главную роль играет текст:

Постепенно добираемся до главной страницы и параллельно подбираем иконки для блока «Поделиться в социальных сетях»:

В итоге получаем яркий современный сайт:

Предыдущая (четвёртая) версия:

Третья версия:

Вторая версия:

Первая версия: