В этой статье я хочу поделиться с вами опытом создания своего персонального литературного сайта http://alexefimov.ru.
Интернет пестрит рекомендациями на эту тему, но я до сих пор не встретил ни одного ресурса, где бы в доступной форме был описан весь процесс от и до. Поскольку я сам любитель, вы не найдете здесь заумностей, коими зачастую грешат профи. Обращаю внимание на то, что я не ставил себе целью скопировать в одно место всю массу знаний. При необходимости вы сможете найти детальную (иногда даже слишком) информацию по тому или иному вопросу в Сети. Я считаю, что главное – это понимание концепции и этапов работы, результатом которой станет ваш персональный сайт.
Необходимо сделать на берегу две оговорки:
А) Речь идет о создании сайта без использования разного рода условно-бесплатных порталов вроде http://ucoz.ru (не путать с ЮКОСом), предоставляющих возможность создания сайта на домене третьего (вида ххх.yyy.ru) или даже второго уровня (вида yyy.ru). У этого способа есть плюсы (относительная простота, отсутствие необходимости пользоваться специальными программными средствами, наличие готового форума и гостевой книги), но есть и минусы. Последние имели лично для меня существенное значение: зависимость от портала (в случае чего будет довольно проблематично перенести свой сайт в другое место), ограниченность в возможностях дизайна и управления сайтом, ну и, конечно же, реклама на вашем сайте (самое неприятное – всплывающие окна в пол-экрана). На том же ucoz.ru реклама отключается за деньги. Опять-таки за деньги можно отключить копирайт ucoz. В итоге вы получите чистую картинку, но не даром. В результате я принял для себя решение создать сайт без помощи «бесплатных» порталов. Это дает полный контроль над сайтом и предсказуемость будущего, что мне очень нравится.
Б) Я не использовал «движок». Говоря научным языком, движок – это система управления содержимым (контентом) сайта (англ. Content management system, CMS). Говоря языком простым – это программная платформа, на которой вы можете создавать и поддерживать свой сайт. Механика при этом схожа с использованием условно-бесплатных порталов: и там, и там управление сайтом осуществляется через панель администрирования. Движки бывают бесплатными (например, WordPress, Drupal, Joomla!) и коммерческими. Принципы работы «обычного» сайта и сайта, созданного на движке, радикально отличаются. Обычный сайт состоит из статических html-страниц. Они хранятся на сервере и отправляются пользователю, который вводит их адреса в браузере или проходит по ссылкам. В случае с движком html-страниц как таковых нет. Информация по запросу пользователя подкачивается из базы данных и при этом создается страница, которую он видит. Использование движков имеет много плюсов, о чем можно подробно почитать в Интернете. Если говорить в целом, то это удобство и быстрота управления контентом, что особенно актуально для новостных сайтов, блогов, интернет-магазинов; а также наличие форума Поскольку формат моего сайта не предполагал частого обновления контента и дизайна, я принял решение не связываться с движками. Это, во-первых, не так просто, как кажется; во-вторых, предполагает использование чужого программного обеспечения с соответствующими ограничениями; в-третьих, имеет ряд других недостатков, о которых можно прочесть, например, здесь: http://jada.ws/html_sites.html. В конце концов, движок - это своего рода зависимость, а вы уже поняли, что мне не нравится быть зависимым. И еще хочется максимальной простоты и прозрачности. Если однажды потребуется, я перенесу свой сайт на один из движков, вот и все. Вопрос с форумом я решил (см.ниже раздел 5).
«Зачем вообще нужен свой литературный сайт? – спросит кто-то. – Есть Proza.ru, Stihi.ru, Samlib.ru и т.д., есть социальные сети, блоги – разве их недостаточно для публикаций нетленок? Я отвечу так: каждый решает сам. С одной стороны, когда вы размещаете произведения на специализированном сайте или в социальной сети, то используете раскрученный канал коммуникации, и ваша потенциальная аудитория весьма внушительна. С другой стороны, публикуя и раскручивая там свои произведения, вы работаете на дядю-капиталиста. Это взаимовыгодно, и ничего плохого в этом нет, но об этом стоит задуматься. Если однажды дяди не станет, то не станет и вашей виртуальной личности, у которой были десятки тысяч читателей (подписчиков), рейтинги и ленты общения. Страшно? То-то. Если вы станете популярны, то дядя будет зарабатывать на вас (к Мошкову это замечание не относится), а у вас не будет счастливой возможности разместить баннер с рекламой и тоже стать немного богаче. Если вы не понравитесь чем-то дяде, то он вас забанит на веки вечные. Разве не приятно чувствовать себя полновластным хозяином (в рамках закона, само собой разумеется), а не квартиросъемщиком на птичьих правах?
Нужно сделать всего 7 шагов на пути к собственному сайту.
1. Выбрать и зарегистрировать домен.
Это можно сделать в любое время жизненного цикла создания сайта, в том числе в самом конце, но я сделал это в начале. Во-первых, вас могут опередить и застолбить домен, на который вы так рассчитывали, а во-вторых, когда вы разработаете сайт, то сможете опубликовать его сразу же, не тратя время на такие технические моменты, как регистрация домена и заказ хостинга (см. пункт 2 ниже).
Зарегистрировать домен очень просто. Я рекомендую делать это у надежных регистраторов и не прибегать к помощи сомнительных личностей, предлагающих «то же самое, но дешевле». Поверьте, экономия пары-тройки сотен рублей в год не стоит того. Найти провайдера – проще простого. Просто наберите в поисковике магические слова «зарегистрировать домен», и вам будет предложен список. Выбирайте любую компанию из верхней его части, цены отличаются несущественно, возможны акции со скидками от конкретного регистратора. Я связал свою судьбу с nic.ru. На сайте регистратора можно ввести доменное имя и проверить, свободно ли оно. Если занято – се ля ви, ищите другое. Например, в моем случае были заняты доменные имена efimov.ru и aefimov.ru. Я не сильно расстроился и выбрал alexefimov.ru. Вообще доменов верхнего (первого) уровня очень много – .ru, .com, .org, . и т.д. Если на .ru желаемое имя занято, возможно, оно свободно на другом домене, регистратор вам это подскажет. Можно посмотреть кириллицу - .рф, если вы не имеете ничего против. Говорят, у поисковых роботов Google, Yandex и т.д. есть свои предпочтения в части доменов первого уровня. Более подробно можно почитать об этом в интернете, набрав в поисковике, скажем, вот это: «com или ru».
Если домен свободен, дальше дело техники. Следуйте инструкциям на сайте регистратора, и все у вас получится. Я рекомендую регистрировать домен и заказывать хостинг (пункт 2 ниже) у одного провайдера. Так проще и удобней. Кроме того, комплексное предложение (домен плюс хостинг) выйдет вам дешевле, чем если брать по отдельности. Например, у nic.ru домен в зоне .ru стоит 600 руб. в год, самый простой хостинг – 1950 руб. в год. Итого 2550 руб. Комплексное предложение на то же самое – 2000 руб. в год. (Данные приведены на начало 2014 года).
2. Заказать хостинг.
Если говорить простым языком, хостинг – это размещение вашего сайта на сервере провайдера. Сервер находится в сети круглосуточно. В некоторых случаях есть смысл ставить сайт на собственный сервер (дома, в офисе, в дата-центре), поскольку это экономически выгодней и безопасней, но для читателей настоящей статьи это вряд ли актуально. Провайдеры предоставляют комплексную услугу хостинга, включая в нее возможность создания почтовых ящиков, антивирус, антиспам и т.д. Размер выделяемого дискового пространства и набор услуг зависят от вашего тарифа. Что касается дискового пространства, то вам его однозначно хватит даже по минимальному тарифу (если конечно вы не планируете организовывать на своем сайте видеохостинг).
Более существенный момент, который зависит от тарифа – это поддержка работы баз данных, то есть динамических веб-сайтов (см. подробней в начале статьи). При этом в описании тарифа вы увидите такие аббревиатуры, как PHP, MySQL. Если вам нужен динамический сайт или статический сайт с встроенным форумом (форум может быть только динамическим, в силу своей природы) – выбирайте соответствующий тарифный план. Кстати, услуга хостинга обычно предполагает возможность размещения сразу нескольких сайтов.
3. Продумать структуру и дизайн сайта.
Здесь действует правило: семь раз отмерь – один отрежь, ибо переделывать всегда сложней, чем сразу делать правильно. Лучше потратить больше времени на этом этапе, чем потом потратить его еще больше на переделки. К моменту начала технической реализации сайта необходимо иметь полное представление как минимум о его структуре – меню, страницы, внутренние и внешние ссылки, подход к наименованиям файлов.
Например, я на данном этапе определил для себя, что в меню моего сайта будет пять пунктов: «Главная» (обязательный во всех случаях для всех сайтов), «Проза», «Поэзия», «Ссылки», «Гостевая». Я определил структуру в каждом из этих разделов. Также я в общих чертах продумал дизайн сайта (минимализм, темный фон, красный шрифт, меню сверху, на главной странице фото, коротко о себе и обложка романа с гиперссылкой на него и т.д.) Если вы профессиональный художник или продвинутый пользователь графических редакторов (например, Adobe Photoshop), то у вас есть возможность использовать свои навыки для создания макета сайта. Что касается имен файлов, то в случае с небольшим сайтом это не столь актуально. Если же сайт объемный, то необходимо досконально продумать систему названий файлов и их хранения в папках по соответствующим разделам сайта. В противном случае возрастает риск того, что вы заблудитесь в дремучем лесу из множества файлов и осложните себе жизнь, пытаясь расставить ссылки.
Кстати, уже на этом этапе вы можете посмотреть готовые шаблоны страниц, которыми кишит Интернет. Наберите соответствующий поисковый запрос, и вперед. Запаситесь терпением. На вас обрушится масса платных и халявных шедевров народного веб-творчества, из которых вы можете выбрать что-то и потом поработать с этим в редакторе. Плюсы очевидны, минусы – тоже. Править обычно сложней, чем делать. Лично я не нашел ничего близкого к тому, что я хотел бы видеть на своем сайте, и отказался от чужих наработок. Я сделал на сто процентов свое – пусть в чем-то и «примитивное», но зато, как говорится, полностью под клиента. Если что-то не так – все вопросы к себе. Изменить – не проблема. Попробуйте разные варианты и решите для себя сами, что вам больше подходит. Я создал свои собственные шаблоны страниц и затем наполнял их контентом.
4. Выбрать html-редактор.
На рынке предлагается множество программ для веб-дизайна (html-редакторов), как платных, так и бесплатных. Давным-давно, в 2004 году, я пользовался MS FrontPage. Эта программа канула в лету: компания Майкрософт заменила ее на Microsoft Expression Web, с которой я уже не работал. Почитав отзывы и рекомендации, я остановился на продукте Adobe Dreamweaver, последняя версия которого имеет аппендикс CC (то есть Creative Cloud, с возможностью совместной работы в так называемом «облаке», что начинающим юзерам совершенно не важно). Можно пользоваться и предыдущими версиями этого редактора (CS5, CS6), по которым есть книжки на русском. По CC я нашел таковую только на английском, «Dreamweaver CC for dummies», и поскольку проблем с инглишом не имею, пользовался ею:
http://www.dummies.com/store/product/Dreamweaver-CC-For Dummies.productCd-1118646142.html
Dreamweaver - это программа, которая подойдет и профи, и новичку. Интерфейс достаточно простой и удобный, есть возможность видеть одновременно и дизайн страницы, и ее html-код (что позволяет в числе прочего постичь азы этого самого кода и даже вносить в него правки, которые тотчас отображаются на «картинке»), а еще Dreamweaver позволяет прогнать сайт в нескольких браузерах (для чего они должны быть установлены на компьютер), то есть увидеть его в условиях, максимально приближенных к боевым.
Dreamweaver CC, как и другие продукты Adobe, распространяется по подписке, это стоит 20 долларов в месяц (данные на январь 2014). К нелегальному скачиванию я вас не призываю. Пиратству бой. Думаю, не стоит говорить о том, что в любом случае вам нужен так называемый WYSIWYG-редактор (от английского What You See Is What You Get, «Что видишь, то и получишь»), позволяющий создавать «картинку», не зная кода. Апологеты html-кода будут ворчать, что такие редакторы выдают неоптимизированный код, что страница будет грузиться дольше на столько-то миллисекунд и т.д. – можете выслушать их с уважением, но выбора у вас все равно нет. Написать код с нуля без «картинки» по силам не каждому.
5. Создать страницы веб-сайта в редакторе.
Я не ставил себе целью объять необъятное и описать здесь процесс создания страниц сайта. Это дело техники, а техника детально описана в книжках, в том числе в вышеупомянутой мной книжке по Dreamweaver.
Лично я сделал очень простые, с точки зрения техники веб-дизайна, страницы, с использованием таблиц для задания структуры и с минимальным использованием CSS (англ. Cascading Style Sheets — каскадные таблицы стилей) для их оформления. Никогда не поздно перейти на следующую ступень в веб-дизайне, так я решил. CSS не добавляют ценности сайту такого масштаба, а времени на этапе их создания отнимают у новичка будь здоров. Проблему одновременного изменения структуры и/или оформления на всех страницах сайта я решил через функцию поиска и замены (банальные Ctrl+F, которые работают и в Dreamweaver). Все очень просто: а) выделяем на «картинке» элемент, который нужно изменить/заменить/удалить, б) копируем в буфер обмена соответствующий фрагмент html-кода, в) осуществляем необходимые действия с элементом (например, изменяем текст или цвет шрифта, добавляем новый пункт меню, счетчик на страницу и т.д. – все что угодно), г) через Ctrl+F находим исходный код на всех страницах сайта, д) заменяем исходный фрагмент кода на новый одновременно на всех страницах, в том числе и не открытых в данный момент, на что у Dreamweaver уходят считанные секунды. Готово.
Протестируйте сайт. Для этого в Dreamweaver есть возможность открыть его в одном из нескольких браузеров, о чем сказано выше в разделе 4. Посмотрите на то, как отображаются страницы для разных размеров экрана, пройдите по всем ссылкам и убедитесь в том, что они работают. Ни пользователи, ни поисковые роботы не любят битые (то есть не работающие) ссылки.
Вопрос с форумом и гостевой я решил просто – создал страницу на ucoz.ru специально для этих целей и сделал на нее ссылку со своего сайта.
6. Оптимизировать сайт.
Вы делаете сайт не только для себя любимого, но и для других. Как эти «другие» смогут на него попасть? Способы очевидны: А) ввод имени сайта в браузере (что для вашего нового, не раскрученного сайта практически неактуально), Б) переход по ссылке с другого сайта, В) переход из результатов поиска в поисковых системах, таких как Yandex, Google и т.д. Для того чтобы поисковые машины любили ваш сайт и выдавали его как можно выше в результатах поиска, его целесообразно оптимизировать. В Интернете можно встретить аббревиатуру SEO (англ. Search Engine Optimization – поисковая оптимизация), это оно и есть. Огромное количество фирм предложат вам провести оптимизацию вашего сайта за ваши кровные, но это вполне по силам сделать самостоятельно. Если говорить коротко, то бывает оптимизация двух видов:
– внутренняя (гармонизация содержимого сайта, а именно: улучшение качества и количества текста, структуры и навигации, оформления текста, использование внутренних ссылок на сайте и т.д.),
– внешняя (управление входящими и исходящими ссылками).
Предлагаю вашему вниманию две неплохие статьи на эту тему.
http://prismo.ru/advertising.php?li_num=4
Целесообразно озаботиться оптимизацией сайта еще до его публикации на сервере хостинг-провайдера, чтобы сразу, с первого раза, приглянуться поисковым роботам и не прилагать впоследствии дополнительных усилий по улучшению «имиджа» сайта. После публикации вы сможете продолжить оптимизацию, причем арсенал ваших средств пополнится веб-сервисами, предлагающими сделать бесплатный анализ вашего сайта. Вот один из таких сервисов и пример анализа моего сайта, оптимизация которого еще далеко не закончена:
Следствием оптимизации сайта alexefimov.ru (и самого его наличия, если уж на то пошло) является то, что сейчас при наборе в поисковой строке Google запроса «поэт Ефимов» сайт выдается на первом месте, хотя поэтов Ефимовых пруд пруди. Аналогичным образом необходимо стремиться к началу списка при оптимизации и продвижении любого сайта.
Кстати, в отношении сайтов действует очень простое правило: чем «старее» сайт, тем лучше к нему относятся роботы, при прочих равных. Сайт – он как вино.
ВАЖНО! Если есть возможность, всегда публикуйте свои произведения сначала на своем сайте и только потом, после их индексации роботами (см. раздел 7) – в прочих местах (где душе угодно). Дело в том, что сайт, где впервые опубликован уникальный контент, признается поисковым роботом сайтом-донором. Все остальные – это реципиенты, перепечатки. Роботы уважают доноров и при прочих равных присваивают им более высокий рейтинг, то есть выдают их выше в результатах поиска. Я сам с этим столкнулся. Ряд своих произведений я опубликовал на различных интернет-сайтах еще до того, как создал свой. В итоге сыграли роль оба фактора (давность размещения и уникальность контента), из-за чего мои произведения, размещенные на чужих сайтах, зачастую обгоняют в результатах поиска самих себя же, размещенных на моем сайте. Роботу абсолютно все равно, что это ваш «официальный сайт», он руководствуется другими критериями.
7. Опубликовать сайт и ускорить его индексацию.
Ну а теперь самый волнительный момент! Ваш сайт полностью готов (и, может быть, даже немного оптимизирован), представляя собой набор папок и файлов, которые теперь нужно выложить на сервер хостинг-провайдера. Для этого используются FTP-клиенты (англ. File Transfer Protocol — протокол передачи файлов). Говоря проще, это программы, позволяющие осуществлять обмен файлами между вашим компьютером и сервером хостинга с использованием привычного всем оконного интерфейса. В Dreamweaver FTP-клиент уже встроен. В ином случае такую программу необходимо установить дополнительно. На сайте хостинг-провайдера nic.ru приведены ссылки, по которым можно скачать одну из них.
После установки клиента и ввода параметров сервера, указанных на сайте хостинг-провайдера, осуществляется FTP-соединение. Вы копируйте файлы своего сайта на сервер, и – вот оно! Сайт опубликован. Теперь он доступен интернет-пользователям. Но для того чтобы ваш сайт отображался в результатах поиска на Google, Yandex, Mail.ru и др., он должен быть проиндексирован соответствующими поисковыми роботами. Не факт, что роботы посетят ваш сайт прямо в день его создания. Первого визита можно ждать долго. Бывали случаи, когда вновь созданные сайты не индексировались в течение месяца и более. Возможности влияния на роботов весьма ограничены (у них свои политики и алгоритмы), но попробовать стоит. Рекомендую внести имя своего сайта в специальные формы на поисковых сайтах, то есть сообщить им о себе. Ниже я привожу ссылки, пройдя по которым, вы можете это сделать.
http://webmaster.yandex.ru/addurl.xml
https://www.google.com/webmasters/tools/
http://webmaster.mail.ru/
Каждому из трех поисковых роботов потребовалось около недели, чтобы добраться до моего сайта, из них самым быстрым оказался Google. Статус индексации можно посмотреть на указанных выше ресурсах для веб-мастеров. Роботы индексировали страницы сайта частями, а не все страницы сразу. Кстати, есть простой и надежный способ определить, проиндексирована ваша страница или нет: копируете со страницы небольшой фрагмент текста (достаточно 8-10 слов) и вставляете его в кавычках (для чистоты эксперимента) в поисковую строку. Если в результатах поиска вы видите ссылку на свой сайт – значит, страница проиндексирована.
Что дальше? Дальше расскажите друзьям о своем сайте, разместите на него ссылки в социальных сетях и на тематических порталах – в общем, продвигайте его всеми доступными способами. Главное, чтобы было желание и было время.
Еще один совет напоследок: по возможности обновляйте контент сайта как можно чаще. Роботы это любят. Чем чаще обновляется сайт, тем быстрей эти обновления индексируются. Если вы не обновляли информацию несколько месяцев, а потом разместили на сайте новый текст, есть риск того, что поисковый робот заглянет к вам еще очень не скоро.
УДАЧИ!
Мои книги на Литресе: http://www.litres.ru/aleksey-efimov-3/