Текст книги "Искусство оформления сайта. Практическое пособие"

‹dl›‹dd›‹select name=“Subject” size=“1”›

‹option selected›Веб-узел‹/option›

‹option›Фирма‹/option›

‹option›Товары‹/option›

‹option›Офис‹/option›

‹option›Персонал‹/option›

‹option›(Другое)‹/option›‹/select›

Другое:‹input type=“text” size=“ 26” maxlength=“ 256” name=“SubjectOther”›‹/dd›‹/dl›

‹p›‹strong›Введите текст сообщения в следующее поле:‹/strong›‹/p›

‹dl›‹dd›‹textarea name=“Comments” rows=“ 5” cols=“42”›‹/textarea›‹/dd›‹/dl›

‹p›‹strong›Как с вами связаться?‹/strong›‹/p›

‹dl›‹dd›‹table›‹tr›

‹td›Ваше имя‹/td›‹td›‹input type=“text” size=“ 35” maxlength=“ 256” name=“Username”›‹/td›‹/tr›

‹tr›‹td›Эл. адрес‹/td›‹td›‹input type=“text” size=“ 35” maxlength=“ 256” name=“UserEmail”›‹/td›‹/tr›

‹tr›‹td›Телефон‹/td›‹td›‹input type=“text” size=“ 35” maxlength=“ 256” name=“UserTel”›‹/td›‹/tr›‹/table›‹/dd›‹/dl›‹dl›

‹dd›‹input type=“checkbox” name=“ContactRequested” value=“ContactRequested”›

Свяжитесь со мной по данному вопросу как можно быстрее.‹/dd›‹/dl›

‹p›‹input type=“submit” value=“Отправить”›

‹input type=“reset” value=“Сброс”›‹/p›‹/form›

Такая форма весьма сложна для начинающего веб-дизайнера, но у вас все получится. Начинать ее конструирование следует с наиболее простых элементов, например удалив или объединив в одну некоторые ячейки. И всегда ставьте пункт «Благодарность» на первое место: начинать перечень с жалобы опасно для бизнеса.

5.2. «Ургентная хирургия»

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

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

1) всегда и повсюду пользуйтесь только английским языком (кроме написания самого контента, разумеется);

2) не ставьте пробелов в названиях и ссылках, в крайнем случае на месте требуемого пробела поместите нижнее подчеркивание вот такого вида _ (например: ded_moroz.jpg);

3) никогда не используйте больших (прописных, то есть заглавных) букв в названиях и ссылках, поскольку это повышает вероятность ошибок (тем более что Web Page Maker и некоторые другие визуальные редакторы обладают кошмарной способностью превращать заглавные буквы в названии импортируемых картинок в строчные);

4) никогда не применяйте в названиях знаков препинания, звездочек, математических и иных символов и т. д.;

5) не пишите слишком длинные, «километровые» названия для рисунков, вроде i_know_you_love_only_me_…_etc.gif. Это ни к чему!

Вот и вся профилактика. Если не открывается какая-то из новых страничек вашего сайта, то дело может быть не только в неправильной ссылке. Велика вероятность того, что эта страничка либо вовсе не загружена на хост, либо загружена под другим именем, либо загружена в неправильную папку корневого каталога. В том случае, когда вы не обнаружили причины, из-за которой не хочет загружаться новая страничка, или когда новая страничка отсутствует в каталоге, надлежит быстренько, непосредственно в Интернет-кафе, открыть на компьютере Блокнот или Word и создать на них html-страничку, что совершенно нетрудно. В эту страничку записывается следующий код:

