Что нужно для того создать. Что нужно для создания своей фирмы? Заказать «под ключ» или сделать самостоятельно

Привет, друзья!

Хорошее дело — удаленная работа. Прибыльное, полезное и очень удобное. Особенно для тех, кто так же, как и я, любит путешествовать. Недавно только понял лишний раз, что не смотря на все возможные минусы, совершенно не хочется все это менять на стены офисов.

Особенно, когда в понедельник ранним утром едешь по пустой и прямой трассе на мотоцикле в стороне Бангалора и понимаешь, что именно сейчас твои знакомые и коллеги трутся спинами в пробках по дороге на службу.

С чего можно начать фрилансерствовать я уже писал. И даже перечень 7 профессий для легкого старта в интернете дал. Сегодня же коснусь самой близкой для себя темы (и крайне полезной для читателей), а именно: как научиться создавать сайты с нуля и зарабатывать на этом деньги.

Ибо, так уж сложилось, что именно о сайтах и их создании мне очень часто задают вопросы как на вебинарах, так и в личку. Что ж, будем раскрывать карты.

Вообще, веб-строительство (или веб-мастеринг, как его называю я) — достаточно обширная ниша, куда входят специалисты самого разного уровня: от тех, кто педалит простые одностраничники в lpgenerator до могущественных фронт-энд разработчиков Ruby on Rails и Python. Я, как обычно, остановлюсь посередине и расскажу о том, какие делаю сайты я и что для этого необходимо знать.

В данное время я занимаюсь разработкой WordPress-сайтов под ключ.

Для их создания необходимо следующее:

  1. Основы профессии веб-дизайнера и базовые знания типографики . Сочетание цветов, умение находить комбинации форм и шрифтов. Наверное, это самая-самая нужная база для создания сайтов с нуля.
  2. Понимание работы веб-серверов, хостингов и вообще сети интернет . Тут вообще без маньячного красноглазия сисадминства обходится плохо. Но на начальном этапе с этим можно не заморачиваться.
  3. Умение работать с хостингами . Хотя бы чтоб залить-исправить Ваш шедевр через интернет.
  4. Знание хотя бы на уровне определений таких понятий, как FTP, HTTP, IP-адрес, CMS, Javascript, HTML, CSS. Не пугайтесь — все намного проще, чем вам кажется. На начальном этапе достаточно будет изучить, что такое FTP (чтобы заливать сайты на хостинг), CMS (чтобы управлять наполнением) и IP (чтобы знать как этот FTP настроить).
  5. Желательно уметь разбираться в HTML и CSS и хоть немного понимать, как сайты верстать.
  6. и, пожалуй, все!

Не заметили, какого одного не хватает пункта, о котором многие говорят? Правильно — «программирования»! Как так — спросите Вы? А вот...

Как Вам такая красота? Пугает?

Для того, чтобы на базовом самому научиться делать сайты, Вам совершенно не нужно знать таких страшных вещей, как PHP, MySQL, Javascript и.NET. Однако (чтобы меня не закидали помидорами супер-корифеи) подчеркну: со знанием программирования Ваши возможности увеличиваются в разы, следовательно сложность разрабатываемых сайтов повышается колоссально, а вместе с ней и возможная оплата труда.

Понятие «писать сайты» осталось актуальным только для систем, в которых крайне важна разработка с нуля и где предъявляются самые крутые требования к безопасности, скорости и чистоте кода. Хотя, есть такие фанаты, которые даже простые сайты-визитки предпочитают писать ручками.

Чуть позже в статье я расскажу, где можно научиться создавать хорошие сайты без глубокого знания программирования.

А пока о структуре работы.

Как происходит создание сайта?

Создание — это всегда процесс творческий, однако и он (в целях удобства) подвергается достаточно жесткой структуризации. Ранее, этот этап мне казался лишним. Мол, чего тратить время?

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

Поэтому, не важно: будете ли Вы создавать свой сайт с нуля самостоятельно или заказывать его у фрилансеров — всегда в этом процессе должен быть этап прототипирования.

Создание прототипа будущего сайта.

Тщательно продумайте последовательность блоков и размещение графически-текстовых элементов на странице. Старайтесь по-максимуму работать с задачей. Выявляйте на этом этапе все функциональные блоки, которые должны присутствовать на сайте: где расположить форму, где буллеты, где галерею товаров.

Если уж творить, то только так

Если Вы фрилансер, то приступайте к следующему этапу разработки только после принятия заказчиком прототипа! Если есть тексты и изображения — разместите их в макете. Если нет — вставляйте «текст-рыбу» и произвольные картинки.

Что можно использовать для создания прототипа:

  • обычный листок А4 и цветные ручки (обожаю аналоговые инструменты и скрип пера по бумаге)
  • Word, Excel или их аналоги
  • Обычный Paint
  • Photoshop
  • Adobe Muse

Не важно, какой инструмент выберите Вы. Главное, чтобы он максимально эффективно решал задачу — создание прототипа. Я, к примеру, люблю рисовать все на бумаге. И даже в путешествиях вожу с собой блокнот А4. Не совсем удобно с точки зрения переноса тяжестей, но такой кайф — рисовать цветными ручками и по максимуму задействовать свой творческий потенциал.

Создание дизайна проекта по готовому макету

После того, как реализовали макет — приступайте к дизайну. Рисуйте, камлайте, придумывайте цветовую гамму и художественные приемы. Именно на этом этапе Вам крайне необходимо знание основ веб-дизайна. Если на воображение Вам, как на ухо, наступил медведь, отдавайте макет веб-дизайнеру с тем уговором, что готовый макет дизайна сайта верстать будете Вы.

Веб-дизайнерское камлание выглядит примерно так

У меня, к примеру, нет художественного образования или образования дизайнера. Я выезжаю на выработанном с детства хорошем художественном вкусе и куче изученной самостоятельно литературы. Однако, если моим заказчикам нужен совсем уж изощренный вариант, я прибегаю к услугам супер-профи в рисовании и photoshop.

Верстка дизайна

Верстка — это перенос дизайна из картинки в код HTML, чтобы браузер понял, как этот самый сайт отображать. Самый интересный этап, который отпугивает большинство новичков, ибо именно здесь, как нигде, знания html, css и jquery становятся актуальными.

И если исторически раньше верстальщик весь код писал ручками и ненавидел свою работу чуть больше, чем полностью, то сейчас его адский труд круто облегчили готовые фреймворки и целые системы для визуального проектирования сайтов.

В последних всю работу по верстку Вы производите путем расстановки блоков на экране, без написания кода.

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

Настройка CMS и наполнение

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

На самом деле, этот этап используется далеко не всегда. И часто бывает, что заказчик требует только html-версию. Однако же, если вы хотите на создании сайтов зарабатывать хорошие деньги, учитесь работать с CMS. Как раз дальше я расскажу, где этому научиться.

Где учиться делать сайты быстро?

И вот теперь самое интересное! Времена, когда для создания сайтов с нуля Вам требовались глубокие знания программирования, прошли. Однако, я сразу предупреждаю : все дальнейшие сервисы и курсы — платные. И если Вы ищете что-то совсем уж бесплатное, обратитесь лучше в гугл и на сайт htmlbook.ru.

Мы так устроены, что бесплатное нами не цениться, поэтому я продолжаю всячески призывать людей не бояться вкладывать деньги в себя. Потому что в противном случае Вам придется вкладывать время, которое в отличие от денег, никогда не восполняется.

Да и вообще, обучение у профессионалов — это самой прямой, самый быстрый и самый эффективный путь. Без долгих прогулок по полям с граблями и скрупулезных изобретений трехколесных велосипедов (с бибикалкой, ага).

