Вопрос: Не могу освоить верстку

Автор Дмитрий А. задал интересный вопрос в категории It, Верстка, Программирование. Он спрашивает: Не могу освоить верстку. Среди полученных ответов он выбрал самый точный и полный ответ.

Самый полезный ответ для автора Дмитрий А.

То, что вы готовы лезть на стены ради освоения вёрстки, вызывает моё восхищение. Это говорит о высокой мотивации и любви к предмету. Чтобы освоить HTML и CSS, нужен такой план:Не изучать устаревшие материалы, забыть о существовании xHTML и ориентироваться только на современные стандарты HTML5 и CSS3. Понять, что в HTML5 теги бывают двух типов: парные и одиночные. Вёрстка состоит в основном из парных тегов и каждый тег имеет определённые доступные параметры и CSS-свойства по умолчанию. Бывают теги, которые отличаются только семантически: div очень похож на h1, у них просто разный набор свойств и нужно использовать их в разных ситуациях. Семантика — умение применять теги уместно. Хорошая очень компактная книжка, которую я когда-то читал — Джереми Кит — HTML5 для веб-дизайнеров.Важных тегов, которыми надо уметь пользоваться, не так много: script, link, section+header+footer, div, span, h1+h2+h3, ul+li, a, form, input, table+tr+td. Все остальные можно подсмотреть на htmlbook.ru/html когда будет время и желание.Понять, что CSS не надо писать руками. Научиться работать с CSS-препроцессорами. Это сэкономит тонну времени. Мне нравится LESS, в моде сейчас SASS.Узнать наиболее употребимые CSS-свойства: float, display, opacity, width+height, position, background, border, border-radius. Заодно узнать, как использовать псевдоклассы: :hover, :focus.Разобраться в теме Flexbox-вёрстки. Полезно и развязывает руки.Поставить нормальную среду разработки, например Visual Studio Code (прекрасен+бесплатный) или WebStorm (любят знакомые), настроить в нём красивую цветовую схему и моноширинный шрифт Menlo покрупнее. Поставить на него плагин Emmet, который позволит меньше печатать HTML-кода. Такой мощный тулбокс будет мотивировать больше практиковаться.Понять, как реализовать адаптивность: узнать, как работают медиа-запросы. Научиться пользоваться сеткой Бутстрапа или другого фреймворка по душе. Понять, как верстать адаптивный 12-колонник. Сэкономить на этом вторую тонну времени, потому что на одних только медиа-запросах адаптивность реализовать очень больно. Познать контроль версий: завести Гитхаб, научиться выполнять простые операции: git init, status, log, add, commit, remote, push, diff. Все они есть в курсе по гиту на Хекслете. Степик тоже заслуживает внимания.Сразу пытаться применять изученное и ставить себе задачи, которые заставят задавать новые вопросы. Не терять наработки и вести конспекты в Notion. Так вы никогда не растеряете то, чему научитесь.На этом уровне уже можно найти работу тысяч на 40. Идти сразу работать, а не тратить 5 лет на идиотский российский институт, как ваши одноклассники.Понять, что вёрстка — низшее звено веб-разработки и ваш путь только начался. Понять, что без знания JavaScript на вёрстке не заработать и пора учить его. Идти на сайт JavaScript.ru и становиться фронтенд-разработчиком.+83 комментарияОбновлено 3 месяца назадПожаловатьсяПоделитьсяЕщё 9 ответовМайя Э.Занимаюсь козами, люблю животных, книги, штангу, учу языки. Круг интересов практически безграничный.А интерактивные курсы (НЕ интенсивы) от htmlacademy не пробовали? Там много доступно бесплатно, а за относительно недорогую подписку можно получить доступ к более «продвинутым» материалам (сейчас чуть менее чем 400 рублей в месяц, я оплачивала за год — вышло меньше 3 000). Для того, чтобы именно начать — то, что надо. Очень хорошо то, что много практики.На русском есть еще cleverbear (бесплатно) и hexlet (начать можно бесплатно, дальше — доступ за подписку, подороже, чем в htmlacademy). Их я пока только поверхностно посмотрела, изложение материала там, на мой взгляд, хуже.Еще могу посоветовать установить программку brackets (есть и под винду, и под убунту) — очень удобная вещь в том плане, что можно не только создавать и редактировать html и css файлы, но и просматривать в, так сказать, живом режиме, как они будут работать, если вы загрузите их на сайт (кнопка в виде зигзага live preview — у меня в правой части окна программы). Для этого нужен установленный браузер chrome, т.к. созданная страница откроется именно в нем.Начните с создания простой странички, а потом пробуйте что-то менять и смотрите, что получится. Желаю удачи!

