Методы создания и сопровождения сайта

Введение

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

Эксперты
прогнозируют, что через десять лет около 50% семей (пока, конечно, только в
развитых странах) будут пользоваться им ежедневно. Телевизионные и
радиоприемники не будут заменены компьютерами, а будут иметь мощный процессор,
большую память и в некоторых отношениях даже станут самими компьютерами.

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

Каждый
из нас уже может внести свой вклад в развитие интернета. Все, что вам нужно
сделать, это создать свой собственный сайт и разместить его в Интернете. Но как
мы можем это сделать? Ответ на этот вопрос мы постараемся дать в этой статье.

Для этого должны быть решены следующие частные задачи:

• Ознакомьтесь с основными правилами и рекомендациями по разработке и созданию веб-сайтов и строго придерживайтесь их в своей практике;
• принять решение о структуре веб-сайтов;
• выбрать стратегию развития и создания сайта.

Основные правила и этапы создания сайта

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

Предсказать все невозможно, но вначале можно следовать следующим правилам:

• При разработке веб-сайта с научным или академическим содержанием следует обратить особое внимание на то, как работает веб-сайт в Lynx (или в любом другом неграфическом браузере);
• если сайт предназначен для потребителей — например, сайт, предлагающий обучающие игрушки для детей — внимание будет обращено на скорость загрузки и внешний вид сайта для браузеров AOL
• Если это сайт для контролируемой среды, такой как корпоративная среда, то знание того, какой именно браузер и платформу используют ваши клиенты, позволит вам показать все, что может сделать браузер, включая звуковые эффекты — свистки, звонки и даже ваши собственные разработки;
• если сайт компьютерных игр разрабатывается для молодых фанатов, то, скорее всего, они используют последние версии браузеров и встраиваемых приложений (или они обязательно получат их, если вы скажете, что они им нужны).

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

Способов для создания сайта на сегодняшний день великое множество. наиболее распространенный метод создания сайтов – это создание сайта на основе страниц html.

Огромное количество сайтов во всемирной паутине сконструировано именно по такому типу. Хотя если говорить открыто – возможности при этом весьма ограничены. Да и создание динамических страниц, пользуясь только HTML – приведет только к тому, что мозг закипит уже на второй минуте.

В принципе, если HTML связать с элементами РНР кода – то может и выйти. Такие средства создания и сопровождения сайта являются базовыми, их должен знать и умело применять любой вебмастер.

1 Web-страницы и Web-сайты

Что такое Web-Страницы? С технической точки зрения Web-страница – это обычный текстовый файл, который можно создать в любом текстовом редакторе, том же Блокноте, стандартно поставляемом в составе Windows. Этот файл содержит собственно текст Web-страницы и различные команды форматирования этого самого текста.

Macromedia flash

Реально
ли размещать страницу с приличным количеством анимации, звука и удивительных
возможностей интерактивности в файле размером около 100 Кбайт? Должен ли я
убедиться, что эта страница работает одинаково как в Netscape Navigator, так и
в Internet Explorer?

Альтернативные дисплеи

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

WebTV.
WebTV — устройство, которое превращает обычную телевизионную и телефонную линию
в веб-браузер, вышло на рынок в 1996 году и постепенно, но неуклонно расширяло
свою нишу. Однако по мере роста числа пользователей некоторые дизайнеры
учитывают специфические требования к этому устройству. Некоторые сайты
разработаны специально для WebTV.

WebTV
использует телевизор в качестве устройства отображения. Рабочая область WebTV —
544×378 пикселей. Браузер позволяет переворачивать страницы по вертикали, но не
имеет горизонтальной прокрутки, поэтому более широкая графика частично невидима
и недоступна.

Влияние рекламы на веб-дизайн

Как
многие типы дисплеев и условия отображения влияют на процесс принятия решений
при проектировании страницы? Большинство слушателей различают экраны только по
размеру экрана (или, точнее, разрешению) и цветовым возможностям. Но важно
помнить, что на этом различия не заканчиваются.

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

Рабочее пространство («live») в окне браузера. Знание размера дисплея — это только часть работы, так как операционная система и сам браузер занимают довольно много места на экране. Сколько места на самом деле доступно в окне браузера (так называемое «рабочее» или «живое» пространство в окне браузера) зависит от операционной системы компьютера, используемого браузера и индивидуальных настроек пользователя.

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

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

Характеристики
цветов дисплея. Мониторы, если они цветные, различаются по количеству
отображаемых цветов. Это еще один фактор, влияющий на решения разработчика.
Мониторы обычно производят 24-битные (16,77 млн. цветов), 16-битные (65 536
цветов) или 8-битные (256 цветов).

Цвета,
полученные в «истинном» 24-битном цветовом пространстве, искажаются
(отображаются пятнами и спеклами) при обработке браузерами на 8-битных
дисплеях.

