2024
2023
2021
2020
2019
2018
2017
2016
Практикум 1. Задания
Не копируйте бездумно код из презентации, в нем неправильные кавычки! В HTML и СSS допустимо использовать только символы " (то, что легко ввести с клавиатуры), все остальные виды двойных кавычек не являются специальными символами.
— ИР
В рамках этого практикума Вам надо будет создать заготовки страниц вашего будущего персонального учебного сайта, а именно Главную страницу, "О себе", "Семестры", "Первый семестр", "Второй семестр" (внутри "Семестров"). На странице первого семестра разместить ссылки на отчеты первого семестра. Перед выполнением заданий рекомендуется ознакомиться с подсказками.
Расположение персональных страниц
Создайте папку public_html внутри вашей домашней папки на kodomo. Все материалы вашего сайта (странички, картинки, дополнительные файлы, и т.д.) должны будут располагаться внутри public_html.
Сделайте папку public_html и все подпапки в ней доступными для чтения и исполнения для всех пользователей. Для этого выполните команду chmod a+rx <папка>, chmod a+r <file>. Все файлы в public_html и её подпапках также должны быть доступны для чтения всем пользователям.
Ваша домашняя папка (директория) на kodomo имеет адрес /home/students/y19/YOUR_KODOMO_LOGIN.
Как правило, в этой папке Вы оказываетесь сразу после подключения к kodomo по ssh (через PuTTY, WinSCP, и т.д.).
Эта же папка доступна в компьютерном классе под Windows как диск H:\ .
Теперь можете переходить к созданию HTML страниц.
Формальные требования к страницам
Чтобы пройти проверку (в основном автоматическую), каждая из ваших страниц должна содержать:
Указание на тип файла (<!DOCTYPE html> в первой строке файла).
Указание на кодировку файла (тэг <meta> в нужном месте). Призываю Вас использовать кодировку utf-8. Использовать другую кодировку можно только в случае, если Вы можете обосновать, почему это лучше. Файл должен быть сохранен в указанной кодировке!
Страница должна удовлетворять всем требованиям к страницам HTML версии 5, т.е. быть "валидной". Проверить свою страницу на валидность можно с помощью автоматического валидатора здесь. Страница должна проходить проверку без ошибок (Error), предупреждения (Warning) можете игнорировать. Не стесняйтесь писать преподавателям, если валидатор выдает ошибку, а Вы не можете понять, почему.
Содержательное название страницы (в теле тэга <title>, что-то вроде "Ivanov, Main Page" или "Иванов, Главная страница")
Заголовок страницы (в теле тэга <h1>, что-то вроде "Учебный сайт Иванова Ивана").
На текущем этапе работы не стоит тратить много сил на форматирование и дизайн Вашего сайта. Сейчас Вы должны сделать заготовку для дальнейшей доработки. Форматировать HTML страницы рекомендуется с помощью CSS. На следующем занятии мы продолжим разговор о форматировании и использовании готовых CSS, поэтому пока рекомендуем не увлекаться. Однако Вам никто не запрещает продумать будущий дизайн Вашего сайта (можно, например, на бумажке нарисовать 
).
Названия файлов и содержание страниц
1. Главная страница.
Файл страницы должен называться index.html и располагаться непосредственно в папке public_html.
Страница должна содержать приветствие для посетителя и краткое описание (в свободном виде). Можете добавить другие элементы, которые, как Вы считаете, будут полезны впервые зашедшему на вашу страницу человеку.
Помимо этого, на странице должны находиться гиперссылки на:
- Страницу "Семестры" либо страницы первого и второго семестра (см. ниже).
- Страницу "О себе" (см. ниже об этой странице).
Официальный сайт ФББ МГУ: http://www.fbb.msu.ru/.
Рекоммендуется сформировать навигационную панель (меню), содержащую ссылки на страницы Вашего сайта (тег <nav>). Допустимо разместить эти ссылки в разных разделах страницы, например, ссылки на страницы семестров в меню, а ссылки "о себе" и на сайт ФББ на "чердаке" (<header>) или в "подвале" (<footer>) страницы.
2. Страница "О себе".
Файл страницы должен называться about_me.html и располагаться непосредственно в папке public_html.
Страница должна содержать ту информацию о Вас, которой Вы хотели бы поделиться с возможным читателем, в ближайшей перспективе – с преподавателями. Обязательно вставьте ссылку на вашу студенческую почту: <a href="mailto:YOUR_KODOMO_LOGIN@fbb.msu.ru">Текст ссылки</a> (если хотите, можете добавить ссылку на личную почту или какие-либо иные контакты). Разместите фотографию на этой странице. Если свою фотографию почему-либо размещать не хотите, вставьте на страницу любое другое изображение.
Страница должна содержать навигационную панель (меню), как на главной странице. Также поместите в меню ссылку на главную страницу для удобства навигации.
3. Страница первого (второго) семестра.
Файл страницы должен называться index.html, как и в случае главной страницы, но располагаться он должен в папке term1 (term2) внутри папки public_html. В этих папках будут располагаться все страницы и файлы, посвященные соответствующему семестру вашего обучения.
На странице первого (и любого другого) семестра главным образом будут располагаться ссылки на отчеты по практикумам, которые Вы будете оформлять в виде HTML страниц. На странице можно разместить краткое описание содержимого, например, можно вкратце описать то, с чем Вы уже познакомились в этом семестре.
Страница первого семестра должна содержать ссылки на выполненные Вами ранее отчёты первого семестра.
Страница должна содержать навигационную панель (меню), как на главной странице. Также поместите в меню ссылку на главную страницу для удобства навигации.
4. Страница "Семестры".
Данная страница должна содержать ссылки на страницы первого и второго (а затем и последующих) семестров.
После создания страницы
Страницы можно создавать и редактировать в любом удобном месте, например, на своем домашнем компьютере. В процессе создания их можно проверять, открывая с помощью браузера (Chrome, Firefox или другого). Убедившись, что страница отображается правильно, можно скопировать её на kodomo в нужную папку (public_html). После этого необходимо проверить, что страница стала доступной в сети интернет. Для этого введите в поисковую строку браузера адрес https://kodomo.fbb.msu.ru/~YOUR_KODOMO_LOGIN, где вместо YOUR_KODOMO_LOGIN напишите Ваш логин в системе kodomo.
Срок выполнения заданий – утро дня следующего занятия. Это означает, что к этому моменту ваша заглавная страница, страница первого семестра, страница второго семестра и «О себе» должны быть доступны через Интернет, при этом все гиперссылки должны правильно работать.