Сайт города Щербинка: проект и разработка

Содержание

Введение 2

1. Общая часть 5

1.1 Описание предметной области 5

1.2 Анализ существующей ситуации и обоснование необходимости разработки 6

2 Специальная часть 8

2.1 Выбор технологии, инструментальных средств разработки 8

2.2 Формирование требований к программному обеспечению 9

2.3 Разработка структуры сайта 10

2.4 Проектирование интерфейса 13

2.5 Публикация сайта 15

Заключение 18

Литература 19

Приложение А 20

Приложение Б 21

Приложение В 22

Введение

Слово «информация» происходит от латинского слова informatio, что в переводе означает сведение, разъяснение, ознакомление. Человек-существо социальное, для общения с другими людьми он должен обмениваться с ними информацией, причем обмен информацией всегда производится на определенном языке-русском, английском или на любом другом. Участники дискуссии должны владеть тем языком, на котором ведется общение, тогда информация будет понятной всем участникам обмена информацией. Информация должна быть полезной, тогда дискуссия приобретает практическую ценность. Бесполезная информация создает информационный шум, который затрудняет восприятие полезной информации. Широко известен термин «средства массовой информации» (газеты, радио, телевидение), которые доводят информацию до каждого члена общества. Такая информация должна быть достоверной и актуальной. Информация интересует конкретного человека в конкретной ситуации. Недостоверная информация вводит членов общества в заблуждение. Для того чтобы человек мог правильно ориентироваться в окружающем мире, информация должна быть полной и точной.

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

Вещательные услуги:

-книги, методическая литература, газеты, журналы в электронном виде;

-обучающие и другие имеющие отношение к педагогике компьютерные программы;

-электронные библиотеки, базы данных, информационные системы;

-обучающие и другие имеющие отношение к педагогике электронные книги, справочные файлы, словари, справочники.

Интерактивные услуги:

-электронная почта;

-электронные телеконференции;

-IRC (Internet Relay Chat).

Поисковые услуги:

-каталоги;

-поисковые системы;

-метапоисковые системы.

Все указанные услуги уже существуют и достаточно хорошо развиты в русскоязычном Интернете.

Компьютеры и информационные технологии неуклонно подталкивают человечество в сторону нового информационного мироустройства. Огромные потоки информации порождают в обществе самые неожиданные последствия. Информация настолько проникла в социально-политические и экономические процессы, что порой вызывает в людях страх перед неопределенностью настоящего и будущего. Информационная революция разрушает преграды между народами и странами, электронные магистрали, невзирая на государственные границы. Одним из удивительных инструментов, позволивших прийти к новому рубежу исторического развития, стал INTERNET (INTERnational NETwork), с которым связывают важнейший этап в информационной революции двадцатого столетия, так как именно эта всемирная компьютерная сеть объединила миллионы людей и сотни стран, именно она способствовала стиранию государственных границ, сокращению географических расстояний, ликвидировала преграды для общения в различных областях науки, культуры и образования.

1. Общая часть

1.1 Описание предметной области

Щемрбинка -- город в Московской области России. Население -- 31,7 тыс. жителей (2009).Расположен на автомагистрали Москва -- Симферополь. Железнодорожная станция Щербинка на линии Москва -- Курск. Город Щербинка расположен в 6 км к югу от Московской кольцевой автодороги вдоль Варшавского шоссе и железнодорожной магистрали "Москва - Тула". На севере граничит с районом Южное Бутово в составе Москвы, на юге -- с Подольском. Основная часть земель застроена, занята промышленной зоной, благоустроенными многоэтажными жилыми застройками. Зелеными насаждениями занято 2% городской территории. Общая площадь Щербинки -753 га. Щербинка известна с XIV века как деревня. Пристанционный посёлок с конца XIX века. В 1939 году Щербинка стала рабочим посёлком. Статус города с 1975 года. Основные предприятия: Щербинский лифтостроительный завод, заводы электроплавленных огнеупоров, металлоконструкций, художественных промыслов и сувениров, авиационного технологического оборудования, завод защитных покрытий, Научно-технический центр «Бакор». Экспериментальное кольцо ВНИИЖТ, ФГУП «Щербинская типография». Рядом с городом находится аэропорт Остафьево. Большая часть населения работает в Москве и Подольске.В городе действуют 5 детских садов, 5 средних школ, детско-юношеский центр, детско-юношеская спортивная школа, школа искусств. В октябре 1999 года открыт Московский областной филиал ВЭГУ (Восточного института экономики, гуманитарных наук, управления и права). С Москвой город связывают микроавтобусы 422, 548 ( станция метро Бульвар Дмитрия Донского), а также транзитные автобусы из Подольска 406,407,417,462,507,516,520 и из Москвы 108,249,737,737к. Так же в городе находится ж/д станция Курской железной дороги. К 2018 году планируется довести до города Бутовскую линию лёгкого метро. Ландшафт города Щербинки характеризуется равнинной, слегка всхолмленной местностью.

