Конспект первой недели курса ”Html, CSS для новичков”

Курс направлен на изучение основ Html и CSS для людей, которые совершенно не знакомы с программированием.
Курс очень короткий, но для понимания интересно ли тебе это направление пройти стоит. Все 6 видео уроков на первой неделе посвящены созданию своего сайта.

В водной части рассказывается, что для веб страницы не нужно таких физических ресурсов как бумага и краска, а происходит все путем программирования, чему нас и обещают научить.
Любой сайт - это огромный объем информации и для его рационального распределения используются гиперссылки, чтобы путешествовать по страницам этого сайта. Набор гиперссылок - это гипертекст.
Сайты могут состоять из одной или сотен web-страниц. Например "Википедия" или какая-нибудь простая рекламная страница.
HTML (hypertext markup language) - это язык гипертекстовой разметки. Придумал его физик Тим Бернес-ли в 1989г.
Для подробного знакомства с этим человеком представлен 2-х минутный ролик.
Для чтения гипертекста необходимы соответствующие программы, а это уже всем известные браузеры, такие как
Internet Explorer, Opera, Google Chrome и т.д.
Каждый элемент страницы (заголовок,текстовый блок, изображение и т.д.) - это теги и правильное их прописание создает страницу или сайт.
Далее немного подробнее рассказывается о базовых тегах и их назначении.
Самая простая интернет страница на языке Html будет выглядеть вот так:

Создание web-страниц в редакторе "Kompozer"

Для создания web-страниц необходимы сотни тегов. Оказывается существуют редакторы, в которых мы создаем web-странцу путем наглядного применения различных шрифтов, цветов, картинок, распределения их по областям, а он в автоматическом режиме переводит все содержимое в готовый Html-код.
Далее приводится небольшой урок создания страницы на примере работы с редактором "Kompozer"
Для оформления web-страницы (цвет, шрифт) используются стили, описываются они на языке CSS (Cascading Style Sheets - Каскадные таблицы стилей). Использовать его начале в 90-х годов, т.к. Html довольно скуден для оформления.
На примере изменения шрифта и цвета на созданной странице показано, как редактор меняет код с помощью атрибута "style".

Оформление web-страниц с помощью таблиц

Для более рационального расположения объектов на web-странице необходимо использовать таблицы.
Теги для таблицы:

В разделе разбирается принцип построения простейших таблиц.

Иллюстрирование web-страниц

Этот раздел посвящен объяснению работы с изображениями. На примере показывается как меняется внешний вид сайта, если добавить или убрать со страницы различные иллюстрации.

Существуют несколько рекомендаций к использованию изображения.

1. Размер. Не больше 1 Мб.
2. Ограничение по ширине, чтобы элементы умещались в окне браузера.
   Особое внимание уделили авторскому праву.

Создание навигации

Навигация от лат. navigo - плыву на судне.
Навигация - это удобная система ссылок, которая позволяет переходить с одной страницы сайта на другую, таким образом разрозненные страницы собираются в один целостный сайт.
К навигации еще относят создание продуманного меню, чтобы посетитель мог легко ориентироваться на сайте и получить всю нужную информацию.
Навигация должна быть удобной!

Структура CSS. Встроенные и внешние стили

В этом разделе объясняется принцип прописания атрибута style.
Внешние стили указываются в одном CSS - файле, когда необходимо прописать стиль для нескольких однотипных элементов или страниц сайта.
Встроенные стили используются для единичных элементов или страниц.

Основываясь на изученных материалах, какой самый полезный и выгодный совет ты можешь дать сообществу Голоса?

Этот курс для тех, кто хочет начать понимать самые базовые основы Html. Объяснение очень легкое, по крайней мере, я все поняла с первого раза, а я совершенно не разбираюсь в программировании.

Мои впечатления.

Почувствовала себя на уроке информатики в 7-ом классе. Очень все просто, да и курс очень короткий. На счет полезности ничего сказать не могу. Не уверенна, что буду применять полученные знания. Настоящим открытием было существование автоматических редакторов. Я правда думала, что все печатается в ручную. И теперь я поняла как создаются все эти кнопочки на Golos-е. Если мой конспект прочитает знающий человек, буду очень благодарна, если поправит меня в тех местах, где я что-то не так поняла.