В моём случае, это встроенный в macOS скринридер VoiceOver. На Windows есть Narrator и можно установить бесплатный NVDA, см. A11ycasts, там есть эпизоды про скринридеры ua-cam.com/play/PLNYkxOF6rcICWx0C9LVWWVqvHlYJyqw7g.html
Спасибо, очень полезно. Спасибо за ссылку на проект Веблайнд, всегда хотелось найти все правила по доступности в одном месте и в понятном формате. Поддерживаю, что нужно дорабатывать Правила от Лебедева. Интересно, какая у них будет реакция
Какие-то придирки были к меню, где указана роль ссылки, ведь самое ужасное, это всюду дивы, не было семантического тега nav, забили на заголовки сделав, наверное, для сео один h1, где им нужна помощь, да ладно тег code не стали делать, вдруг на это были какие-то веские причины(которые я представить не могу, но всякое бывает), хоть бы один тег . С виду это сделано на каком-то конструкторе, причём плохом.
Вы всё же неправы: дивы никому жить не мешают. Жить мешает, когда важные элементы (навигация, заголовки, ссылки, кнопки) делают неправильно. Ценность не в семантике (идее), ценность в том, что эта семантика даёт пользователю - хороший или плохой интерфейс.
Спасибо за ваши видео, Вадим! Было здорово, если бы Вы смогли сделать свой аналогичный сайт, куда бы каждый мог смело идти, когда нужно узнать, как доступно сверстать тот или иной элемент. Если, конечно, у Вас есть на это время)
Я думаю, нам пора перестать воспринимать студию Лебедева и их работу как-либо серьёзно. С каждой новостью все смешнее и смешнее. Сложнее верить, что это не попытка привлечь к себе внимание абсурдом и разбором на мемы
К сожалению, там слишком много нужно исправлять. Не знаю, стоит ли браться за это. Возможно нужно предложить им сделать этот сайт в Open Source. И потихоньку переписывать. Кстати, часто замечаю, что сайты студии Лебедева сделаны очень небрежно. То ли их джуны делают, то ли там какие-то бешеные дедлайны, не знаю в чём проблема...
Лебедев как обычно отдал верстку страницы о том "Как надо верстать" на аутсорс. Виноват конечно же не Тёма, а тот человек кто искал верстальщика на бирже. Когда речь идет о тендерных миллионных проектах Тёма скорее всего лично учувствует в поисках исполнителей не биржах.
Судя по описанию, это делал штатный технолог Студии. Похоже, что у них просто мало опыта по созданию хорошей разметки - кажется это первый проект, где идёт речь про доступность. Первый блин комом, но можн научиться.
@@pepelsbey Первый блин комом это когда пытался делать и не получилось. В данном же случае даже не пытались, а просто положили болт и делали как привыкли, как рука набита.
Правила действительно классные. Недавно прогнал скринридером главную страницу своего сайта и удивился как на самом деле звучат аббревиатуры и большие числа с пробелами. Правила помогают решить эти задача на раз. Спасибо.
Идея для сайта очень хорошая, особенно возможность "прочувствовать". Но сверстано реально странно, рад что Вадим взялся помочь ее переписать. И раз уж зашёл разговор о семантике и ограниченных возможностях, Вадим, какой скрин-ридер вы можете посоветовать для windows? Voiceover на мак позволяет и ориентиры искать и текст нормально читает. А на windows я пытался использовать и NVDA, и ChromeVox, но они все неудобные. Заранее спасибо
Идея скриридера в том, что это специальный софт и искать «удобный» это как тестировать все сайты только в любимом браузере. Всё же стоит разобраться и привыкнуть к NVDA или JAWS, чтобы польза от такого тестирования была реальной. VoiceOver на macOS тоже непростой, но я разобрался. См. A11ycasts, там есть эпизоды про скринридеры ua-cam.com/play/PLNYkxOF6rcICWx0C9LVWWVqvHlYJyqw7g.html
Изучая вёрстку, я встречала так много материалов о доступности, важности семантики и необходимости всегда по возможности использовать специальные теги, что "сайт, построенный на дивах" казался мне шуткой, которой не может существовать в реальности. Но вот же он, сайт на дивах, и кто его построил...
Тут такое дело, что в доступности интерфейсов сейчас только такие «профи» есть. Большинство не понимает, зачем это вообще нужно, а остальные умеют как-то так. И единицы умеют это делать. Но ничего, всем расскажем, всех научим :)
Все видео на канале www.youtube.com/@pepelsbey/videos Отдельно плейлист с докладами, может вы про него ua-cam.com/play/PLSFPb_zMfb59WsmrXuswPZCHsXl8OlhS9.html
Ну пошлет он публично "хейтера" в понятном направлении(как он это любит). Это даст индульгенцию разрабам. Мол, барин послал, ничего делать не будем. А, между тем, косяки то есть и было бы неплохо их исправить.
Ой Артемий такой Артемий))) Там под капотом Angular зарыт, может они какой шаблонизатор сверху накинули и вот такое получили.... А вообще бесплатная реклама сайту как делать не надо / Судя по имени домена ребята его завели чисто сливать трафик
В руководстве есть блок «Семантика», который предлагает использовать HTML по назначению, по спецификации. Это помогает делать сайты доступными. По спецификации код нужно размечать именно так. Я не понимаю, что в этом «слишкого».
Если я правильно понимаю - страница делается через какой-то специфический движок и вся верстка была не в тегах html, а в удобном для технического писателя интерфейсе. Вот и красивые правила выложились в неправильном формате :-)
После ваших рекомендаций по семантике, я стал интересоваться во что в действительность рендерятся React компоненты, которые руководство попросило использовать на проекте. И ужаснулся - div'ы глубокой вложенности... Доступность такого интерфейса нулевая. Спасибо за разбор!
28.05.2022 Мобильная верста присутствует но сделано с обрезанием на пол экрана и с остальным не влезанием контента. Ребята видимо просто забили на данный сайт, зачем за хост платят. Если для мобилок он почти не доступен
Кривых сайтов, думаю, поровну. А вот в странах, где доступность информации считается универсальным правом и прописана в законах, всё чуть поживее и у многих появилась мотивация в виде судебных исков. Но я предпочитаю работать через образование, а не запугивание.
Возможно целью было написать страницу неправильным кодом чтобы дать возможность, посетителям этой страницы, самим потренироваться и переделать как указано в рекомендациях.
Изучаю фронтенд, и верстку в частности, уже больше полугода и как то последнее время вокруг стало много информации по поводу доступности, возможно просто совпадение, а возможно кто-то решил и в этой теме трафика поиметь...
@@pepelsbey Ну я склоняюсь к тому, что "алгоритмы рекомендаций" просто только сейчас мне стали выдавать информацию по этой теме. Недавно смотрел стрим с Глафирой Жур на хекслет (не сочтите за рекламу) и там как раз обсуждали платный плагин, который должен добавить "доступность" на сайт. Ну и у Лебедева, само собой, можно заказать "доступный дизайн" - надеюсь, что при заказе уровень "доступности" будет не такой, как в вашем обзоре =)
Я не хотел вам ничего навязывать. И на жалость давить тоже. А «капитализма» в создании доступных интерфейсов очень мало: когда знаешь, как сделать хорошо, дополнительных усилий на это не тратишь. Сколько будет стоить бизнесу вместо глупых ссылок расставить нормальные заголовки? Нисколько. Особенно когда пишешь руководство по доступности. Я до сих пор в шоке от цинизма технолога, честно говоря.
@@exgort Я не знаю на счет отдельного заказа "доступного дизайна", но уровень доступности того, что делает студия Лебедева для тех, кто у них заказывает сайты, примерно такой же (в 2021 году то), как на этом видео: дивы с дивами в дивах. Думаю, доступность все же должна быть по-умолчанию, а не отдельной фичей.
Вадим, как ты смотришь на то, чтобы разобрать с точки зрения доступности и прочего российский сайт госуслуг? На нём есть как минимум проблемы с фокусом, что, как мне кажется, непозволительно для настолько значимого ресурса.
@@pepelsbey кстати да, рассмотреть госуслуги неплохая идея) Мне однажды чтобы понять, почему не принимается заявление на оформление ребёнка в сад, пришлось открыть вкладку Network, где я увидел, что сервер возвращает ошибку с текстом "неподдерживаемый формат изображения" 😬 Причём интерфейс никак об этом не сообщал)
Я считаю, что помогать нужно тем, кто в этом нуждается. Тем, кто хочет сделать хорошо, но пока не знает как. А вот таким студиям Лебедева помогать точно не стоит. Выставлять на общее обозрение - да. У студии явно есть ресурсы и знания, чтобы сделать хорошо и правильно. Но мы видим просто наплевательское отношение и желание сделать быстро и дёшево
@@pepelsbey pandaeyes.ru свёрстано 14 летним товарищем. В перспективе планирующем обучать людей верстке. Если тебе будет не трудно уделить минутку, буду бесконечно признателен. Даже не в формате видео, а может сможешь написать на почту свои замечания. Очень любопытно! Благодарю)
вместо h1-h6 в принципе можно использовать любой тег но надо к нему добавить следующие атрибуты: aria role= heading aria-level= 1 (число зависит от уровня вложености заголовка)
@@pepelsbey Согласен, есть такое правило, но конкретно причина почему так делать нельзя не указана. Со скринридера заголовок будет такой же как если бы мы обьявили его через тер H1-H6, как я понимаю основрая причина кроеться в том что мы можем забыть реализовать какоето нативное повередение елемента (как с той же кнопкой - обработчик на пробел итд, ария роль нам этого не даст по умолчанию). Но выедь бывают случаи когда нету возможности использовать семантически правильный елемент, а доступность делать надо.
Конкретная причина состоит в надёжности такого способа (не все скринридеры знают все ARIA-атрибуты) и в том, что он решает дополнительные задачи (понятность и простота для всех разработчиков, стилизация в режиме для чтения, экспорт в RSS). То есть это очень простой принцип: можете сделать на тегах - отлично, делайте так, не надо усложнять. Не можете сделать на тегах? Жаль, многое теряете. Что ж, давайте выкручиваться так или иначе.
Правильные комментарии. Раз уж люди выпускают правила правильной верстки, неплохо бы самим придерживаться этих правил. Ясно, что у них там Ангуляр с каким-то своим набором компонентов, но нельзя забывать, что по итогу все все равно превращается в html+css+js. Да и Ангуляр на статической страничке смотрится, мягко говоря, странно.
К сожалению, это делали люди. Просто неопытные или почему-то посчитавшие, что это неважно. Хотя текст руководства пытается их убедить в обратном. Удивительно.
VoiceOver лучше работает в Chrome, так что я его для таких дел открываю. Плюс инспектор публике больше знаком. Но часто у меня и Firefox в кадре, не переживайте ;)
Перефразирую немного цитату из многим известного и очень классного фильма:"Спецификация - это лишь свод указаний, а не жёстких законов!"😏 И вот до тех пор, пока это лишь рекомендации - мы будем получать подобную...дичь😖
Я понимаю вашу мотивацию, но вы всё же неправы. Регулировать примерение рекомендаций должны законы и профессиональное сообщество, которое поможет их писать.
Заинтригован, и чем всё закончилось? Я про предложение Лебедеву переверстать сайт бесплатно... Готов поспорить, что «Дизайнер № 1 Всея Руси» не отреагировал - «Переделывать проекты - плохая примета»
00:00 Интро
00:31 Презентация проекта
01:14 Обзор проекта
01:36 Общие впечатление
02:48 Правила врут
04:16 Семантика
04:58 Заголовки
07:39 Фрагменты кода
09:13 Бургерное меню
12:48 Нужно помочь
13:47 Аутро
Вадим, какую программу Вы используете для проверки a11y? Которая выводит заголовки и прочее
В моём случае, это встроенный в macOS скринридер VoiceOver. На Windows есть Narrator и можно установить бесплатный NVDA, см. A11ycasts, там есть эпизоды про скринридеры ua-cam.com/play/PLNYkxOF6rcICWx0C9LVWWVqvHlYJyqw7g.html
Когда думаешь что делаешь плохо, но после просмотра этого видео, осознаешь что не так уж и плохо. Аж слезу пустить захотелось.
Зашла в презу с телефона - и офигела с первого экрана)) адаптив на грани фантастики))
бюджет видимо кончился на разработку мобильной версии, а делать адаптивность сразу, в бюджет уже не входило)
Спасибо, очень полезно. Спасибо за ссылку на проект Веблайнд, всегда хотелось найти все правила по доступности в одном месте и в понятном формате. Поддерживаю, что нужно дорабатывать Правила от Лебедева. Интересно, какая у них будет реакция
Так здорово это видеть ! Красота! Благодарю за контент
Круто! Хотелось бы увидеть вашу верстку этой страницы, если та сторона согласится.
Даже если не согласится - сделаю :)
«Это фиаско, братан»
Какие-то придирки были к меню, где указана роль ссылки, ведь самое ужасное, это всюду дивы, не было семантического тега nav, забили на заголовки сделав, наверное, для сео один h1, где им нужна помощь, да ладно тег code не стали делать, вдруг на это были какие-то веские причины(которые я представить не могу, но всякое бывает), хоть бы один тег . С виду это сделано на каком-то конструкторе, причём плохом.
Вы всё же неправы: дивы никому жить не мешают. Жить мешает, когда важные элементы (навигация, заголовки, ссылки, кнопки) делают неправильно. Ценность не в семантике (идее), ценность в том, что эта семантика даёт пользователю - хороший или плохой интерфейс.
Читала вебблайнд, мне понравилось) люблю ваши футболки!
На этот раз футболка была как раз Студии Лебедева, тематическая )
Ангуля́рили, ангуля́рили, да не вы́ангулярили.
Там классы _ng... назывались, походу да 🙉
Я даже подумать не мог, что так бывает.
"Не живи, как живёт мулла; живи, как говорит мулла" :)
Спасибо за видео, Вадим! Прям безумно приятно смотреть в ключе позитивной критики и предложения улучшения. Это вдохновляет!
не забудьте про адаптивность. а то сейчас мобильной версии вообще нет
Спасибо Вадим! Как всегда все четко и профессионально
Спасибо за ваши видео, Вадим!
Было здорово, если бы Вы смогли сделать свой аналогичный сайт, куда бы каждый мог смело идти, когда нужно узнать, как доступно сверстать тот или иной элемент.
Если, конечно, у Вас есть на это время)
Уже есть парочка, в которых я так или иначе участвовал:
weblind.ru/
web-standards.ru/articles/tags/a11y/
@@pepelsbey спасибо большое!
Какой же вы классный! Особенно про помощь! Респект!!!
Хорошое видео, Вадим. Особенно тем, что вы предлагайте помощь ребятам. Это достойный пример, в мире «удаленных критиков»)
проект хороший, вернее направление. разработчик какой учится, и как мы все. спасибо не только за критику, но и желание помочь проекту стать лучше
Судя по состоянию сайта на 07.02.2022 - от помощи они отказались :)
Мда, неловко вышло... спасибо, Вадим!
Зачёт!!! )) Вадим - поклон в пол тебе )
Как всегда отлично, спасибо!
Классный разбор!
На Ангулар в основном с бека переходят , так что не удивительно , что тот кто собирал сайт не разбирался в семантике и прочих вещах.
хуже когда на бек переходят с Ангуляра...
Я думаю, нам пора перестать воспринимать студию Лебедева и их работу как-либо серьёзно.
С каждой новостью все смешнее и смешнее. Сложнее верить, что это не попытка привлечь к себе внимание абсурдом и разбором на мемы
Думаю, что это просто слеплено на каком-нибудь конструкторе типа тильды, лишь бы быстрее разместить в сети.
все очень круто! доступно! красава!
Респект, контент огонь, смотрю тебя как видео версию хабра!
К сожалению, там слишком много нужно исправлять. Не знаю, стоит ли браться за это. Возможно нужно предложить им сделать этот сайт в Open Source. И потихоньку переписывать.
Кстати, часто замечаю, что сайты студии Лебедева сделаны очень небрежно. То ли их джуны делают, то ли там какие-то бешеные дедлайны, не знаю в чём проблема...
Веблайнд уже в опенсорсе, так что и не нужно :) Учитывая, что почти весь контент снят оттуда github.com/web-standards-ru/weblind.ru/
Спасибо за разбор. Интересно согласится ли Лебедев на это предложение.
Лебедев как обычно отдал верстку страницы о том "Как надо верстать" на аутсорс. Виноват конечно же не Тёма, а тот человек кто искал верстальщика на бирже. Когда речь идет о тендерных миллионных проектах Тёма скорее всего лично учувствует в поисках исполнителей не биржах.
Судя по описанию, это делал штатный технолог Студии. Похоже, что у них просто мало опыта по созданию хорошей разметки - кажется это первый проект, где идёт речь про доступность. Первый блин комом, но можн научиться.
@@pepelsbey Первый блин комом это когда пытался делать и не получилось. В данном же случае даже не пытались, а просто положили болт и делали как привыкли, как рука набита.
@@pepelsbey первый блин комом? Засунуть код в дивы - это уже не ком, это вредительство.
Правила действительно классные. Недавно прогнал скринридером главную страницу своего сайта и удивился как на самом деле звучат аббревиатуры и большие числа с пробелами. Правила помогают решить эти задача на раз. Спасибо.
сейчас Артемий заявит что сайт верстала нейросеть и словит хайп. Он в этом большой профи.
Самое забавное что нейросеть и то больше семантики и доступности при верстке использует :)
подписался, поставил лайк
Увидел надпись на футболке Вадима и сразу захотелось нажать "Tab"!
Идея для сайта очень хорошая, особенно возможность "прочувствовать". Но сверстано реально странно, рад что Вадим взялся помочь ее переписать. И раз уж зашёл разговор о семантике и ограниченных возможностях, Вадим, какой скрин-ридер вы можете посоветовать для windows? Voiceover на мак позволяет и ориентиры искать и текст нормально читает. А на windows я пытался использовать и NVDA, и ChromeVox, но они все неудобные. Заранее спасибо
Мне тоже очень понравилась идея, но жаль, что они сами её не прочувствовали.
Идея скриридера в том, что это специальный софт и искать «удобный» это как тестировать все сайты только в любимом браузере. Всё же стоит разобраться и привыкнуть к NVDA или JAWS, чтобы польза от такого тестирования была реальной. VoiceOver на macOS тоже непростой, но я разобрался. См. A11ycasts, там есть эпизоды про скринридеры ua-cam.com/play/PLNYkxOF6rcICWx0C9LVWWVqvHlYJyqw7g.html
Изучая вёрстку, я встречала так много материалов о доступности, важности семантики и необходимости всегда по возможности использовать специальные теги, что "сайт, построенный на дивах" казался мне шуткой, которой не может существовать в реальности. Но вот же он, сайт на дивах, и кто его построил...
Вы не поняли - это другое! Это же Лебедев! 🤣🤣🤣
Подарите Тёме Лебедеву скидку на курсы HTML академии, пока они ещё больше дров не наломали...
Отлично когда есть кому показать ребятам считающих себя "профи" кто они на самом деле
Тут такое дело, что в доступности интерфейсов сейчас только такие «профи» есть. Большинство не понимает, зачем это вообще нужно, а остальные умеют как-то так. И единицы умеют это делать. Но ничего, всем расскажем, всех научим :)
а куда твои видео подевались? было же про семантику, про неправильные интерфейсы и т.д.
Все видео на канале www.youtube.com/@pepelsbey/videos
Отдельно плейлист с докладами, может вы про него ua-cam.com/play/PLSFPb_zMfb59WsmrXuswPZCHsXl8OlhS9.html
Дайте знать когда сверстаете семантические верно, интересно посмотреть.
Пока тишина, шансов мало (
@@pepelsbey эх, жаль..я смотрю они даже боковое меню в асайд залили) это просто жесть)
У всех есть такой знакомый, как этот сайт: всех учит, как надо жить, но при этом сам этого не делает
Отправьте Лебедеву на почту. Будет круто если Вадима в новостях упомянет :)
Я не думаю, что Тёме есть дело до технологий. Я написал тем, кто этот проект делал.
Ну пошлет он публично "хейтера" в понятном направлении(как он это любит). Это даст индульгенцию разрабам. Мол, барин послал, ничего делать не будем. А, между тем, косяки то есть и было бы неплохо их исправить.
Я прям прочувствовал проблемы с восприятием. Захотелось Помочь проекту. Куда отправлять деньги на лечение)
11:28 почувствовал всю боль
Вадим, по возможности дай знать, чем дело закончилось.
Уважаю тебя, уважаю Артемия, хочется, чтобы у всех всё было хорошо. Спасибо за контент!
Ой Артемий такой Артемий))) Там под капотом Angular зарыт, может они какой шаблонизатор сверху накинули и вот такое получили.... А вообще бесплатная реклама сайту как делать не надо / Судя по имени домена ребята его завели чисто сливать трафик
Мне понравилось, что ты в конце предложил. Надо вместе менять ситуацию. Было бы круто, если бы проект стал опенсорсным.
«Такой хоккей нам не нужен!»
В целом согласен но блок для отображения кода с подсветкой синтаксиса внутри это уже слишком
В руководстве есть блок «Семантика», который предлагает использовать HTML по назначению, по спецификации. Это помогает делать сайты доступными. По спецификации код нужно размечать именно так. Я не понимаю, что в этом «слишкого».
Как всегда - по факту)
Если я правильно понимаю - страница делается через какой-то специфический движок и вся верстка была не в тегах html, а в удобном для технического писателя интерфейсе. Вот и красивые правила выложились в неправильном формате :-)
Да, это всё объясняет, но совершенно не оправдывает )
Год прошел - ничего не поменялось на этом сайте
Спустя год ничего не поменялось, хотя якоря они переделали, а вот код как был в дивах так и остался))))
они не согласились))
Интересно каким станет веб когда технологии подобные NeuraLink станут повсеместны как смартфоны)
жесть какая. невероятно) ладно бы верстальщик не знал об этих нюансах, но в статье как раз эти правила и описаны, но не применяются. шок.
После ваших рекомендаций по семантике, я стал интересоваться во что в действительность рендерятся React компоненты, которые руководство попросило использовать на проекте. И ужаснулся - div'ы глубокой вложенности... Доступность такого интерфейса нулевая.
Спасибо за разбор!
Так результат рендера зависит не от реакта, а от разработчика и/или библиотеки компонентов, которую он использует.
28.05.2022 Мобильная верста присутствует но сделано с обрезанием на пол экрана и с остальным не влезанием контента. Ребята видимо просто забили на данный сайт, зачем за хост платят. Если для мобилок он почти не доступен
А такой вопрос если сравнивать сайты СНГ и Зарубежные. Где больше кривых сайтов .
Кривых сайтов, думаю, поровну. А вот в странах, где доступность информации считается универсальным правом и прописана в законах, всё чуть поживее и у многих появилась мотивация в виде судебных исков. Но я предпочитаю работать через образование, а не запугивание.
Это нехорошая тенденция. Максимально удешевить производство. Никакого контроля. Очень многие встают на эту скользкую дорожку.
Орнул😁
Ну как? Получилось помочь проекту?)
Не очень, я пытался
Возможно целью было написать страницу неправильным кодом чтобы дать возможность, посетителям этой страницы, самим потренироваться и переделать как указано в рекомендациях.
Это исчезающе тонко, вплоть до бессмысленности (
А есть продолжение истории, Вадим? Судя по исходникам стало получше.
Продолжения не было к сожалению, хотя связывались и даже что-то хотели сделать
Столько пафоса и такое отсутствие энтузиазма я видела только у студии Лебедева. Я не удивлена, что они не следуют даже своим правилам
Изучаю фронтенд, и верстку в частности, уже больше полугода и как то последнее время вокруг стало много информации по поводу доступности, возможно просто совпадение, а возможно кто-то решил и в этой теме трафика поиметь...
Это вы только голову подняли, в сообществе давно об этом речь - лет пять, не меньше. Читайте, вам ещё пригодится web-standards.ru/articles/tags/a11y/
@@pepelsbey Ну я склоняюсь к тому, что "алгоритмы рекомендаций" просто только сейчас мне стали выдавать информацию по этой теме. Недавно смотрел стрим с Глафирой Жур на хекслет (не сочтите за рекламу) и там как раз обсуждали платный плагин, который должен добавить "доступность" на сайт. Ну и у Лебедева, само собой, можно заказать "доступный дизайн" - надеюсь, что при заказе уровень "доступности" будет не такой, как в вашем обзоре =)
Я не хотел вам ничего навязывать. И на жалость давить тоже. А «капитализма» в создании доступных интерфейсов очень мало: когда знаешь, как сделать хорошо, дополнительных усилий на это не тратишь. Сколько будет стоить бизнесу вместо глупых ссылок расставить нормальные заголовки? Нисколько. Особенно когда пишешь руководство по доступности. Я до сих пор в шоке от цинизма технолога, честно говоря.
@@exgort Я не знаю на счет отдельного заказа "доступного дизайна", но уровень доступности того, что делает студия Лебедева для тех, кто у них заказывает сайты, примерно такой же (в 2021 году то), как на этом видео: дивы с дивами в дивах. Думаю, доступность все же должна быть по-умолчанию, а не отдельной фичей.
Вадим, как ты смотришь на то, чтобы разобрать с точки зрения доступности и прочего российский сайт госуслуг? На нём есть как минимум проблемы с фокусом, что, как мне кажется, непозволительно для настолько значимого ресурса.
Плохих сайтов много. Я обычно ищу те, которые помогают подчеркнуть какую-то идею. Гляну на Госуслуги в этом ключе, спасибо за идею :)
@@pepelsbey кстати да, рассмотреть госуслуги неплохая идея)
Мне однажды чтобы понять, почему не принимается заявление на оформление ребёнка в сад, пришлось открыть вкладку Network, где я увидел, что сервер возвращает ошибку с текстом "неподдерживаемый формат изображения" 😬
Причём интерфейс никак об этом не сообщал)
я понял - сайт верстал Капитан Америка. Его заморозили 20 лет назад и только что разморозили, чтобы он сверстал сайт и опять заснул еще лет на 20.
Ещё и на Angular'е
Фреймворк как фреймворк, не в нём проблема.
@@pepelsbey, фреймворк не нужен для такого, я не побоюсь этого слова, лендинга.
Да. Я к тому, что контент вряд ли будет меняться очень часто - можно было бы и статичной страничкой положить
повеселили они )))
Я считаю, что помогать нужно тем, кто в этом нуждается. Тем, кто хочет сделать хорошо, но пока не знает как. А вот таким студиям Лебедева помогать точно не стоит. Выставлять на общее обозрение - да. У студии явно есть ресурсы и знания, чтобы сделать хорошо и правильно. Но мы видим просто наплевательское отношение и желание сделать быстро и дёшево
У нас разные взгляды: я считаю, что помогать нужно всем. Особенно тем, кто только начинает - как Студия.
Пример с доктором и тренером, меня просто убило (:
Видимо страница сделана в каком инструменте а не наверстана руками
Что конечно её не оправдывает )
Вадим, привет! Подскажи почту или нужную ссылку, куда ты принимаешь предложения сайтов для этой рубрики. Спасибо)
А вот прямо здесь :)
@@pepelsbey pandaeyes.ru свёрстано 14 летним товарищем. В перспективе планирующем обучать людей верстке. Если тебе будет не трудно уделить минутку, буду бесконечно признателен. Даже не в формате видео, а может сможешь написать на почту свои замечания. Очень любопытно! Благодарю)
Рано или поздно все начнут бояться выкладывать некачественные сайты)
Не нужно бояться, нужно понимать )
вместо h1-h6 в принципе можно использовать любой тег но надо к нему добавить следующие атрибуты: aria role= heading aria-level= 1 (число зависит от уровня вложености заголовка)
Это не покрывает всех плюсов от заголовков и противоречит основной идее ARIA (откуда эти атрибуты) - предпочитайте встроенные теги.
@@pepelsbey не могли бы вы дать ссылку на материал или обьяснить в двух словах почему ариа не заменяет встроеных тегов?
> First Rule of ARIA Use: If you can use a native HTML element […] then do so. www.w3.org/TR/using-aria/#firstrule
@@pepelsbey Согласен, есть такое правило, но конкретно причина почему так делать нельзя не указана. Со скринридера заголовок будет такой же как если бы мы обьявили его через тер H1-H6, как я понимаю основрая причина кроеться в том что мы можем забыть реализовать какоето нативное повередение елемента (как с той же кнопкой - обработчик на пробел итд, ария роль нам этого не даст по умолчанию). Но выедь бывают случаи когда нету возможности использовать семантически правильный елемент, а доступность делать надо.
Конкретная причина состоит в надёжности такого способа (не все скринридеры знают все ARIA-атрибуты) и в том, что он решает дополнительные задачи (понятность и простота для всех разработчиков, стилизация в режиме для чтения, экспорт в RSS). То есть это очень простой принцип: можете сделать на тегах - отлично, делайте так, не надо усложнять. Не можете сделать на тегах? Жаль, многое теряете. Что ж, давайте выкручиваться так или иначе.
Вадим фактически отхлестал по щекам всю контору хвалённого Лебедева.
6 разработчиков этого проекта поставили дизлайки)
Правильные комментарии. Раз уж люди выпускают правила правильной верстки, неплохо бы самим придерживаться этих правил. Ясно, что у них там Ангуляр с каким-то своим набором компонентов, но нельзя забывать, что по итогу все все равно превращается в html+css+js.
Да и Ангуляр на статической страничке смотрится, мягко говоря, странно.
Так это же нужно откопать такие ангуляр компоненты с штмл 10летней давности... о_О
У Лебедева похоже теперь все делает нейросеть.
К сожалению, это делали люди. Просто неопытные или почему-то посчитавшие, что это неважно. Хотя текст руководства пытается их убедить в обратном. Удивительно.
В сказки все досе верят .
Тренера не играют
А что за микрофон у Вадима?
Это Audio-Technica BP40, в описании видео есть все подробности про технику.
Вадим, а как же Firefox?! ;)
VoiceOver лучше работает в Chrome, так что я его для таких дел открываю. Плюс инспектор публике больше знаком. Но часто у меня и Firefox в кадре, не переживайте ;)
Качество Лебедева уже не то, хотя в его книжку Ководство Своим сотрудникам давал почтитать.
Они б ещё тег font вместо спанов юзали в 2к21
Перефразирую немного цитату из многим известного и очень классного фильма:"Спецификация - это лишь свод указаний, а не жёстких законов!"😏 И вот до тех пор, пока это лишь рекомендации - мы будем получать подобную...дичь😖
Я понимаю вашу мотивацию, но вы всё же неправы. Регулировать примерение рекомендаций должны законы и профессиональное сообщество, которое поможет их писать.
Замечательный у них говнокод получился :)
Лебедев всегда был фарсом.
- Это какой-то... позор?!
© Швондер
Это какой-то позор. Крайне непрофессионально.
С телефона зашёл, вообще печально
Вот что бывает когда всем действительно плевать на результат. И заказчику и исполнителю.
Зато ТехнАлогИи!
Похоже на генератор сайтов какой-то
Ну и как, приняли лебедевцы предложение помочь? почти год пргошел
Связывались, планировали что-то, но не случилось
Ну такое чувство как будто какая-то очередная нейросеть верстала
с апреля на странице так ничего и не поменялось позорище. Вадим - красавчик
Заинтригован, и чем всё закончилось? Я про предложение Лебедеву переверстать сайт бесплатно...
Готов поспорить, что «Дизайнер № 1 Всея Руси» не отреагировал - «Переделывать проекты - плохая примета»
Мне ответили, жду развития событий )