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

WEB дизайн - начинаем с пикселя -баннеры, скрипты, шаблоны

Рассылка закрыта

При закрытии подписчики были переданы в рассылку "Раскрутка и продвижение сайта. Лучшие партнерские программы" на которую и рекомендуем вам подписаться.

Вы можете найти рассылки сходной тематики в Каталоге рассылок.

←   Февраль 2004   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
Автор
Александр

Статистика

2.334 подписчиков
-9 за неделю
←   Все выпуски   →

WEB дизайн - начинаем с пикселя -баннеры, скрипты, шаблоны №9


Информационный Канал Subscribe.Ru

Доброе время суток.
Сегодня в выпуске
- Несколько советов по WEB дизайну
 - Шаблоны для сайтов
- Скрипты (Строка статуса)
- Локальная баннерная система
- Photoshop для WWW (кнопки)

Выпуск №9

Несколько советов по дизайну

Автор: MadCoder(madcoder@hotbox.ru)

1) Не лепите слишком много GIF и Flash анимации. Я не говорю, что её вообще не должно быть, наоборот если она использована правильно и к месту, то только улучшить вид вашего сайта, но когда её слишком много или она вставлена не к месту, то может свести на нет все ваши старания.

2) Не ставьте слишком много счётчиков. Не буду сейчас распространятся почему, просто поверьте на слово. Оптимальный вариант - 2 или 3 счётчика на странице. При этом поместите их так, чтобы они вписывались в ваш дизайн. Так же не стоит пренебрегать возможностью выбрать цвет счётчика - подберите под свой сайт.

3) Будте осторожны с "бегущими строками". Этот элемент Web страниц может неплохо дополнить ваш дизайн, а может всё испортить напрочь.

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

4) Правильно подберите цвета. Я имею ввиду то, что нужно выбирать тот цвет шрифта, который будет хорошо виден на выбранном вами фоне. Цвета не должны быть слишком яркими, они должны контрастировать друг с другом. Для начала советую попробовать классику: чёрное на белом.

5) Не злоупотрябляйте Java Script'ом Ох как любят начинающие дизайнеры налепить побольше таких скриптов! Мой совет - не делайте этого. То есть, конечно, можно добавить какие-нибудь часики или ещё что, но не злоупотреблейте этим! Во всём нужно соблюдать умеренность.

6) Пишите размер файлов, выложенных на скачивание. Если вы даёте ссылку на какой-то файл, то обязательно укажите его размер, чтобы посетитель знал на что он идет :)

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

8) Оформляйте все страницы в одной цветовой гамме. То есть, если на главной странице цвет фона у вас, например серый, то будьте добры и на остальных страничках сделать его таким же.

9) Не ставьте на одну страницу много баннеров. Почему? Потому что они долго грузятся, отпугивают посетителей и перегружают дизайн.

10) Старайтесь делать как можно меньше орфографических ошибок и опечаток. Тут думаю объяснять ничего не надо.

 
Шаблоны для сайтов.
Шаблон №4

[посмотреть]
[скачать 13Кб]
примечание: в шаблоне используется таблица стилей CSS.
Может пригодиться при создании своей студии WEB дизайна.

 
Скрипты
Строка статуса
   текст мерцает [скачать]
   собирающийся и меняющийся текст [скачать]
   показывает координаты курсора [скачать]
   бегущая строка [скачать]
   собирающийся текст [скачать]
 
Локальная баннерная система

Этот скрипт поможет вам организовать на своем сайте или страничке баннерную систему.

Первый фрагмент вы вставляете в любое место странички. Лучше в теге <HEAD>.

<SCRIPT language="JavaScript">
// <!-- Begin
function banners()
{

bn[1]="http://www.ссылка1.ru";
bn[2]="http://картинка1.gif";

bn[3]="http://www.ссылка2.ru";
bn[4]="http://картинка2.gif";

bn[5]="http://www.ссылка3.ru";
bn[6]="http://картинка3.gif";


if ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion.substring(0,1)) < 3)) { return(' '); }
var j=(new Date()).getSeconds() % 5;
document.write('<a href=' + bn[2*j+1] + ' target=blank><img src=' + bn[2*j+2] + ' border=0 width=468 height=60></a>');
return(' ');
}
// -->
</SCRIPT>

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


<SCRIPT language="JavaScript">
// <!-- Begin
banners();
// -->
</SCRIPT>

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

bn[7]="http://www.ссылка4.ru";
bn[8]="http://картинка4.gif";
 
Photoshop для WWW

Кнопки

Вторым специфическим элементом дизайна Web-страниц являются графические элементы управления — кнопки. Рисование кнопок стало своеобразным особым "жанром", и если вы не хотите ударить в грязь лицом, используйте возможности Adobe Photoshop  — эффекты для слоев. Они позволяют создавать самые замысловатые кнопки в несколько щелчков мышью. Набор эффектов и их комбинации позволяют создавать огромное количество вариантов кнопок. Ниже приведен список предопределенных эффектов:

Эффект Имитация Параметры
Drop Shadow   Тень от объекта на плос кости. Объект производит впечатление приподнятого над фоном Режим наложения (Mode). 
Непрозрачность (Opacity). 
Цвет тени. 
Угол, под которым направлен свет (Angle). Расстояние от объекта (Distance).
Размывка тени (Blur)
"Густота" тени (Intensity)
Inner Shadow Тень от границ объекта на самом объекте Объект производит впечатление вырезанного из фона  Режим наложения (Mode)
Непрозрачность (Opacity)
Цвет тени
Угол, под которым направлен свет (Angle)
Расстояние от объекта (Distance)
Размывка тени (Blur)
"Густота" тени (Intensity)
Outer Glow Свечение объекта Режим наложения (Mode) 
Непрозрачность (Opacity)
Цвет свечения 
Величина свечения (Blur) 
Яркость свечения (Intensity)
Inner Glow Свечение объекта изнутри Режим наложения (Mode)
Непрозрачность (Opacity)
Цвет свечения
Величина свечения (Blur)
Яркость свечения (Intensity)
Выбор светящейся части объекта— края 
(Edges) или центр (Center)
Bevel and Emboss Барельеф и горельеф. Объект выглядит выдавленным на фоне, вдавленным в фон или сам приобретает рельеф Режим наложения (Mode) для теней 
Режим наложения (Mode) для светов Непрозрачность (Opacity) для теней Непрозрачность (Opacity) для светов 
Цвет светов 
Цвет теней 
Вариант эффекта

Внешний скос (Outer Bevel)
Внутренний скос (Inner Bevel)
Барельеф (Emboss)
Вдавленный барельеф (Pillow Emboss) 

Угол, под которым направлен свет (Angle) 
Высота рельефа (Depth) 
Размывка рельфа (Blur) 
Выбор между барельефом (Up)
и горельефом (Down)

При умелом сочетании эффектор с остальными богатыми возможностями Photoshop можно получить весьма оригинально выглядящие кнопки.
Источник: http://www.alexsoft.ru/
А также Электронный журнал "Интернет-ревю" N7

 
Всего доброго.
Дмитрий www.dbsite.hop.ru dbsite@hop.ru Баннеры по цене от 0.5$
Заказать
http://subscribe.ru/
E-mail: ask@subscribe.ru 		Отписаться
Убрать рекламу
В избранное