Основы СС. Занятие 5.

Пункт 2.2. Схема сайта.

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

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

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

Скептики возразят! Зачем это всё? Зачем разводить всю эту бухгалтерию! Долго, нудно, и ну его нафиг! (Жаргонизм – для образности, извините). Так вот, опыт всего мира (именно мира) говорит, что такой путь, с планированием и подготовкой, самый эффективный во всех отношениях. Он дает при меньших затратах лучший результат. Вы сможете продумать и проработать все детали Вашего проекта и ничего не упустить. Ведь, как известно: «Дьявол кроется в мелочах!». На выходе Вы получите добротный, солидный продукт, может быть совсем такой, как у профессионалов. Тогда Вас сразу зауважают и будут ставить в пример. А Вам останется только надувать щёки и снисходительно улыбаясь, похлопывать всех по плечу. Всё! Вы крутой!

Ладно, приступим. Для создания схемы нашего сайта необходимы карандаш, резинка и бумага. Аккуратисты могут взять еще и линейку. Или всё это заменить одной довольно симпатичной компьютерной программой от «Мелкософта». Я имею в виду Microsoft Office Visio 2007. Я пользуюсь именно ей. Она, конечно же, имеет своих «тараканов», но их количество соответствует значению ниже порогового…

Итак, у нас есть идея сайта. Вот она (повторим): у нас есть приятель, который катает народ на небольшом кораблике по реке или озеру.
У нас есть уточняющая информация: капитан Ари, катает народ, как только растают льды и установится теплая погода, по озеру Саймаа, что находится в дружественной северной стране, нашей соседке. При этом он предлагает разнообразные услуги.
Теперь ставим главный вопрос, который позволит нам оценить характер нашего сайта и, вместе с тем, его примерный объем: ЗАЧЕМ нам НУЖЕН сайт? Вот этот вопрос «зачем?» на самом деле, позволяет в жизни сэкономить уйму сил и массу времени (что, как известно, очень часто равняется деньгам).

Отвечаем: мы хотим ПРОДАВАТЬ УСЛУГИ. Да, мы хотим, в соответствии с определением предпринимательской деятельности, извлекать СИСТЕМАТИЧЕСКУЮ прибыль из своего бизнеса. И нечего тут крутить!

Отлично, идем дальше. Если так, то мы не будем делать сайт очень большим и очень насыщенным. Наша задача вкусно «намазать бутерброд», с любовью, заметьте! Что бы наш посетитель почувствовал симпатию к нам. А мы ему растолкуем просто и понятно, что он, посетитель, будет с этого ИМЕТЬ! Что он получит неизгладимые и очень яркие…, на всю жизнь, а энергией зарядится на целый год вперёд. И он будет вспоминать, и жена его будет умильно закатывать глаза, вспоминая тоже самое, и дети его… и на следующий год он с удовольствием повторит, если доведется. И затем деликатно предложить нашему посетителю «намазанный бутерброд» купить.

И, обратите внимание, что это всё – ПОДЛИННАЯ ПРАВДА! Если у Вас нет возможности обеспечить все, что Вы наобещаете, грош Вам цена как предпринимателю. Ваша репутация безвозвратно рухнет в пропасть со всеми вытекающими. Но мы-то парни не промах!
Итак, сайт начинаем со страницы под названием «Главная» (это сложившаяся традиция) и название этой страницы, как файла, будет index.html. Тоже самое – традиция. Так сложилось, и именно это имя ищет сервер (при запросе Вашего сайта посетителями из Сети) на котором будет лежать папка с файлами Вашего сайта.

Что мы сообщим миру на главной странице? Я полагаю, что надо сразу «рубануть, панимаэшь правду-матку» про нашу затею! То есть расписать нашу главную идею: катаем на пароходе, по озеру Саймаа, за деньги, стоит столько-то (не самом деле это вопрос очень важный: не отпугнуть посетителя сразу). Можно самим составить маршрут и выбрать продолжительность путшествия, одновременно наметить места на берегу для посещения: красивая природа, песчаные пляжи, рыбные места (а как же без рыбалки!), выставки, памятники, парки культуры и отдыха, закусочные, комиссионки, кирпутории…, ну и так далее. Стараемся представить и предугадать, что могло бы понравиться нашему посетителю: начинаем его уважать и любить. Одним словом у посетителя, если он станет нашим клиентом, будет в распоряжении собственный корабль с опытным капитаном. Делай что хочешь!

