Идея, что «создать веб-сайт легко» существует с момента его создания, благодаря таким приложениям, как Microsoft FrontPage и Adobe Dreamweaver.
Однако, как скоро обнаружат многие неопытные веб-дизайнеры, создание одностраничного поклонения своему канарейке Борису (да упокоится его душа) и создание профессионального веб-сайта — две совершенно разные задачи. Для создания веб-сайта, который эффективно взаимодействует со своей аудиторией, может быть обновлен клиентом и выглядит визуально приятным, требуется целый ряд навыков — некоторые из которых лежат за пределами зоны комфорта большинства дизайнеров, особенно если они получены из печати фон.
Например, важно определить, какая технология лучше всего подходит, какую систему управления контентом использовать, где разместить сайт, как обеспечить кросс-браузерную совместимость и как обеспечить высокий рейтинг сайта в поисковых системах. Для непосвященных эти препятствия могут стать очень большими, очень быстрыми.
Так что работает, а что нет? Ну, как и следовало ожидать, это зависит . Как и в любом проекте, важные решения определяются целями проекта, бюджетом, временными рамками, опытом членов команды и личными предпочтениями участников.
Несмотря на то, что многие технологические решения часто лучше оставить фанатам, которые говорят в 1 и 0, есть несколько универсальных истин, применимых ко всем веб-проектам. Крайне важно, чтобы любой дизайнер, занимающийся веб-проектом, понимал эти основы, независимо от того, вырезали ли они код, толкали пиксели или разбирались в обоих.
Конкурс на стороне клиента
Многие веб-дизайнеры уже решили, прежде чем приступить к проекту, что он будет построен во Flash (или мультимедийном предложении Microsoft, Silverlight), даже не рассматривая трио веб-стандартов: HTML , CSS и JavaScript . Как настоящие дизайнеры, они хотят избежать ограничения своего творчества из-за проблем совместимости браузера и ограниченного набора параметров пользовательского интерфейса, поэтому они выбирают Flash , полагая, что они принимают правильное решение.
Понятно, почему мы, дизайнеры, так любим Flash, а почему бы и нет? Это чрезвычайно мощная среда, с помощью которой мы можем создавать приятные ощущения и раздвигать границы интерактивности и мультимедиа. Flash также имеет огромную базу для установки, поэтому он удобно обходит проблемы совместимости с браузерами, которые преследуют сайты на основе CSS в течение многих лет. Наконец, у Flash есть тот безошибочный фактор «вау», который полезен для того, чтобы уносить клиентов.
К сожалению, у Flash есть несколько грязных маленьких секретов. На самом деле, они не маленькие — взгляните на следующие недостатки, прежде чем вы решите создать свой следующий сайт во Flash:
- Flash-сайты плохо работают в поисковых системах по сравнению с сайтами, созданными с использованием HTML. Хотя Google за последние годы добился успехов в индексации контента, инженерам Google еще предстоит пройти долгий путь, прежде чем боты, сканирующие Интернет, смогут понять файл Flash до такой степени, которая может быть определена с помощью простых тегов HTML.
- Большинство сайтов Flash менее доступны для пользователей с ограниченными возможностями, чем их коллеги на основе HTML. Конечно, в каждый файл Flash встроены некоторые базовые функции навигации с помощью клавиатуры, но во многих браузерах переключение между объектом Flash и его контейнером HTML проблематично, так же как и перемещение объектов Flash с помощью устройств ввода, отличных от мыши или клавиатуры.
- Flash-сайты часто менее пригодны для использования, чем HTML / CSS-эквиваленты, при этом ключевые функции веб-браузера отображаются в окне, когда сайт создается во Flash. К ним относятся выделение текста для копирования и вставки, нажатие кнопки «Назад» для возврата на страницу, увеличение размера шрифта и предоставление пользователям возможности открывать ссылки в новых окнах. Это независимо от того, насколько красивый и интуитивно понятный интерфейс.
- Flash-сайты недоступны для просмотра большинству мобильных пользователей. Даже iPhone — феноменально успешный продукт для Apple в Австралии и, возможно, самое продвинутое портативное устройство на рынке — не может просматривать файлы Flash.
Конечно, есть много обстоятельств, когда имеет смысл использовать Flash: анимированные заголовки, встроенные фильмы и интерактивные интерфейсы, которые отличаются от основанной на документе модели Интернета, являются хорошими кандидатами. Тем не менее, эти обстоятельства редко предполагают создание сайта исключительно во Flash.
Как доказали такие сайты, как cssZenGarden.com , сайт не должен быть создан с помощью Flash, чтобы выглядеть красиво. Многие веб-дизайнеры прибегают к Flash, потому что это то, что они знают, и в результате клиент страдает. Между тем, поддержка CSS значительно улучшилась в современных веб-браузерах, и в настоящее время существует огромный выбор превосходных библиотек JavaScript, которые делают написание JavaScript гораздо более простой задачей, чем раньше. Нет смысла прибегать к Flash, когда старый добрый HTML и его сопутствующие технологии могут одинаково хорошо работать и избежать ошибок, перечисленных выше.
Серверная битва
Хотя обычно дизайнер может обладать некоторыми навыками в области HTML, CSS и JavaScript, программирование на серверном языке обычно предназначено для ИТ-ботаников этого мира (за исключением тех редких и раздражающих универсалов, которые превосходят обоих в левой части). — и правосторонняя деятельность).
Тем не менее, все больше и больше ролей требуют, чтобы дизайнеры чувствовали себя комфортно как с графикой, так и с написанием кода — даже если это всего лишь обновление шаблона Системы управления контентом, которая обеспечивает работу сайта.
Вот краткое изложение наиболее распространенных серверных языков, используемых в Интернете, и как они складываются.
- CGI-Perl: язык программирования Perl существует дольше, чем сама World Wide Web. Этот язык является текущим проектом с открытым исходным кодом, и любой хостинг-провайдер, которого вы используете, гарантированно установит его. Однако, если у вас нет веских оснований для изучения Perl, я бы посоветовал четко сформулировать — это печально известно тем, что его трудно изучать.
- PHP: Как и Perl, PHP также является языком с открытым исходным кодом. Однако, в отличие от Perl, PHP имеет репутацию привлечения новичков, в основном потому, что он очень прост в освоении и повсеместен среди провайдеров веб-хостинга. Простота использования PHP иногда рассматривается разработчиками как критика, поскольку она предоставляет новичкам «достаточно, чтобы повесить веревку». Однако популярность PHP неоспорима. Это также предпочтительный язык для многих бесплатных систем управления контентом и блогов (о которых мы поговорим позже в этой статье). Пакет XAMPP , установка PHP одним щелчком мыши и другими технологиями, которые интегрируются с PHP, является отличным пакетом, доступным для пользователей Windows, Mac и Linux.
- ASP.NET: для тех клиентов, которым не нравится доверять технологиям с открытым исходным кодом, ASP.NET от Microsoft может быть хорошим выбором. Среда разработки Visual Studio — естественный выбор для создания сайтов ASP.NET. Visual Studio значительно упрощает процесс создания веб-сайтов, но это обходится дорого — это и дорого, и требует много ресурсов (хотя есть бесплатная «экспресс-редакция»). К сожалению, код, который генерирует Visual Studio, часто неэффективен и не соответствует стандартам, а некоторые провайдеры веб-хостинга не имеют возможности для размещения страниц ASP.NET.
- Ruby: язык Ruby существует уже более десяти лет, но его популярность для создания веб-приложений возникла лишь недавно, в основном благодаря фреймворку веб-приложений под названием Ruby on Rails (или просто Rails, для краткости). Несмотря на немного странное название, Rails — это хорошо продуманная структура, которая заставляет разработчиков следовать передовым методикам с точки зрения структуры файлов, соглашений об именах файлов, повторного использования кода и модульного тестирования. Для овладения Rails требуется крутая кривая обучения, но те, кто упорствует, часто становятся вокальными евангелистами.
- Flex: Flex относится к набору технологий Adobe для разработки многофункциональных интернет-приложений — онлайн-приложений с гораздо более высокой степенью интерактивности, чем стандартное веб-приложение на основе браузера. Во Flex пользовательские интерфейсы определяются с использованием языка разметки MXML, взаимодействия на странице описаны в ActionScript, а конечный продукт запускается как файл Flash. Adobe предлагает бесплатно загрузить базовый комплект разработчика программного обеспечения Flex, но если вы планируете регулярно создавать сайты во Flex, то стоит заплатить за редактор Flex Builder Pro.
Как видите, выбор технологии для веб-проекта огромен. Неважно, хотите ли вы испачкать руки, или просто хотите понять, как эти пропеллерные головки в подвале вашего офиса проводят свое время, прилагая усилия, чтобы оценить фундаментальные различия между языками, перечисленными выше, вы станете лучшим веб-дизайнером. — хотя бы потому, что вы сможете лучше общаться со своими техническими коллегами.
Слабость в веб-разработке на стороне сервера может также улучшить ваши навыки кодирования на стороне клиента; возможно, если бы к большему количеству проектов веб-разработки подходы относились к разработке программного обеспечения, а не к печати, тогда было бы меньше испорченных веб-сайтов.
Системы управления контентом: на заказ или пакет?
В предыдущем разделе я утверждал, что дизайнеры должны изучать язык на стороне сервера. Теперь я рекомендую вам использовать альтернативный язык при создании вашего следующего веб-сайта. Это сбивает с толку, я знаю — терпеть меня!
Вот почему вы должны создать свой следующий сайт с использованием как можно меньшего количества пользовательского кода: ношение шляпы дизайнера и шляпы программиста, безусловно, дает вам конкурентное преимущество в веб-мире, но реальность такова, что большинство веб-сайтов по сути являются сайтами с контентом. Для таких сайтов достаточно Системы управления контентом (CMS).
Одной из самых сложных задач при создании веб-сайта является обеспечение того, чтобы клиент мог обновлять его самостоятельно, еще долго после завершения проекта. CMS является ключевым в достижении этой цели. Несмотря на то, что всегда найдутся клиенты, которые быстрее учатся, чем другие, также верно, что некоторые системы управления контентом гораздо легче изучать для нетехнических людей, чем другие.
Правда, бывают случаи, когда сайту, для которого вы разрабатываете, может потребоваться чисто пользовательский код, но в этих случаях более вероятно, что разработка (и дизайн) будет осуществляться собственными силами, а не внешним агентством. Если вы изобретаете колесо для своего клиента, вы должны использовать CMS.
Существует множество преимуществ использования хорошо зарекомендовавшей себя CMS вместо того, чтобы использовать собственную. Это включает:
- Безопасность. Использование CMS, которая постоянно развивается, означает, что с каждым обновлением улучшается безопасность продукта. Эти обновления могут исправить ранее не обнаруженные недостатки безопасности, адаптироваться к изменениям в работе браузеров или добавить поддержку обновленных версий баз данных. Написание пользовательского кода, доступного через Интернет, без затрат времени на дальнейшее тестирование и обновление этого кода, представляет большой риск для безопасности сайта вашего клиента, подвергающегося риску.
- Знакомство: идеальных CMS может и не быть, но на рынке их существует ограниченное число. Если случайно ваш клиент использовал ту же CMS до того, что вы выбрали для своего проекта, то кривая обучения обновлению своего сайта будет намного ниже. Это имеет смысл для бизнеса и делает вас хорошо выглядеть.
- Техническое обслуживание и поддержка: если код, который обеспечивает работу веб-сайта вашего клиента, является полностью индивидуальным, то ваш клиент будет в большей степени зависеть от ваших будущих изменений или изменений, чем если бы вы использовали установленную CMS. Хотя на первый взгляд это может показаться хитрым способом заблокировать их для повторного ведения бизнеса, такой подход может быть вредным для отношений клиент-поставщик — особенно если бывают случаи, когда вы не можете своевременно удовлетворить их запросы , Гораздо разумнее использовать CMS, для которой существует процветающее сообщество разработчиков, так что у вашего клиента есть альтернативный разработчик, к которому можно обратиться при необходимости.
Так что, если создание сайта с нуля — нет-нет, тогда возникает вопрос: «Какую CMS мне следует использовать?». Этот вопрос годами вызывал бурные дискуссии среди веб-разработчиков, и опять же, ответ «Это зависит».
К сожалению, всестороннее сравнение всех доступных CMS выходит за рамки этой статьи. Есть огромное количество факторов для рассмотрения. Вот пример (этот список — лишь верхушка айсберга):
- Содержит ли CMS функции, необходимые для этого сайта?
- Существуют ли унаследованные системы, с которыми CMS должен взаимодействовать?
- Насколько велико сообщество разработчиков, связанное с CMS?
- Удобно ли клиенту использовать решение с открытым исходным кодом?
- Какие есть планы по расширению сайта в будущем?
CMS с открытым исходным кодом часто идеально подходит для клиентов, чей бюджет проекта ограничен. Такие инструменты, как Drupal, Joomla, eZ Publish и WordPress, имеют открытый исходный код и написаны на PHP. У каждой упаковки есть свои сильные и слабые стороны, но все они заслуживают вашего внимания.
Отличное место для начала изучения пакетов CMS с открытым исходным кодом — opensourcecms.com . На сайте представлено более 100 CMS с открытым исходным кодом, с которыми вы можете экспериментировать, не устанавливая ничего на свой локальный компьютер.
Рейтинг в поисковых системах
Итак, вы запустили свой сайт и публикуете интересный и уникальный контент каждый день. Посетители должны приходить стаями толпами, верно? Ну, если люди не могут найти ваш сайт, то как они узнают, что он существует?
Если ваши файлы журнала сообщают вам, что только два человека посещают ваш сайт каждый день (а вы один из них), то вам, возможно, придется приложить некоторые усилия для оптимизации вашего сайта для поисковых систем. Поисковая оптимизация (SEO) — это общий термин, который охватывает то, как вы кодируете свой сайт, какой контент вы публикуете, как вы формулируете этот контент, какую структуру URL вы используете и как вы оцениваете в поисковых системах по различным фразам.
Мир SEO по-прежнему запятнан историями онлайн-консультантов по маркетингу, которые играют в Google нетрадиционными методами; они обманом заставляют алгоритм Google перечислять свой веб-сайт на страницах результатов выше, чем он, вероятно, заслуживает.
Правда, однако, заключается в том, что SEO является важным аспектом любого коммерческого веб-сайта, и есть много законных методов, которые вы можете и должны использовать, чтобы люди могли найти ваш сайт через поисковую систему. Хотя было бы невозможно описать, как разработать всеобъемлющую стратегию SEO на этих страницах, если вы последуете моему совету в начале этой статьи, чтобы использовать HTML вместо Flash, когда это необходимо, у вас все будет в порядке.
Одним из распространенных заблуждений является то, что рейтинг сайта в поисковой системе привязан к его PageRank. PageRank — это товарный знак, используемый Google для определения степени авторитетности веб-сайта. По сути, все работает так: чем больше ссылок на веб-сайт, тем важнее Google считает этот сайт и, следовательно, тем выше его PageRank.
Реально, однако, алгоритм, который определяет PageRank веб-сайта, является тщательно охраняемым секретом, и сам алгоритм постоянно меняется по мере роста сети. Кроме того, PageRank веб-сайта — это только один фактор, который влияет на его позицию на страницах результатов поиска Google. Наконец, важно помнить, что Google — всего лишь одна из многих поисковых систем. Google может доминировать в текущем климате, но это может измениться в будущем. Сосредоточение внимания только на Google было бы недальновидной стратегией.
В конце концов, значение PageRank сайта (или его рейтинг по любым другим показателям) не имеет смысла, если сайт занимает хорошие позиции на страницах результатов поиска для Google и других поисковых систем по фразам, которые важны для вашего клиента. Ключом к достижению (и поддержанию) успеха является постоянный мониторинг трафика вашего сайта с помощью пакета аналитики, такого как Google Analytics. Понимание того, что эти данные могут предоставить информацию о том, как посетители используют ваш сайт и какие ключевые слова они вводят, чтобы найти его, будет иметь неоценимое значение для формирования стратегии SEO сайта.
Веб-сайт — это программный продукт, а не бумажка
Доступ к Интернету никогда не был таким простым для конечных пользователей, которые заинтересованы в публикации фотографий, общении с друзьями и рассылке случайных мыслей для всего мира, но создать профессиональный веб-сайт так же сложно, как и всегда.
Поэтому очень важно, чтобы веб-дизайнеры проявили инициативу, чтобы понять, что происходит «под капотом», или рискнуть тем, что их красивые макеты не смогут полностью реализовать свой потенциал из-за технологии, которая их реализует. Понимая, когда выбирать Flash или HTML, плюсы и минусы различных серверных языков, как выбирать CMS и какие факторы влияют на рейтинг страницы в поисковой системе, дизайнеры смогут предложить своим клиентам более информированный сервис — и более успешный веб-сайт.