Web-дизайн, основы сайто строения, проблемы построения курса и их решение

Министерство общего и профессионального образования РФ. Мурманский Государственный Педагогический Университет Физико-математический факультет Отделение физика-информатика Кафедра информатики и общетехнических дисциплин Дисциплина Теория и методика преподавания информатики Тема Web-дизайн, основы сайто строения, проблемы построения

курса и их решение. Курсовая работа студента 4 группы Умова Сергея Мурманск 2004 План 1. Введение 3 стр. 2. Анализ учебников 4 стр. a. Информатика 10-11, автора Н.В. Макаровой b. Информатика и информационные технологии 10-11, автора Н. Угринович 3. Фрагмент лекции Иерархия протоколов.

6 стр. 4. Примеры упражнений Упражнение Основы навигации-9 стр. 5. Освещение темы Сервисы WWW - 12 стр. 6. Практическое задание 12 стр. 7. Урок самостоятельной работы по разработкам Работа с изображениями 14 стр. 8. Применение докладов и сообщений HTML 18 стр. 9. Самостоятельная работа учеников Проектная деятельность учащихся 22 стр.

10. Приложения 23 стр Введение В современном мире информационных технологий существует множество способов постижения той или иной сферы человеческого познания. Одной из таких сфер являются глобальные компьютерные сети. Изучив школьную литературу которая описывает данный раздел, а точнее преподование основ web строительства. Я на толкнулся на такую особенность либо данная сфера не так полно описывается как того на мой субъективный

взгляд требует время, либо описание, к большому сожалению, весьма однобоко. В большинстве литературы описание происходит только на уровне WYSIWYG What you see is what you get что ты видишь, то ты и получаешь технологии. Что на мой взгляд не является правильным. Решением такой ситуации стала разработка курса Web дизайн и основы PHP PHP язык web программирования который был разработан для учеников среднего старшего

звена школы. Анализ учебников Современная библиотека учителя представлена множеством литературы, хотелось бы рассмотреть как тема поднятая в курсовой освещена в этих учебниках. Согласен, что большинство учителей, так же как впрочем и учеников, обладают множеством дополнительной литературы. Причем эта литература может быть представлена не только в бумажном виде, но и на электронных носителях, будь то CD или HDD, я уже не говорю о самом

Интернете в котором информации по любой теме практически по любой превеликое множество. И вс же я хотел бы остановиться на учебниках, потому как они официально закрепляются программой, адаптированы для учеников и являются вс же, более распространены и доступны, нежели другие виды носителей информации. Для получения детьми полной картины по заявленной теме была разработана программа курса Приложение 1. Что бы оценить необходимость отдельного освещения необходимо оценить присутствие материала

в учебниках, для сравнения были взяты два учебника 1. Н. В. Макарова. Информатика СПб 2001г. 2. Н. Д. Угринович. Информатика и информационные технологии. М 1998г. Н. В. Макарова. Информатика В этом учебнике весьма доступно изложено много информации. Но такого раздела как программирование в нем не присутствует в прямом виде.

Хотя на мой взгляд, HTML Hyper Text Markup Language требует знания хотя бы элементарных основ у детей при изучение. Первая тема моего курса звучит как Основы и навигация в Интернет можно с долей большой уверенности сказать, что автор обсуждаемого учебника вообще не затрагивает даже эту тему. Хотя учебник и нельзя охарактеризовать как старый. В нм освещается такой материал как Word, Power Point и т.д.

Но вот интересующая тема, как впрочем и все темы связанные с Интернетом, сетями и уж конечно HTML не описаны. Я не имею права осуждать учебник, но вс же можно сказать о том, что стоило бы вс же включить эту тему, хотя учебник и рекомендуется для гуманитарных классов. Потому как Интернет популярен не только в классах с техническими направлениями. Имея некоторый опыт работы в школе, могу отменить, что

Интернетом, на уровне пользователя, увлекаются не только технические классы. Но так же и гуманитарии. Только технические классы чаще задаются вопросом А как оно происходит Почему именно так, а гуманитарные Как это проще сделать. Н. Д. Угринович. Информатика и информационные технологии. Учебник четко и ясно раскрывает все линии требуемой информации.

В нм представлены основы информатики и взаимосвязь ПК в сетях. Обсуждаемой теме в этом учебнике отдано сотня страниц. На мой взгляд это серьзно, но не так глубоко как хотелось бы. В учебнике весьма правильно с технической точки зрения освещена тема Адресация в Интернет и Протоколы передачи данных TCPIP