Кроме этого другие посетители написали Ещё 9 ответов

Здравствуйте. Очень давно пытаюсь освоить верстку, но никак не выходит. Много пересмотрел видео на ютубе, перечитал книг(понимаю, что впитывал воду). Не могу, не выходит ничего, аж руки опускаются. Курсы от htmlacademy купить не могу, средства не позволяют(школьник, не имею такую сумму, к сожалению). Уже нервы не к черту, на стены готов лезть. Что в таком случае делать? Не нужно советов типа «на ютубе очень много видео, учись!»(Просто не нужно таких советов, сам про него знаю).Что в таком случае делать?ItВерсткаПрограммирование+1ОтветитьПодписатьсяПожаловатьсяЛучший ответ/designerОбразовательный проект о дизайне интерфейсов. Старший дизайнер в Газпромбанке отвечает на вопросы об интерактивном дизайне и проектировании.slashdesigner.ruТо, что вы готовы лезть на стены ради освоения вёрстки, вызывает моё восхищение. Это говорит о высокой мотивации и любви к предмету. Чтобы освоить HTML и CSS, нужен такой план:Не изучать устаревшие материалы, забыть о существовании xHTML и ориентироваться только на современные стандарты HTML5 и CSS3. Понять, что в HTML5 теги бывают двух типов: парные и одиночные. Вёрстка состоит в основном из парных тегов и каждый тег имеет определённые доступные параметры и CSS-свойства по умолчанию. Бывают теги, которые отличаются только семантически: div очень похож на h1, у них просто разный набор свойств и нужно использовать их в разных ситуациях. Семантика — умение применять теги уместно. Хорошая очень компактная книжка, которую я когда-то читал — Джереми Кит — HTML5 для веб-дизайнеров.Важных тегов, которыми надо уметь пользоваться, не так много: script, link, section+header+footer, div, span, h1+h2+h3, ul+li, a, form, input, table+tr+td. Все остальные можно подсмотреть на htmlbook.ru/html когда будет время и желание.Понять, что CSS не надо писать руками. Научиться работать с CSS-препроцессорами. Это сэкономит тонну времени. Мне нравится LESS, в моде сейчас SASS.Узнать наиболее употребимые CSS-свойства: float, display, opacity, width+height, position, background, border, border-radius. Заодно узнать, как использовать псевдоклассы: :hover, :focus.Разобраться в теме Flexbox-вёрстки. Полезно и развязывает руки.Поставить нормальную среду разработки, например Visual Studio Code (прекрасен+бесплатный) или WebStorm (любят знакомые), настроить в нём красивую цветовую схему и моноширинный шрифт Menlo покрупнее. Поставить на него плагин Emmet, который позволит меньше печатать HTML-кода. Такой мощный тулбокс будет мотивировать больше практиковаться.Понять, как реализовать адаптивность: узнать, как работают медиа-запросы. Научиться пользоваться сеткой Бутстрапа или другого фреймворка по душе. Понять, как верстать адаптивный 12-колонник. Сэкономить на этом вторую тонну времени, потому что на одних только медиа-запросах адаптивность реализовать очень больно. Познать контроль версий: завести Гитхаб, научиться выполнять простые операции: git init, status, log, add, commit, remote, push, diff. Все они есть в курсе по гиту на Хекслете. Степик тоже заслуживает внимания.Сразу пытаться применять изученное и ставить себе задачи, которые заставят задавать новые вопросы. Не терять наработки и вести конспекты в Notion. Так вы никогда не растеряете то, чему научитесь.На этом уровне уже можно найти работу тысяч на 40. Идти сразу работать, а не тратить 5 лет на идиотский российский институт, как ваши одноклассники.Понять, что вёрстка — низшее звено веб-разработки и ваш путь только начался. Понять, что без знания JavaScript на вёрстке не заработать и пора учить его. Идти на сайт JavaScript.ru и становиться фронтенд-разработчиком.