Однако
существует набор из 216 цветов, состоящий из системных цветов MacOS и Windows,
которые не искажаются на 8-битных экранах. Одним из названий этого цветового
набора является палитра Web. Многие дизайнеры предпочитают использовать эту
палитру при создании веб-графики и элементов HTML, чтобы страница выглядела
одинаково для всех пользователей.

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

Второй способ создания сайтов

Второй способ создания сайтов будет немного посложнее. Тут используется системы управления контентом (CMS), или как пишут на форумах, для легкой ориентировки – с помощью “движка”. Таких “движков” тьма тьмущая по всей паутине. Большинство из них сегодня платные, но если покопаться, то можно найти и бесплатные.

В принципе самые простые (сравнительно) это «WORDPRESS» и «Joomla». Именно с помощью «WORDPRESS» создано большинство блогов.

Достоинств у такого “движка” вагон и маленькая тележка – это удобство и никаких лишних вливаний средств, то есть он бесплатный, невероятная простота установки и настройка, и конечно к нему есть масса плагинов, при подключении которых можно невероятно расширить функции этого самого “движка”. Минус только в том, что создатели плагинов не всегда заботятся об их совместимости.

А теперь о втором “движке” под названием Joomla. Этот “движок” – уникальная вещь, о которой говорить можно долго, но отнюдь не нудно: с помощью его можно создавать порталы, блоги и еще кучу разных фишек в таком же роде. Четыре слова – “Сайт русской поддержки Joomla” (а точнее один из сайтов) и у вас все получится!

Выбрать структуру веб-страницы

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

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

Достоинство:

• Реальность такова, что веб-сайты отображаются на дисплеях с разным разрешением; гибкую страницу можно настроить так, чтобы она отображалась на любом дисплее;
• все дисплейное пространство заполнено, нет нежелательного свободного места, которое часто планируют разработчики сайтов с фиксированными размерами;
• Дизайн гибких сторон ближе к золотой середине по духу и природе. Согласно таким стандартам, «хорошая» страница — это страница, доступная большинству пользователей.

Недостатки:

• Для больших дисплеев длина строки может быть слишком большой, если текст заполняет всю ширину окна браузера. Длинные строки особенно неудобны для чтения с экрана, поэтому условия чтения для многих пользователей значительно ухудшаются, если текст заполняет всю ширину окна или рамки;
• на больших дисплеях элементы расположены достаточно гармонично, на маленьких дисплеях они скучны.
• результаты гибкого дизайна непредсказуемы и сайт будет выглядеть по-разному у разных пользователей.

Разработка
страниц фиксированного размера. Если вы хотите больше контроля над макетами
страниц, проектируйте страницы с фиксированной шириной, которая является
постоянной для всех пользователей, независимо от изменения размера дисплея или
размера окна.

Достоинство:

• страница будет выглядеть одинаково независимо от размера дисплея. Это особенно важно для компаний, которые хотят представить свой имидж всем посетителям одинаково;
• Фиксированная ширина страниц и столбцов позволяет лучше управлять длинами строк. Вы можете использовать таблицы для предотвращения слишком длинных линий при отображении на больших экранах.

Недостатки:

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

Методическая разработка урока по информатики «способы создания и сопровождения сайта. визуальный редактор» | методическая разработка на тему: | образовательная социальная сеть

Первый способ создания сайта

Если использовать самый простейший способ, то действовать нужно в следующей последовательности:

• 1. создание шаблона на языке HTML;
• 2. копировать код изменяемых элементов и вынести его в отдельный файл, которому присваивается расширение «tpl»;
• 3. стираем код измененных элементов на страницах (только в такой последовательности);
• 4.на месте стертого HTML-кода на страницы вводятся только одна строчка РНР-кода. (В строчке этой – прописан путь до того самого файла с расширением «tpl» (такие строчки PHP-кода еще называют «инклудами»)).
• 5. меняем расширение страничек HTML, то есть мы меняем «html» на «php».

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

Разработка комбинированных веб-сайтов

Конечно,
нет необходимости в том, чтобы сайты были полностью фиксированными или гибкими.
Вы можете разработать дизайн сайта, который сочетает в себе оба подхода.

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

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

Список литературы

1. Гриб А. Макромедиа флэш 4 для дизайнеров. — М.: Компьютеры, 2003.
2. Крамер Н. HTML: визуальный курс веб-дизайна. — М.: Компьютеры, 2003.
3. Леонтьев И. Веб-дизайн. Руководство пользователя. — М.: Компьютеры, 2001.
4. Малекса А. Вспышка. Теория и практика. — М.: Компьютеры, 2004.
5. Niederst V. Webmastering для профессионалов. Каталог рабочего стола. — М.: Компьютеры, 2003.
6. Франклин С. Флэш 4: Анимация в интернете. — М.: Компьютеры, 2005.

Стратегия развития

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

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

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

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