TCPIInternet protocol. Пара протоколов, на которых основывается сети Ethernet. Хотя и не упоминается ничего об уровнях протоколизации данных. Обильность точной графической информации, а так же примеров дают ученикам возможность самостоятельно изучать многие темы этого раздела. Продолжая анализировать источники информации которые были доступны

мне, я пришел к выводу о том, что тему Основы и навигация в Интернет. стоило бы вс же осветить не так. Предварив рассказ о возможностях ГС тут и далее, а так же как и во многих источниках, ГС глобальная сеть историей е возникновения получился комбинированный урок рассчитанный на пять - семь часов. Как показала практика, материал ученики весьма усваивают, хотя для них сложна тема иерархии протоколов

Эта тема была разработана на основе источника 4. Иерархия протоколов. фрагмент Обычно сетевые протоколы создаются на основе единой концепции в рамках многоуровневой системы, в которой каждый уровень отвечает за свою часть процессов передачи информации. Семейством протоколов protocolsuite называют всю совокупность протоколов различных уровней. Семейство TCPIP принято подразделять на четыре уровня

Между уровнями установлено следующее разделение функций. Канальный уровень link layer, data-link layer, или уровень сетевого интерфейса network interface, содержит две основные компоненты аппаратный сетевой интерфейс компьютера сетевую карту и соответствующий драйвер этого сетевого интерфейса в операционной системе. Вместе они обеспечивают как физическое подключение к кабелю или к другой физической среде, так и управление всеми аппаратными процессами передачи.

Telnet, FTP, e-mail и др. TCP и UDP IP, ICMPnIGMP Сетевой интерфейс сетевая карта и драйвер Четырехуровневая структура семейства протоколов TCPIP 2. Сетевой уровень network layer, internet layer отвечает за перемещение пакетов потому или иному маршруту в сети. В семействе протоколов TCPIP сетевой уровень представлен протоколами IP Internet Protocol, ICMP Internet ControlMessage

Protocol и IGMP Internet Group Management Protocol. 3. Транспортный уровень transport layer организует для вышестоящего прикладного уровня обмен данными между двумя компьютерами в сети. В семействе протоколов TCPIP одновременно используются два существенно различных транспортных протокола TCP Transmission Control Protocol протокол управления передачей данных и

UDP User Datagram Protocol протокол дейтаграмм пользователя.TCP обеспечивает надежную передачу потоков данных между двумя компьютерами в сети. В его задачи входит разделять данные, поступающие от обслуживаемых им приложений, на блоки приемлемого размера для нижестоящего сетевого уровня подтверждать получение пришедших к нему по сети пакетов в течение установленных им периодов времени таймаутов ожидать прихода подтверждений о получении отправленных им

пакетов и т. п. Поскольку TCP берет на себя все проблемы обеспечения надежной доставки врученных ему данных по назначению, то прикладной уровень освобождается от этих забот. Напротив, UDP предоставляет прикладному уровню намного более примитивный сервис. Он лишь рассылает данные адресатам в виде пакетов, называемых UDP-дейтаграммами UDP datagrams, без гарантии их доставки.

Предполагается, что требуемая степень надежности пересылки должна обеспечиваться самим прикладным уровнем. Каждый из этих двух транспортных протоколов находит соответствующее его достоинствам и недостаткам применение. Причины, по которым для одних приложений предпочтителен TCP, а для других UDP, станут, понятны при рассмотрении самих приложений. 4. Прикладной уровень application layer обеспечивает выполнение разнообразных прикладных задач.

Существует определенный классический набор стандартных прикладных сервисов, которые предлагаются в большинстве реализаций семейства TCPIP. В их числе Telnet, SMTP, POP Протокол удалнного доступа, а так же два протокола обмена почтой между клиентом и сервером и многие другие. После того, как ученики изучили материал им предлагается несколько упражнений самостоятельно. Эти упражнения направлены на закрепления их навыков работы

ГС, а так же на то, что бы преподаватель смог оценить уровень усвоенности материала. На знание теоретической части проводиться контролная работа. В которой ученикам предагается ответить на такие вопросы как неполный список, урезан 1. Несколько сокращений, наиболее популярных в ГС SMTP, PPP PPP point-to-point protocol, протокол связи точка-точка etc.

2. Уровни протоколизации данных. 3. Структура Интернет адреса 4. Зоны.Имеется ввиду доменные зоны, например .ru, .com, .cz, etc. Практическая часть по данному разделу курса заключается в выполнение нескольких упражнений Упражнение 1. Основы навигации 1. Загрузить программу браузер Internet Explorer. 2. Найти в строке Адреса адрес отображаемой страницы.

