Пример воображаемого сайта
Этот воображаемый сайт принадлежит компании, которая создает свободно распространяемый (Open Source) код для wiki, и в среднем в неделю они создают не менее трех новых вариантов кода. Так как код является бесплатным для использования и модификации, то владельцы сайта хотят монетизировать сайт (получать от него деньги) через пожертвования, размещение рекламыи дополнительные услуги, предлагаемые программистами. Название сайта "Wiki Whatevers" и имя домена были выбраны. Контент был разработан, и он содержит фрагменты кода, каталоги которых надо создать, статьи и биографии некоторых программистов, участвующих в этом проекте. Web-хост обеспечивает доступность базы данных MySQL (http://www.mysql.com/), и может обеспечить самые большие всплески трафика без простоя. Теперь пора собрать вместе все объекты, которые будут использоваться на сайте:
Для применения существующего логотипа компании необходимо подготовить его цифровую копию для использования на Web-сайте клиента. Для этого требуется сканер для сканирования изображения в графической программе, такой как Photoshop (http://www.adobe.com/products/photoshop/index.html) или Gimp (http://www.gimp.org/). Размер логотипа я определю позже, когда будет определена компоновка. Я сохраняю изображение с разрешением 72 dpi (dot per inch), что позволит получить более быстрое время загрузки. Возможно, что этот логотип будет использоваться также для пункта #4 ниже.
Фотографии программистов будут использоваться на странице персонала (или странице "About"), поэтому для этого проекта необходимо получить их цифровые изображения. Они могут либо предоставить фотографии для сканирования или прислать цифровые изображения. Если они присылают цифровые изображения, то желательно иметь размер больше планируемого, поэтому подходящим будет изображение 300 dpi, или полноразмерное изображение, которое можно будет уменьшить потом до требуемого размера.
Клиент решил использовать блог, так как они уже имеют достаточно контента для поддержания этого блога в активном состоянии в течение нескольких следующих месяцев. К счастью, клиент выбрал провайдера Web-хостинга, который знаком с блогами и имеет необходимые возможности для работы с базами данных и высоким трафиком — включая пиковые нагрузки трафика. Этот хост предоставляет также несколько решений для расширения, отличное предложение, если клиент захочет развиваться. Если рабочее время хоста гарантировано, то клиенту будет удобнее оставаться с тем же хостом в течение всей фазы роста. Эта возможность оставаться с поставщиком хост-услуг в течение ряда лет существенно облегчает жизнь.
С помощью FTP (на рынке существует несколько вариантов для выбора, свободно доступные продукты, такие как Filezilla (http://filezilla-project.org/), или fireftp (http://fireftp.mozdev.org/) для Firefox, или коммерческие клиенты, такие как CuteFTP (http://www.cuteftp.com/)), я загружаю статическую страницу, которая объявляет о скором появлении сайта.. "Under Construction" является ужасной фразой, которую иногда используют, так как посетители сайта могут не вернуться, если они не будут знать дату "открытия". Вместо этого используйте страницу, которая содержит название компании, что они собираются предложить, дату, когда сайт станет активным, и контактную информацию (адрес e-mail отлично подходит — если компания имеет стандартный офис, используйте также почтовый адрес и номер телефона). Еще лучше использовать форму e-mail, которую посетители могут использовать, чтобы получить уведомление, когда сайт заработает. Последнее предложение создает для клиента потенциальных заказчиков, даже еще до того, как сайт будет готов к работе.
Используя информацию о контенте/структуре, полученную от клиента, и тот факт, что они хотят, чтобы рекламное пространство было встроено во все страницы, я создаю архитектуру для сайта и планирую средства перемещения и текстовые ссылки. Я использую также эту копию для планирования ключевых слов для SEO сайта.
Используя цвета логотипа, я выберу две или три цветовые схемы для представления клиенту для утверждения.
Затем я выберу другие фотографии или иллюстрации в базе данных фотоматериалов, такой как iStock (http://www.istockphoto.com/index.php) или Comstock (http://www.comstock.com/web/default.asp). Но обязательно поищите различные варианты, так как некоторые компании фотоматериалов предлагают распродажи и другие выгодные сделки, от которых бывает трудно отказаться. Использование баз данных фотоматериалов не так дорого, и избавляет от проблем, связанных с вопросами авторских прав (http://www.templetons.com/brad/copymyths.html). Мне понадобятся также любые изображения, созданные компанией — или которые они создадут — чтобы сопроводить какой-либо код, статьи "как сделать", и записи блога.
Примечание: Два последних шага будут рассмотрены в следующей лекции курса; помните, что клиент должен утвердить компоновку визуального макета, прежде чем начинать добавлять ко всему этому цвета и графику!