====== Основы интернет-технологий (ИНБ21, 2012) ======

На данной странице представлены задания лабораторных работ для студентов 2 курса специальности «Информатика» (бакалавриат).

====== Лабораторная работа №1: Создание простейшего HTML-документа ======

**Задания:**

**1.**	Создайте в программе Блокнот XHTML-документ минимальной структуры: [[http://mif.vspu.ru/books/html123/|задания 1-9]].

**2.** Сохраните созданный файл с расширением xhtml и откройте сначала в IE, а затем в каком-либо браузере, поддерживающем XHTML как тип документа. Сравните результаты.

**3.**	Внесите в созданный документ ошибку, нарушающую правила XHTML (например, добавьте атрибут со значением без кавычек). Откройте документ в поддерживающем стандарты браузере - вместо документа там должно отобразиться сообщение об ошибке разбора.

**4.**	Измените расширение файла на htm (оставив ошибку в документе). Откройте документ в разных браузерах.


----

====== Лабораторная работа №2: Создание сайта на основе табличной версткии веб-страниц  ======
**Табличная верстка** — условное название метода верстки HTML-документов, при котором в качестве структурной основы для расположения текстовых и графических элементов документа используются таблицы.

**Цель лабораторной работы** - создать сайт из трех страниц на основе табличной верстки по заданной теме.

**[[http://www.buckses.info/lessonshtml/lesson1tables.html | Рекомендации по созданию табличной верстки веб-страниц]]**

**ПЛАН ВЫПОЛНЕНИЯ ЛАБОРАТОРНОЙ РАБОТЫ:**

  - Выбрать тему для сайта.
  - Создать в программе Блокнот документ "index.html" - главную страницу сайта.
  - Оформить созданную страницу: логотип, заголовок, меню (пока без гиперссылок), содержание.
  - Создать документы "page1.html" и "page2.html".
  - Оформить созданные страницы: логотип, заголовок, меню - такие же как на главной странице; содержание для каждой страницы свое.
  - Настроить гиперссылки на всех страницах.
  - Выложить созданный сайт для проверки: X:\homes\kat\public\ОИТ ИНБ21.
 ** - До следующего занятия оставить свои отзывы на созданные сайты в [[https://docs.google.com/spreadsheet/ccc?key=0Ahiag7Tc8N5fdHY0N2o2N2haVkJBd2hTMlZBTTRhX1E|коллективном документе]]** 


----


====== Лабораторная работа №3: Знакомство с CSS. Атрибуты стиля CSS  ======
**CSS** (Cascading Style Sheets, Каскадные таблицы стилей) — технология, позволяющая описывать внешний вид элементов, создаваемых языком разметки.

**Цель лабораторной работы** - создать html-документ с использованием таблицы стилей CSS.

**Задания лабораторной работы** находятся здесь (начиная с 3-ей страницы): X:\homes\kat\shared\ИНБ21 Основы интрент-технологий\ЛР3.pdf

**Программа для создания html-документов:** X:\homes\kat\shared\ИНБ21 Основы интрент-технологий\PSPad.exe

**[[http://css.manual.ru/|Справочник по CSS]]
**


----

====== Индивидуальный проект "Создание тематического сайта" ======


<note>ТЕМЫ ДЛЯ ИНДИВИДУАЛЬНЫХ ПРОЕКТОВ:
  - Сайт-площадка для печати научных статей.
  - Сайт для школьников по ТРИЗ.
  - Сайт зоомагазина //(Радостев Д.)//
  - Сайт-клуб рыболовов //(Соломатин А.)//
  - Сайт фирмы, занимающейся разработкой макетов зданий.
  - Сайт-альманах для любителей путешествий.
  - Сайт-магазин компьютерных новинок //(Харланов И.)//
  - Сайт магазина велосипедов //(Мащенко И.)//
  - Сайт-клуб садоводов //(Водолазов Е.)//
  - Сайт-сообщество кулинаров //(Майкош А.)//
  - Сайт студенческого клуба //(Масликов А.)//
  - Сайт-клуб любителей оригами //(Демидок С.)//
  - Сайт-сообщество коллекционеров авиомоделей //(Олейников Н.)//

</note>
====== 1 ЭТАП: Начало проекта ======
  -   Выбрать тему проекта.
  -   Изучение роли дизайна при разработки Web-сайта. Работа с книгой О.Яцюк "Основы графического дизайна на базе компьютерных технологий" (X:\homes\kat\shared\ИНБ21 Основы интрент-технологий)
  -   Анализ целевой аудитории сайта.
  -   Изучение и анализ сайтов данной тематики, представленных в Интернете.
  -   Составление сводной таблицы просмотренных сайтов:


^ Скриншот сайта ^ Адрес ресурса ^ Карта сайта ^ Оформление сайта ||^
|  |  |  |  Достоинства  |  Недостатки  |  Особые «фишки», которые максимально привлекают внимание целевой аудитории  |  
| ... |  ... | ...  | ... |  ... | ...  |   

====== 2 ЭТАП: Разработка эскиза web-сайта ======
  - Определение объектов, которые должны присутствовать на всех страницах сайта.
  - Изучение особенности использования цвета и текста в Web.
  - Создание в графическом редакторе Gimp эскиза, на котором отражена общая схема расположения основных элементов сайта, проработана детализация содержимого страниц: шрифтовое решение названия и заголовков, примерные иллюстрации, их количество и размер, формы и размеры кнопок или слов гиперссылок.
  - Сохранение эскиза сайта в формате GIF или JPEG, загрузка его в окно разных браузеров, анализ полученных результатов.
  - Доработка эскиза сайта.

**Примеры эскизов сайта клиники пластической хирургии** (три варианта для дизайна сайта):

{{:users:inspiration85:oit_inb2_2012:вариант_1.jpg ?200x200|}}
{{:users:inspiration85:oit_inb2_2012:вариант_2.jpg ?200x200|}}{{:users:inspiration85:oit_inb2_2012:вариант_3.jpg ?200x200|}}

====== 3 ЭТАП: Домашняя страница сайта ======
  - Изучение роли и значимости различных типов страниц сайта.
  - Создание фирменного знака сайта в программе OpenOfficce Drow.
  - Разработка домашней страницы сайта.
  - Изучение и реализация приемов «оживления» домашней страницы сайта.

====== 4 ЭТАП: Внутренние страницы сайта ======
  - Разработка карты сайта.
  - Подбор материалов для содержания каждой внутренней страница сайта.
  - Разработка внутренних страниц сайта.
  - Разработка специальных страниц сайта.

====== 5 ЭТАП: Завершение работы над проектом ======
  - Проверка работоспособности сайта и корректного отображения всех графических элементов в различных браузерах.
  - Размещение сайта в сети Интернет.
  - Защита разработанного сайта.


----

====== Полезные ссылки ======

<note tip>
  * **Задания по JavaScript:** 
  - изучить базовые конструкции языка JavaScript, последовательно выполнив [[http://mif.vspu.ru/books/js/les1.html|следующие уроки]];
  - выполнить [[http://mif.vspu.ru/books/dhtml-task/|задания]] по работе с объектами браузера.
  * [[http://mif.vspu.ru/books/html123/ | Уроки по HTML – изучение шаг за шагом]]
  * [[http://www.buckses.info/lessonshtml/lesson1tables.html | Пошаговая инструкция создания сайта на html]]
  * [[http://css.manual.ru/|Справочник по CSS]]
  * **О.Яцюк «Основы графического дизайна на базе компьютерных технологий»** (X:\homes\kat\shared\ИНБ21 Основы интрент-технологий)
</note>



\ 

Назад: [[users:inspiration85:oit_inb2_2012:index]]

{{tag>}}