‹br›‹br›‹p style=“filter: Shadow(Color= #000000 , Direction= 130 ); width: 400; height: 60; font-size: 30pt; font-weight: bold; text-align: center; color: green”›ПРОСИМ ПРОЩЕНИЯ!‹/p›‹br›

‹p align=“left”›По техническим причинам настоящая страничка временно не открывается.‹br›Вы можете вернуться на предыдущую страничку либо перейти на новые, указанные в перечне ниже.‹br›Спасибо за понимание.‹/p›‹br›‹br›

‹HR width=80 % align=“center”›‹/HR›‹br›

‹H2 align=“center”›ПЕРЕЧЕНЬ ДОСТУПНЫХ СТРАНИЧЕК‹/H2›

Далее пойдут ваши ссылки. Код тривиален и хорошо вам известен. Его не нужно учить наизусть: достаточно понимать, что тут написано – и он крепко-накрепко запомнится сам. Линии, заголовки, фильтры, абзацы – все это мы учили. Не спешите немедленно забивать в Блокнот или веб-редактор все то, что здесь упомянуто. Сначала попробуйте мысленно представить себе, какой именно будет окончательная страничка. Затем попытайтесь добавить чего-нибудь своего в код, хотя бы измените цвет надписи «Просим прощения!» с зеленого на красный или синий. Что делать с ургентной страничкой, думаю, вам понятно.

И наконец, совершенно злодейская ситуация: у вас исчез текст. То есть он попросту не виден на страничке, хотя явно присутствует на положенном месте в html-коде. Проверьте наличие на странице скрытого текста. Очень хорошо, если в вашем Интернет-кафе на компьютерах установлена FrontPage или другой достаточно продвинутый редактор: он подсвечивает невидимый текст серым цветом, что упрощает вашу задачу. Найдите начало невидимого текста и удалите знаки невидимости с лишними комментариями либо поставьте границы (скорее всего вами не была прописана закрывающая скобка). Второе объяснение вашему ЧП – неправильно указанные, «перекрывающие» друг друга значения тэгов ‹div›. До тех пор, пока вы недостаточно свободно читаете на HTML, самый легкий выход из ситуации состоит в элементарном удалении одного из препятствующих тэгов.

Рассмотрим сказанное на примере моего ресурса. Первоначально на страничке download.html (для скачивания книг) использовано форматирование текста ‹div class=right›, но потом верстку усложнена:

‹div style=“position: absolute; overflow: hidden; left:278px; top:300px; width:781px; height:2813px; z-index:17"›‹DIV class=right›‹H3›Наше место в экологической истории‹/H3›

… (и т. д., и т. п.)‹/div›‹/div›

Казалось бы, ничего страшного. Однако если оставить старое форматирование ‹div class=right› наравне с новым, то итогом станет не более сложная визуальная структура текста, а просто напросто отсутствие видимого текста в броузере. Так что тэги ‹div class=right›‹/div › придется удалить. Наверняка и у вас произошло нечто похожее.

5.3. Юридические аспекты

Редко какая книга по дизайну и маркетингу не содержит критики чужих ошибок, разбора недочетов, которые допустила та или иная фирма. Немногочисленные хорошие авторы (например, наш отличный «вебист» В. В. Дригалкин) в своих книгах по вебу в частности и маркетингу вообще нет-нет да и скатываются на ту же пагубную линию изложения.

Даже гуру Нильсен не удержался и пожурил как-то раз сайт Международного Олимпийского комитета. Простим Нильсену то, что он поддался влиянию бездарной толпы. Давайте-ка поразмыслим над обоснованностью критики мастера. Строго говоря, МОК – организация такого масштаба и такой специфики, что вправе позволить себе даже черные буквы на черном фоне. Ее сайт – не для гуляки праздного и не для веб-дизайнера, который снаряда тяжелее мышки в жизни не держал. Сюда приходят любящие спорт люди, приходят с определенной целью, а не для того чтобы посмеяться и поиронизировать. Видимо, Нильсен решил, что МОКу надо бы нарастить посещаемость всеми правдами и неправдами, например провести на сайте акцию: скачай бесплатно спортивный рингтон «Оле-оле-оле!».

Вам смешно, а мне грустно. Сайты создаются под разные категории посетителей, абсолютного качества и всемирного признания ищут, наверное, лишь новостные издания. МОК ориентирован на строго определенную публику, безразличную к мелочам, которые профи сочтет недоработками и непонятками. Ругать за такое – это то же самое, что бросить в лицо доктору медицинских наук: «Почему ваша новая книга по ренографии опять написана языком, непонятным для пятиклассника?». Умные авторы персональных страничек, конечно, извиняются перед случайной публикой (вежливость, господа, вежливость!), а затем сообщают, что им важнее донести информацию, а не упражняться в изысках дизайна. К слову, так поступаю и я, поскольку веду ресурс на ограниченный круг посетителей. И вам советую во время работы думать про целевую аудиторию, а не про случайных прохожих. На всех не угодишь. Как говорится в таких случаях: что русскому в радость, то немцу смерть!

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

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

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

Теперь рассмотрим размещение на ресурсах противозаконных материалов. Провайдеры, то есть компании, предоставляющие интернет-услуги, предупреждают о том, чего не следует размещать на ресурсах. На эти предупреждения редко обращают внимание, тем более когда сайт уже сверстан. Поэтому стоит напомнить и мне, поскольку мое напоминание придется весьма кстати. Разрабатывая свой ресурс, тщательно проверьте:

> нет ли у вас где националистических или расистских лозунгов;

> нет ли у вас где пропаганды экстремизма и насилия, социального неравенства и несправедливости к социально незащищенным;

> нет ли у вас высказываний, ущемляющих права и оскорбляющих достоинство как отдельных личностей, так и социальных групп;

> нет ли у вас где порнографии (текстов, картинок, видео), а также материалов, растлевающих несовершеннолетних или провоцирующих на сексуальную агрессию;

> нет ли у вас призывов к свержению нынешнего конституционного строя;

> нет ли у вас разглашения государственных тайн;

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

Грань между добром и злом очень тонкая, ее легко преступить. Многие фразы и идеи легко истолковать превратно. Эротическое фото очаровательной девушки с обнаженным бюстом можно при желании назвать порнографией. Патриотические суждения о будущем России совсем нетрудно представить фашистскими лозунгами. Ну а резкое высказывание некой дамы на форуме о том, что «все мужики – НЕГОДЯИ», любой в два счета примет за оскорбление достоинства. Между тем лицо, желающее преступить закон, непременно найдет лазейку. Например, при запрете на порновидео станет распространять порноаудио (?) или рекламировать услугу «секс по ICQ».

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

Литература

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

Дунаев В. Сценарии для Web-сайта: PHP и Java Script. / 2-е изд. – СПб.: БХВ-Петербург, 2008. [Самоучитель по популярным языкам для написания скриптов, содержащий немало готовых примеров]

Кинкоф Ш. В. Наглядный самоучитель HTML. – М.: НТ-Пресс, 2008. [Пособие по глубокому изучению языка HTML]

Комолова Н. В. HTML: Самоучитель. – СПб.: Питер, 2008. [Масса полезной информации о графике и мультимедиа, в том числе советы по баннерной рекламе]

Тихонов А. И. Динамический HTML. /2-е изд. – М.: Бином, 2008. [Все о DHTML, чтобы на вашем сайте буковки сновали и кнопки мигали]

Томас Д., Хэнсон Д. Х. Гибкая разработка веб-приложений в среде Rails. – СПб.: Питер, 2008. [В книге даются основы программирования в среде Rails, достаточные для создания собственного Интернет-магазина]

Чебыкин Р. Самоучитель HTML и CSS. – СПб.: БХВ-Петербург, 2008. [Раскрывая сущность HTML и CSS, автор знакомит читателя с тонкостями юзабилити]