Что нужно для разработки. Где можно купить домен? Что брать за ориентир

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

б) Joomla — CMS система управления контентом (на этом движке сделан мой первый пожарный сайт).

в) WordPress — CMS для создания блога (Мой блог сделан на этом движке, сделал блог за 3 дня).

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

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

Так же хорошие CMS — mambo, DLE, Drupal (Изучал мельком, очень понравилась — советую). Вообще зайдите в любой поисковик и наберите к примеру «Список популярных CMS», вам выдастся целый список сайтов, на которых вы узнаете о большом количестве программ и CMS систем, благодаря которым можно делать качественные, функциональные и красивые сайты.

О трех системах, которые я перечислил выше могу сказать следующее:

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

Joomla — CMS просто супер! Лично мне она очень нравиться! При помощи нее можно делать отличные сайты на которых может быть форум, фотогалерея, видеогалерея, чат, гостевая книга, каталог статей, система регистрации пользователей на сайте + создание сообщества, где люди могут писать друг другу сообщения, добавлять друг друга в друзья, оставлять сообщения на стене в профиле пользователя и т.д. и т.п. Функционал у Joomla очень большой! Советую изучить эту CMS!

WordPress — движок для создания блога! Самый популярный среди всех! Советую! Простой, понятный, легкий в установке, настройке и управлении. Основная часть блоггеров сидят именно на этом движке, для него сейчас есть куча плагинов, тем и т.д.

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

3. Программа для соединения компьютера с хостингом.

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

Вообще закинуть сайт на Хостинг можно без всяких программ, можно просто зайти в свою панель управления Хостингом (она у вас будет после покупки хостинга и домена) и через браузер закачать туда свой сайт. Лично я так сайт не закачиваю на Хостинг, я пользуюсь специальной программой Filezilla, некоторые web-мастера пользуются Total Comander и другими прогаммами.

Получиться у нас следующее, когда человек будет набирать имя вашего домена http://site.ru, то он будет попадать на ваш сайт! Все просто!

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

Ну вот теперь все, я закончил. Изучайте тему создания сайтов, изучайте языки программирования и делайте себе красивые, качественные и функциональные сайты. Зачем вообще нужны сайты? Для каждого по разному. Кому-то просто так, кому-то для бизнеса и заработка, а кому-то просто для выкладывания своих мыслей и общения.

Всего доброго!

C уважением, Александр Борисов

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

Кратко о том, что должен иметь разработчик в минимальном кейсе своих знаний и навыков:

1. Аналитическое мышление — для нахождения багов, косяков в фронт-енд и бэк-енд разработке. Очень важная составляющая при работе уже с имеющимся проектами.
2. Структурированное мышление , или мышление позволяющее составить краткий план для разработке модулей, которые далее можно совместить и использовать как готовый проект. И каждый модуль должен быть спроектирован максимально эффективно, гибко, и иметь высокую производительность.
3. Отсеивание ненужного хлама — также важная составляющая, о ней подробнее ниже.
4. Иметь собственные принципы в разработке от которых он не должен отходить, в плане стилизации кода, учёта того что после тебя будет работать другой сотрудник, оставь после себя аккуратный код, читабельный и простой в понимании.

Аналитическое мышление

«F12, Console — голова Front-end».

Позволяет легко и просто определить область косяка или бага в коде, ты должен легко и просто ориентироваться в инструменте для разработчиков (F12) в браузере, отслеживать ошибки или предупреждения в «Консоли» браузера для определения «что может пойти не так», для программировании на языке JavaScript (jQuery). Также для front-end разработки, надо владеть «Просмотром кода элемента», знать хорошо свойства CSS и принципы перестроения блоков в HTML. Если ты знаешь хорошо HTML+CSS то ты сможешь используя браузер легко определить косяк в верстке твоего сайта, или сайта своего клиента и поправить его молниеносно. Также можно вставлять всякие вставки в коде console.log() для вывода того что происходит в JavaScript, и далее смотреть в F12 Console ошибки или вывод заглушек «Break поинтов» которые ты сам сделаешь.

Структурированное мышление

«Чем ленивее разработчик — тем лучше».