Это начальная страница, на которую настроен Ваш браузер. 3. Используя перемещение указателя Мышь по странице определить где имеются ссылки на другие страницы, а где просто текст. 4. Щелкнуть мышью по интересующей Вас ссылке. Связанный с ней документ появится на экране. 5. Вернуться к ранее просмотренному документу с помощью кнопки

Назад панели инструментов. 6. Просмотреть информацию сайта, перемещаясь произвольным образом по ссылкам. При навигации пользоваться кнопками Вперед, Назад. 7. Вернуться к начальной странице используя кнопку Домой панели инструментов. Упражнение 2. Сохранение и просмотр текста документа 1. Ввести в строке Адреса адрес Официального сервера Министерства

Образования РФ httpwww.ed.gov.ru. 2. Перейти по ссылке начальное, основное, среднее образование. 3. Просматривая документ найти информацию об обязательном минимуме содержания среднего общего образования и получить его на экран. Обратите внимание на то, что документ выгружается в новое окно Internet Explorer. 4. Сохранить документ с обязательным образовательным минимумом по преподаваемому Вами предмету. Так как документ содержит только текстовую информацию, то для его сохранения достаточно

активизировать меню Файл, Сохранить как открыть свою папку щелкнуть мышью по маленькой стрелочке в строке Тип файла, выбрать Web Page, HTML only только текстовая информация изменить, в случае необходимости, имя файла под которым будет сохранен документ щелкнуть мышью по кнопке Сохранить. 5. Просмотреть сохраненный файл средствами Internet Explorer активизировать меню Файл, опция Открыть, кнопка

Обзор в окне Открытие файла найти и открыть свою папку, найти сохраненный файл и щелкнуть по кнопке Открыть. 6. Щелкните по маленькой кнопке-стрелке справа от кнопки Назад. Почему в текущем списке из последних просмотренных страниц нет главной страницы Официального Сервера Российского Школьного Образования, с которой Вы начинали выполнение данного упражнения Где ее искать

Упражнение 3. Сохранение и просмотр изображения. 1. Ввести в строке Адреса адрес Новгородского Музея Заповедника www.novgorod-museum.ru 2. Перейти по ссылке Russian русскоязычная страница. 3. Найти и активизировать ссылку Фотогалереи 4. Получить на локальный диск любую фотографию Великого Новгорода щелкнуть правой кнопкой мыши по изображению выбрать во всплывающем меню

Сохранить рисунок как открыть свою папку в окне Сохранение рисунка и щелкнуть мышью по кнопке Сохранить. 5. Просмотреть полученное изображение средствами Internet Explorer активизировать Меню Файл, опция Открыть, кнопка Обзор в окне Открытие файла найти и открыть свою папку, щелкнуть по маленькой стрелке в поле Тип файлов, выбрать Все файлы, найти название полученной картинки, и щелкнуть по кнопке

Открыть. Упражнение 4. Сохранение и просмотр Web-страницы 1. Загрузить Web страницу по адресу www.junior.ruwwwexam. Перейти по ссылке Глобальные сети. 2. Сохранить на локальном диске материалы раздела Структура сети Internet, вместе с рисунками активизировать меню Файл, Сохранить как открыть свою папку щелкнуть мышью по маленькой стрелочке в строке

Тип файла, выбрать Web Page, complete страница полностью изменить, в случае необходимости, имя файла под которым будет сохранен документ щелкнуть мышью по кнопке Сохранить. 3. Просмотреть сохраненный файл, убедиться в том, что все рисунки сохраняются в отдельной одноименной автоматически создаваемой папке. Упражнение 5. Навигация с помощью внутренних средств сайта 4. Загрузить сайт

Школьный сектор ассоциации RELARN - school-sector.relarn.ru 5. Ознакомиться с начальной страницей сайта. 6. Выбрать в качестве проводника по сайту - Таню. 7. Активизировать ссылку Мастерская, ознакомиться с некоторыми детскими работами. 8. Пользуясь средствами внутренней навигации узла вернуться на главную страницу сайта. Сервисы WWW Приступая к данной теме, ученики уже либо обладают знаниями полученными в результате посещения

занятий курса, либо в результате собственных изысканий Тут имеется ввиду то, что ученики могут начать заниматься не прямо с первого занятия, а чуточку апосля. Это связано с тем, что сам курс разрабатывался для КРУЖКОВОЙ работы. А как показала трх летняя практика моей преподавательской деятельности, в течение двух недель, в любом случае проходит доукомплектование групп

