Отправляет email-рассылки с помощью сервиса Sendsay

Веб-дизайн. От А до Я.

  Все выпуски  

Веб-дизайн. От А до Я. # 5


Служба Рассылок Subscribe.Ru проекта Citycat.Ru

Веб-дизайн. От А до Я.
# 5
18 февраля 2001г.
Проект сайта "ADG Scripts" webg.agava.ru
кол-во подписчиков - 2670

          В этом выпуске:

Адреса:
для Ваших вопросов по веб-дизайну
Ответы смотрите в рассылке "Веб-дизайн. Вопросы и ответы". Подписка на сайте http://webg.agava.ru
по вопросам публикации
по другим вопросам и предложениям

                          Давыденко Дмитрий
 
Доброе время суток!

 
Macromedia Flash.
Мифы и реальность, достоинства и недостатки

В настоящее время словосочетание Macromedia Flash знакомо практически каждому Интернет-пользователю. Однако, несмотря на уже достаточно продолжительный срок своего существования (по меркам Интернета, конечно), подавляющее большинство сайтов Сети всё-таки по-прежнему представляют собой статические создания голого HTML. В чём же здесь дело? Если Вы никогда не были знакомы с Flash, то тогда нажмите сюда и перед Вами скорей всего появится окно, которое предложит Вам загрузить некий plugin. Не пугайтесь, нажмите подтверждение и немного подождите, пока эон будет установлен на Вашу машину. После этого Вы увидите небольшой Flash-ролик. Если же он сразу предстанет перед Вашим взором, то это означает, что этот plugin уже установлен на Вашей машине.

Этот совершенно примитивный (с точки зрения Flash) ролик на 55 кадров занимает всего 2 887 байт дискового пространства. Для написания чего-либо подобного Вам потребуется около трёх минут. Аналогичный видеоролик, реализованный в стандартном формате gif 16 цветов занимает 110 280 байт дискового пространства, что на 2 порядка больше. Всё дело в том, что gif - это формат, предназначенный для хранения растровых изображений, а Flash-файл включает в себя векторную графику. Преимуществом векторной графики является не только размер занимаемого дискового пространства, но и возможность практически неограниченного масштабирования без потери качества. Однако если Вы попытаетесь создать ролик, в каждом кадре которого меняется фотографическое изображение, то Вы увидите, что в этом случае Flash практически не даёт преимуществ. Другими словами, Вы можете легко импортировать любую фотографию во Flash, где сможете ее поворачивать, масштабировать или искривлять. При этом размер Вашего Flash-файла с расширением swf будет лишь немногим больше, чем размер jpg-файла фотографии. Если же Вы попытаетесь в каждый кадр Вашего ролика вставить очередной кадр фильма в виде -jpg или gif - изображения, то увидите, что Ваш swf-файл имеет размер, сравнимый с размером всех -jpg или -gif - файлов, которые были включены в каждый его кадр. Поэтому Flash более применим для создания мультипликационных (рисованных) видеороликов, но для создания фотографической анимации почти не годится.

Тем не менее, я хочу предложить Вашему вниманию наиболее удачные, на мой взгляд, Flash-работы в сети: сайт ночного клуба "Белый медведь" и Avesta Design Studio.

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

Для того, чтобы создать Flash-сайт, Вам потребуется специальный редактор, 30-дневную бесплатную версию которого Вы можете скачать на сайте www.macromedia.com. Для того, чтобы поместить Flash-ролик в HTML-документ, Вам необходимо выбрать из меню File пункт Publish, и программа сама напишет Вам необходимый HTML-код страницы. С ним Вы потом сможете работать как с обычной HTML-страницей, а тег

<OBJECT CLASSID="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" CODEBASE="http://download.macromedia.com/pub/ shockwave/cabs/flash/swflash.cab#version=4,0,7,0" ALIGN="RIGHT" BORDER="0" HSPACE="0" WIDTH="250" HEIGHT="120"> собственно и осуществляет вставку Flash-ролика в веб-страницу.

Если Вы хотите создать просто домашнюю страничку и до сих пор не решили, чем Вы сможете её наполнить, то тогда Flash -это как раз то, что Вам нужно. Однако если впоследствии Вы собираетесь превратить ваш хоумпейдж в более солидный сайт, то лучше всё-таки подумать над его содержанием и ограничиться стандартным HTML.

Если Вы всё же решились, то читайте наши последующие номера.

Удачного творчества!

Александр Рыбников
Источник: http://emedia.atrus.ru/

Оглавление/Вверх

 

Работа с заголовками.

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

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

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

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

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

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


1. Короткий - лучше.

