Создание сайта "Космопарк"

Возможности языка HTML для создания Web-страниц, HTML-редакторы, используемые в Web-дизайне. Полный список тегов HTML использованных на сайте. Коды главной страницы, страниц "Фильмы", "Праздники" "Правила". Способы создания и форматирования Web-страниц.

Рубрика Программирование, компьютеры и кибернетика
Вид отчет по практике
Язык русский
Дата добавления 11.09.2019
Размер файла 1,5 M

Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже

Студенты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.

Размещено на http://www.allbest.ru/

Размещено на http://www.allbest.ru/

Кыргызский государственный университет строительства, транспорта и архитектуры им. Н. Исанова

Отчет по практике

Студент: Кетжетаева Табихат Оролбековна

Преподаватель: Абдрасакова А.Б.

Содержание

Введение

Полный список тегов HTML использованных на сайте

Код главной страницы

Код страницы “Фильмы"

Код страницы “Праздники"

Код страницы “Правила"

Заключение

Список использованных источников

Введение

Сайты позволяют хранить, передавать, продавать различные типы информации не отходя от экрана компьютера. А главное, сайты позволяют подать эту информацию в ярком, красочном виде, снабдить её графикой, звуком, анимацией, видеороликами, ссылками и при правильном с планировании работы, продемонстрировать эту информацию тысячам других пользователей интернета.

HTML является основой моды в Интернете.

HTML давно перестал быть просто языком программирования. Человек, изучавший этот язык, обретает возможность делать сложные вещи простыми способами и, главное, быстро, что в компьютерном мире не так уж и мало. Гипертекст подходит для включения элементов мультимедиа в традиционные документы. Практически именно благодаря развитию гипертекста, большинство пользователей получило возможность создавать собственные мультимедийные продукты и распространять их на компакт-дисках. Такие информационные системы, выполненные в виде набора HTML-страниц, не требует разработки специальных программных средств, так как все необходимые инструменты для работы с данными (WEB-браузеры) стали частью стандартного программного обеспечения большинства персональных компьютеров. От пользователя требуется выполнить только ту работу, которая относится к тематике разрабатываемого продукта: подготовить тексты, нарисовать рисунки, создать HTML-страницы и продумать связь между ними. HTML, как основа создания WEB-страниц, имеет прямое отношение и к новому направлению изобразительного искусства - WEB-дизайн. Художнику в Интернете недостаточно просто нарисовать красивые картинки, оригинальный логотип, создать новый фирменный стиль. Он должен еще поместить все это в Сети, продумать связь между WEB-страницами, чтобы все двигалось, откликалась на действие пользователя, поражало воображение, вызывало желание создать что-нибудь свое, оригинальное в этой области.

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

web страница сайт дизайн

Полный список HTML-элементов

Тег

Описание

<!--...-->

Используется для добавления комментариев.

<a>

Создаёт гипертекстовые ссылки.

<body>

Представляет тело документа (содержимое, не относящееся к метаданным документа).

<br>

Перенос текста на новую строку.

<h1-h6>

Создают заголовки шести уровней для связанных с ними разделов.

<head>

Элемент-контейнер для метаданных HTML-документа, таких как<title>,<meta>, <script>, <link>,<style>.

<hr>

Горизонтальная линия для тематического разделения параграфов.

<html>

Корневой элемент HTML-документа. Сообщает браузеру, что это HTML-документ. Является контейнером для всех остальных html-элементов.

<img>

Встраивает изображения в HTML-документ с помощью атрибута src, значением которого является адрес встраиваемого изображения.

<li>

Элемент маркированного или нумерованного списка.

<p>

Параграфы в тексте.

<table>

Тег для создания таблицы.

<td>

Создает ячейку таблицы.

<th>

Создает заголовок ячейки таблицы.

<title>

Заголовок HTML-документа, отображаемый в верхней части строки заголовка браузера. Также может отображаться в результатах поиска, поэтому это следует принимать во внимание предоставление названия.

<tr>

Создает строку таблицы.

Код главной страницы

<!DOCTYPE html>

<HTML>

<HEAD>