Самому, безусловно, можно тоже обучаться. Но не проще ли отдать какую-то сумму, чтобы профессионал провел Вас мимо заблуждений и откровенных ям на пути? Рецепт — стар как мир: учимся и развиваемся.

Обучение заработку на сайтостроении

Есть хороший парень, который обучает тому, как на разработке сайтов можно зарабатывать. На мой взгляд, подобный подход сразу дает Вам два крыла: техническую базу специалиста и маркетинговую база продавца. Без последней во фрилансе очень грустно.

Вот несколько предложений от его центра:

  1. БЕСПЛАТНАЯ ИНСТРУКЦИЯ по заработку на веб-строительстве
  2. БЕСПЛАТНАЯ КНИГА «Создание сайта от начала до конца» В ней автор на наглядном примере показывает весь процесс разработки сайта, который Вы будете делать самостоятельно.

Вообще, я противник шоковой терапии. И всерьез считаю, что развитие должно идти не рывками, а поступательно, без нарушения законов гармонии.

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

Как зарабатывать на создании сайтов?

Следующий шаг после обучения ремеслу — заработок на нем. Это хорошая мотивация, когда за интересное хобби ты начинаешь получать деньги. Именно так это вышло у меня.

Делается это в двух словах так:

  1. Ты даешь информацию своим друзьям-знакомым о том, чем ты теперь занимаешься
  2. Ставишь минимальный ценник для наработки опыта и портфолио
  3. После — идешь на биржи фриланса
  4. Получаешь заказы, обрастаешь нужными связями и опытом
  5. Развиваешься и становишься профессионалом экстра-класса
  6. Покупаешь себе Геленваген и дачу на Бали

6 очевидных шагов, которые иногда очень тяжело даются.

Сколько времени нужно для того, чтобы научиться делать сайты?

Иногда мне задают вопросы: сколько нужно времени чтобы освоить создание сайтов. Ответить на него тяжело, ибо не совсем понятен «пункт прибытия». Т.е. какой момент будет считаться точкой, где ты «уже умеешь». У меня этот процесс длится уже 8 лет и чем дальше, тем я кажусь себе все менее компетентным:)

Однако, за 2-3 месяца можно неплохо поднатаскаться, чтобы уверенно делать что-то несложное на заказ. Когда я начал осваивать более продвинутую верстку, взял заказ через 2 недели после начала обучения. Наделал кучу ошибок, но свои первые фрилансерские 900 рублей заработал. Радости предела не было)

Поэтому, скажу так: учитесь и как почувствуете под ногами опору сделать что-то простое — беритесь! И не бойтесь допустить ошибку.

Замечание для матерых веб-программистов

Предвижу вполне обоснованные возражения от акул кодинга и веб-девелопмента.

«Мол, зачем дискредитировать науку создания сайтов? Ибо дилетантов уже и так полно на рынке. Пользы от них мало, а вот убытков они приносят много. Заказчикам — ибо совершенно не умеют работать ни как специалисты, ни как продажники; коллегам по цеху, ибо откровенно демпингуют на рынке»

Постараюсь Вас успокоить: путь во фриланс — длинен. И пока зеленые новички доростут до Вашего уровня, может пройти не один год. А в своем сегменте, где заказчикам не требуются крутые навороченные кишки сайтов, именно начинающие — отличное подспорье для решения задач.

Профессионалы и адекватные специалисты всегда были и остаются в цене.

Не бойтесь конкуренции, ее на самом деле не существует. Будьте человечны по отношению к заказчикам, выстраивайте с ними дружеские и гармоничные отношения и никакой новичок Вас никогда не сдвинет.

Жаль, что мало кто придерживается одних и тех же принципов в повседневной жизни и в работе. Большинство пытается урвать кусок пожирней, и сделать это как можно быстрее, совершенно не заботясь о собственной совести и дальнейшем взаимодействии с заказчиками. И фриланс тут просто еще одна точка приложения. Об этом я уже писал в статье .

Все просто: «живи сам и дай жить другим», — как говорят на Шри Ланке!

На этом все, друзья! Думаю, ваш голод по теме «хочу научиться делать сайты» мне утолить удалось. Поделитесь в комментариях, пожалуйста: кем бы Вы хотели работать удаленно? А то мне часто пишут вопросы именно по профессиям в онлайн-заработке, поэтому эту нишу я решил потихоньку заполнять.

Добавляйтесь в друзья, подписывайтесь на обновления блога и будьте счастливы. А если статья Вам показалась интересной, поделитесь ею, пожалуйста, в соцсетях с друзьями.

Красивых Вам сайтов и платежеспособных заказчиков!

Всем доброго времни суток, дорогие друзья, знакомые, читатели, почитатели и прочие личности. Сегодня, как Вы поняли, мы поговорим о том, что нужно, чтобы создать свой сайт и опубликовать его в интернете для вся народа земли, а заодно откроем дааааааааааавно обещанную рубрику (точнее раздел) .

Как Вы помните у нас есть крутые и черт знает чему еще, но теперь и для всех желающих мы будем публиковать статьи от автора на эту тему, - просто оно будет растянуто во времени.

Впрочем, мы с Вами уже говорили про движки, сервера, делали сайт на конструкторе и даже чуток я писал про , но всё это как-то не структурировано.. и вообще.

Вводная

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

Начну, собственно, издалека, но с ключевого, что именно нужно для создания сайта всегда и везде, - это хостинг и домен , - что это такое, каких подводных камней можно избежать, где всё это взять и как с этим вообще взлетать.

Здесь и сейчас я не отвечаю на вопрос зачем это вообще Вам может быть нужно, - очевидно, что каждый, создавая сайт, преследует свои цели и задачи.

Пока давайте про домены.

Что такое домен на пальцах

Как мы уже выяснили, первое, что Вам потребуется, - это доменное имя. Сейчас я не буду рассматривать домен с технической точки зрения и расскажу то, как оно нужно обывателю, т.е нам с Вами.

Оно представляет из себя имя Вашего сайта в интернете, т.е все эти google.com , yandex.ru, sonikelf.name или что-то еще, в адресной строке браузера, - это как раз домен, т.е имя сайта в интернете по которому его будут находить посетители.

Конечно, оные могут обращаться к сайту только по IP -адресу, но вбивать кучу цифр вида 249.23.102.290 никому, думаю, не приятно и всячески лениво, да еще и сложно запомнить.

Домены бывают нескольких уровней. Например, support.сайт - это домен третьего уровня, в то время как просто - второго, а просто .ru , естественно, первого. Домены первого уровня называются зонами . Диапазонами. Пространствами. Ру-зона, ком-диапазон, нейм-пространство. Вот это вот всё.

Зоны первого уровня Вам, будем условно считать, не заригстрировать. Остается второй. Третьи принадлежат владельцу второго, т.е я могу сделать бесконечное количество *.сайт , ну а все остальные обычно мало кому нужны, либо используются для технических целей.

Откуда домен берется и почему домен чей-то

Следите за руками:

  • Возьмем как факт, что есть некая зона доменов верхнего уровня, т.е та же.ру допустим;
  • Есть её условно владельцы (о них можете не думать);
  • Есть такие товарищи (читай, - компании), которые являются регистраторами (такие себе продавцы от имени владельцев). Они имеют право регистрировать в ней (и не только) имена доменов следующего уровня, т.е, если Вы правильно следили за мыслью, - второго;
  • Есть куча народу, которые хотят под свой сайт застолбить имя.

В этой цепочке, как Вы поняли, нас интересуют регистраторы . Они "столбят" имя за денежку, на определенный срок и на конкретное физическое лицо, компанию и пр, т.е вносят его в реестр и осуществляют некоторое количество технических деталей, которые Вам знать нет смысла. Регистрация осуществляется на время (минимум, - год).

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