Эта тема неплохо описывается в учебнике Информатика и учебные технологии, автора Н.Д. Угринович. На этой теме, в отличие от учебника я ещ несколько времени уделяю взаимодействию мейлера Мейлер от англ. Mail почта, программа для отправки и прима почты. Примером такой программы может служить The Bat, Opera. и сервера почты, а так же обзору современных почтовых серверов 1. hotbox.ru 2. mail.ru 3. rambler.ru 4. etc.

А так же, на объяснения понятия спам и способов борьбы с ним встроенные в почтовую программу средства, средства почтового сервера и т.д. В качестве контроля знаний, опять же, проводится контрольная работа на владение основными понятиями и сокращениями. А так же несложное самостоятельное задание. Практическое задание по теме. сокращено 1. Найти несколько отличий между двумя любыми по ядру браузерами. Найденные отличия обязательно записать в тетрадь для конспектов

Предполагается, что у учеников две тетради для практических работ и для лекционных занятий. Что позволяет им иметь высокоструктурированные и систематизированные знания. 2. В избранном создайте папку Библиотеки и занесите туда 5 ссылок на on-line библиотеки. Если ученики начинают весьма долго искать, то им можно подсказать, где именно искать httpwww.allbest.ru, хотя, практика показала что они У меня, как оказалось, весьма способные ученики в состояние найти

более десятка этих библиотек. Оценивая представленный материал в учебнике Угриновича, я смог вс же не затрагивать темы видеоконференций на практике. Это связано с тем, что технические возможности того компьютерного класса где я работаю, не позволяют такое проводить. Да и потом, скорость связи с ГС в России пока оставляет желать лучшего. Работа с изображениями урок самостоятельной работы по разработкам

Следующим разделом к которому преступают ученики является обработка и создание графической информации. Понимая всю значимость темы, я стараюсь наиболее правильно объяснить важность качественного рисунка и концепции цвета на web ресурсе. Проанализировав учебники, понял, что опять же, учебник Макаровой практически не содержит ни какой полезной о данном разделе информации. Но не смог меня порадовать и учебник Угреновича, в нм рассматривается только графический редактор

Paint, который, конечно же, применим для web-дизайна, но вс только в самых крайних случаях. Множество тем в этом разделе ученики проходят заранее созданных разработок. Такой способ был выбран потому, что при рисование они будут действовать весьма с разной скоростью. Одной из малых подтем этого раздела является Создание анимационных GIF-изображений. Создание анимационных GIF-изображений

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

Некоторые энтузиасты размещают на странице несколько анимации. Добавьте к этому средства реакции на события мыши mouseover, а также аудио и другие мультимедиа и вы очень быстро потеряете суть дизайна страницы, а заодно и свою аудиторию Поэтому, размещая на странице активные элементы, не теряйте чувство меры. Посмотрим, как создавать GIF-анимацию с помощью GIF

Construction Set и Photoshop. He имеет значения, какие инструменты анимации и работы с изображениями вам .нравятся, методы все равно очень похожи, и мой пример поможет вам прямо сейчас начать создание GIF-анимаций. Прежде всего необходимо создать отдельные изображения, которые будут использоваться .в анимации. Их называют ячейки cells. Каждое такое изображение можно представить как отдельное действие, выполняемое при воспроизведении анимации. Анимацию можно делать простой или сложной.

Я бы рекомендовал начать с чего-нибудь попроще. Всегда следует заранее обдумать, что вам может понадобиться в процессе работы. например специальные графические изображения или текст. Необходимо также знать размеры анимации, чтобы создавать ячейки нужного размера. Выбирайте изображения меньшего объема, чтобы ваш файл не стал слишком большим. Чей проще сырье, тем легче и конечный продукт. Создадим анимацию, где можно будет прочесть

I love my саt 1. Откройте программу работы с изображениями. 2. Создайте первое из изображений. Выберем размеры 100x100 пикселей не забудьте указать эти размеры при создании нового файла с помощью команды File New. 3. Первое изображение это слово I, так что с помощью инструмента Туре выберите для него шрифт и введите само слово, разместив его в центре изображения.

4. Оптимизируйте изображение в GIF-формат. 5. Сохраните файл как imagel.gif.Теперь создадим следующее изображение. 1. В своей программе откройте имеющийся файл с пиктограммой. 2. Задайте изображению нужные размеры и вырежьте лишние участки. 3. Индексируйте изображение и оптимизируйте его до минимально возможного числа цветов без потери качества. 4. Экспортируйте его как GIF-изображение. 5. Сохраните файл как image2.gif.