А интерактивные курсы (НЕ интенсивы) от htmlacademy не пробовали? Там много доступно бесплатно, а за относительно недорогую подписку можно получить доступ к более «продвинутым» материалам (сейчас чуть менее чем 400 рублей в месяц, я оплачивала за год — вышло меньше 3 000). Для того, чтобы именно начать — то, что надо. Очень хорошо то, что много практики.На русском есть еще cleverbear (бесплатно) и hexlet (начать можно бесплатно, дальше — доступ за подписку, подороже, чем в htmlacademy). Их я пока только поверхностно посмотрела, изложение материала там, на мой взгляд, хуже.Еще могу посоветовать установить программку brackets (есть и под винду, и под убунту) — очень удобная вещь в том плане, что можно не только создавать и редактировать html и css файлы, но и просматривать в, так сказать, живом режиме, как они будут работать, если вы загрузите их на сайт (кнопка в виде зигзага live preview — у меня в правой части окна программы). Для этого нужен установленный браузер chrome, т.к. созданная страница откроется именно в нем.Начните с создания простой странички, а потом пробуйте что-то менять и смотрите, что получится. Желаю удачи!

Тут важно понимать, что вы делали и с чего начинали, что конкретно не получилось и не получается, что начали осваивать, знакомы с базой в виде HTML5&CSS3? Писали что-то сами? Что было не так там. Если интересно и хотите изучать, начните с HTML5&CSS3, попробуйте сверстать хотябы базовый макет. Что в таком случае делать? Работать и биться головой об стену, пока не начнете въезжать, сразу верстку освоить не выйдет как и что-либо другое, раз вы еще школьник, просто знакомьтесь с базой и потом поступайте в профильный ВУЗ, все и сразу, еще раз скажу, получить не получится, это кропотливая и долгая работа. Курсы так же результата гарантированного не дадут, нужно прилагать усилия, если видите, что не понимайте, что читайте, то вернитесь к началу и разбирайте все пункты построчно. Попробуйте познакомиться с «HTML и CSS» Джона Дакетта, базовый уровень по ней поднять можно.

Добрый день На самом деле всё это так можно это делать в ворде и в других программах освоить вёртску Естиь одно главное предварительный предварительный и ещё раз предварительный смортр того что вы сделали и именно предварительный сморт определяет что вы сделали и что пойдёт на принтер на печать

Просто смотри читай оно само придет, в одно утро проснешься и ты все поймешь!

Для вас на первом месте всегда должна стоять практика. Бесполезно читать книги про языки программирования или гипертекстовую разметку. Нужно открыть редактор кода и начинать потихоньку мастеристь свои собственные интернет-страницы. Только в процессе кодинга возникнут вопросы, ответы на которые расширят ваши познания и дадут нужный опыт. А вообще профессия программиста на 80% состоит из поиска ответа на задачу в Гугл или Яндекс.

Попробуй посмотреть курсы на https://stepik.org и платить пока ничего не нужно

Советую просто посмотреть и повторять действия в ютубе за тем, где в реальном времени верстают реальный сайт. Только желательно новый материал, а не старый способ на float’aхА потом попробовать сделать проект другу или для себя, просто одностраничник

В любой учебе хорошо усвоить материал помогает только практика, то есть нужно не просто выполнять те задачи, которые дают на учебе, а еще искать реальные проекты — тогда будет профит с обучения. Например начни познавать верстку и другие фишки с движка вордпресс — зачем спросишь ты? Например там полезут какие-то баги ты сразу ищи причины их устранения — это очень важно знать, тем более почти половина сайтов в нете на вордпрессе стоят и знать как исправлять там код будет для тебя очень важно. ИМХО

Когда я учил html и css, мне помогла только работа над реальным проектом. Своим или для кого-то — это не важно. Главное понять, что вы хотите, спланировать будущий проект и дальше идти по этому плану решая конкретные задачи. И вот тут вам как раз помогут видео с YouTube, куча готовых сниппетов и приёмов. Появилась задача, пишете запрос в поисковике и ищете кто как её решает.Параллельно рекомендую налегать на английский. Тогда для вас откроются руководства англоязычной сети.Если коротко, то так.