Перед вами еще один шаг вперед в развитии нашего общего пространства. Новый дизайн содержит в себе массу невидимых пока заготовок на будущее, над которым мы продолжим работать прямо с сегодняшнего дня. Некоторые моменты, как в любом новострое, нам еще предстоит исправить. Не пугайтесь. Все известные и найденные вами недочеты будут опубликованы в этой заметке и будут планомерно устраняться. Но в целом ключевые замечания собраны и исправлены, благодаря самым ярким ММОзговедам, с которыми мы консультировались в последнюю неделю перед выпуском. В любом случае, давайте немного поговорим о новой концепции в целом.

Контент — дизайн
Главной концепцией нового дизайна стала идея сделать акцент на том, что создает автор. Контент — и есть дизайн. Самые яркие пятна в оформлении страницы заметки теперь — это ваши скриншоты, текстовые блоки и выноски. Плюс заглавная иллюстрация становится шапкой. Это означает, что автор может выстроить собственную атмосферу в рамках своего рассказа. И ничего не должно этому мешать.

Заглавная картинка
Обратите внимание на новую функцию: “Превью топика” при создании или редактировании заметки. Авторам предлагается загружать отдельную картинку, которая станет не только заглавной для вашего текста в общей информационной ленте, но и шапкой в основном теле заметки. Учитывая это, вам стоит перейти на формат изображения с большим разрешением. Мы рекомендуем разрешение от 1024 пикселей по горизонтали и выше. До 1920 пикселей. Чем выше разрешение загружаемой заглавной картинки, тем четче она будет выглядеть в шапке. В любом случае, не загружайте картинки меньше, чем 880 пикселей по ширине, в качестве заглавных. Да и не заглавных тоже, на самом деле.

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

Функция “Сообщить об ошибке”
Теперь, чтобы сообщить автору об ошибке или неточности в тексте вам нужно сделать минимум движений: просто выделить нужный текст и нажать Ctrl+Enter. Автору будет отправлено личное сообщение. И так как личное сообщение должно иметь адресата, эта функция доступна только зарегистрированным ММОзговедам. Еще один повод официально вступить в наши ряды.

Параллакс — Лидер Недели
Лидер недели теперь оформляется в формате параллакса. Вы и сами все увидите. Особенно если не будет глючить. Насколько нам известно, пока в Firefox замечена не очень корректная работа этого эффекта, но вы не волнуйтесь — в любом случае в настройках вашего профиля параллакс можно отключить и вместо него будет загружаться статичная картинка. Это может быть полезно также для тех, кто заходит через мобильный интернет. Сэкономит трафик. Хотя я не понимаю, как можно променять такую красоту на трафик, учитывая, что наш параллакс откликается даже на наклон мобильного устройства. Попробуйте.

Сейчас нам придется делать довольно большую работу по подготовке параллаксов для лидеров недели, поэтому мы не обещаем мгновенного их появления. В особенности в ситуациях, когда победа конкретного мира не слишком предсказуема. Но будем стараться делать так, чтобы ваш мир, о котором вы написали материалы, выглядел как можно более эффектно. И снова — это пока выглядит просто небольшим эффектом, но у параллакса на ММОзговеде, надеюсь, большое функциональное будущее.

Поддержка мобильных устройств
Они полноценно поддерживаются. Надеюсь. Ура!

Известные недочеты
  • В содержание спойлера добавляется лишняя строка «Скрытый текст»

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

Читайте также

206 комментариев

avatar
Ура, вы запустились!
Параллакс с GW2 просто отличный.
Больше сказать пока ничего не могу, но спать ухожу счастливой :)
  • +1
avatar
Заметил баг с панелями «Поделиться в соцсетях» и «Яркость/Энергия». На главной странице все нормально, но на странице заметки, где есть фильтр комментариев по рейтингу эти панели сьезжают и накладываются друг на друга. Экран 1366х768. Скриншот прикрепил.


UPD. И еще, не знаю баг или фича, но спойлер как-то странно отображается, жутко маленьким и незаметным. (скрин был под спойлером)
Комментарий отредактирован 2017-06-16 01:29:07 пользователем Laestafer
  • +2
avatar
Панель социальных сетей теперь скрывается при небольшой высоте экрана.
  • +2
avatar
В мобильной версии панель голосования залазит на инфо блок об ошибках в тексте. Может быть из-за разрешения моего телефона.
Комментарий отредактирован 2017-06-16 02:15:33 пользователем RaferX
  • +3
avatar
Отвлекся немного, хочу дополнить предыдущий комментарий. Телефон с HD экраном т. е. 720 на сколько то там и используется Opera Mobile.
Так же хотелось бы что бы у редактора комментариев был расширенный режим со всеми используемыми кнопками тегов. Это будет актуально для новых людей или мало пользующихся комментариями. Картинку в предыдущем сообщении хорошо бы под спойлер спрятать чтобы не захламляла ленту и не потребляла лишний трафик, но кнопки нет а так я не помню как правильно писать тег.
  • 0
avatar
Ура Атрону! Теперь на телефоне от Оконников сайт не скачет как башенный сайгак
Комментарий отредактирован 2017-06-16 08:28:45 пользователем ddemch
  • +2
avatar
Очень круто!
Приятный дизайн.
Очень рад, что не стоите на месте, а продолжаете развиваться.
  • +1
avatar
Спасибо! Мы не собираемся останавливаться. :)
  • 0
avatar
Хорошая работа!
  • 0
avatar
Спасибо! Я очень рад, что нравится. :)
  • 0
avatar
Атрон, а что со счетчиком новых комментариев по всем заметкам (правый фрейм) Теперь там нет… и где смотреть?
Верней, когда появится?
Комментарий отредактирован 2017-06-16 10:10:21 пользователем Devina
  • 0
avatar
Появится в самое ближайшее время. Мне самому без него очень неудобно. Понимаю. :) Он в списке задач.
Комментарий отредактирован 2017-06-16 10:12:32 пользователем Atron
  • +2
avatar
Мне на айфоне в yandex browser неудобно, что теперь нет в правой колонке последних публикаций и комментариев. Долго пытался уменьшить размер страницы и увидеть этот блок, но его нет. Вложенность цитирования/ответов в ветках глубже 5 выстраивает очень узкую колонку. Но тут сказывается моя тотальная нелюбовь к древовидным комментариям (я ещё со времён жж терпеть не могу не форум-стайл комментарии).
  • 0
avatar
Панель «Прямой Эфир» в правой колонке будет первой. Чуть позже изменим.
  • 0
avatar
слишком крупно все
  • 0
avatar
Можно менять размер интерфейса в самом браузере. Например в FireFox это CTRL + / -
Комментарий отредактирован 2017-06-16 11:16:28 пользователем Ieliar
  • 0
avatar
да и в хроме так же. и в вивальди тоже
  • 0
avatar
спасибо конечно. но я считаю, что пользователь не должен такими вещами заниматься.
  • 0
avatar
Очень трудно подстелиться под субъективные предпочтения каждого пользователя.
Старый дизайн был дружелюбен к экранам с маленькими разрешениями (он в 1024 по горизонтали влезал со всеми свистелками)
Но сейчас даже у 15" устройств горизонтальное разрешение под 1400, а у десктопов — 24" это норма и уже давно.

У меня старый дизайн весь занимал треть экрана. Мне было мелко и неудобно. Сейчас — я счастлив.

Ну и старый дизайн на мобильниках тоже тема отдельного потока слёз.
Комментарий отредактирован 2017-06-16 14:15:34 пользователем Gmugra
  • 0
avatar
Блин, я сперва испугалась даже)
А темная тема будет?
  • +3
avatar
Нииеет. :) Переходи на светлую сторону.
  • 0
avatar
Жалко что тёмной не будет… Тоже хотел.
  • +2
avatar
Друзья, текущий лидер недели должен выглядеть вот так:



Если у вас часть картинок не подгружается или по другим причинам выглядит как-то иначе, расскажите нам, какой у вас браузер и операционная система. Ну, и не мучайте свое чувство прекрасного — отключите его вот так:

  • 0
avatar
Я тут подрабатываю обучая пенсионеров интернету и т.п.
И вот знаете, что я скажу…

ИМХО — это отвратительно.
Выглядит вполне современно, то есть — катастрофически не пригодно для использования.

