ReFeRy

#правки_дизайна_фанфикса #очень_мелкое_нововведение

Исправил формулировки текущего упорядочивания во многих списках на сайте. Чтобы страница выглядела опрятнее с телефонов.

Было

Стало

#правки_дизайна_фанфикса #очень_мелкое_нововведение

1. В работе с фанфиками в горизонтальном меню (там, где "Опубликованные", "Неопубликованные", Совместная работа", "Корзина" и "Серии фанфиков") ссылка на активный раздел теперь всегда будет в зоне видимости. Это актуально для просмотра с телефонов, где в этом меню присутствует горизонтальная прокрутка. После перехода по разделам это меню теперь будет автоматически прокручиваться к активному элементу, если его не видно на экране.

2. В некоторых меню на сайте, где с телефонов присутствует горизонтальная прокрутка (профиль пользователя, фандом), теперь меню будет автоматически прокручиваться к активному элементу, если его не видно на экране.

Например, в любом фандоме, если перейти на раздел "Канон", раньше ссылка "Канон" в меню была не видна, теперь будет видна.

3. В профиле пользователя меню со списком всех разделов раньше не использовало горизонтальную прокрутку, поэтому у активных пользователей это меню могло занимать 3 строки. Теперь там используется горизонтальная прокрутка.

4. Всё то же горизонтальное меню с телефонов. Раньше прокручиваемая область была больше необходимого. Теперь прокручиваемая область будет соответствовать присутствующим пунктам меню на конкретной странице.

P.S. Есть ещё меню работы с конкретным фанфиком. Думаю, что с ним лучше сделать.

P.P.S. Если где-то на сайте из-за этих изменений ситуация ухудшилась, напишите пожалуйста, я мог не заметить (скриншоты приветствуются).

P.P.P.S. С десктопов никаких изменений вообще не должно быть заметно, если не так, тоже пишите обязательно. Проверить всё самостоятельно я стараюсь, но не всегда получается :(

#правки_дизайна_фанфикса #фанфикс #очень_мелкое_нововведение

Давно хотел это сделать, теперь сделал.

Изменена цветовая идентификация кнопки подписки. Теперь, если вы не подписаны на что-то, кнопка ярко зелёная - привлекает внимание. А если уже подписаны, то кнопка серая, не отвлекает.

Это касается:
- подписки на фандом
- подписки на пользователя
- подписки на автора ФвФ
- подписки на коллекцию
- подписки на заявку
- кнопки "В избранное" в фанфиках и ФвФ
- кнопки "Добавить в коллекцию" в артах

Возможно первое время глаз будет цепляться на новые яркие пятна, например, в поиске фанфиков, но привыкание произойдёт очень быстро.

#очень_мелкое_нововведение #правки_дизайна_фанфикса

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


Долго подбирал конкретный вид логотипа, вот этот вариант - в круге с толстой обводкой - показался мне самым удачным.

#очень_мелкое_нововведение #правки_дизайна_фанфикса

Иконка ми-ми-ми обновлена. Долой трусы!

#очень_мелкое_нововведение #правки_дизайна_фанфикса

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

#очень_мелкое_нововведение #правки_дизайна_фанфикса

1. В места в сети в профиле добавлены пункты: telegram-канал и litmarket.ru

2. Изменена вёрстка вывода мест в сети в профиле пользователя.

#очень_мелкое_нововведение #правки_дизайна_фанфикса

Вчера внёс мелкое изменение во внешний вид опросов. Теперь вариант ответа, за который вы проголосовали, будет отмечаться галочкой в правой части. Раньше он отмечался жирным шрифтом всего текста и это слишком уж сильно выделяло данный пункт, мешая адекватно воспринимать распределение голосов.

#нововведение #правки_дизайна_фанфикса

Дублирую запись из блога админа:

#правки_дизайна_фанфикса

Последние дни правлю css фанфикса, объединяю и унифицирую стили, удаляю лишнее. Что-то улучшаю.

Обновил форму настроек фандома, которая появляется, если в шапке фандома нажать на шестерёнку. Сделал форму на всю ширину блока, убрал таблицы. Теперь форма лучше смотрится с телефонов.

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

Изменил виджеты в шапке фанфика - выбор единиц измерения размера текста, выбор читать по главам/весь текст, выбор формата архива для скачивания.

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

#правки_дизайна_фанфикса

1. Увеличен шрифт в виджете "В избранное..." - метки и коллекции стали крупнее, их удобнее будет нажимать пальцем на экране телефона.

2. Доработана тёмная тема на странице чтения. Тёмная тема для всего сайта в работе.

#правки_дизайна_фанфикса #исправление_ошибки

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

Спасибо Граф Ноль

#очень_мелкое_нововведение #правки_дизайна_фанфикса

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

1. Появилась возможность просмотреть список рекомендаций ко всем фанфикам/переводам конкретного пользователя.
Заходим в его профиль, в работы, там в статистике (где указывается количество работ, общее количество читателей и т.д.), если к работам пользователя написана хотя бы одна рекомендация, строчка "ХХ рекомендаций" теперь является ссылкой на нужную страницу.
Это дополнительная возможность выбрать, что почитать у автора.

2. Раздел со списком рекомендаций "к моим фанфикам" переехал в профиль. Смотрите пункт 1, рекомендации к своим фанфикам теперь можно посмотреть там же. Если включен пункт меню "Рекомендации", то ведёт он туда же.
Из общего раздела рекомендаций пункт "К моим фанфикам" убран.

3. В ленте последних рекомендаций форма поиска по умолчанию скрыта при просмотре с телефонов. Кнопка "Показать форму поиска" делает именно то, что на ней написано :)

#правки_дизайна_фанфикса

Исправил адаптивность формы поиска блог-сообщений, теперь на телефонах "дата до" и кнопка "Искать" переносятся на вторую строку, а строка поиска растягивается на всю ширину страницы.

Таких форм на сайте три: общий поиск по блогам, поиск по блогу конкретного юзера и поиск по блогу конкретного фандома.

Где ещё на сайте есть формы/страницы, которые плохо выглядят/работают на телефонах?

Несколько я знаю, они всё ждут, но там есть связанные сложности, возможно, про какие-то проблемы я даже не в курсе.

#очень_мелкое_нововведение #правки_дизайна_фанфикса

Небольшое обновление верстки сайта:

1. На странице чтения, после слова "КОНЕЦ", ссылка "Пометить фанфик прочтенным" заменена на "Пометить прочтенным". Если её нажать, появляется виджет с кнопками "Понравилось/Не понравилось" и дополнительный блок с информацией о других произведениях автора и предложением подписаться на автора. Теперь в этом блоке есть ещё и ссылка "Написать комментарий".

2. Обновлён вид списков пользователей. Аватарки стали больше, информация выводится ровнее и аккуратнее, в том числе, в мобильном виде.

3. В списке "Моё избранное -> Авторы" меню действий с подпиской теперь выглядит и работает так же, как это же меню в профиле автора. Аналогично на странице "Профиль -> Рекомендует авторов".

4. Обновлена вёрстка рейтинга фанфиков.

5. В содержание фанфика вставлены ссылки на переход сразу к тексту, а не к шапке на странице чтения.

6. На странице чтения, при сворачивании содержания, вставлена прокрутка, чтобы на экране не оказывалось случайное место в тексте.

#правки_дизайна_фанфикса #очень_мелкое_нововведение

На странице фанфика, в содержании.

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

Теперь полное содержание будет выводится в блоке высотой не более 500 пикселей с полосой прокрутки. Можно скроллить список глав внутри блока, а можно скроллить всю остальную страницу.

#правки_дизайна_фанфикса #очень_мелкое_нововведение

1. Сменить email регистрации, пароль или никнейм теперь можно без ввода текущего пароля.

2. В "настройках", "редактировании профиля", "календаре чтения" и на вкладке с результатами угадайки поправлена вёрстка, улучшена адаптивность.

3. В управлении конкретной коллекцией тоже поправлена вёрстка и кроме этого выбор фандома коллекции теперь обзавёлся текстовым поиском (ранее был обычный список).

#правки_дизайна_фанфикса

Немного изменил вёрстку списка фанфиков.

Теперь на смартфонах метки будут идти выше названия фанфика. Это несколько увеличивает общую высоту блока каждого фанфика. Зато значительно повышает читабельность информации. Особенно заметно это будет активным пользователям меток и заметок в разделе "Моё избранное".

#правки_дизайна_фанфикса

Поправлена старая, но весьма узкая проблема адаптивности дизайна Фанфикса. Проблема наблюдалась только у не зарегистрированных пользователей с шириной экрана смартфона от 400 до 510 пикселей.

Они видели в шапке сайта вот такое: https://imgur.com/AqsCZXA

Дальше читайте только если вам интересны мои хэштеги #будни_админа или #веб_разработка

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

Сегодня по случаю скинул знакомому ссылку и получил в ответ скриншот проблемы. Тут-то до меня вдруг дошло, что это не проблема редкая, это мне о ней редко пишут.

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

И ещё одну мелочь поправил, действительно мелочь. Тоже про адаптивность.

Правая колонка скрывается при ширине экрана 1023 пикселя. Специально так делал, чтобы у редких юзеров экранов 1024х768 всё было хорошо, мониторов таких уже почти нет, а вот iPad встречается не так уж редко. Именно при ширине экрана 1024 пикселя сайт занимает весь экран - белого фона по краям нет. Если экран шире или уже, появляются поля.

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

Возвращаемся к iPad. Ровно при ширине экрана 1024 пикселя - граница слева убирается, ибо там нет полей. При 775-1023 граница есть, при >=1025 граница тоже есть. Именно это исключение для 1024 пикселей я сегодня добавил. Особенно заметна не нужная граница была на страницах фандомов, слева от обложки фандома была тоненькая полоска - царапала взгляд.

#нововведение #правки_дизайна_фанфикса #статистика_фанфикса

По статистике 62% всех скачиваний фанфиков осуществляется не зарегистрированными пользователями. Возможно аккаунт у них есть, но перед скачиванием они логин/пароль не вводили.

Почему это плохо:
- если читатель захочет написать комментарий или рекомендацию, ему надо сначала авторизоваться, а вдруг у него даже аккаунта нет? Пока он авторизуется/регистрируется, может передумать или отвлечься. Если же он будет всегда авторизован, ему будет куда легче отправить фидбэк.
- если пользователь всегда авторизован, то повышается шанс использования им любых сервисов сайта (метки, история поиска, коллекции, комментарии/рекомендации, заявки и так далее), что так или иначе ведёт к повышению активности и увеличению привлекательности сайта для авторов и читателей.
- если пользователь скачал архив фанфика, будучи авторизованным, на фанфик автоматически поставится метка "Скачано", что повышает шанс повторного визита на страницу фанфика, а следовательно, шанс получения автором комментария/рекомендации.

Поэтому, с сегодняшнего дня скачивание архивов фанфиков доступно только зарегистрированным пользователям.

Кроме этого по мелочи:
- если пользователь не авторизован или ему меньше 18 лет, раньше в слэш/фем/NC фанфиках он видел ссылку ЧИТАТЬ и только на странице чтения узнавал, что текст ему недоступен. Теперь эта информация выводится сразу на странице информации о фанфике.
- перевёрстана страница авторизации.