Восточная часть города (южная промзона, благоустроенная многоэтажная жилая застройка) привязана к наиболее возвышенным частям рельефа, западная часть города - к более низким. Перепад высот территории Щербинки не превышает 20-40м/1 км. Среднегодовое количество осадков дождя, снега составляет 710 мм, максимум осадков приходится на июль, сентябрь-октябрь, достигая величины 130-150 мм. Район размещения г. Щербинки, всей Московской области, характеризуется умеренными климатическими условиями. В соответствии с данными многолетних наблюдений, среднегодовая температура воздуха составляет +4,2C0, абсолютно максимальная +35C0, абсолютно минимальная -41С0. Геологически район г. Щербинки расположен на склоне Теплостанской эрозионной возвышенности, сложенной покровными суглинками. На покровных суглинках развиты дерново-, слабо-, среднеподзолистые почвы с толщиной плодородного слоя 20-25 см, мощностью гумусового горизонта 0-5 см. Все районы города интенсивно освоены, почвы на значительной территории нарушены (стройплощадки, промплощадки, дороги зоны отчуждения, жилые застройки). Часть земель используется для нетоварного сельскохозяйственного производства овощей, ягод, фруктов - участки частного сектора на западной части города. Щербинка зеленый, цветущий, красивый город.

1.2 Анализ существующей ситуации и обоснование необходимости разработки

Существует сайт www.scherbinka.ru, мой сайт будет отличаться дизайном, меню переходов на другие страницы и содержанием. Также вышеупомянутый сайт имеет достаточно запутанную структуру, мой сайт будет более точно разделен на разделы.

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

Причина №1. Огромная аудитория

Аудитория сети Интернет увеличивается с каждым годом, Интернет - самое быстроразвивающееся средство передачи информации за всю историю человечества.

Причина №2. Сайт, как инструмент распространения информации

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

Причина №3. Оперативность

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

Причина №4. Обратная связь

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

2 Специальная часть

2.1 Выбор технологии, инструментальных средств разработки

HTML (от англ. HyperText Markup Language -- «язык разметки гипертекста») -- стандартный язык разметки документов во Всемирной паутине. Большинство веб-страниц создаются при помощи языка HTML (или XHTML). Язык HTML интерпретируется браузером и отображается в виде документа, в удобной для человека форме. Говоря кратко, HTML был изобретён в 1990 году учёным, Тимом Бёрнсом-Ли (Tim Berners-Lee), и предназначался для облегчения обмена документами между учёными различных университетов. Проект имел больший успех, чем Tim Berners-Lee мог ожидать. Этим изобретением HTML он заложил основы современной сети Internet. HTML это язык, который позволяет представлять информацию (например, научные исследования) в Internet. То, что вы видите при просмотре страницы в Internet, это интерпретация вашим браузером HTML-текста.

Tag (Тэг)- элемент верстки языка HTML, представляющий собой комбинацию символов, заключенных в угловые скобки. Является активным элементом, изменяющим представление следующей за ним информации. Обычно имеются два тэга - открывающий и закрывающий, что соответвует началу и концу применения конкретной разметки в документе.

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

CSS (англ. Cascading Style Sheets -- каскадные таблицы стилей) -- технология описания внешнего вида документа, написанного языком разметки. CSS это язык стилей, определяющий отображение HTML-документов.