Теперь повторяйте последовательность действий из первого или второго примера, в зависимости от того, работаете ли вы с текстом или графикой. Называйте каждое изображение. И соответствии с его порядковым номером. Когда вы закончите работу у вас получиться получился следующий набор файлов. Imagel .gif GIF-изображение размером 100x100 пикселей со словом I Image2.gif GIF-изображение размером 100x100 пикселей, на котором показано серд

Image3.gif GIF-изображение размером 100x100 пикселей со словом mу Image4.gif GIF-изображение размером 100x100 пикселей, на котором показана кошка Теперь все эти файлы находятся на жестком диске. Чтобы создать анимационную графику с помощью GIF Construction Set, выполните описанные ниже действия. 1. Откройте GIF Construction Set. 2. Выберите команду меню

File Animation Wizard. 3. Щелкните на кнопке Next. 4. Выберите Yes в качестве ответа на вопрос Use with a Web Page. 5. Щелкните на кнопке Next. 6. Выберите количество выполнений цикла показа анимации. 7. В следующем диалоговом окне необходимо указать вид графики. Выберите то описание, которое лучше всего соответствует вашей графике.

У меня это рисованное изображение Drawn рис. 30.6. 8. Теперь следует установить время задержки. Для удобства демонстрации придерживайтесь значения по умолчанию, т.е. 100 сотых секунды, хотя в будущем можно будет выбирать любое время а также менять уже установленное значение. 9. Щелкните на кнопке Next. 0. 10. Выполните команду Select. 11. Перейдите в каталог, где хранятся созданные вами

GIF-изображения. 12. Выберите изображения в том порядке, в каком они должны появляться при анимации. 13. Щелкните на кнопках Next, Done. 14. Когда GIF Construction Set закончит создание анимации, воспользуйтесь для сохранения файла командой Save As 15. Теперь просмотрите свою анимацию с помощью команды View. Кроме того, учитывая, что нигде из учебников для школы не встретил нормально описанной теории

цвета Теория о возможности нахождения двух и более совмещаемых цветов, т.е. тех цветов, которые рядом могут вызывать только тот контраст, который необходим. пришлось создавать е полностью из ресурсов интернета httpdesign.ru - сайт Артемия Лебедева В данном разделе эта всего лишь одна лекционная тема, но без не невозможно создание полноценных правильно сконфигурированных по цвету сайтов. В конце раздела такая же практика и спрос небольшого количества теории.

HTML применение докладов и сообщений В данном разделе ученики узнают об инфраструктуре HTML документа, о стандартах W3C Входе всего курса я привожу делаю информационные справки, причм часть из них готовят сами ученики. Пример такой информационной справки см. в приложение 2. На такие дополнения датся ученикам немного времени, но обычно тtvs подбираются весьма узкие, что бы не затягивать во времени о средах редактирования и т.д.

См. приложение 1 О средах редактирования, на мой взгляд, нужно говорить в сравнение, потому как это весьма и весьма спорный момент во всм web-дизайне. Эту тему я стараюсь преподать и объяснить вот таким образом. Хотя весь урок и проходит в виде беседы, рассказа не лекции, мы вс же записываем некоторые ключевые моменты. Среды редактирования HTML фрагмент Среда редактирования

HTML является нейтральной полосой между простейшим текстовым редактором и приложением WYSIWYG. Выбор среды редактирования дает все преимущества текстового редактирования что же касается недостатков, то с ними ведется борьба. Обычно в средах редактирования используется графический пользовательский интерфейс, поэтому там много знакомых и интуитивно понятных функций, доступных на инструментальной панели, и большое количество мощных инструментов. Среду редактирования можно считать текстовым редактором с

усовершенствованиями. Лично я обращаюсь к средам редактирования HTML, когда выполняю основную часть кодирования. Причина в том, что в мое распоряжение предоставляются все возможности контроля и творческий потенциал текстового редактора. При этом сам процесс ускоряется благодаря таким инструментам, как компьютерный справочник, интерфейсы дескрипторов и проверка орфографии. Если ваши знания

HTML не достаточно обширны и требуется приложение, которое поможет вам работать более эффективно, то среда редактирования HTML это то, что вам нужно. Чтобы проверить подобное утверждение, рассмотрим некоторые возможности этого популярного способа кодирования. Преимущества сред редактирования HTML В средах редактирования HTML предлагаются шаблоны, инструментальные панели, с помощью которых автоматически вставляются определенные