В принципе, Вы можете попробовать меня "подсидеть", т.е дождаться, что вдруг я забуду оплатить продление и зарегистрировать его на себя или договориться и купить его за какие-то деньги (у меня), но это отдельная тема отдельной статьи.

В общем, тут главная мысль, что: есть регистратор -> есть Вы -> платим -> регистрируют -> Вы владелец. На время.

Как выбрать регистратора

Регистраторов существует совершенно нечертовское количество и в нем легко запутаться. Особенно легко потому, что одни предлагают домены по 1000++ рублей, другие по 99 рублей, причем в одной и той же зоне, да и вроде бы с тем же названием. Как быть?

Здесь работает два правила:

  • Дешевый сыр, как мы знаем, бывает исключительно в мышеловках, причем под дешевым я имею ввиду всё что ниже среднего ценового диапазона, а вышеупомянутые 99-199 рублей вообще схожи с посиделками на пороховой бочке, покуривая как волк из мультика, поэтому в целях минимизации риска стоит брать "среднее по больнице";
  • Как я уже говорил, существует нещадное количество регистраторов, но на самом деле фактически существующих из них, т.е именно регистраторов, - единицы, а все остальные никто иной, как оверселлеры, т.е торгаши-перепродажники, которые обычно не несут никакой ответственности и прочее прочее. Скандалов на эту тему была масса, но черт с ними со скандалами, а вот потерять существующее у Вас годами имя, - это легко. Судится потом замучаетесь, да и не с кем будет.

Как с этим взлетать:

  • Переплачивать, но покупать у топов рынка, - в России это и nic например;
  • Брать у проверенных ;
  • Регистрировать через нас (пишите через );
  • Покупать у (об этом позже) сразу связку хостинг-домен и последующие домены брать у него же.

Что стоит понимать:

  • Лучше регистрировать на себя;
  • Придется предоставлять паспортные данные. Это нормально;
  • Лучше регистрировать на несколько лет сразу (цены растут, условия тоже).

Ну, тут, пожалуй, всё.

Как выбрать имя домена

Про имена доменов будут Вам рассказывать многие и многое. Основные мифы :

  1. Доменная зона важна для seo и продвижения, - ru круче какого-нибудь info , а name вообще понижают в выдаче;
  2. Доменное имя важно для seo и продвижения, - лучше выбирать домен komputer12312312 чем непонятный sonikelf ;
  3. Лучше выбирать запоминающееся имя домена;
  4. Что-то еще.

Объясняю на пальцах:

  • Премиум зон и имен нет, как и нет алгоритмов понижающих в выдаче за имя, длину имени и пр, кроме уровня зоны;
  • Всё бред феноменальный, ибо, если сайт у Вас ни о чем, то будь Вы хоть домен из одной буквы - никому Вы не нужны будете нафиг, а для всего остального есть закладки браузера, позиции в выдаче поисковых систем и имя сайта.

Теперь о том как понять, занято имя или нет и подобрать себе какое-то. Заходим , вводим придуманное имя:

Смотрим занято или нет и в какой зоне. При необходимости настраиваем фильтры:

Дальше всё зависит от Вашей фантазии, пожеланий и прочей ерундистики. Главное не увлекаться и не накупить дофига и сразу просто, чтобы было, ибо модно и всё такое. Ну и Вам сразу будут впихивать кучу услуг самого разного образа, - ничего покупать не надо, если не разбираетесь, а хостинг у nic вообще не самый лучший, - так что лучше читайте следующие части статьи.

Послесловие

Ну такая вот получилась кратенькая вводная, основные моменты я вроде бы рассказал, для первоначальной статьи должно хватить. Самая главная ошибка, - регистрировать не пойми где и забывать продлевать. Остальное, на этом этапе, - мелочи.

Как и всегда, напоминаем, что если Вы хотите научиться делать сайты быстрее, мощнее и качественней, с нуля и не только, а так же продвигать и монетизировать их, то можете не ждать выхода новых статей, а (пока есть скидки;)).

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

Спасибо, что Вы есть. Оставайтесь с нами.

Что лучше выбрать для самостоятельного создания сайта – конструктор или CMS? Ответ однозначный: только конструктор сайтов . Почему? Всё просто: раз вам нужен совет такого рода, значит, опыта разработки либо нет, либо его меньше, чем необходимо для решения вашей задачи. Танцы с бубном вокруг установки CMS, поиска хостинга отнимут много времени и средств – при этом желаемого результата не получите. Скорее всего, вам нужно разово создать один сайт для себя - небольшую визитку под бизнес, площадку для предоставление услуг, портфолио или, возможно, блог, небольшой магазин на несколько десятков или сотен товаров. Конструкторы помогают решать такие задачи наиболее рациональным способом . Что по деньгам, что по вложениям времени, труда и получения обратной выгоды.

Ниже показаны ТОП-3 лучших конструкторов сайтов А-класса. Все они хорошо сочетаются с неопытностью новичков, помогают достигать результата без стартовых знаний HTML и программирования. Каждый из них функционально продвинут на фоне аналогов. Можно смело использовать, осталось лишь определиться, какой из них конкретно выбрать.

1.1 Создание сайта в uKit → детальный обзор Лучший выбор!

1.2 Создание сайта в Wix → детальный обзор

Wix позволяет делать впечатляющие сайты-визитки, лендинги, блоги, магазины. Уютное портфолио или чертовски привлекательный корпоративный сайт платформа выдаст за пару-тройку часов работы. В системе множество интересных виджетов. Помимо стандартного джентльменского набора, есть вставка видео на фон, разные типы меню, разнообразные эффекты и прочее. Сайт-зрелище на Wix сделать несложно. Другое дело, что перегруженная страница может лагать и жутко тормозить, на что жалуются многие пользователи. Красота требует жертв, тут нужно соблюдать баланс.

Если бы не стоимость платных тарифов, Wix был бы идеальным решением для всей аудитории начинающих пользователей. Но, увы, за эти деньги многие предпочтут что-нибудь более практичное. Wix - это конструктор вау-эффектов. Он приятен, ярок, дружелюбен, но дорог по меркам конкурентов. Средний из тарифов «Combo» затянет на $99/год. Есть ещё 2 более дорогих.

Wix предлагает пять премиум-планов:

Если не смущают расценки, и предстоящая задача попадает в круг возможностей Wix, его смело можно использовать. Получите хороший набор инструментов и удовольствие от работы. Разработчики часто вводят скидку в 50% на оплату любого из тарифов. Подпишитесь на рассылку, зарегистрировавшись, и не пропустите момент.

Всё-таки Wix, пожалуй, - самый яркий для восприятия движок с визуальным редактором. Своих денег с учётом скидки более чем достоин. Да и без неё не сильно теряет в привлекательности.

1.3 Создание сайта в uCoz → детальный обзор

Вся мощь uCoz скрыта в солидном наборе модулей и возможности редактирования исходного кода страниц (html, css, php, js). Настроек очень много, но большинству новичков полезными/понятными окажутся не больше трети. Остальное - на вырост. Набор модулей можно определять самостоятельно.

Пользователи, которые ищут где создать интернет-магазин, порадуются громче всех. На этом поприще uCoz всемогущ, благодаря модулю «Интернет-магазин» (так называемый uShop). Из необходимого есть даже синхронизация с бухгалтерскими продуктами компании 1С. Импорт из CSV и YML позволит экспортировать товары из файла или парсить с AliExpress/Яндекс.Маркет. Это позволит быстро наполнить свои и развернуть партнёрские магазины с указанных площадок. Благодаря субагентам можно сделать настоящий супермаркет, в котором другие продавцы будут продавать свой товар, а владелец магазина будет получать с них процент.

