Писанина - от слова писатель.

Многие спорят о том, что важнее для сайта: графика или контент. И те и другие говорят убедительно, но мы не будем касаться их спора - мы будем говорить о контенте, т.е. о содержании сайта, а если точнее про то, как это содержание оформить. На ваш сайт люди приходят за какой-то информацией - даже если у вас веб магазин, то текст там присутствовать будет и в немалых количествах. Наша задача сделать этот текст таким, чтобы его прочитали и поняли его содержание. И есть тут несколько особенностей - я полетал, поглазел по сторонам и теперь доношу до вас то, о чем узнал. Советую посетить сайт The Web Developer's Journal - там много всего интересного, а мысли об оформлении текста в Сети выражены там кратко, просто и внятно - многие про это пишут, но ... Кое-что из прочитанного там мной послужит основой этой статьи - но основа основой, а зайти туда всем советую, очень хорошо все изложено.

Не важно какое, будет ли это лицензионное соглашение, права предоставления услуг, гарантии или какая-нибудь подобная ерунда, которую можно встретить на любом крупном сайте, предоставляющем нам какую-нибудь услугу - на Rambler вы тоже сможете найти соглашение о предоставлении услуг поиска и т.д. Смотрим на подобный документ и что видим? Видим много мелкого текста - после нескольких первых абзацев интенсивно жмем на полосу прокрутки и доматываем всю эту писанину до конца, чтоб убедиться, что такой существует - наверняка вы так и делаете! Вот так нельзя оформлять свои текстовые документы - мелкий шрифт, минимум отступов, выделений - такой текст похож на сплошную серую массу, а он таким и является! Такой текст не ЧИТАБЕЛЬНЫЙ!!!

Как оформить?

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

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

А теперь обо всем по порядку...

Заголовки.

Выделим текст!

Если надо обратить внимание на какую-то важную мысль, то почему бы ее не выделить? Да! Мы можем ее сделать пожирнее, а можем написать курсивом - мы все можем, так давайте этим пользоваться! Только тут важно не переборщить - иногда стоит выделять так не всю фразу, а только несколько первых слов, только для того чтоб привлечь внимание, а то когда так "выделены" целые блоки текста, то это уже не привлекает внимания! Подчеркнутый текст можно воспринять как ссылку, поэтому такой способ выделения не часто используется, но тем не менее имеет право на жизнь.

Списки

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

Если вы будете делать карту сайта, то надо так оформлять ссылки на конкреные документы
Вроде бы неплохо, но я несколько отвлекся от темы оформления текста - продолжаем разговор!!!

Прочие элементы выделения...

Когда текст сплошной его трудно читать, а увидев страницу, полностью заполненную ровным, сплошным текстом, многие приходят в ужас - так не пугайте своих посетителей!!! Если вы считаете, что новый заголовок не нужен, а блок текста великоват, то стоит разделять его абзацы пустой строкой (<p> или <br> - перевод на новую строку), вставлять разделительную линию <hr>

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

Стремитесь к краткости и ясности

:-) Многие упрекают мою рассылку в том, что ее автор слишком болтлив... Помимо чего-то нужного я пишу довольно много ерунды - НЕ берите с меня пример! Я может еще исправлюсь... Тот кто приходит к вам на сайт что-то хочет. Так пусть он получит то, что хочет и как можно быстрее - тогда он улучшит свое мнение о вашем сайте и о вас ("Тут все понятно и просто написано, без всякой словесной чепухи"). В 5 веке до нашей эры Аристотель сформулировал 3 правила, которым должен следовать настоящий оратора:

• Говори то, что важно
• Говори то, что правда
• Говори кратко

Примите на заметку! Вроде бы Аристотель вебдизайном не занимался, но можно его и тут послушаться!

О стиле изложения

