Редизайн

Обновил внешний вид сайта. Кое что улучшил, а кое что — наоборот.

Сайт стал визуально легче, контрастнее и проще. Конечно, непривычно, но привыкнем.
Ругаться можно в комментариях.

Основная причина смены дизайна — старый просто надоел.
Появилась кнопка «вверх» в правом нижнем углу, более приятное оформление топиков и еще много чего по-мелочи.

Следующая заметка
Чудеса оптимизации
Предыдущая заметка
Оплата через PayPal


Комментарии ()

  1. Wassi Wassinnen 17 мая 2013, 21:40 # 0
    Сложно читать, Вадим. Может быть с непривычки, но все же — пара белый-черный не всегда хороша для восприятия.
    1. Василий Наумкин 17 мая 2013, 21:41 # 0
      Вадим — это кто?
      1. Wassi Wassinnen 17 мая 2013, 21:42 # 0
        Извини, один из подчиненных у меня счастливый обладатель этого имени. :) Василий, конечно же. :)
        1. Wassi Wassinnen 17 мая 2013, 21:44 # 0
          О! Кнопка «Вверх» появилась! :)
    2. Clean 17 мая 2013, 21:51 # 0
      1/font-family: 'Open Sans',sans-serif; -на мой взгляд все портит отход от стандартизации
      У меня шрифт отображается куцо, часть знаков съедается.

      2.Вверху где домашняя страница иконки мелкие, текст так же в хлебных кошках мелкий.

      3.Лого выглядит как обрубок.не сочетается с белым фоном, нет перехода.
      1. Василий Наумкин 17 мая 2013, 23:29 # 0
        1. Убрал
        2. Не согласен
        3. У тебя наверное он просто закэшировался старый. Переименовал файл, должен грузиться обновленный логотип.
        1. Clean 17 мая 2013, 23:33 # 0
          Да, кэш хрома изувечил отображение.
          Сейчас все ОК, мне нравится, хоть и метро интерфейс в стиле Win 8 мне никогда не нравился)
          1. Василий Наумкин 17 мая 2013, 23:36 # 0
            Да это не то, чтобы Metro, просто плоский.

            Округлости и градиенты давно утомили.
      2. Clean 17 мая 2013, 21:53 # 0
        p.s на заметку уверен что знаешь, но тем не мене посоветую сайт проверять еще на валидаторах от w3c.
        validator.w3.org/check?uri=http%3A%2F%2Fbezumkin.ru%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

        jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fbezumkin.ru%2F&profile=css3&usermedium=all&warning=1&vextwarning=&lang=ru

        итп… Удачного реинженеринга проекта =)
        1. Александр Донский 17 мая 2013, 21:55 # 0
          Как на меня, слишком много белого.
          не привычно, но привыкнем
          =)
          1. Михаил 17 мая 2013, 22:04 # 0
            Как то не привычно. Я бы вернул. Тут цвет был контрастнее, более читабельно. Хотя может так нравиться Василию.
            1. Roman Smile 17 мая 2013, 22:38 # 0
              Да, цвет был понасыщеннее. Например, присутствовал фирменный модэксовский зелененький)
            2. Wassi Wassinnen 17 мая 2013, 22:07 # 0
              Может, опрос? :)
              1. Roman Smile 17 мая 2013, 22:42 # 0
                Сайт стал визуально легче, контрастнее и проще.
                Вряд ли прошлый дизайн можно было назвать хоть сколько-нибудь тяжелым, сложным и неконтрастным)
                1. Василий Наумкин 17 мая 2013, 22:44 # 0
                  Надоел.

                  Что мне, второй год с один дизайном сидеть?
                  1. Wassi Wassinnen 17 мая 2013, 22:47 # 0
                    Даже не солидно как-то, второй год-то, да с одним дизайном… **качает головой** :)
                    1. Василий Наумкин 17 мая 2013, 22:50 # 0
                      Перемены — это прикольно.

                      Уверен, новый внешний вид приживется не хуже старого.
                    2. Roman Smile 17 мая 2013, 23:07 # 0
                      Сочетание белого, серого и синего — это цвета Вордпресса))) Не решили ли вы часом переметнуться в соседний лагерь?))

                      1. Василий Наумкин 17 мая 2013, 23:09 # 0
                        А я думал, больше на Metro похоже.

                        Никакого потайного смысла нет, просто — нравится вот такой внешний вид в данный момент.
                  2. Юрий Зюзин 17 мая 2013, 22:48 # 0
                    Я тут новенький, но по моему выразительнее стало.
                    Единственное вверху менюшку бы пожирнее, где
                    Индекс
                    Блоги
                    Расширения
                    Контакты
                    )
                    Но тут дело каждого
                    1. Василий Наумкин 17 мая 2013, 22:51 # 0
                      Вооот!

                      Первый позитивный коммент =)
                    2. Юрий Зюзин 17 мая 2013, 22:53 # 0
                      Кстати цвет теперь у MODx«а ведь как раз черный стал?)
                      я уже в cloud полез, правда пока с Revolution ещё не разобрался)
                      1. Sadykh Sadykhov 18 мая 2013, 00:12 # 0
                        Неплохо так. Пожелания: увеличить шрифт. Не знаю как остальным, но мне удобнее, когда шрифт свободный для глаз, не нагружает зрение. Сначала непривычно, но потом приятно для чтения. Со зрением всё в порядке, если что :)

                        Баги:
                        — отсутствуют хлебные крошки:
                        bezumkin.ru/sections/
                        bezumkin.ru/index.html
                        bezumkin.ru/modx/
                        bezumkin.ru/contacts.html
                        — в общем, на страницах второго уровня :)
                        — иконка домика в хлебных крошках смещена вправо (слева отступ), желательно на уровне с заголовком сделать
                        bezumkin.ru/contacts.html почему текст в левой и в правой колонке отличаются по цвету?
                        bezumkin.ru/ тут вообще чёрная линия ни с чем. Зачем тогда она? :)
                        — опять же, на главной. Если у поста нету краткого описания, то уменьшить отступ от заголовка до информации о посте
                        bezumkin.ru/sections/help/ наведите курсор на «задать вопрос». Следите за иконкой
                        bezumkin.ru/sections/ от заголовка блогов до их описания неплохо бы уменьшить отступы
                        — в блоке «Прямой эфир» неплохо бы делать обрезание текста, чтобы вся информация помещалась в одной строке
                        — в форме добавления комментария первую иконку (жирно) сместить влево, а в самой форме добавить отступы

                        Это так, поверхностно =)
                        1. Sadykh Sadykhov 18 мая 2013, 00:13 # 0
                          Эм, там где ссылки на разделы — были табы, но почему исчезли. Ладно, думаю всё равно поймёте :)
                          1. Василий Наумкин 18 мая 2013, 05:12 # 0
                            Смотри, сколько всего нового нашел, учитывая, что так и было:
                            — текущая страницы не показывается в хлебных крошках. Раньше вместо домика была ссылка «Главная / „
                            — текст в контактах не менялся, всегда так было
                            — на главной черная линия, потому что не показываю крошки и имя страницы. раньше была зеленая.
                            — в блоке “прямой эфир» все как раньше

                            В общем, единственный реальный баг — это иконка в «Задать вопрос». На самом деле, новое оформление отличается от старого не очень сильно.

                            Чуть позже устроим эксперимент — поглядим на старый дизайн, когда привыкнем к новому =)
                            1. Sadykh Sadykhov 18 мая 2013, 08:57 # 0
                              Ну, значит сейчас как-то сильнее в глаза бросается ;) Очень хорошо :)
                          2. Виктор Долгий 18 мая 2013, 02:40 # 0
                            Все ок. Дело привычки. Первые 10 минут пытался понять кто я и где я :) После 10 минут — а что, разве было не так?.. Новый дизайн это всегда хорошо, ибо у автора есть желание заниматься даже им (хотя, вроде 2-ой год работал себе и ничего), это вселяет надежду на будущее)))
                            1. Виталий Батушев 18 мая 2013, 06:19 # 0
                              Мне нравится появившийся «воздух».
                              Замечания прикладываю в виде картинки.
                              1. Василий Наумкин 18 мая 2013, 07:35 # 0
                                Логотип переделал. Главное меню, на мой взгляд, с ним ровно посередине.

                                Хлебные крошки в таком виде мне кажутся абсолютно органичными. Сейчас:
                                домик -> раздел -> подраздел ->
                                имя страницы
                                
                                Будет странно, если
                                имя страницы
                                домик -> раздел -> подраздел ->
                                
                                Куда подраздел показывает? Откуда выходит имя страницы?

                                В общем, выровнял и оставил сверху, как раньше.
                              2. Alex Vakhitov 18 мая 2013, 08:08 # 0
                                Все круто, вообще главное, чтоб тебе нравилось (: а так можно и свои стили подключить если что (:
                                1. Михаил 18 мая 2013, 08:30 # 0
                                  Чуть позже устроим эксперимент — поглядим на старый дизайн, когда привыкнем к новому =)
                                  Вот тут потом все и выяснится)) хотя я бы как то поменял вот это:

                                  Немного что сливается. Т.е. как на логотипах, половина текста белым на черном фоне, половина наоборот.
                                  1. Перетягин Илья 18 мая 2013, 09:35 # 0
                                    1. Цвет текста (704 строчка) попробуй сделать #333333; вместо #111111; — глазу становится приятнее.
                                    2. Белая полоса (верх сайта, логотип) я бы уменьшил по высоте на 15-20%.
                                    3. Очень большой отступ вниз от кнопки «Оставить новый комментарий».
                                    В остальном — стало шикарно, меньше визуализации, больше информативности.
                                    1. Василий Наумкин 18 мая 2013, 09:42 # 0
                                      1. На высоком разрешении #333 очень бледный — я проверял. На старом дизайне был тот же #111.

                                      2. Логотип переделал, должно быть лучше. Немного скукожил полосу.

                                      3. Это из-за невнимательных комментаторов. Если поднять выше — все будут отвечать в корень топика и о email-уведомлениях можно забыть. По этой же причине скрывается форма ответа, нужно кликнуть на кнопку.

                                      Ой, не понял, что ты про отступ снизу. Этот — поправил.
                                    2. Алексей Марченко 18 мая 2013, 10:09 # 0
                                      Отлично, мне нравится. Небольшой баг. Блок «Сайты на MODX» — не работает стрелочка обновления!
                                      1. Алексей Марченко 18 мая 2013, 10:15 # 0
                                        Василий, вот это скорость. — Работает )))
                                        1. Василий Наумкин 18 мая 2013, 10:17 # 0
                                          Все просто — заголовок её перекрывал. Пришлось пока сдвинуть пониже.
                                      2. Alex Vakhitov 18 мая 2013, 12:36 # 0
                                        Как мне кажется еще можно пропорции областей изменить на span9 и span3.
                                        1. Алексей 18 мая 2013, 12:59 # 0
                                          круто получилось
                                          1. Виктор Долгий 18 мая 2013, 13:15 # 0
                                            Коллективная работа! Не часто встретишь такую сплоченность)))
                                            1. Василий Наумкин 18 мая 2013, 15:29 # 0
                                              Местные посетители — лучшая часть сайта :-)
                                            2. Wassi Wassinnen 18 мая 2013, 15:30 # 0
                                              Василий, второй день читаю под новым дизайном. Уже как-то привычно, старый-зеленый кажется чем-то лишним. :) Одно пожелание, которое, думаю, поможет и остальным — добавь «Шрифт +» и «Шрифт -» для увеличения и уменьшения шрифта в
                                              <section id="content">
                                              . Я уверен, что основная масса народу на Безумкине читает, думает и снова читает. Это стало бы отличным дополнением к новому дизайну. Если нужен скрипт — могу поделиться.

                                              Спасибо.
                                              1. Василий Наумкин 18 мая 2013, 15:33 # 0
                                                Делись конечно, прикручу!
                                                  1. Wassi Wassinnen 18 мая 2013, 15:48 # 0
                                                    Еще один момент — для background-image ссылки-логотипа(
                                                    <a class="brand logo" href="/"></a>
                                                    ) задай width 201, иначе обрезается буква «U» в окончании.
                                                    1. Wassi Wassinnen 18 мая 2013, 16:00 # 0
                                                      Этот изъян просматривается только в мозилле. Можно не увеличивать для мозиллы ширину бг, а наоборот уменьшить до 197px.
                                                      1. Wassi Wassinnen 18 мая 2013, 16:06 # 0
                                                        Например, так:

                                                        @-moz-document url-prefix() {
                                                        	.brand logo {
                                                        		width:197px;
                                                        	}
                                                        }
                                                        1. Василий Наумкин 18 мая 2013, 16:27 # 0
                                                          Это мозилла чихать хотела на мои извращения для ретины.

                                                          Решил иначе.
                                                      2. Wassi Wassinnen 18 мая 2013, 16:12 # 0
                                                        Контейнер для увеличения и уменьшения шрифта, в твоем случае, ".span8"

                                                        Прошу прощения.
                                                        1. Василий Наумкин 18 мая 2013, 16:27 # 0
                                                          Ты как для дебила объясняешь. Не переживай, разберусь.
                                                          1. Wassi Wassinen 19 мая 2013, 00:26 # 0
                                                            Ладно тебе. :)

                                                            Сегодня на дачу с женой ездили. Пытался с андроида под всеми браузерами зайти к тебе — не получилось. Главную отображает, но при клике на заголовке статьи или ссылке «Подробнее» никакого эффекта.
                                                            1. Василий Наумкин 19 мая 2013, 06:50 # 0
                                                              Да, с телефона у меня так же, только в новом окне открывает. Пока не понял, что за фигня.
                                                              1. Alex Vakhitov 19 мая 2013, 08:27 # 0
                                                                Если удалить список с фильтрами, то все работает. Но странно вроде по стилям в нем все нормально
                                                                1. Василий Наумкин 19 мая 2013, 08:42 # 0
                                                                  Нет, проблема в том, что span*= на узких экранах становится float:none.

                                                                  Но это родной responsive от bootstrap, не хочется менять. Пытаюсь разобраться дальше.
                                                                  1. Василий Наумкин 19 мая 2013, 09:04 # 0
                                                                    Разобрался с float — всё окей, сам накосячил.
                                                            2. Василий Наумкин 18 мая 2013, 17:50 # 0
                                                              Посмотрел в твой код — всё хорошо, но нет сохранения выбранного размера и еще пары мелочей.

                                                              Поэтому прикрутил готовый плагин, он хранит настройки в store браузера.

                                                              Пробуй, кнопочки регулировки сбоку, под последними комментариями.
                                                              1. Wassi Wassinen 19 мая 2013, 00:27 # 0
                                                                Круть. Возьму на заметку. Не задавался целью хранить настройки, но вещь полезная. :)
                                                      3. Александр Котлов 18 мая 2013, 17:26 # 0
                                                        Намного лучше стало.
                                                        1. Василий Наумкин 18 мая 2013, 17:57 # 0
                                                          Очень рад!
                                                        2. Алексей 18 мая 2013, 18:03 # 0
                                                          Ну не знаю.

                                                          Не очень, похож стал на wp-блоги с базовым шаблоном (обгрызанность какая-то)
                                                          По мне, так получился minimal'истичный дизайн, который попадает в категорию «minimal» именно за минимум офо(р)*мления.

                                                          Хочу старый диз)

                                                          UP:
                                                          * — пропустил букву — исправил
                                                          1. Alex Dmitriyev 18 мая 2013, 19:52 # 0
                                                            Кнопка «вверх» теряет информативность (хотя она в эти миллисекунды уже и не особо нужна :)) при наведении на нее курсора мыши на фоне подвала.
                                                            Мелочь, а в глаз бросилось.
                                                            1. Василий Наумкин 19 мая 2013, 07:01 # 0
                                                              Починил, спасибо!
                                                            2. Сергей Шлоков 18 мая 2013, 23:09 # 0
                                                              Пока писал комментарий (другой), обратил внимание на картинку справа

                                                              Все-таки как-то живее было. Этот дизайн имхо слишком аскетичный. Видимо у Василия настроение не весеннее :)
                                                              1. Василий Наумкин 19 мая 2013, 07:01 # 0
                                                                Василию надоело пялиться на одно и тоже. Ты вот, что, никогда обои на рабочем столе не меняешь?

                                                                Функционал стал только лучше, все элементы на своих местах, изменились только шрифты и цвета. Может, со временем верну какие-то элементы старого дизайна, типа обводки блоков справа, но пока очень нравится, как есть.
                                                                1. Сергей Шлоков 19 мая 2013, 07:28 # 0
                                                                  Ты вот, что, никогда обои на рабочем столе не меняешь?

                                                                  Неа. Привыкаю.
                                                                  А у fancybox`а всё-таки многовато крестиков.
                                                                  <a class="fancybox-item fancybox-close" href="javascript:;" title="Close">
                                                                  <i class="font-icon-remove"></i>
                                                                  </a>
                                                                  Мне кажется [i class=«font-icon-remove»></i] лишний.
                                                                  1. Василий Наумкин 19 мая 2013, 07:37 # 0
                                                                    Fixed.

                                                                    Обрати внимание, в редакторе есть кнопочки code и blockquote. Это для вставки кусков кода, и цитат.
                                                                    1. Сергей Шлоков 19 мая 2013, 08:07 # 0
                                                                      :)) Видимо случайно удалил открывающий blockquote. Поэтому цитата не получилась.
                                                              2. Александр Донский 18 мая 2013, 23:41 # 0
                                                                Василий, у меня медленное соединение, и когда хожу по страницам, на мгновение весь экран делается чОрным
                                                                html {
                                                                background: black;
                                                                }
                                                                1. Алексей 19 мая 2013, 01:28 # 0
                                                                  Хм, html тэгу нельзя задать цвет в настройках браузера? Я так делал, щас копаюсь в настройках, хочу проверить — если

                                                                  html {
                                                                  background: black;
                                                                  }
                                                                  задан явно, будет ли работать данная опция браузера (у меня FF).
                                                                  1. Алексей 19 мая 2013, 01:37 # 0
                                                                    Итог: независимо от значения browser.display.background_color, в приоритете то, что указано в css.
                                                                  2. Василий Наумкин 19 мая 2013, 06:51 # 0
                                                                    Можно убрать, но тогда на коротких страницах из под футера будет торчать белый кусок — тоже не айс.

                                                                    Раньше так и было, верну.
                                                                  3. Антон ХайЭксель 19 мая 2013, 01:28 # 0
                                                                    Старый был приятнее
                                                                    1. Василий Наумкин 19 мая 2013, 07:01 # 0
                                                                      А новый — новее!
                                                                    2. Чикин Артур 19 мая 2013, 08:41 # 0
                                                                      Я думаю кнопки для изменения размера шрифта нужно сдвинуть к началу текста топика. А не в сайдбаре держать.
                                                                      И Хотел бы спросить, может стоит обьеденить страницу:
                                                                      http://bezumkin.ru/profile/settings/
                                                                      и
                                                                      http://bezumkin.ru/user/topics/%username%/
                                                                      Вроде как то лаконичней будет.
                                                                      1. Василий Наумкин 19 мая 2013, 08:44 # 0
                                                                        Свои настройки видит только сам юзер, а топики\комменты — все.
                                                                        Так что, это 2 разные страницы, объединить никак.
                                                                        1. Чикин Артур 19 мая 2013, 09:21 # 0
                                                                          может тогда на странице
                                                                          http://bezumkin.ru/profile/settings/
                                                                          сделать ссылки
                                                                          http://bezumkin.ru/user/topics/%username%/
                                                                          http://bezumkin.ru/user/comments/%username%/
                                                                          Для комфорта?
                                                                      2. Wassi Wassinnen 19 мая 2013, 13:55 # 0
                                                                        «А мне все нравится, нравится, нравится..» © Переврал
                                                                        1. Василий Наумкин 19 мая 2013, 13:59 # 0
                                                                          Ха-ха, я так и знал!
                                                                        2. Сергей Шлоков 19 мая 2013, 15:25 # 0
                                                                          Василий, есть предложение. Для комментариев 2-го и ниже уровня добавлять какой-то значок, чтобы понятно было, где первый уровень, а где ответ на комментарии. Иногда очень сложная геометрия ответов, не разберешься кто-кому отвечает.
                                                                          Например, к классу «comments-list» прикрутить background со стрелочкой или уголок |_
                                                                          1. Василий Наумкин 19 мая 2013, 17:20 # 0
                                                                            Забацал.
                                                                            1. Сергей Шлоков 19 мая 2013, 18:05 # 0
                                                                              Класс.
                                                                              П.С. Странно, нажал ответить на комментарий Забацал, а комментарий ушел в корень. Странно.
                                                                              1. Василий Наумкин 19 мая 2013, 19:38 # 0
                                                                                Нифига, все работает как надо!
                                                                                1. Александр Донский 19 мая 2013, 20:12 # 0
                                                                                  Магия!
                                                                          2. Ганин Роман 19 мая 2013, 22:25 # 0
                                                                            Не сдержался :)
                                                                            1. Виталий Батушев 20 мая 2013, 05:32 # 0
                                                                              Согласен с Романом. А то какое-то заикание Б-безумкин :)
                                                                              1. Василий Наумкин 20 мая 2013, 07:25 # 0
                                                                                Переделал, спасибо!
                                                                              2. Антон Слободчук 20 мая 2013, 00:42 # 0
                                                                                Не слушайте предыдущих ораторов. Этот дизайн намного лучше. Есть вкус, который эволюционирует и определяется мелочами.
                                                                                1. СикретНаме 20 мая 2013, 13:46 # 0
                                                                                  Чего тут спорить-ругаться, действительно, что-то стало лучше, что-то хуже — всё субъективно = ничего не изменилось :0)
                                                                                  1. Михаил 20 мая 2013, 18:45 # 0
                                                                                    В общем я за. Все привыкнется, что упустил, доделается. Главное информация на этом сайте очень нужная и полезная.
                                                                                    1. Сергей Шлоков 20 мая 2013, 19:55 # 0
                                                                                      Обратил внимание, что у меня появился статус Читатель. А какие еще бывают?
                                                                                      П.С. Василий, извини что засираю почту, просто теги пробую. Что-то мне кажется, что слово «Читатель» в моем предложении не выглядит жирным, хотя написано
                                                                                      <b>Читатель</b>
                                                                                      1. Василий Наумкин 20 мая 2013, 20:07 # 0
                                                                                        При изменении коммента почта не приходит, только при создании.

                                                                                        Статусы бывают только читатель, или обычный посетитель. Пока не развивал эту тему.

                                                                                        Ну а с тегами всё окей, достаточно жирно выглядит.
                                                                                        1. Сергей Шлоков 20 мая 2013, 20:19 # 0
                                                                                          А у меня рыжая сволочь показывает как обычный текст. Вот Опера и Хром — честные — действительно достаточно жирненько. :)
                                                                                      2. Abu 20 мая 2013, 22:40 # 0
                                                                                        Дизайн крутой) Однако, черно-белое имхо слишком контрастно, для глаз напряжно, щадящий userscript
                                                                                        " p, h1,h2,h3 {font-family:Verdana; line-height:1.2em;} #content,header,#tab-comments,#tab-tickets {background:#eee;}"
                                                                                        Ну и в логотипе кернинг «be» великоват.
                                                                                        1. Владимир 20 мая 2013, 23:11 # 0
                                                                                          согласен, на глаза давит…
                                                                                        Добавление новых комментариев отключено.