В интернет-магазине на базе uCoz можно продавать любые типы товаров: материальные, эклектронные, товар-файл, товар в виде услуги. Устанавливать скидки, акции, наценки, задавать опции (цвет, размер, кол-во), использовать калькулятор стоимости доставки. Множество самых разных способов оплаты и доставки. Есть целая куча разных тонких настроек, в общем, всего разнообразия не перечислить.

Отдельно следует отметить выгодность системы для тех, кому нужно создать сайт государственного учреждения. Помимо того, что вы сможете использовать её бесплатно, есть ещё один интересный нюанс. Существует закон, по которому такие ресурсы обязаны иметь версию для слабовидящих. В uCoz такую версию можно включить в один клик. Для некоммерческих и общеобразовательных сайтов Юкоз - идеальный во всех отношениях выбор. Плюс ко всему образовательным сайтам бесплатно снимается реклама по запросу в техподдержку.

Подключение платного тарифа сможет упростить жизнь. В первую очередь, исчезновением рекламного баннера системы (реклама отображается только на сайтах, созданных на бесплатной основе ). Статус премиум-пользователя даст по-максимуму использовать дополнительные возможности uCoz без ограничений. Программа лояльности позволит при создании нового сайта заполучить любой тариф со скидкой 50% в течении первых 48 часов. Плюс можно бесплатно получить в подарок домен и премиум-шаблон на выбор (при подписке на год начиная с «Оптимального»).

В uCoz доступно пять пакетов услуг:

Веб-сервис uCoz одинаково хорошо подходит новичкам, профи и веб-студиям. Большой выбор бесплатных и профессиональных премиум-шаблонов, универсальный функционал, миллион дополнительных функций, удобство админки и низкая стоимость (либо полное отсутствие таковой на Free-тарифе). После его использования большинство движков покажутся тусклыми, ограниченными. Начните путь с Юкоз и остальные инструменты в будущем вам уже не понадобятся. Сможете решать любые задачи, не выходя за его пределы. Движок на все случаи жизни.

2. Заказать «под ключ» или сделать самостоятельно?

Заказать создание сайта «под ключ» есть смысл компаниям, то есть юридическим лицам . Это тот случай, когда руководству нужно получить гарантии результата и материально ответственных за решение задачи. Всё на бумагах, в договорах, сроках. Выделены средства, найден исполнитель - сторонний специалист либо веб-студия. Это правильный вариант, особенно если планируется масштабный и дорогостоящий проект. Если что-то пойдёт не так, можно будет найти концы и потребовать исправления ситуации либо компенсации ущерба. Также сразу желательно оговаривать условия администрирования сайта после сдачи - кто этим будет заниматься, размер оплаты услуг, что входит в понятие дальнейшего обслуживания.

Для частных лиц и предпринимателей малого бизнеса заказывать сайт «под ключ» нерентабельно. Банально неоправданно дорого, хлопотно, и, как правило, небольшой объем работ не соответствует вложениям. Платить за последующее обслуживание сайта мало кто сможет или захочет. Тем более, исполнитель, скорее всего, будет нанят из знакомых или более-менее доступных по стоимости услуг фрилансеров. В обоих случаях ожидать качественной техподдержки сайта не стоит, даже за деньги. Такие исполнители стремятся зарабатывать на обороте готовых сайтов, а не на их поддержке. С большой долей вероятности можно получить проект без капитана у руля. Придётся заказчику либо самому учиться им управлять, либо наблюдать за его упадком.

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

3. Два способа создать сайт: CMS+хостинг или Конструктор

Сайты делаются на CMS либо в конструкторах сайтов . Ещё есть самописные и построенные на фреймворках «движки», но, это совсем не подходящие варианты, они заведут в тёмный лес, не стоит брать их в расчёт.

На чем может быть создан ваш сайт:

CMS

– это специальный дистрибутив (программа, скрипт), так называемый «движок», который после установки представляет собой смесь графического интерфейса и текстового редактора для создания и управления сайтами.

Для использования CMS нужен хостинг (сервер на котором установится «движок» и где потом будут хранится все файлы сайта). Поэтому необходимо быть грамотным пользователем ПК. Уверенное обращение с компьютером, понимание софта в широком смысле – базовая необходимость, которая при наличии упорства позволит новичку создать сайт в такого рода программе. Все технические нюансы, лежат на плечах самого пользователя.

Конструктор сайтов

– это онлайн-сервис для создания сайтов, который работает из коробки – изначально идет в комплекте с хостингом, готовыми шаблонами и, собственно, самим «конструктором» для управления и редактирования сайта.

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

Оба варианта имеют свои плюсы и минусы в зависимости от точки зрения оценивающего их человека. Отметим лишь, что CMS как класс инструментов для создания сайтов появились значительно раньше облачных конструкторов. Последние стали результатом эволюции и адаптации сложных систем под нужды массового пользователя. Со временем сайтбилдеры обзавелись интуитивным интерфейсом и визуальным редактором (WYSIWYG — «What You See Is What You Get» - «что видишь, то и получишь»). Лучшие из них уже работают на базе ИИ (искусственного интеллекта) и по возможностям превосходят некоторые CMS.

3.1 Особенности создания сайта на CMS

Создание сайта на базе CMS требует аренды хостинга - удалённого сервера, на котором будут лежать файлы сайта. Как правило, панели управления хостингом дают возможность в автоматическом режиме устанавливать широкий набор бесплатных CMS. Тем не менее, необходимо вручную создать базу данных под новый сайт в разделе phpMyAdmin и подключить её (перед установкой движка указать логин и пароль от нужной б/д).

ТОП-3 самых популярных CMS:

Сразу отметим важный момент: вряд ли получится кочевать между многочисленными CMS, выбирая тестированием лучшую из них. Дело в том, что CMS, несмотря на некоторые сходства интерфейсов и общие принципы в базовых моментах, весьма ощутимо отличаются. Изучению каждой из них нужно уделить время: посмотреть шаблоны (качество, цены, доступность), структуру движка и тех же шаблонов, оценить ассортимент и порядок установки модулей, ознакомиться с примерами готовых сайтов от адептов выбранного движка. За тестирование работы отдельных модулей и плагинов речь не идёт - это явно долго и хлопотно. Их набор для выбранной системы нужно осваивать индивидуально.

Если в планах нет цели научится работать с кодом напрямую, то нет особой необходимости использовать CMS вообще.

Принципиальным отличием CMS от большинства конструкторов сайтов является прямой доступ к файлам движка. Через FTP-клиент или встроенный в панель управления хостингом файловый менеджер. Это даёт возможность править код сайта в свободном режиме: файлы любых модулей, шаблонов, страниц, базовых функций. Конечно, для этого нужно понимание и знания программирования. Навыки работы с HTML/CSS необходимы по умолчанию, но к ним, как правило, добавляются PHP и JavaScript.