Я терпеть не могу, когда кто-то пишет в поучительном тоне - в Сети этого лучше вообще не делать! Посетители у вас разные, и наверняка кто-то будет поопытней вас, также не стоит кичиться своей профессиональностью в излагаемом вопросе - если вы профи, то читатель поймет это без вашей помощи ("...будучи профессионалом в области макороноварения, я не могу без негодования пройти мимо дилетанских высказываний о кетчупе и спагетти...")
Лично мне более нравится дружественное повествование - читатель не испытывает комплекса перед грозным Васей-Дизайнером, который твердо убежден, что вебмастер обязан творить в блокноте, а все прочие средства для корявых неумех, НЕТ! Я лучше напишу так : "Мне нравится работать в Dreamweaver, всем новичкам советую, т.к. сам я новичок". В случае возникновения вопроса скорее спросят у меня, чем у грозного Васи-Дизайнера...
Если же вы не можете определиться со стилем, то попробуйте излагать нейтрально - только по делу, не умничая, без всяких лирических отступлений.

Фон и шрифт...

Это важно. Если текста немного, то можно и повыпендриваться: и светлый шрифт - темный фон и наоборот, но если текста много, то светлый фон, темный шрифт. Считается, что лучше всего черным на белом - это так, но у некоторых мониторы такие, что белый и черный очень сильно контрастируют, и при долгом чтении глаза устают. Все таки фон лучше слегка смягчать глухим цветом (или использовать белый, но не #FFFFFF, а более "грязный"), но это тоже неоднозначно... А возможно вам стоит просто на каждой странице помещать текста чуть поменьше - лучше несколько страниц, и перерыв небольшой у читателя будет, и у вас показов рекламы больше будет... (выпуск#13 "Логово Минотавра").
Теперь о фоне... Можно сказать определенно, что в случае больших объемов текста лучше обойтись без фоновых картинок - они точно будут мешать! Простая заливка цветом - цветов столько, что всегда можно подобрать нужный!
Шрифт... Шрифтом по умолчанию является Times, он более других удобен для чтения, но на мониторе недостаточно четок - это особенно заметно, когда шрифт мелкий. Шрифт Verdana более подходит для вебпубликаций (он разрабатывался специально для применения в вебе) - после некоторых экспериментов я для мелких надписей теперь использую исключительно его, сравните сами:

Times New Roman.Эту мелкота наверняка видна не четко, надо присматриваться, вглядываться и т.д.

Verdana. А этот текст? Промежутки между буквами побольше, все четко и читабельно!

Arial. Тоже внятный шрифт - явно получше Times, но проигрывает Verdana!

Поэтому в случае мелких надписей (size="1" , size="2" ) лучше пользоваться Verdan'ой. Этот шрифт присутствует почти на любом компьютере, но на всякий пожарный лучше создать список шрифтов, если броузер не найдет в системе первого, то отразит все во втором и т.д. А делается это так:
<font size="3" face="Verdana, Arial">Тут мы пишем свой текстик</font>

Т.е. вначале броузер попытается отразить весь такой текст, используя шрифт Verdana, а не найдя такого, будет писать все, используя Arial, который точно у всех есть!

И еще хочу сказать...

1. Когда пишете текст в таблице не забывайте делать отступ от краев
   <table width="100%" border="1" cellpadding="10" >
   cellpadding="10" - отступ 10 пикселей от краев. Например, текст который вы сейчас читаете, написан в таблице с таким отступом, когда же отступ отсутствует, то вид внешний весьма плох, и кажется, что там дальше еще чего-то написано.
2. ЗАБУДЬТЕ О ТАКИХ НАДПИСЯХ!!!
   И О ТАКИХ ТОЖЕ!!!
   Это смотрится настолько убого, что можно смело забыть о дизайне - он тут не поможет. Где такое можно встретить? На любительских страничках - быть любителем и начинающим не стыдно, но такими надписями лучше себя не позорить.
3. Если объемы текста небольшие, то можно писать с большим отступом от какого-нибудь края (~150 пикселей), при этом заголовки выводя за эту границу (так они будут еще четче выделяться), оформленный таким образом текст смотриться весьма аккуратно, к тому же на эти "поля" можно поместить маленькие картинки по теме, важные мысли или основные ссылки (только не стоит загромождать - тогда будут у нас не широкие поля). Но повторюсь: подобное стоит делать или если текста не очень много, или если его много, но он разбит на главы, каждую из которых можно поместить на новой странице - а то сотню килобайт текста на одной странице лучше вообще не помещать, а оформленную таким образом в особенности!
4. Если у вас инструкции, или что-то еще разбитое на множество пунктов, то воспользуйтесь якорями (например так у меня создан раздел "Содержание" в этой рассылке)
   
1. Писанина...
2. SMTP: а я что говорил?
3. Первые шаги...
   При нажатии на такую ссылку происходит переход к определенному пункту, содержащемуся на этой же странице. Для того чтоб такого добиться надо поставить там, куда вы хотите перейти якорь: <a name="назовем например g1"></a>, т.е
   < a name="g1"></a>. А потом, для того чтоб поставить ссылку на этот пункт надо это сделать почти как всегда:
   <a href="#g1">Перейти туда-то...</a>
   Не забудте перед названием метки (якоря) поставить знак "#", который указывает, что ссылка внутренняя.
   И конечно же надо поставить внутренние ссылки на описание (Наверх к содержанию) - это выполняется также - ставите еще один якорь около содержания.
5. И надо стараться писать грамотно - бывают опечатки, понятно, но желательно текст внимательно проверять. Я вот проверяю, проверяю, а потом читаю выпуск, который уже разослал и нахожу новые ошибки и опечатки, что весьма неприятно :-)
   Надо быть внимательнее!!!