<TITLE>МОЙ САЙТ</TITLE>

<style>

body{ background-image: url(PRI.jpg);

background-size: cover; }

.mainmenubtn {

background-color:red;

color: white;

border:none;

cursor:pointer;

padding:20px;

martin-top:20px;}

.mainmenubtn:hover {

background-color:red;}

.dropdown {

pasition:relative;

display: inline-block;}

.dropdown-child {

display:none;

background-color:black;

min-width:200px;}

.dropdown-child a {

color: white;

padding:20px;

text-decoration:none;

display:block;}

.dropdown:hover.dropdown-child {

display:block;}

</style>

<body BGCOLOR="#358943">

</HEAD>

<BODY>

<div class="dropdown">

<button

class="mainmenubtn">Главное меню</button>

<div class="dropdown-child">

<a href="nov.html">ПОСЛЕДНИЕ НОВОСТИ</a></p>

<a href="film.html">ФИЛЬМЫ</a></p>

<a href="nor.html">ПРАЗДНИКИ</a></p>

<a href="pra.html">ПРАВИЛА</a></p>

<a href="pol.html">ПОЛНАЯ ВЕРСИЯ</a></p>

</div>

</div>

</BODY>

</HTML>

Код страницы «Фильмы»

<html>

<head>

<title>filmy</title>

</head>

<body>

<h1>КосмоПарк</h1>

<h2>ул. Юнусалиева, 40а, 7 мкр/ул. Донецкая</h2>

<h2>Репертуар сеансов на:

<style>

body{

background-image: url(6.jpg);

background-size: cover;

}

.mainmenubtn {

background-color:red;

color: white;

border:none;

cursor:pointer;

padding:20px;

martin-top:20px;

}

.mainmenubtn:hover {

background-color:red;

}

.dropdown {

pasition:relative;

display: inline-block;

}

.dropdown-child {

display:none;

background-color:black;

min-width:200px;

}

.dropdown-child a {

color: white;

padding:20px;

text-decoration:none;

display:block;

}

.dropdown:hover.dropdown-child {

display:block;

}

</style>

<body BGCOLOR="#358943">

</HEAD>

<BODY>

<div class="dropdown">

<button

class="mainmenubtn"><h2>Сегодня</h2></button>

<div class="dropdown-child">

<a href="nov.html">Завтра</a></p>

</div>

</div>

</h2>

<table border="2">

<tr>

<th><h2>ФИЛЬМЫ</h2></th>

<th><h1>Разлом</h2></th>

<th><h2>Бегущий в лабиринт</h2></th>

<th><h2>Пираты карибского моря</h2></th>

<th><h2>Рассвет</h2></th>

<th><h2>Защитники</h2></th>

<th><h2>Алита - боевой ангел</h2></th>

<th><h2>Человек паук</h2></th>

<tr>

<th></th>

<th><img src="13.jpg" width="150" height="250"></th>

<th><img src="17.jpg" width="150" height="250"></th>

<th><img src="11.jpg" width="150" height="250"></th>

<th><img src="12.jpg" width="150" height="250"></th>

<th><img src="15.jpg" width="150" height="250"></th>

<th><img src="16.jpg" width="150" height="250"></th>

<th><img src="14.jpg" width="150" height="250"></th>

<tr>

<th><h2>ЦЕНА:</h2></th>

<th><h2>200/180 сом</h2></th>

<th><h2>330/310 сом</h2></th>

<th><h2>300/280 сом</h2></th>

<th><h2>250/230 сом</h2></th>

<th><h2>190/170 coм</h2></th>

<th><h2>350/330 сом</h2></th>

<th><h2>220/200 сом</h2></th>

<tr>

<th><h2>ВРЕМЯ:</h2></th>

<th><h2>12:30</h2></th>

<th><h2>15:20</h2></th>

<th><h2>11:25</h2></th>

<th><h2>22:00</h2></th>

<th><h2>16:40</h2></th>

<th><h2>15:00</h2></th>

<th><h2>19:50</h2></th>

<tr>

<th><h2>ЗАЛ:</h2></th>

<th><h2>ЗАЛ 1</h2></th>