Всё, первая страничка в своей основе готова. Рисуем на схеме клеточку с надписью «Главная». Делаем заметки «на полях».

Дальше. Что мы еще желаем (и необходимо) сообщить нашему потенциальному клиенту? Ставим себя на его место, что бы прояснить вопрос:
- Мне предлагают прокатиться по Сайме на кораблике. Идея мне нравится, иначе разговор за-кончен сразу. Тогда автоматом идет следующий вопрос: (правильно!) А на каком именно корабле я буду кататься?

Вот Вам тема следующей странички сайта. По-моему логика есть. Значит, мы должны в следующем html-файле (страница №2) расписать все прелести нашего корабля. А файл назовем, к примеру, ship.html. Это по-английски корабль. На схеме появляется следующий «кирпич» с надписью «Корабль». Это наша следующая задача.

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

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

Тут, правда есть один нюанс. Некоторые (а на самом деле большинство) статьи и изображения в Сети защищены авторскими правами. Следите за тем, что бы не попасть в ситуацию, когда Вы поставите на свой сайт картинку и/или текст, защищенные копирайтом (авторским правом). В этот момент, как бы Вам это не нравилось, но Вы превращаетесь в пошлого и заурядного вора. Отсюда мораль. Что бы в принципе избежать этой трагической ситуации и не прослыть на весь мир нехорошим человеком-редиской, надо ВСЕГДА творчески ПЕРЕРАБАТЫВАТЬ и картинки, и тексты. НИКОГДА не копируйте и не цитируйте чужое прямо!

Например, я нашел картинку нашего корабля в Сети. Там плывут счастливые люди, и они вполне различимы на изображении. Что делать? Корабль-то вписывается в нашу концепцию. А люди – нет!
Но у нас есть замечательная программа Фотошоп. С ее помощью можно «черное» выдать за «белое» и наоборот. Надо только не пугаться и знать, как это делается. Это отдельная обширная тема для специального исследования, ибо… (я как Остап Ибрагимович…) тема Фотошопа бесконечна и в наше повествование то же не вписывается.

Короче говоря, людей на картинке можно средствами Фотошопа «попросить» за борт, а приметный пейзаж с характерными облаками и объектами на заднем плане заменить на что-нибудь другое, но тоже романтичное. Вот теперь уже никто не придерется к нашему изображению. Поскольку творчество не запрещено никакими законами.
А нам остаётся только красиво поместить картинку и придуманный текст на страничке сайта, которую мы назовем saimaa.html. (Ставим «птицу», рисуем новый квадратик «Саймаа» на нашей схеме.)

Пошли дальше. О чем будет следующая страничка? Главную идею мы доложили, корабль и место плавания – акваторию, описали. Тогда что? Верно. Надо перейти к наиболее забойной части сайта – ОПИСАНИЕ ПРЕЛЕСТЕЙ САМОГО ПУТЕШЕСТВИЯ. Как это будет здорово! Мы увидим нечто потрясающее воображение! Мы будем наслаждаться тем, «истончать» свои души этим, упиваться созерцанием (поеданием, выпиванием.... и т.д.) того-то и того-то. Все это надо обрисовать ЧЕСТНО, сочно, вкусно и в ПОЛНОМ соответствии с действительностью. Что бы слюни потекли («извините за натурализьм!»). Когда мы сами верим, нам поверят и другие!

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

Всё, идея страницы ясна. Нужны картинки со счастливыми рыбаками, поймавшими во-о-о-о-о-т такую рыбину, а также пейзажи и красивые ракурсы корабля и рыбаков, тащащих из воды страшной длинны и водоизмещения рыб. Не забываем о том, что необходимо отобранные для работы картинки надо тут же творчески перерабатывать. Подрисовать усы или побрить, «надеть очки», поменять цвет куртки…. В общем, шпионские дела…. А куда денешься?! Страничку назовем fish.html от английской рыбы. На выходе мы имеем папку (на компьютере) в которой лежат четыре наших странички – html-файлы, и рядом (выше) папочка «images», в которой лежат все картинки от нашего сайта, который теперь уже пора как-то назвать. Ну, например, сайт "Корабль".

Все! Сайт готов. Остается только расписать его в html кодах. А это дело техники.
В итоге мы имеем красивую схему (можете взять её в Библиотеке). Все страницы помечены, комментарии к ним написаны. Что делать дальше – абсолютно ясно. Вперед, за дело! Открываеим «Ворд» и начинаем писать тексты для наших страниц. Это, кстати, Ваше первое домашнее задание!

Назад