Используйте графический редактор. Очень удобно скопировать окно браузера (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). Убедитесь все работает так, как вы предполагали.