Введение
Всем привет! Раз вам попалась моя статья, я думаю, вы хотите создать свой сайт. Делается это очень легко, и не долго, справится любой. Не будем делать долгих вступлений, поехали!
Подготовка
Итак, для начала нам надо подготовить себя и свой пк. Вот все, что нам пригодится:
- Среда разработки, в его роли может выступать даже онлайн компилятор, так что написать свой сайт можно хоть на планшете, я же буду использовать Visual Studio Code, для чего она нужна, я думаю, и так понятно;
- Хостинг, для первого сайта может подойти и старый компьютер, но для крупных сайтов понадобится мощный сервер, нужен для того, чтобы "выложить" ваш сайт в сеть, а как их настроить, расскажу в следующих постах;
- 10 минут, создать свой первый сайт можно всего за 10 минут!
- И, хорошее настроение)
Основная часть
Наконец, мы готовы писать свой сайт!
Первым делом, создаем папку, в которой создаем файл с названием main.html, вместо main можно написать любое другое название, но я рекомендую всегда называть файлы кода main.
Открываем этот файл, и перед нами - наш сайт, точнее, его код. Пока что, он пустой, но совсем скоро мы это исправим.
Перед работой, настоятельно рекомендую скачать расширение для HTML.
Сделать это можно нажав на кнопку с четырьмя квадратами, а затем, в поиске вбив HTML и скачав первое в списке расширение.
Запомните, в начале кода всегда пишем:
<!DOCTYPE html>
<html>
*код сайта*
</html>
Тело сайта
Приступим к "голове" сайта, которая так и называется, <head>.
Она должна идти самой первой, сразу после вышеупомянутой строки
В ней мы указываем различную информацию о сайте - название, css файл( о котором мы, кстати, поговорим в следующей статье) и так далее. Для первого сайта хватит только <title> - название сайта, которое будет отображаться сверху.
Теперь наш код выглядит примерно так:
<!DOCTYPE html>
<html>
<head>
<title>Hello world!</title>
</head>
</html>
Приступим к основной части сайта, к его телу - <body>
В ней содержится сам сайт - текст, картинки, видео и так далее.
Самое простое - это добавить текст, сделать это можно написав в теле сайта:
<p>Hello world!</p>
Вместо Hello world! можно написать что угодно.
Добавить картинку будет сложнее, чтобы это сделать надо сохранить ее в ту же папку, что и HTML-файл и дать название, какое хотите. Далее нужно в теле сайта прописать:
<img src = "название картинки"></img>
Вот мы и добавили картинку на сайт!
Вот, как выглядит код сайта сейчас, но открыв его, мы видим примерно это
Все есть, но картинка слишком большая и не помещается в экран. Чтобы это исправить, надо добавить атрибуты height и width - ширина и высота.
И, настроив их по своему вкусу мы наконец можем увидеть наш сайт!
Вот вы и создали свой сайт!
Совсем скоро я расскажу про оформление сайта и другие функции, всем спасибо за просмотр, пока!
