Быстрый поиск

Реферат: Администрирование локальных сетей

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

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

- Будут ли страницы генерироваться "на лету" из датабазы?

- - Будут ли использованы Cascading Style Sheets (CSS)?

- - Потребуется ли наличие модуля (plug-in) или специального контроля на машине пользователя?

- - Под какой минимум необходимо оптимизировать цветовую палитру?

- - Вы будете писать код сами или использовать WYSIWYG "Что вижу, то и получаю" эдитор (Dreamweaver, к примеру)?

- - Будут ли использованы DHTML, Channels, Push технологии?

Затем вы должны определиться с навигацией. Как будет посетитель продвигаться по сайту? Какая связь существует между страницами, куда можно попасть от куда и т.д. Для большинства проектов нет нужды придумывать новые навигационные схемы. Учитесь на сайтах, которые вам нравятся больше всего: проще - лучше. Подгоните существующую удачную модель под нужды своего проекта и используйте ее. Людям необходима возможность легко передвигаться по сайту, только и всего.

Дизайн интерфейса.

Творческие поиски и разработка стиля
Создание прототипов
Утверждение заказчиком
Графическое производство: дизайн датабаз и форм, анимации, графика в GIF/Jpeg, обработка в html.

Вы изучили своего заказчика, представляете содержание каждой будущей страницы и вовсю идет работа над текстами. Самое время заняться интерфейсом. Начните с самой важной страницы, работайте над ней до тех пор, пока у вас не будет как минимум 15 набросков различных вариантов, из которых 5 можно развить дальше. Когда страничка начнет дымиться, поработайте над другими. Продолжайте искать идеи, рисовать и думать. Попробуйте поэксперементировать с различными эффектами: real audio/vidio, динамическое html, необычное использование тегов и т.д.

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

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

Используйте графический редактор. Очень удобно скопировать окно браузера (F13 или Print Scrn, далее Ctrl+double click в окне графического редактора, затем Ctrl+V в новый файл) в Фотошоп или Иллюстратор и накладывать слои композиции прямо на него.

Выберите 3 законченных варианта: ваш любимый, несколько экстравагантный и консервативный, который, вы уверены, понравится заказчику. Создайте для них прототипы, которые он сможет посмотреть и одобрить. Прототип - черновой вариант слинкованных между собой основных страниц сайта. Не обязательно писать код для этих страниц, вы прекрасно можете обойтись image-maps. Пореже страницы на части и пролинкуйте графику между собой. Не тратьте время на ее оптимизацию, и объясните заказчику, что она немного потеряет в качестве при дальнейшей обработке. Задача прототипов - хорошо смотреться в окне браузера и понравится заказчику.

Программирование.

Создание: CGI, Javascript, Java, формы, датабазы
HTML: кодирование
Валидация: содержания, грамматических ошибок, работы линков
Тестирование в различных браузерах.

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

Несколько советов:

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

2. Рассортируйте ваши графические файлы по классам в зависимости от их размера. Старайтесь держать количество таких классов минимальным. Например: заголовки, подзаголовки, "ноготки", полная графика и т.д. Графические размеры от 1 до 5.

