Опубликован: 28.11.2008 | Уровень: для всех | Доступ: платный
Лекция 9:

Создание каркаса сайта

< Лекция 8 || Лекция 9: 1234 || Лекция 10 >

О рекламе на сайте

Достоинством для клиента и услугой для читателя будет контекстно-зависимая реклама на сайте. Другими словами, если контент сайта посвящен цветам, то реклама для этого сайта может включать услуги ландшафтного дизайна, выездное обслуживание (в дополнение к цветочным аранжировкам), и т.д. Поэтому для сайта, который предоставляет программные материалы с открытым кодом, можно поискать рекламу, которая соответствует программному обеспечению с открытым кодом. Google Adsense (https://www.google.com/adsense/), как один из источников, может помочь в этом отношении, так как реклама является связанной с контентом. Использование такого типа рекламы является хорошей идеей, пока трафик не вырастет в достаточной степени, чтобы привлечь на сайт других рекламодателей. Однако всегда думайте о последствиях для SEO, прежде чем принимать рекламные объявления, так как некоторая реклама может отрицательно влиять на позицию клиента на страницах поиска. Некоторыми хорошими ресурсами по SEO являются следующие:

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

Проверка компоновки с помощью валидаторов и с клиентом

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

Следующий шаг состоит в кодировании компоновки и последующей валидации кода. Для подтверждения того, что использованный для компоновки код HTML и CSS не содержит ошибок, я применяю службы W3C Markup Validation Service (http://validator.w3.org/) и W3C CSS Validation Service (http://jigsaw.w3.org/css-validator/). В эти службы валидации можно загрузить файлы прямо со своего компьютера, поэтому нет необходимости загружать их на сайт клиента для тестирования. Этот тест позволяет дизайнеру и/или программисту найти все ошибки во внешнем интерфейсе, которые можно разрешить, прежде чем сайт станет наполняться кодом от изображений, рекламы, и других объектов, добавляемых на страницу.

Доступность является еще одной большой проблемой — проверка, что сайт могут использовать люди с физическими недостатками, такими как слепота или моторная недостаточность. Это не такой простой процесс проверки, как в случае валидации CSS и HTML. Существуют средства проверки, такие как TAWDIS (http://www.tawdis.net/taw3/cms/en), но в идеале это нужно тестировать с реальными пользователями, и выполнить качественный анализ своих сайтов на доступность — механизированное средство проверки не может окончательно сказать, будет ли сайт доступен или нет, хотя оно может дать некоторые указания, что правильно, а что неправильно. Иногда могут также возникать ошибочные решения. В дальнейшем в курсе будет представлена более полная информация о доступности.

Необходимо также протестировать компоновку на различных доступных браузерах, чтобы знать, что Web-сайт сможет просматривать максимально возможное число пользователей Web. Это можно сделать, имея доступными системы Mac, Windows, Linux и Mobile, все с различными установленными браузерами, или использовать эмуляторы, такие как VMWare Fusion (http://en.wikipedia.org/wiki/VMware_Fusion) для моделирования различных систем на одном компьютере, но это достаточно кропотливо и длительно. Другая возможность состоит в использовании специальных служб, таких как BrowserCam (http://www.browsercam.com/Default2.aspx), которые позволяют увидеть, как будет выглядеть страница на различных браузерах и системах (включая большинство старых браузеров). Они предлагают 24-часовой бесплатный пробный период, чтобы можно было убедиться, что эта служба вам подходит. Плата за использование после пробного периода себя оправдывает, особенно, если вы проектируете большое число сайтов и тестируете на большом числе различных браузеров.

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

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

Заключение

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

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

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

Дополнительное чтение

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

Контрольные вопросы

  • Что необходимо иметь под рукой, прежде чем начинать разрабатывать дизайн Web-страницы?
  • Почему необходимо создать список всех объектов, которые планируется использовать на странице Web?
  • Почему важно тщательно выбирать провайдера Web-хостинга?
  • Дизайнер может выполнять многие функции, но что нужно сделать, если клиент просит создать логотип, а вы не имеете никакого представления о том, что надо делать?
  • Назовите две важные причины для исследования Web-сайтов конкурентов компании.
  • Что такое CMYK, и что означают эти буквы?
  • Назовите, по крайней мере, два способа преобразования CMYK в соответствующие цвета RGB.
  • Назовите одну из причин, почему дизайнер должен использовать текст для навигации, по крайней мере, в одной области компоновки Web-страницы?
  • Почему дизайнер должен придерживаться согласованной компоновки сайта Web на всех страницах сайта?
  • Назовите одну из причин, почему код сайта должен пройти валидацию на ранних этапах дизайна.

Об авторе

Линда Гоин получила степень бакалавра (BFA) в области визуальной коммуникации со специализацией в бизнесе и маркетинге, и степень MA по Американской истории со специализацией по Реформации. Хотя последняя степень кажется не соответствующей первому полученному образованию, Линда использует свой 25-летний опыт дизайна на сайтах, посвященных археологическим раскопкам и изучению материальной культуры.

Похвальные отзывы о ее работе включают пятнадцать первых премий Colorado Press Association, многочисленные премии по изящным искусствам и графическому дизайну, и интервью о разработке контента в The Wall St. Journal, Chicago Tribune, Psychology Today, и L.A. Times. Линда является автором нескольких е-книг по Web- дизайну, доступности и — как побочная линия — пишет также персональные финансовые статьи и пишет для некоторых SEO pros.

Материалы этого курса имеют лицензию Creative Commons Attribution, Non Commercial - Share Alike 2.5 license.
< Лекция 8 || Лекция 9: 1234 || Лекция 10 >
Марина Походаева
Марина Походаева

Помогите мне. Я ничего не понимаю в курсе ((((((   (от слова "совсем") и мне от этого очень грустно. Есть ли какие-нибудь курсы для "чайников", самые простые в объяснении. ПАМАГИТЕ!!!

Федор Антонов
Федор Антонов

Здравствуйте!

Записался на ваш курс, но не понимаю как произвести оплату.

Надо ли писать заявление и, если да, то куда отправлять?

как я получу диплом о профессиональной переподготовке?

Анатолий Федоров
Анатолий Федоров
Россия, Москва, Московский государственный университет им. М. В. Ломоносова, 1989
Галина Матрук
Галина Матрук
Молдова, Республика, Кишинев, UTM, 2010