Особенности создания сайта в CMS:

  • Потребуется покупка надежного, быстрого хостинга и домена.
  • Как правило, в комплекте с движком идёт несколько базовых шаблонов, хотя бывают и исключения вроде WordPress, в котором встроенный магазин на тысячи бесплатных шаблонов. Шаблоны можно покупать у разработчиков системы, веб-студий или фрилансеров. Ассортимент у разных систем отличается, нужно гуглить.
  • Многие вещи, особенно связанные с редактированием дизайна, принято делать через код. В некоторых системах плагины тоже устанавливаются напрямую через FTP путём копирования файлов (например, в DLE), а не через инсталлятор панели управления (как в Joomla или WordPress).
  • Стоит выбирать специализированные CMS под свою задачу. Это даст гарантию наличия нужного функционала (хотя бы базового) из коробки. К примеру, для создания интернет-магазинов стоит использовать только профильные системы (Magento, Bitrix, Opencart, PrestaShop). Избегайте создания сайтов, основной функционал которых будет целиком держаться на плагинах.
  • Если решитесь использовать бесплатно скачанные шаблоны, обязательно проверьте наличие в них чужих скрытых ссылок или вредоносного кода. Методы проверки разные, нужно гуглить для конкретных случаев.
  • Для любой CMS после ознакомления с базовым функционалом нужно выяснить список доступных плагинов, их стоимость и возможности. Наверняка, со временем, что-то из них понадобится, иначе просто не бывает.
  • Создавайте резервные копии (бекапы) сайта перед установкой больших плагинов и после достижения текущей крупной с технической точки зрения цели. Очень рекомендуем скачивать и хранить бекапы на своем компьютере.
  • Любая бесплатная CMS имеет сообщество, форум, официальный сайт или что-то ещё. При использовании платных систем в большинстве случаев можно рассчитывать на официальную техподдержку за деньги.

Об использовании базовых функций особого смысла говорить нет, поскольку их реализация обычно более-менее доступная. Интерфейсы у CMS отличаются значительно, поэтому каких-то общих алгоритмов вроде последовательности действий по созданию страниц, заполнению общих настроек сайта и прочего выделить невозможно. Приведём эпизод в качестве примера особенности: в Joomla перед созданием меню нужно создать и активировать модуль меню, иначе ничего не получится. Также нельзя создать пустое меню, которое не будет иметь привязки к хотя бы одной опубликованной странице. Это частный случай конкретной системы. Таких мелких и покрупнее нюансов хватает у любой CMS. Нужно изучать каждую персонально, чтобы продуктивно с ней работать.

3.2 Особенности создания сайта в конструкторах сайтов

С технической точки зрения начать пользоваться конструкторами намного проще. Структурно панели управления (админка) многих конструкторов напоминают таковые в CMS, какой-то огромной разницы, в среднем, нет. Инструменты для создания страниц, меню, наполнения контентом, общие настройки сайта, SEO - всё это реализовано по схожим принципам. Дело в другом: нет нужды арендовать отдельно хостинг, настраивать базы данных, параметры безопасности сайта вручную, лезть в код, искать и устанавливать плагины.

ТОП-3 самых популярных конструктора:

С большой долей вероятности, при наличии среднестатистического опыта работы с ПК и Сетью кто угодно сможет освоить панель управления любого конструктора за несколько часов или пару дней. Тем не менее, простота технического обращения с такого рода системами не гарантирует получения с их помощью классного результата. Раз уж осваивать и настраивать толком нечего, есть другой нюанс: нужно хорошо представлять структуру будущего сайта и суметь её реализовать средствами выбранной системы, а также наполнить контентом надлежащего качества.

Используя конструктор не придется превращаться из человека в программиста и тратить кучу времени и средств на всё, кроме развития, собственно, самого сайта. При работе с конструкторами из списка дел выпадают 80% работ, обязательных в случае с CMS.

Разные конструкторы имеют между собой довольно много общих черт в алгоритме создания сайтов. Условно такие системы можно поделить на те, что поставляются с WYSIWYG-редактором (визуальный редактор, часто имеет поддержку drag&drop, работает с виджетами), и все остальные. Кстати, вторая категория своими панелями управления очень напоминает CMS, да и по принципам администрирования сайтов мало чем отличается.

Особенности создания сайтов в конструкторах:

  • Старт работ почти всегда одинаков: регистрация, выбор шаблона, заполнение общей информации о сайте, вход в панель управления.
  • Хостинг всегда настроен надлежащим образом, защищён, создание баз данных происходит автоматически без участия пользователя.
  • Любой конструктор имеет набор готовых шаблонов, отсортированных по категориям.
  • Любая система имеет несколько платных тарифных планов, разграниченных разницей в предоставляемых возможностях.
  • Примерно у трети сервисов стоимость тарифных планов не является окончательной. Многие системы практикуют акции, промо-коды и прочие способы, позволяющие снизить стоимость тарифных планов вплоть до 80%. Скидки вполне реальные.
  • В большинстве случаев шаблоны поставляются с демо-контентом, что служит наглядным примером и помогает лучше понять, как можно удачным образом оформить сайт.
  • Большинство систем позволят построить сайт совсем без кодинга, даже если поддерживают возможность правки кода шаблонов, модулей и прочего.
  • Всегда есть встроенная FAQ и техподдержка, а вот реализация может быть разной: живой чат, форум, база знаний, форма обратной связи, система тикетов.
  • Все конструкторы позволяют подключать аналитику от поисковых систем, свой домен и работать с SEO-настройками.
  • 99% конструкторов сайтов имеют пробный период или бесплатный тарифный план. Их легко тестировать, достаточно зарегистрироваться.
  • Возможности конструкторов постоянно расширяются, обновляются, внедряются актуальные новинки веб-индустрии. Которые, в итоге, преподносятся пользователю на блюдечке.

Более конкретно узнать об особенностях отдельно взятых систем лучше из обзоров или путём личных тестов. У нас достаточно материалов по большинству популярных сервисов. В завершение текущего раздела отметим, что существуют конструкторы сайтов под любую задачу: создание магазина, блога, форума, сайта-визитки или лендинга. Выбирать, как и в случае с CMS, стоит профильные системы, в них больше узкоспециализированных возможностей.

4. FAQ – Часто задаваемые вопросы

1. Сколько времени нужно для создания сайта? За 5-10 минут реально сделать?

Смотря о каком сайте идёт речь. Если мы говорим о готовой структуре, скажем, визитки, но не заполненной контентом (тексты, таблицы, изображения), то да – за 10 минут при помощи конструктора с визуальным редактором вроде uKit это вполне возможно сделать. При работе с портфолио можно уложиться и в 3 минуты. Толку от такой спешки мало, тем не менее, это возможно.

За указанное время у вас на руках появится готовый макет сайта. Наполнение контентом может занять от 1 часа до недели – смотря, сколько и чего вы собираетесь публиковать. Но, повторимся, чисто технически создать сайт за 5-10 минут – это реально. И даже несложно. Но только в конструкторе. В CMS, блокноте или при помощи фреймворка это невозможно сделать за столь малое время. Даже в сыром виде. 3. Создание сайта в блокноте. Это что правда возможно?

Чисто теоретически это возможно. Более того, в Сети вы можете найти множество древних веб-страниц, созданных вручную при помощи блокнота. Но такой “сайт” своим видом будет вызывать ностальгию по лихим 90-м годам. Сейчас вряд ли кто-то в здравом уме окажется в восторге от такого сайта.

Так что создание сайта в блокноте – архаизм и пережиток прошлого. Так уже никто не делает. Создание простеньких страничек в Блокноте использовалось ранее для обучения HTML на различных курсах. Не более того.

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

Конструкторы сайтов, такие как uKit, Wix и uCoz - это универсальный набор на все случаи жизни, они являются бестселлерами на рынке онлайн-конструкторов. Каждый обладает своими уникальными фишками и возможностями. Задумав создание сайта, имеет смысл ознакомиться, в первую очередь с ними:

