Когда пытаешься сверстать первый сайт, то не обращаешь внимание на какие-то мелкие ошибки и недочеты. К сожалению, если их вовремя не заметить и не убрать, то они перейдут от одного сверстанного сайта к другому. )) Спасибо, было полезно!
я как-то видел вёрстку, где внутри тега был тег . И это делал человек с неплохими отзывами на фрилансе. Что обидно, ведь есть начинающие фрилансеры, которые делают в разы лучше, и при этом на них мало обращают внимания.
Много полезных мыслей, особенно про динамику контента. Одно печалит - слово «правильно». Ведь нет никакого «правильно» ни в вёрстке, ни в жизни. Есть «выгодно, потому что...». Семантика выгодна для людей с ограниченными возможностями и для роботов. Обёрточные блоки выгодны, когда есть возможность уменьшить объём кода. И padding можно применить к абзацу, если это выгодно по какой-либо причине. Думаю, стоит учить новое поколение разработчиков слову «баланс», а «правильно» не применять вовсе.
Самый классный канал для начинающих.Столько полезной информации,такая ясная и четкая подача,приятный спокойный голос,именно спокойный,а не скучно-монотонный.👍🔥🤩🌟
отличная скорость подачи материала и даёт четкое понятие, что ожидает тебя по ту сторону учёбы) спасибо, подписка с первого видео, ну и лайк конечно же
это вот прям супер видео, спасибо! такое ощущение как-будто ты за спиной у меня постоял 25 минут и тыкнул меня носом во все мои ошибки!) сохранил даже в закладки... все почему-то дают информацию о том как и что делать, но мало кто говорит как делать качественно, анализировать свою собственную работу, какие нюансы стоит учесть! спасибо, надеюсь еще будут подобные разборы ошибок или даже не ошибок, а просто подборка оптимальных решений для разных ситуаций
Сайты я редко верстаю, чаще верстаю WPF-приложения. Но пару трюков для себя отметил, которые я ранее не использовал. Оказывается можно проще делать. Спасибо, буду применять.
Отличные советы, обязательно пересмотрю завтра, чтобы закрепить. Поставленная речь и приятная музыка порадовали, однако я бы поработал над произношением английского. Спасибо за контент 🙏💕
Штошь, неплохо. Вёрстка для самых маленьких. Приятно было посмотреть. Когда я начинал кроме уроков Попова не было ничего толкового ещё. Про схлопывание margin'ов не упоминули, что очень важно при таком подходе. При работе с псевдоселекторами состояний ссылок лучше сразу запоминать порядок ‘LOVE’ (1. L - link 2. V - visited) and ‘HATE’ (3. H - hover 4. A - active). Я уже думал больше нигде не увижу Brackets, странный выбор редактора в сегодняшних реалиях. Best regards
Большое спасибо за видео. Помню пол года назад, я смотрел видос по верстке Mogo и думал, что делает этот дядька. Не понимал ни свойств ничего просто тупа повторял, ну а сейчас все предельно понятно и знаю что делаю. Начал сейчас читать большую книгу css и также много таких мелких моментов оттуда подчеркиваю. Так что тем кто давно верстает, также советую ее прочитать лишним не будет. Так сказать залезете под капот. Еще раз благодарю за предоставленную информацию.
Крутой канал, даже для меня как опытного нашел не мало фишек на разных уроках твоего канала которые вообще не использовал, спасибо! С меня подписка и лайки под видосами
Спасибо за урок. Одно хочу подметить: лучше тексты делать не в пикселях а например в "em". Если завтра клиент захочет поменять размер шрифта, запарится везде пиксели менять а с "em" поменял в body размер и все.
Довольно полезное видео для начинающих, однако последний пункт - Декоративные элементы, довольно спорный. Согласен, что делать пустые элементы в html это bad practice и стоит избегать их, но и ставить вместо них псевдоэлементы, я считаю, не правильно, т.к. псевдоэлементы относятся к заголовку, а логически эта черта никак к заголовку не относится, т.е. получается некая логическая ошибка. Я обычно в таких случаях использую тег , ибо он логически подходит. Да, конечно придётся его копировать, но хороший код не значит маленький код. Хочу так же отметить, что в некоторых случаях у заголовка используются псевдоэлементы для различных целей, в таком случае тем более не стоит жертвовать псевдоэлементом. За видео - лайк)
Я только начинаю делать сайты на Photoshop и уже перешла к изучению по верстке сайта. Мне предлогали переходить на конструктор Тильда или Wordpres. Я сказала, что все это хорошо, но мне нужно покавыряться внутри сайта, на каких языках он пишется и как верстается. Пока работаю над сайтом, пишу на HTML5 и CSS3. Видео полезное. Благодарю🙏
Ну да прям все верстальщики там любят многие Я помню ну там и я тоже я к ним отношусь люблю также верстать на девахи а вот я спасибо за такой видос я же просто не мог только что не мог верстать какой-то там по тебе Когда придумали решил там побаловаться слышишь ты молился и случилось ошибка вот ты буду такие только теперь использовать
Фуф, рад что прошел курсы по scss в начале) Шикарный голос и очень полезные замечания, думаю теперь что курсы с преподавателем были бы намного полезнее самостоятельного изучения)
А вот это по делу! СПАСИБО! 👍 P.S. но кто учится верстке по твоим урокам, то меньше ошибок допускает. Это факт! Очень нравится твой стиль верстки и подача уроков.
Про margin и padding это кончено спорно и я бы не сказал, что это ошибка. Каждый ... как он хочет, но надо было сказать в таком случае про схлопывание полей и свойство box-sizing. Чтобы новички понимали почему надо именно padding, а не margin и почему размеры в результате получились не те, которые ожидали. Да и новичкам показывать пример на flex-box верстке не самый удачный пример. Это выглядит, как куча свойств и что за wrap. Я бы новичкам посоветовал не плодить кучу классов, а взять хорошую книгу. Автор которой варится в этой кухне уже годов с цать и заучить селекторы. Хорошее замечание было по поводу тегов, полностью поддерживаю автора. Размер шрифтов лучше не указывать в пикселях, если нацелены на широкую аудиторию и многообразие устройств с различным разрешением экрана. Хотелось бы конечно увидеть в видео не только базовые упражнения, но и какие-нибудь "фичи " или интересные эффекты. Автору спасибо за видео.
@@JuggernautWare Зачем это спрашивать? Ты думаешь, что никто до тебя не задавался этим вопросом? Лучше забей в гугле "Какие книги хороши для изучения html?". По любому найдется Html senior developer который тебе ответит) qna.habr.com/q/25989 - только что погуглил, вот обсуждение про изучение html, css. Посмотри займет 2 минуты, а сэкономит много время на изучении.
Дмитрий, изумительная подача материала / качество контента :) * Просто потому, что все остальное так круто: по-английски (1) 'margin' читается больше как 'мАрджин' (2) 'line height' = 'лайн хАйт' ('хэйт' = 'ненависть') (может быть важным, ежели продавать свой опыт на Западе :) ) А так: смотрю канал глубоко за полночь, и только вот сейчас подумалось, что мне по работе это, в общем-то, и не нужно :D Подписалась, поскольку - красота!
Спасибо огромное! Отличная манера подачи материала, посмотрел пока всего три твоих видео, но многие вещи которые не до конца понимал прояснились! Творческих успехов тебе! Буду дальше смотреть, подписался! Ещё раз спасибо!
Одно из самых полезных видео по вертске! Опыт, о котором не всегда прочтешь в статьях
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 - Декоративные элементы
Когда пытаешься сверстать первый сайт, то не обращаешь внимание на какие-то мелкие ошибки и недочеты. К сожалению, если их вовремя не заметить и не убрать, то они перейдут от одного сверстанного сайта к другому. )) Спасибо, было полезно!
именно так )
Ребята знают, о чём говорят))) небось частенько поправляют труды новичков и не только!
я как-то видел вёрстку, где внутри тега был тег . И это делал человек с неплохими отзывами на фрилансе. Что обидно, ведь есть начинающие фрилансеры, которые делают в разы лучше, и при этом на них мало обращают внимания.
Много полезных мыслей, особенно про динамику контента. Одно печалит - слово «правильно». Ведь нет никакого «правильно» ни в вёрстке, ни в жизни. Есть «выгодно, потому что...». Семантика выгодна для людей с ограниченными возможностями и для роботов. Обёрточные блоки выгодны, когда есть возможность уменьшить объём кода. И padding можно применить к абзацу, если это выгодно по какой-либо причине. Думаю, стоит учить новое поколение разработчиков слову «баланс», а «правильно» не применять вовсе.
Самый классный канал для начинающих.Столько полезной информации,такая ясная и четкая подача,приятный спокойный голос,именно спокойный,а не скучно-монотонный.👍🔥🤩🌟
Доходчивый и познавательный контет вот, что мне нравится во всех ваших уроках, спасибо Дмитрий!
Спасибо Дмитрий за такие нюансы. Ты избавил меня от лишних подзатыльников 😂
Узнал себя в 90% ошибок... По неопытности не осознаешь это, как ошибки. Спасибо за видео, крайне полезный контент, побольше бы таких!
Некоторое и не осознаешь по неопытности как ошибки, большое спасибо!
Щиро дякую за контент , для початківця , яким я являюсь , це крутий канал .
отличная скорость подачи материала и даёт четкое понятие, что ожидает тебя по ту сторону учёбы) спасибо, подписка с первого видео, ну и лайк конечно же
Отличный контент, отдельное спасибо за "верстку сайта с нуля". Намного интереснее учить делая что-то, а что не понял шарить на мдн. Респект автору.
Спасибо Дмитрий! В хорошем дизайне видно какие элементы активны и как это выглядит)).
согласен, но это такая редкость )
спасибо! полезно, познавательно!
Ох как мне повезло найти это видео до верстки))
Про различия маржинов и паддингов интересно было
Верстаю уже лет 30 и ничего из этого не знал, даже не думал, что так можно было, спасибо, полезно🤓
Лови новый видос! Как твое лето? Загорел?
Дима, исправь пожалуйста ошибку в названии видоса. Сейчас: "Ошибки начинающих при верстк[и]". А нужно сделать: "Ошибки начинающих при верстк[е]"
к сожалению загорела, а вот на море накупаться... хотя -все- _пол_ лета впереди
Чувак, спасибо тебе большое за видосы. Очень помогает в обучении.
Учитель! Как вы научились такому мастерству вёрстки?)
это вот прям супер видео, спасибо! такое ощущение как-будто ты за спиной у меня постоял 25 минут и тыкнул меня носом во все мои ошибки!) сохранил даже в закладки... все почему-то дают информацию о том как и что делать, но мало кто говорит как делать качественно, анализировать свою собственную работу, какие нюансы стоит учесть! спасибо, надеюсь еще будут подобные разборы ошибок или даже не ошибок, а просто подборка оптимальных решений для разных ситуаций
вы очень меня нравились я тоже учусь без вашего видео я ничего не с мог слелать вы очень хороший и професионал программист😘
Не ошибки, а прям урок! )) Спасибо, много полезного )
11:44 Ты открыл мне Америку, я про это никогда не задумывался, спасибо)
За адаптацию картинок, спасибо, а остальное я считаю совершенно очевидным. Большинство "ошибок" - это банальное не знание основ современной вёрстки.
object-fit лучше использовать для адаптации изображения. Способ из видео не всегда работает.
Сайты я редко верстаю, чаще верстаю WPF-приложения. Но пару трюков для себя отметил, которые я ранее не использовал. Оказывается можно проще делать. Спасибо, буду применять.
Очень зачетное видео, приятно смотреть и слушать, отличная подача, затронуты реально самые распространенные ошибки(недочеты)... 👍
Отличный материал, отличная подача. Не 80/20 где 80-сопли в отличие от большинства. Спасибо большое!
Отличные советы, обязательно пересмотрю завтра, чтобы закрепить. Поставленная речь и приятная музыка порадовали, однако я бы поработал над произношением английского. Спасибо за контент 🙏💕
Штошь, неплохо. Вёрстка для самых маленьких. Приятно было посмотреть. Когда я начинал кроме уроков Попова не было ничего толкового ещё. Про схлопывание margin'ов не упоминули, что очень важно при таком подходе. При работе с псевдоселекторами состояний ссылок лучше сразу запоминать порядок ‘LOVE’ (1. L - link 2. V - visited) and ‘HATE’ (3. H - hover 4. A - active). Я уже думал больше нигде не увижу Brackets, странный выбор редактора в сегодняшних реалиях. Best regards
Спасио за видео! Полезно и доходчиво. Лучше сразу это предусмотреть, чем потом править сайтмного раз.
Отличный автор, спасибо за Вашу работу, единственное, свойство высота height произносится 'хайт', а не 'хейт'
Все пригодилось, часто допускаю такие ошибки.
Вы мой первый Учитель! 😁 Спасибо вам! С вами я иду на правильный путь!
Желаю успехов на вашем пути!
*Ого, буквально 2 недели назад начал учиться верстке, и по вашему ролику понял что ошибок очень много допускаю, спасибо!*
Большое спасибо за видео. Помню пол года назад, я смотрел видос по верстке Mogo и думал, что делает этот дядька. Не понимал ни свойств ничего просто тупа повторял, ну а сейчас все предельно понятно и знаю что делаю. Начал сейчас читать большую книгу css и также много таких мелких моментов оттуда подчеркиваю. Так что тем кто давно верстает, также советую ее прочитать лишним не будет. Так сказать залезете под капот. Еще раз благодарю за предоставленную информацию.
где ты раньше был боже, какой же балдежный контент
Крутой канал, даже для меня как опытного нашел не мало фишек на разных уроках твоего канала которые вообще не использовал, спасибо! С меня подписка и лайки под видосами
Спасибо за урок. Одно хочу подметить: лучше тексты делать не в пикселях а например в "em". Если завтра клиент захочет поменять размер шрифта, запарится везде пиксели менять а с "em" поменял в body размер и все.
Реально годний контент. Більше таких відео! Підбірка супер
Круто! После видосика пошел переделывать свою страничку)) из 11 ошибок представленных в видео, у себя нашел 5 )) Спасибо, полезное видео!
Супер! Спасибо за полезную информацию.
Спасибо ! Хотелось бы чтобы это была рубрика и чаще выходила в люди . Этот формат полезный.
спасибо, очень правильный подход к вёрстке. как заказчик говорю
Довольно полезное видео для начинающих, однако последний пункт - Декоративные элементы, довольно спорный. Согласен, что делать пустые элементы в html это bad practice и стоит избегать их, но и ставить вместо них псевдоэлементы, я считаю, не правильно, т.к. псевдоэлементы относятся к заголовку, а логически эта черта никак к заголовку не относится, т.е. получается некая логическая ошибка. Я обычно в таких случаях использую тег , ибо он логически подходит. Да, конечно придётся его копировать, но хороший код не значит маленький код.
Хочу так же отметить, что в некоторых случаях у заголовка используются псевдоэлементы для различных целей, в таком случае тем более не стоит жертвовать псевдоэлементом.
За видео - лайк)
Кросс) Посмотрел ради удовольствия)Так как с версткой знаком)Спасибо и лайк))
Класс, видео выпущено в моё 18-тилетие
Отличный контент. Крайне полезная информация от профессионала. Спасибо!
Я только начинаю делать сайты на Photoshop и уже перешла к изучению по верстке сайта. Мне предлогали переходить на конструктор Тильда или Wordpres. Я сказала, что все это хорошо, но мне нужно покавыряться внутри сайта, на каких языках он пишется и как верстается. Пока работаю над сайтом, пишу на HTML5 и CSS3. Видео полезное. Благодарю🙏
вордпресс и тильда написаны на php
Ну да прям все верстальщики там любят многие Я помню ну там и я тоже я к ним отношусь люблю также верстать на девахи а вот я спасибо за такой видос я же просто не мог только что не мог верстать какой-то там по тебе Когда придумали решил там побаловаться слышишь ты молился и случилось ошибка вот ты буду такие только теперь использовать
Благодарю Вас !!! Очень полезное видео, много у себя ошибок обнаружил и исправился после ваших подсказок!
Очень годный ролик. Многое для себя подчеркнул
Ну хватит уже "подчеркивать", ребзя. "Почерпнул"
Фуф, рад что прошел курсы по scss в начале) Шикарный голос и очень полезные замечания, думаю теперь что курсы с преподавателем были бы намного полезнее самостоятельного изучения)
Спасибо за видео. Очень структурно и наглядно
А вот это по делу! СПАСИБО! 👍
P.S. но кто учится верстке по твоим урокам, то меньше ошибок допускает. Это факт! Очень нравится твой стиль верстки и подача уроков.
Хжжжжж
Жхх
на счет адаптив картинки хорошая тема была, лайк за это
тема про адаптив картинки выручала. если можно было поставить повторный лайк то я бы поставил, палец вверх 👍❤️🤘🏿
Очень полезно!Спасибо Дмитрий!!!
Ай всё. Подписался, видио сохранил для себя. Очень приятный голос, полезный контент.Все круто!И спасибо!
Очень круто! Ждём продолжения!!
Спасибо. Все четко и по делу.
Большое вам спасибо Дмитрий
Супер! Все очень познавательно!
Про margin и padding это кончено спорно и я бы не сказал, что это ошибка. Каждый ... как он хочет, но надо было сказать в таком случае про схлопывание полей и свойство box-sizing. Чтобы новички понимали почему надо именно padding, а не margin и почему размеры в результате получились не те, которые ожидали. Да и новичкам показывать пример на flex-box верстке не самый удачный пример. Это выглядит, как куча свойств и что за wrap. Я бы новичкам посоветовал не плодить кучу классов, а взять хорошую книгу. Автор которой варится в этой кухне уже годов с цать и заучить селекторы. Хорошее замечание было по поводу тегов, полностью поддерживаю автора. Размер шрифтов лучше не указывать в пикселях, если нацелены на широкую аудиторию и многообразие устройств с различным разрешением экрана. Хотелось бы конечно увидеть в видео не только базовые упражнения, но и какие-нибудь "фичи " или интересные эффекты. Автору спасибо за видео.
Какие книги посоветуешь?
@@JuggernautWare Зачем это спрашивать? Ты думаешь, что никто до тебя не задавался этим вопросом? Лучше забей в гугле "Какие книги хороши для изучения html?". По любому найдется Html senior developer который тебе ответит) qna.habr.com/q/25989 - только что погуглил, вот обсуждение про изучение html, css. Посмотри займет 2 минуты, а сэкономит много время на изучении.
@@gleb_bro8710 спрашиваю, потому что полагал, что автор в теме и имеет что посоветовать.
Спасибо друг! Хорошая шпаргалка для начинающих.
Полезно, спс. Хотя "хейт" и "текстар'ея" - это конечно сильно :D
Полезное видео, такое не прочтешь в документации!
спасибо за информацию!!! лайк зачетный!
Спасибо большое за качественную подачу материала. Подчерпнул для себя интересные приемы)
Видео класс, музыка тоже огонь но она видимо на столько хороша что отвлекает😂
Спасибо за видос! Информативно и полезно, особенно новичкам подойдёт
Спасибо за труд!
классный разбор! нужно ещё! :)
Дмитрий, очень профессионально, 5+
Хорошее видео, но хотелось бы ещё знать почему это должно быть так а не иначе.
Дмитрий, изумительная подача материала / качество контента :)
* Просто потому, что все остальное так круто: по-английски
(1) 'margin' читается больше как 'мАрджин'
(2) 'line height' = 'лайн хАйт' ('хэйт' = 'ненависть')
(может быть важным, ежели продавать свой опыт на Западе :) )
А так: смотрю канал глубоко за полночь, и только вот сейчас подумалось, что мне по работе это, в общем-то, и не нужно :D
Подписалась, поскольку - красота!
Огромное спасибо вам за ваш труд. И то что делитесь практическими знаниями.Все очень понятно и доступно. ))
да , это очень полезно
Спасибо за видео, все четко без воды
Отличный материал, спасибо)
"Их нужно испльзовать потому что они есть". Авторитетно
хороший видос) только стоило бы показать какой у формы html, потому что сверстать форму семантически правильно могут далеко не все
Доступная подача.
Благодарю
Клас! Спасибо большое! Полезные замечания!!
Спасибо большое за видео! Всё очень наглядно, и для меня было полезно)👍
Просто супер!
Спасибо за труды💪🏼
Классно-понятно! Больше таких видео!
Когда будут ещё верстки сайтов?
Очень полезный контент, спасибо за это💪
когда-нибудь будут
Прекрасный голос и подача материала
Можно побольше таких видео
Мне как начинающему очень полезно. Подписка конечно)
Спасибо! Ты отлично объясняешь!
Очень полезно!! Огромное спасибо автору
Спасибо огромное! Отличная манера подачи материала, посмотрел пока всего три твоих видео, но многие вещи которые не до конца понимал прояснились! Творческих успехов тебе! Буду дальше смотреть, подписался! Ещё раз спасибо!
Отличное и познавательное видео!
Можно использовать свойство gap 21:40
В случае, если элементов ниже не будет, отступа лишнего не будет.
00:00 то самое чувство когда у тебя такая же мышь как на картинке)) (балдежное). Ну а видос Бомба!!!
Спасибо, что делаешь полезный контент для нас!
Спасибо большое за видео, полезно!
Можно больше видео про адаптивность блоков пожалуйста ?
Спасибо за видео! Как теперь это всё запомнить😅
Что это за кайфовый редактор?
brackets
Очень полезный материал