Это правило следует соблюдать особенно точно, в большинстве случаев неудачный заголовок достаточно сократить в два раза, чтобы он «заиграл». В общем случае, я рекомендую ограничиться двумя-тремя словами, но не более, чем 15-20 символами. В действительности, здесь многое зависит от самих слов: чем более длинные, малознакомые, редкоупотребляемые слова вы используете, тем жестче для вас это правило, иначе в голове читателя возникнет такая каша, которую вам не расхлебать никогда. С другой стороны, если вы используете в названии устоявшиеся выражения или поговорки («не садись на пенек, не ешь пирожок») или их легко узнаваемые модификации, то, в силу их известности, вы можете позволить себе и значительно более длинные заголовки.

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

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


2. Используйте простые,
часто употребляемые слова.

Это правило логически дополняет предыдущее и полностью с ним согласуется. Единственное, о чем следует сказать, это то, что не надо чрезмерно упрощать заголовки, так как в этом случае, они будут приняты за неграмотные, бескультурные. То есть, если вы обладаете такой известностью и популярностью, как например Гордон или Шендерович, то вы, возможно, можете себе позволить что-нибудь похожее на: «Чой-то нонче слышно?», но и то - только один раз. Если же - вы малоизвестный автор публикуете свою десятую статью, то я бы рекомендовал вам воздержаться от подобных экспериментов.


3. Не договаривайте до конца.

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


4. Не пренебрегайте знаками препинания.

Если восклицательные и вопросительные знаки обычно не забывают ставить, то точка почти всегда остается на обочине словесности. Тем не менее, акцентуация точки часто гораздо более выразительна, чем восклицание. Точка придает фразе законченность, заставляет читателя считать мысль проговоренной и сформированной, а следовательно - единой. Кроме того, именно точка создает ощущение умиротворенности и баланса, тем самым, она подготавливает читателя к спокойному, осознанному восприятию материала, его логическому анализу.

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

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


5. Не переусердствуйте с эмоциями.

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


6. Попробуйте нарушить эти правила.

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

Источник: http://www.mymoney.ru/


Оглавление/Вверх

 

Рейтинг сайтов по оформлению или TOP DESIGNED (# 7).

1) http://im-d.by.ru

Интер/Муть - все, что нужно начинающему веб дизайнеру. Это не реклама, это просто вынесенный в первое предложение заголовок. Сай радует (повторить два раза) своей легкостью. Легкие белые, серые, синие, черные тона сочетаются хорошо. Видно, что дизайнер передумал десятки вариантов оформления, пока не нашел тот единственный, который мы видим сейчас. Ладно, кликаем дальше...Это замечательно, что автор отказался от использования замены изображения при наведении. Если раньше это было круто, то теперь не многие хотят качать лишний траффик из-за пары теней и прочих фотошопных эффектов (посмотрите хотя-бы www.design.ru). Жалко, что этот сайт не обновляется уже десять дней. Совсем забыл отметить логотип сайта. Отметьте же его и вы... [ПЖ]

 

оформление:

4

дизайн:

4

оригинальность:

3

эффективность:

4
скорость: 4
моя оценка: 4


Рейтинг: 23

2) http://nirvana.bos.ru

Попробуйте догадаться - чему/кому посвящен этот сайт. Ну, думайте быстрее. Да, правильно, группе Nirvana. К сожалению - сайт оригинальностью не блещет, дизайном не выделяется (если только в не лучшую сторону). Странное сочетание цветов текста: красный, желтый, оранжевый, зеленый, салатовый, голубой, розовый(?), белый. По-моему - перебор. Давно не встречал расширения *.jpeg. Думал, что этот формат перешел уже в мир иной. Одним словом они (авторы) заыбыли сделать навигацию в разделах История...странный бэкграунд, невлезающая по размерам и качеству фотография группы на второй странице... [ПЖ]

 

оформление:

3

дизайн:

3

оригинальность:

3

эффективность:

3
скорость: 3
моя оценка: 3


Рейтинг: 18

 

3) http://pweb.udm.net

Есть такой сайт - pweb.udm.net, о котором я писал, что надо поставить пропуск флеша, который удивлялся - чего на сайте у него не работает, который позорно изменяет размер окна браузера. Может он думает, что его идея - сайт, на которм есть только его мэйл, а больше там ничего не будет? Тогда он ошибается. Так можно было думать, если бы не надпись ComM(?)ing Soon (!двойная M!), которую можно перевести, как - "Скоро Будд(?)ет". Одним словом...

 

Часть вторая. Собственно TOP LIST. И ВНЕ РЕЙТИНГА.

Смотрите на моем сайте

 

Часть третья. Из будущего.

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

PS "Во многом определяя моду на дизайн, мы делаем то, что до нас никто не делал, меняя лицо русского интернета." Артемий Лебедев.