дескрипторы, а также мастера изображений, которые автоматически вставляют в код их размер и предоставляют полный набор альтернативных текстовых атрибутов. Таким образом, самые важные функции в среде легкодоступны. Щелкнув мышью или нажав комбинацию клавиш, можно получить именно то, что вы хотите, и довольно-таки быстро. Достаточно распространенной проблемой в Web является то, что многие забывают о такой важной части процесса разработки узла, как проверка орфографии.

Хороший, должным образом проверенный текст крайне важен, если вы хотите добиться максимального успеха своего узла. В большинстве сред редактирования HTML имеется проверка орфографии, и я уверен, что вы оцените эту возможность по достоинству. Другим преимуществом является проверка синтаксиса, которая предлагается большинством сред. Этот полезный инструмент проверяет код, помогая выявлять проблемы, и исправляет многие ошибки и опечатки. Выделение дескрипторов цветом весьма эффективно, потому что позволяет быстро их распознать.

Например, можно выводить все дескрипторы изображений желтым цветом, а табличные, синим. Это может быстро найти информацию, в особенности на очень сложных страницах. Такими полезными функциями обладает редактор 1st page. Приложения WYSIWYG WYSIWYG what you see is what you get, что ты видишь то ты и получаешь, технолгия. Эти приложения обеспечивают работу пользователя с помощью графического интерфейса.

Они популярны не только из-за малого времени, требуемого для их изучения, но и благодаря легкой переносимости от пользователя к пользователю. Это особенно важно для компаний в которых много сотрудников работают с кодом HTML, приложение WYSIWYG погает сохранить согласованность стилей кодирования. Другое преимущество этого типа приложений в том, что они позволяют заниматься дизайном Web-cстраниц, даже не изучая HTML. Графический интерфейс позволяет разместить на странице необходимую

графику и текст и перемещать их до тех пор, пока не будет найден наиболее подходящий внешний вид. За последующую генерацию кода отвечает программное обеспечение. Некоторые приложения WYSIWYG, такие как FrontPage корпорации Microsoft, имеют очень мощные функциональные возможности, не относящиеся к дизайну. Сюда входят расширения, позволяющие управлять проектами, и специальные приложения, например, для поиска

или поддержки форм. Такие возможности привлекают к WYSIWYG многих пользователей. Отлично понимая, почему программы WYSIWYG так популярны, не могу не отметить, что использование большинства таких приложений связано с большими проблемами. Первая из них относится к контролю. HTML позволяет авторам осуществлять самый точный контроль над страницей.

Конечно, хотя стандарт 4.0 предлагает технологии, решающие многие проблемы контроля, повседневное их использование все еще ограничено. Это означает, что разработчик вынужден полагаться на связь созданного им дизайна и HTML-кода. Это целостный процесс, лучше всего определяемый опытом, которого у приложений просто быть не может. Касается ли это выбора процентных значений или пикселей для размера данного элемента либо настройки всего кода, в приложениях WYSIWYG обычно отсутствует возможность тонкой настройки.

Многие программы WYSIWYG, в особенности старые версии FrontPage, модифицируют написанный вами код HTML Вы уже знакомы с понятием толстого кода эта проблема затрагивает и программы WYSIWYG. Хотя степень настройки таких программ по сравнению с утилитами преобразования выше, кодирует все же программа, а не вы. Это в конечном итоге означает, что полученный код обычно отражает стиль программы, а не разработчика кода. В листинге 3.3 показан код, полученный с использованием

WYSIWYG-программы Adobe GoLive. Листинг 3.4 содержит тот же код, созданный вручную. Проектная деятельность учащихся Первая проектная деятельность учащихся После рассмотрения многообразия тегов дескрипторов необходимых для написания простейших страниц ученики приступают к созданию своих первых проектов. Изучение тегов строится в соответствие с логическими связями самого HTML. В конце первого полугодия дети создают первый серьзный проект, который должен отвечать

нескольким требованиям 1 Нести обязательную информационную нагрузку. 2 Содержать не менее 10 страниц 3 Иметь графическое оформление. 4 Все цвета сайта должны быть совмещены в соответствие с теорией цвета. Детям предоставляется возможность доступа к глобальной компьютерной сети где они осуществляют поиск необходимой информации. После вместе с ними разрабатывается концепция их будующего сайта, структура

и т.д. Во время проектной деятельности учащиеся самостоятельно создают сайт, но учитель присутствует, хотя и в очень малых количествах советы, напоминания. Проектная дельность в данном случае представляет серьзный контроль знаний и умений учащихся. По результатам их проектной деятельности можно судить о результатах деятельности всего курса, всего ансамбля действий проведенных в первом полугодии. Вторая проектная деятельность

