Ошибки начинающих при верстке сайтов на HTML и CSS
Рет қаралды 201,528
Күн бұрынВ этом видео разберем частые ошибки, которые делают начинающие верстальщики при верстке сайта на HTML и CSS. Разберем ошибки на практике и поделюсь своими советами.
Главы видео:
00:00 - 00:00:19 - Введение
00:00:19 - Семантика
00:01:23 - margin/padding
00:04:55 - Фиксированная высота
00:06:49 - Межстрочный отступ
00:08:15 - Адаптивные изображения
00:09:53 - Логика блоков и элементов
00:12:28 - Работа с элементами форм
00:13:59 - Верстка textarea
00:15:45 - Стилизация :focus
00:17:33 - Оптимизация селекторов
00:19:25 - Стили на разных тегах
00:20:59 - Элементов может быть больше
00:22:29 - Декоративные элементы
// О проекте =================
Меня зовут Дмитрий Валак. Я занимаюсь разработкой сайтов уже много лет, специализируюсь больше на front-end разработке и верстке сайтов, но и программирование тоже изучаю. Здесь буду делиться с вами информацией на разные темы по веб-разработке - HTML, CSS, Javascript, JQuery, Vue, PHP, MySQL, React, Gulp и тд.
На сайте проекта brainscloud.ru вы найдете много полезных закрытых материалов, а так же сможете поработать со мной лично, при наличии такого желания.
// Соц. сети =================
Мой ВК - odimaz
Группа BC - brainscloud
Мой Instagram: / dmitryvalak
#верстка #версткасайта #html #css
@SeoquickUa 3 жыл бұрын
Когда пытаешься сверстать первый сайт, то не обращаешь внимание на какие-то мелкие ошибки и недочеты. К сожалению, если их вовремя не заметить и не убрать, то они перейдут от одного сверстанного сайта к другому. )) Спасибо, было полезно!
@BrainsCloud 3 жыл бұрын
именно так )
@igr3943 3 жыл бұрын
Ребята знают, о чём говорят))) небось частенько поправляют труды новичков и не только!
@MrIncredible-mu5ec Жыл бұрын
я как-то видел вёрстку, где внутри тега был тег . И это делал человек с неплохими отзывами на фрилансе. Что обидно, ведь есть начинающие фрилансеры, которые делают в разы лучше, и при этом на них мало обращают внимания.
@klirmio21 Жыл бұрын
1) 0:20 - Семантика 2) 1:23 - margin/padding 3) 4:55 - Фиксированная высота 4) 6:49 - Межстрочный отступ 5) 8:15 - Адаптация изображений 6) 9:53 - Логика блоков 7) 12:26 - Шрифты элементов форм 8) 13:59 - Ресайз текстового поля 9) 15:45 - Стилизация состояния фокуса 10) 17:33 - Оптимизация селекторов 11) 19:25 - Кнопки 12) 20:59 - Элементов может быть больше 13) 22:28 - Декоративные элементы
@maximvoloshin7602 3 жыл бұрын
Много полезных мыслей, особенно про динамику контента. Одно печалит - слово «правильно». Ведь нет никакого «правильно» ни в вёрстке, ни в жизни. Есть «выгодно, потому что...». Семантика выгодна для людей с ограниченными возможностями и для роботов. Обёрточные блоки выгодны, когда есть возможность уменьшить объём кода. И padding можно применить к абзацу, если это выгодно по какой-либо причине. Думаю, стоит учить новое поколение разработчиков слову «баланс», а «правильно» не применять вовсе.
@bestlife9681 3 жыл бұрын
Спасибо ! Хотелось бы чтобы это была рубрика и чаще выходила в люди . Этот формат полезный.
@PavelM01 3 жыл бұрын
Не ошибки, а прям урок! )) Спасибо, много полезного )
@user-uk7vq2ou9g Жыл бұрын
отличная скорость подачи материала и даёт четкое понятие, что ожидает тебя по ту сторону учёбы) спасибо, подписка с первого видео, ну и лайк конечно же
@guska8710 3 жыл бұрын
Спасибо, что делаешь полезный контент для нас!
@sergeikeller1861 3 жыл бұрын
Просто супер! Спасибо за труды💪🏼
@danil_litvinov 3 жыл бұрын
Спасибо огромное! Отличная манера подачи материала, посмотрел пока всего три твоих видео, но многие вещи которые не до конца понимал прояснились! Творческих успехов тебе! Буду дальше смотреть, подписался! Ещё раз спасибо!
@chejkokqwerty7994 3 жыл бұрын
Доходчивый и познавательный контет вот, что мне нравится во всех ваших уроках, спасибо Дмитрий!
@progerlife6690 3 жыл бұрын
Кросс) Посмотрел ради удовольствия)Так как с версткой знаком)Спасибо и лайк))
@eheheyeah 3 жыл бұрын
Некоторое и не осознаешь по неопытности как ошибки, большое спасибо!
@kharkiv_inres5127 3 жыл бұрын
Реально годний контент. Більше таких відео! Підбірка супер
@stammeqt Жыл бұрын
Спасибо Дмитрий за такие нюансы. Ты избавил меня от лишних подзатыльников 😂
@SIPIKEXE 10 ай бұрын
Очень зачетное видео, приятно смотреть и слушать, отличная подача, затронуты реально самые распространенные ошибки(недочеты)... 👍
@danil_zavyalov 3 жыл бұрын
Очень круто! Ждём продолжения!!
@arthurosipov8283 3 жыл бұрын
Спасибо большое за качественную подачу материала. Подчерпнул для себя интересные приемы)
@01pigoso Жыл бұрын
Самый классный канал для начинающих.Столько полезной информации,такая ясная и четкая подача,приятный спокойный голос,именно спокойный,а не скучно-монотонный.👍🔥🤩🌟
@meshikime6469 3 жыл бұрын
Отличный контент, отдельное спасибо за "верстку сайта с нуля". Намного интереснее учить делая что-то, а что не понял шарить на мдн. Респект автору.
@yurakhomitskyi8762 3 жыл бұрын
Спасибо за видео, все четко без воды
@n1azar 3 жыл бұрын
Спасибо. Все четко и по делу.
@user-gr9ge3ek2y 2 жыл бұрын
Отличный контент. Крайне полезная информация от профессионала. Спасибо!
@user-jn8wj8ck4n 3 жыл бұрын
Все пригодилось, часто допускаю такие ошибки.
@alexr4795 5 ай бұрын
Одно из самых полезных видео по вертске! Опыт, о котором не всегда прочтешь в статьях
@electronik9708 3 жыл бұрын
Спасибо за видос! Информативно и полезно, особенно новичкам подойдёт
@sevakvart1111 3 жыл бұрын
Дмитрий, очень профессионально, 5+
@volodymyrsolianin2860 2 жыл бұрын
Спасибо за видео. Очень структурно и наглядно
@igorkulibaba7287 3 жыл бұрын
Зачётный контент!!! Спасибо.
@user-eb3yr9wc4k 3 жыл бұрын
Очень полезно!Спасибо Дмитрий!!!
@MaximVernigorov 3 жыл бұрын
Благодарю Вас !!! Очень полезное видео, много у себя ошибок обнаружил и исправился после ваших подсказок!
@yuriyzadorozhnyi3849 Жыл бұрын
Щиро дякую за контент , для початківця , яким я являюсь , це крутий канал .
@user-jb3cd5uk2j 3 жыл бұрын
Очень полезно!! Огромное спасибо автору
@missisipi9992 Жыл бұрын
Отличный материал, спасибо)
@donvanetti4270 3 жыл бұрын
Спасибо за труд!
@overlord9659 3 жыл бұрын
Огромное спасибо вам за ваш труд. И то что делитесь практическими знаниями.Все очень понятно и доступно. ))
@FelixX138 Жыл бұрын
да , это очень полезно
@tau3732 Жыл бұрын
Спасибо большое за видео! Всё очень наглядно, и для меня было полезно)👍
@user-bl1hg3it5v 3 жыл бұрын
Узнал себя в 90% ошибок... По неопытности не осознаешь это, как ошибки. Спасибо за видео, крайне полезный контент, побольше бы таких!
@Aviritius 2 жыл бұрын
Доступная подача. Благодарю
@ZHenyuli4ka 3 жыл бұрын
Ай всё. Подписался, видио сохранил для себя. Очень приятный голос, полезный контент.Все круто!И спасибо!
@bigthinks2290 3 жыл бұрын
Классно-понятно! Больше таких видео!
@superzrus4607 3 жыл бұрын
*Ого, буквально 2 недели назад начал учиться верстке, и по вашему ролику понял что ошибок очень много допускаю, спасибо!*
@tommyangello3582 3 жыл бұрын
классный разбор! нужно ещё! :)
@grindco732 Жыл бұрын
это вот прям супер видео, спасибо! такое ощущение как-будто ты за спиной у меня постоял 25 минут и тыкнул меня носом во все мои ошибки!) сохранил даже в закладки... все почему-то дают информацию о том как и что делать, но мало кто говорит как делать качественно, анализировать свою собственную работу, какие нюансы стоит учесть! спасибо, надеюсь еще будут подобные разборы ошибок или даже не ошибок, а просто подборка оптимальных решений для разных ситуаций
@user-kp6en8gi9t 3 жыл бұрын
Супер! Спасибо за полезную информацию.
@gratecray5455 3 жыл бұрын
Спасибо! Ты отлично объясняешь!
@user-nm7yi4ol6z 2 жыл бұрын
спасибо за информацию!!! лайк зачетный!
@lazylemur7761 3 жыл бұрын
Крутой канал, даже для меня как опытного нашел не мало фишек на разных уроках твоего канала которые вообще не использовал, спасибо! С меня подписка и лайки под видосами
@paid_actor__ 3 жыл бұрын
где ты раньше был боже, какой же балдежный контент
@artema9267 3 жыл бұрын
Спасибо за топ контент🙏
@Lok1goD 2 жыл бұрын
Круто! После видосика пошел переделывать свою страничку)) из 11 ошибок представленных в видео, у себя нашел 5 )) Спасибо, полезное видео!
@rtnjo6936 3 жыл бұрын
Фуф, рад что прошел курсы по scss в начале) Шикарный голос и очень полезные замечания, думаю теперь что курсы с преподавателем были бы намного полезнее самостоятельного изучения)
@vitalhit 3 жыл бұрын
Очень крутое видео!!! Много полезного узнал об верстки, чего не знал.
@alexf1515 Жыл бұрын
Верстаю уже лет 30 и ничего из этого не знал, даже не думал, что так можно было, спасибо, полезно🤓
@allabott8128 3 жыл бұрын
Спасибо большое за видео, полезно!
@user-vr4xb9zk1i 2 жыл бұрын
Большое вам спасибо Дмитрий
@user-ej4fm1ng6y 3 жыл бұрын
Отличный материал, отличная подача. Не 80/20 где 80-сопли в отличие от большинства. Спасибо большое!
@BrainsCloud 3 жыл бұрын
Лови новый видос! Как твое лето? Загорел?
@evgeniiryshkov7745 3 жыл бұрын
Дима, исправь пожалуйста ошибку в названии видоса. Сейчас: "Ошибки начинающих при верстк[и]". А нужно сделать: "Ошибки начинающих при верстк[е]"
@webit9026 3 жыл бұрын
к сожалению загорела, а вот на море накупаться... хотя -все- _пол_ лета впереди
@talapius 3 жыл бұрын
Чувак, спасибо тебе большое за видосы. Очень помогает в обучении.
@user-dr5xc9vu1h 3 жыл бұрын
Учитель! Как вы научились такому мастерству вёрстки?)
@user-mf4hx3tc4u 3 жыл бұрын
Спасибо большое))) Все просто и понятно!!!!
@user-qp6pf7jh9x 3 жыл бұрын
Отличное и познавательное видео!
@Legat74 3 жыл бұрын
Спасибо Дмитрий! В хорошем дизайне видно какие элементы активны и как это выглядит)).
@BrainsCloud 3 жыл бұрын
согласен, но это такая редкость )
@aleksandrtarnopolskyi3646 3 жыл бұрын
Спасибо за контент !
@olegbilko3683 3 жыл бұрын
Спасио за видео! Полезно и доходчиво. Лучше сразу это предусмотреть, чем потом править сайтмного раз.
@vinetempl7879 3 жыл бұрын
Благодарю! Много полезного почерпнул из этого видео (:
@bunnybugs6623 3 жыл бұрын
Спасибо! Быстро интерестно доступно
@dosodsin3624 3 жыл бұрын
Очень годный ролик. Многое для себя подчеркнул
@user-to9vh6ng2k 2 жыл бұрын
Ну хватит уже "подчеркивать", ребзя. "Почерпнул"
@TheMatros063 3 жыл бұрын
Спасибо друг! Хорошая шпаргалка для начинающих.
@user-xt6lx6lo2c 2 жыл бұрын
Супер! Все очень познавательно!
@sdfzzy 3 жыл бұрын
спасибо, очень правильный подход к вёрстке. как заказчик говорю
@user-rr7jh7qk5m 2 жыл бұрын
Спасибо, познавательно!
@glock-18 Жыл бұрын
Отличные советы, обязательно пересмотрю завтра, чтобы закрепить. Поставленная речь и приятная музыка порадовали, однако я бы поработал над произношением английского. Спасибо за контент 🙏💕
@kristinaalex8025 3 жыл бұрын
Клас! Спасибо большое! Полезные замечания!!
@dj6man784 2 жыл бұрын
Ох как мне повезло найти это видео до верстки))
@user-xy1fp7sy8m 3 жыл бұрын
Спасибо, хорошие замечания)))
@fluffyraccoon5648 3 жыл бұрын
на счет адаптив картинки хорошая тема была, лайк за это
@tanya8111 2 жыл бұрын
Очень полезное видео! Спасибо
@Frontend-Developer-UA 2 жыл бұрын
Очень круто и полезно, спасибо
@uk-lych_sveta 3 жыл бұрын
Спасибо, действительно полезное видео.
@slava_po 3 жыл бұрын
Дмитрий спасибо!)
@alexg0490 3 жыл бұрын
Спасибо большое автору!
@Noteeeeeee 2 жыл бұрын
Спасибо, очень полезно!!
@user-rt4pn7xt4e 3 жыл бұрын
как всегда отличный контент
@reflexop1074 2 жыл бұрын
вы очень меня нравились я тоже учусь без вашего видео я ничего не с мог слелать вы очень хороший и професионал программист😘
@jahongirmusayev658 3 жыл бұрын
Очень полезно, спасибо!
@victorirzunov3108 3 жыл бұрын
Очень полезно. Спасибо
@victors9585 3 жыл бұрын
Видос - шикардос!!!1!!!!!!1!!
@BulatKarasaev 3 жыл бұрын
Прекрасный голос и подача материала
@AironMS2 3 жыл бұрын
Очень полезно и круто!
@user-fd5le5bx9j 3 жыл бұрын
Круто! Спасибо!)
@sergoilo1105 2 жыл бұрын
спасибо! полезно, познавательно!
@user-oj8oc8ur4v 2 жыл бұрын
Спасибо, полезное видео
@smuzi_flow 3 жыл бұрын
Очень полезно! Спасибо
@user-kx9dd1sh9k 11 ай бұрын
Спасибо большое 💓
@dmitrypashula5489 3 жыл бұрын
Димочка, очень полезное видео!!
@joker6745 Жыл бұрын
Thank you for information !!!
@user-ql4xu5qu2u 3 жыл бұрын
Про различия маржинов и паддингов интересно было
@alex.v145 2 жыл бұрын
Очень полезный материал
@elnurbda 3 жыл бұрын
спасибо за видео ролик. узнал нового.
@zafe0904 2 жыл бұрын
очень хорошее виде! однозначно подписка и лайк
@ismadev9155 3 жыл бұрын
Можно побольше таких видео
@user-td6zx2sm5y 3 жыл бұрын
Супер! Спасибо!
Фрілансер по життю
Рет қаралды 366 М.
Андрій Кльон
Рет қаралды 155
BrainsCloud
Рет қаралды 934 М.