Утверждение «посоветуйте
им установить новую версию — она бесплатная» часто звучит как оправдание
такой тактики. Кроме того, есть авторы, которые работают только с последней
версией определенного браузера. Обратите внимание, что такой подход может быть
весьма полезен в интранет-сетях.

Распределение
различий. Большинство дизайнеров предпочитают компромисс. В дизайнерских кругах
распространена поговорка о веб-сайтах, которые «изящно
деградировали», что означает, что новейшие технологии, такие как DHTML или
JavaScript, используются для того, чтобы заставить страницу работать на более
ранних версиях браузеров.

Каждый,
в соответствии со своими потребностями. Еще один успешный, но более трудоемкий
подход — создание нескольких версий сайта, рассчитанных на разные навыки
пользователей. Для некоторых сайтов пользователи могут решить, какую версию они
хотят видеть.

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

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

Типичные размеры и разрешение дисплея

Первым
шагом в определении вероятного размера вашего сайта должно быть определение
максимального пространства, которое будет доступно по объявлению. Компьютерные
экраны имеют различные стандартные размеры и обычно измеряются в дюймах.
Некоторые типичные размеры дисплея — 14″, 15″, 17″, 19″ и
21″.

Более
важной функцией является разрешение экрана — общее количество пикселей
(элементов изображения) на экране. Чем выше разрешение, тем более
детализированным может быть изображение. Если известно возможное количество
пикселей, можно создавать изображения (также измеренные в пикселях) и элементы
страниц соответственно.

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

По
этой причине измерения полотна производятся в пикселях, а не в дюймах. То, что
отображается в дюймах на вашей системе, может отображаться больше или меньше на
экранах других пользователей. Когда вы работаете с пикселями, вы знаете,
насколько велики объекты по отношению друг к другу.

Третий способ создания сайтов

И третий способ создания сайтов, так сказать для людей либо ленивых по своей природе, либо с нехваткой на это дело времени.

Вам нужно будет просто на просто открыть “блогер”, “живой журнал” или что-нибудь созданное на этом подобии и завести аккаунт. Там создание блога не займет много времени – на это потребуется все лишь несколько секунд или минут (все ориентируются на сайтах по-разному).

Тут конечно существует один такой большой и жирный минус! На вот таких вот сайтах где вы создаете аккаунт, у вас нет ни имени, ни рода, ни племени. Прикрыть вас могу быстрее, чем кто-либо скажет: “Безперспективняк!” Прав у вас как таковых – мизер и развернутся негде – везде возведены стены из запретов.

В общем, третий способ самый легкий, но и самый незначительный и не уважаемый, поскольку все хотят быть индивидуальными, а не идти под одной гребенкой со многими. Для начинающих блогеров – это конечно как маленький тренинг. Но конечно вот таким вот блогам до «WORDPRESS» как до другого края вселенной.

Тут только три способа создания сайтов. Но на этом средства создания и сопровождения сайта не заканчиваются. Многие вебмастера используют сторонние программы, например Photoshop. Но это уже тема другой статьи.

Заключение

В данной работе рассматриваются актуальные вопросы разработки и создания современного веб-сайта.

Я решил следующие частные задачи:

• Знакомство с современными Интернет-технологиями и их использование
• Знакомство с основными правилами и рекомендациями по разработке и созданию сайтов и их строгое соблюдение на практике;
• чтобы определить структуру веб-страниц;
• Выбор стратегии развития и создания сайтов.

В
результате проделанной работы на основе выбранных технологий был создан
прототип современного сайта.

Его основные отличительные особенности заключаются в следующем:

• небольшой размер файлов с кодами веб-страниц (их перечень указан в приложении), что обеспечивает их быструю загрузку из сети на клиентский компьютер
• Используется векторный формат графики, сжатые форматы растровых и звуковых файлов, что также положительно сказывается на уменьшении размера веб-страниц и времени их загрузки по сетевым каналам;
• Нет проблем совместимости с различными браузерами, такими как Internet Explorer и Netscape Navigator.
• автоматическая поддержка сглаживания (сглаживание контура путем смешивания смежных цветов), что значительно улучшает эстетическое восприятие используемой графики
• Гибкость, открытость и модифицируемость простыми средствами.

Среди существующих недостатков можно назвать следующие:

• Необходимость овладеть идеологией и инструментами Macromedia Flash 5.0 — современными профессиональными инструментами для создания сайтов;
• вынужден использовать плагин Flash Java Player для существующих версий браузеров (обновленные версии браузеров еще не выпущены) для корректного отображения Flash-страниц.
• Методология процесса разработки и создания сайта, использованная в этой работе, была апробирована и исследована в реальных условиях моей профессиональной деятельности и показала работоспособность и эффективность.

Таким
образом, материалы работы показывают, что задачи, упомянутые во введении выше,
полностью выполнены.