<th><h2>ЗАЛ 3</h2></th>

<th><h2>ЗАЛ 2</h2></th>

<th><h2>ЗАЛ 3</h2></th>

<th><h2>ЗАЛ 1</h2></th>

<th><h2>ЗАЛ 2</h2></th>

<th><h2>ЗАЛ 3</h2></th>

</tr>

<th></th>

</table>

<a href="MOYA.html">НАЗАД</a></p>

</body>

</html>

Код страницы «Праздники»

<!DOCTYPE html>

<HTML>

<HEAD>

<style>

body{

background-image: url(6.jpg);

background-size: cover: }

</style>

<H1>НООРУЗ - ГЛАВНЫЙ ПРАЗДНИК ВЕСНЫ.</H1>

</HEAD>

<P><IMG SRC="NORUZ.jpg" AL="RU" CLASS="ZOOM"></A></P>

<H1>НООРУЗ</H1>

<p>Нооруз (или Новруз) празднуется 21 марта, в день весеннего равноденствия, и знаменует собой начало нового года. Изначально Нооруз был языческим праздником зороастрийцев, которые считали день весеннего равноденствия священным. Сейчас он отмечается в таких странах, как Азербайджан, Албания, Афганистан, Босния и Герцеговина, Грузия, Индия, Иран, Казахстан, Киргизия, Китай (СУАР и др. районы), Монголия, Пакистан, Российская Федерация (Башкортостан, Дагестан, Татарстан и другие регионы), Таджикистан, Туркменистан, Турция, Узбекистан и др.</p>

<P><IMG SRC="2.jpg" WIDTH="850" HEIGHT="500"></P>

<P>День Нооруз начинается со звуков карная - духового инструмента, представляющего собой длинную трубу. На стол, накрытый нарядной белой скатертью, выставляются национальные блюда, а обязательным атрибутом торжественной трапезы является сумолок. Сумолок готовят из проросших зёрен пшеницы, которые перемалываются, а затем варятся в котле на масле с добавлением муки (иногда без) в течение 20--24 часов. Туда также добавляются небольшого размера камни, это делается для того, чтобы сумолок не подгорел. Считается, что, если вы найдете в своей чашке с сумолоком один из этих камней, можно загадать желание, и оно обязательно сбудется. Сумолок готовится долго, поэтому женщины, чтобы скоротать время и наполнить атмосферу приготовления блюда положительной энергией, сопровождают весь процесс песнопениями, танцами и шутливыми, весёлыми припевками.

<P><IMG SRC="4.jpg" WIDTH="850" HEIGHT="500"></P>

<P><IMG SRC="1.jpg" WIDTH="850" HEIGHT="500"></P>

Родившихся 21 марта мальчиков принято называть Ноорузбеком или Ноорузбаем, а девочек - Ноорузгул. Если в Нооруз выпадает снег, то считается, что это к удаче. В ночь перед Ноорузом различные емкости наполняют родниковой водой, молоком и зернами, чтобы в следующем году было много дождей и хороший урожай. Принято также приводить в порядок свой дом, раздавать долги и просить прощения у тех, кого когда-то обидел. Весь праздник сопровождается фестивалями, национальными играми и танцами.</P>

<P><IMG SRC="3.jpg" WIDTH="850" HEIGHT="500"></P>

<a href="nor.html">НАЗАД</a></p>

</BODY>

</HTML>

Код страницы «Правила»

<html>

<head>

<title>Pravily</title>

<style>

body{

background-image: url(20.jpg);

background-size: cover;}

</style>

<body BGCOLOR="#358943">

</head>

<body>

<p><h3>Вот список того, чего на сайте делать не следует</h3></p>

<ul>

<li><h4>Рекламировать ресурсы в обход правил</h4>

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

Исключение составляют упоминания авторами своей должности в компании (без указания ссылки на сайт компании), своих контактных данных (включая адреса персональных аккаунтов в соцсетях), своих персональных блогов на крупных медиа-ресурсах (LJ, Medium и др.). Допускается упоминание профильных youtube-каналов, чатрумов и групп в соцсетях, не носящих названия проекта, компании, продукта, услуги, сервиса или мероприятия.</li>