В конце изучения ученики обладают достаточным багажом знаний и способны использовать как JS так PHP. Что сильно повышает их интерес к создаваемому проекту. После изучения серверного языка PHP ученики способны написать достачно серьзные скрипты, такие как Гостевая книга, Форум. Причем предполагается что все скрипты они размещают на своем сайте проектная деятельность второго полугодия, которая является логическим завершением курса.

Самое главное, что отличает проектную деятельность от других видов проверочных работ публичная защита. Что вырабатывает у них стремление сделать свой сайт проект более качественным и привлекательным. Так же как и в первой проектной деятельности, они практически полностью самостоятельно реализуют свою фантазию с наложением тех же ограничений, которые были им, представлены ещ в середине курса. Заключение В результате проделанной работы и проведнных исследований литературы и других источников

был разработан и опробован курс обучения. Конечный результат будет известен чуть позже, он стал физическим результатом работы автора и является лучшим подтверждением проведнных действий. Но вс же, школьные учебники более всецело позволили охватить область взаимодействия разделов этой темы и осветить поднятую проблему. Приложения Приложение 1 Распределение часов курса Web-дизайн, основы сайто строения

Темы занятийКоличество часовОсновы навигации в Интернет8Связь в сетях Ethernet. Иерархия протоколов. IP-адрес. DNS. Структура Интернет-адреса2Интерфейс программы Microsoft Internet Explorer1Приемы навигацииАвтозавершение адреса1Навигация по документам, содержащим фреймыВыбор начальной страницы1Переключение кодировок русского языкаСохранение и печать

Web- страницУпражненияОсновы навигации Упражнение 11Сохранение и просмотр текста документаУпражнение 2Сохранение и просмотр изображения. Упражнение 31Сохранение и просмотр Web-страницы Упражнение 4Навигация с помощью внутренних средств сайта Упражнение 51WWW-сервис Интернет3Сервисы Интернет1Что такое WWWПрограммы просмотраПриемы эффективной работы с программой

Microsoft Internet Explorer1Избранные страницы1Реорганизация ярлыков избранных страниц по папкамСистемы бесплатной почты в ИнтернетПопулярные интернет сервера1Поисковые системы в Internet2Тематические каталоги1Поисковые машины1Работа с изображениями3Обработка изображений в Photoshop1Изменение яркости изображенияДобавление текста на изображение1КадрированиеАкцентуация внимания на отдельны части изображения1Работа с цветовой палитрой фотографииHTMLЧто такое

HTML5Инфраструктура HTML1Стандарты и соглашения1W3CСреды кодирования1Кодирование вручную2Приложения WYSIWYGЛокальное управление HTML-документами2Управление файлами1Правильность имн1Структура каталоговОсновы HTML3Синтаксис HTML1Дескрипторы тэгиСпециальные символы1Горизонтальная симметрияМетод контейнеров1Создание документов HTML2Структура документа1Структура тела документа Standard BODYВертикальная симметрия1Форматирование и выравнивание текста3Элементы форматирования1Концепция

текстаРабота с заголовками1Выравнивание абзаца, позиционированиеПредварительно форматированный текст1Тэг PТег DIVСписки3Использование списков1Значение списковНеупорядоченные спискиНумерованные списки1Инкапсуляция списковАтрибуты списков1Связывание страниц3Дескриптор якоря1Абсолютное связываниеОтносительное связывание1Внутренние ссылки 1Почтовые ссылкиРабота с изображениями4Тэг IMG1Атрибуты тэга изображения1Плавающие изображенияПозиционирование изображения1Комбинации изображенийТехнологии MAP1 Работа с тэгом

BODY1Управление цветовой палитрой вложенных объектов1Атрибуты браузера IEРабота со шрифтами2Основы полиграфии1Ориентирование Интерлиньяж1Атрибуты тэга FONTТаблицы3Симбиоз таблицы с рисунком1Внедрение таблиц в документДинамические и фиксированные таблицы1Выравнивание таблиц1Технология CSS4Стилизация символов1Свойства стилей и их назначения1Изменение атрибутов стиля2Использование фреймов3Вопрос

о необходимости использования фреймов1Структура фреймов1Набор фреймовПостроение страниц с фреймами1Дескриптор NOFRAMEЭффективный дизайн страницы2Концепция интерфейса пользователя1Анализ цели узлаИнформационный замысел сайтостойтеляТеория цвета1Технология цвета в WEBЦвет и гамма экранаПроектная деятельность учащихся12Разработка тематики1Анализ подготовленного материала1Обработка графического материала1Создание дизайна2Непосредственное создание сайта6Опубликование сайта1Браузерные