uKit – полезен на поприще создания разноплановых сайтов-визиток под бизнес или услуги. Обладает лучшим визуальным редактором на рынке, понятный на интуитивном уровне. Понравится тем, кому нужно без лишних хлопот и больших затрат создать лендинг высокого уровня или привлекательный магазин. Хорошо подходит для портфолио, промо-страниц и вообще всего, где нужно лаконично и красиво преподнести графические материалы для рекламы чего-либо.
Wix – порадует феерией шаблонов и относительно большими возможностями для платформы с визуальным редактором. Подойдёт для создания красивой визитки или стильного блога. О магазине тоже можно задуматься, но только о небольшом и если не смущает стоимость. Цену легко можно снизить вдвое, подождав ближайшего праздника, – в эти периоды Wix раздаёт хорошие скидки всем желающим.
uCoz – подходит для любых задач. В принципе, визитку на нём сделать не намного сложнее, чем в uKit или Wix. Если не планируется ограничиваться одним-единственным сайтом, тогда нужно сразу начинать с Юкоза. Уйдет чуть больше времени, зато освоится универсальный инструмент, который выручит в любой постановке требований к будущим сайтам. Магазины, блоги, форумы, доски объявлений, порталы…

К каждому конструктору прилагается подробная инструкция как создать сайт в нем, дополнительно в Интернет есть масса уроков что и как делать. У каждой из представленных здесь систем есть своя База знаний (FAQ), где расписано пошаговое создание сайта с нуля. Поставив цель, вы за пару дней чтения статей и просмотра видео на Ютубе обрастёте полной комплектацией необходимых для начала работы в нише знаний. Это избавит от трудностей администрирования. Да и деньги немалые сэкономите.

В конце августа в вузе, где я преподаю "разработку электронного портала" началась сессия у заочников. Один из студентов на занятии мне задал вопрос - "А какими навыками должен обладать вебмастер? Сейчас столько всяких языков и технологий веб-программирования - неужели ими всеми надо владеть?" Признаюсь честно, я сам никогда до этого не задумывался над этим вопросом - просто делал свое дело, используя свои знания в области программирования и навыки работы с CMS, иногда спрашивая Яндекс или Гугл, как реализовать на сайте ту или иную функцию. Но что же все-таки главнее? Развернутый ответ я постараюсь дать в этой статье.

В творческом и профессиональном пути веб-мастера я бы условно выделил несколько уровней - опять же, оглядываясь на свой опыт.

"Нулевой уровень". Основы HTML

HTML - язык разметки гипертекста, использующий теги для выделения тех или иных объектов и конструкций. Именно благодаря этому языку на веб-страницах страницах появляются ссылки, картинки, таблицы, списки и т.д.

Владея базовыми сведениями о языке HTML, можно сделать свою первую простейшую веб-страничку - такие были популярны в конце 90-х, начале 2000-х годов. Вот главная страничка моего первого сайта:

По нынешним временам страница выглядит как динозавр, но она наглядно иллюстрирует, что такое Web 1.0 - концепция веб-дизайна конца девяностых-начала нулевых годов. Графические кнопки с "рукописными" объемными надписями, фон с незамысловатым зацикленным узором, текст прямо по фону подложки страницы. Еще в то время типичной была надпись - "данный сайт оптимизирован под Netscape Navigator" (сейчас многие, наверно, даже не знают, что это такое!) Правилами "хорошего тона" считалось прилепить сбоку какую-нибудь анимированную картинку, например вращающийся череп в 3D, информер погоды, ссылку на любимый сайт с анекдотами и прочую ерунду.

Для создания подобных страниц вполне можно обойтись обычным блокнотом. Некоторые "ленивые" пользователи используют для создания подобных веб-страниц специальные визуальные редакторы или даже Microsoft Word (на мой взгляд, это тупиковый путь!).

Второй уровень. Освоение "табличной" верстки

Благодаря табличной верстке появляется возможность делить страницу на несколько колонок - этот формат представления был, есть и будет "классикой жанра".

Колонки страницы вписаны в ячейки таблицы, границы этих ячеек, как правило, бесцветные. Вот одна из боле поздних версия моего сайта, выполненная с использованием табличной верстки:

Согласитесь, выглядит уже не так убого, как первый пример, хотя, дизайн по современным меркам явно устаревший - еще бы, это сайт 2002 года! Причем, по тем временам выглядел весьма неплохо для личной странички.

Третий уровень. Композиция, колористика

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

Наверняка, не каждый начинающий веб-дизайнер может на глаз подобрать сочетающиеся друг с другом цвета. В этом случае очень полезным может оказаться следующий сервис: http://colorscheme.ru

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

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

Главная задача на данном этапе - научиться подбирать цветовую гамму сайта и расположение его ключевых элементов.

Четвертый уровень. Знакомство с CMS.

CMS - система управения содержимым, например, Wordpress или Joomla. Это "движок" сайта, который раз установил, настроил внешний вид и все что нужно дальше делать - наполнять сайт материалами. Делается это с помощью редактора, похожего на Microsoft Word, но работающего в окне браузера. По сравнению с ручной разметкой каждой страницы на HTML, система управления содержимиым - это огромный шаг вперед в плане продуктивности работы. Ваша задача - писать тексты, движок сам "облачит" их в нужное оформление в соответствии с выбранным шаблоном.

У CMS есть и недостаток, точнее особенность. Ее нельзя просто так скачать и запустить (как инсталлятор для Windows-приложения). По сути дела, это набор скриптов, написанных на языке PHP, для работы которых нужно определенное серверное программное обеспечение - веб-сервер, сервер базы данных MySQL, почтовый сервер. Это тот самый базовый минимум, на котором обеспечится более-менее полноценная работа CMS.

Если речь идет об установке CMS на коммерческий хостинг, как правило, это можно сделать за пару кликов мышки - в админке хостинга почти всегда есть раздел "Установка CMS", в котором предлагается много разных вариантов движков. Если же хостинга пока нет, то его можно создать на домашнем компьютере. Прпоще всего для этого воспользоваться бесплатной сборкой серверного софта, которая называется Denwer (джентльменский набор веб-разработчика). Скачать ее можно с официального сайта абсолютно бесплатно - укажите свой email и вам придет ссылка для скачивания (не забудьте снять галочку "получать новости").

На сайте Денвера есть видеоруководство по установке системы на домашний компьютер. Ничего там сложного нет - нужно ответить на несколько простых вопросов, после чего на нашем компьютере будет "поднят" практически полноценный веб-сервер.

После этого на Денвер устанавливается сама CMS. Не буду здесь расписывать, как это делается. Введите в Яндекс запрос "установка Joomla на Denwer" и получите огромное количество инструкций, в том числе и видео. Я рекомендую продукт моего брата Дмитрия Кашканова - Создание сайта на Joomla 3 день за днем . Курс платный, но в расписано все в подробностях и, что ценно, доступным языком, буквально на пальцах!

Пятый уровень. Изучение CSS, "ковыряние" шаблона

Как бы ни хороша была Joomla или Wordpress, но штатные шаблоны не отличаются красотой и изысканнстью. Сайты, сделанные на стандартных шаблонах чем-то похожи на дома-хрущовки - вроде функцию свою выполняют, но все на одно лицо. Почти всегда возникает задача раскрасить цвета в "фирменные" цвета, поменять шрифты, изменить цвет ссылок, сделать картинкам закругленные уголки и так далее. Все это делается при помощи правки файла стиля - как правило, он называется style.css или template.css.

С первого этапа мы помним, за что какие теги отвечают - как вставить ссылку, картинку, табличку и т.д. В CSS-файле прописывается стиль этих элементов - цвет, фон, прозрачность, размеры и отступы, выравнивание, реакция на наведение мышки. При помощи CSS можно до неузнаваемости изменить "штатный" шаблон и сделать дизайн сайта уникальным и красивым. Лично я пошел именно по этому пути - взял за основу стандартный Jooml-овский шаблон Protostar и правлю его как мне нужно. При помощи него было сделано множество уникальных сайтов, совершенно не похожих друг на друга.

Шестой уровень. Блочная верстка, основы адаптивности.

