Что такое html и css?
Продолжим говорить про вёрстку 😏 Начало в предыдущих постах по ссылке. Сегодня буду говорить «что-нибудь на HTMLьском» 😆 Самые базовые понятия, простыми словами.
Когда дизайнер отдает на вёрстку макет, я беру текстовый файлик и начинаю писать какие-то странные скобочки и слова на английском.
Это и есть HTML – язык, который браузер сможет понять и визуально отобразить на страничке. Я смотрю на макет (фактически на картинку) и прямо словами описываю, что вижу. Если вверху сайта должна быть навигация, плашка со ссылками, то я буквально так и пишу: браузер, нарисуй прямоугольник, а в нем вот такие три ссылки с таким-то текстом, ведущие на такие-то страницы. Это – самая большая магия вёрстки: по сути ты пишешь текст, который в браузере становится красивым сайтом.
HTML – это язык разметки, это не язык программирования. Но сейчас реалии таковы, что на чистом HTML сложные сайты не делаются и там вполне может оказаться немного программирования: условия, обращения к каким-то другим частям проекта, переменные. Если вдруг вы раздумываете, а не поучиться ли вёрстке, и вас напугало последнее предложение – не бойтесь. Вот правда, это вообще не является сложностью, просто это может немного пугающе звучать, если вы совсем далеки от этой сферы. Возможно, это просто непривычные для вас слова, не более.
Итак, мы написали HTML, и браузер нарисовал на странице нашу навигацию со ссылками. Но они откровенно страшные: подчеркнутые, синие и вообще склеились.
Дизайнер от нас не этого требовал)) И тут я открываю другой текстовый файлик, в котором описываю то, как должны выглядеть эти ссылки. Это – CSS, стили. В стилях я могу описать, чтобы у ссылок подчеркивания не было, чтобы они были другого цвета и вообще каким-то красивым модным шрифтом написаны. Цвет фона (того самом прямоугольника-шапки) я тоже могу поменять с помощью CSS.
Таким образом, в базовом виде, вёрстка – это HTML+CSS. С их помощью уже можно сделать симпатичную страничку. Описания выше – очень обобщенные, я надеюсь, что смогла понятно описать суть вёрстки для людей, которые вообще не знакомы с этим. В следующей серии изучим новое слово, оставайтесь на связи