Футбольный клуб "Арсенал"
Разработка сайта, который предоставит клиентам возможность подробней ознакомиться с футбольным клубом "Арсенал". Основные этапы создания сайта, его архитектура, особенности навигации. Внешний вид главной страницы. Реализация маркетингового инструментария.
| Рубрика | Программирование, компьютеры и кибернетика |
| Вид | курсовая работа |
| Язык | русский |
| Дата добавления | 26.02.2015 |
| Размер файла | 2,7 M |
Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже
Студенты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.
Размещено на http://www.allbest.ru/
Курсовая работа
"Футбольный клуб "Арсенал"
Содержание
- Введение
- Постановка задачи
- 1.1 Разработка архитектуры
- 1.2 Разработка навигации по сайту
- 2. Реализация поставленной задачи
- 2.1 Разработка интерфейса
- 3. Некоторые предложения и дополнения для решения вопроса
- Заключение
- Список используемой литературы
- Приложение
Введение
Сайт - совокупность электронных документов (файлов) частного лица или организации в компьютерной сети, объединённых под одним адресом.
Все сайты в совокупности составляют Всемирную паутину, где коммуникация (паутина) объединяет сегменты информации мирового сообщества в единое целое - базу данных и коммуникации планетарного масштаба. Для прямого доступа клиентов к сайтам на серверах был специально разработан протокол HTTP.
Страницы сайтов - это набор текстовых файлов, размеченных на языке HTML. Эти файлы, будучи загруженными посетителем на его компьютер, понимаются и обрабатываются браузером и выводятся на средство отображения пользователя (монитор, экран КПК, принтер или синтезатор речи). Язык HTML позволяет форматировать текст, различать в нём функциональные элементы, создавать гипертекстовые ссылки (гиперссылки) и вставлять в отображаемую страницу изображения, звукозаписи и другие мультимедийные элементы. Отображение страницы можно изменить добавлением стилей на языке CSS, что позволяет централизовать в определенном файле все элементы форматирования (размер и цвет заглавных букв 2-го уровня, размер и вид блока вставки и другое) или сценариев на языке JavaScript, с помощью которого имеется возможность просматривать страницы с событиями или действиями. Страницы сайтов могут быть простым статичным набором файлов или создаваться специальной компьютерной программой на сервере. Она может быть либо сделана на заказ для отдельного сайта, либо быть готовым продуктом, рассчитанным на некоторый класс сайтов. Некоторые из них могут обеспечить владельцу сайта возможность гибкой настройки структурирования и вывода информации на веб-сайте. Такие управляющие программы называются системами управления содержимым (CMS).
Постановка задачи
Во всех случаях процессу непосредственной разработки любого сайта предшествует выработка четкой мотивации, осознание необходимости существования интернет-ресурса. В определенное время человек начинает понимать, что наличие сайта становится необходимостью то ли для реализации какой-нибудь бизнес идеи, то ли для поиска и сплочения вокруг себя единомышленников в сфере определенного интереса, увлечения. Осознав проблему, человек начинает заниматься поиском путей ее реализации. Очень важно, чтоб на этом этапе уже были сформированы конкретные задачи и цели намеченного проекта. Когда уже намечены конкретные цели, следует приступать к формированию задач, создать план конкретных действий, направленных на достижение поставленных целей.
Главное внимание следует обратить на:
1) разработку уникального, соответствующего целям проекта дизайна;
2) удобную навигацию, доступный поиск информации на сайте;
3) разработку дополнительных привлекательных и полезных пользователю сервисов;
4) реализацию маркетингового инструментария (наличие функций обратной связи, организация опросов, анкетирования, тестирования).
Этапы создания сайта:
1) создание эскиза;
2) разработка дизайна;
3) создание шаблона;
4) сбор информации, которая будет представлена на сайте;
5) заполнение шаблона;
6) оптимизация и доработка сайта.
1.1 Разработка архитектуры
Для полноценной работы пользователей на сайте должна присутствовать простая и удобная система управления. Основное внимание уделяется дизайну сайта, информации, и её представлению в простой для понимания форме. Курсовая работа была выполнена на основе HTML 5, с применением блочной верстки CSS 3. Это один из самых распространённых способов создания сайтов.
В своей курсовой работе я разработаю сайт, который предоставит клиентам возможность подробней ознакомиться с футбольным клубом Арсенал.
Для реализации сайта я буду использовать язык программирования HTML, с использованием таблиц каскадных стилей CSS, а также элементы JavaScript. Использование CSS позволяет быстро и без необходимости проведения объемной работы изменять или корректировать сайт.
В работе я постараюсь максимально полно описать требуемую информацию по выбранной тематике и сделать навигацию по сайту максимально быстрой и удобной. Как уже говорилось выше, уже создано множество аналогичных сайтов, но все они в большинстве своем используют одинаковые шаблоны и стиль
1.2 Разработка навигации по сайту
Главное меню сайта расположено в верхней части и имеет ссылки для перехода на страницы "Главная", "Видео", "История клуба", "Состав", "Новости", и "Турнирная таблица". На главной странице сайта представлены последние добавленные новости.
футбольный клуб сайт навигация
2. Реализация поставленной задачи
При реализации поставленной задачи будет использован специальный язык программирования HTML (Hyper Text Markup Language) для создания WEB-страниц. При оформлении WEB-страниц будет использован язык CSS (Cascading Style Sheets - Таблицы Каскадных Стилей), содержащий набор свойств для описания внешнего вида любых HTML документов. С его помощью можно наиболее функционально использовать обычный набор HTML тегов, и JavaScript, который обычно используется как встраиваемый язык для программного доступа к объектам приложений. Наиболее широкое применение находит в браузерах, как язык сценариев, для придания интерактивности веб-страницам.
Главное меню имеет разделы:
· Главная
· Видео
· История клуба
· Состав
· Новости
· Турнирная таблица
В разделе "Главная" представлены последние добавленные новости, список бомбардиров, а также мини галерея.
В разделе "Видео" вы можете посмотреть обзоры прошедших матчей Арсенала.
Раздел "История клуба" содержит информацию важнейших периодов Арсенала.
В разделе "Состав" содержится полный список игроков Арсенала 2013 года.
В разделе "Новости" вы можете узнать последние новости о команде, ее предстоящих и прошедших играх, а также знать многое новое о футбольной жизни.
В разделе "Турнирная таблица" представлена таблица английской премьер лиги.
2.1 Разработка интерфейса
На Рисунке 1 мы видим главное меню сайта.
Рисунок 1 - Внешний вид главной страницы
Вся информация в главном окне представлена в пределах блока div:
<div id="header">
<div class="shell">
<h1 id="logo" class="notext"><a href="Главная.html">Арсенал Лондон</a></h1>
</div>
</div>
<div id="navigation">
<div class="shell">
<div class="cl"> </div>
<ul>
<li><a href="Главная.html">Главная</a></li>
<li><a href="Видео.html">Видео</a></li>
<li><a href="История.html">История клуба</a></li>
<li><a href="Состав.html">Состав</a></li>
<li><a href="Новости.html">Новости</a></li>
<li><a href="таблица.html">Турнирная таблица</a></li>
</ul>
<div class="cl"> </div>
</div>
</div>
<div id="heading">
<div class="shell">
<div id="heading-cnt">
<div id="side-nav">
<ul>
<li><div class="link"><a href="Архив2012-2013.html">Архив 2012/2013</a></div></li>
<li><div class="link"><a href="Архив2011-2012.html">Архив 2011/2012</a></div></li>
<li><div class="link"><a href="Архив2010-2011.html">Архив 2010/2011</a></div></li>
<li><div class="link"><a href="Архив2009-2010.html">Архив 2009/2010</a></div></li>
</ul>
</div>
На остальных страницах главное меню представлено в таких же блоках.
Данные информационные блоки могут содержать большое количество текстовой и графической информации. На каждой странице фон содержит темно серые тона (Рисунок 2).
Рисунок 2 - Фон
Как мы видим сам фон имеет средний размер. Он задаётся этим кодом:
body {
font-size: 12px;
font-family: Arial, sans-serif;
color: #fff;
background: #171717;
height: 100%;
text-align: left;
}
Этот код приведен из таблицы CSS.
Главная страница сильно не отличается от всех остальных, так же на ней имеются элемент JavaScript.
Изображено главное меню сайта. (Рисунок 3).
Рисунок 3 - Главное меню сайта
В данном курсовом проекте использовалась реализация технологии JavaScript-сценариев.
<slider> - скрипт, который отвечает за функционирование слайдера на всех страницах сайта. Его задачей является смена изображения. (Рисунок 4).
Рисунок 4 - слайдер
На странице "Состав" расположен список игроков Арсенала 2013г., а так же их статистика. (Рисунок 5).
Рисунок 5 - Состав
На страницах "Архивы" расположены таблицы предыдущих сезонов английской премьер лиги. (Рисунок 6).
Рисунок 6 - Архивы
3. Некоторые предложения и дополнения для решения вопроса
Для создания полноценных многофункциональных сайтов необходимо обладать теоретическими и практическими знаниями в HTML, CSS, JavaScript, PHP, MySQL. В настоящее время для создания сайта существуют специальные приложения: FrontPage, Adobe Dreamviewer и прочие. Они позволяют создавать основу сайта, а также заполнять его какой-либо информацией. К сожалению, многие созданные и ныне функционирующие сайты громоздки и не оптимизированы.
Есть различные способы оптимизации работоспособности и скорости работы сайта:
1. Оптимизация изображений:
1) используйте сжатие "с потерями";
2) используйте сжатие "без потерь" (. gif,. png) для логотипов, частей дизайна сайта или изображений с малым количеством цветов;
3) используйте изображения в настоящем размере, не используйте HTML для изменения их размера;
4) уменьшайте качество всех изображений, внешний вид которых это позволяет.
2. Используйте хороший "хостинг":
1) отдельный "хостинг" для изображений;
2) размещать большие файлы на отдельном сервере;
3) размещать базы данных на отдельном сервере.
3. Улучшайте Ваш код:
1) убедитесь в том, что Ваш HTML код чист на сколько это возможно;
2) используйте CSS для стилизации страниц, а не HTML. Также используйте теги div, а не таблицы;
3) не делайте лишних обращений к базе данных.
Статический код столь же важен:
1) обязательно храните Ваш CSS и JavaScript в отдельных файлах, а не прямо на страничках;
2) разбейте Ваши CSS на несколько файлов и загружайте только те, которые Вам необходимы для конкретной страницы;
3) разбейте Ваши JavaScript файлы точно так же. Не загружайте js-файлы, код в которых не собираетесь использовать.
Убедитесь в том, что Ваш код проходит W3C-валидацию. Это очень помогает ускорить работу сайта и с SEO.
4. Минимизируйте всё. Это небольшое улучшение в некоторых ситуациях может очень помочь. Чтобы "минимизировать" файл, нужно удалить все пробелы и сгруппировать всё в одну строку. Вы можете уменьшить HTML, CSS, JavaScript, PHP.
5. Избавьтесь от медленных вещей на сайте:
1) Flash - замените его частично Ajax, если возможно;
2) Внешний JavaScript: "выждете" с других сайтов - это замечательно, но если они медленные, избавьтесь от них;
3) изображения в высоком разрешении;
4) "онлайн" видео.
6. Оптимизируйте базу данных.
Если возможно, поместите базу данных на отдельном сервере. Также:
1) оптимизируйте модель данных;
2) используйте индексы;
3) оптимизируйте запросы;
4) не сохраняйте в базе данных вещи, которые не меняются. Сделайте их статическими;
7. Настройте правильно Ваш сервер.
Данными способами можно придать сайту более оптимизированный вид.
Заключение
Данный сайт ориентирован на предоставление пользователю справочной информации, что и налагает на содержание некоторые ограничения. Для поддержания популярности сайта необходимо:
· Содержание должно соответствовать тематике сайта.
· Сайт должен быть удобен в использовании.
· Сайт должен предоставлять свежую и достоверную информацию.
· Положительным качеством будет и оригинальность преподнесения информации.
В процессе выполнения я лучше ознакомился с возможностями языков HTML, JavaScript, и таблиц стилей CSS. Также могу сделать вывод, что информация на сайте была представлена живо и интересно.
Для полноценного функционирования сайта в браузере должна быть разрешена работа JavaScript. Работоспособность сайта была проверена в браузере Google Chrome. В качестве редактора при создании сайта использовал программу Microsoft Visual Studio 10.
Список используемой литературы
1. Мержевич В. "Самоучитель HTML и XHTML", 2011г.
2. Фримен Эрик, Фримен Элизабет "Изучаем HTML, XHTML и CSS", (2012).
3. Флэнаган Д. "JavaScript. Подробное руководство", 2009 г.
4. Мархвида И.В. "Создание Web-страниц.html. CSS. JavaScript" 2008 г
5. http://htmlbook.ru/html5
6. http://ramech.net/docs/css3
7. http://javascript.ru/manual
Приложение
Главная страница - Главная.html
<! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional. dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Фан сайт Лондонского Арсенала</title>
<link rel="stylesheet" href="css/style. css" type="text/css" media="all" />
<script src="https: // ajax. googleapis.com/ajax/libs/jquery/1.6.1/jquery. min. js"></script>
<script src="js/slides. js"></script>
<script>
/*
Get the curent slide
*/
function currentSlide (current) {
$ (". current_slide"). text (current + " of " + $ ("#slides"). slides ("status", "total"));
}
$ (function () {
/*
Initialize SlidesJS
*/
$ ("#slides"). slides ({
navigateEnd: function (current) {
currentSlide (current);
},
loaded: function () {
currentSlide (1);
}
});
/*
Play/stop button
*/
$ (". controls"). click (function (e) {
e. preventDefault ();
// Example status method usage
var slidesStatus = $ ("#slides"). slides ("status", "state");
if (! slidesStatus || slidesStatus === "stopped") {
// Example play method usage
$ ("#slides"). slides ("play");
// Change text
$ (this). text ("Stop");
} else {
// Example stop method usage
$ ("#slides"). slides ("stop");
// Change text
$ (this). text ("Play");
}
});
});
</script>
</head>
<body>
<div id="header">
<div class="shell">
<h1 id="logo" class="notext"><a href="#">Арсенал Лондон</a></h1>
</div>
</div>
<div id="navigation">
<div class="shell">
<div class="cl"> </div>
<ul>
<li><a href="Главная.html">Главная</a></li>
<li><a href="Видео.html">Видео</a></li>
<li><a href="История.html">История клуба</a></li>
<li><a href="Состав.html">Состав</a></li>
<li><a href="Новости.html">Новости</a></li>
<li><a href="таблица.html">Турнирная таблица</a></li>
</ul>
<div class="cl"> </div>
</div>
</div>
<div id="heading">
<div class="shell">
<div id="heading-cnt">
<div id="side-nav">
<ul>
<li><div class="link"><a href="Архив2012-2013.html">Архив 2012/2013</a></div></li>
<li><div class="link"><a href="Архив2011-2012.html">Архив 2011/2012</a></div></li>
<li><div class="link"><a href="Архив2010-2011.html">Архив 2010/2011</a></div></li>
<li><div class="link"><a href="Архив2009-2010.html">Архив 2009/2010</a></div></li>
</ul>
</div>
<div id="heading-box">
<div id="heading-box-cnt">
<div class="cl"> </div>
<div id="container">
<! - start SlidesJS slideshow - ->
<div id="slides">
<img src=" css\images\image_10742. jpg" width="713" height="321" alt="Slide 1">
<img src=" css\images\957027-15720218-640-360. jpg" width="713" height="321" alt="Slide 2">
<img src=" css\images\262152-2480x1384. jpg" width="713" height="321" alt="Slide 3">
<img src=" css\images\3b9ce5f74043. jpg" width="713" height="321" alt="Slide 4">
<img src=" css\images\1367763732_03. jpg" width="713" height="321" alt="Slide 5">
<img src=" css\images\images. jpg" width="713" height="321" alt="Slide 6">
<img src=" css\images\the_gunners. jpg" width="713" height="321" alt="Slide 7">
</div>
<! - end SlidesJS slideshow - ->
<! - Example play/stop controls - ->
<a href="#" class="controls">Play</a>
<! - Example slide count - ->
<p class="current_slide"></p>
</div>
<div class="cl"> </div>
</div>
</div>
</div>
</div>
</div>
<div id="main">
<div class="shell">
<div class="cl"> </div>
<div id="sidebar">
<h3>Бомбардиры</h3>
<ul>
<li>
<p>Арон Рэмзи</p>
<small class="date">9 голов</small>
</li>
<li>
<p>Оливье Жиру</p>
<small class="date">6 голов</small>
</li>
<li>
<p>Месут Озил</p>
<small class="date">3 гола</small>
</li>
<li>
<p>Лукас Подольски</p>
<small class="date">2 гола</small>
</li>
<li>
<p>Джек Уилшер</p>
<small class="date">2 гола</small>
</li>
</ul>
</div>
<div id="content">
<div class="cl"> </div>
<div class="grey-box">
<h3><a href="Новость15.html">Новость15</a></h3>
<a href=" Новость15.html"><img src=" Новости\images\zp_playerprofile_oxladechamberlain_9837. jpg" width="205" height="101" alt="Slide 1" /></a>
<p>
<span>Окслейд-Чемберлен: "Большие команды создают большую атмосферу" </span>
<a href="Новость15.html" class="button">Подробнее</a>
</p>
</div>
<div class="grey-box">
<h3><a href=" Новость14.html">Новость14</a></h3>
<a href=" Новость14.html"><img src=" Новости\images\35538196. jpg" width="205" height="101" alt="Slide 1" /></a>
<p>
<span>Игроки Баварии о жребии ЛЧ </span>
<a href=" Новость14.html" class="button">Подробнее</a>
</p>
</div>
<div class="grey-box last">
<h3><a href=" Новость13.html">Новость13</a></h3>
<a href=" Новость13.html"><img src="Новости\images\Bacary-Sagna-Arsenal-Football. jpg " width="205" height="101" alt="Slide 1" /></a>
<p>
<span>Бакари Санья: "Если от нас не уходили бы игроки, все было бы по другому" </span>
<a href=" Новость13.html" class="button">Подробнее</a>
</p>
</div>
<div class="grey-box">
<h3><a href="Новость12.html">Новость12</a></h3>
<a href=" Новость12.html"><img src="Новости\images\images (1). jpg" width="205" height="101" alt="Slide 1" /></a>
<p>
<span>В 1/8 ЛЧ Арсенал сыграет с Баварией</span>
<a href="Новость12.html" class="button">Подробнее</a>
</p>
</div>
<div class="grey-box">
<h3><a href=" Новость11.html">Новость11</a></h3>
<a href=" Новость11.html"><img src="Новости\images\travma-Koscielny2. jpg" width="205" height="101" alt="Slide 1" /></a>
<p>
<span>Лоран Косьелини пропустит остаток года из-за травмы колена</span>
<a href=" Новость11.html" class="button">Подробнее</a>
</p>
</div>
<div class="grey-box last">
<h3><a href=" Новость10.html">Новость10</a></h3>
<a href=" Новость10.html"><img src="Новости\images\1075683. jpg " width="205" height="101" alt="Slide 1" /></a>
<p>
<span>Месут Озил извинился перед болельщиками </span>
<a href=" Новость10.html" class="button">Подробнее</a>
</p>
</div>
<div class="cl"> </div>
</div>
<div class="cl"> </div>
</div>
</div>
<div id="footer">
<div class="shell">
<div class="cl"> </div>
<p class="right">© Официальный сайт арсенала <a href="http://www.arsenal.com">www.arsenal.com</a></p>
<div class="cl"> </div>
</div>
</div>
</body>
</html>
CSS - style. css
* { padding: 0; margin: 0; outline: 0; }
body {
font-size: 12px;
font-family: Arial, sans-serif;
color: #fff;
background: #171717;
height: 100%;
text-align: left;
}
#container {
width: 713px;
margin: auto;
position: relative;
}
#slides {
position: relative;
}
#slides. slidesContainer
{
width: 713px;
border: 8px solid #fff;
margin-left: - 8px;
box-shadow: 0 2.5px 5px rgba (0,0,0,.1);
}
/*
Next/prev buttons
*/
#slides. slidesNext,#slides. slidesPrevious {
position: absolute;
top: 134px;
left: - 40px;
width: 24px;
height: 0;
padding-top: 32px;
display: block;
z-index: 101;
overflow: hidden;
background: url (. /img/navigation-previous. png) no-repeat 0 0;
}
#slides. slidesNext {
left: 731px;
background: url (. /img/navigation-next. png) no-repeat 0 0;
}
/*
Pagination
*/
. slidesPagination {
margin: 10px 0 0;
float: right;
}
. slidesPagination li {
float: left;
margin: 0 1px;
list-style: none;
}
. slidesPagination li a {
display: block;
width: 14px;
height: 0;
padding-top: 14px;
background-image: url (. /img/pagination. png);
background-position: 0 0;
overflow: hidden;
}
. slidesPagination li. slidesCurrent a {
background-position: 0 - 14px;
}
. current_slide {
font: bold 10px/1.33 sans-serif;
float: left;
margin-top: 12px;
}
. controls {
display: block;
margin-top: 12px;
float: left;
color: #fff;
font: bold 10px/1.33 sans-serif;
margin-right: 10px;
}
. cl { font-size: 0; line-height: 0; height: 0; clear: both; }
a img { border: 0; }
a { color: #fff; text-decoration: none; }
a: hover { text-decoration: underline; cursor: pointer; }
. left { float: left; display: inline; }
. right { float: right; display: inline; }
. notext {font-size: 0; line-height: 0; text-indent: - 4000px; }
p {margin-top: 10px; }
. center {display: block; margin: 0 auto; }
. shell {margin: 0 auto; width: 930px; }
#header {background: #000; }
#header. shell {width: 1018px; background: url (images/header. jpg) no-repeat 10px 0; height: 84px; }
h1#logo {padding-left: 340px; float: left; padding-top: 8px; }
h1#logo a {display: block; background: url (images/2. png) no-repeat 0 0; width: 322px; height: 73px; }
#navigation {background: url (images/nav. gif) repeat-x 0 0; height: 50px; }
#navigation ul {float: right; list-style-type: none; }
#navigation ul li {background: url (images/nav-divider. gif) no-repeat right 0; float: left; display: inline; padding-left: 23px; padding-right: 29px; }
#navigation ul li a {color: #676767; font-family: tahoma, sans-serif; font-size: 13px; text-transform: uppercase; padding-top: 16px; display: block; height: 34px; float: left; }
#heading {height: 369px; background: url (images/heading. jpg) repeat-x 0 0; }
#heading. shell {width: 983px; position: relative; }
#heading-cnt {background: url (images/heading-cnt. png) no-repeat 0 0; width: 983px; height: 161px; }
#side-nav ul {list-style-type: none; width: 205px; padding-top: 9px; padding-left: 20px; }
#side-nav ul li {float: left; display: block; width: 205px; padding-bottom: 5px; }
#side-nav ul li a {width: 195px; height: 18px; display: block; padding-left: 10px; padding-top: 4px; text-transform: uppercase; color: #636363; font-size: 11px; font-weight: bold; position: relative; }
#side-nav ul li. link {background: url (images/side-nav. png) no-repeat 0 0; width: 205px; height: 22px; }
#heading-box {position: absolute; top: 9px; left: 235px; }
#heading-box-cnt {background: url (images/heading-box. png) no-repeat 0 0; width: 709px; height: 316px; padding-top: 0px; padding-left: 4px; }
#heading-box table{background: no-repeat 0 0; width: 709px; height: 316px; padding-top: 34px; padding-left: 4px; }
#heading-box table tr. l{background: #339933; }
#heading-box-1. {background: no-repeat 0 0; width: 709px; height: 316px; padding-top: 345px; padding-left: 4px; }
#main {background: url (images/main-bg. gif) repeat-x 0 0; padding-top: 8px; padding-bottom: 45px; }
#main h2 {color: #fff; font-size: 16px; text-transform: uppercase; padding-bottom: 2px; }
#sidebar {padding-top: 14px; width: 197px; padding-right: 10px; float: left; }
#sidebar ul {list-style-type: none; padding-bottom: 7px; }
#sidebar ul li {background: url (images/news-divider. gif) repeat-x 0 bottom; padding-bottom: 5px; padding-top: 5px; }
#sidebar ul li small. date {color: #93de3c; font-size: 9px; }
a. archives {color: #909090; font-size: 11px; text-decoration: underline; display: block; }
a. archives: hover {text-decoration: none; }
#content {width: 713px; float: left; }
. grey-box {background: url (images/grey-box. gif) no-repeat 0 0; width: 209px; height: 228px; float: left; padding: 10px 26px 17px 8px; }
. last {padding-right: 10px! important; }
. grey-box h3,. grey-box h3 a {font-size: 13px; color: #303235; text-transform: uppercase; padding-bottom: 8px; }
. grey-box img {background: #fff; border: 1px solid #cfcfcf; padding: 1px; margin-bottom: 6px; }
. grey-box p {color: #1f1f1f; width: 205px; }
. grey-box p span {padding-bottom: 6px; display: block; }
a. button {background: url (images/button. png) no-repeat 0 0; float: right; width: 81px; height: 16px; display: block; color: #373737; font-size: 10px; padding-top: 3px; text-align: center; text-transform: uppercase; }
. second {padding-right: 5px! important; background: url (images/second. gif) no-repeat 0 0; width: 324px; }
a. watch-now {text-decoration: underline; text-transform: uppercase; }
a. watch-now: hover {text-decoration: none; }
#footer {padding-bottom: 50px; width: 930px; margin: 0 auto; padding-right: 12px; font-size: 10px; padding-top: 500px; }
#footer. shell {background: url (images/news-divider. gif) repeat-x 0 0; padding-top: 10px; margin: 0 auto; }
#footer a {color: #fff; margin-right: 10px; text-decoration: underline; }
#footer a: hover {text-decoration: none; }
Размещено на Allbest.ru
Подобные документы
Проектирование структуры и информационного содержания сайта. Анализ поисковой статистики и подбор синонимов. Целевая аудитория сайта. Реализация каркаса сайта. Разработка навигации и дизайна сайта с использованием css. Реализация интерактивности.
курсовая работа [10,7 M], добавлен 01.09.2016Преимущества языка PHP и структура базы данных. Схема алгоритма и внешний вид главной страницы и страниц сайта, страницы с независимым рейтингом. Анализ типичных ошибок в программах. Расчёт себестоимости и трудоёмкости решаемой задачи, листинг программы.
дипломная работа [4,1 M], добавлен 22.07.2015Актуальность создания фирменного web-сайта. Разработка, внедрение web-сайта под названием "Удачная постройка". Анализ существующих программных решений, выбор инструментальных средств разработки. Архитектура сайта, структура данных. Тестирование и отладка.
дипломная работа [4,7 M], добавлен 19.01.2017Установка программной оболочки Denver и системы управления контентом "Joomla". Составление технического задания и схемы главной страницы. Разработка дизайна и системы навигации Web-сайта, запуск в Internet. Проектирование услуги регистрации пользователей.
курсовая работа [2,3 M], добавлен 03.10.2012Правила создания Web-сайта по вопросам медицинского страхования: разработка главной страницы (фреймовая структура), разделов, посвященных вопросам обязательного и добровольного страхования, активной asp-страницы, содержащей опрос для посетителей.
курсовая работа [2,3 M], добавлен 20.06.2010Рассмотрение основных этапов создания сайта. Использование вайрфреймов как документации по проекту. Использование мокапа и структура навигации сайта. Правильный выбор цветов для проекта. Использование модульной сетки и разработка дизайна сайта.
презентация [2,8 M], добавлен 01.09.2019Формулировка требований к разработке и оформлению информационного сайта предприятия. Описание архитектуры сайта, меню навигации и алгоритма работы, листинг программного кода. Выбор серверной части и процесс отладки. Методы продвижения сайта в Интернете.
курсовая работа [4,6 M], добавлен 18.01.2014Рассмотрение понятий и программного инструментария, применяемых для разработки и создания Web-сайтов. Методы и способы представления на Web-страницах различных видов информации. Создание структуры файлов проекта, главной страницы и страниц номеров отеля.
курсовая работа [3,5 M], добавлен 13.11.2022Понятие сайта и их классификация - корпоративные, презентационные, тематические, интернет-магазины. Язык гипертекстовой разметки HTML и его средства разработки. Виртуальный web-сервер Denver и MySQL базы. Этапы разработки сайта и структура навигации.
дипломная работа [2,4 M], добавлен 13.01.2015Изучение структуры шаблона для создания сайта для НБУ "Юг-Сервис", который будет иметь возможность совместного наполнения информацией в режиме реального времени. Сравнение CMS Drupal, Joomla и WordPress. Наполнение сайта и его размещение на хостинге.
дипломная работа [7,3 M], добавлен 25.04.2015