Блочная верстка при помощи тегов

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

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

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

Освоение блочной верстки подразумевает углубленное изучение CSS - нужно уверенно оперировать с такими свойствами как позиционирование, обтекание, отступы, размеры блока, а также предусмматривать, что он может отображаться по-другому, если сайт смотрят на смартфоне. В общем, чем дальше, тем интереснее!

Можно пойти и другим путем - использовать готовое решение. Например, фреймворк Bootstrap - набор CSS + Javascript, которые подключаются парой строк кода и работают практически "из коробки" - нужно только изучить названия основных стилей. При помощи Bootstrap легко реализовать на сайте многоколоночную адаптивную верстку, всплывающие формы, выпадающие меню, слайдеры, табы и много чего еще.

Недостаток Bootstrap - его "типовой" внешний вид, без изюминки, но его вполне можно разбавить своими CSS-элементами. Bootstrap очень удобен для построения "бэкэнда", простым языком - для создания админки сайта. Не нужно придумывать внешний вид элементов, все уже есть готовое. А дизайнерские фишки для бэкэнда вовсе не обязательны.

Седьмой уровень. Javascript и jQuery.

На этом уровне вебмастер начинает потихоньку переквалифицироваться в веб-программиста. Как правило, знакомство с веб-программированием начинается с языка Javascript.

Javascript - это язык программирования, на котором пишутся сценарии на странице. Эти сценарии выполняются на стороне клиента, то есть, в пределах браузера. Большинство интерактивных элементов на страницах создаются с использованием Javascript. Простейший пример такого сценария - смена картинки при наведении на нее мышки. При помощи Javascript делаются всплывающие окна на полупрозрачном фоне, всякие слайд-шоу, кнопка плавной прокрутки в начало страницы и многое другое.

С точки зрения Javascript веб-страница представляет собой набор объектов (DOM - "объектная модель документа"), у каждого из которых есть свой набор свойств и функций. Объектом является любой блок, любая ссылка или картинка на странице. У объекта есть свой уникальный ID, который прописывается в параметрах тега - примерно

. Для управления этими объектами создаются функции, которые вызываются при тех или иных событиях, например, наведение мышки на объект, клик, уход мышки с объекта и т.д.

Как правило, Javascript тесно взаимодействует с CSS-стилем элементов страницы, меняя их свойства - положение, угол поворота, прозрачность и так далее. На основе этого взаимодействия строится анимация на страницах (не Flash!). Для облегчения работы веб-программистов существуют уже готовые библиотеки функций, среди которых наиболее известен фреймворк jQuery. Благодаря ему веб-программист освобождается от большого количества рутинной работы по ручному написанию Javascript-кода для решения типовых задач по созданию интерактивных элементов на странице. Синтаксис скриптов на jQuery выглядит несколько иначе, чем традиционный код Javascript, но к этому синтаксису легко привыкнуть.

Как показала практика, научиться работать с JQuery может даже тот, кто никогда не писал на "чистом" Javascript.

Главное ограничение Javascript и jQuery - сценарии выполняются только в браузере. Javascript не может создавать файлов на сервере, он не может напрямую общаться с базой данных. Более того, он не может даже создать файл на вашем компьютере, а может просто скачать его с сервера по ссылке.

Кстати говоря, JQuery - не единственная полезная вещь, основанная на Javascript. Есть и другие JS-фреймворки - Angular, Backbone, Ember и многое другое. Они активно используются профессиональными фронтэнд-разработчиками.

Восьмой уровень. PHP и MySQL.

PHP - язык веб-программирования, на котором написаны большинство CMS, в том числе Joomla. В противоположность Javascript, сценарии PHP выполняются на стороне сервера, то есть при помощи них можно создавать файлы (на сервере), вносить изменения в базу данных, если таковая существует. Благодаря взаимодействию сценариев PHP и СУБД MySQL работают все, что имеет отношение к обратной связи с пользователем - формы обратной связи, фотогалереи с возможностью загрузки фотографий через браузер, движки сайтов и все остальное.

MySQL - система управления базой данных. У большинства систем управления содержимым вся полезная информация содержится не в файлах на сервере, а в базе данных. Это учетные записи пользователей, структура разделов сайта, навигация, полезный контент, и большое количество служебной информации. Обращение к базе данных происходит при помощи специальных функций языка PHP (mysql_query(...), mysql_fetch_object(...) и т.п.), база данных возвращает результаты запроса в виде массива или объекта. Обработчик PHP формирует из полученных данных HTML-код, который отправляется в браузер.

В отличие от Javascript PHP-сценарий не может непосредственно управлять браузером, так как он выполняется на стороне сервера. Однако, можно организовать взаимодействие между скриптами Javascript и PHP при помощи технологии AJAX.

Девятый уровень. AJAX.

AJAX - это подход к построению веб-приложений, основанный на взаимодействии серверных (PHP) и клиентских (Javascript) сценариев. На практике примером применения AJAX может служить интерактивная форма ввода вашего почтового адреса. Сначала на странице выпадающий список со странами. Выбираем "Россия", появляется второй выпадающий список с городами. Выбираем свой город, после чего появляется третий список с улицами конкретно этого города, потом - список домов. И все это происходит без перезагрузки страницы.

AJAX имеет массу преимуществ перед построением форм на "обычном" PHP, поскольку, во-первых, экономит трафик (не нужно каждый раз перезагружать страницу, новая информация подгружается по мере надобности), во-вторых это удобно для пользователя.

Основная сложность AJAX - достаточно большое количество программной "писанины" для создания обработчика событий. Однако, в Интернет полно готовых решений, которые можно использовать "как есть" или немного "доработав напильником".

И тут нам опять приходит на помощь фреймворк jQuery - при помощи него наладить работу скриптов через Ajax намного проще, чем делать это на "чистом" Javascript.

Десятый уровень. PHP-фреймворки.

Не стоит тешить себя надеждой, что если мы прошли все 10 уровней, то вы сразу достигните просветления. Технологии веб-программирования развиваются, и то что было актуально сейчас, через год уже может оказаться устаревшим.

Особенно интересная ситуация возникает, когда требуется создать какой-то нетипичный проект, для которого нет готовых решений ни для одной CMS. Тогда возникает прямая потребность в создании проекта "с нуля" на PHP. Для облегчения этой задачи существуют специальные фреймворки - Laravel, Symfony 2, Codeigniter, Zend и т.д.

По большому счету, PHP-фреймворк - это набор "кирпичиков" для построения своей собственной CMS, причем сложность и изощренность проекта ничем не ограничена. Чтобы разобраться с фреймворком (хотя бы с основами работы с ним), нужно более-менее уверенно знать PHP, уметь составлять SQL-запросы, понимать суть объектно-ориентированного программирования. Далее следует разобраться, что такое MVC. Лично для меня в свое перестроиение свое программерского мышления с процедурного программирования на объектно-ориентированное, да еще и с использованием паттерна M odel-V iew-C ontroller. Вероятно, большую роль сыграло то, что при обучении в институте 99% задач решались именно дедовскими методами написания кода и я к нему настолько привык, что долго не переходил на ООП - все казалось настолько сложным и запутанным, но в один прекрасный момент я собрал волю в кулак и все-таки "въехал", как оно работает - и не пожалел!

Сейчас я активно занимаюсь освоением фреймворка Laravel и моему восторгу нет предела. Конечно, далеко не все пока понятно, тем не менее, когда я создал один реально работающий проект - Фотоклуб , желания возвращаться к программированию "по-старинке" у меня уже нет никакого. Ну разве что, при работе с небольшими и несложными проектами я пишу на "обыкновенном" PHP.