Например, CSS работает с шрифтами, цветом, полями, строками, высотой, шириной, фоновыми изображениями, позиционированием элементов и многими другими вещами. HTML может (неправильно) использоваться для оформления web-сайтов. Но CSS предоставляет бoльшие возможности и более точен и проработан. CSS, на сегодняшний день, поддерживается всеми браузерами (программами просмотра).

2.2 Формирование требований к программному обеспечению

Веб-обозреватель, брамузер (от англ. Web browser; вариант броузер -- неправильно) -- программное обеспечение для просмотра веб-сайтов, то есть для запроса веб-страниц (преимущественно из Сети), их обработки, вывода и перехода от одной страницы к другой. Браузеры постоянно развивались со времени зарождения Всемирной паутины и с её ростом становились всё более востребованными программами. Ныне браузер -- комплексное приложение для обработки и вывода разных составляющих веб-страницы и для предоставления интерфейса между веб-сайтом и его посетителем. Практически все популярные браузеры распространяются бесплатно или «в комплекте» с другими приложениями: Internet Explorer (совместно с Microsoft Windows), Mozilla Firefox (бесплатно, свободное ПО), Safari (совместно с Mac OS или бесплатно для Windows), Opera (бесплатно, начиная с версии 8.50), Google Chrome (бесплатно, свободное ПО).

Mozilla Firefox -- свободно распространяемый браузер. Второй по популярности браузер в мире и первый среди свободного ПО -- в феврале 2010 года его рыночная доля составила 24,23 %, в отдельных странах -- до 45 %.В браузере присутствуют вкладочный интерфейс, проверка орфографии, поиск по мере набора, «живые закладки», менеджер закачек, поисковая система. Новые функции можно добавлять при помощи расширений.Firefox выпускается для Microsoft Windows, BeOS, Mac OS X, Linux и множества других Unix-подобных операционных систем.

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

Сценарии JavaScript выполняются на компьютере пользователя (в отличие php-сценариев, которые выполняются на стороне сервера) и поэтому представляют некоторую опасность, связанную с возможным несанкционированным доступом к конфиденциальной информации. Например, при соответствующих настройках браузеры способны разрешать сценариям считывать файлы, в которых могут содержаться важные данные, например, пароли доступа. Поэтому в браузерах предусмотрена возможность отключения выполнения сценариев JavaScript. Это следует учитывать при разработке Вэб-страницы с использованием JavaScript.

2.3 Разработка структуры сайта

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

Линейная структура.

Это самая простая структура сайта. Веб-страницы идут одна за другой, ипользователь должен просматривать их как слайд-шоу. В линейной структуре не существует разделения контента на уровни. Все страницы на таких сайтах равноправны, и их должен увидеть каждый посетитель. Несмотря на простоту реализации линейной структуры, недостатков у нее гораздо больше, нежели достоинств. А поэтому область ее применения четко ограничена. Она может использоваться на имиджевых сайтах-презентациях и в онлайновых учебных пособиях. Реализация линейной структуры не представляет собой абсолютно никакой сложности. Самый простой вариант сайта - набор HTML-страниц, с каждой из которых есть ссылка на последующую предыдущую (естественно, исключение составляют крайние страницы). На каждой страницы обязательно должно быть какое-то заглавие и ссылка на первую страницу. Иначе посетители, попавшие в середину сайта, например, с поисковой системы, ничего не поймут и почти наверняка покинут проект разочарованными.

Линейная структура с альтернативами и вариантами.

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

Линейная структура с ответвлениями.

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

Древовидная структура.

Древовидная структура - самый универсальный способ размещения веб-страниц. Она подходит для создания практически любых типов сайтов. Ее принцип, наверное, понятен всем. Пользователь при заходе на заглавную страницу оказывается перед выбором, куда идти дальше. После перехода в нужный раздел, он подбирает необходимый подраздел и т. п. У древовидной структуры очень много достоинств. Главный недостаток: в древовидной структуре очень сложно соблюдать баланс между глубиной и шириной. Если "дерево" вашего сайта будет расти только вглубь, то пользователям, чтобы дойти до какой-то информации, придется загрузить и просмотреть слишком много страниц. Естественно, это будет раздражать. Ну а если вы создадите очень широкую древовидную структуру, то посетители будут вынуждены каждый раз тратить очень много времени для выбора нужной им ветки.

Решетчатая структура.