Все! Конец!!! Надеюсь, что я старался не зря, и кому-то эта статья окажется полезной, а может кто-то решит добавить к ней свои комментарии - ПИШИТЕ!!! Все пишите! Понравилась/не понравилась, интересно/ерунда не стесняйтесь - я рад каждому письму!!!

mailto:green_kakadu@mailru.com

Наверх к оглавлению

Так, теперь пришла пора понадоедать вам своими вопросыми и неумныи высказываниями!

А теперь, когда вы все подписались, продолжим разговор! К моему великому удивлению многие из моих вопросов не вызвали у вас той бурной реакции, которую я ожидал. Я приготовил еще один ящик для складирования писем, увеличил объем жесткого диска на 20Гиг., и все приготовления оказались напрасными!!! Нет, вы писали, но недостаточно активно. О чем вы активно писали, так о фоне в рассылке - я подумал, подумал, и решил пока не менять, но вполне могу и передумать. Теперь я задам вам несколько вопросов, на которые жду от вас ответов (и не говорите. что мы не пишем, т.к. сказать нечего - вон сколько я тем предложил!):

• Какие рассылки вам кажутся интересными? У меня пока сложилось мнение, что кроме моей культовой рассылки вы ничего больше не читаете - писем по этой теме было мизерное количество (всем откликнувшимся спасибо!). Вы читаете какую-то рассылку, она вам интересна, в ней вы находите что-то для себя полезное - напишите мне как ее найти (или перешлите один номер). Рассылок сейчас море - много интересных, а еще больше неинтересных. Рассылки на английском приветствуются (только бесплатные, а то видел я на newsletter.com - годовая подписка $50!!! ).
• ТЕЛЕРАБОТА!!! Наверное я около 2-х месяцев пристаю к вам с этим вопросом - и буду приставать, пока не добуду приличное количество информации. Не могу не сказать, что дело движется - кое-кто поделился опытом, за что им большое-пребольшое спасибо. Я пока доэкспериментировался до того, что меня пригласили на очень сомнительную работу, дальше я решил не экспериментировать.
• АКАДЕМИЧЕСКИЙ СТИЛЬ. Планирую (ой, сколько я всего планирую..!) статью по этой теме - если вы хотите высказаться по поводу этой темы, то срочно мне пишите!!! Даже если ваши комментарии состоят из двух слов. Приветствуются примеры сайтов с таким оформлением.
• А я на сайте дизайн поменял!!! Хотел бы услышать ваше мнение по этому поводу. Рекламы там не слишком много? А то я хочу еще и 2 по 120*60 туда засунуть... А почему вы по рекламе не так интенсивно кликаете? А как вам логотипчик? Не ярковат? А кнопочки - сам рисовал?!!! А почему на форум не ходите? Там много интересных тем, а еще есть там такой длинный диалог по установке форума - может пригодится? Жду в гости, жду критику...
• Поступило предложение сделать рассылку менее объемной (последние выпуски тянули за 60кб в HTML). "...лучше меньше, но чаще!" - а что вы думаете по этому поводу? Я пишу как пишется - если все захотите уменьшить объем, то я буду не две статьи помещать, а одну, а другую вдогонку... У меня тут недавно такая нездоровая мысль появилась: подписчиков больше 1500, рассылка несколько десятков килобайт - когда я жму на кнопочку "разослать", то я создаю десятки мегобайт информации, а если несколько раз на кнопку нажму :-) Наверное учитывая объемы рассылки многие будут недовольны :-) и Субскрайб тоже :-(
• Кстати я свою рассылку перевел из "еженедельных" в "нерегулярные" - сами видите, что не укладываюсь я по графику, но буду стараться быть еженедельным :-)

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

