Верстка сайта основные ошибки начинающих

В этом видео мы поговорим про верстку сайта. Сегодня я расскажу основные ошибки начинающих при верстке сайта. Верстка сайта html css дело не сложное, все когда-то начинали, а начало в веб разработки как раз и происходит с верстки сайтов. Вы изучаете основные теги html, далее стилизацию css, пытаетесь это объединить и начинаете верстать сайты. Для кого-то этот этап проходит очень быстро, кому-то приходится по мучатся с версткой пока не придет полное понимание происходящего. Когда верстаешь свои первые сайты, то не обращаешь внимание на некоторые ошибки и недочеты в своей работе. Так вот я покажу типичные ошибки верстки, старайтесь больше не допускать данных ошибок.

[artyshock]

Много негативных коментов, и многие из них вполне резонны. Но, не знаю, заметили ли вы, автор говорит с новичками на языке новичков? Да, Sorax разложил бы круче и терминология добавила б экшна, но новичок его поймет не сразу, если вообще поймет. Данный видос точно нельзя назвать бесполезным, автор хорошо изъясняется, на доступном уровне под начинающих. А отцов верстки попрошу выносить свой опыт и энергию в своих проекты, а не в обгаживание видео-уроков. Ездили 10 лет на ланосе, второй месяц как пересели на кэмри и запели песню "ланосы для лахов!! ведра гаечные! ". Спасибо, лайк.

[zhygknl]

Не нашёл подобного коммента, поэтому пишу сам.
Собственно, о чём в ролике идёт речь:
1) стоит использовать современные текстовые редакторы с плагинами или полноценные IDE;
2) следует называть классы по-английски без сокращений и так, чтобы название отражало суть объекта;
3) не нужно создавать классы для блоков, теги которых уже имеются в html (header, footer, nav, main и т.д.);
4) выносите стили в css, а не прописывайте их в атрибуте "style" для тегов;
5) тег <h1> на странице должен быть только один;
6) используйте строчные элементы внутри блочных, а не наоборот (подробнее на 5:22);
7) используйте атрибут "alt" для изображений, описывая в нём контекст;
8) проверяйте страницы валидатором.

[MsMatamune]

Я как интересуешься личность новичок очень понравился. Не мямлил, не бросался слишком много умных слов которых не поймешь, коротко и ясно, все самое нужное объяснил для начинающих. чтобы не наступали на эти грабли. Даже появился желания учится под его уроки. Большой лайк. пусть старается в том же духе и больших успехов в этом.

[DV_rus]

Еще совет. В больших проектах под цаета и шрифты используйте разные классы, например class="my-block my-block-color my-block-font"
Заказчик может попросить поиграться со шрифтами и цветами, а когда один цвет и шрифт присущ нескольким элементам, менять их стили можно довольно быстро

[igorlebich]

Вообще красава, всё чётко и по сути. Допольнительный плюс за то, что упомянул сео оптимизацию). Работаю сео оптимизатором, исправляю on-page после недоумковатых разработчиков которые пользуются H-тегами для визуального украшения текста

[lcfyyzf]

Спасибо огромное тебе за твои труды!!!
Крепкого здоровья!
Все очень приятно и информативно!)

[yuriypavlenko]

если картинка используется в качестве элемента дизайна, то семантически это должен быть не тег img с пустым alt, а div со стилем background-image

[Anshegar]

Думал бесполезный видос окажется но последняя инфа стала приятной неожиданостью, неезнал про этот сервис, спасибо.

[dmitryfilin]

Если не нравится sublime и у вас винда, то попробуйте Visual Code, он более приближен к ide типа idea или eclipse. Мне, как программисту java c# он понравился больше.

[andrey_maksimov]

Век живи, век учись. Спасибо за подсказку про редактор.

[NatashaPechenka]

Если у картинки нет alt и она несет декоративный характер, то задают её через css.

[evgeniyperekhod]

Кратко и по делу, спасибо) Особенно полезно была таблица сравнения html4 и html5
Респект автору)👍

[wxshsyg]

Классный канал, молодец парень, доходчиво все и быстро объясняет. Плюсую

[MxMayers]

Все, на что НЕ ругается валидатор W3, является правильной разметкой в том числе и строчный <a> в котором лежит куча <div>

[selindra]

Отличное видео! Познавательно, доступно. И вдохновляет на продолжение обучения)

[itbeard]

Три. Три типа элементов :) Строчные, блочные и элементы с медиа-содержанием ;)

[onebytesiteit-]

Охх. Да ошибки надо изучать сначала пути. Я вообще 2 месяца ерундой занимался. Прикольной но ерундой))) даже видео на канале записал тоже можете глянуть. Всем рад. Спасибо много информации. Я выучил сам html css. Bootstrap и все с нуля. И теперь сайты делаю. Делюсь на своем канале ссылками и уроками. Думаю любой пройдя этот путь сможет.
Автор красава. Лайк и подписка.

[lxvwweq]

Я из тех людей которые пользуются переводчиком чтобы назвать класс)

[zojdizi]

Я бы еще добавил, что начинающие не пользуются инструментами разработчика в браузерах. например не смотрят разметку элементов. Делают разметку "на глаз" и не понимают какие отступы и поля получаются, какие атрибуты вообще не используются и их можно банально удалить, как мобильных устройствах выглядит страница.

[almostwhole]

Блин чувак !!! Все граммотно по делу, без воды.