Думаю хоть раз в жизни у вас было желание сделать что-то поистине потрясающее, то что вы никогда не делали. Например написать с нуля хороший и удобный сайт про кулинарию, чтобы получать пассивный доход от рекламы, лежа на диване. Большинство людей считают программирование тёмными дебрями, непроглядной тьмой. А что, если я вам скажу, что создание сайта - это очень просто! Что вам ненужно знать программирование и учить непонятные слова!
Вы наверное скажете: Да брось, это ведь невозможно, такого не бывает, нужны годы, чтобы создать крутой сайт!
НО можете поверить, что после прочтения этого урока вы создадите простой сайт-одностраничник!
К тому же мы не будем использовать программирование вообще!
Думаете, как можно написать сайт без программирования? Прочтите статью и увидите)
Помните, лучше попробовать, чем боятся!
Кратко о том что сегодня будет
Сегодня мы с вами узнаем, что такое верстка и сверстаем ваш первый сайт. Он будет простым и маленьким, но вы будите гордится собой!
Начало пути
Если вкратце, то писать код сайта - это верстка, а не программирование. Верстка очень проста в освоении, я уверен, что за этот один день вы усвоите и научитесь применять азы верстки.
Я, к слову, научился этим азам за один вечер, так как это нетрудно!
Полагаю, вы хоть раз видели буквы: HTML. Это именно тот язык гипертекстовой разметки (зная это слово можно стать программистом в глазах мамы) на котором мы создадим сайт прямо сейчас!
Первые шаги и первые новые буквы
Повторяйте за тем, что делаю я, чтобы сделать сайт и найти то, что вам нравится!
Сейчас мы будем работать и созидать. Вы не поверите, но сайт можно написать на коленке, в блокноте. Открываем его...
Теперь эта ваша рабочая область! (в конце статьи я покажу вам отличный инструмент для замены блокнота)
Буквы и символы
Теперь мы рассмотрим основные знаки, которые помогут вам не запутаться в коде и начать писать текст в сайт.
Это основа вашего сайта, где <!DOCTYPE html> - это стандарт, согласно которому браузер будет понимать, что ему отображать.
<html></html> - это область (тег), где вы будете писать свой сайт. Самый большой тег, в котором вы будете делать другие теги.
Как вы заметили после <html> идёт </html> с знаком "/". Это единственное из главного, что вы должны знать. область всегда закрывается с "/". А еще он читается как "голова", чем собственно и является
<title> имя сайта </title> - это то как будет называться ваша страница, эта область (тег) расположена в <head>. Больше здесь мы ничего не будем писать, так как это нам пока не нужно.
Не используйте пробел, используйте tab для отступов, это важно!
Думаю, здесь нет ничего сложного, если вы дошли до сюда, то вы справились с большей частью работы.
Теперь под тегом <head></head> добавьте тег <body></body>.
Это тег, содержимое которого мы сможем читать в браузере
Читается как "тело", так как в этом теле и содержится все буквы и слова.
<p></p> - это параграф, место внутри которого вы можете написать всё что угодно и далее это увидеть на сайте!
Напишите в нем "Привет мир!" или " Я люблю котиков!"
Посмотрим, что получилось!
Если вы выполнили все предыдущие шаги и дошли до сюда, то вы поистине сильный человек, который верен своим целям и желаниям.
Поэтому сейчас мы посмотрим, что у вас получилось;)
- Нажмём "файл > сохранить как"
- Выберем тип файла: "Все файлы"
- введите имя файла и в конце поставьте ".html"
- нажмите "сохранить"
У вас должна появится иконка вашего основного браузера, нажимаем на неё...
И... О, да вы создали свой первый сайт, можете считать себя создателем😊
В следующих выпусках я буду рассказывать о новых приёмах и тегах, поэтому подпишитесь на канал, чтобы всегда видеть мои статьи и обучаться созданию сайтов.
если статья вам понравилась, не забудьте поставить лайк, мне будет приятно!