Эта структура уже на порядок сложнее всех рассмотренных ранее. В ней все страницы также размещаются в различных ветках. Но у пользователя есть возможность перемещаться по ним не только вертикально (вверх-вниз) но и горизонтально (то есть между ветками на разных уровнях). Используется решетка в основном только в каталогах. При этом перемещение между ветками на глубинных уровнях осуществляется с помощью отсылок на рубрики в других разделах.

2.4 Проектирование интерфейса

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

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

дополнительное меню сайта - как правило, представляет собой наиболее сложную структуру. Имеет иерархическую структуру и бывает 3-х видов:

выпадающее меню - раскрывается (выпадает) при наведении на пункт меню;

раскрывающееся меню - имеет раскрывающуюся структуру по клику на кнопку меню;

раскрытое меню - статическое меню, часто имеет древовидную структуру.

Меню - наиболее распространенная навигационная система, она похожа на оглавление к книге. Меню состоит из коротких текстовых активных ссылок на определенные страницы сайта. Меню должно быть видно с любой страницы ресурса, тогда пользователь сможет воспользоваться им в любой момент. Составление полного меню, благодаря которому будет осуществляться быстрый переход на искомые страницы, для больших сайтов (свыше 50 страниц) практически невыполнимая задача. Тогда на помощь приходит раскрывающееся меню, т.е. когда человек кликает на какую либо ссылку, открывается несколько дополнительных ссылок, характеризующих подразделы. Можно размещать несколько меню: одно под шапкой два других по бокам - справа и слева. В том случае, если сайт небольшой, то лучше ограничиться формированием меню в правой колонке сайта, т.к. это очень удобно и привычно для пользователя. В общем, справа лучше располагать самые важные ссылки на разделы, поскольку данная зона наиболее активна на сайте. При соблюдении некоторых несложных правил/советов можно с лёгкостью создать меню по которому сложно будет заблудиться:

на главной странице сайта должна быть представлена карта сайта/меню, если не в графическом то текстовом виде;

на всех последующих страницах должны присутствовать ссылки на главную страницу на которой в свою очередь находятся ссылки на эти же страницы;

при использовании рисунков в качестве ссылок они должны быть однотипными на всех страницах и располагаться в одной и той же позиции;

рисунки, используемые в качестве ссылок(кнопки), должны быть интуитивно различимы для посетителя относительно других элементов страницы.

Для исполнения навигации обычно применяются следующие типы ссылок/меню:

-внутренние ссылки, связывающие страницы в пределах одного сайта;

-внешние ссылки, связь с докаментами вне данного сайта;

-ссылки на почту;

-локальные ссылки, внутри страницы между определёнными фрагментами информации.

2.5 Публикация сайта

Нет никакого смысла в прохождении всех трудностей создания привлекательного информативного творческого сайта, если никто его не увидит. Кульминацией вашей работы является момент, когда вы делаете свой сайт доступным внешнему миру, публикуя его в интернете. Публикация сайта в первый раз известна также под названием запуска сайта. Для сайта публикация означает копирование всех файлов этого сайта на веб-сервер. После публикации сайта он считается "действующим"; это означает, что любой человек может видеть ваш сервер в своих браузерах. Можно публиковать веб-сервер тремя способами:

можно использовать протокол HTTP (Hypertext Transfer Protocol) для публикации на веб-сервере с установленными серверными расширениями FrontPage Server Extensions или пакетом SharePoint Team Services компании Microsoft.

можно использовать протокол FTP (File Transfer Protocol) для публикации на веб-сервере, не содержащем FrontPage Server Extensions или SharePoint Team Services. Для использования протокола FTP нужно знать имя FTP-сервера, который будет принимать файлы, а также иметь допустимое имя и пароль пользователя.

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