Важная составляющая при разработке на языках back-end , PHP, Python, Java и прочих. Ты должен писать модули, классы, чтобы потом их использовать во многих местах своего сайта, писать быстрый и гибкий код, при изменении которого можно добиться максимум эффективности. Писать как можно меньше кода — чем меньше кода — тем больше его эффективность в плане разбора и поиска косяков. Ты обязан фильтровать данные, задавать значения по-умолчанию для своих функций, чтобы сайт не развалился когда поступят «какие-то не такие данные», он должен отрабатывать в любом случае адекватно, желательно отображать логи, в свой файл чтобы ты сам потом смог без проблем обнаружить косяк и быстро и эффективно его исправить. Лучше посидеть часок другой и подумать как всё это будет работать, если проект слишком большой — лучше расписать всё на доске, составив общую картину модулей, и как их соединить в едино. Разбивай на части любые сложные задачи .

Отсеивание ненужного хлама

«Мы будем использовать 1C Битрикс»

Сложный проект? Хочется легко и быстро его сделать? Есть готовые решения? На самом то деле «готовые решения» — не лучшие решения для вашего проекта. Тот же самый jQuery — это тот же JavaScript в нашем современном мире, он имеет всё тоже самое что и JQuery. Слайдеры? Есть куча также готовых решения для построения вашего слайдера, есть куча всего чтобы вставить в ваш проект, НО! Не забывайте что каждый встроенный элемент (плагин, библиотека) имеет свои косяки, баги, и уязвимости . Также решения для готовых сайтов — wix.com всякие конструкторы, всякие движки 1C Битрикс, и прочие — не лучшие решения, не каждый движок идеален как говорят их маркетологи. Подумайте раз сто перед тем как взять что-то готовое и начать на нём свой проект. Много соблазна чтобы угробить свой проект на стадии создания . Так какого решение? Лучше делать всё самому, нанимать качественных разработчиков с опытом разработки более 5-ти лет, у которых имеются свои библиотеки для различных платформ. И тут есть конечно свои проблемы с огромным недостатком людей, которые действительно что-то знают .

Собственные принципы

«Мы так делать не будем»

Заказчик хочет от вас магии? Никогда не соглашайтесь на безумные хотелки своих заказчиков , если они желают вывалить огромное количество данных на одной веб-странице, или сделать кучу анимации на одной странице — откажите, предложите разбить данные, ведь пользователи не будут терпеть загрузки страницы которая длиться более 5-ти секунд, в идеале она должна открываться за 1-2 секунды максимум. Вы должны чётко иметь «железные» принципы разработки , не писать «вермешель» в проекте, которая сама по себе развалиться по истечению 1-2 года, да, это выгодно для вас, но о вас пойдут очень плохие и сомнительные отзывы. Каждый сам выбирает себе принципы, но задумайтесь о них, правильные они или нет.

Как выявить проблему в Back-end?

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

Здравствуй, Дорогой Друг! Непреодолимое желание создать что-то новое, самореализоваться или попробовать себя в роли разработчика сайтов привели тебя на эту страницу. Многие утверждают, что запустить свой сайт – это элементарно и просто. И знаете что? Они правы, но, к сожалению, не в полной мере. Существует знаменитая китайская мудрость, которая гласит, что дорога в 1000 шагов начинается с первого шага. Чем же необходимо обладать и что нужно для создания сайта?

Идея!

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

Для успешного запуска интернет сайта информация должна быть:

• Полезной, а значит востребованной.
• Уникальной, а значит интересной.
• Структурированной, а значит простой в восприятии.

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

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

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

Выбор стратегии

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

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

Как создать?

Хочешь научиться писать статьи и зарабатывать в интернете? Как раз сейчас у меня идет набор на бесплатное обучение по авторской методике.ЗАПИСАТЬСЯ К ПАВЛУ ЯМБУ

На самом деле, чтобы создать сайт нужно потратить 5 минут. Простейшие сайты можно создать в Word, конструкторах или даже в Блокноте. Конечно, подобный продукт не принесет вам миллионы прибыли, не сделает вас популярным. Одним из простейших способов на сегодняшний день быстрого и не дорого запуска интернет проекта – использовать CMS WordPress.