3. Подберите оптимальную палитру для графики в одном отдельно взятом классе и используйте ее на всех файлах данного класса. Работая над большим сайтом удобно использoвать DeBabelizer (http://www.equilibrium.com), сценарии которого позволяют очень быстро и точно процессить большое кол-во файлов. Так же, он, в отличие от Photoshop (http://www.adobe.com), не сдвигает цвета "безопасной веб-палитры" в сторону при оптимизации.

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

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

6. Если на странице очень много текста и других материалов, удалите все "возвраты каретки" и коменты из кода, что существенно снизит размер файла.

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

8. Делайте копии (Back up?) того, что сделали каждый день по окончанию работы.

9. Проверяйте свою работу на разных браузерах и основных ОС. Поменяйте настройки в браузерах выставив большие или маленькие размеры шрифтов, изменив цветовые настройки, откройте все меню и бары которые имеются.

10. Проверяйте:

- Грамматику

- - Правильное название файлов

- - Работу линков

- - Название страниц в поле Титул

- - Фоновые цвета

- - Целостность и тегов

- - Визуальное выравнивание

- - Что получится при изменении размеров окна браузера, шрифтов, цветов?

- - Различия резолюций. А как оно будет смотреться в монохроме?

11. Тестируйте, тестируйте и еще раз тестируйте. Подключайте как можно больше людей к этому процессу. Для заказчика это отличная возможность "поучаствовать" в проекте. Если есть возможность проверить на будущих посетителях, не упускайте ее. Внимательно следите как люди со свежим взглядом на сайт реагируют на вашу навигацию и систему наименований. Не пытайтесь помочь им "найти" что-либо, но попросите комментировать каждый шаг. Например, куда они ожидают попасть при клике на ту или иную кнопку? Часто бывает очень удобно распечатать весь сайт на бумаге и проверять стилистические и грамматические ошибки таким образом.

Сравнительная таблица популярности браузеров (по данным StatMarket за Январь 2001)

Microsoft 68.94% Netscape 29.09% Other 1.96

Публикация и Маркетинг.

Публикация:

Выбор хост-провайдера, покупка или регистрация имени домейна
FTP веб-сайта на сервер: создание дерикторий, установка permissions
Последние проверки и валидации

Маркетинг:

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

Последние работы над сайтом могут включать следующее:

- Создание банеров/заголовков про запас

- - Добaвление последнего контекста

- - Запуск CGI сценариев

- - обновление линков (старайтесь всегда давать условные пути к документам, а не полный URL. К примеру, ../images/dot.gif вместо http://www.yoursite.ru/images/dot.gif Таким образом вам не придется менять данные во всех ссылках при переносе сайта на сервер нового провайдера, если в будущем возникнет подобная необходимость.)

- - написание мета-тегов

- - добавление авторских прав и предупреждений

- - убедитесь, что графика везде имеет атрибуты width и height, соответствует основной цветовой палитре, имеет "Alt" пояснения.

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

- Краткость и Простота. Короткие адреса легче запоминаются, в них сложнее сделать ошибку: Gazeta.ru, Pupkin.com

- - Описание. Хорошо, когда по адресу можно догадаться о содержании сайта. Имя компании не всегда является достаточным пояснением: beerclub.com тумана не напустит

- Запоминаемость. Лучшие адреса добавляют к простоте элемент интереса - частенько игру слов, как в www.anekdotov.net - который поможет посетителям помнить это название через часы, дни и месяцы. Идеально, когда адрес можно запомнить, услышав в разговоре или по радио. Скопируйте структуру сайта со своей машины на сервер заказчика и еще раз протестируйте каждую страничку в брaузере. Конфигурация чужого сервера может потребовать изменений в сценариях или расширениях файлов (htm вместо html). Убедитесь все работает так, как вы предполагали.

Проведите хорошую рекламную компанию своему сайту.

14. Веб-страницы и веб-приложения.

Классификация веб-объектов.

Спецификация DTD. Понятие ортогональности и методы ее реализации.

Согласно спецификации W3C минимальный html-документ обязательно должен содержать всего два тега, без которых вообще не является никаким документом. Это теги !DOCTYPE (DTD) и TITLE. Почему настолько важен тег содержащий DTD? Именно тег !DOCTYPE определяет то, что документ является HTML, а не, например, XML-файлом.

Пример:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"

"http://www.w3.org/TR/REC-html40/strict.dtd">

DTD – Document Type Definition – определяет тип и принадлежность документа, а так же его версия и некоторые другие параметры, как например, в спецификации DTD полностью описаны все теги HTML 4.2 менее чем на 20 страницах.

Ортогональность содержания и представления информации подразумевает собой независимость содержания информации от способа ее представления. Говоря упрощенным языком, это ситуация, когда информативность или информативная часть документа не зависит от способа ее отображения, дизайна, размещения, стилей, шрифтов и т.п. К сожалению, практически ни один из существующих на данный момент языков разметки не обладает в чистом виде таким свойством, за исключением XML, который наиболее близок к этому, но все равно еще в значительной мере остается на стадии разработки. Например, в том же языке HTML таблица может использоваться для предоставления информации именно как таблица, но может быть использована так же для размещения элементов дизайна в необходимом порядке и относительном расположении на странице.

Веб-страницы. Языки разметки. (HTML, XML)

Основы HTML

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

HTML-документ имеет достаточно строго структурирован:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>

<head>

<title>Untitled</title>

</head>

<body>

…

</body>

</html>

СПИСОК ЭЛЕМЕНТОВ HTML

базисные элементы (все документы на HTML должны содержать их)
определение структуры (вид задается параметрами программы-просмотрщика)
внешний вид (автор определяет внешний вид текста)
ссылки и графика
разделители
списки
фон и цвета
специальные символы
формы
таблицы
фреймы (frames)
язык Java
разное

Внимание: Если вам не ясна разница между HTML 2.0, HTML 3.0, HTML 3.2, и дополнениями Netscape, я советую прочитать комментарии W3C о развитии языка HTML.

УПОТРЕБЛЯЕМЫЕ СИМВОЛЫ

URL URL (адрес) внешнего файла (или просто имя файла в том же каталоге)

? Любое число (т.е. <H?> значит <H1>, <H2>, <H3>, и т.д.)

% Любой процент (т.е. <hr align=left width="%>" значит <hr align=left width="50%>", и т.д.)

*** Любой текст (т.е. ALT="***" значит заполните текст)

$$$$$$ Любое 16ричное число (т.е. BGCOLOR="#$$$$$$" значит BGCOLOR="#00FF1C", и т.д.)

,,, Разделенное запятыми (т.е. COORDS=",,," значит COORDS="0,0,50,50", и т.д.)

| Альтернативы (т.е. ALIGN=LEFT|RIGHT|CENTER значит один из них)

СОВМЕСТИМОСТЬ

(помните, HTML эволюционирует и просмотрщики бывают разные)

(без отметки) Включено в HTML 3.2;

должно работать с последними версиями просмотрщиков

N1.0 дополнение Netscape, введенное в Navigator'е версии 1.0

N1.1 дополнение Netscape, введенное в Navigator'е версии 1.1

N2.0 дополнение Netscape, введенное в Navigator'е версии 2.0

N3.0b дополнение Netscape, введенное в Navigator'е версии 3.0 бета

БАЗИСНЫЕ ЭЛЕМЕНТЫ
	Тип документа	<HTML></HTML>	(начало и конец файла)
	Имя документа	<TITLE></TITLE>	(должно быть в заголовке)
	Заголовок	<HEAD></HEAD>	(описание документа, например его имя)
	Тело	<BODY></BODY>	(содержимое страницы)