В конце августа был брошен клич: дизайнеры, давайте спасём Георгия в шапке сайта, ведь это главный символ современной непреходящей эпохи как оружие возмездия на толстеющего и пожирающего людские ресурсы Змия, а тут он скатился почти до плинтуса - футера сайта. Многие осуждающе качали головами и говорили - негоже, негоже так поступать с нашим символом. И дизайнеры со стилусами наперевес - появились.
Помимо этого, проведено много других работ по доработке дизайна, и вы можете посмотреть на новую версию по адресу design.aftershock.news, в "шапке" сайта (верхней панели), которая окончательно была спроектирована руками камрада дизайнера asim, нашли отражение обсуждавшиеся идеи, в развитии которых принимали активное участие Poligraf, ДК.
Хотите принять участие в доводке проекта до релиза (до момента, когда проект появится на домене aftershock.news) - просто зайдите на design.aftershock.news и начните пользоваться, как обычным Афтершоком. О замеченных багах просьба сообщать в комментарии к этой статье. Их останется меньше к моменту релиза.
Под катом - детали того, что сделано, а что планируется сделать позже, чтобы сайт стал ещё удобнее.
В конце июля уже было обновление сайта, основным автором и исполнителем которого был давний участник сайта Великий Кукурузо, веб-разработчик по специальности. Он сделал замену устаревших стилей CSS для оформления, ввёл 2 варианта цветового оформления темы сайта - светлую и тёмную, написал и использовал скрипты (Javascript) для поддержки мобильных телефонов. За последние годы существования сайта это - большой шаг вперёд, сделанный всего за 2 месяца. Перед этим у него была известная разработка юзерстилей сайта с тёмным оформлением (стили CSS, размещаемые не на сайте, а в браузерном расширении), что помогло сделать эту работу.
В то же время, за такой короткий период нельзя было решить многочисленные и сложные задачи сайта, часть которых остались нерешёнными и сейчас. Я принимал участие в разработке той первой версии в основном как тестировщик предварительных результатов. По окончании разработки в июле мы решили развить успех и продолжить внедрять улучшения и исправления на сайте. Кроме технических доработок, была задача оформить дизайн, прежде всего, верхней части сайта, "шапки", по которой встречают содержание новые посетители.
В статье про шапку, Георгия и дизайн Алекс выбрал камрада asim как исполнителя дизайна верхней части. Остальная часть, кроме технических доработок, была поправлена моим (atorn) скромным вкладом, хотя профессионально дизайном я никогда не занимался, и часть советов по оформлению я получил от asim, а строгую и неподкупную приёмку осуществлял Алекс. Все участники работали на добровольной основе в свободное время, поэтому работа не была столь быстрой, как это бы делали нанятые профессионалы. Интерес у каждого был - сделать посещаемый нами сайт таким удобным, как это представлялось в наших мечтах, юзер-стилях и дизайн-макетах.
Итак, есть некоторые доработки сайта за прошедшие 3 месяца, которые опубликованы для тестирования на design.aftershock.news и через какие-то дни или недели, если не будет критических замечаний, появятся на рабочем сайте aftershock.news.
Есть и достаточно продолжительные планы на 2-4 месяца, чтобы в этом же неспешном режиме расправиться с остальными известными недостатками сайта. По ним я планировал к релизу новой версии сделать отдельную статью, чтобы потом на неё ссылаться и там собирать отзывы и предложения. Но кое-что упомяну и здесь, чтобы показать, что озвученные ранее проблемы не забыты и в планах сохраняются.
Какие новые функции и достижения сделаны в этой доработке?
Есть длинный и скучный рабочий документ, где, в основном, перечислены эти функции и достижения. Он - для будущих разработчиков, поэтому всё описано в суховатом насыщенном стиле. Чтобы было интереснее читать, вытащу из него самое значительное - в текст, а остальное - под спойлер.
-
Зум (увеличение масштаба) страницы - особенно полезен для мобильных устройств. В новых мобильных браузерах обычно уже есть 2 автоматических режима просмотра страниц: мобильный режим с искусственно уменьшенной шириной окна в 4-5 раз, чтобы шрифт был читаемым с экрана, и "десктопный режим", ещё называемый в настройках браузера, "как на ПК". Там шрифт мелкий - вот для этих целей используется "Зум", чтобы стилем CSS zoom увеличить масштаб от 100% до 280%. (Браузер Firefox этой функции не имеет.)
-
Тема оформления - основное, с чего началась работа по настройкам. Есть 2 основные темы: светлая и тёмная, названные как "День" и "Ночь". Одна из них выбирается и по настройке "ОС" - в соответствии с системными настройками операционной системы ПК или смартфона.
-
Кроме названных 3 основных настроек для экспериментов, дальнейшей доработки и по пожеланиям пользователей иметь менее контрастные темы, созданы (для начала) также темы "Рассвет", "Песок", "Море".
-
Второе основное, для чего были задуманы настройки - выбор шрифта. На самом деле, достаточно одного шрифта или максимум 2-3, но для интереса добавлены ещё ряд шрифтов разного рода (рубленые, с засечками, моноширинные), которые можно попробовать для чтения. Всего - 11 вариантов интересных и читабельных шрифтов. Часть из них (7) - загружается с сервера (веб-шрифты), поэтому одинаково будут выглядеть на разных устройствах. Остальные - подбираются на локальных ПК из имеющихся из нескольких вариантов (конкретный приоритет выбора легко можно увидеть в DevTools браузера, но это - скорее, для интересующихся темой и специалистов, а для всех - достаточно просто названия и того, как будут выглядеть тексты со шрифтом этого названия.
Исторически оставлен привычный Arial, но более качественно выполнен Roboto (веб-шрифт), он используется для сайта по умолчанию.
-
Размер шрифта - кроме "Зума", масштаб текстов изменяется размером шрифта. Полезно владельцам крупных или мелких мониторов. Картинки и размеры колонок этой настройкой не меняются, поэтому результат может оказаться более качественным.
- Детальность настроек. 3 градации,. Чтобы новым пользователям в настройках не вываливать сразу десятки пунктов, подробность разделена на 3 градации: базовые настройки, расширенные и "для экспертов". В последней добавляется небольшое число тестовых и экспериментальных функций. Некоторые даже не доработаны, но нужны для тестирования на телефонах. Поэтому спрятаны туда. Можно раскрыть все и познакомиться с подсказками, которые появляются в списке по наведению мыши.
Есть и такие экэотические (были просьбы сделать), как скрытие шапки сайта. То есть, красота оформления, на которую мы лишний месяц потратили, некоторым пользователям не нужна, они хотят голую правду, информацию из статей, без Георгия в голове. И они её получат, в таком урезанном и извращённом виде.
Ознакомившись с тем, что хорошего можно настроить под себя, вы затем один раз настраиваете браузер, и какое-то время настройки будут не нужны - браузер их запомнит. Если установили новую ОС или новый браузер - придётся снова один раз что-то настроить (или импортировать из настроенного) и пользоваться.
Если нужно скопировать настройки в разные браузеры, в настройках есть функция экспорта-импорта. Сначала их экспортируют (в текст), получают примерно в таком виде:
{"_d":"Fri Oct 23 2020 10:37:34 GMT+0300 (Москва, стандартное время)", "themeLastLight": "light", "themeLastDark": "sea", "font": "Segoe", "settDetail": "expert", "toTop": "no", "hideReformal": "hide"}
, а в другой браузер - импортируют. Через секунду они уже применяются к странице и всем вкладкам сайта.
Другие настройки и функции (под спойлером)
Что ещё не сделано и планируется в следующих доработках?
- В редакторе - в поле ввода комментариев и статей - ещё не исправлена "багофича" от разработчиков редактора, про которую они уверяют пользователей, что не показывать нативное контекстное меню по клику правой кнопки мыши - это хорошо. У них даже плагина нет, который это отменяет, придётся делать патч.
- попробуем сделать так, чтобы ответ на комментарий не требовал вызова промежуточной страницы без текста статьи.
- будет настройка, включающая "более воздушный" режим показа, когда между колонками - больше пустого пространства.
- поборемся с багами несохранения частично набранного текста статьи.
- могут появиться режимы (по настройкам) более компактного отображения частей сайта - малые аватары, компактное упоминание подписей администрации, сжатый дизайн комментариев (меньше пустоты вокруг).
* прямая связь с астралом - не, это уже есть* темы оформления "Розовый пони" и "Хакерская консоль"
Задачи для доработоу черпаются из предложений, которые пишут пользователи в комментариях к статьям на АШ на технческие темы оформления сайта (как эта). Полный список задач и планов их выполнения будет опубликован в отдельной статье.
По запуску функций в экзотических средах типа WinMobile
Бывают запросы и на такие работы - в основном - исправить баг, чтобы на каком-то старом устройстве это вообще заработало. Владельцам таких устройств при появлении проблем - просьба связаться со мной напрямую по ЛС или для начала - здесь в комментарии. Наличие у вас такого устройства для тестирования может помочь за несколько шагов решить какую-нибудь проблему (читал, что такая была с новым дизайном и старым устройством в каком-то месте интерфейса).
Просим принять участие в тестировании и использовании сайта на адресе
design.aftershock.news,
чтобы к моменту релиза на нём осталось меньше недоработок! И, может быть, возникнут другие идеи по новым функциям или особые пожелания.
Комментарии
Поддержу....
А можно в меню мобильной версии добавить раздел "Лидеры обсуждений"? Очень хочется.
Кнопочка в уголку. Тыц!
Кнопку можно чуть поменьше и конечно не кривую. Хорошо бы чтобы она была доступна и при прокрутке страницы: долистал донизу и, не поднимаясь наверх, посмотрел, что там на пульсе или в обсуждениях нового. Хотелось бы чтобы и левое меню умело скрываться (или быть закреплённым, если кому оно всегда нужно).
За шрифт с засечками огромное спасибо. Это на втором месте после очень красивой новой шапки. Я даже рассматривал эти силуэты. Жаль, правда, что силуэты только промышленные. Кремль бы и церковный купол.
Как раз перед релизом их пришлось убрать (лидеров обсуждений), так как вызывали ошибки. Сделаем в ближайшие дни.
Пока могу посоветовать поставить экран мобильника горизонтально, чтобы появился левый сайдбар, там будет пока что единственный блок лидеров.
atorn, перед релизом убраны "лидеры рейтинга", а "лидеры обсуждений" на мобильном прекрасно доступны, я ведь дал скрин.
Нифига, свайпы нечитаемы.(( Что-то бледное на темном фоне.. добавьте контрастности что-ли.🤔
Поиск бы полноценный.
Поиск, поддержанный сайтом, сделан в 3 видах: встроенный Гугл, встроенный Яндекс, внешний поиск Гугл по сайту.
Поиски включаются в настройках пользователя (кнопка Изменить вверху, затем ищите в списках настроек внизу, затем Сохранить).
спасибо проверю
Поиск отлично работает. Главное уметь им пользоваться правильно.
Это обычно слова плохих программистов :)
Ни разу не он. Искать нужно по ключевым словам. Учитывая релевантность\дата..
Аватарки не великоваты?
Есть мысль сделать режим в Настройках "Малые аватары" (+ немного переделать блок комментария), примерно 24-25 пикс.
Мелковаты даже.
Выскажу свое мнение именно по красоте.
Лозунг - Каким будет завтра. На банере заводы и промышленность 50-х. Графически нужно выразить
Либо - прогнозы, либо - футуризм. При этом сохранить минимализм.
По хорошему конечно бы в идеале шаблон/дашборд где ты сам выстраиваешь блоки. Частично это есть на улучшенном акке и это суперская фишка.
Промышленность это не "шаг назад", это основа хозяйства.
Страны, увлекшиеся "футуризмом", утопают в долгах. Это не будущее, это закат.
Кроме айфона ничё в голову не пришло. Ещё можно одноногого негра педераста...
Нормально всё с заводами.
Поддерживаю.
В этом что-то есть.
Только бы я сделал связку прошлое-будущее не накладывание а справа налево (или наоборот)
типа переход от прошлого в будущее наподобие знаменитой картинки из обезьяны в человека.
тут много о прошлом это связь времён, и формирование будущего.
ИМХО не хватает лесов, полей и рек.
А вместо всадника идёт человек и вольно дышит :)
"Сеятель".
В белом венчике из роз —
Впереди — Исус Христос.
А можно вставку делать при написании комментов без отдельного окошечка?
Решение уже есть, но пока не можем выложить до окончания выкладывания релиза, на всё не хватает сил, сорри.
На телефоне (Opera, Android 10) правые превьюшки почти уходят за экран на Пульсе.
По F12 в хроме такая же проблема в режиме телефона
Спасибо всем за ряд похожих замечаний. Широкого тестирования на мобильниках не было - по итогам отзывов можно будет разобраться, куда смотреть, чтобы имеющуюся вёрстку приспособить к популярным способам работы на мобильниках.
Но в Хроме так и не мог воспроизвести в режиме тестирования телефона. Все варианты телефонов перебрал.
А всё стало работать в тот же или на следующий день, думал поправили оперативно :)
Вот проблемы со свайпами менюшек напрягают, прежде всего при скроллинге, когда явно почти вертикально свайпаешь, может ограничить начало свайпа 30-50px от краёв?
Ну и шапка с эстетической точки зрения ну очень плохо смотрится, особенно обрезанная шестирёнка и стрелка. Но это мелочи.
С остальным проблем нет, стало приятнее.
Опять поломалось всё на главной:
https://monosnap.com/file/fYFRD65VSppv33Ht5hqyJpYHo8uedB
Ещё кнопка логина большая
Красный Георгий - вообще не вариант на фоне ч/б картинки. Либо всё в цвете (типа тёмнозелёная промышленность, коричневая змея, и красный Георгий), либо всё ч/б - что лучше как ни крути.
Кстати, кроме промышленности - желательно изобразить реальную природу (леса например), ибо жить человек не может в окружении только железа и бетона это как-то мрачно и размножению не способствует. Т.е. я хочу сказать, что будущее в гармонии человека и планеты.
Если будете из футера убирать Всадника, отдайте его в векотрном виде в паблик по лицензии GPL.
За выбор шрифта отдельное спасибо. Тема рассветная включилась у меня.) Редактор супер!
Тестовые лучше не включать, ну разве что из любопытства. А то потом невыносимо больно будет вспоминать о потерянных возмоожностях. )
Там каждую фичу рассмотрим не спеша - и с большой вероятностью удалим, или сделаем что-то другое.
Спасибо, что предупредили..) Попутно вопрос - а это для чего? -
В целом - отлично! Спасибо.
Защита количества просмотров от лишнего сглаза, современный аналог шапочек из фольги.
Имхо, не нужно. Всю картинку портит. Аляповато. Тут, кмк, публика сугубо прагматичная, с минимумом суеверий на один аккаунт....)) Не нуждающаяся в экранирующих головных уборах..бгг
у.п.д. Заметил вот что ещё -
Когда число просмотров трёхзначное, буква К (кило), сливается с днём недели...
По поводу местоположения Георгия тут мысть пришла.. Можно вот такой вариант рассмотреть -
Ну и Евразию на глобус, ессно.. А так.. символично. Как спутник Земли и по смыслу место расположение как у ©
а можно добавить еще и "лучшие комментарии" (с точки зрения информативности)?
поток инфы нарастает, читать все - уже не хватит времени. бывает что коммент лучше самой статьи (информативнее - не юморнее, а именно информативнее).
при появлении такого раздела справа после лидеров - можно просмотреть инфу которую сообщество решило пометить как информативную.
А кто и как будет выбирать лучшие? Вообще, есть уже механизм рекомендованных комментариев. Выбирает автор. Всегда ли хорошо выбор?
механизма нет. про то и речь. выбирает сообщество. не автор.
На православных иконах Георгий Победоносец развернут направо и поражает змия правой рукой. На новой шапке сайта - наоборот. Развернут налево и держит копье в левой руке.
Налево он смотрит и на гербе московской области (в отличие от герба Москвы и Государственного Герба).
1. Следует ли из этого что администрация сайта больше любит Воробьева, чем Собянина?
2. Считается, что Георгий Победоносец "смотрел" на гербе налево в "лихие" для России годы. Всё так фигово?
3. Считается, что если ГП «смотрит» на картинке налево, то это означат ориентацию внешней политики России на Запад, при обратном положении изображения – ориентацию на Азию. И кто у нас враг?
4. И еще: Земной шар с Африкой в центре африкоцентричен, или нет? При обычном разрешении экрана этот земной шар (слева шапки) сильно напоминает змейскую эмблему Торманса. Так было задумано?
Вы нас разоблачили. Придётся поделиться страшным секретом. Будет настройка по клику на Георгии. Сообщество разделится на правогеоргиев и левогеоргиев. Затем начнётся вражда. Но помирит всех общая борьба против тех, кто кликнудл по Змею. Только никому - это секрет.
И правильно! Змея с запада ползёть))
Налево = запад, а в текущих реалиях именно там сейчас главное сатанинское логово.
Георгий раньше не поражал змея, сейчас рисуемое это всё западенская матрица вражды со стихией, отбирания даров природы силой. Правильный Гриша присматривает за стихией пока дева на привязи её выгуливает:
Перспективный чат детектед! Сим повелеваю - внести запись в реестр самых обсуждаемых за последние 4 часа.
Страницы