Рамки блёклые, глаз пытается сфокусироваться, но не может.
Размер маржинов-паддингов ужасен: невозможно читать всю ветку — влезают только 2-3 комментария.
Неотцентрировано, как морда пьяного бомжа. Может на 32" 8к экране это и красиво, а вот мне на 15" ноуте как-то не ахти.
Цветовое решение — серость. Давайте ещё советский-зелё… а, кнопочка «добавить» именно про это.
Светло-серый шрифт на белом фоне — это извращение. Чёрный шрифт на светло-сером (если уж мода сегодня в плоской серости) — идеальное решение.
Параллакс — ну люди, ну ****, не все машины это тянут!
Надеюсь, тут хотябы изображение на бэкграунд без параллакса запихнуть можно? А «position: static»? Надо будет проверить, хотя оно всё равно не отцентрировано.

Ненавижу современный интернет за однообразие убогости, которое называют Стилем.

PS: возможно, немного слишком резок в оценках, вчера ставил Убунту. Хочу убивать, особенно дизайнеров. Как UI так и UX, которые кроме как на Маках не работали. Чтоб им в старости очередной супер-модный дизайн осваивать.

UPD:
разные шрифты в редактировании записи и на странице? :\
Комментарий отредактирован 2017-06-16 12:26:24 пользователем wano987
  • 0
avatar
Вы действительно резки. И это не «возможно», а абсолютно точно. Поэтому круто, конечно, что вы выплеснули эмоции за убунту, обливая грязью нашу работу, но диалога здесь не получится. А «советское» — это именно то, что вы сейчас сделали. По сути, а не по форме, которая вещь субъективная.
Комментарий отредактирован 2017-06-16 12:27:22 пользователем Atron
  • 0
avatar
Я просто ненавижу «плохой» дизайн.
«Плохой» значит неэргономичный.
Неэргономичный — это который требует много времени.

Время на освоение + время на работу + время на отдых = время.
Блёклые цвета +время на отдых глаз.
Плоские картинки +время на распознавание образа.

А плохой дизайн — он может быть везде. И в коде и в UX, и в цветовом решении.
И мои уже болящие от серого по белому глаза передают цветовому решению отдельный привет.
  • +2
avatar
Атрон, пусть единичные мнения тебя не расстраивают. Сама являюсь дизайнером (не веб, но тем не менее), и у меня очень развито чувство прекрасного. Новый дизайн отличный, приятный глазу. На моем мониторе выглядит супер. Никаких раздражающих ярких цветов. Кнопочки интуитивно понятны.
Единственное, что я бы поменяла — это цвет полоски яркости — он очень красный, а красный обычно ассоциируется с чем-то опасным или плохим в интернете.(например, минусы за комментарии у нас тоже красные)
  • 0
avatar
Полосок не будет, если ты о боковой панели.
  • 0
avatar
Ну, а по поводу критики — это нормальная ситуация, что дизайн кому-то не нравится. Невозможно сделать дизайн, который понравится всем. Да и допиливать тут еще много чего нужно. Форма донесения мысли — другой вопрос. Но это ж интернет, тут люди «выплескивают». Собственно, я еще в заметке объяснил концепцию, в которой контент авторов и есть основной дизайн. Именно поэтому все умышленно задавлено, чтобы уступить место картинкам, текстовым блокам, заголовкам и выноскам. Думаю, по отступам нам еще предстоит поработать с тонкой настройкой. Надеюсь на помощь конструктивно настроенных и опытных ребят. Каким-то крутым дизайнером я себя не позиционирую, так что умею слушать и воспринимать. :)
  • 0
avatar
Я просто не мог пройти мимо и не запостить это под этот коммент.
Высокодуховным личностям читать не рекомендуется. Очень много ненормативной лексики.
berkem-al-atomi.com/usability-song-in-a-shlensky-manner/
Если чё, это к отзыву товарища wano987, а не к новому дизайну :)
  • 0
avatar
Просто отлично! Спасибо!
  • 0
avatar
Верхний блок, серый, за логотипом, вызывает стойкое ощущение, что там не загрузилось изображение.
Жаль, что не будет темной темы. Белые пласты выжигают глаза, особенно если на них смотреть вечером с планшета.
  • 0
avatar
Проблема контраста есть. И мы над ней еще думаем. Верхняя панель — да, вроде, как серый пока выглядит бедновато. Но не хотелось заниматься просто украшательством. Это тоже направление для развития дизайна.
  • 0
avatar
Эх, никак не могу собраться и переехать с оперы 12. Чинить смысла возможно уже нет, по параллакс выглядит
Скрытый текстСкрытый тексттак

При движении мышью перемещается только верхняя половина картинки.
Комментарий отредактирован 2017-06-16 14:17:08 пользователем FlyNeko
  • 0
avatar
Беги с неё. У нее уже море проблем с безопасностью, совместимостью и производительностью.

Вот тебе новая опера на движке хрома — vivaldi.com/
Старые фишки на новых рельсах.
  • 0
avatar
Да я слышала про него, спасибо.
  • 0
avatar
Ну, я не знаю, что такое опера 12, но в современной опере все прекрасно. В этом плане они молодцы.
  • 0
avatar
Opera 12 это последняя версия Opera на её родном движке (Presto). Потом они перешли на движок от хрома. Это версия 2012 года. Она не поддерживает HTTP/2, актуальные версии протокола TLS, современные технологии веб-разработки. В ней годами никто не правит дыры безопасности. При всей моей любви к этому браузеру пользоваться им сейчас я остро не рекомендую.
Т.е. современная опера это тот же Хром. Причем при переходе он выкинули кучу уникальных и любимых народом особенностей.
Вот эти все особенности и возвращают ребята в Vivaldi
Комментарий отредактирован 2017-06-16 14:32:41 пользователем Gmugra
  • +1
avatar
Я тоже долго сидел на Опере 12, но всё меньше и меньше сайтов на ней работают нормально. Вроде портал Скайфоржа не работал, и я переехал на Firefox. Один раз всё настроил, поставил кучу дополнений, и теперь доволен (а в Опере сразу всё было, не надо было настраивать). Можно даже лишние пункты меню поубирать (с помощью CSS).
  • 0
avatar
Скрытый текстСкрытый тексттест
Комментарий отредактирован 2017-06-16 14:31:19 пользователем FlyNeko
  • +1
avatar
Понял. В содержание спойлера добавляется левый текст. Спасибо.
  • 0
avatar
Уже независимо от браузера, в хроме те же проблемы.
Спойлер не отрисовывается в предпросмотре комментария, и после его редактирования до перезагрузки страницы.
При правке появляются лишние теги

И заголовок дублируется в теле спойлера при каждой правке.
  • 0
avatar
Пара feature request'ов
1. В каком-либо формате сделать список тем с новыми/непрочитанными комментариями. Как прямой эфир, только не последние 10 тем, а все. Весь эфир не подходит, потому что там комментарии не связаны друг с другом, как в дереве внутри темы.
2. Сделать горячую клавишу для перехода к следующему непрочитанному комментарию, как на хабре. Например, там это кнопка F.
  • +3
avatar
Принято.
  • 0
avatar
Спасибо.
Добавлю еще.
Названия страниц, те которые во вкладках отображаются, всегда были в формате «Мир / Название заметки»? Еще до обновления дизайна, в какой-то момент бросилось в глаза, если по одной игре/теме несколько заметок, то все вкладки получаются одинаковыми. Не уверена, что раньше было по другому, но не замечала.
Поле для написания комментария шире самого верхнего уровня комментов. Не мешает, но на первый взгляд выглядит странно.
  • +1
avatar
Формула формирования титула страницы была другой, но мы экспериментируем с SEO. Я понял, что так выходит неудобно. Обсудим. Спасибо.
  • 0
avatar
Формула формирования титула страницы
Кстати, она еще и багованая. Так «У Star Citizen финансовые проблемы?» превратился в «Star Citizen / У финансовые проблемы? / ММОзговед»
  • +1
avatar
О, спасибо!
  • 0
avatar
Редизайн хорош, не без минусов (угловат уж очень, субъективно, небольшой border-radius не помешал бы), но хорош!
  • 0
avatar
А спойлера в комментах так и не появилось :(
  • 0
avatar
Как это? Вон выше обсуждают проблемы спойлеров)
  • 0
avatar
Отличный новый дизайн, очень понравился, хоть и не привычно — сперва подумал, что зашел не на тот сайт. ))
  • 0
