AntonBersh

AntonBersh

На Пикабу
поставил 1047 плюсов и 1008 минусов
отредактировал 0 постов
проголосовал за 0 редактирований
Награды:
5 лет на Пикабу
1157 рейтинг 5 подписчиков 11 подписок 11 постов 2 в горячем

[Google Chrome] Видео Coub не останавливается при сворачивании поста

В Google Chrome при сворачивании поста с Coub нажатием кнопки "Показать/скрыть пост" Coub не останавливается (слышен аудио-трек и видеоряд проходит вперед).

В других браузерах (Internet Explorer 11, Microsoft Edge 38) весь блок видео "отгружается", т.е. если раскрыть пост снова, блок видео переходит в изначальное состояние сразу после загрузки страницы.

Замечу что видео YouTube отгружаются везде (Chrome, IE, Edge).


Мне кажеться, все видео должны "отгружаться", т.е. поведение IE и Edge более корректно, и Chrome должен вести себя также.


У меня установлены:

Windows 10

Google Chrome 57.0.2987.110 (64-bit), но я замечал эту "ошибку" и ранее.

Microsoft Internet Explorer 11.953.14393.0

Microsoft Edge 38.14393.0


Примеры:

Корректная "отгрузка" YouTube: http://pikabu.ru/tag/ВидеоНекорректное продолжение проигрывания Coub: http://pikabu.ru/tag/coub, например http://pikabu.ru/story/pustoshi_fallout_4916855
Другие браузеры и видео форматы/хостеры не проверял, т.к. не вижу смысла (но проверю, если нужно).

Показать полностью

Отсутствует рамка поста если пост содержит только гифку (.webm) и YouTube видео.

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

Пример: http://pikabu.ru/story/golf_golfom_a_u_kogoto_obedennyiy_per...

Отсутствует рамка поста если пост содержит только гифку (.webm) и YouTube видео. Баг, Пикабу, Ошибка

Предлагаю ставить рамку если: (1) пост содержит текст, или (2) медийные элементы (фото, видео, гифки (.webm), coub) разной ширины. И не ставить рамку только если пост полностью состоит из медийных элементов одной ширины.

Показать полностью 1

Сделаем полностью валидный сайт!

Недавно игрался с HTML валидатором validator.w3.org (созданным World Wide Web Consortium), и был удивлен насколько хорошо сделан Ваш сайт. (По сравнению со многими много-миллиардными проектами: Google.com, Facebook.com, YouTube.com) Но все равно хотел бы исправить некоторые “ошибки”.

Давайте покажем что Пикабу лучше Reddit.com (всего 4 ошибки и 1 предупреждение)!


Ниже описаны “патчи” для самых простых ошибок в HTML. Если пост привлечет внимание @admin, напишу продолжение.



1. Показать что это HTML 5

Мы знаем что используется HTML 5, но обманываем махини что это XHTML 1.0 Strict. Поэтому давайте заменим

\<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

на

\<!DOCTYPE html>

(\ чтобы отображалось)


Вот таблица результатов всех проверок, показывающая что это HTML 5 (и просто ради интереса): Google Sheets

Внимание: похожие ошибки считаются несколько раз.


2. Сайт на русском и это лучше бы отразить.

Пожалуйста, добавьте lang="ru" в <html> тег



3. Добавить alt в <img> где он отсутствует.

Давайте добавим описание к иконке авторов, анимации загрузки, плюсику на кнопке “добавить пост”, описанию кнопок клавиатуры и знаку RSS в кноке страницы.


<img src="http://cs.pikabu.ru/assets/svg/user.svg" width="10" height="11" class="story__user-icon" alt="от:"><a class="story__author" href="http://pikabu.ru/profile/[username]">[username]</a>



4. Иногда картинки img имеют атрибут data-src вместо src.

Не знаю почему, но иногда (кажется, случайным образом) атрибут называется data-src. Соберу больше данных, если нужно. Пример привести не могу, но перезагрузив страницу несколько раз, вы наткнетесь на него.


Источники:

[0] validator.w3.org

[1] w3schools.com/html/html5_intro.asp

Показать полностью
Отличная работа, все прочитано!