Практическое занятие 15 Тема: Сервисы интернета
Задание 1.
Структура сборки web-сервера XAMPP. Запишите кратко в отчете следующую информацию:
Для чего предназначено ПО XAMPP?
Какие аналоги XAMPP существуют?
Запишите перечень программ-компонентов, из которых состоит XAMPP.
Для чего предназначен каждый компонент XAMPP?
Локальный Web-узел в сборке web-сервера XAMPP. Создайте папку с названием вашего сайта, на английском языке, без пробелов на диске C: в папке:
D:\xampp\htdocs\
Например, для сайта test1 должна быть создана папка
D:\xampp\htdocs\test1\
Проверьте доступ к Вашему локальному сайту, набрав в адресной строке браузера, вместо test1 - название Вашего сайта:
http://localhost/test1
Снимок экрана с браузером поместите в презентацию. На снимках с окном браузера должен быть адрес сайта в адресной строке браузера.
Главная страница локального Web-узла. Создайте в папке сайта главную страницу
index.htm
Проверьте доступ к Вашему локальному сайту. Снимок экрана поместите в презентацию. На снимках с окном браузера должен быть адрес сайта в адресной строке браузера.
Второй домен локального Web-узла. Создайте второй локальный сайт в XAMPP. Например, для сайта test2 должна быть создана папка
D:\xampp\htdocs\test2\
Создайте в этой папке главную страницу
index.php
по примеру:
Проверьте доступ к Вашему локальному сайту.
Исходный код главной страницы в форматах php и htm, загруженной в браузер, разместите в отчете. Сравните эти коды и выводы запишите в отчет.
Для вывода в браузере исходного кода Web-страницы нажмите сочетание клавиш Ctrl+U.
На снимках с окном браузера должен быть адрес сайта в адресной строке браузера.
На втором локальном сайте опубликуйте выполненные на предыдущих занятиях упражнения по Web-дизайну.
Для каждого упражнения отведите отдельную страницу. На главной странице сайта создайте оглавление сайта с гиперссылками. Исходный код главной страницы в формате php и htm, загруженной в браузер, разместите в отчете. Сравните эти коды и выводы запишите в отчет.
На снимках с окном браузера должен быть адрес сайта в адресной строке браузера.
Пример оглавления сайта:
01 dogs 02 lists 03 anchors 04 text 05 text css 06 cats 07 music 08 html5 audio video 09 tables 10 blocks 11 javascript
Задание 2.
План занятий 16 - 19 1. Эффект параллакса 2. Интеллект-карта 3. codepen.io 4. Canvas: http://ifizmat.000webhostapp.com/canvas/lab-01.htm 5. FlexBox 6. CSS: template
Источники
Основные
sourceforge.net: XAMPP - Browse /XAMPP Windows at SourceForge.net
apachefriends.org: Download XAMPP
ipipe.ru: Установка XAMPP. Пошагово: скачивание, установка, запуск.
artlebedev.ru: .ру/Ководство студия дизайна Артемия Лебедева
html5book.ru: HTML, CSS, JavaScript и jQuery
htmlbook.ru: Для тех, кто делает сайты
Роботландский университет: Дуванов А.А.
robotlandia.ru: Роботландский университет Дуванов А.А.
ucoz.ru: Роботландский университет Дуванов А.А.
css.manual.ru: HTML, CSS
codepen.io: Онлайн-редактор кода HTML, CSS, JavaScript
jsfiddle.net: Онлайн-редактор кода HTML, CSS, JavaScript
nic.ru: Whois сервис
reg.ru: Регистрация доменов
Дополнительные
w3schools.com: W3.CSS Template. Примеры дизайна сайтов.
ruseller.com: Топ 10 бесплатных хостингов
ruseller.com: 20 ресурсов для прототипирования
ruseller.com: Простая техника эффекта параллакса
ruseller.com: 28 сайтов с эффектом параллакса
thisstartupdoesnotexist.com: Neural network web designer
thiscatdoesnotexist.com: Neural network cats photo-artist
thispersondoesnotexist.com: Neural network people photo-artist
hi-tech.mail.ru: Нейросеть начала создавать «фейковые» сайты
hi-tech.mail.ru: Нейросеть научилась создавать фотографии фейковых котов
hi-tech.mail.ru: Нейросеть научилась создавать фотографии несуществующих людей
emosurf.com: Мы готовим детей к позавчерашнему миру
pravmir.ru: Людмила Петрановская: Мы готовим детей к позавчерашнему миру