Петр Жарнов: zoomdesign@euro.ru
http://zoomdesign.euro.ru/

Оглавление/Вверх

 

Параметры текста

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

Начнем-с:

Word-spacing - описывает расстояние между словами (не работает в IE и NC);
Имеет следующие значения:
числовое
normal - остается без изменений
Пример написания:
word-spacing: 45pt

Letter-spacing - описывает расстояние между буквами в числах (NC не поддерживает);
Пример написания:
letter-spacing: 50

vertical-align - описывает позицию одного элемента относительно других(в NC не работает);
применяется для inline-элементов (не рабивает строку, т.е. элемент может находится на одной линии с другими)
Значения:
baseline
sub
super
top-text
top
middle
bottom
bottom-text
%
Пример написания:
vertical-align: bottom-text

text-transform - описывает изменение текста (в NC не работает);
применяется для inline-элементов.
Значения:
none - остается без изменений
capitalize - каждое слово начинается с заглавной буквы
uppercase - каждая буква текста будет заглавной
lowcase - каждая буква текста будет маленькой
Пример написания:
text-transform:capitalize

text-align - описывает расположение текста в документе;
применяется для block-элементов (разбивает строку до и после данного элемента, т.е. элемент не лежит на одной линии с другими)
Значения:
left - текст слева
right - текст справа
center - текст по центру
justify - текст по ширине
Пример написания:
text-align:justify

text-indent - описывает отступ; применяется для block-элементов
Значения:
числовые
в процентах
Пример написания:
text-indent: 10%

line-height - описывает отступ сверху
Значения:
normal
числовые
процентные
Пример написания:
line-height: 50%

BackGround или работа с фоном.

CSS предоставляет уникальную возможность "крутить" фоновым изображением. Убедитесь в этом сами:

color - указывает цвет элемента;
Пример написания:
color:green;

background-color - задает цвет фона;
Пример написания:
background-color:#464646

Можно также в качестве фона использовать изображение:
background-image - устанавливает изображение в качестве фона;
Для того, чтобы вставить изображение, надо сделать такое:
background-image: URL('путь к файлу изображения')

background-repeat - описывает повторение фонового изображения в заданных направлениях;
Значения:
repeat - размножение во всех направлениях
repeat-x - размножение по горизонтали
repeat-y - размножение по вертикали
no-repeat - размножение отсутствует
Пример написания:
background-repeat: repeat-x

background-attachment - описывает возможность прокрутки фонового изображения;
Значения:
scroll - изображение движется (скроллится) вместе с содержанием документа
fixed - скроллинг отсутствует
Пример написания:
background-attachment:scroll

background-position - описывает положение фонового изображения в документе (работает при background-repeat: repeat(repeat-x, repeat-y, no repeat))
Значения:
% от ширины + % от высоты
top (сверху), middle (по середине), bottom (внизу) - использовать любое одно
left (слева), right (справа), center (по центру) - использовать любое одно
S от левого края + S от вершины //где S - расстояние
Пример написания:
background-position: top, right

Замечание: если Вы так и не поняли куда эти свойства вставлять, то давайте я Вам подскажу:
итак, для того, чтобы изменить фон (-овое изображение), установить общие свойства для текста (отсуп между буквами, словами, некоторых элементов относительно друг друга и т.п.) и/или что на Ваш взгляд относится к тегу <body>, СЛЕДУЕТ ВСТАВЛЯТЬ ЭТО ТАКИМ ОБРАЗОМ

body{свойства;}

Ну, вот, опять на самом интересном месте (фрагмент из мультфильма "Кеша")...
superCopyright 2001 Farkhad Rakhmetov.
все вопросы к яндекс, ой, т.е. ко мне
fpost@elcom.kz


Оглавление/Вверх
Бесплатные Гостевые Книги.

Вы можете получить БЕСПЛАТНО для Вашего сайта 'Гостевую Книгу' с администрированием. Если у Вас нет поддержки CGI скриптов, то Вас это должно заинтересовать.

Вы получите возможность вставлять свои баннеры, навигацию, подстраивать под свой дизайн, отсылка новых сообщений на Ваш e-mail и др. Для этого Вам просто надо прислать заявку и в течении 1 суток Ваша Гостевая будет готова.
Подробности на сайте http://webg.agava.ru/


    Вы хотите публиковаться?
    Присылайте статьи или вопрос (по публикации) по адресу kar_dd@inbox.ru с пометкой "Статьи в рассылку". Гонорар за статьи - договорной (500-2000 показов RLE).

Я жду Вас на сайте моего проекта http://webg.agava.ru
Здесь Вы можете найти:


Дмитрий Давыденко



http://subscribe.ru/
E-mail: ask@subscribe.ru
Поиск

В избранное