avatar
Отдельное спасибо за анимированную кнопочку входящих писем! Теперь не пропустишь новое)
  • +1
avatar
В мобильной версии было бы здорово, если бы заглавная картинка подстраивалась по величине дисплея. Пока что они просто центрируются, а в горизонтальном положении даже по высоте не помещаются на экран.


  • 0
avatar
Я бы вывел картинку к посту как фон блока.
Надо в стилях прописать
background: url(тут ссылка на картинку) center/cover;

Картинка будет масштабироваться и центрироваться.
  • +1
avatar
Картинку обязательно поправим.
  • 0
avatar
Атрон, не думал сделать число с энергией и яркостью кликабельными ссылками на соответствующую страницу?
  • 0
avatar
Да! Именно об этом и думал. Переход в журнал энергии. А раз об этом подумал не только я, значит, обязательно сделаем.
  • +1
avatar
Длина строки довольно-таки большая. Сейчас .container при минимальной ширине в 1170px имеет максимальную ширину в 1370px, если попробовать сделать максимальную ширину в 1170, то появляются отступы слева и справа, создавая «воздух» и немного сужая основную часть. Примерно так, к примеру, сделано на хабре.
  • +1
avatar
Возможно, это неплохая идея, но при этом у нас будет еще больше строк. Подумаем, спасибо.
  • +1
avatar
1370px

Кстати, вот еще кнопка «Создать» и кнопка добавления в избранное при 1370px, не большая проблема, но такое.

Вот при 1170. Может быть тоже не лучшее решение, конечно, нужно думать.
Комментарий отредактирован 2017-06-17 12:55:18 пользователем Fulier
  • 0
avatar
Ещё одна просьба касательно мобильной версии… я привык ориентироваться по сайту через прямой эфир, а теперь до него нужно листать почти в самый низ. Было бы круто иметь какой-нибудь шорткат для него из меню.
  • 0
avatar
Модно, стильно, молодежно, но потеряли свой шарм. Новый дизайн лично мне не нравится, старый был теплее и уютнее. Новый дизайн повторяет 100500 других сайтов. Плюс еще и во многих местах менее удобно. Например, картинки — шапка и картинки к статьям очень большие, теперь на стандартном разрешении 1920х1080 шапка занимает почти весь экран, большие картинки к статьям и шрифты позволяют видеть только одну статью. Также в упор не понимаю эту моду к круглым аватаркам.
Конечно, со временем привыкнется, но…
  • +6
avatar
Причина того что все современные сайты выглядят несколько похоже в том, что «респонсив» дизайн иначе не очень-то сделать можно.
Комментарий отредактирован 2017-06-19 11:08:29 пользователем Andre
  • 0
avatar
Не верю! ©
  • 0
avatar
А с верой вообще что-либо сделать сложно. Я, например, как человек, который над этим дизайном работал, не согласен с Gmugra, хотя бы по той простой причине, что не дизайном сайты похожи, а его отсутствием, на мой взгляд. И мне лично эта тенденция очень нравится, хотя я также работал и над предыдущим, который вам нравится больше. Такие дела. Но есть четкие и логичные установки, которые закладывались в этот дизайн. И среди этих установок действительно больший размер шрифта, что естественным образом ведет к уменьшению текста в одном экране. Но не для того, чтобы сделать для вас неудобнее. А для того, чтобы текст стал не фоном, но дизайном. Чтобы его структура, засечки и красота были хорошо видны. Среди установок этого дизайна действительно большие шапки, которые естественным образом отбирают «полезное пространство», но задают, к примеру, тему текста. Мне, как автору, такой мой текст, снабженный очень атмосферной шапкой, нравится намного больше. Потому что я на создание этого текста потратил намного больше времени, чем тот, кто хочет проскользнуть по нему по диагонали. В этом дизайне большие иллюстрации, но, благодаря величине шрифта, они все же соразмерны тексту. И эти большие иллюстрации — тоже часть того, что я выискивал, бродил, ждал заката, выхватывал нужный кадр, любовался его полноэкранным видом, сжимаемым в прежнем дизайне до 640 пикселей, а открывают картинку далеко не все.

Да — притормозите. Да — не спешите. Да — я об этом. Не о полезной площади. Не о возможности окинуть весь текстовый блок взглядом и быстро перейти к последнему абзацу, где написан вывод. Да, я хочу погружения в текст. Да, с этой мыслью все создавалось. Да, я надеюсь, что авторы будут получать от внешнего вида своих текстов в новом дизайне больше удовольствия. А читатели, которые хотят не побыстрее прочитать, проскроллить, но погрузиться в текст, тоже будут довольны атмосферой нового дизайна. И да, я не думаю, что у меня прямо блестяще получилось, но давайте хотя бы сверим компасы. Хотим ли мы двигаться в одном направлении?
Комментарий отредактирован 2017-06-20 01:06:18 пользователем Atron
  • +2
avatar
Мне кажется, что тексты пишутся для читателей, т.е. дизайн должен идти от того, как это будет читаться, а не как больше радует авторов.

Ради интереса, пошел посмотрел на хабр, потому что вроде как к нему у меня претензий особо нет. Размер шрифта у них 14px, здесь 17, размер заголовков 28 и 36 соответственно. У них шрифт без засечек. При этом погрузиться в текст статьи на хабре мне вполне удается. Я бы даже сказал, что субъективно, хабр читается легче, чем нынешний ммозг. Это при том, что у них там бардак с титульными картинками. Кто как хочет, тот так и делает.

Большие картинки (и да, еще очень большая правая панель) и шрифт с засечками — это по сути все, что сейчас отличает ммозг от хабра и атмосферы, на мой взгляд, не делает.
  • +1
avatar
Лично у меня к размеру шрифта претензий нет, все равно я практически всегда страницу зумлю, а вот межстрочный интервал доставляет дискомфорт. Видимо с непривычки.
  • 0
avatar
И это тоже, да. Сейчас тут просто все очень большое )
  • 0
avatar
Эй, у дизайна есть свои нюансы, и не всем он может нравиться, и я тоже привыкала и приспосабливалась, но шрифты не трогайте. Хабр не читается, а воспринимается лучше. Он относится к тысячам порталов «про информацию», а не про печатный текст. Зато классические издания вроде «Ведомостей» или там NY Times, кому что ближе, сторонятся всех этих верданообразных шрифтов, и да, классические типографские шрифты как раз отлично помогают создать атмосферу. Не верьте, если вам скажут, что это в печати оно так, а в Интернете иначе. Ерунда. Шрифты везде глазом читаются одинаково. Просто цель порталов, базовая — давать возможность быстро (желательно одним-двумя взглядом) «снять» информацию, а цель газет и прочей печатки — чтобы люди садились поудобнее и читали.

Согласитесь, издания с огромным тиражом и не меньшей посещаемостью в Интернете должны что-то в этом смыслить, и уж побольше, чем портал для технарей и гиков.
  • +2
avatar
Хабр не читается, а воспринимается лучше
Я сказал ровно то, что хотел. Не надо так.

Не верьте, если вам скажут, что это в печати оно так, а в Интернете иначе
На свое мнение я права не имею?

Согласитесь, издания с огромным тиражом и не меньшей посещаемостью в Интернете должны что-то в этом смыслить, и уж побольше, чем портал для технарей и гиков.
Эти джедайские штучки (про «согласитесь») действуют только на слабые мозги. Вообще же, ничто не мешает дизайнеру технарского портала лучше разбираться в UX, чем дизайнеру сайта газеты. И да, нельзя равняться на сайт крупной газеты только потому, что это сайт крупной газеты.
  • 0
avatar
Причем тут UX, собственно? UX — это веяние времени, а типографика уже за вторую сотню лет перевалила. Мы же о тексте сейчас говорим. О шрифтах. О чтении. И если бы вы не подозревали меня в джедайстве, вы бы поняли, что вам пытаюсь сказать. И потому-то сайт крупной газеты и сама газета да, куда более авторитетны, чем Хабр. Они занимаются распространением читабельного текста лет на 10-15 дольше, работают с профессионалами другого профиля, и так далее, и тому подобное.