ПИШИТЕ!!! ПИШИТЕ!!! ПИШИТЕ!!! Письма пишите!!!
mailto:green_kakadu@mailru.com

Наверх к оглавлению

Мою рассылку читает столько людей, профессионально занимающихся веб технологиями, что я иногда даже теряюсь - более половины читателей намного опытней меня, но есть и новички - для них эта статья. Я помню по себе, что в самом начале возникает очень много вопросов, на которые не всегда легко найти ответы, т.к. большинство и не подозревает, что такие вопросы могут возникнуть: что такое FTP, как загрузить страницу по FTP, какая страница грузится по умолчанию, как вообще создается HTML страница... А я помню, что у меня такие вопросы возникали, и наверное не у меня одного!!!

1. Что такое HTML. HTML - это язык разметки, мы создаем html документ, в котором содержится какой-то текст, теги, информация о том откуда загружать картинки, коды java. А то что мы видим - это работа нашего броузера, который обрабатывает данные html документа и представляет их в наглядном виде, и текст есть, и картинки вставлены, и музыка пищит.
2. Как создать страничку? Чисто теоретически, для ее создания вам нужен всего лишь текстовый редактор, например блокнот, но это теоретически. Скорей всего вам HTML не знаком, а чтобы творить в блокноте надо его знать как свои пять пальцев (не блокнот, а HTML). Поэтому вам понадобятся:
   
   • Какой-нибудь HTML редактор (посмотрите в моем каталоге соответствующий раздел), многие редакторы freeware (абсолютно бесплатны) или shareware (бесплатны на какой-то срок, обычно 30 дней, а потом или надо платить, или программа не работает) Я пользуюсь Macromedia Dreamweaver , 30-ти дневную версию [11mb] которой вы можете найти на официальном сайте Macromedia. (вам нужна Trial версия).
   • Книжка по HTML. Не всякое разглагольствование про дизайн (как у меня), а именно голый HTML, такую книгу лучше иметь не в электронном, а в обычном, печатном варианте - чтоб всегда под рукой. Все-таки редактор, редактором, но иногда приходится код подправлять ручками... Если же вам нужен электронный вариант книги, то посмотрите раздел в моем каталоге "Почитаем?".
   • Программа для рисования+оптимизатор графики. Рисунки в Paint'е не совсем годятся из-за их большого объема. Советую всем Macromedia Fireworks (пробная 30-ти дневная версия (Trial), [12mb]) - программа в которой очень удобно рисовать кнопки, баннеры и т.д. А по совместительству Fireworks - оптимизатор графики (все рисунки должны быть небольшими по объему - несколько килобайт). Многие пользуются фотошопом, но если с ним не разу не работал, то разобраться с ним сложнее, чем с Fireworks.
     
     Теперь можно смело приступать к созданию страницы!