И что интересно, чем больше я погружаюсь в веб-программирование, тем яснее понимаю насколько мало я пока знаю! До пресловутого "80 level"а" еще ой как далеко...

Что дальше?

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

Рано или поздно возникает задача по работе с различными API, интеграция с теми или иными сервисами - социальными сетями, поисковыми системами, почтовыми серверами, SMS-шлюзами, сервисами онлайн-оплаты, банковскими серверами.

Еще одно интересное и востребованное направление - разработка мобильных приложений, работающих с веб-сервисами. Это еще одна огромная область, в которой простора для творчества непочатый край!

Почти всегда эти задачи подразумевают глубокое изучение протоколов межсетевого взаимодействия (http, smtp, soap и т.п.), с чем раньше мы работали на уровне пользователей и даже не задумывались о том, какая информация действительно передается между клиентским приложением и сервером, чтобы отобразить на экране фразу "Hello, World". До этого я пока не дошел... Когда дойду, обязательно поделюсь впечатлениями:)

Итоги

Те 10 уровней перечисленые выше - это путь к веб-программированию, по которому идут далеко не все. Многие вебмастера выбирают другую тропу - оптимизация, продвижение, маркетинг, продажи. Это не менее востребованные и интересные направления! Замечательно, если над проектом одновременно работают программист, контент-менеджер и "продвиженец", при этом каждый выполняет свои задачи - в этом случае шанс того, что проект "выстрелит" весьма высоки.

Немного теории

Сайты могут быть разными, это первое что нужно понять. Разработка интернет-магазина отличается от создания блога или сайта визитки. А, например, портал вообще может создаваться много месяцев командой опытных разработчиков. Все же основные шаги к созданию всегда одинаковые – это регистрация домена и покупка хостинг-услуг, чтобы ваш проект размещался где-то в сети.

Собственно, на вопрос о том, что нужно для создания сайтов можно ответить по-разному, потому что способов их создания очень много. Я бы описал все, что требуется, примерно так:

Ваше желание. Без комментариев.

Знания. Чем больше возможностей вы хотите получить, тем больше нужно знаний.

JavaScript. Быстрый старт

Деньги. Соответственно, то же самое. Чем круче вы планируете проект, тем больше на него надо денег. Тестовый ресурс можно создать и бесплатно.

Ну и все, что касается самого сайта и его работы: домен, место в сети, движок и т.д.

Давайте сначала рассмотрим самые простые варианты создания, при которых вам не нужны знания и деньги.

Самые простые способы

Итак, есть такие гиганты-платформы, как: Blogger.com, livejournal, wordpress.com и многие другие. На таких платформах есть возможность бесплатного создания своего блога. То есть вы получаете даром место в сети, где будет размещаться ваш сайт. То же самое с доменом, только он будет третьего уровня, а не второго. То есть с приставками.blogger.com, .wordpress.com. Понятно, что нормальный домен вам за бесплатно никто не даст.

Рис. 1. Выбор темы для создания блога на площадке wordpress

Это простейшие способы, чтобы создать свой веб-ресурс таким образом, вам нужны минимальные знания компьютера на уровне умения пользоваться интернетом и выполнять простые инструкции конструкторов.

Если у вас есть деньги, то на подобных платформах вы можете приобрести премиум-услуги и получить расширенные возможности для управления, это уже для продвинутых юзеров.

Более сложный способ

Конструктор лишает вас необходимости самому регистрировать домен, подбирать хостера для покупки места в сети, установки движка и многих других забот. Если все это делать самостоятельно, то вы получаете изначально намного больше свободы в плане управления сайтом. Единственное, вам нужны уже определенные знания, хотя бы на начальном уровне. Вам сложно будет начать, если вы понятие не имеете, что такое: базы данных, FTP-доступ, пользователи, бэкапы, cPanel и т.д. Но все это азы сайтостроения и изучается буквально за пару дней путем загугливания. Давайте подробнее рассмотрим процесс.

Выбор домена (имя сайта)

По сути, первый этап. Домен следует зарегистрировать еще до того, как вы купите место в сети под сайт. Отнеситесь к этому ответственно. Название должно отражать основную цель вашего проекта. Давайте, например, рассмотрим название этого портала – webformyself. Веб для меня. Уже в голове становится понятно, что это сайт о веб-технологиях и его цель – сделать эти технологии проще и понятнее любому желающему. Соответственно, вам нужно придумать и подобрать красивое и незанятое имя.

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Рис. 2. Стоимость регистрации домена в разных зонах

Домен можно зарегистрировать у любого регистратора. Самые популярные: reg.ru, 2domains.ru. Какую доменную зону выбирать? Прежде всего, это зависит от того, людей из какой страны вы преимущественно хотите видеть на сайте. Чаще всего подойдет зона.ru, к тому же, домены в этой зоне стоят дешевле всего.

Допустим, вы преподаватель и создаете сайт для привлечения своих потенциальных клиентов (учеников). Вы живете в Украине и, возможно, вам нужны люди именно из этой страны. Очевидно, что в таком случае лучше зарегистрироваться в зоне.ua. Также и с.by, .kz – беларусские и казахстанские сайты.

Домен в зоне.com означает коммерческую организацию. Если вам нужны только посетители из какого-то определенного города, то можно регистрироваться в еще более узких зонах, подробнее вы можете узнать на сайтах регистраторов. Регистрация на год обычно стоит 100-1000 рублей.

Покупка места в сети, где будет храниться сайт

Это очень важно. Вам нужно найти надежную хостинг-компанию и приобрести у нее услуги, которые позволят размещать на ее жестких дисках ваши файлы. То есть, по сути, сайты.

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

Тарифы можно разделить на: бесплатные (тестовый период, минимум возможностей), платные, vip-тарифы, vps, vds, выделенные сервера. Самый последний вариант самый крутой – вы получаете в свое распоряжение настоящий удаленный компьютер! Это стоит 2000-20000 рублей в месяц и подходит для очень серьезных и раскрученных сайтов. VPS/VDS это практически тоже, только вы получаете не весь компьютер целиком, а лишь часть его места и ресурсов. Естественно, вы платите намного меньше. Это оптимальный вариант для всех веб-мастеров, которые заботятся о своих проектах.

Обычный платный хостинг, хотя вы за него и платите, имеет ряд недостатков по сравнению с VDS. Во-первых, на одном IP-адресе могут располагаться десятки сайтов. Таким образом, ваш проект будет защищен намного хуже, потому что у него будет куча соседей.

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

Установка движка или создание веб-страниц без него

Когда место куплено, вам остается только связать домен с ним, указав правильные DNS-адреса, после чего можно приступать к установке движка, на котором будет работать сайт. Они бывают платными и бесплатными. Я рекомендую WordPress, он бесплатен, очень популярен и прост для новичка.

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

Соответственно, если вы не обладаете знаниями и не можете сами создать такой шаблон, вам придется выбирать: либо пользоваться бесплатными вариантами, либо заплатить специалистам за разработку шаблона. Обычно это стоит от 10 тысяч рублей.

На самом деле вы можете заказать все под ключ. За вас зарегистрируют домен, купят место, все установят настроят, создадут уникальный дизайн и т.д. Все, что захотите. Если у вас имеются средства, чтобы все это оплатить, то пожалуйста. Это обойдется вам от 20-30 тысяч рублей до многих миллионов. Я же говорил вам, что, например, порталы создаются в течение нескольких месяцев?

Итог

Итак, что нужно для создания сайта с нуля? Знания и деньги. А если отвечать с технической точки зрения, то: домен, хостинг, движок, база данных и многое другое. Например, если все делать самому, то еще вам нужны будут знания таких языков, как HTML, CSS, PHP и какого-нибудь движка.

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

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения