|
|
Ст. преподаватель каф. СТЕ.А. АгандеевСтр 1 из 2Следующая ⇒ Оценка работы ____________________ Дата защиты «___» ________ 2017г. Руководитель работы ст. преподаватель каф. СТ _____________ Е.А. Агандеев Саратов – 2017 Федеральное государственное бюджетное образовательное учреждение высшего профессионального образования «САРАТОВСКИЙ ГОСУДАРСТВЕННЫЙ ТЕХНИЧЕСКИЙ УНИВЕРСИТЕТ ИМЕНИ ГАГАРИНА Ю.А.»
институт электронной техники и машиностроения Кафедра «Системотехника» ЗАДАНИЕ На курсовую работу по дисциплине «Информационные технологии» студенту учебной группы б2ИВЧТ-41ИнЭТМ Капкову Рамилю Равильевичу «Разработка сайта компании»
Начало проектирования «__» __________ 2017 г. Представление оформленной работы ________________2017 г. Дата защиты «__» __________2017г. Оценка защиты _______________ Ст. преподаватель каф. СТ _____________ Е.А. Агандеев Целевая установка и исходные данные
Цель курсовой работы: Целью проекта является изучение языка программирования HTML и JavaScript. Исходные данные 1. Изучить язык программирования HTML и JavaScript 2. Изучить принцип работы браузеров. 3. Создать оригинальный сайт.
Список Рекомендованной литературы 1. Пирогов, В. Ю. Информационные системы и базы данных: организация и проектирование: учеб. пособие / В. Ю. Пирогов. - СПб.: БХВ-Петербург, 2009. - 528 с. (10 экз. НТБ СГТУ)
Руководитель курсовой работы, ст. преподаватель каф.СТ _____________Е.А.Агандеев (подпись)
Задание приняла к исполнению «__» __________2016г.
Студент _____________Р.Р. Капков. (подпись)
РЕФЕРАТ Пояснительная записка состоит из 21 страниц.
Ключевые слова:
В данной курсовой работе был разработан сайт компании. Были изучены языки программирования HTML и JavaScript, изучен принцип работы браузеров. Был разработан сайт компании.
СОДЕРЖАНИЕ
Введение. 6 Устройство сайта. 7 Структура web-страицы 8 Основные элементы HTML.. 9 Графика 15 Формат GIF 16 Формат JPG.. 17 Заключение. 20 Список литературы.. 21
ВВЕДЕНИЕ
Иметь сайт – не только популярно и престижно, но и эффективно, рационально и разумно. Собственный интернет-ресурс позволит сэкономить время, увеличить возможности, освободить от рутинной работы. Поможет осуществить рекламу, включая и «саморекламу». Создание сайта можно превратить в увлекательное творческое занятие, доставляющее настоящее эстетическое удовольствие от проделываемой работы и получаемого результата. Если выберите эффективный, адекватный поставленным целям и требованиям, а также ресурсам, способ создания сайта.
Устройство сайта
Страницы сайтов — это набор текстовых файлов, размеченных на языке HTML. Эти файлы, будучи загруженными посетителем на его компьютер, понимаются и обрабатываются браузером и выводятся на средство отображения пользователя (монитор, экран КПК, принтер или синтезатор речи). Язык HTML позволяет форматировать текст, различать в нём функциональные элементы, создавать гипертекстовые ссылки (гиперссылки) и вставлять в отображаемую страницу изображения, звукозаписи и другие мультимедийные элементы. Отображение страницы можно изменить добавлением стилей на языке CSS, что позволяет централизовать в определенном файле все элементы форматирования (размер и цвет заглавных букв 2-го уровня, размер и вид блока вставки и другое) или сценариев на языке JavaScript, с помощью которого имеется возможность просматривать страницы с событиями или действиями. Страницы сайтов могут быть простым статичным набором файлов или создаваться специальной компьютерной программой на сервере. Она может быть либо сделана на заказ для отдельного сайта, либо быть готовым продуктом, рассчитанным на некоторый класс сайтов. Некоторые из них могут обеспечить владельцу сайта возможность гибкой настройки структурирования и вывода информации на веб-сайте. Такие управляющие программы называются системами управления содержимым (CMS).
Структура WEB-страницы Заготовка типичной WEB-страницы: <HTML> <HEAD> <TITLE> Структура WEB-страницы </title> <STYLE> p {font-family: Arbat;}CODE { font-family: Arial;} </style> <META http-equiv. = ”Content-Type” content = “text/html; chariest = windows-1251"> <META name = “Author” content = “Pavel Trizno”> <META name = “Keywords” content = “ HTML, document, element”> </head> <BODY bgcolor = #FFFFFF> <!-- Комментарий к страницы --!> <A name = “top></a> Переход к <A href = “#bottom”> конец </a> документа <P> Переход к <A href = “#S001”> <B> ссылке 1 </b></a><P> <P> <HR> <H1> Заголовок 1 </h1> <p> Заголовок 2 </h2> <H3> Заголовок 3 </h3> <H3> Заголовок 4 </h4> <H3> Заголовок 5 </h5> <H3> Заголовок 6 </h6> <HR> Здесь расположена <B> ссылка 1 </b><A name = “S001”></a> <HR> <P> Здесь должен располагаться оригинальный текст WEB-страницы <HR> <A name = “bottom”></a><P> Переход в <A href = “#top”>начало</a> документа </body> </html> Если рассмотреть исходные тексты различных WEB-страниц, то можно легко увидеть схожесть их структуры. Это объясняется тем, что документы создаются по определенным правилам. В основу синтаксиса языка HTML лег стандарт ISO 8879:1986 «Information processing. Text and office systems. Standard Generalized Markup Language (SGML)». Правда, существует большое различие между стандартом официальном и стандартом фактическим. HTML постоянно развивается, дополняется новыми элементами. Основные элементы HTML. <HTML></html> Означает документ на языке HTML. Я уже упоминал о том, что одним из принципов языка является многоуровневое вложение элементов. Данный элемент является самым внешним, так как между его начальным и коечным тегами должна находится вся WEB - страница. В принципе этот элемент. Он имеет атрибуты version, long и dir, которыми в данном случае редко кто пользуется, и допускает вложение элементов HEAD, BODY и других, определяющую общую структуру WEB-страницы. Конечным тегом </html> оканчиваются все документы в формате HTML. <HEAD></head> Область заголовка Web - страницы, её первая часть. HEAD служит только для формирования общей структуры документа. Этот элемент может иметь атрибуты IANG, DIR, должен включать элемент TITLE и допускает вложение элементов BASE, META, LINK, OBJECT, SCARIPT, STULE. <TITLE></title> Элемент для размещения заголовка Web - страницы. Строка текста, расположенного внутри этого элемента, отображается не в документе, а в заголовке окна браузера. Эта строка часто используется при организации поиска в WWW. Эта строка должна достаточно точно отражать назначение документа. <STYLE></style> Элемент для описания стиля некоторых элементов Web - страницы. В файле Strukt. Htm назначены шрифты для элементов h2, code. Для каждого элемента существует стилевое оформление по умолчанию, поэтому употребление элемента style не обязательно, но желательно. Этот элемент введён сравнительно недавно, без него немыслима работа в приложениях World, Excel. <META> Элемент содержит служебную информацию, которая не отражается при просмотре Web- страницы. Внутри него нет текста в обычном понимании, поэтому нет и конечного тега. Каждый элемент Meta содержит два основных атрибута, первый из которых определяет тип данных, а второй - содержание. Вот несколько примеров meta - данных: Дата, обозначающая срок годности документа: Name - “Expires” content = “Дата” Адрес электронной почты: Name = “Reply - to” content = “ Имя @ Адрес “ Имя автора Web-страницы: Name = “Author” content = “ Имя автора” Набор ключевых слов для поиска: Name = “Keywords” content = “слово 1, слово 2, слово 3…” Краткое описание содержания Web- страницы: Name = “Description” content = “Содержание страницы” Описание типа и характеристик Web - страницы: Name = “Content - Type” content = “ Описание страницы” Указание приложения, в котором была создана Web - страница: Name = “Generator” content = “Название HTML - редактора” Атрибут Name используется приложением - клиентом для получения дополнительной информации о Web - страницах и их упорядочения. Его часто заменяют атрибутом http - equiv. Он используется сервером для создания дополнительных полей при выполнении запроса. Элемент META может содержать URL. Шаблон атрибута таков: URL = “http: // адрес” <BODY></body> Этот элемент заключает в себе гипертекст, который определяет собственно Web - страницу. Конечный тег этого элемента надо искать в конце HTML-файла. Внутри элемента BODY можно использовать все элементы, предназначенные для дизайна Web-страницы. Внутри начального тега элемента BODY можно расположить ряд атрибутов, обеспечивающих установки для всей страницы целиком. Атрибут, определяющий фон страницы, является одним из самых важных для дизайна. background = “Путь к файлу” Более простое оформление фона сводится к заданию его цвета: bgcolor = “#RRGGBB” Цвета фона задается тремя двухразрядными шестнадцатеричными числами, которые определяют интенсивность красного, зеленого и синего. Оба приведенных выше атрибута не являются альтернативными и часто используются совместно: если по каким-либо причинам не может быть найден рисунок фона, используется цвет. Поскольку фон станицы может изменятся, необходимо иметь возможность подбирать соответственный цвет текста. Для этого имеются следующей атрибут: text = “#RRGGBB” Для задания цвета текста гиперссылок используются следующие атрибуты: link = “#RRGGBB” Точно так же можно задать цвет для просмотренных гиперссылок: vlink = “#RRGGBB” Можно также указать изменение цвета для последней выбранный пользователем гиперссылки: Alink = “#RRGGBB” <!-- Комментарий --!> В любом языке программирования есть конструкции, позволяющие создавать произвольные ремарки. HTML в этом смысле - не исключение. Текст, введений внутри этого элемента, игнорируется браузером. Эти элементы могут располагаться в любом месте WEB-страницы. Признаком комментария служит восклицательный знак, а текст комментария должен обрамляться двойным дефисом. Например: <!-- Комментарий --!> <H1><h1> Элемент заголовка. Существует шесть уровней заголовка, которые обозначаются H1…H6. Заголовок уровня 1 самый крупный, а уровень 6 обеспечивает самый маленький заголовок. Для заголовков могут использовать атрибуты, задающие выравнивание влево, по центру или вправо: align = “left” align = “center” align = “right ” <HR> Горизонтальная линия - очень часто используемый элемент. Во-первых, потому что с его помощью очень удобно делить страницу на части. Во-вторых, потому что выбор подобных элементов оформления у автора страницы очень небольшой. Этот элемент не имеет конечного тега, но допускает ряд атрибутов для выравнивания влево, по центру, вправо, по ширине: align = “left” align = “center” align = “right ” align = “justify ” Можно задать толщину линии: Size = толщина в пикселях Можно управлять длиной линии: width = длина в пикселях width = длина в процентах Можно выбрать цвет: color = “цвет” <A></a> HTML-документ может быть очень большим, и в этом случае нужно иметь возможность быстрого перемещения к нужному разделу документа. Для этого можно использовать механизм гиперссылок. Необходимо также в нужных местах текста расставить соответствующие метки. Шаблон для создания меток таков: <A name = “>Произвольный текст</a> В данном случае данной строке документа присваивается имя, и, следовательно, в другой части документа или даже на другом документе может быть создана гиперссылка, приводящая в эту точку. Для перехода внутри документа можно использовать следующую конструкцию: <P>Переход к <A href = “#метка”>метке</a></p> Несколько подобных строк могут образовать своеобразное оглавление Web-страницы, которое можно разместить в начале и в конце документа. Читая эту работу, вы, конечно, уже достаточно много поработали со ссылками и понимаете, что это такое на практике. Вы поняли, что: гипертекстовые ссылки среди других элементов текста выделяются цветом и подчеркиванием; мышиный курсор на ссылке меняет свою форму и превращается в указующий перст; для перехода по ссылке необходимо щелкнуть по ней мышкой; для возврата из ссылки необходимо использовать навигационную кнопку браузера " Назад " (" Back "). Если ссылки образуют вложенную цепочку, то кнопки " Назад " (" Back ") и " Вперед "(" Forward ") можно использовать для движения по пройденному ссылочному пути в обе стороны. Они работают как традиционные операции "откатка" и "накатка" в большинстве прикладных программ. В нижеприведенном примере используется цепочка вложенных ссылок. Совершите небольшое путешествие. Сначала, щелкая ссылки, доберитесь до текста, в котором ссылок уже нет. Затем, пользуясь навигационными кнопками браузера, "прогуляйтесь" по пройденному пути вперед и назад. Ссылки могут уводить не только в разные документы, но загружать на экран разные фрагменты одного и того же текста. В последнем случае навигационные средства браузера работают также. Существуют правила для определения размеров элементов. Размер, заданный обычным числом, выражается в пикселях. Например, задаётся длина горизонтальной линии в 100 пикселов: <HR width = 100> Горизонтальный размер может быть задан в процентном отношении к ширине окна браузера: <HR width = 50%> Если размер окна будет изменён, то изменится и длина горизонтальной линии. Символ * может использоваться для разделения пространства страницы в определённых пропорциях. Два способа определения фреймов (атрибут cols создаёт фреймы с вертикальным делением), причём левый фрейм в данном случае всегда будет в три раза уже, чем правый. <FRAMESET cols = ” 25%, 75% “> <FRAMESET cols = “1*, 3* “> Управление цветом Кодирование цвета используется для раскрашивания шрифтов, горизонтальных линий и фона, других элементов страницы. Цвета обозначаются английскими названиями или числовыми шестнадцатеричными кодами. Существует несколько атрибутов, значениями которых являются параметры цвета. Самый простой способ определить цвет - написать название цвета на английском языке. Так, например, задаётся красный цвет шрифта в элементе FONT: Color = “red” Допустимые названия цветов:
Но в общем случае цвет определяется RGB - кодом. Любой цвет в этом случае представляется как комбинация красного (R), зелёного (G), синего (B) цветов, взятых в определённых пропорциях. Доля каждой цветовой составляющей определяется интенсивностью цвета и выражается двуразрядным шестнадцатеричным числом. В десятичном исчислении эти числа соответствуют диапазону от 0 до 255. В Windows-95 это соответствует цветовому режиму монитора True Color (24-разрядное двоичное кодирование цвета).
Графика   Что вызывает тренды на фондовых и товарных рынках Объяснение теории грузового поезда Первые 17 лет моих рыночных исследований сводились к попыткам вычислить, когда этот...  Живите по правилу: МАЛО ЛИ ЧТО НА СВЕТЕ СУЩЕСТВУЕТ? Я неслучайно подчеркиваю, что место в голове ограничено, а информации вокруг много, и что ваше право...  Что делает отдел по эксплуатации и сопровождению ИС? Отвечает за сохранность данных (расписания копирования, копирование и пр.)...  Конфликты в семейной жизни. Как это изменить? Редкий брак и взаимоотношения существуют без конфликтов и напряженности. Через это проходят все... Не нашли то, что искали? Воспользуйтесь поиском гугл на сайте:
|