<li><h4>Заниматься плагиатом</h4>

Не следует копировать на «Хабр» тексты, опубликованные другими людьми на других ресурсах, но можно копировать собственные тексты, если они не нарушают правила ресурса.</li>

<li><h4>Путать сайт с Твиттером</h4>

Односложные публикации вида «Смотрите, какую я нашел ссылку», «Chrome обновился, вот тут чейнджлог» и подобное не приветствуются. Даже если новость изначально короткая, постарайтесь сопроводить её развёрнутым комментарием.</li>

<li><h4>Пытаться собирать средства на проекты<h/4>

Здесь тоже всё просто -- для сбора средств существуют специально созданные для этого площадки.</li>

<li><h4>Оскорблять других пользователей, не следить за эмоциями</h4>

Мат, оскорбления, переходы на личности, эвфемизмы, троллинг -- хорошие способы быстро и надежно сменить текущий статус аккаунта на ReadOnly.</li>

<li><h4>Путать сайт с жалобной книгой</h4>

Если у вас проблемы с сотовым оператором, с провайдером интернета или хостинга, или с чем-то ещё, всегда можно связаться со службой поддержки нужного вам ресурса. Или с компетентными органами. Но не следует использовать «Хабр» как рупор, дабы рассказать всем о постигшей вас ситуации.</li>

</ul>

<p><h4>Список нарушений остаётся открытым, потому что всегда можно придумать что-то, не описанное выше. В таких случаях модераторы руководствуются здравым смыслом и собственным чувством прекрасного. Обсуждать их решения и создавать на эту темы агитационные публикации не стоит -- если они кого-то забанили, значит, у них была довольно веская причина.<h4></p>

<a href="MOYA.html">НАЗАД</a></p>

</body>

</html>

Заключение

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

Итак, поняв принцип построения Web-страницы, изучив возможности соединения в ней различных видов информации. Мы можем смело сказать, что Web-страницы, с их потенциалом могут применятся для различных целей.

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

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

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

Список использованных источников

1. Самоучитель HTML (Приложение).

2. HTML и CSS на примерах (Приложение).

Размещено на Allbest.ru

...

Подобные документы

  • Характеристика принципов создания html-страниц и связывания их ссылками так, чтобы можно было произвольным образом переходить от одной страницы к другой. Применение тегов форматирования текста и заголовка окна. Этапы создания html-страницы с таблицей.

    контрольная работа [16,0 K], добавлен 19.06.2014

  • Работа с HTML-редактором Adobe Dreamweaver. Этапы и правила построения заглавной страницы сайта, форматирования HTML-страниц, создания гипертекстовых ссылок, создания и форматирования таблиц. Использование графических материалов при разработке сайта.

    методичка [1,9 M], добавлен 06.07.2011

  • Основы языка программирования Web-страниц – HTML. Виды информации, которую может содержать Web-страница: текст, графика, звук, анимация и видео. Инструментарий для создания Web-страниц. Основные HTML-редакторы, которые используются для Web-дизайна.

    реферат [374,0 K], добавлен 19.01.2011

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

    лабораторная работа [1,2 M], добавлен 16.04.2014

  • HTML - это язык, принятый в World Wide Web для создания и публикации веб-страниц. Общие сведения о создании веб-страниц, особенности их оформления. PHP как язык программирования с динамической типизацией, история его создания и возможности использования.

    доклад [18,9 K], добавлен 27.12.2010

  • Язык разметки гипертекстовых страниц HTML. Обеспечение доступности Web-страницы, представление текста и графики. Основные правила и этапы создания сайта, выбор структуры страницы. Оценка экономической целесообразности использования HTML-редакторов.

    дипломная работа [86,7 K], добавлен 25.03.2013

  • Особенности программирования на языке HTML и JavaScript. Основные стили форматирования текста. Анализ основных приемов и методов создания страниц, рисунков, таблиц и гиперссылок. Основные цвета и их коды. Разработка собственного сайта и его презентация.

    курсовая работа [61,3 K], добавлен 29.01.2016

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

    курсовая работа [2,2 M], добавлен 16.04.2017

  • Изучение методики и технологий создания гипертекстовых справочных систем - электронных справочников, в которых хорошо реализована система навигации и поиска. Способы создания Web-страниц и применение языка HTML. Технология создания динамических страниц.

    презентация [144,4 K], добавлен 01.01.2011

  • Изучение тегов для создания списков и таблиц в HTML, основных атрибутов тегов. Практические навыки создания списков и таблиц в HTML-документах. Нумерованные, маркированные и вложенные списки, список определений. Выравнивание данных в ячейках таблицы.

    контрольная работа [322,1 K], добавлен 09.08.2014

  • Современные Интернет-технологии, Web-дизайн и браузеры. Язык разметки гипертекстовых страниц HTML. Представление текста и графики на Web-страницах. Правила и этапы создания сайта. Влияние дисплеев на Web-дизайн. Сравнительный анализ HTML-редакторов.

    дипломная работа [3,3 M], добавлен 21.06.2013

  • Термин HTML (HiperText Markup Language) и его реализация. Программы просмотра страниц написанных на зыке манипулирования гипертекстами. Характеристика специальных программ – браузеров: Google Chrome, Opera, Mozilla Firefox. Структура HTML-страницы.

    контрольная работа [118,8 K], добавлен 05.04.2015

  • Значение атрибута TITLE тега HTML-документа. Возможности HTML для разработчиков Web-страниц. Параметры тега , регулирующие отступы вокруг изображения. Оформление комментариев в CSS. Теги логического форматирования текста (phrase elements).

    тест [19,9 K], добавлен 11.10.2012

  • Специальные разметочные указатели (теги) языка HTML. Основные правила написания тегов. Структура HTML-файлов. Внесение изменений и способы обновления Web-сайта. Необходимые атрибуты для создания на Web-странице бегущей строки и вставки рисунков.

    презентация [439,3 K], добавлен 29.01.2014

  • Понятие интеллектуального пространства, объекты изучения в онтологии. Разработка Web-сайта на тему "Онтологии в информатике". Описание логической и физической структуры сайта, шаблон дизайна его страниц, тестирование. Исходный текст шаблона html-страницы.

    курсовая работа [4,7 M], добавлен 14.07.2012

  • Язык маркировки гипертекстов HTML, основа создания web-страниц. История спецификаций, каскадные таблицы стилей CSS. Способы определения таблиц стилей (стилевого шаблона). Язык подготовки сценариев JavaScript, его использование. Программный код web сайта.

    курсовая работа [26,9 K], добавлен 05.07.2009

  • Курс "Web-конструирование" в школе. Основы языка HTML. Изучение языка HTML в школе. Обзор программы ACDSee. Размещение информации на интернет-сайте. Обработка графики для интернет-страниц Adobe Photoshop. Обзор школьных учебников по информатике.

    курсовая работа [29,8 K], добавлен 30.06.2009

  • Создание локальной версии Web-сайта компании, оказывающей услуги в сфере "Дизайн помещений". Логическая структура сайта – набор тематических рубрик с распределенными по разделам документами. HTML–коды Web-страниц. Теоретические аспекты создания сайта.

    курсовая работа [94,0 K], добавлен 10.05.2011

  • Общая характеристика языка разметки гипертекста Hypertext Markup Language. Структура HTML-документа. Обзор основных возможностей HTML. Элементы современного дизайна Web-страниц. Анализ практического применения HTML (на примере обучающих программ).

    курсовая работа [47,9 K], добавлен 24.11.2012

  • Обоснование выбора языка программирования для создания интернет магазина. Построение виртуальных страниц. Определение затрат на создание Web-сайта. Расчет трудоемкости создания программного продукта. Использование HTML как языка разметки гипертекста.

    дипломная работа [1,2 M], добавлен 28.05.2016

Работы в архивах красиво оформлены согласно требованиям ВУЗов и содержат рисунки, диаграммы, формулы и т.д.
PPT, PPTX и PDF-файлы представлены только в архивах.
Рекомендуем скачать работу.