Прежде чем запускать коммерческий сайт в Интернет, нужно выбрать и зарегистрировать доменное имя. Доменное имя - это базовая часть алфавитно- цифрового адреса, который называется унифицированным указателем ресурсов (URL), где посетители ищут ваш сайт через World Wide Web. Например, URL корпорации Microsoft - это www.microsoft.com, и доменное имя - это microsoft.com. Доменное имя может быть собственным именем, названием вашей компании, словом или фразой, представляющей то, что делает компания, или любой выбранной вами строкой букв и цифр. При выборе доменного имени имеет смысл найти имя, которое будет удобно запоминать и произносить. Хорошо подходят доменные имена, содержащие общеизвестные слова. Доменное имя может состоять из нескольких слов, и тогда требуется решить, как представлять эти слова: подряд или разделять их другими символами; наиболее распространен символ подчеркивания. Все имена в сети разбиты на домены различного уровня. Так для России выделен домен первого уровня «.ru». Это - так называемый территориальный домен, его имеет каждое государство (Германия - .de, Великобритания - .uk и т.д.). Кроме территориальных существуют организационные домены первого уровня, они объединяют учреждения различных типов (коммерческие организации - .com, правительственные учреждения - .gov и т.д.). При желании можно разместить русскоязычный сайт в доменной зоне uk, а в зоне com может располагаться сайт общественной организации. Поэтому деление доменов на территориальные и организационные достаточно условно. Доменов первого уровня мало и новые домены появляются крайне редко. Каждый домен первого уровня может адресовать бесконечное количество доменов более низкого уровня.

Дисковые сайты можно запускать на любом компьютере или даже с гибкого диска или CD-ROM. Они поддерживают только базовые функции HTML. Большинство веб-компонентов, поставляемых вместе с программой FrontPage, не действуют на дисковых сайтах. Серверные сайты запускаются на веб-сервере, то есть на компьютере, который специально сконфигурирован для размещения сайтов. При небольших масштабах веб-сервером может быть локальный компьютер (например, ваш собственный), или это может быть сервер сети интернет вашей компании. Личные сайты часто размещаются на серверах провайдеров (поставщиков) услуг Интернет (ISP). При более крупных масштабах веб-серверы, на которых размещены корпоративные сайты интернет, обычно принадлежат профессиональным компаниям по предоставлению веб-хостинга (Web hosting). Некоторые компании веб-хостинга предлагают бесплатные или очень недорогие услуги по веб-хостингу; однако нужно быть осторожным, поскольку это как раз такие случаи, когда вы действительно получаете то, за что платите. Надежные высокоскоростные серверы и надежные хорошо работающие специалисты никогда не бывают бесплатными или дешевыми. Сменить услуги веб-хостинга можно, но это может потребовать больших усилий, поэтому имеет смысл с самого начала принять обоснованное решение, а не учиться на собственных ошибках.

Заключение

Сайт сделан без использования программных средств (с помощью блокнота и браузера) с помощью языка разметки гипертекста HTML, каскадных таблиц стиля CSS и объектно-ориентированного скриптового языка программирования JavaScript. Возможны пути совершенствования сайта: открытие новых разделов, добавление информации в уже существующие, открытие форума и т.п.

Литература

1. http://www.zvirec.com/

2. http://www.postroika.ru/

3. http://on-line-teaching.com/

Приложение А

Структура сайта

Приложение Б

План WEB-страниц

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

План страницы инфраструктура города

Приложение В

Код программного продукта

HTML - код главной страницы:

<html>

<head>

<title>Сайт города Щербинки</title>

<link rel="stylesheet" type="text/css" href="style.css">

</head>

<body>

<table border="3" bordercolor="#808080" cellspacing="0" cellpadding="4" width="100%">

<tr>

<td rowspan="2"><img src="Images/Герб.gif"></td>

<td colspan="7"><img src="Images/Баннер.jpg"></td>

<td rowspan="2"><script language=JavaScript src="Время и дата.js"></script></td>

</tr>

<tr>

<td height="1%" width="12%"><a class=заголовки href="Сайт города Щербинки.html">Главная страница</a></td>

<td width="11%"><a class=заголовки href="История города.html">История города</a></td>

<td width="3%"><a class=заголовки href="Фотогалерея.html">Фотогалерея</a></td>

<td width="2%"><a class=заголовки href="Транспорт.html">Транспорт</a></td>

<td width="16%"><a class=заголовки href="Ифраструктура города.html">Инфраструктура города</a></td>

<td width="9%"><a class=заголовки href="Карта города.html">Карта города</a></td>

<td width="8%"><a class=заголовки href="Карта сайта.html">Карта сайта</a></td>

</tr>

</table>