языки программированияJS4Знакомство с JavaScript1Добавление сценария на страницуДобавление операторов JSВывод результат на экран1Тестирование сценарияИспользование функций1Обработка событийСкрытие сценариев в старых браузерах1Использование и хранение значений3Использование переменных1Типы данных1Преобразование данных1Тестирование и сравнение значений3Оператор if1Использование условных выражений1Основы дискретной математики1Задание нескольких условийЦикличности2Использование цикла

While1Использование цикла ForУправление массивами1Обработка событий2Роль обработчика событий в JS1События, связанные с мышьюСобытия связанные с клавишами1Событие OnLoadДобавление рисунков и анимаций2Использование раздельного рисунка1Динамические рисункиChange picture1Простая анимацияСоздание сценариев для разных броузеров1Получение сведений о браузере1Поддержка JS браузером Серверные языки программированияРНР1Общее понятие об

СЯП2Достоинства и недостатки РНР программирования2Переменные, константы, выражения4Типы переменных1Некоторые условные обозначения1Константы1ВыраженияОперации1 Использование форм в HTML5Создание формы2Распределение видов ввода данных2Методы передачи данных на сервер обработки1Использование данных от форм в PHP3Трансляция полей формы в переменные1Трансляция переменных окружения и Cookies1Трансляция списков1Трансляция массивовКонструкции

РНР8echo1If-elseИспользование альтернативного синтаксиса1Цикл с предусловием While1Цикл с постусловием do-while1Универсальный цикл for1Инструкции break continue3Инструкция include requireАссоциативные массивы4Создание массивов1Использование массивовСписки и строки1Инструкции array, count.1Сериализация1Строковые функции 2Сортировка массивов1Ключи и значения1Комплексная замена в строчкеМатематические функции2Встроенные константы1Функции округления1Минимум максимумДополнительные функции

PHP2Проектная деятельность учащихся17Разработка тематики3Разработка симбиоза с HTML проектом1Обработка информационной нагрузки1Обработка графической информации3Непосредственная дополнение HTML проекта PHP JS9Публичная защита проекта деятельности4 Препологаемый результат Расширить знания учащихся при получаемые при изучение основного курса. Развить интерес к предмету, любознательность, смекалку.

Обучить методам решения поставленных задач с помощью персонального компьютера и соответствующего программного обеспечения. Приложение 2 Консорциум World Wide Web W3C Консорциум World Wide Web. Официально консорциум действует с 14 декабря 1994 года. Это независимая международная организация, куда входят разработчики Internet и Web от отдельных лиц до представителей больших корпораций, таких как

Microsoft, IBM, Sun Microsystems и Netscape. Деятельность консорциума состоит в наблюдении за стандартизацией HTML, а также за различными протоколами и языками, связанными с Web, включая XML, CSS, SMIL, HTTP, URL, FTP, NNTP и SGML. Широкое развитие Web в первую очередь обусловлено популярностью используемого HTML и тем, что требования разработчиков и потребителей оказались на удивление схожи.

В связи с этим ряд рассматриваемых консорциумом вопросов был отложен, для того чтобы не раздражать Web-энтузиастов и разработчиков, жаждущих большей гибкости. Некоторые из предложенных изменений связаны с усовершенствованием протоколов. Главные изменения вносятся в HTTP, помощник и транспорт HTML. Предлагаемые изменения в первую очередь касаются технологий, которые должны расширить возможности

дизайна и функциональность Web-узлов. Те, кому интересны история, эволюция, использование и будущее HTML, должны регулярно посещать узел W3C www.w3.org. Литература 1. Браунденбау Д, JavaScript сборник рецептов для профессионалов СПб, Питер, 2000г. 2. Котеров Д PHP4, СПб, BHV, 2001 3. Макарова. Н. В. Информатика СПб 2001г. 4. Молли Э.

Хольцшлаг, Использование HTML 4, 6-е издание, М. 99г. 5. Ричард У. Стивенс, Протоколы TCPIP Практическое руководство, СПб 2002г. 6. Угринович. Н. Д. Информатика и информационные технологии. М 1998г. Интернет ресурсы httpphp.spb.ru - Питерский РНР портал httpphp.krivyeruki.ru - Кривые руки познавательный портал

Самары httpmanlix.ru - Манликс, инфомационный ресурс httpwww.myweb.ru - Мой хостинг httprus.inc.ru - Библиотека энциклопедий