Топ 10 неочевидных ошибок в верстке HTML/CSS

  Рет қаралды 19,482

От 0 до 1

От 0 до 1

Күн бұрын

Пікірлер: 138
@Marylovesautumn
@Marylovesautumn Жыл бұрын
Наш любимый диджей вечеринок!!!! Спасибо за видео, бегу за чаем и устраиваюсь за компьютером.
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
круть!
@serg-k
@serg-k Жыл бұрын
Учимся у лучших, чтобы стать лучшими. 10🐺/10
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
спасибо
@cy66a
@cy66a Жыл бұрын
1. Задавать классы User-generated content, 0:51 2. Hover на мобильных устройствах, 3:56 3. Семантика, 5:08 4. Именование классов, 7:06 5. Задавать высоту, 8:10 6. Длинные вложенности селекторов, 9:15 7. Не защитить user content, 10:21 8. Размер и формат картинок, 12:15 9. Не задавать вопросы, 13:08 10. Сделать счастливым заказчика (работодателя) метод БДСМ, 15:56
@varvara_barva
@varvara_barva Жыл бұрын
Спасибо, добрый человек
@Marylovesautumn
@Marylovesautumn Жыл бұрын
Спасибо огромное!
@ЛюсяРыбальченко-з3ш
@ЛюсяРыбальченко-з3ш Жыл бұрын
Каждый видос как маленький праздник для меня. Спасибо за хорошее настроение!
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
круто, спасибо
@upwlqwp
@upwlqwp Жыл бұрын
Спасибо большое, Вадим тебя можно слушать бесконечно. Это гениально сгенерированные примеры просто нечто❤️‍🔥
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
Благодарю)
@Андрей-й9п7л
@Андрей-й9п7л Жыл бұрын
Вадим, мое почтение, ты лучший из всех преподавателей, очень легко и весело с тобой учиться, спасибо что ты есть. Жаль что все так выходит в нашем мире... Сил тебе!
@СлавянПустовит
@СлавянПустовит Жыл бұрын
Ты как всегда, все четко и понятно! Спасибо за курс! Считаю, что решение пойти на него было одним из лучших моих решений)) Успехов во всем!!!
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
Благодарю! отлично поработали! мне очень приятно
@sezimaz
@sezimaz Жыл бұрын
Единственная вечеринка на которую мне хочется после 20 лет
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
круть, туса)
@АндрейСкобляков-з6к
@АндрейСкобляков-з6к Жыл бұрын
Вадим, спасибо большое за марафоны и за эти самые топовые вечеринки. Тебя слушать одно удовольствие и учится очень легко на все 💯. Отличная подача материала. Удачи тебе. Здоровья и мирного неба тебе и твоим близким✌️
@raki_k_drake
@raki_k_drake Жыл бұрын
Всё чётко. Как всегда. А можно видео для новичков какими словами правильно называть классы в той или иной ситуации? С конкретными примерами.
@dre._
@dre._ Жыл бұрын
Сегодня я взял свой первый заказ на 20$ благодаря вам ,хочу сказать большое спасибо за ваш труд
@user-natal04ka
@user-natal04ka Жыл бұрын
Не подскажите на какой площадке лучше искать заказы?
@ТыкваРепка
@ТыкваРепка Жыл бұрын
Выслушал вас, все понял и принял , так доступно и понятно обьяснить нужно иметь талантище. Спасибо!!!
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
спасибо) долго работал над этим)
@dotlavv
@dotlavv Жыл бұрын
дизайнер руководствуется логикой. Это может быть странно.... Я долго смеялся с этого)) Вадим, ты лучший 🦾
@Jane_123
@Jane_123 Жыл бұрын
Спасибо за доступное изложение полезной информации.
@aleksandrkobelev8868
@aleksandrkobelev8868 Жыл бұрын
У Вадима всегда самые крутые вечеринки!!!!!!
@artkkk7443
@artkkk7443 Жыл бұрын
Вадян ты очень крутой специалист! Удачи тебе во всех твоих проектах!
@seriously7791
@seriously7791 Жыл бұрын
Вадим, спасибо тебе за отличный контент! Так держать! Подписка, лайк однозначно!
@v.prochniy63
@v.prochniy63 Жыл бұрын
Привет, Давно не встречал вас. Бороду отпустили не узнать. Смотрю все окей: жив ,здоров.,а значит будут еще видосы.
@СергейМорозов-к4я
@СергейМорозов-к4я Жыл бұрын
Все просто и понятно как всегда ! Красава Вадик!
@aleksandralessandrovich2386
@aleksandralessandrovich2386 Жыл бұрын
Заглянул я как-то на эту вечеринку, и Вадим подсадил меня на верстку…🎉
@ВладиславТихонов-р5ь
@ВладиславТихонов-р5ь Жыл бұрын
классный видос, спасибо, ждем возвращение, гуру!
@cy66a
@cy66a Жыл бұрын
Спасибо, Вадим!
@Arefevpro
@Arefevpro Жыл бұрын
Спасибо за эту вечеринку)
@vimvexvimvex8780
@vimvexvimvex8780 Жыл бұрын
Подача материала просто супер )
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
спасибо
@Anodoree
@Anodoree Жыл бұрын
Вадим, спасибо тебе огромное за курс) В очередной раз благодарю) Заскакивал с некоторым багажом знаний больше полутора лет назад) Как раз с задержкой на пару недель залетал) В итоге - знания упорядочились значительно, курс с ментором - пушка! Стал увереннее искать работу, в итоге первый заказ через пару месяцев только нашёл (за сомнительную "шляпу" не брался намеренно), продолжал фрилансить вполне успешно, а вот уже более полугода на удалёнке официально) Люблю вёрстку) Спасибо! Рад, что продолжаешь учить людей качеству) Успехов!) Народ, рекомендую от чистого сердца) Да, буд-то заказанное, сам раньше к таким комментам скептически относился, если не сказать более. Но что поделать, когда от души человеку и его делу благодарен?) В общем, думайте, что хотите. Было не шибко просто, но я достиг своей цели, и иду дальше) И во многом благодаря Вадиму и его курсу с ментором)
@Anodoree
@Anodoree Жыл бұрын
И по теме. Учитывание сих неочевидных ошибок - огромнейший плюс к вашему успеху в деле. Решил вот посмотреть, убедиться в своём пути, послушать интересную речь с юмором - не прогадал, как обычно) всё чётко и праивильно) А как иначе у Вадима) Больше думаем головой - и всё будет лучше) Неочевидные резонансные моменты порой должны только давать повод к размышлению и нахождению ответа, а не к опусканию рук) Думаем и работаем!)
@luckytima2315
@luckytima2315 Жыл бұрын
я: да я же сделал все как Вадим показывал так-же я :
@natalialiakhovych
@natalialiakhovych Жыл бұрын
Дивлюся ваше перше відео! Ваша вєчєрінка мені офігєть як подобається, ваша буква ггг, одразу мені сказала, що свій чувак і все по темі теж топ 💙😉
@Gazovchik
@Gazovchik Жыл бұрын
Интересная тема Жаль смотреть пока некогда....... Всем успехов в обучении. Мира и добра.
@ИгорьГлазков-с1б
@ИгорьГлазков-с1б Жыл бұрын
Спасибо Вадим.
@pol_puh
@pol_puh Жыл бұрын
Спасибо за контент? Скоро будет видос про совершенствование сборки gulp для работы с картинками и шрифтами
@МиронД-э4ш
@МиронД-э4ш Жыл бұрын
Как всегда жирный лайк!))
@vitaliisapryga4825
@vitaliisapryga4825 Жыл бұрын
Очень полезное видео особенно для новачков! Интересно будет ли продолжение по gulp сборке?
@VladimirOnokhov
@VladimirOnokhov Жыл бұрын
Крутой видос! Спасибо. Сделаешь видео про фишки в верстке для новичков? Что-то типа margin: 0 auto (чтобы выравнить по ширине контента). Думаю будет полезно для старта, чтобы так сказать получить пул знаний и дальше только практика
@manuchehrqoriev
@manuchehrqoriev Жыл бұрын
Спасибо большое ❤. 13:08 где можно найти видео об форм изображение
@Panda_ex_
@Panda_ex_ Жыл бұрын
Локи-король вечеринок это хорошо было😂
@avalex82
@avalex82 Жыл бұрын
опа, go-surf (складний лендос) не так давно заверстав)) а відео тільки побачив, цікаво буде подивитися)
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
супер, молодцем!
@bandrones
@bandrones Жыл бұрын
Спасибо, очень интересно!
@user-frond-end_dev
@user-frond-end_dev Жыл бұрын
спасибо за годный контент!!! 2-ая часть, продолжение будет?
@tatigerbst4416
@tatigerbst4416 Жыл бұрын
Спасибо тебе большое!👍👍👍
@РусланМинеев-е2р
@РусланМинеев-е2р Жыл бұрын
Все разжёвано проглотил с удовольствием) Спасибо.
@twitch3255
@twitch3255 Жыл бұрын
Пожалуйста а можете сказать, сколько Вам времени пришлось чтобы выучить это все, я знаю что развиваться надо постепенно, но интересно хотя бы когда Вы изучили и нормально без всяких спокойно начали верстать, просто строчить без бб, сколько времени прошло (дней) на прокачку навыков? сколько часов на изучения вообщем и в день? где Вы набрали первых своих клиентов?
@kekoffer852
@kekoffer852 9 ай бұрын
МЕТОД БДСМ - ТОП!
@Victorianos-ls7qy
@Victorianos-ls7qy Жыл бұрын
Привет , можешь снять видео как натягивать верстку на wordpre? спс за ведео очень помогают
@mEden-xw2ke
@mEden-xw2ke Жыл бұрын
Здравствуйте, продолжение gulp ближайшее время будет ? Или не ждать и самому пытаться настроить
@front_praxis
@front_praxis Жыл бұрын
Слушаем и впитываем !
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
топчик
@vladimirzvyagincev8193
@vladimirzvyagincev8193 Жыл бұрын
Четенько🤘
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
по красоте )
@Alex-kc3mn
@Alex-kc3mn Жыл бұрын
Спасибо
@drawusoon
@drawusoon Жыл бұрын
не по колокольчику, а по зову сердца!)
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
ты же мой родной=)
@BorealisAndre
@BorealisAndre Жыл бұрын
Спрошу под этим видео. Хотел спросить: Есть задача сделать документацию на веб. В наличии много документов (текст+фото+видео) по ремонту и обслуживанию. Нужно сделать это все интерактивным переход от одного документа к другому, запуск видео, просмотр фото. Для этой цели подумываю сделать в видео HTML. Все это должно находиться локально без контакта с интернет. На какие средства стоит обратить внимание ? Нудны какие то решения вроде конструкторов сайта или может wordpress ?
@denismoskvichov8691
@denismoskvichov8691 Жыл бұрын
Привет сделай пожалуйста пооду по gulp
@ivanbrest7650
@ivanbrest7650 Жыл бұрын
При каких разрешениях (и ниже) стоит убирать Hover на мобильных устройствах?
@vladimirchekanov7053
@vladimirchekanov7053 Жыл бұрын
На это курс уже не успел наверно. Когда будет следующий?
@mEden-xw2ke
@mEden-xw2ke Жыл бұрын
Когда будет продолжение gulp ?
@1995taunus
@1995taunus Жыл бұрын
Вадим, спасибо за ваши видео. Сейчас уже поздно спустя 3 недели записываться на ваш курс начавшийся 20 марта. Вы наверно столько работы в него вложили, что будет жаль сделать его одноразрвым. Повтора не будет? Или может будет можно этот курс купить в записи для самостоятельного изучения?
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
можете мне в телеграм написать, ник @silver8light
@zlatan6565
@zlatan6565 Жыл бұрын
Вадик,давай новые видосики выпускай !
@asgard1428
@asgard1428 Жыл бұрын
Добрый день. Большое спасибо Вам за очередное классное видео. Можно вопрос? У меня такая проблема в vs code, между фигурными скобками (при нажатии на энтер) когда одна скобка опускается вниз, перестала появляться пустая строка. Получается так { }, а должно быть вот так { }. Что может быть? Я уже все настройки пересмотре, снес vs code и заново установил и все равно осталась эта проблема. Пожалуйста, помогите. Это отнимает столько времени.
@technoline-5758
@technoline-5758 Жыл бұрын
Вадим,подскажите как Вы относитесь к webflow? Я с самого начала работаю только с традиционной вёрсткой..хотелось бы услышать Ваше мнение
@ДмитрийКласс-н4б
@ДмитрийКласс-н4б Жыл бұрын
будут ли уроки по git?)
@dimaslayer491
@dimaslayer491 Жыл бұрын
Спасибо что рассказал про план обучения по твоим видосам, учусь по твоим марафонам, стараюсь где-то сделать сам, а потом смотрю как это сделал ты. Уже месяц занимаюсь, но прогресс не чувствуется, включаю следующий видос, думаю щас как сам сделаю весь сайт и спотыкаюсь уже через 15 минут верстки. Может кто подскажет, так и должно быть, или всё таки я как-то неправильно учусь?
@Arkady-777
@Arkady-777 Жыл бұрын
У Вадима только курс на 1,5 месяца рассчитан, где тебя в темпе вальса ведут с кучей инфы и нюансов и очередности по сложности... и даже после этого надо еще поверстать, что бы закрепилось всё. А ты самостоятельно ... скорее всего по вершкам прошелся
@dimaslayer491
@dimaslayer491 Жыл бұрын
@@Arkady-777 ты прав, скорее всего так и есть
@sovel1489
@sovel1489 Жыл бұрын
Не переживай, делай дальше и всё получится, здесь главное практика)
@computercomputer3293
@computercomputer3293 Жыл бұрын
К сожалению поздно появился пк и поздно узнал про верстку, нет возможности выдешить достаточное время на самообучение. Но в общем если на чем-то спотыкаюсь, то ищу информацию в интернете. Как правило находится. Поэтому практика реально рулит, особенно если макет ставит интересные задачи. А можно привести пример на чем спотыкнулись вы? Модет и помочт чем-то получится
@dimaslayer491
@dimaslayer491 Жыл бұрын
@@computercomputer3293 так не, я же говорю, ставлю ролик на паузу, пытаюсь сделать дальше и довольно быстро наступает момент, когда не понимаю как делать дальше. Потом включаю ролик, смотрю как надо делать, пробиваю себе смачный фэйспалм, от понимания того что тормоз и делаю дальше. Свои проекты пока не делал, что бы совета искать) А так спасибо)
@cormoranstrike7096
@cormoranstrike7096 Жыл бұрын
Вадос в своих уроках на ютубе вроде бы и сам hover не убирает при адаптиве
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
это чтобы веселее было =)
@computercomputer3293
@computercomputer3293 Жыл бұрын
Хочется спросить, а задавать высоту через min-height тоже плохая практика?
@waishan7929
@waishan7929 Жыл бұрын
А можно ссылку на новый сайт с курсом?
@ukraine1514
@ukraine1514 11 ай бұрын
Лайк,подписка. Сижу в тюрьме и учусь.... Спасибо😜👍
@vadymprokopchuk
@vadymprokopchuk 11 ай бұрын
молодцом, пожалуйста
@ukraine1514
@ukraine1514 11 ай бұрын
@@vadymprokopchuk Вадим,будет желанье и возможность,сделать курс по js,что б была вечериночка😁 с удовольствием записался бы на курс,но... Подневольный человек и естт есть ограничения🤷
@jamjam3337
@jamjam3337 Жыл бұрын
👏👍
@dimondimonov6417
@dimondimonov6417 Жыл бұрын
Где найти монтера? шоб проверял работы,подсказывал,указывал на ошибки,помогал исправлять.
@morminator6575
@morminator6575 Жыл бұрын
Здравствуйте, столкнулся с такой проблемой, добавлял на свой сайт статью через файловый менеджер, внес изменения в файл, обновил страницу браузера, статья добавилась, а спустя несколько часов, статья просто пропала и файл который я редактировал, откатился до прошлой версии до моих изменений. Если редактировать файл по FTP то точно такая же проблема, через пару часов восстанавливается старая версия файла. Я уже весь интернет обшарил, но ничего не нашел по этой проблеме, в тех. поддержке не могут понять чего я от них хочу и как мне помочь. Так что вся надежда на вас, заранее спасибо
@СергейКофанов-л8у
@СергейКофанов-л8у Жыл бұрын
Добрый день, Вадим! Готовится ли курс по посадке вёрстки на WP?
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
неа, лежит в долгом ящике, а был готов на 25%
@AlexsandrPierierodov
@AlexsandrPierierodov Жыл бұрын
Вы с Харькова?
@natalia_0729
@natalia_0729 Жыл бұрын
Как отключить :hover на планшетах и мобильных устройствах?
@onese7en141
@onese7en141 Жыл бұрын
Медиа запрос any-hover проигнорирует hover на моб.устройствах
@serdarhuseynov8901
@serdarhuseynov8901 Жыл бұрын
spasibo oqromnoe
@natalia_0729
@natalia_0729 Жыл бұрын
Непонятен момент "как защитить user content". Поясните кто-то.
@sergeytsapliy7071
@sergeytsapliy7071 Жыл бұрын
Доброго дня Вадим! Хотілося би дізнатися чи буде відео або парочку відео про веб-доступність і як її приміняти в проектах, так як дуже мало інформації про це і як її правильно приміняти, а також відео у вас або вашої дружини які розміри шрифтів використовувати на мобільних пристроях?
@romatokar3516
@romatokar3516 Жыл бұрын
Написал вам огромную простыню что делать, а ютуб походу посчитал за спам и удалил его( Так что теперь коротко. Используйте семантику, вам как минимум не придется проставлять атрибут role для нативных тегов, например для тега атрибут role="button" не нужен, работает и для остальных семантических тегов. Не выключайте глобально outline это уже 60% доступности. Заполняйте атрибут alt в картинках и не вставляйте картинки через background-image, его используйте только для фонов. А это еще и для сео плюсик) Почитайте про aria атрибуты, самые часто используемые это aria-hidden, aria-label, aria-labelledby, aria-describedby Почитайте про contrast ratio. Почитайте про tabindex, вкртаце применяйте его в исключительных случаях. Тестируйте всё сами. Пройдитесь табом по странице, все интерактивные елементы должны выделятся, вы должны иметь возможность открыть и закрыть дропдаун с клавиатуры, а также перемещаться по его елементам стрелками. Тестируйте скринридером это NVDA, JAWS для windows и дефолтний для mac-os. Всё должно озвучиваться, в том числе и описание картинок, и иконки в кнопках если в кнопке только иконка. Учтите что если вы табом попали на елемент и скрин ридер его озвучил то наведите на него еще курсором, тоже должно читаться, а это не всегда так к сожалению. Поставьте екстеншены для хрома WAVE Evaluation Tool и axe DevTools - Web Accessibility Testing и запускайте их для проверки страницы, они подскажут все грубые ошибки и некоторые мелкие, подскажут как исправить и дадут линку на спеку. В первом исправляйте преимущественно красные ошибки, всеостальные больше рекомендации. Все что больше это уже специфика она либо описана в таске либо ее выцепит тестировщик, а зная проблему решение нагуглиться. Если остались вопросы пишите, попробую ответить
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
гарна ідея, дякую, я дружині про коментар скажу=))
@Capo2965
@Capo2965 Жыл бұрын
Почему РФ И РБ не доступен курс ?
@Ch-ce7ym
@Ch-ce7ym Жыл бұрын
А как можно убрать hover на мобильных устройствах ?
@ThePython_IT
@ThePython_IT Жыл бұрын
Когда будешь адаптировать сайт тогда и уберёшь
@AntonioBenderas
@AntonioBenderas Жыл бұрын
я думал метод БДСМ - это когда заказчик просит сверстать под IE8
@user-natal04ka
@user-natal04ka Жыл бұрын
Вроде @media (any-hover hover)
@NursAcademy
@NursAcademy Жыл бұрын
Вадип ты просто хаха😅😅
@boombla_5234
@boombla_5234 Жыл бұрын
А это нормально что по програме вашего курса, вы на 3 уроке учите Flex?
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
а что вас смущает? =)
@boombla_5234
@boombla_5234 Жыл бұрын
@@vadymprokopchuk то что на этом этапе, не особо понимают где ставить margin а где padding, и почему свойство width и height не работает на тег span, а у вас сразу флекс и js на 3 уроке,мне кажется если бы я так учил вёрстку, то бросил бы это дело сразу после 2 урока)
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
@@boombla_5234 в одном уроке несколько видео, так что до момента изучения флексов уже есть ответы на вопросы которые вы писали выше
@ПетяБампер-ь8м
@ПетяБампер-ь8м 3 ай бұрын
Мене завжди цікавило. Люди які займаються курсами це ті хто так і не зміг знайти хорошу роботу (є час щоб записувати контент це не притензій за такий контент величезна дяка) чи це все іде за покликлм душі і вони просто встигаються поєднувати роботу з записом контент і ще й курсами?
@vadymprokopchuk
@vadymprokopchuk 3 ай бұрын
@@ПетяБампер-ь8м в мене це було так, мені запропонували як додаткову роботу після основної прочитати курс, я це почав робити, перші заняття було дуже важко, а потім я офігів наскільки це мені подобається, і почав розвиватися в цьому напрямку, відкрився цілий світ і було цікаво вивчати різні методики, і робити так, щоб людям було цікаво і зрозуміло. Були періоди коли я не викладав, і через деякий час починалася ломка і я повертався до цього заняття
@ПетяБампер-ь8м
@ПетяБампер-ь8м 3 ай бұрын
@@vadymprokopchuk крутяк це надихає і розвіює мої якісь сумніви. Дякую тобі за те що ти робиш
@vadymprokopchuk
@vadymprokopchuk 3 ай бұрын
@@ПетяБампер-ь8м дякую
@Exigoll92
@Exigoll92 Жыл бұрын
Смотрите Вадоса! Он дело говорит
@kiralatysheva6794
@kiralatysheva6794 Жыл бұрын
Без тайм-кодов миллениалы могут и побить =)
@vadymprokopchuk
@vadymprokopchuk Жыл бұрын
уже добрые люди написали, так что сейчас опубликую
@Nurlybekdauletbaev
@Nurlybekdauletbaev Жыл бұрын
БРИГАДА!!! Как найти и пользоваться флексбоксом
@vvks9901
@vvks9901 Жыл бұрын
Не пойму логику: курс не доступен резидентами РФ, но курс на русском языке. Т.е. он для русских, живущих за пределами РФ и для русскоговорящих украинцев? Из РФ можно оплачивать без проблем через Юмани. Спасибо за очередное видео!!!
@alinan674
@alinan674 Жыл бұрын
А чого б це з вами торгувати? Оце вигадали! І це не ваша справа, на якій він мові. Ми тут що хочемо, те й робимо.
@vvks9901
@vvks9901 Жыл бұрын
@@alinan674 да будет МИР!!!
@Himera1983
@Himera1983 Жыл бұрын
Бдсм? Ты серьезно 😅
@WERWOLION
@WERWOLION Жыл бұрын
По БЭМ классы задаются везде, если ты не задаешь классы то 100% сделаешь хуже. Бэкенд не может в классы?типо что? Типо воздать шаблон и переменную это что-то сложное? Текст--грин Грин это модификатор, он не может быть красным потому что есть БЭМ Картинкам 50 на 50нужно задавать высоту потому что юзер ставит потом чёрти что и если не задать высоту то будет трешь Если ты делаешь кнопку которую намудрил дизайнер то можно делать 5 влоденностей т.к если для всех спанов писать классы то получится ахинея. А по сути это полноценный блок который не будет менятся. Qjery в 2023 году, серьезно?
@romatokar3516
@romatokar3516 Жыл бұрын
В видео же четко сказано куда классы не задавать. Это всякие текстовые и пост редакторы, никто в своем уме не пилит их с нуля есть уже проверенные готовые, и текста так и генерятся только тегами и своими классами, соответственно и стилить придется в основном селектор тега, незнаю погугли Quill editor и посмотри как оно работает и поймешь что имеется ввиду. А еще открою секрет БЭМ не истина методологий куча, а с учетом модульных стилей и вовсе пофиг на именование классов. "Грин это модификатор, он не может быть красным потому что есть БЭМ" этим цветом выделили какуюто часть текста, тут надо смотреть от контекста использования, если это акцентный цвет то что помешает через год разработки ему изменится на сиреневый? Часто бывает так что за 2-4 года разработки продукта у заказчиков меняется виденье продукта и редизайн проекта может случится 1 а то и 2 раза. Про высоту там избыточно сказано когда так делать не надо, приводить все случаи когда надо нет смысла. С компонентами которые "не будут менятся" это утопия, да, в больинстве мест компонент готов и везде одинаков. Но вот конкретно в этом месте в дизайне этот же компонент но немного изменен и перебивать всю мишуру вложеностей уже не приятно. Если что-то намудрено дроби на мелкие части и от них строй логику, сам же про бэм упоминаешь
@МенторТатьяна
@МенторТатьяна Жыл бұрын
1. Верно, по БЭМ классы задаются всем элементам. В видео Вадим говорит именно о контенте, который будет меняться в админ-панели. Если вёрстка натягивается на CMS систему, то динамическому контенту, который будет меняться из админ-панели, классы не задают. Стили для такого контента записывают через вложенность от родителя. 2. Плохая практика называть классы или модификаторы судя из того как элемент выглядит. Сегодня он зеленый, завтра красный, после завтра синий. Поэтому лучше задавать классы или модификаторы исходя из того что это за элемент : brand-color, accent-color, inverse-color, second-color, primary-color. 3. Речь не шла о картинках, а скорее о блоках, секциях, контенте, который может добавиться в будущем на сайте. 4. Стилизация элементов через большую вложенность действительно плохое решение. Большая вложенность селекторов неизменно ведёт к большой связанности кода. Если вы захотите поменять какой-то один селектор, вам неизбежно придётся поменять его во всех каскадах. К тому же, переиспользование кода при таком подходе стремится к нулю. Итог: больший вес селекторов - больший бардак, больший вес файла - медленная загрузка. 5. Поддержка у браузеров формата AVIF - 83.16%, у WEBP - 96.76%.
@WERWOLION
@WERWOLION Жыл бұрын
@@МенторТатьяна 2 правило именования модификаторов по БЭМ написанное черным по белому если меняем цвет то пишем название цвета 5 какая поддержка AVIF в 2023 году? Вы про picture слышали что-то? 4 если у вас кнопка дизайнера то что вы собрались менять? Размер задаётся только элементу блока а не блоку. Если поменяется 2 цвета то что там мешает повесить модификатор на кнопку и дописать вложенность? 1 про админу вообще ничего не понятно. Что вы предлагаете делать если дизайнер намутил сложный дизайн и у вас p имеют разный отступ снизу? Т.е тут даётся совет новичкам они решат где-то не задавать стили и их вёрстка превращается в ужас. Если дают такие опасные советы то нужно развёрнуто пояснять что к чему и как определить где именно применять такой метод. Переписать стили с .блок__р на .блок р куда легче потом.
@WERWOLION
@WERWOLION Жыл бұрын
@@МенторТатьяна по второму пункту уточню Если у вас по модификатору цвет зеленый, а вы потом ставите красный то только когда вы ставите после зелёного красный вы переименовываете модификатор или пишете новый с названием праймери, не как иначе. Если это не предполагается изначально. А если кто-то решил поменять цвет то он должен или вешать новый модификатор или переименовывать старый. Т.е. это ни разу не ошибка называть модификатор названием цвета
@sartjhon3300
@sartjhon3300 Жыл бұрын
какое то неочевидное видео.... открываем любое твое видео и что мы видим?..... у каждого параграфа есть класс у каждой ссылки и картинки есть класс... что получается, ты учил все это нас неправильно? намеренно, или сам только недавно понял про именование user.generated?
@AntonioBenderas
@AntonioBenderas Жыл бұрын
На стримах Вадим верстал не user.generated лендосы
@AntonioBenderas
@AntonioBenderas Жыл бұрын
а вот по поводу вложенности селекторов вопрос. Как её избежать, если SCSS это очень удобная штука
@sartjhon3300
@sartjhon3300 Жыл бұрын
@@AntonioBenderas он говорит об избыточной вложенности. 2-3 уровня вложенности это нормально, как раз по БЭМ, блок, внутри элемент и иногда модификатор. Плохо, когда блок, внутри ещё блок, внутри элемент, внутри какой нибудь псевдоэлемент, а внутри псевдокласс, внутри модификатор... И так лалее
@sartjhon3300
@sartjhon3300 Жыл бұрын
@@AntonioBenderas у него не только лендосы на стримах. И как бы странно, столько лет делать такой учебный материал, чтобы потом вдруг в 12 минутном ролике сказать - хей, ребятки, вы делаете ошибку давая имена классам контент которых может быть сгенерирован. Я, например, впервые слышу про генерацию контента. Я думаю логично было либо расширить ролик, либо снять про это ролик отдельно, я имею ввиду про эту вечеринку. Потому как я, конечно, учусь не только по роликам Вадима, и ни у кого не встречал упоминание об этом. Да, многие советуют использовать конструкции типа p+p last - child и тд, вместо именования, но я не встречал этому иных объяснение, кроме как универсальность кода
@NIkFreedomForce
@NIkFreedomForce Жыл бұрын
спс, Валос. ти топ
6 css свойств которые от тебя скрывают
34:23
Верстка под cms
34:31
От 0 до 1
Рет қаралды 17 М.
ТЮРЕМЩИК В БОКСЕ! #shorts
00:58
HARD_MMA
Рет қаралды 2,5 МЛН
They Chose Kindness Over Abuse in Their Team #shorts
00:20
I migliori trucchetti di Fabiosa
Рет қаралды 12 МЛН
PixelPerfect все что нужно знать
37:58
От 0 до 1
Рет қаралды 18 М.