ICQ: 251-550-258      тел.: +38 067 652-85-98
  • Полезное

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

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

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

Общая информация
Итак, вначале разберемся с общими понятиями. Все мы представляем себе, что такое сайт (веб-сайт, интернет-сайт) - это странички в интернете с различной информацией. На самом деле, этого достаточно для простого пользователя интернета, но если вы хотите самостоятельно мастерить сайты, этой информации маловато. В "физическом" смысле сайт - это набор определенных файлов (файлы страничек с программным кодом, графические и видео файлы, папки и пр.), размещенных на хостинге, который при обработке его веб-браузерами отображается в виде привычных нам страничек с текстом, графикой и пр. Код практически любой веб странички (например этой) можно просмотреть щелкнув правой кнопкой мыши и выбрав в меню "просмотр HTML-кода" (если вы используете Internet Explorer) либо "Исходный текст" (для Opera) или "Исходный код страницы" (Mozilla Firefox). Вот такой код вам и надо будет писать для создания своих веб-страниц (ну или визуальный редактор будет делать это за вас).

Одного кода странички, я надеюсь вы догадались будет маловато. Предположим, есть уже у вас готовая страничка, с текстом, рисунками и т.п. Ее ж не видно "из интернета", так ведь? А что надо, чтобы было видно? Для этого нужны еще две вещи. Первая - это доменное имя или адрес сайта, по которому можно будет попасть на вашу страничку. Второе - это хостинг, или говоря проще, это "место в интернете", где вы будете размещать свой сайт (тот набор файлов и папок, о которых говорилось выше). Услуги компаний-хостеров тоже, как ни печально об этом говорить, платные. Однако речь идет не о запредельных цифрах, а вполне доступных платежах. В год вы будете платить порядка 20-30 долларов за домен и хостинг вместе взятые.

Вернемся к нашим доменам. К примеру доменное имя (адрес) нашего сайта www.ss-studio.com.ua, набрав которое в адресной строке браузера вы попадете на главную страницу этого сайта. Как правило, большинство доменных имен платные, однако для начала, чтобы опробовать свои силы, вы можете пользоваться бесплатными доменами и бесплатным хостингом. В интернете есть масса сайтов, предоставляющие бесплатно домены и хостинг (например www.narod.ru и www.by.ru). Конечно там есть ряд ограничений, но для тех статичных страничек, которые вы будете делать с самого начала, это не будет иметь значение. Разберетесь одним словом, на практике.

Необходимое ПО
Прежде всего вам понадобится ряд программ:

1. Визуальный редактор. Это программа, самостоятельно генерирующая html-код при ручной вставке и перетаскивании элементов веб страницы. Проще говоря, вы указываете где что будет находится (логотип, рисунок, меню, текст и пр.) а программа сама формирует необходимый html-код веб странички. Хотя, в принципе, код можно писать и самому, используя к примеру Блокнот, текстовый редактор WordPad или тот же MS Word. На наш взгляд, наиболее оптимальным вариантом визуального редактора является Adobe (Macromedia) Dreamweaver, в котором не тяжело будет разобраться новичку и который позволяет профессионалам делать довольно сложные сайты.

2. Графический редактор. Программа для создания и оптимизации графического материала - фотографии, баннеры, логотипы и пр. В зависимости от типа графики на сайте графических редакторов может потребоваться несколько. В принципе, вполне хватит и одного - Adobe Photoshop или CorelDraw для оптимизации и создания графики, хотя могут понадобиться и другие: Adobe (Macromedia) Flash Professional для создания флеш объектов и анимации. 3DS Max для создания 3D графики, Adobe Fireworks и др.

3. Денвер (Denwer) - Джентльменский набор Web-разработчика. Набор дистрибутивов (Apache, PHP, MySQL, Perl и т.д.) и программная оболочка, используемые Web-разработчиками для разработки, тестирования и отладки сайтов на «домашней» (локальной) Windows-машине без необходимости выхода в Интернет. Главная особенность Денвера — удобство при удаленной работе сразу над несколькими независимыми проектами и возможность размещения на Flash-накопителе.

4. Интернет-браузеры. Для того, чтобы ваш сайт корректно отображался у практически всех пользователей интернета, его необходимо будет проверить как минимум в трех обозревателях: Internet Explorer, Opera и Mozilla Firefox.

5. FTP-клиент - программа для закачки сайта на хостинг ("в интернет"), например Total Commander.

С чего начать
Итак, у вас есть уже необходимые программы и вам не терпится приступить к созданию. На самом деле самого дела нет.. Хи-хи.. Это шутка была. Если вы будете использовать Adobe Dreamweaver, в нем есть уже готовые шаблоны страничек, которые проще простого переделать под свои нужды. Пробуйте использовать элементы различных страниц, добавлять свои. Метод "научного тыка" вершит чудеса.

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

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

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

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

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

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

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

Полезные нюансы
Для придания вашему сайту последних штрихов, так сказать, желательно иметь представление о файлах favicon.ico и robot.txt. Оба файла должны быть размещены в корневой директории сайта.

Первый файл нужен для отображения иконки сайта при добавления его в "Избранное" и в заголовке обозревателя. В принципе этот файл нужен "для красоты" и облегчения при поиске в "Избранном", поскольку легче найти нужный сайт по уникальной иконке, чем просматривать все названия. Изготовить этот файл можно при помощи редактора иконок (например программа Art Icon) или онлайн на сайте www.favicon.ru.

Второй файл - robot.txt, нужен для управления поисковыми роботами и позволяет указывать им какие страницы можно индексировать и каким роботам, а какие нет. Подробнее можно узнать на сайте www.robotstxt.org.ru.

Хочется обратить внимание, что существуют общепринятые веб стандарты, принятые разработчиками интернета (www.w3c.org) и которым желательно следовать. Проверить, соответствует ваш сайт стандартам или нет, можно на странице валидации, введя нужный адрес сайта. При соответствии, вы сможете разместить у себя графический логотип, подтверждающий "правильность" вашего сайта, такие как, например, на нашем сайте внизу справа от счетчика посещений. Валидация CSS здесь.

Маленькие хитрости
Для создания сайта можно пойти и другим путем. Это использование т.н. систем управления контентом (CMS).

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

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

Ссылки по теме
Карта сайта для Google. Ссылка.
Каскадные таблицы стилей CSS. Ссылка.
Руководство по преобразованиям URL с помощью mod_rewrite. Ссылка.
Форум флеш-мастеров. Ссылка.
Форум по всем вопросам. Программы, веб-дизайн, публикации работ. Ссылка.
 
   Valid XHTML 1.0 Transitional   Valid CSS!
Copyright © 2007-2008 SS-Studio. All right reserved