А если вам интересно, что редакции «чистых» интернет-порталов знают о той же типографике — да ничего. Плевать всем на «читательское» качество текста. Основная задача — сделать так, чтобы текст было легко охватить взглядом, а пролистывая — можно было быстро выделить в структуре основные мысли. Сейчас сайты делают под людей неграмотных или не желающих концентрировать внимание на одной странице слишком долго. Это основная политика интернет-изданий, и нас, собственно, заставляют не только шрифты, но и сам текст адаптировать под нужды аудитории, которая читать не хочет. Гуру интернет-дизайна так и говорят: современный пользователь не читает. Он смотрит, и смотрит быстро, если вы не донесли главное за 5-7 секунд, вы потеряли читателя.
Комментарий отредактирован 2017-06-20 12:05:04 пользователем Chiarra
  • +1
avatar
если я правильно понял, то ведомости это эталон.
а посмотрите тогда на другие сайты крупных сайты газет. у них там ад и израиль в плане читабельности. они что работают с другими профессионалами?
  • 0
avatar
Нет, не эталон. Более того, очень часто у хороших печатных изданий отвратительный сайт по разным причинам. У одного издания, в котором я работала, был именно такой — ужасный и сделанный за 5 минут на досуге нашим сисадмином. При том, что журнал был — дорогой b2b-глянец для профессионалов, с вылизанным дизайном и жесткими стандартами качества. Просто не все издания а) заморачиваются с онлайн-версией себя и б) работают с «родной» командой, многие нанимают на аутсорс гениев UX, которые «все знают о том, как нужно людям читать в Интернете». Хотя повторюсь, никакой разницы для типографики нет, с бумаги там человек читает или с экрана. Шрифты есть шрифты. И придумали их точно не для сети.

«Ведомости» и NYT я привела в пример потому, что эти медиа стараются подогнать интернет-версию себя под свой оригинальный печатный вид. Кроме того, они остаются в числе деловых печатных СМИ, у которых хоть пару статей можно бесплатно увидеть :) WP (хотя у них тоже сайт не блещет, оригинальный вид хуже мобильной версии) уже без подписки показывать материалы отказывается.
  • 0
avatar
UX тут при том, что это user experience. Да, это понятие более широкое, чем просто шрифты, но мне думается, шрифты туда входят тоже. Во-вторых непонятно пренебрежительное отношение к UX. Это не просто веяние, а именно стремление сделать удобнее и приятнее пользователю, а не в стиле «я художник, я так вижу».

По джедайству, я когда вижу предложения, начинающиеся с фраз «поверь» и «согласись», начинаю думать, что на самом деле у автора нет аргументов и он давит на чувства. Ну, как и произошло — ну они же давно работают, не могут же они ошибаться. Т.е. чистая вера.

Они занимаются распространением читабельного текста лет на 10-15 дольше
Насчет газет есть один нюанс, они занимаются распространением печатного текста. И я полагаю, что на сайте они используют засечки не потому, что думают о читабельности, а просто потому, что так «исторически сложилось».

работают с профессионалами другого профиля
Именно, что другого.

Хотя повторюсь, никакой разницы для типографики нет, с бумаги там человек читает или с экрана
А я вот видел рекомендации при печати использовать шрифт с засечками, а для экранов — без.

«Ведомости» и NYT я привела в пример потому, что эти медиа стараются подогнать интернет-версию себя под свой оригинальный печатный вид
Великолепно )
  • +1
avatar
Насчет газет есть один нюанс, они занимаются распространением печатного текста. И я полагаю, что на сайте они используют засечки не потому, что думают о читабельности, а просто потому, что так «исторически сложилось».

Я не планирую сыпать истинами. У меня их нет. Но как вы думаете, специальная платформа для публикации текстов — Medium — созданная исключительно для экранов и использующая слоган «Read, write and share stories that matter», тоже засечки использует исключительно по недосмотру?
  • 0
avatar
А я откуда знаю, почему? Может, потому что у NYTimes так, вот и они должны. Я тоже могу взять и начать приводить газетные сайты, которые используют шрифт без засечек и начну спрашивать, почему они делают так, только вот я не думаю, что это к чему-то приведет.
  • +1
avatar
Ну, как и произошло — ну они же давно работают, не могут же они ошибаться. Т.е. чистая вера.
Я совершенно случайно работаю в этой сфере, ну, опыт небольшой, каких-то пятнадцать лет. Выше в моих комментариях есть объяснения того, почему у печатных изданий и книгопечати одна задача, а у современных-модных-«удобных» порталов — другая. Первые предоставляют материалы для чтения. Вторые — для донесения информации. ММОзговед ориентирован не на быстрое информирование аудитории, а на чтение полноценных статей. Ему не нужна дизайн/верстка, которые позволяют менее чем за 7 секунд понять, о чем пишут и на что обратить внимание. 7 секунд — это тайминг от UX-товарищей из Яндекса, другие дают еще меньше. Покажи читателю все за 4 секунды или потеряй читателя — лозунг современного UX. И да, это свежее веяние, последняя конференция на этот счет для нас, некомпетентых и верующих редакторов СМИ, была в апреле.

На этом нашу содержательную дискуссию я сворачиваю, не люблю, когда из-за моей «давящей на чувства» манеры общения, которая лично меня устраивает, собеседник позволяет себе обвинять меня в голословности или некомпетентности.
Комментарий отредактирован 2017-06-20 18:02:48 пользователем Chiarra
  • +4
avatar
Во-вторых непонятно пренебрежительное отношение к UX. Это не просто веяние, а именно стремление сделать удобнее и приятнее пользователю, а не в стиле «я художник, я так вижу».
Во многом оно пренебрежительное потому, что там много субъективщины, так как определяющим фактором является пользователь, а пользователи разные бывают. =) В данном случае я склонен согласиться с тем, что правила типографики и проверенные временем нормы — более авторитетная цель, на которую стоит ориентироваться, если речь заходит о чтении текста.
  • 0
avatar
Размер шрифта у них 14px, здесь 17,



На ваш взгляд, в каком случае величина шрифта лучше сочетается с величиной иллюстрации?
  • 0
avatar
Мне кажется, что тексты пишутся для читателей, т.е. дизайн должен идти от того, как это будет читаться, а не как больше радует авторов.

Я ни в коей мере не ставлю целью противопоставление читателя и автора, но предлагаю попробовать понять мой ход мысли, который изложен еще в самой заметке. Я хочу дать автору больше контроля над дизайном собственного текста. Отсюда шапка. Отсюда большой шрифт. Отсюда большие картинки. Все это складывается в персональный дизайн заметки. То, какую заглавную иллюстрацию выберет автор. То, как и где будет располагать выноски. То, как будет бить на абзацы свой текст. То, какие картинки в качестве иллюстраций выберет. Разумеется, как и всегда, мы будем в этом вопросе помогать авторам, но важно, что у людей есть изначальная возможность дизайнить свою заметку, а не просто быть «еще одним текстом на портале». Я могу ошибаться и это может не сработать, как мотиватор. Но я объясняю, чем я руководствовался.
  • 0
avatar
Ок. В общем, мое дело высказать свое мнение, остальное дело хозяйское.
  • 0
avatar
Поймала баг в своем Макстоне последней версии — не дает вставить картину в комментарий. Совсем не дает, т.е. после прожатия что кнопки, что сочетания клавиш просто ничего не происходит.
  • 0
avatar
О, отлично. То есть плохо, но хорошо, что есть с кем об этом поговорить. А перечитай, пожалуйста, страницу с принудительной перезагрузкой всех плюшек (Ctrl+F5) и посмотри, появится ли такая же возможность. У нас какая-то проблема с кэшированием скриптов.
  • 0
avatar
Заработало :)
  • 0
avatar
Спасибо! А мы заодно починили кэширование. Теперь у всех должно работать правильно.
  • +1
avatar
Теперь можно читать и на мобильном, здорово!
Десктопный вариант ещё не посмотрел.

Нужно приклеить менюшку и перенести в неё полезности вроде прямого эфира.
Над окном написания комментариев тоже бы поработать, оно не сочетается с сайтом — шрифт другой, иконки расплываются.
  • 0
avatar
Да, окно будем допиливать. Ссылка на прямой эфир появится в меню для мобильных устройств.
  • 0
avatar
Ссылка на прямой эфир появится в меню для мобильных устройств.
Я бы эту ссылку и в десктопной версии оставил. Ибо если сделать окно браузера в полэкрана, прямой эфир также уезжает вниз.
  • +1
avatar
Дык, все равно, на мобильном ты устройстве или еще на чем, такие штуки именно на ширину и реагируют.
  • 0
