Вот, одно время я загорелся это сделать, начал с теории... Но потом поступил в аспирантуру, и стало не до этого... да и вообще, я как бы позабыл про своё обещание... Приношу свои запоздалые извинения. Итак - ПРАКТИКА


ЗЫ: Это не FAQ, по этому на вопросы отвечать тут не буду, задавать их здесь тоже нельзя, для этого существует форум. Это нечто вроде мини-мануала, где я попытаюсь помочь начинающим создать свой сайт. Я уже четыре года не занимаюсь дизайном "профессионально", и поэтому кое в чём сам возможно подотстал, чего-то подзабыл, но инструкция, которую я излагаю, призвана всего лишь избавить новичков от наступания на неизбежные грабли.

INTRO

Вернёмся немного назад... Нам нужен сайт. Сперва, необходимо разобраться для чего, а точнее для кого, на какую аудиторию будет рассчитан данный ресурс. Нельзя сделать сайт интересным для всех. Одно дело, если вы создаёте сайт по заказу, тогда вы уже достаточно опытны и весь этот бред вам не нужен... Если вы просто решили обзавестись хомячком (это такой американский бзик, там думают, что иметь хомэпагу это круто, и она есть почти у каждого, несмотря на то, что посещений на таких "шедеврах" не более ноль целых хрен десятых в год), то также, эта писанина не для вас, никому не интересно читать о том, когда у вас первый прыщ вскочил на заднице или как вас впервые лишил девственности начальник, за то, что вы не вовремя предоставили ему отчёт... Самое большое заблуждение строителей хомячков - это то, что наличие сайта в Интернете сможет повысить популярность его автора, добавит ему знакомых и он станет крутым мачо для соседских девчонок... это всё БРЕД, скорее всего никто вашего сайта не увидит и не оценит.
Итак, сайт может быть коммерческим или клуб по интересам (некоммерческий). Коммерческий сайт - это либо Интернет-магазин, или сайт вашей конторы, т.е. корпоративный вэб-сайт. Корпоративный сайт может совмещать в себе интернет магазин и сайт фирмы. Но самые интересные ресурсы (ИМХО) - это некоммерческие (например наш форум ). В любом случае нужно определиться с аудиторией читателей/посетителей или клиентов сайта. А сегодня - это очень требовательная публика, и когда говорят, что от дизайна мало что зависит, главное контент (содержимое), не верьте, как говорится в русской пословице "Встречают по одёжке...".

ЗЫ: перед переходом к следующему посту (посты - это типа маленьких глав, я не претендую на книгу или faq по сайтостроению и даже на авторство некоторых высказываний, кое-что я где-то вычитал, но не помню где, я просто надеюсь, что всё, что тут будет представлено, кому-нибудь поможет) прочитайте соседний мой топик "WEB-ART теория".

ИНСТРУМЕНТАРИЙ

Для сайтостроения нужно много дорогого и не очень софта. Начну, по мере применяемости:
1. Графические редакторы: Adobe PhotoShop - однозначно, но ещё, неплохо бы иметь Macromedia Fireworks MX, CorelDRAW/Adobe Illustrator, Macromedia Flash MX.
2. WYSIWYG - редактор... Только Macromedia Dreamweaver MX, он создаёт наиболее корректный код, хотя пользоваться нам им придётся только на начальном этапе проектирования, а именно визуальной сборке макета сайта. Плюньте в наглую рыжую морду тому, кто кричит, что WYSIWYG - must die, а Блокнот - forever. Видели мы таких умников, вот пусть они в Delphi и VC++ не пользуются палитрой компонентов а только на WinAPI кодят, чтоб им всю жизнь PaintBrush снился.
3. WEB-сервер, для ленивых сойдёт и "ПАРШЕР" http://parsher.ru , а остальным, качать Апачи, Муську, РНР и всё остальное по отдельности, а потом устанавливать и настраивать вручную...
4. Редактор кода. Тут можно воспользоваться всё тем же Dreamweaver'ом, но я бы не советовал, уж больно он тяжеловат, и частые его запуски отрицательно скажутся на нервной системе :blink: , Блокнот - неее, он слишком убогий, лучший редактор кода, на мой взгляд - PHP Expert Editor http://www.ankord.com , почему, понятно будет позже....
5. И, наконец, как минимум три основных браузера: IE6.x, Opera 7.xx и Netscape 7.x/Mozilla 1.x. Это добро необходимо для тестирования странички...

ПЛАНИРВКА

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

ЗЫ: не планируйте разметку жёсткой, сейчас мало кто может похвастать разрешением 800х600, и наблюдать пустоту на экране - мало кому понравится... Думаю (возможно ошибаюсь), что планировка страницы под это разрешение - пережиток прошлого, ну давайте тогда подгонять страницы под КПК, там кажется 320х210 экран... B) Конечно, Стараться, чтобы страница корректно умещалась на малом разрешении без горизонтального скруллбара приветствуется, но если небольшая прокрутка при этом возникает, то ничего страшного в этом нет...


Извеняйте, остальное позже... Будут домашние задания...

Присоединённый файл ( Кол-во скачиваний: 270 )
 ________.gif