Дело в том, что сайт – это не просто текст и картинки. Это базы данных, системы контроля доступа, обновления и добавления информации, сложные программные функции, которые требуют соответствующей среды. Именно в WordPress есть необходимый задел для запуска малых, средних или даже крупных проектов. Существует мнение, что необходимо разрабатывать собственный движок сайта, при достижении посещаемости на уровне от 2000 пользователей в сутки. На самом деле:

1. для некоторых задач такая посещаемость не всегда нужна,
2. в WordPress удачно реализована система установки плагинов, которая расширяет функциональные возможности и безопасность;
3. если у вас будет такая посещаемость и будет объективная необходимость перехода на свой движок – это не займет много времени.

Ресурсы

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

Деньги

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

• Оплата раскрутки – сео-оптимизации, покупки ссылок, копирайтинг, создание уникального контента. Оплата доработки функционала сайта – даже используя лучшие шаблоны, или пользуясь услугами программистов, со временем понадобятся доработки сайта. Это нормально, вы развиваетесь!
• Покупка шаблона в WordPress – если бесплатные версии вам не по душе.
• Консультации от программистов.
• Дополнительные вложения в рекламу.

Это все вы можете совершать и самостоятельно если найдете время и обладаете необходимыми навыками и знаниями

Навыки и знания

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

Любую сложную задачу легче решить, если разбить ее на несколько простых. Шаг за шагом, путем проб и ошибок, набивая шишки и достигая новых вершин, вы сможете создать такой продукт, за который получите ожидаемый результат, приправленный гордостью, самоудовлетворением и финансовыми выгодами. Хороших вам сайтов, с вами беседовал Павел Ямб.

Давайте посчитаем сколько нужно специалистов для создания корпоративных сайтов средней сложности. Под «сайтом средней сложности» мы подразумеваем такой, с которым уже не справятся фрилансер или мальчик-айтишник. К таковому компания обычно приходит со второй попытки. Первый сайт уже не устраивает, у руководителей компании появились новые идеи и они понимают как могут улучшить свой бизнес качественным функциональным сайтом. Прежний исполнитель-фрилансер благоразумно отказался, потому что такой заказ вне его компетенций. Компания обращается в веб-студию и первый шок - цена. Она в 10-100 раз больше, чем у фрилансера. Почему? Потому что над сайтом в течении квартала работают до 15 человек. Это люди с хорошими зарплатами.

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

Команда для профессионального создания сайта

1. Маркетолог
2. СЕО-специалист
3. UI/UX-дизайнер
4. Автор текста
5. Верстальщик
6. Программист
7. Контент-менеджер
8. Администратор проекта
9. Переводчик, иллюстратор, 3D-художник, видеограф, аниматор, консультант, фотограф...

Работают 6-15 человек. Каждый специализируется на конкретном этапе. У заказчика это часто вызывает недоумение: старый сайт сделал «студент, который устанавливает антивирусы». Один сделал, без ансамбля. Зачем нам столько людей, если прошлый сайт сделал фрилансер-одиночка?

Если вы делаете сайт для бизнеса, чтобы зарабатывать, то вам нужна профессиональная команда. Никакой фрилансер не сделает этого в одиночку. А «айтишник», обслуживающий 1С-Бухгалтерию и подавно. Это горькая правда и если вы серьезно относитесь к сайту, который вам тянет какой-то мальчик, у вас проблемы.

Фрилансер сделает сайт-визитку. Это будет страничка в интернете с контактами. Даже если у вас там есть «слайдер», «гостевая книга», «портфолио» - это всё равно страничка с контактами. Такие сайты под силу фрилансерам и бюджетным веб-студиям. Начинающая веб-студия из дизайнера и верстальщика с начальными навыками программирования сделает простенький сайт. По мере взросления веб-студии приходится решать усложняющиеся задачи. Приходит понимание, что прототипирование и маркетинг - не пустые слова. Не всегда веб-студии идут по пути развития. Многим комфортно клепать шаблонные сайтики для нетребовательных клиентов.

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

Что делает маркетолог при создании сайта

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

Чем занимается SEO-специалист

Готовит семантическое ядро, вырабатывает рекомендации по написанию текста, проводит внутреннюю оптимизацию сайта.

Кто такой UI/UX-дизайнер