avatar
Atron
Могу я задать пару нескромных вопросов?

Расскажите, сколько стоит содержание сайта?

Есть ли от него прибыль? Из чьих средств оплачивается «аренда»?

Расскажите про новый дизайн. Вы нанимали дизайнера или знакомые помогали? Во сколько обошлись изменения?
(Ведь вполне вероятно что изменения были не только в HTML шаблоне, кто-то должен был заниматься сервером, а это не бесплатно)

Насколько вы вовлечены в эти изменения? Я имею ввиду: пишете ли вы код?

Если я предложу какие-то кардинальные изменения, они вообще могут быть рассмотрены? Ведь проект явно не коммерческий.
  • 0
avatar
Я попробую ответить вместо АТ-a, может он позже меня подправит или добавит.

1. Хостинг (сравнительно небольшая фиксированная сумма) + море редакторской работы, которую очень трудно оценить + работа по техническому поддержанию и развитию, которую тоже не реально оценить. Всё сами.
2. Никакой прибыли нет, на данный момент, от слова совсем. И никогда не было. Это не значит что мы не хотим как-то это монетизировать. Но не в ущерб нашим принципам и концепции портала. Планы в этом направлении есть.
3. Купили новый шаблон и допиливали его. Сами. Львиную долю — АТ. И имейте ввиду, он ни разу не IT-шник.
4. Смотри выше
5. Предлагать-то можно конечно. Мы открыты к хорошим идеям. Проблема в том, что нужно понимать в том, как работает CMS на которой основан сайт. Это LiveSteet CMS 1.0.3. Штука мало распространенная. И оно допилено у нас непосредственно в движке + у нас 18 плагинов, частично написанных самостоятельно, частично взятых на стороне и доработанных.

Всё в целом это довольно здоровенный конструк уже. В который вложено уже очень много сил, да и денег тоже, чего уж там.
  • 0
avatar
Спасибо за ответ.
Мне бы очень хотелось что бы ваш сайт приносил вам деньги. Надеюсь так и будет.
Комментарий отредактирован 2017-06-20 14:53:14 пользователем serken
  • 0
avatar
спасибо, интересная информация.
Всё в целом это довольно здоровенный конструк уже. В который вложено уже очень много сил, да и денег тоже, чего уж там.
звучит пессимистично, как будто ммозг превратился в чемодан без ручки. вроде силы и деньги вложили, а цель не достигнута и не бросать же на пол-дороги и поэтому будем тянуть дальше.
прошу прощения если не правильно понял.
  • 0
avatar
звучит пессимистично, как будто ммозг превратился в чемодан без ручки. вроде силы и деньги вложили, а цель не достигнута
А какая конечная цель должна быть достигнута, на ваш взгляд?
Комментарий отредактирован 2017-06-20 16:39:32 пользователем Atron
  • 0
avatar
«ММОзговед»—это игра. Мы надеемся на то, что вскоре это также будет игра с призами. Все мы работаем над тем, чтобы поскорее перейти в режим конвертации накопленной вами энергии и яркости в совершенно конкретные возможности приобретения реальных товаров через интернет.
  • 0
avatar
И я уже написал два часа назад о том, что мы от этой идеи отказались. Надо бы убрать эту часть из описания проекта, тут вы правы. Но, даже если бы это было так, вы уверены, что этот проект и активность людей в нем ради процитированного?
  • 0
avatar
откуда ж мне знать зачем вы делаете ммозг?
я нашел только эту цитату.
если не прав, скажите в чем заключается результирующая цель существования ммозга?
  • 0
avatar
В том, что он есть и дает прямо сегодня, не имея конкурентов. Деньги — это инструмент реализации или выхода на новый уровень реализации, но не цель. У финансиста деньги — это цель. У любого другого человека, по-моему, это средство. Инструмент.
  • 0
avatar


С деньгами понятно, а вот не иметь конкурентов это хорошо или плохо для ммозга?


  • 0
avatar
Мне не очень интересно участвовать в этом пинг-понге, если честно. Думаю, на ваш изначальный вопрос мы давно ответили. Верно?
Комментарий отредактирован 2017-06-20 17:31:44 пользователем Atron
  • 0
avatar
Никакого пессимизма. :) Я, собственно, ММОЗГОВЕД-ом горжусь, и горжусь что к этому причастен.
И я верю в серьезный потенциал проекта. У нас есть проблемы, но есть и крутые достижения.
Комментарий отредактирован 2017-06-20 16:57:42 пользователем Gmugra
  • 0
avatar
Расскажите, сколько стоит содержание сайта?

Есть ли от него прибыль? Из чьих средств оплачивается «аренда»?

Информации о содержании сайта я давать не буду, хотя бы по той причине, что это не просто оплата хостинга. Или другие разовые и ежемесячные затраты. Это, прежде всего, время, которое редакция тратит на техническую и контентную часть проекта. Прибыль? Прибыль возможна только в случае, если вы, как посетитель, с нами участвуете в какой-то сделке. А вы не участвуете. И никто не участвует пока. Рекламы на ресурсе нет. Так что ответ очевиден — прибыли нет. Из чьих средств оплачивается? Из средств редакции, разумеется.

Если я предложу какие-то кардинальные изменения, они вообще могут быть рассмотрены? Ведь проект явно не коммерческий.

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

Сейчас, как нам кажется, мы доказали, что ММОзговед — не однодневка. Что у нас есть способность переживать даже самые трудные времена, не разменивая собственные принципы. И в то же время, ММОзговед — это площадка для любого альтернативного мнения, которое хорошо сформулировано. ММОзговед — это место, куда спокойно могут приходить продюсеры игр и вести нормальный диалог на вполне высоком уровне. Но ММОзговед — это ресурс, где отстаивают интересы игроков, а не рассказывают о том, как тяжело жить редакции, разработчикам или кому-то еще, и на что приходится идти, чтобы жить было чуточку лучше.

Мы придерживаемся принципа «Сначала давать, а потом брать». И принципа честной сделки. В условиях, когда основным наполнением все же должны быть материалы игроков, которые в основе своей хотят иметь доступ к широкой аудитории и максимально возможному отклику, с монетизацией здесь все не так просто, но мы придумали, как мне кажется, довольно интересную схему, с которой познакомим подробно сначала костяк наших авторов, выслушаем их мнение, и если получим принципиальное одобрение, запустим программу движения к этой цели. Предполагается, что она будет реализована через Patreon. А затем, по достижению глобальной цели, через собственную систему, в которой будут учтены все вклады участников Patreon-программы. Новый дизайн, который нам еще предстоит довести до ума, был важным условием перехода к этому этапу.

Расскажите про новый дизайн. Вы нанимали дизайнера или знакомые помогали? Во сколько обошлись изменения?

Мы купили шаблон, который отдаленно подходил для нашего замысла, и существенно его переработали. Конечный дизайн разрабатывал я, заодно осваивая css и внутренности движка. В команду также входят два человека, которые хорошо знают LiveStreet и могут делать на этом движке довольно продвинутые вещи. Не всегда эти люди могут посвящать себя нашему проекту в полном объеме, но когда посвящают — способны на многое. Полностью работе над ММОзговедом посвящаю себя пока только я.
  • +2
avatar
Поздравляю с очередным шагом вперёд.
Как говориться, мы живём пока меняемся, и я рад, что ММОзговед не собирает останавливаться на достигнутом.

Однако новый дизайн вызывает у меня смешанные чувства, я во многом согласен с мнением Shauni .

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

Кроме того, в комментариях излишне маленьким, на мой взгляд, шрифтом указываются имена авторов. Поскольку далеко не все используют уникальные аватарки, по которым их можно было-бы сразу идентифицировать, это воспринимается не очень удобно. Кстати, в связи с этим непонятно, почему в мобильной версии аватарки не отображаются вообще.

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

Хочу отдельно отметить, что это претензии именно личного характера — я не знаю причин и оснований, по которым выбирался каждый не понравившийся мне элемент дизайна, а потому не пытаюсь сказать, что «так делать неправильно» (может как раз и правильно, а я просто не знаю более глубоких причин), но просто рассказываю о том, что вызывает у меня дискомфорт.
  • 0
avatar
Отдельным комментарием отмечу замеченные объективные ошибки дизайна.
1. На мониторе с соотношением 16 на 10 (разрешение 1440х900) боковая панель накладывается на рамки боковых разделов:

