'

Создание и дизайн сайтов

Понравилась презентация – покажи это...





Слайд 0

Создание и дизайн сайтов Краткая аннотация: Урок рассчитан для 11-го класса. Предполагается предварительное ознакомление с программой Adobe Dreamweaver


Слайд 1

Мини опрос: Что такое сайт? Что такое контент? Что такое движок сайта? Что представляет из себя хостинг?


Слайд 2

Правильные ответы: Сайт – это совокупность взаимосвязанных документов Контент – это содержание сайта Движок – это программа, позволяющая изменять контент и оформление сайта Хостинг – это предоставление места под сайт


Слайд 3

определения Тег - элемент HTML, представляющий из себя текст, заключенный в угловые скобки <> CSS (англ. Cascading Style Sheets — каскадные таблицы стилей) — технология описания внешнего вида документа, написанного языком разметки. JAVAScript - язык программирования, основанный на объектном представлении браузера. Adobe Dreamweaver в пер. «ткач мечты», «мечтаплёт» или «плетельщик мечты») — HTML-редактор.


Слайд 4

Способы создания Ручной (самописный) – этот способ использовался профессионалами и сегодня практически утратил свою актуальность. Онлайновый– этот способ используется для создания простых сайтов из готовых шаблонов. Программный – этот способ используется для создания дизайнерских изысков и сложных сайтов.


Слайд 5

Ручной (самописный) способ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN“ <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Документ без названия</title> </head> <body> // тут может быть что угодно </body> </html> свободное владение языком программирования возможность свободного изменения свойств страницы отсутствие лишнего ненужного кода не удобность позиционирования большая вероятность наличия ошибок отсутствие парсинга отсутствие подсветки кода долгое время создания и многое другое… МИНУСЫ: ПЛЮСЫ:


Слайд 6

Основные элементы страницы <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN“> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Документ без названия</title> </head> <body> // тут может быть что угодно </body> </html>


Слайд 7

онлайновый Существует множество различных хостингов предоставляющих как место под уже готовые сайты, так и имеют свои собственные структуры шаблонов для создания сайта. Рассмотрим пример создания сайта на web сервисе http://www.UCOZ.ru


Слайд 8

Создание сайта онлайн 1. Нажимаем кнопку создать сайт 2. Заполняем все поля Шаг 1-2


Слайд 9

3. Подтверждаем регистрацию через e-mail 4. Заполняем колонку администратора Создание сайта онлайн Шаг 3-4


Слайд 10

5. Указываем домен сайта 6. Сайт успешно создан 7. Панель управления дизайном сайта Создание сайта онлайн Шаг 5-7


Слайд 11

Вид созданного сайта


Слайд 12

программный Далее рассмотрим создание каркаса сайта с помощью программы ADOBE DREAMWEAVER, а также привязку CSS для формирования стиля


Слайд 13

4. Заполняем колонку администратора Программное создание сайта Шаг 1 1. Создаем новый документ из шаблона пустой страницы – выбираем все пункты и нажимаем создать


Слайд 14

Программное создание сайта После нажатия кнопки создать у Вас появится такое окно и есть созданный нами сайт с его основными структурными частями Шаг 2


Слайд 15

Программное создание сайта Шаг 3


Слайд 16

Спасибо за внимание!


×

HTML:





Ссылка: