Чек лист для шаблонов сайтов

Чек лист для шаблонов сайтов

Иван Грозный

Этот чек лист нужно просматривать и выполнять каждый пункт из чек-листа после выполнения любого задания по шаблонам сайтов.

1. Должны функционировать все стандартные разделы сайта, а именно

  • Тумбы
  • Страница видео
  • Страница всех категорий
  • Страница фотокатегорий (внутри страницы категорий если на сайте есть фото)
  • Страница фото-тумб (если на сайте есть фото)
  • Страница фото (если на сайте есть фото)
  • Раздел истории просмотров
  • Раздел истории просмотров фото (внутри истории)(если есть фото на сайте)
  • Страница популярных видео
  • Страница популярных фото (внутри популярных) (если есть фото на сайте)
  • Страницы обратной связи, страницы с текстовым контентом типа родительского контроля

2. Тумбы. На тумбах должен работать колбасатор. Тумба не должна затемняться при загрузке колбасы. Под каждый шаблон нужно сгенерировать картинку лоадинг на сервисе loading.io (как оно правильно работает и по цветовой схеме смотреть на сайте инцестик.com - единственное, то сама анимация должна быть по центру тумбы) На тумбах также должна быть вся информация (длительность, пометка HD, дата добавления, рейтинг, количество просмотров) Идеальный вариант - длительность в левом верхнем углу, пометка HD в правом верхнем углу, а остальная инфа на полупрозрачной плашке снизу в ряд. При коллапсе вся это должно адекватно выглядеть на разных устройствах. Если не влазит уже на тумбе все - то можно скрывать дату добавления. Но плашку так и оставлять. Сразу же нужно проверить на мобильных как работает колбасатор по свайпу вправо или влево. Это есть в скрипте, но всегда нужно проверить. Также нужно проверить не вылазят ли по бокам полоски при работе колбасатора. Это правится как то через цсс. Не знаю как точно, это Ваша задача.

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

4. Пагинация. Пагинация должна быть всегда достаточно крупной, чтобы пользователь ее видел и не промахивался. Это удобно. В пагинации обычно квадратные или квадратные со скругленными краями кнопки. Пример хорошей пагинации на инцестик.com или mamoeb.com. У нас должна подсвечиваться текущая активная страница, при наведении на ссылку неактивной страницы - подсвечиваться. Цвета в пагинации должны соотвествовать цветовой схемы сайта.

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

6. Кнопка "В закладки" в хедере и в стики хедере должна предлагать пользователю маков нажать command+d а пользователям винды.

7. Колонка категорий. Основное в колонке категорий это то, что они должны быть хорошо видны и хорошо читаться пользователем. Должна подсвечиваться текущая категория в которой находится пользователь (при нахождении на странице тумб). Также при наведении на неактивные категории они должны подсвечиваться под курсором (все цвета должны соответствовать цветовой схеме сайта)

8. Сео тексты. В сео текстах используются списки, ссылки, выделения <b>, выделения <strong>. Требования к ссылкам - должно быть видно что это ссылки. Их цвет должен попадать в цветовую схему сайта, и пользователю должно быть ясно что это ссылки. Обычно ссылки подчеркиваются при наведении, либо же они сразу подчеркнуты. Список должен выглядеть списком и органично выглядеть в тексте. Особое внимание уделяем заголовкам. H1 у нас самый большой, H2 - 60-70% от размера H1.

9. Сео тексты под видео или в альбомах. Должны по сути иметь все те же стили что и сео тексты.


Report Page