Попытаемся тут создать домашнюю страничку на github используя только технологии CSS и HTML
Первые и самые важные шаги на github были описаны ранее, там описана история создания простейшего сайта https://c649160.github.io/staticpage/ Тут же поговорим как сделать нечто более осмысленное, а главное полезное с точки зрения интернета в целом.
Самое важное тут сформулировать задачи, вопросы должна решать ваша домашняя страница? Что вы считаете важно рассказать или показать людям в интернете, которые будут заинтересованы вашей личностью, ведь это личная страничка.
Например если, вы наслаждаетесь путешествиями в дальние страны почему бы не выложить на эту страничку несколько фотографий с подписями. Или вы меломан, тогда соответственно можно выложить список музыки, которая вам очень нравится.
Самое главное для чего используются домашние странички в наше время, это указание контактов как с вами связаться. В этих статьях мы попробуем собрать сайт с фотографией именем и контактными данными.
Сделать это можно при помощи бесплатного хостинга статических ресурсов gitHub pages. Этот сервис бесплатно предоставляет домен 3 уровня вида:
erdmko.github.io
Где erdmko - любой набор букв не занятый другим именем пользователя сервиса. github - домен 2 уровня предоставляемый гитхабом. io домен 1 уровня tld, выделеный для британских территорий в индийском океане согласно википедии.
Что бы этот домен начал отдавать вашу страничку нужно создать новый репозиторий название которого соответствует доменному имени, которое вы хотите использовать.
В моем случае это было erdmko.github.io, но нужно понимать, что выбора тут особо нет, выше описано что все доменные уровни строго определены.
Добавим простой HTML файл что бы убедиться в работоспособности хостинга.
Содержимое самого HTML файла:
Важно, чтобы имя файла было именно index.html так как это имя используется для определения входной точки в проект.
Так же важно заметить, что теперь у нас в разметке есть ссылка на файл стилей, который тоже нужно добавить в репозиторий.
Нужно закоммитить файл index.html и добавить новый.
Добавим еще один файл с названием которое должно совпадать с тем что мы указали ранее в index.html style.css с простым селектором по цвету
После коммита нового файла, можно проверить доступность исходного сайта в сети. Сайт должен быть доступен по адресу https://<ваш логин на github>.github.io
Так же важно заметить, что сайт сразу из коробки работает по шифрованному протоколу https это значит, что сайт будет больше цениться поисковиками и пользователями, так как будет считаться более безопасным.
Тут мы поговорили о целях создания простого статического сайта, а так же создали основу на которой в дальнейшем я покажу как применять описанные ранее навыки верстки.
Если по ходу чтения у вас появились вопросы или вы столкнулись с трудностями, задавайте вопросы.
Далее обсудим заголовочные теги страницы.