ПРОЕКТИРОВАНИЕ и СТРУКТУРИРОВАНИЕ

Этап проектирования - это один из наиболее важных этапов в сайтостроении. В первую очередь необходимо определить концептуальную модель сайта. Т.е. заранее определиться со стилем будущего шедевра. Он должен соответствовать основному назначению сайта и быть рассчитан на беззаговорочное понимание пользователя с любым уровнем подготовки, но ориентированных на работу именно с вашим ресурсом.
Далее необходимо построить блок-схему навигации. Тут нужно учесть, что юзер не должен ломать голову над вопросами "на какой странице я нахожусь?", "Что делать дальше?", "Как мне снова вернуться на эту страницу?", "Как выйти к главной странице?". Это должны обдумать за него ВЫ.
Пример построения такой блок-схемы приведён ниже.
Проектирование информационного наполнения. Вы должны представлять себе будет выглядеть контент, в какой форме и в каких стилях он будет изложен на странице, и т.д... Тут, для наибольшего удобства пользователя необходимо разработать внятную структуру сайта, сделать её очевидной для пользователя, предоставить ему информацию, в какой именно части сайта он находится и куда может двинуться дальше, предоставить ему единообразное меню навигации, Короче делать всё, чтобы ему было удобно, сухо и чтобы он не заблудился.
Структура информации на сайте может быть последовательная, иерархическая, ассоциативная и комбинированная (объяснять не буду, термины, думаю, понятные).
Создание прототипа. А именно модели сайта на бумаге, а позже и макетов страниц без движка в HTML. Поясню: Необходимо взять столько листов бумаги, сколько это нужно для отображения концепции сайта и сделать наброски основных страниц. Далее, необходимо пронумеровать все страницы и показать на другом листе элементы навигации между страницами и иные элементы управления... После показать эту модель заинтересованному лицу (потенциальному пользователю), и гордо выслушать его критику, потом переделать и переделать, пока он не будет доволен.


Присоединённый файл ( Кол-во скачиваний: 238 )
 _________.gif

ПРИСТУПАЕМ К ДИЗАЙНУ

Вы уже выбрали разметку, название, доменное имя и стилистику сайта, а также сделали бумажные наброски которые нам помогут? Прекрасно, тогда открывайте свой любимый графический редактор и приступайте к созданию дизайна.
В первую очередь определитесь с размером полотна. По горизонтали оно должно быть 778 пикселей, а по вертикали пусть будет 1000, если много, то обрезать никогда не поздно.
Выделите области для основных элементов сайта (см. главу "ПЛАНИРОВКА") и начинайте рисовать, рисовать всю страницу, с текстом, картинками, меню, логотипом... короче нужно нарисовать сайт.
В следующей главе я расскажу как разрезать его на слайсы и оптимизировать каждый из них, чтобы уменьшить размер графических файлов в вашем сайте и тем самым облегчить его... А пока получите домашнее задание...

ДОМАШНЕЕ ЗАДАНИЕ

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

1. Сайт фирмы продающей козлиный навоз
2. Сайт Интеренет-магазина торгующего запчастями к БМП-3
3. Сайт посвящённой философским учениям Ельцина Б.Н.
4. Сайт противников Камасутры (не адульт!!!)
5. Сайт частных объявлений наёмных убийц

Продолжу следующие главы, когда начнут появляться "Домашние работы"

ЗЫ: Доменное имя выбранное для домашнего задания не должно быть зарегистрировано в сети, проверить это вы можете на EuroHoster

ЗЫ2: Если по каким либо причинам вы не можете выложить графическую версию дизайна и навигации высылайте их мне по почте dr-zmey{@}vingrad.ru, но перед этим создайте топик, я вложу в него ваши файлы (высылайте в формате JPEG-70% или PNG-8)

Цитата

Сайт посвящённой философским учениям Ельцина Б.Н.

http://kpn55.fatal.ru/e/e.gif

Цитата(baklan @ 5.11.2004, 07:30)

Цитата Сайт посвящённой философским учениям Ельцина Б.Н. http://kpn55.fatal.ru/e/e.gif

Боже мой....
Ужас какой-то...

А продолжения не будет?... dr.ZmeY хотелось бы ещё уроков, интересно всё-таки.

С удовльствием прочитал данный мини-мануал =)
Жалко тока что Змей остановился =((
Спасибо за то что есть , тоже труд
Respect

Ну, что ж...несмотря на то, что сенсей нас покинул, я все-таки завечу свою веб-пейдж, в несколько сыром виде
Впринципе, можно было бы ещё доработать....
Добавлено @ 20:46
бл...картинка превышает 120к. а ка её можно опубликовать?
Добавлено @ 20:52
dr.ZmeY, а тебе ещё можно высылать работы или халява кончилась?

Да практика это важно. Только хочу добавить, что без SEO - раскрутки и оптимизации все теряет всякий смысл. Что толку от сайта, если о нем никто не знает кроме хозяина да пары друзей. Можно смело сказать, что этот сайт просто не существует.

Ну и расшируй, пожалуйста для непросвещенных, что такое SEO?

Guedda, опитимизация сайта для поисковиков, это если дословно