3. Как связать одну страницу с другими? Для этого надо поставить на другие страницы ссылки. Что такое сайт? Грубо говоря, это какое-то количество страниц связанных между собой перекрестными ссылками.
4. Как сделать так, чтобы при наведении курсора что-то происходило? Все эти эффекты (изменение цвета, изменение величины и др. свойств шрифта, нажатие вжатие кнопки, звук и т.д.) можно сотворить с помощью Java. Множество Java-скриптов вы можете найти здесь:
   
   • Библиотека скриптов [http://case.agava.ru/]
   • Архив JavaScript'ов [http://bestjs.boom.ru/ ]
   • Лучшие JAVA Апплеты [http://www.caravan.ru/~javaapp/ ]
   • Ресурсы DHTML [http://www.delfin.ru/misc/dhtml/]
   Все приведенные выше ресурсы на русском языке, и все они, по-моему, весьма интересны. Не стесняйтесь задавать их владельцам свои вопросы - ответят! Для того, чтобы вставить на свою страницу скрипт или апплет, программистом буть не надо - читайте инструкции! Не переборщите со скриптами и апплетами!!!
5. Мой рисунок очень большой по объему. Это печально. Во-первых, стоит его перевести или в Gif, или Jpg формат. Какой из этих двоих лучше, боюсь говорить из-за своей некомпетентности: как я понял для рисунков, небольших по размеру более подходит gif, а для фотографий, размерчики которых побольше [20-30kb], да и четкость для которых нужна получше, используют jpg. Я все пока делаю в gif. А во-вторых, для уменьшения объема воспользуйтесь программой для оптимизации (Fireworks, Smart Server [http://www.ulead.com/] и т.д.) И попытайтесь пользоваться небольшим количеством цветов, и не чрезмерно увлекайтесь эффектами (shadow, glow и т.д.)
6. Какая страница загружается по умолчанию? Та которая называется index.htm или index.html (возможно и main.html, home.html - но index.html везде и надежней). Назовя свою страницу index.html и поместив ее на сайт, вы смело можете набирать http://vasy_pupkin.domain.com и у вас загрузится ваша index страница.
7. А как закинуть свою страницу на сервер? Для этого можно использовать FTP, файловый менеджер. Смотря что есть у вашего хостинга - у некоторых что-то одно, у других и то, и другое. Файловый менеджер - это просто, происходит все в вебформе, вы указываете какие файлы с вашего диска надо загрузить и т.д. - все по виндовски привычно. Но это не удобно в случае больших файлов или в случае их большого количества.
8. FTP - что это? И как пользоваться? FTP - это протокол для транспортировки файлов, а для нас это та штука, которая поможет нам закачать на сайт все что мы хотим. Для этого требуется FTP клиент, небольшая программка, например популярны такие:
   
   • CuteFTP [http://www.cuteftp.com/] очень популярный FTP клиент - я им пользуюсь. Там же можно найти и HTML редактор.
   • WS_FTP Pro 6.5 [http://www.ipswitch.com] весьма популярен.
   • Bullet Proof FTP [http://www.bpftp.com/] весьма известный товарищ.
   Скачали, установили, теперь надо настроить. Все настройки можно и нужно узнать у вашего хостера, это: Host adress ( вовсе не адрес вашего сайта!), пароль (ваш, под которым сайт регистрировали), логин (User ID) - обычно порт у всех по умолчанию один и тот же - 20 (?). Все это надо уточнить вам самим - обычно такая информация всегда в помощи, в FAQ. А далее сам процесс работы по FTP весьма прост - подключились, и как в проводнике Win - можно все или перетаскивать, по правой кнопке мыши возникает меню и т.д.
9. После того как вы все закачали - походите по сайту, все ли правильно? Может ссылку где-то неправильно прописали, папку не так назвали - я тут у себя на сайте такое обнаружил...чуть не упал, лучше проверьте все досконально!
10. А что дальше? А дальше надо бы известить мир о своем присутствии. Если оставить все как есть, то на вашем сайте никого кроме вас не будет, для того чтоб посещаемость сдвинуть с нуля надо работать над этим. Promotion (раскрутка сайта) - целая наука. Особенно если не тратить на это денег... Первое что надо - это зарегистрироваться в рейтингах/каталогах. Рейтинги вам и счетчик дадут - можно будет узнать подробно о своих посетителях. Ну а самая лучшая статистика, как известно, у Spylog [http://spylog.ru] А далее...так там не на одну рассылку хватит!

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

mailto:green_kakadu@mailru.com

Подпиши на мои рассылки кого-нибудь - увеличим количество подписчиков естественным путем!!! Теперь у меня вдвое больше читателей будет!!!