Основные правила и этапы создания Web-сайтов
Понятие и виды Web-хостинга. Анализ рынка хостинговых компаний. Языки Web-программирования: HTML, PHP, Water, Clear Methods Steam. Web-дизайн и браузеры. Возможности современных визуальных HTML-редакторов. Создание сайта "Каталога хостинговых компаний".
| Рубрика | Программирование, компьютеры и кибернетика |
| Вид | курсовая работа |
| Язык | русский |
| Дата добавления | 15.01.2012 |
| Размер файла | 537,6 K |
Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже
Студенты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.
Trellix экспортирует готовый к публикации узел в HTML. Процедура FTP безупречна. Тем не менее программа TrellixWeb нуждается в некоторых дополнениях. Даже для проектирования простейших узлов в программе не хватает возможности напрямую работать с анимированными изображениями GIF и простого метода построения страниц со многими колонками. Следует полнее использовать мощную функциональность Web Gems.
Несмотря на указанные недостатки, программа TrellixWeb прекрасно удовлетворяет элементарные нужды начинающих пользователей. Хотя в TrellixWeb нет ярких эффектов, имеющихся в таких продуктах начального уровня, как FrontPage или NetObjects Fusion, она станет прекрасным выбором для авторов, желающих быстро опубликовать простой узел, обеспечивающий их присутствие в Web.
хостинг программирование сайт
ГЛАВА 3. ОСНОВНЫЕ ПРАВИЛА И ЭТАПЫ СОЗДАНИЯ САЙТА
Принятие правильного решения о выборе браузеров и использовании новых технологий во многом зависит от выбранной аудитории пользователей. Прежде чем разрабатывать новый сайт, необходимо провести исследования, каким платформам, браузерам, техническим новинкам отдается предпочтение, какие скорости соединения используют потенциальные пользователи. Если переделывается существующий сайт, предварительно анализируются регистрационные записи на сервере, хранящие информацию о использовании сайта.
Все предугадать невозможно, но на начальном этапе можно придерживаться следующих правил:
- если разрабатывается сайт научного или академического содержания, особое внимание следует обратить на то, как сайт работает в Lynx (или в другом неграфическом браузере);
- если сайт предназначен для потребителей - например, сайт, который предлагает обучающие игрушки для детей, - внимание обращается на скорость загрузки и внешний вид сайта для AOL-браузеров;
- если это сайт для контролируемого окружения, например корпоративной, то точно зная, какой браузер и какую платформу используют ваши клиенты, вы можете показать все, на что способен этот браузер, включая звуковые эффекты - свистки, звонки и, даже, собственные разработки;
- если разрабатывается сайт компьютерных игр, предназначенный для юных фанатов, с большой вероятностью можно предположить, что они пользуются самыми последними версиями браузеров и встраиваемых приложений (или непременно достанут их, если вы скажете, что это им нужно).
Для большинства многоцелевых сайтов разумнее использовать подход "разделение различий" или, если позволяют ресурсы, создайте несколько версий и обслуживайте их соответствующим образом.
3.1 Правила Web-дизайна
Стиль. Это система визуальных элементов, призванная обеспечить цельность восприятия данной странички или всего сайта. Исходя из разработанной вами концепции и контента (текстового материала, готовых иллюстраций и рисунков), вы выбираете шрифты, цвет фона, способ обработки картинок, коллажей, иконок и пр. элементов. Ну а затем просто стараетесь придерживаться выбранной вами манеры исполнения элементов по ходу создания и развития сайта.
Стиль призван обеспечить хотя бы минимальную уникальность сайта. Можно использовать распространенный набор цветов, шрифтов, стандартные приемы оформления... Но что-то свое, особенное в нем должно быть. Иначе среди нескольких миллионов страничек вашу могут и не заметить.
ѕ Основные элементы стиля сайта:
ѕ Логотип
ѕ Модульность
ѕ Шрифты
ѕ Иллюстративный ряд (приемы обработки изображений)
ѕ Цвета
На данный момент можно выделить следующие типы дизайна:
- текстовый дизайн - определяется содержанием и концепцией автора. "Текстовый" не означает простой или примитивный. На первом уровне это означает почти полное отсутствие изображений как таковых, что значительно ускоряет загрузку страницы. А навигационные и декоративные элементы выполняются теми же "символьными" приемами. Нужно сказать, что HTML как таковой значительно расширил возможности при разверстке страниц этого типа, и теперь при помощи кода можно делать и тени, и даже изображения. При таких разверстках следует хорошо знать классические верстальные приемы, особенности используемых шрифтов.
- полиграфический дизайн - тот вариант, когда веб-страничка изо всех своих сил стремится имитировать печатное издание (особенно буклетные типы). Такой дизайн распространен на корпоративных сайтах, сайтах с рекламным уклоном, там, где особо необходимо образно-эмоциональное наполнение основного содержания. Ставка делается на классические дизайнерские приемы по принципу - общий дизайн, а потом нарезать и собрать... Как правило, основное впечатление пользователь получает за счет пиксельной графики.
- интерфейсный дизайн - сейчас его еще называют usability... Стиль, призванный максимально облегчить жизнь пользователю во всех ее проявлениях, от загрузки странички (минимизирование кода и предельная оптимизация изображений) до особого исполнения каждого элемента. Досконально продуманная (как правило) навигация, изначально понятность пользования общей схемой сайта - такой подход к веб-дизайну вызывает только глубокое почтение и уважение. И даже если с точки зрения изобразительной эстетики на таком сайте окажется не все гладко, то с лихвой окупится остальными достоинствами.
- динамический дизайн - в примитивном варианте бегающие по экрану, или просто шевелящиеся изображения (в основном - флеш, но сюда же можно отнести и DHTML, и какие-то элементы на Java и даже анимационный GIF). В хорошо продуманном сценарии это может быть целое произведение искусства, последовательно разворачивающее перед зрителем мысль автора или какой-то художественный образ. Интерфейсы на флешах часто поражают наше воображение в самом хорошем смысле этого слова.
- смешанные типы - суть понятна и так. Обычно комбинация всех этих типов.
Цвет - это эмоции и настроение. Вы можете взбодрить зрителя, навеять на него осеннее или весеннее настроение, или наоборот, вогнать в тоску. Светло-серый цвет у нас называется серебряным, темно-серый с оттенками - «мокрый асфальт», грязно-белый - «белая ночь». «Коррида» - и мы сразу представляем алый, но особого оттенка. В ход идут названия напитков - «кофейный», «шоколадный», «молочный».
«Престижные», золото, серебро, темно-серый, черный. Их задача - передать солидность, уверенность, стабильность и высокую стоимость.
«Пастельные», нежные бежевые, розовые, голубоватые... Женственные, мягкие, расслабляющие...
«Здоровые», из американской психологии... Чистота, здоровье, уверенность, семья.... (соя, кукуруза…)
«Природные», близкие к естественным органическим, природным компонентам...
Как вариант использования цвета - «Растяжки»... Обычно тональные оттенки одного цвета, и как акцент - более активный цвет.
Есть и нестандартные цветосочетания: розовый с черным, желтый и зеленый и другие... в таких случаях, как показывает опыт, важна сама идея, а также конкретное ее воплощение. Я думаю, что при осуществлении своей идеи средствами цвета стоит довериться своим эмоциональным ощущениям.
Если ваш сайт про цирк, то ясно, что приемы использования цвета в нем тоже должны быть "цирковыми", то есть яркие насыщенные, а то и открытые (конкретные) цвета. Но если вдруг вам пришла мысль сделать страничку про ночной цирк, то и настроение должно быть соответствующим. Полезно посмотреть, как подобные темы решают другие художники.
Требования к Web-странице. Огромное количество источников по web-дизайну предлагают такое же количество правил и советов по созданию и оформлению web-страниц. Это использование графики, цветовое решение, скорость загрузки страницы, использование технологий, содержание, навигация по сайту.
Необходимо помнить:
· 5-7 пунктов меню - это предел для хорошего восприятия содержащейся в меню информации.
· оптимальное использование не более 30-40 кбайт графики на страницу.
· дизайн первой страницы хоть малость, но должен отличатся от всех остальных страниц!
· бегущие строки лучше не использовать или использовать, но крайне редко. Потому что от них только глаза болят, но если в этом есть особая необходимость, то не следует нагружать строку большим количеством информации!!!
· в web-страницах используются только форматы JPG, JPEG, GIF и PNG.
· пользователь находящийся в середине сервера - мог попасть в любую точку вашего сайта или странички.
· необходимо разбивать большое количество информации!
· именовать, созданные странички следует на английском языке.
· необходимо избавлятся от горизонтальных прокруток экрана.
· цвет ссылки не должен быть схожим с фоном страницы. Иногда многие в этом делают ошибку. Если, например, фон страницы темно-красный, а цвет ссылки синий, то стоит посетителю просмотреть ссылку как она становится темно-красной и исчезает.
· лучше всего делать такие страницы, которые можно изменять. Делайте страницы, которые доступны всем читателям вне зависимости от того, каким браузером, платформой или экраном они решили или вынуждены пользоваться.
· на первой странице сайта должна находиться краткая информация о содержании сайта, представленных материалах, авторах сайта. Посетитель, случайно попавший на сайт, не должен гадать, что он может на нем найти.
· крайне желательно, чтобы графика на сайте имела лишь вспомогательное значение (за исключением, конечно, сайтов, посвященных изобразительному искусству и другим подобным тематикам). Многие пользователи отключают отображение графики в своих браузерах для ускорения путешествий по Интернету.
· Не используйте на сайте текст, набранный заглавными буквами.
· более всего нежелательно - это использование при создании сайта фреймов!
· Размер каждой страницы сайта не должен превышать предел в 80-100 килобайт вместе с графикой (оптимально - 40-50), за исключением страниц с большим количеством информации - электронных книг, например. В любом случае при большом размере того или иного файла об этом должно быть сказано около ссылки на него.
3.2 Представление графики на Web-страницах
На данный момент почти все изображения в Web, представлены в трех форматах: GIF, JPEG и PNG. Дадим краткий обзор "большой тройки" онлайновых графических форматов.
GIF. Grafic Interchange Format можно назвать традиционным форматом файлов Web. Он был первым форматом файлов, который поддерживался Web-браузерами, и по сей день продолжает оставаться основным графическим форматом Web.
Его свойства состоят в следующем:
- поддерживает не более 256 цветов (меньше можно и часто нужно);
- использует палитру цветов;
- использует сжатие без потери информации по методу LZW (который подобен применяемому в архиваторе PKZIP, и, следовательно, GIF-файлы в дальнейшем практически не сжимаются);
- поддерживает чересстрочную развертку;
- является поточным форматом, т.е. показ картинки начинается во время перекачки;
- позволяет назначить одному из цветов в палитре атрибут прозрачный, что применяется при создании так называемых прозрачных GIFов;
- имеет возможность сохранения в одном файле нескольких изображений, что находит свое применение при изготовлении анимированных GIFов;
- поддерживает возможность вставки в файл управляющих блоков, которые позволяют вставлять комментарии в файл (например, об авторских правах), осуществлять задержку между показами изображений и т.д.
А теперь немножко разъяснений - к чему эти свойства могут привести. Как мы написали, GIF поддерживает не больше 256 цветов, а это значит, что все изображения, которые мы сохраняем в GIF-формате, явно или неявно уменьшают количество цветов, чтобы уложиться в этот лимит (разные программы с разным успехом). А отсюда вывод - если у взять красивую фотографию с плавными переходами и едва уловимыми оттенками цвета, то после преобразования все будет гораздо хуже - оттенки перестанут быть неуловимыми, и вся фотография приобретет неестественный, нереалистичный вид. Поэтому, если надо все-таки сохранить фотографию в формате GIF и передать все оттенки, то приходится идти на хитрости. Например, к фотографии можно применить какой-нибудь художественный фильтр и превратить ее в рисунок или применить тонирование. Зато нет никаких проблем с сохранением рисунков и чертежей в этом формате, они, как правило, хорошо сжимаются и не содержат много цветов.
JPEG. Вторым наиболее популярным графическим форматом в Web является JPEG - Joint Photographic Experts Group. Он содержит 24-разрядную информацию о цвете. Это 16,77 млн цветов в отличие от 256 цветов формата GIF. В JPEG используется так называемое сжатие с потерями. Это означает, что некоторая информация об изображениях в процессе сжатия отбрасывается, но в большинстве случаев ухудшение качества изображения не наносит вреда и часто даже не заметно.
Фотографии или любые изображения с плавными градациями цветов лучше всего сохранять в JPEG-формате, потому что он предлагает более высокое качество изображений, умещающихся в файл меньшего объема. Тем не менее, JPEG не является лучшим решением для графических изображений с одноцветными областями, поскольку этот формат имеет тенденцию испещрять цвета крапинками и конечный файл, как правило, будет несколько больше, чем GIF-файл для того же изображения.
PNG. Есть еще третий графический формат, конкурирующий за постоянное использование в Web. Это формат PNG - Portable Network Graphic, который, несмотря на некоторые достоинства, с 1994 г. находится более или менее в тени. Только недавно браузеры начали поддерживать PNG как встроенную графику, но PNG имеет все шансы стать очень популярным форматом в Web. Именно поэтому он включен здесь в "большую тройку". PNG может поддерживать 8-разрядные индексированные цвета, 16-разрядные полутона или 24-разрядные полноцветные изображения, используя схему сжатия без потерь. Это обеспечивает более высокое качество изображений, а иногда и меньший объем файлов по сравнению с форматом GIF. Кроме того, файлы PNG имеют некоторые замечательные функции, например, встроенное управление коэффициентом гамма, и изменяемые уровни прозрачности (это позволяет показывать рисунок фона сквозь отбрасываемые мягкие тени).
3.3 Влияние дисплеев на Web-дизайн
Поскольку изображения Web существуют только на экране дисплея, будет технически правильно измерять их разрешение в пикселах на дюйм (ppi - pixels per inch). Другая единица измерения разрешения - количество точек на дюйм (dpi - dots per inch) относится к разрешению печатных изображений и зависит от разрешения печатающего устройства.
Но, так как реальные размеры графики зависят от разрешения дисплея, измерение в дюймах становится для Web-окружения неприемлемым. Единственной значимой единицей измерения становится пиксел.
Практично создавать изображения с разрешением 72 ppi (это лучший вариант для представления на экране), обращая внимание только на общие размеры в пикселах. В процессе создания графики на Web можно вообще не использовать дюймы. Важен размер изображения по сравнению с другими изображениями на странице и общего размера окна браузера.
Например, многие пользователи по-прежнему используют 14-дюймовые дисплеи с разрешением 640x480 пикселов. Чтобы гарантировать заполнение графической заставкой всего пространства экрана, лучше сделать его шириной не более 600 пикселов (учитывая, что часть пикселов справа и слева будет использована для окна и для полосы прокрутки). Размер остальных кнопок и изображений на странице следует измерять в пикселах относительно банеpa, имеющего ширину 600 пикселов.
Размер файла. Без сомнения, именно графика сделала Web таким, каким мы его видим сегодня, но как дизайнер вы должны знать, что многие пользователи испытывают к графике в Web чувство на грани любви и ненависти. Не стоит забывать, что графика увеличивает время, необходимое Web-странице для передачи по сети; большой объем графики означает существенное время загрузки, которое испытывает терпение читателя, особенно если он дозванивается с использованием стандартного модемного соединения.
В этом отношении для Web-дизайнера существует единственное наиболее важное правило: размер файла графического изображения должен быть минимально возможным! Создание изображений, предназначенных для передачи по сети, возлагает ответственность на разработчиков серьезно относиться к проблеме времени загрузки.
Каким образом множество типов дисплеев и условий просмотра влияет на принятие решений при разработке страницы? Большая часть вашей аудитории различает дисплеи лишь по размерам дисплея (или, если быть более точным, по разрешению) и по цветовым возможностям. Тем не менее важно помнить, что различия на этом не заканчиваются. Некоторые пользователи могут смотреть сайт на экране телевизора. В то же время другие будут просматривать Web на своей ладони, с экрана PDA (Personal Digital Assistant, персональный цифровой секретарь) или сотового телефона. Пользователи с ограничениями по зрению, вероятно, будут слушать, а не смотреть вашу страницу.
Рабочее пространство в окне браузера. Узнать размер дисплея - это только часть дела, поскольку операционная система и сам браузер занимают на экране довольно много места. Размер пространства, которое действительно доступно в окне браузера (оно называется "рабочим" или "живым" пространством окна браузера), зависит от операционной системы компьютера, используемого браузера и индивидуальных установок параметров пользователя.
Минимальное рабочее пространство окна измеряется со всеми возможными видимыми инструментами браузера (такими как кнопки, панели расположения и полосы прокрутки). Максимальное рабочее пространство измеряется при скрытии всех необязательных элементов, это делало окно браузера максимально большим для данного разрешения.
Но это два крайних случая. На практике размеры окна браузера варьируются. Часть кнопок будет присутствовать на экране, но, возможно, не все. Полосы прокрутки включаются и выключаются автоматически, поэтому их трудно учесть. Пользователи дисплеев с очень высоким разрешением (от 1024 пикселов и выше) всегда открывают окна целиком, а часто открывают одновременно несколько окон. Наряду с этим существует множество неизвестных факторов, которые могут повлиять на размер окна браузера.
Особенности цветов дисплея. Мониторы, если они цветные, различаются по числу воспроизводимых цветов. Это еще один фактор, который влияет на решения разработчика. Мониторы обычно воспроизводят 24-раз-рядные (16,77 млн цветов), 16-разрядные (65 536 цветов) или 8-разрядные (256 цветов).
Цвета, полученные в "истинном", 24-разрядном пространстве цветов будут искажаться (выводиться с пятнами и крапинками) при обработке браузерами на 8-разрядных дисплеях.
Существует, однако, набор из 216 цветов, составленный из цветов системных палитр МасOS и Windows, который не будет искажаться на 8-разрядных дисплеях. Одно из названий этого множества цветов - Web-палитра (Web Palette). Многие дизайнеры предпочитают пользоваться этой палитрой при создании Web-графики и элементов HTML, так чтобы страница выглядела одинаково для всех пользователей.
Стандартные размеры и разрешения дисплеев. Первым шагом при определении вероятного размера вашей Web-страницы должно стать определение максимального пространства, обеспечиваемое дисплеем. Компьютерные дисплеи имеют различные стандартные размеры и обычно измеряются в дюймах. Можно привести некоторые типичные размеры дисплеев - 14", 15", 17", 19" и 21".
Более значимой характеристикой является разрешение дисплея - общее число пикселов (picture's element - элемент картинки) на экране. Чем выше разрешение, тем более детальным может быть изображение. Зная возможное число пикселов, вы можете создавать в соответствии с ним изображения (также измеряемые в пикселах) и элементы страницы.
Важно помнить, что чем выше разрешение на данном дисплее, тем больше пикселов спрессовано в имеющемся пространстве экрана. В результате пикселы становятся меньше и соответственно уменьшаются изображения и другие элементы страницы.
Именно по этой причине измерения в Web производятся в пикселах, а не в дюймах. То, что на вашей системе представляется величиной в дюйм, на дисплеях других пользователей может выглядеть больше или меньше. Когда вы работаете с пикселами, вы знаете, каковы размеры элементов относительно друг друга.
Теперь Web предназначен не только для персональных компьютеров. Web-браузеры уверенно входят в жилые комнаты, портфели и машины в виде WebTV, карманных PDA-устройств и даже сотовых телефонов. С необычно малыми размерами их дисплеев связаны новые заботы дизайнеров.
WebTV - устройство, которое превращает обыкновенный телевизор и телефонную линию в Web-браузер, ворвалось на рынок в 1996 г. и постепенно, но неуклонно расширяет свою нишу. Но поскольку число пользователей возрастает, некоторые дизайнеры принимают во внимание особые требования этого устройства. Некоторые сайты специально разрабатываются для WebTV.
В качестве устройства отображения WebTV использует телевизор. Рабочее пространство WebTV составляет 544x378 пикселов. Браузер позволяет вертикально перелистывать страницы, но не имеет горизонтальной прокрутки, так что более широкая графика будет частично невидима и недоступна. Принципы дизайна, соответствующего стандартам телевидения, заключаются в том, чтобы создавать светлый текст на темном фоне, а не наоборот, а также не использовать элементы шириной менее 2 пикселов.
WebTV публикует рекомендации для дизайнеров на сайте под названием Primetime. Более детальную информацию о требованиях WebTV можно найти на сайте http://www.Webtv.net/primetime.
Возросшая популярность Web в совокупности с расширяющимся использованием карманных устройств связи, таких как карманные компьютеры, PDA и сотовые телефоны, привела к тому, что Web-браузеры сжались до невероятно малых размеров. Многие из этих устройств для отображения содержания сайта используют браузеры типа "тонкий" клиент (thin client) - клиент-терминал. Этот вид браузера работает с минимальными требованиями к процессору на стороне клиента, оставляя весь огромный объем работы серверу.
Например, браузер HitchHiker специально разработан для работы на монохромном квадратном дисплее сотового телефона со стороной 2 дюйма. Браузер ProxiWeb являет собой пример другого клиента, который обеспечивает доступ к популярному PDA PalmPilot (а также к IBM WorkPad и новому Palm III). Он работает с использованием прокси-сервера, который обрабатывает Web-страницы, предназначенные для отображения на портативных устройствах. ProxiWeb даже преобразует графику в монохромные битовые карты, так что до некоторой степени сохраняется первоначальный вид страницы (это наиболее полезно для графических заголовков), подробнее - на странице http://www.proxinet.com.
Не многие сайты разработаны специально для портативных устройств, но, поскольку их популярность возрастает, уже сейчас интересы этой части пользователей нельзя не учитывать. В большинстве случаев рекомендации по созданию сайтов, доступных для текстовых браузеров, таких как Lynx, включая приведенные выше советы по обеспечению доступности, применимы для разработки страниц в условиях ограниченного пространства дисплеев карманных устройств.
3.4 Размещение web-страницы на сервере
Создавая web-сайт, необходимо заранее определить место, где он будет размещен. Многие провайдеры бесплатно предоставляют несколько мегабайт на своих серверах зарегистрированным пользователям. Это неплохо, но если вы захотите сменить провайдера, то придется менять и адрес (URL) такого сайта. Другим вариантом является использование бесплатных общедоступных хостинг-сервисов: www.narod.ru, www.boom.ru, www.hl.ru, www.webservis.ru , сообщество Geocities (www. yahoo, corn), XOOM (xoom.corn/home), российский сервер “Халява” (www.halyava.ru), сервер www.chat.ru и многие другие.
Основные критерии выбора хостинга:
размер выделяемого под сайт пространства;
скорость доступа к сайту;
условия размещения сайта на сервере;
«благозвучность» и запоминаемость URL;
удобство обновления сайта;
дополнительные сервисы (например, предоставление арендуемых скриптов) и т. д.
Адрес в Интернете. Подобно тому как любой телефон в телефонной сети имеет свой уникальный номер, любой компьютер, подключенный к Интернету, тоже имеет свой уникальный номер, который называется IP-адресом. IP-адрес состоит из четырех чисел, разделенных точками (это, конечно, только для облегчения человеческого восприятия -- на самом деле это всего лишь 32-битная последовательность), например: 195.34.32.11. Кстати, это реальный IP-адрес DNS-сервера московского Интернет-провайдера “МТУ-Информ”). По IP-адресу в Интернете можно найти любой компьютер.
Если ваш компьютер подключен к Интернету на постоянной основе, то, скорее всего, у него уже есть и собственный IP-адрес. Тогда, чтобы позволить всем созерцать свою страничку, остается только установить специальную программу, называемую веб-сервером, и разместить саму страничку в папке, доступной для чтения по сети. Впрочем, это уже отдельная тема, и интересующихся установкой и настройкой веб-сервера мы отсылаем к специальной литературе.
Сервер для публикации. Не все имеют постоянное соединение с Интернетом. Тем, у кого соединение временное, гораздо проще разместить свою веб-страничку на каком-нибудь чужом компьютере, специально для этого настроенном. Это может быть, например, сервер вашего Интернет-провайдера (как прабило, все провайдеры предоставляют такую услугу бесплатно) или один из так называемых бесплатных Интернет-серверов. На бесплатном Интернет-сервере можно получить некоторое количество дискового пространства для своей веб-странички. Таких серверов в Интернете множество. Вот лишь некоторые из них: сообщество Geocities (www. yahoo, corn), XOOM (xoom.corn/home), российский сервер “Халява” (www.halyava.ru), сервер www.chat.ru и многие другие.
Отправка материалов серверу. Получив место на сервере, можно загрузить туда все файлы своей странички. Для этого удобнее всего воспользоваться так называемым FTP- соединением. При этом процесс загрузки файлов на сервер визуально мало отличается от привычного процесса копирования файлов. Например, в программе WS_FTP на левой панели видны файлы, расположенные на своем компьютере, а на правой -- файлы, расположенные на удаленном сервере. Для загрузки файлов на сервер необходимо их выделить и нажать кнопку Copy (Копировать).
Если вы собираетесь часто обновлять свою страницу, вам будет полезна служебная программа Ftpweb, написанная еще в 1996 г. компанией BIT Software (впоследствии переименованной в ABBYY). Эта программа может отслеживать, какие файлы странички были изменены с момента последней загрузки, и автоматически копировать их на сервер. От нас практически ничего при этом не требуется, кроме нажатия на кнопку Process (Исполнить). Программу до сих пор можно загрузить с сервера компании, хотя, к сожалению, новых ее версий не выпущено и, по всей види- мости, их выпуск не планируется.
Доменные имена. Как мы уже говорили выше, любой компьютер в Интернете имеет свой уникальный IP-адрес. Поэтому, если страничка лежит на компьютере с IP-адресом, например, 194.34.45.8 в каталоге /Mypаge, то любому пользователю для ее просмотра достаточно набрать в адресной строке броузера следующий адрес: http://194.34.45.8/Mypage. Однако запоминать и вводить адреса в цифровом виде не слишком удобно. Для облегчения задачи существует система так называемых доменных имен (DNS -- Domain Name System). Большинству IP-адресов поставлено в соответствие некоторое название -- доменное имя. Например, сайт Интернет-провайдера “Гласнет” находится по адресу http://www.glasnet.ru. Согласитесь, что запомнить и набрать такую запись человеку гораздо проще, чем бессмысленную комбинацию цифр.
Доменные имена выдаются в соответствии со строгими правилами. В конце имени, после последней точки, в них содержится так называемое имя домена верхнего уровня. В большинстве случаев это двухбуквенный код страны, которой принадлежит данный ресурс. Например, окончание .ru означает Россию, .иа -- Украину, .de -- Германию, .fr -- Францию и т. д. Обширный список кодов стран вы можете найти в Приложении 6. Кроме того, доменом верхнего уровня может являться также трехбуквенный код, означающий организационную принадлежность ресурса. Например, .com -- коммерческая организация, .gov -- правительственная, .mil -- военная и т. п.
Доменные имена читаются справа налево. Та часть доменного имени, которая расположена непосредственно перед последней точкой, называется доменным именем второго уровня. Домены второго уровня выдаются (обычно за деньги) владельцами доменов первого (верхнего) уровня. В любом случае, иметь собственный домен второго уровня считается достаточно престижным.
Владельцы доменных имен второго уровня, в свою очередь, могут распоряжаться доменными именами третьего уровня и т. д., но дальнейшее раз-вертывание имен в большинстве случаев имеет только декоративный смысл. Крайнюю левую позицию в записи доменного имени занимает сетевое имя компьютера (в локальной сети), на котором работает серверная программа. Многие дают этому компьютеру имя www, чтобы подчеркнуть, что его ресурсы относятся к службе World Wide Web -- тогда доменное имя сайта начинается с сочетания www.
Поясним сказанное на примере. Предположим, что имеется пользователь Сергей Сергеев, который зарегистрировался у провайдера Black Line, выбрав себе регистрационное имя (логин) sergesergeev. У провайдера, разумеется, есть собственный сервер и сайт с адресом www.blackline.ru. На этом сервере провайдер размещает веб-странички своих пользователей, каждую в отдельном каталоге. После того как Сергей Сергеев разместит свою веб-страничку на сервере провайдера, она будет, скорее всего, иметь адрес www.blackline.ru/~sergesergeev или просто www.blackline.ru/sergesergeev. Некоторые провайдеры вместо имени каталога позволяют использовать регистрационное имя в качестве домена третьего уровня, например, так: www.sergesergeev. blackline. ru.
Если же Сергей Сергеев решил разместить свою страничке на бесплатном сервере, например, в сообществе Geocities, то там ему выдадут какое-нибудь длинное имя, например: www.geocities.com/SiHconValley/6285. Сообщество Geocities -- это виртуальный город со своими виртуальными улицами, кварталами и домами. Веб-страница клиента в этом “городе” -- это как бы отдельное виртуальное домовладение. “Жители” этого “города” стараются селиться на тематических “улицах” по общим интересам, чтобы в свободное от основной работы время заходить друг к другу “в гости”. На самом деле, конечно. Silicon Valley (Кремниевая долина) -- это просто каталог на жестком диске, и возможно, что и “домовладение” (то есть веб-страничка) с номером 6285 в нем уже реально существует.
На первый взгляд, размещать свою Web-страничку на сервере, предоставляющем такой длинный адрес, не очень удобно, и многие стараются использовать место, которое предоставляет собственный сервис-провайдер. Однако вспомните о том, что сервис-провайдеров часто меняют. Если мы разместим свою страничку у провайдера, а затем решим его сменить, то потеряем к ней доступ. Тогда наши посетители, скорее всего, еще долго будут созерцать ее в законсервированном виде -- ведь мы не сможем ее обновлять. Зато когда веб-страничка расположена на Geocities или ином подобном сервере, никак не связанном с сервис-провайдером, то менять провайдеров можно сколько угодно без всякого ущерба для себя.
Здесь и далее все имена и названия гипотетические. Например, провайдера Black Line у нас не существует. В тех случаях, когда используются реальные названия, это специально указано в тексте.
Логин (login, от log in) --имя для входа в систему.
Здесь и далее мы опускаем префикс http://, указывающий на соответствующий сетевой протокол, поскольку в большинстве программ просмотра веб-страниц протокол http определен по умолчанию и данный префикс добавляется к адресу автоматически.
Можно, конечно, обо всем позаботиться заранее и поставить, например, переадресацию на новое местоположение странички, пока еще есть доступ к старому серверу. Однако не всегда у нас бывает возможность сразу обо всем подумать...
Регистрация имен. А как быть, если хочется сделать адрес странички более коротким, запоминающимся? Для этого существуют многочисленные службы переадресации, например: come.to, www.da.ru, attend.to (все названия реальные). Например, если Сергей Сергеев разместил на своей страничке информацию о своей фирме “Филин”, он может бесплатно зарегистрировать такие имена, как filin.da.ru(или www.filin.da.ru), come.to/filin и т. п. При этом пользователь, набравший эти адреса в своем броузере, будет автоматически переадресовываться на веб-страничку, размещенную где угодно: на сервере провайдера, на сервере Geocities или еще где-нибудь.
Ну, а если вы хотите приобрести для себя домен второго уровня (например www.filin.ru), то вам придется обратиться в соответствующую организацию. Так, например, распределением имен в домене .ru занимается организация РосНИИРОС (www.ripn.ru). За регистрацию в этом случае придется заплатить деньги, однако в итоге вы будете иметь легко запоминающийся адрес. Кстати, многие пользователи, игнорируя услуги поисковых машин, часто пытаются найти веб-странички, набирая наугад адреса типа www.имя.Компания.ru, так что, имея такое имя, вы получаете большие шансы на посещение.
Мы, вообще говоря, еще не рассмотрели вопрос, как сделать так, чтобы пользователи узнали о существовании нашей веб-странички. Способов для этого существует множество. Можно представить ее поисковым системам, чтобы они включили ее в свои базы указателей. Можно подключиться к системе баннерного обмена и пр.
ГЛАВА 4. СОЗДАНИЕ САЙТА «КАТАЛОГА ХОСТИНГОВЫХ КОМПАНИЙ»
4.1 Описание проекта
Каждый выбирает свой инструмент для создания Web-сайта. Это может быть MS FrontPage или Macromedia DreamWeaver, Allaire HomeSite или 1st Page 2000. А кто-то пользуется простым текстовым редактором, например Блокнотом (Notepad).
Текстовые редакторы возможно использовать только для создания небольших страниц, так как у них есть много минусов: не поддерживаются проекты, отсутствует "подсветка" текста.
В разработке дипломного проекта использовался DreamWeaver. Этот програмный продукт расчитан на тех, кто плохо, или почти не знает язык HTML, хотя в нем можно создавать сайты даже не обладая данными знаниями. Dreamweaver содержит все, что необходимо как для визуальной компоновки web-страниц, так и для работы с HTML-кодом, а так же в нем поддерживаются другие языки программирования, такие как C#, PHP, Perl. Непосредственно в Dreamweaver можно создавать анимации в формате Macromedia Flash, использовать данные из Microsoft Office.
В дипломном проекте использовался язык web-программирования PHP. Язык HTML хорош по своему и годится в основном только для создания самих страниц сайта, но если задумываться о программной начинке своего Web-сайта, то тут не обойтись без серверного языка программирования такого как PHP.
Целью дипломной работы было разработать сайт интернет-каталога хостинговых компаний, на котором человек ищущий подходящий хостинг для своего сайта смог ознакомиться со всеми тарифными планами, которые предлагают различны хостинговые компании и сделать свой выбор в пользу того или иного хостера. На сайте будет представлена различная информация по тарифным планам, а так же перечень тех функций которые предлагают хостинговые компании.
Структура Web-сайта:
1. Главная страница - на главной странице сайта находятся элементы управления для быстрой навигации к самым просматриваемым посетителями разделам сайта.
2. Страница простого поиска хостинга(Быстрого поиска) - на этой странице содержится минимум элементов управления, задающие параметры для поиска тарифного плана. Эта страница лишена избыточности в элементах управления и будет полезна тем, кто ищет нужный тарифный план с минимумом необходимых ему дополнительных функций на сервере хостинга.
3. Страница расширенного поиска - для более точного поиска в эту страницу включены дополнительные функции тарифных планов с возможностью включения или отключения той или иной функции в условие поиска. Это такие дополнитеьные функции как: поддержка MySQL, выделенные IP адреса, панель управления базами данных PhpMyAdmin, поддержка Shell, ASP, Microsoft SQL, Cron, тестовый период и т.д.
4. Страница отзыва клиентов о тарифных планах хостингов - на этой странице посетители каталога могут оставить свою оценку о качестве услуг предоставляемых хостинг-провайдером, клиентами которого они являются. По десятибальной системе оценок можно оставить свою оценку по следующим показателям: скорость доступа, доступность сервера (uptime), уровень поддержки клиентов, стоимость услуг. А так же есть возможность оставить свое мнение о хостинге в целом.
5. Страница регистрации в каталоге - на этой странице происходит регистрация пользователей каталога.
6. Страница восстановления пароля - В случае утери пароля пользователи каталога смогут его восстановить через эту страницу.
СПИСОК ИСПОЛЬЗОВАННОЙ ЛИТЕРАТУРЫ:
1. Вин Дж. Искусство WEB-дизайна. Самоучитель. - СПб.: Питер, 2003. -224 с.
2. Григин И.Е. РНР 5.1. Руководство программиста. - СПб.: Питер, 2006. - 490 с.
3. Дронов В.А. Самоучитель. Macromedia Dreamweaver 8. - СПб.: БХВ-Петербург, 2006. - 320 с.
4. Дунаев В. Самоучитель Java Script. 2-е издание. СПб.: Питер, 2006. - 395 с.
5. Кингсли-Хью Э., Кингсли-Хью К. Java Script 1.5. Учебный курс. - СПб.: Питер, 2002. - 272 с.
6. Комолова Н.В. HTML. Учебный курс. - СПб.: Питер, 2006. - 268 с.
7. Курушин В.Д. Графический дизайн и реклама. Самоучитель. - М.: ДМК Пресс, 2001. 272 с.
8. Леонтьев Б.К. Web-дизайн: руководство пользователя. - М.: Познавательная книга плюс, 2001. - 320 с.
9. Розенсон И.А. Основы теории дизайна. Учебник для ВУЗов. - СПб.: Питер, 2007. - 219 с.
10. Уотролл Э. Dreamweaver МХ 2004. Трюки. СПб: Питер, 2006 - 367 с.
11. Холмогоров В. Основы WEB-мастерства. Учебный курс. 2-е издание. - СПб.: Питер, 2003. - 320 с.
12. Антипов С.В. Современные технологии разработки WEB-сайтов. // Информатика и образование - № 3 2004, 57-60 с.
13. Мержанова М. Создаём свой первый сайт.// Мир ПК - №6 2004, 76-83 с.
14. Прохоров А. Обзор HTML-редакторов.// Компьтер ПРЕСС - №2 2004, 45-50 с.
15. Титоров Д.Ю. Создание Интернета образовательного учреждения.// Информатика и образование - № 5 2006, 42-57 с.
16. Шляхтина С. Джентльменский набор для быстрого создания сайта.// Компьтер ПРЕСС - №2 2007, 83-88 с.
Размещено на Allbest.ru
Подобные документы
Современные Интернет-технологии, Web-дизайн и браузеры. Язык разметки гипертекстовых страниц HTML. Представление текста и графики на Web-страницах. Правила и этапы создания сайта. Влияние дисплеев на Web-дизайн. Сравнительный анализ HTML-редакторов.
дипломная работа [3,3 M], добавлен 21.06.2013Язык разметки гипертекстовых страниц HTML. Обеспечение доступности Web-страницы, представление текста и графики. Основные правила и этапы создания сайта, выбор структуры страницы. Оценка экономической целесообразности использования HTML-редакторов.
дипломная работа [86,7 K], добавлен 25.03.2013Работа с HTML-редактором Adobe Dreamweaver. Этапы и правила построения заглавной страницы сайта, форматирования HTML-страниц, создания гипертекстовых ссылок, создания и форматирования таблиц. Использование графических материалов при разработке сайта.
методичка [1,9 M], добавлен 06.07.2011История развития информационных технологий. Появление Интернета, браузеры. Основы web-программирования: классификация сайтов, языки программирования. Создание сайта для кафедры высшего учебного заведения: технология создания и руководство пользователя.
дипломная работа [471,5 K], добавлен 23.04.2015Hyper Text Markup Language (html) как стандартный язык для создания гипертекстовых документов в среде web. Тэги списков, гипертекстовые ссылки, графика внутри документа, специальные тэги html и таблицы. Планирование фреймов. Этапы создания сайтов.
контрольная работа [126,9 K], добавлен 18.11.2010Электронная розничная торговля как эффективный канал сбыта для традиционных торговых фирм. Последовательность создания рабочего каталога, где будут размещаться все необходимые для сайта графические и HTML–файлы. Структура будущего сайта, HTML–документы.
курсовая работа [41,1 K], добавлен 10.08.2011Основы языка программирования Web-страниц – HTML. Виды информации, которую может содержать Web-страница: текст, графика, звук, анимация и видео. Инструментарий для создания Web-страниц. Основные HTML-редакторы, которые используются для Web-дизайна.
реферат [374,0 K], добавлен 19.01.2011Создание сайта при помощи HTML и CSS. Язык гипертекстовой разметки HTML и таблица стилей CSS. Основные понятия об этих языках, этапы и алгоритмы программного обеспечения. Добавление стилей в документ. Свойства элементов, принцип построения Web-страницы.
курсовая работа [2,9 M], добавлен 12.01.2016Практическая значимость создания сайта. Язык программирования JavaScript. Основные области использования языка JavaScript при создании интерактивных HTML-страниц. Язык программирования PHP. Программная основа сайта. Создание оформления дизайна сайта.
дипломная работа [1,1 M], добавлен 05.03.2013Особенности программирования на языке HTML и JavaScript. Основные стили форматирования текста. Анализ основных приемов и методов создания страниц, рисунков, таблиц и гиперссылок. Основные цвета и их коды. Разработка собственного сайта и его презентация.
курсовая работа [61,3 K], добавлен 29.01.2016
