От первого html тега, до SEO оптимизации порталов
Украина
+380 63 85 62 538
admin@sozdaj-sam.com

Процесс создания своего сайта от А до Я

Процесс создания своего сайта

Процесс создания своего сайта от А до Я

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

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

Я вас разочарую, не все в сети полезно и нужно изучать. И даже не все что в ТОП 10 может быть полезным для вас, давайте попробуем сейчас разобраться со всеми моментами создания сайта, от начального пути, до его продвижения в сети. Запасайтесь терпением, писать я буду много, но сразу скажу, это полезная информация, как для новичка, так и для любой компании желающей создать свой сайт, но не имеющим опыта в этой сфере.

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

Создание своего сайта

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

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

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

Просмотрите еще раз готовое ТЗ, обдумайте детали такие как:

  • Выдержка по нагрузке сайта (человек в секунду)
  • Регистрация пользователей
  • Оформление страниц
  • Адаптивность и кроссбраузерность сайта
  • Стиль дизайна
  • Цветовая гамма сайта
  • Взаимодействие с посетителями
  • Какие роли юзеров
  • Форум
  • Блог
  • Статьи
  • Новости

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

После этого смело отдаем сайт на разработку, компании, студии, фрилансеру или самому себе.

Последовательность создания сайта

Шаги создания сайта

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

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

Создание своего сайта — это составление ТЗ, прорисовка и утверждение макета, верстка макета и натягивание или размещение на cms, еще можно сделать на самописных движках или фреймворках. А теперь подробнее обо всем этом и этих заумных словах.

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

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

Верстальщик — это специалист, который делает точную копию графического макета, только уже с использованием языка гипертекстовой разметки HTML и каскадной таблицы стилей CSS. Если вы не понимаете о чем я, нажмите сочетание клавиш Ctrl+U и вы увидите код, вот тот код и есть последствие работы верстальщика. Сверстанный макет сайта содержит следующие элементы:

  • Файлы html
  • Файлы стилей css
  • Файлы javascript
  • Папку с используемыми изображениями

Когда сверстанный макет готов специалист или команда таковых, решает на каком движке (cms) будет находиться сайт. Что такое движок сайта?

Движок сайта — это система, которая максимально автоматизирована для создания новых страниц и наполнением контента сайта, а также позволяющая без особых знаний языка html, js и php наполнять сайт. Существуют бесплатные лицензии на такие системы и платные, то есть коммерческие. Среди бесплатных возможно вы слышали такие как: Joomla, WordPress, MODX, Drupal, uCoz. Эти системы управления контентом можно абсолютно бесплатно использовать в своих целях.

После определения с системой управления контентом сверстанный ранее макет сайта «натягивается» на выбранную систему. Этот процесс требует знаний в области PHP и JavaScript. В завершении сайт проходит тестирование на выявление багов, уязвимостей и недочетов, которые исправляются и сайт отдается его заказчику.

В зависимости от сложности сайта и его ТЗ срок выполнения работ по разработке сайта может колебаться от 1 недели до нескольких месяцев. Обратно же все это моменты отдельных компаний или фрилансеров.

Последовательность обучения созданию своего сайта

Обучаемся создавать сайт

Думаю читая вы уже заметили некую последовательность действий при создании сайта, давайте их перечислим еще раз: ТЗ → прорисовка, наброска макета → отрисовка макета → верстка макета → перенос на cms → тестирование → наполнение сайта.

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

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

Составление ТЗ

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

Набросок макета и отрисовка

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

Верстка макета сайта

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

Перенос на cms

Выполняет специалист, который помимо языков программирования Javascript, jQuery и Ajax знает еще и серверный язык PHP. Этот человек на порядок выше по знаниям, чем верстальщик, он легко разбирается в любой как платной так и бесплатной системе управления сайтом. Может самостоятельно написать свою систему по управлению содержимым сайта.

Тестирование готового сайта

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

Наполнение сайта

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

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

  1. МихаилМихаил06-18-2015

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

  2. ВладимирВладимир06-27-2015

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

  3. МаринаМарина07-09-2015

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

    • AndrejAndrej07-09-2015

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

  4. ЛюдмилаЛюдмила07-10-2015

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

  5. Когда пришло желание завести свой сайт был полным нулем в этом деле. Но хотелось делать. Немного узнал из сети. Пробовал на бесплатном «Народе», там все так просто, что у меня не получилось. Затем был уже платный хостинг, с недорогим тарифом и воля случая свела с WordPress. Конечно был готовый шаблон. Но получилось.
    А сделать что то самостоятельное конечно гораздо интересней. Буду учиться.

  6. АлисаАлиса10-19-2015

    Прочла всю статью! Столько для себе поняла. Планирую создать свой сайт. Многое не знаю, но надеюсь путем *тыка* и экспериментов, что-то все-таки получиться. Очень понравилась перечень деталей ТЗ. Верстать не каждый сумеет. И я в том числе, по-этому сейчас на стадии выбора шаблона opencard.

  7. ОлесяОлеся10-31-2015

    Я создала свой блог ровно год назад своими руками легко и просто, пройдя небольшой курс по созданию сайта на wordpress, где рассказывали элементарные вещи и дали пошаговую инструкцию. Но это было всего лишь начало. Потом у меня стали появляться вопросы по каждому действию, я тратила сутки на поиски в сети решений элементарных проблем. Я изучила большой объем информации, пробовала разные рекомендации, после чего раза 3 приходилось откатывать систему. 🙂 Но у меня было на это время и мне нравилась эта работа, поэтому я рада, что смогла во всем этом разобраться. Но если у вас нет много свободного времени и вам нужен сайт. Я все-таки рекомендую заказать его, учитывая рекомендации, приведенные в статье.

Написать ответ

© 2016 Андриевский Андрей
Украина, город Киев
Тел: (063) 856-2538
E-Mail: admin@sozdaj-sam.com
Web: https://sozdaj-sam.com/