2. В мобильной версии (дисплей 5.7, разрешение 1920x1080) явная проблема с выравниванием картинок в шапке:


при этом в ленте центрируется один участок, а в самой заметке — другой:



В то же время с видео и другими изображениями далее по тексту такой проблемы нет — они показаны целиком:


P.S. Просто вопрос — в профиле, кроме фотографии и аватарки, теперь есть и изображение в шапке — оно одинаково для всех. Планируется ли сделать его настраиваемым для каждого пользователя?
  • 0
avatar
P.S. Просто вопрос — в профиле, кроме фотографии и аватарки, теперь есть и изображение в шапке — оно одинаково для всех. Планируется ли сделать его настраиваемым для каждого пользователя?

Для каждого — не планируется. Для ММОзговедов с определенной яркостью — да. Но в будущем.
  • 0
avatar
извиняюсь что грубо, но зато точно:
«когда бордель перестает приносить деньги, в нем шлюх меняют, а не вывеску»
  • -11
avatar
Какое изощрённое самоубийство. И было бы ради чего…
  • 0
avatar
В нём нет ничего изощрённого. Обычный толстый троллинг.
  • 0
avatar
Набросал тут на скорую руку бутстрапом: шаблон
  • +4
avatar
Здорово. :) Мне бы такую «скорую руку». :) А на исполнение чего в нем принципиально предлагаешь обратить внимание?

Про адаптивность картинок я знаю, просто мои «нескорые руки» еще до этого не дошли. Заголовки на фоне картинок в ленте мне не очень хочется иметь по нескольким причинам: а) в таком варианте дизайна сложнее ориентироваться в информационной ленте, б) не очень понятно, что делать с теми заметками, у которых в качестве заглавного элемента видео, в) мини-заметки в будущем, вполне возможно, будут без картинок, г) композиция предполагает сочетание двух пятен в блоке заметки: заголовок + название блога/мира в левом верхнем углу и оценка в правом нижнем. По шрифтам у меня пунктик на засечках, да. Очень хочется, и тут я могу написать целую поэму, почему мне этого хочется. :)
  • +1
avatar
А можно ли сделать так, чтобы заметки с превью — ставился заголовок поверх картинки, а без превью (видео и т.д.) — нет? И мини-заметки без картинок нужно еще посмотреть, они могут просто некрасиво выглядеть в ленте.

Кстати, насчет видео. Я бы вот субъективно очень хотела картинку-заглушку, а видео убрать под кат. Но настаивать на таком решении не буду, наверняка это удобно/нравится только мне.
  • 0
avatar
А можно ли сделать так, чтобы заметки с превью — ставился заголовок поверх картинки, а без превью (видео и т.д.) — нет?

Так мы убьем четкий визуальный ритм информационной ленты, как мне кажется. Плюс — красные элементы при наведении мышкой можно тогда смело убирать. Плюс — на картинку придется переносить также название мира, дату создания и кнопки редактирования. Плюс — намного больший контроль за содержимым картинки, чтобы она была достаточно контрастным фоном для заголовка (то, что может позволить себе централизованная редакция, и не очень может позволить себе инструмент коллективной платформы разношерстных авторов).
  • +2
avatar
Ну так то да, светлый заголовок на фоне светлой картинки будет практически не виден.
  • 0
avatar
Для этого картинка в шапке заметки принудительно затеняется, чтобы белый заголовок был виден даже на светлом фоне. Но, очевидно, что при этом искажается колористика картинки. Если в режиме ленты она есть или повторяется в самой заметке в нормальном виде (такое тоже вполне можно использовать), мы особо ничего не теряем. Но если это единственный вариант картинки, тогда мы каждый раз ее задавливаем. И никто не видит оригинал.
  • 0
avatar
Попробуйте градиентное затемнение картинки: сверху она прозрачна, ближе к низу, там где заголовок, постепенно темнеет.
#header .banner .banner-overlay {
background: -moz-linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 75%, rgba(0, 0, 0, 0.3) 100%);
background: -webkit-linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 75%, rgba(0, 0, 0, 0.3) 100%);
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 75%, rgba(0, 0, 0, 0.3) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00000000", endColorstr="#4d000000", GradientType=0);
}
  • 0
avatar
Да, можно и так, но суть того, что мы так или иначе искажаем цветопередачу картинки, не изменится же. :)
  • 0
avatar
Так вышло что набросок начал обретать черты полноценного сайта.
У кого есть время и желание, загляните, пожалуйста и дайте советы по дальнейшему развитию в плане дизайна и контента.
Прошу не считать рекламой.
Комментарий отредактирован 2017-06-22 15:36:50 пользователем Deenar
  • 0
avatar

а возможно как-нибудь убрать-заблокировать подвижную часть вверху на главной?
причины:

1) не переношу анимированные вещи в интернете (хуже только озвучка сайта и баннеры)

2) слабый интернет, каждый раз приходится ждать загрузки этой анимации

3) слабый компьютер начинает тупить, а верхняя анимация становится дерганой
Комментарий отредактирован 2017-06-23 16:14:12 пользователем glorden
  • 0
avatar
Адблок? =)
  • 0
avatar
тогда уж скорее uBloc. Я им убрал ссылки на соцсети на рабочей машине. Можно блокировать люлой элемент практически
  • 0
avatar
Собственно как отключить уже подсказали. Я лишь хочу отметить, что, во-первых, ждать загрузки параллакса не нужно, потому что он не блокирует загрузку страницы (анимированный лоадер закрывает только сам параллакс), и во-вторых, мы применили достаточно интересную технику для создания этого параллакса, так что его суммарный размер достаточно небольшой. Но с тормозами да, если уж тормозит, то лучше отключить.
  • 0
avatar
Слушайте, а как этот параллакс работает? Я НЕ имею ввиду ощущение глубины.
Я говорю про обтравку. Интерфейс параллакса это список с кусочками аппликации, но они вырезаны на скорую руку, с неаккуратными краями. Я так понимаю это ваша CMS обрабатывает эти картинки на сервере, или как? Дайте почитать.
  • 0
avatar
Не совсем понял вопрос. Ты в исходниках видишь неаккуратные края или в конечном варианте? И нет, это не CMS, все своими руками через CSS.
  • 0
avatar
С конечным результатом всё в порядке.
Но если открыть кусочки этой аппликации по одному, они неаккуратно обрезаны, хотя результат выглядит хорошо и краёв не видно. Не могу понять почему так.
  • 0
avatar
Там еще есть файлы маски, с аккуратными краями.
  • 0
avatar
Это SVG нужно читать?
  • 0
avatar
  • 0
avatar
Спасибо, не заметил.
  • 0
avatar
Параллакс намного проще сделать на основе png-формата. То есть картинки с прозрачностью и аккуратными контурами. Но это довольно прожорливый формат. Мы же пришли к размеру заставки, который, в среднем, на 30% меньше, чем статичная заставка лидера недели в прошлом дизайне. И я от этого момента в восторге, честно говоря. Конечно, нам еще нужно совершенствовать эту технологию, разобраться со странным «дрожащим» рендерингом в FF, оптимизировать некоторые вещи, но в целом мы уже сделали довольно классную и, по современным меркам, вполне экономную для трафика штуку.

Собственно, откуда неаккуратные края в исходниках. По маске видно, что каждая картинка имеет очень четкий контур, но, если вы что-то вырезали в фотошопе, то знаете, что аккуратного края добиваются переходом от непрозрачности к полной прозрачности по контуру. Как вы уже поняли, мы применяем следующую технологию для экономии трафика: цветная картинка в jpg с наложением на нее маски в png (черно-белый png, в отличие от полноцветного, очень маленький). Проблема только одна — у jpg нет прозрачного фона. При сохранении подложка становится белой. И так как кромка вырезанного рисунка переходит от непрозрачного к прозрачному, эта белая подложка проявляется в виде хорошо заметного белого контура. Разумеется, можно использовать некий общий нейтральный фон, но часто элементы задника слишком контрастны. Как в случае с Worlds Adrift — и белые облака, и синее небо, и темный камень. Поэтому подставляется реальный фон и грубо вырезается контур, который потом отрезается маской. Но зато у картинки нет контрастного контура. Если бы мы просто оставляли фон, размер файла сильно увеличивался. А небольшой кусочек фонового изображения по контуру увеличивает размер jpg всего на 5%.
Комментарий отредактирован 2017-06-27 09:48:12 пользователем Atron
  • +5
avatar
Спасибо за разъяснение, довольно интересно.
К стати, как вы считаете, не стоило ли запретить комментариям сжиматься? Как vk сделал.
Комментарий отредактирован 2017-06-27 15:35:13 пользователем serken
  • 0
avatar
Слушайте, а интересная механика. Мне прям понравилось. Чиара кидает мне минус, я теряю почти всю «энергию». Чего конечно же не будет если минус кину я. Яркость, все дела.
Это что-то вроде: закрой пасть, я тут заметки пишу, моё мнение важнее?
Комментарий отредактирован 2017-06-27 23:43:59 пользователем serken
  • +1
avatar
Вам стоит почитать этот текст: mmozg.net/mmozg2/2016/12/29/o-zhertvah-sistemy.html
  • 0
avatar
наш параллакс откликается даже на наклон мобильного устройства. Попробуйте.
На Windows Phone 10 через Edge не работает, показывает только правую картинку человека из Worlds Adrift.

просто выделить нужный текст и нажать Ctrl+Enter. Автору будет отправлено личное сообщение.
А если выделить текст комментария и нажать Ctrl+Enter, то сообщение отправится автору заметки или комментария? Хотя, автору комментария отправлять бесполезно, их редактировать нельзя уже через 15 минут.
Комментарий отредактирован 2017-06-28 11:36:41 пользователем Eley
  • 0
avatar
Автору заметки, очевидно. И нужно для исправления заметок, а не вычитки чужих комментариев. Edge мы попытаемся починить в любом случае, но его процент не очень велик, скажем прямо.
  • 0
avatar
Ещё одно замечание к дизайну — теперь на главной странице не указываются теги, проставленные к каждой заметке, их можно увидеть только открыв саму заметку. это сделано намеренно, или можно рассчитывать на их возвращение?
  • 0
avatar
Это сделано намеренно ради чистоты ленты, но мне и самому это не очень нравится. Будем еще думать над тем, как сделать красиво и функционально. Занес в список.
  • 0
avatar
Даже не заметил, что тегов нету
  • 0
avatar
Начал работать в оконном режиме и заметил одно досадное упущение: сайт не имеет горизонтальной прокрутки (Firefox и Edge, если это зависит от браузера). Следовательно, для того, чтобы посмотреть те блоки, что в окно не поместились, приходится уходить в полноэкранный режим. В статьях это в принципе не критично, так как всё равно всё самое важное скалируется — но вот на главной не очень удобно.
Комментарий отредактирован 2017-07-02 17:56:15 пользователем Minamikaze
  • 0
avatar
Очень странно… необходимости в горизонтальном скроллинге не должно быть. Боковые панели должны автоматически перенестись вниз.
  • 0
avatar
Боковые панели должны автоматически перенестись вниз.
Они переносятся — но добираться до них очень уж далеко. Хотя хорошо, что при обновлении страницы не нужно проделывать этот путь заново. Может быть, придумать маленькую кнопочку, которая отправляет экран к этим блокам? Например, как сейчас есть сбоку кнопочка, которая возвращает наверх.

Тьфу, не туда ответил.
Комментарий отредактирован 2017-07-02 20:01:06 пользователем Minamikaze
  • 0
avatar
да, кнопочка в меню запланирована и будет вести на прямой эфир, когда он внизу.
  • +1
avatar
Новый дизайн мне очень нравится. Ребята, вы отлично поработали! Но есть пара вопросов.
1. При вставлении картинки в новую заметку, она не вставлялась, пока планомерно не уменьшил ее размер до 600*700 пикселей (округлил размеры). Разрешение jpg. Скриншот был взят из сети. Не вставлялась, это значит, что по прошествии некоторого времени, которое обычно уходит у меня на загрузку (10-20 секунд), в тексте просто не появился код картинки. В чем может быть загоздка? Могу предоставить ссылку на заметку, оригинал файла и тот что влез.
2. Не нашел вопросов про меню. Может быть не внимательно читал. Поэтому спрошу: планируется ли сделать первое меню выпадающим? Поясняю: обычно читаю новые заметки по несколько за раз. Бывает что их накапливается до десятка. Естественно читаю их со вкладки ВСЕ заметки. После клика на конкретную заметку и ее чтения, клик в меню на Заметки, приводит меня на вкладку ПЕРВАЯ ПОЛОСА, что далеко не всегда удобно, если мне предстоит еще перейти на ВСЕ, а затем отлистать на пару листов назад по времени. Учитывая что став красивее и навороченнее, сайт стал куда тяжелее, уходит время и лишний трафик мобильного на эти действия. Если бы пункт был выпадающим с вложенными вкладками, на мой взгляд было бы удобнее.
Комментарий отредактирован 2017-07-02 23:37:53 пользователем Kleris
  • 0
avatar
1. Заливка картинок никак не менялась, это видимо какой-то древний баг. А какого размера (в мегабайтах и пикселях) оригинальная картинка?
2. Как только придумаем, как это сделать — сделаем. Это многим неудобно, так что так или иначе поправим.
По поводу «сайт стал тяжелее» — это не так. Может быть он и выглядит навороченным, однако же он стал легче и загружается при прочих равных теперь быстрее, чем старая версия.
  • 0
avatar
1. Оригинал картинки весил 2,9 мб (черт его знает почему такой вес, я же говорю, что в вопросе весьма слаб), размерами 890*894 пикселей. Ужал как выяснилось даже сильнее, до 465*466 и веса 1,93 мб. Ограничение по весу?
2.
По поводу «сайт стал тяжелее» — это не так. Может быть он и выглядит навороченным, однако же он стал легче и загружается при прочих равных теперь быстрее, чем старая версия.
Тут наверное дело в ощущении. Сейчас специально разобрался с тем, почему мне кажется что долго и тяжело грузится. Да, контент сайта загружается быстро. По сути многновенно. Кроме… паралакса, который занимает у меня 50% экрана и грузится от 1 до 3 секунд. С одной стороны, возможно мой компьютер старый и просто тормозит. С другой стороны, общее ощущение, когда ждешь 2-3 секунды прогрузки значительной части страницы, оставляет ощущение большого времени прогрузки. Прошу не воспринимать написанное мной, как придирку или тупую претензию. Постарался описать, почему у меня возникло такое ощущение.
Комментарий отредактирован 2017-07-03 02:13:22 пользователем Kleris
  • 0
avatar
1) Да, и это было всегда с одной стороны, и в планах явно об этом сообщать, с другой.
2) Ясно. Будем думать.
Комментарий отредактирован 2017-07-03 13:08:31 пользователем Rigeborod
  • 0
avatar
1. Оригинал картинки весил 2,9 мб (черт его знает почему такой вес, я же говорю, что в вопросе весьма слаб), размерами 890*894 пикселей. Ужал как выяснилось даже сильнее, до 465*466 и веса 1,93 мб. Ограничение по весу?
Картинки больше 2 Мб не грузятся. Старый известный баг, который, по-видимому, так и не пофиксили.

Для 800 пикселей 2,9 Мб — это очень много, явно кривая картинка. Поставь качество 90 (может, стоит 100, это много). Она должна весить около 100 кб.
Комментарий отредактирован 2017-07-03 20:28:24 пользователем Eley
  • 0
avatar
Картинки больше 2 Мб не грузятся. Старый известный баг, который, по-видимому, так и не пофиксили.

Эм… ребята, это не баг, это вполне разумное ограничение. Вы понимаете, что такое картинки по 2mb? :) Для тех, кто заходит в заметку, для трафика сервера.
  • +1
avatar
Баг в том, что пользователю приходится только догадываться, что картинка слишком большая. Никаких уведомлений, просто ничего не происходит.
Комментарий отредактирован 2017-07-04 06:49:23 пользователем Rigeborod
  • +2
avatar
Именно. Нигде не написано, что нельзя загружать картинки больше 2 Мб, и никакой ошибки не отображается. Просто кажется, что заглючило, и пытаешься несколько раз загрузить, а потом долго думать, в чём дело.
  • 0
avatar
Мне все не дает покоя затемнение заглавной картинки на странице со статьей.
Очередной вариант частичного затемнения, которое я реализовал на своем сайте-болванке:
background:linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%), url('тут ссылка на картинку')center/cover;


C этим кодом отпадет надобность в полу-прозрачном затемненном блоке banner-overlay, который накрывает собой картинку.
  • 0
avatar
Мне не очень нравится сочетание градиента с «плоским» дизайном (я в параллаксе хочу его убрать, просто пока не придумал как). Но в любом случае, любопытно, спасибо. А можно картинку туда подставить, чтобы оценить эффект в полной мере?
Комментарий отредактирован 2017-07-04 10:39:20 пользователем Atron
  • 0
avatar
Если вы прошли по ссылке, то там две записи: верхняя без картинки в заголовке, нижняя с картинкой.
  • 0
avatar
Да, точно, прошу прощения. Хм… может быть. Нужно будет поэкспериментировать. Спасибо. Особенно хорошо это смотрится с прокручивание самой картинки при скроллинге.
  • 0
avatar
В качестве пожелания/предложения: перенести, а лучше — продублировать, имя автора в начало заметки, сразу после заголовка или напротив даты публикации.
Страна должна узнавать своих героев с первого взгляда :)
  • +1
avatar
Мой вариант дизайна.
Спойлера не нашел, а картинка большая.
  • +4
avatar
Хороший, очень аккуратный, блочный дизайн. Есть параллели с вконтактом, суть которого — информационный поток. Он потому на уровне ленты и смотрится аккуратно. Здесь каждая заметка — кирпичик в общей стене. А я пытаюсь реализовать немного другую концепцию, которую объяснял выше. В любом случае, большое спасибо за работу и альтернативный эскиз.
  • 0
avatar
Вам не нравится блочный дизайн? Ну это легко понять, но вот как он мешает концепции я не понимаю.
Знаете, я бы не поленился поговорить с вами о дизайне, но флагаться в комментах не хочу.
  • 0
avatar
но флагаться в комментах не хочу

Одно только предположение, что разговор о дизайне может обернуться для вас минусами, отбивает всякую охоту продолжать этот диалог.
  • +1
avatar
Нашёл одно неудобство нового дизайна. Если навести мышкой на заминусованный комментарий (этот, например), то текст не становится чёрным, а остаётся серым. Неудобно читать.

В прошлом дизайне текст становился черным и хорошо читаемым.

Если это влияет — у меня порог в настройках -9, а у комментария сейчас -7
  • 0
avatar
Да, есть такое дело. И записано отдельным пунктом в планах по доработке.
  • 0
avatar
У меня есть небольшой вопрос по рассылке о новых комментариях, я его задавал пару лет назад, вот ссылка.
Возможно, с новым дизайном можно добавить это опционально, если есть опасения, что будет много трэдов?
  • 0
avatar
Спасибо за напоминание. Добавил в todo-лист.
  • +1
avatar
На вкладке написано сначала название раздела и только потом название статьи. Если название раздела слишком длинное или открыто достаточно вкладок, то видно лишь название раздела. Хорошо бы или название раздела передвинуть в конец, или вовсе его убрать.
  • +1
avatar
Листал огромный список комментариев, захотелось вернуться к статье. Понял, что в мобильной версии нужна кнопка «домой», которая бы отматывала все наверх.Можно прилипшей к краю дисплея стрелкой наверх, но хватит и просто кнопки " в начало" после всех комментариев.
  • 0
avatar
Так она есть, в любой версии. Справа на тулбаре самая верхняя кнопка. Трудно не заметить.
  • 0
avatar
В комментарии идёт речь о мобильной версии. Трудно не заметить. ;) В мобильной версии нет тулбара. И это известная проблема, она будет исправлена.
  • 0
avatar
Эм… у меня есть. =)) Социальная панель, конечно, ее постоянно перекрывает, но тем не менее она есть. И да, юзер агент у меня точно мобильный, и в хроме и в опере.
Комментарий отредактирован 2017-09-04 07:39:50 пользователем Kaizer
  • +1
avatar
Кстати, да. Все время забываю спросить. У меня ли одного социальная панель на планшете все время покушается на пограничные территории и суверенное пространство тулбара?
  • -1
avatar
Аналогично. Проблемы планшетных браузеров ¯\_(ツ)_/¯ (у меня браузер Dolphin на планшете).
  • 0
avatar
Проблемы планшетных разрешений…
  • 0
avatar
Значит у тебя такой телефон. Или браузер. Можешь даже на десктопе начать уменьшать ширину страницы. В некоторый момент тулбар пропадёт.
  • 0
avatar
Нашёл баг — для старой статьи показывает ссылку редактировать, но когда нажимаешь — Ошибка 404.
  • +2
avatar
А можно добавить возможность отключить отображение тулбара с кнопками соцсетей? Я ими не пользуюсь, а взгляд отвлекает.
  • +4
avatar
Хорошо. Сделаем.
  • 0
avatar
Нашёл пару ошибок в статье Джолли, но он не может их исправить, так как статья уйдёт на премодерацию. Может, в таких случаях отправлять ЛС по Ctrl-Enter не только автору, а и Атрону?
  • 0
avatar
К сожалению, у нас нет ресурсов для того, чтобы проводить отдельные работы для обеспечения исключений с безграмотными авторами, отказывающимися сотрудничать с редакцией.
  • +2
avatar
Мы добавили пункт меню «Прямой Эфир» для мобильной версии. Уменьшили отступы во вложенных комментариях для мобильной версии. А также добавили ссылку на наш телеграм-канал внизу сайта. Собственно, ее можно в качестве анонса привести прямо тут: t.me/mmozg_net Подписывайтесь, это удобно.
  • +2
avatar
так там только анонсы, флудить нельзя :(
сделайте канал для околоигрового флуда, а *_*
  • 0
avatar
Так в дискорде же. Не? :)
  • 0
avatar
не могу позволить себе еше один мессенджер, а телеграм пришлось установить для работы
  • 0
avatar
смотрит на экран телефона с 5 мессенджерами и тремя учетками почты, думает о жизни.
  • 0
avatar
да как бы когда было много времени свободного, я тоже успевала общаться в куче конф в нескольких мессенджерах плюс два-три форума.
хотя мне в целом дискорд кажется неудобным (если только для голосового общения во время игры можно использовать)
  • 0
avatar
Проблема в том, что альтернатива — ставить кучу мессенджеров всем остальным. Ибо ммозговед есть и тут, и там, и ещё воооон там. И ведь могут интересное написать где-то. =)
  • 0
avatar
Это проблема коммуникации в принципе сейчас, а не только ММозга, и вряд ли она решится в ближайшие время (появится монополист)
  • 0
avatar
Есть альтернативное решение. Ибо монополия — это плохо.
Необходимо на законодательном уровне обязать на первом этапе открыть API, на втором — стандартизовать этот API. Это позволит Кардус использовать телеграм для того, чтобы общаться с людьми в Дискорде и наоборот. И тогда начнётся конкуренция по удобству использования, а не так, как сейчас. С соц. сетями та же фигня.
  • +3
avatar
Теоретически идея хорошая, но на практике приводит к созданию ужасных монстров многофункциональности и работы со всеми протоколами и АПИ до полной неюзабельности (так случилось с QIP).
  • 0
avatar
Не совсем. В Квипе ты логинился в кучу систем, чтобы из одного мессенджера общаться со всеми друзьями. В предложенном подходе ты логинишься в одну систему, но можешь добавлять пользователей из любых других систем без необходимости регистрироваться.
  • +1
avatar
Но это такой уровень интеграции что фактически является монополией (особенно если например государство будет контролировать стандарт АПИ). В чем разница?
  • 0
avatar
Стандарт Апи для взаимодействия != монополии на реализацию. + это не мешает реализовывать дополнительный функционал. Т.е. условно контакт лист + группы — это базовый функционал, который должен быть открыт через API, а остальное уже по желанию. Если какая-то штука становится стандартом де-факто, добавляем в API и делаем открытым.
  • +1
avatar
Необходимо на законодательном уровне обязать на первом этапе открыть API, на втором — стандартизовать этот API.
Контролирующие органы всех стран (особенно не самых демократических) очень одобряют такой подход.
  • 0
avatar
К контролирующим органам всех стран это не имеет никакого отношения при правильной реализации. А при не правильной — им и никакого API не нужно для их целей.
  • +1
avatar
После проставления оценки заметке не кликается ссылка на список проголосовавших =( Приходится обновлять страничку — тогда ок.
  • 0
avatar
Да, есть такой косяк, он записан, но пока у него не очень высокий приоритет. :)
  • 0
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.