<img src="Images/главная.gif" align="right" class=фото_справа>

<img src="Images/главная-1.gif" align="right" class=фото_справа>

<div class=основной_текст>

Щербинка -- город в Московской области России.Население -- 31,7 тыс.жителей (2009).Расположен на автомагистрали Москва - Симферополь. Железнодорожная станция Щербинка на линии Москва -- Курск. Город Щербинка расположен в 6 км к югу от Московской кольцевой автодороги вдоль Варшавского шоссе и железнодорожной магистрали "Москва - Тула". С севера и северо-востока территория города Щербинки соприкосается земли Москвой (район Южное Бутово), юго-восток, юга, запада - земли города Подольска, Подольского, Ленинского районов Московской области. Основная часть земель застроена, занята промышленной зоной, благоустроенными многоэтажными жилыми застройками. Зелеными насаждениями занято 2% городской территории. Общая площадь Щербинки -753 га.Щербинка известна с XIV века как деревня. Пристанционный посёлок с конца XIX века. В 1939 году Щербинка стала рабочим посёлком. Статус города с 1975 года. Основные предприятия: Щербинский лифтостроительный завод, заводы электроплавленных огнеупоров, металлоконструкций, художественных промыслов и сувениров, авиационного технологического оборудования, завод защитных покрытий, Научно-технический центр «Бакор». Экспериментальное кольцо ВНИИЖТ, ФГУП «Щербинская типография». Рядом с городом находится аэропорт Остафьево.Большая часть населения работает в Москве и Подольске.В городе действуют 5 детских садов, 5 средних школ, детско-юношеский центр, детско-юношеская спортивная школа, школа искусств. </div>

</body>

</html>

CSS-код:

body {background-image:url("images/фон.jpg");}

.заголовки{font :bold 15px arial,sans-serif;text-decoration: none;color:#800080}

.фото_справа{clear:right;margin:0.3%}

.основной_текст{width:60%;padding:8px;margin-top:10px;border:7px DASHED #008080;text-indent:1.5%;text-indent: 40px;}

.инфраструктура_города{float:left;}

#список{list-style-type:square;}

#список-1{list-style-type:circle;}

.таблица_автобусов{padding:8p;margin-top:10px;border: 17px RIDGE #FFEC8B;}

#отступ{padding:10px;}

#рамка_таблицы_автобусов{border-left:10px DOTTED gold;border-right:10px DOTTED gold;padding:10px;}

#рамка_таблицы_автобусов-1{border-top:10px DOTTED gold;padding:10px}

#рамка_таблицы_автобусов-2{border-left:10px DOTTED gold;border-right:10px DOTTED gold;border-top:10px DOTTED gold;padding:10px;}

.инфроструктура{margin-left:35%;padding:8px;margin-top:10px;border:7px DASHED #008080;}

#буквица{font : italic normal bold 40px arial,sans-serif;color:#8A2BE2;padding-right: 2px;}

#название_города{letter-spacing:3px;font-weight:bold;font-size:20px;color:#FF69B4}

#a10{border-right:5px SOLID #808080;}

Javascript-код определение даты и времени:

function process(){}

today = new Date()

if(today.getMinutes() < 10) {pad = "0"}

else

pad = "";

document.write("<center><FONT SIZE=4 color=black>Welcome!!</FONT></center>")

if((today.getHours() < 12) && (today.getHours() >= 5))

{ document.write("<center><FONT SIZE=4 color=blue>Доброе утро</FONT></center>")}

if((today.getHours() >= 12) && (today.getHours() < 18))

{ document.write("<center><FONT SIZE=4 color=blue>Добрый день</FONT></center>")}

if((today.getHours() >= 18) && (today.getHours() <= 23))

{ document.write("<center><FONT SIZE=4 color=blue>Добрый вечер</FONT></center>")}

if((today.getHours() >= 0) && (today.getHours() < 5))

{ document.write("<center><FONT SIZE=4 color=blue>Доброй ночи</FONT></center>")}

document.write("<center><FONT SIZE=3 color=red>Ваше время: ",today.getHours(),":",pad,today.getMinutes())

document.write(" Дата: ",today.getMonth()+1,"/",today.getDate(),"/",today.getYear(),"<br></font></center>");