Умеет и делает прототипы сайтов. Прототип сайта - работающий скелет: каждому элементу определено место, обозначены переходы по ссылкам со страницы на страницу. Только дизайна нет. Схематично, как чертеж. На прототипах экспериментально вырабатывают эргономичную и дружелюбную структуру сайта. Вы наверняка знакомы с термином «юзабилити». Так вот, прототип и дает возможность «пощупать» сайт еще ДО создания. Прототипирование (проектирование) - неотъемлемый этап когда делают сайт.

За что отвечает веб-дизайнер

Облекает прототип сайта в приятную и понятную оболочку. Заставляет сайт «говорить» с посетителями, быть дружелюбным. Сайты получаются красивыми благодаря веб-дизайнерам. Веб-дизайнер отвечает за визуальную концепцию сайта. Он учитывает иерархию элементов будущего сайта, которую задал UI/UX-дизайнер. Для этого веб-дизайнер выделяет доступными инструментами главные элементы. Веб-дизайнер визуально воплощает в жизнь то, что спланировали на будущем сайте маркетолог и UI/UX-дизайнер.

Чем занимается верстальщик

Реализует макеты страниц, переданные веб-дизайнером. Его задача: перенести векторный рисунок в HTML-код. Уровень развития интернета дает верстальщику JavaScript, CSS3, HTML5, CANVAS и прочие технологии. За этими страшными словами скрываются: языки программирования и библиотеки. Верстальщик (по-другому front-end разработчик) обязан знать и уметь использовать несколько инструментов. Отрасль развивается, верстальщики следят за нововведениями и перенимают мировой опыт.

Программист

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

Зачем нужен администратор (менеджер) проекта

Руководит работой команды. Взаимодействует с заказчиком по техническим и другим вопросам. Следит за сроками и контролирует соответствие результата работы техническому заданию.

Кто ещё делает сайт

Помимо этих людей, над сайтом работают: копирайтер, автор текста, SEO-оптимизатор, иллюстратор, видеомонтажёр, фотограф и другие.

Кто не нужен при создании сайта?

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

Качество получается только в результате специализации. Выдающиеся результаты - в узкой специализации.

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

Сколько стоит сайт в профессиональной веб-студии

Если заказчику озвучивают 30-50 тысяч рублей за корпоративный сайт с нуля, это значит, что работает над ним один человек. Или коллектив, но 2 дня. Уровень такого сайта и его продающие способности редко удовлетворяют заказчика. Отсюда вывод: 30 тысяч за сайт - дорого. И действительно, ведь это пустая трата денег. Такой сайт не приносит прибыли. А если вы инвестируете деньги, но не получаете прибыли, то и 10 рублей будет дорого.

Мой совет: лучше ничего не делать, чем делать дешёвый сайт. Дешёвый сайт убивает ваш бизнес. Если для вас не пустой звук и вы планируйте серьезную работу в интернете. Корпоративный сайт - это виртуальный офис. Должен выглядеть респектабельно, быть удобным, функциональным. Сайт формирует первое впечатление от бизнеса. Дешёвый позорит и вредит бизнесу.

Корпоративный сайт получается хорошим за 1,5-6 месяцев работы команды из десятка человек. Адекватный ценник - от 500 тысяч рублей. Если смотреть на , то цена абсолютно нормальная. Вложил 500 тысяч, заработал 50 миллионов. Если вы не собираетесь зарабатывать на сайте, то зачем его вообще делать?

Адекватная цена корпоративного сайта - от 500 тысяч рублей.

Гуру маркетинга Сергей Славинский сказал, что чем дороже сайт, тем лучше . Он имел ввиду, что хороший сайт не бывает дешёвым. Что отличный сайт дороже хорошего. Работает принцип: чем больше вложил, тем качественнее и прибыльнее результат. А к дешёвому сайту и отношение наплевательское.

Хотите хороший корпоративный сайт? Отправьте нам заявку!

В конце августа в вузе, где я преподаю "разработку электронного портала" началась сессия у заочников. Один из студентов на занятии мне задал вопрос - "А какими навыками должен обладать вебмастер? Сейчас столько всяких языков и технологий веб-программирования - неужели ими всеми надо владеть?" Признаюсь честно, я сам никогда до этого не задумывался над этим вопросом - просто делал свое дело, используя свои знания в области программирования и навыки работы с 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 и правлю его как мне нужно. При помощи него было сделано множество уникальных сайтов, совершенно не похожих друг на друга.

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

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