?

Log in

No account? Create an account

Previous Entry | Next Entry

В предыдущих выпусках:

Выбор имени сайта
Хостинг

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

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



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

1. Логотип должен находиться на каждой странице, быть кликабельным и приводить на главную страницу.

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

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

4. На каждой странице должно быть ее внятное название. Чтобы оно появилось наверху, в "синей рамке" браузера, его нужно прописать в теге title, и желательно повторить его на странице, чтобы посетитель не запутался, где он находится. Желательно прописать ключевые слова в соответствующих тегах.

5. Не называйте имена файлов русскими буквами, пробелы тоже не надо. В принципе, с пробелами работать будет, но некрасиво (в адресной строке вместо пробела вы увидите странную группу символов типа 20%). Лучше замените их дефисом или подчеркиванием.

6. Страница должна быть "резиновой", т.е сама выстраивать себя по ширине браузера. Достигается это, например, созданием по всей ширине страницы таблицы с параметрами width=100% (height=100% тоже можно, но не всегда нужно). Тогда в любом разрешении при изменении размера браузера страница будет выглядеть прилично. Если вы будете делать магазин на приличном движке, он всё это сделает сам, заморачиваться не нужно.

7. Избегайте больших и тяжелых картинок. Разрешение экрана 72 dpi, не нужно заливать на сайт картинки с бОльшей резолюцией. В фотошопе есть опция save for web, она создает нужную резолюцию, в других редакторах можно выставить это значение вручную. Лучше не перегружать сайт анимированными гифками и прочими мультиками, если ваш сайт не youtube, конечно. Картинка, которая "разорвет" ваш дизайн при небольшом разрешении экрана, тоже попортит впечатление от сайта.

8. Не пишите синим по серому, желтым по черному, красным по зеленому, лучше всего писать черным по русскому белому, или, еще лучше, чуть-чуть серому, бежевому, в общем, чтобы был привычный глазу контраст. Размер букв тоже желателен стандартный, 10-11, меньше тяжело читать, больше смотрится как детский почерк. Если посетителю мелко и плохо видно, он может надеть очки увеличить размер шрифта, удерживая клавишу ctrl и одновременно прокручивая колесико мышки.

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

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



Вот, собственно, всё, что я, дилетант, могу рассказать вам о дизайне. Остальное вам подскажет интуиция, вкус, чувство меры и друзья, которым обязательно нужно показать результат и попросить покритиковать. Критика, разумная и даже порой неразумная, сильно улучшает результат.

Далее в программе:
- движок
- как и чем принимать платежи
- немного о раскрутке
- как заработать на контентном сайте
- для израильтян: открытие собственного бизнеса без ущерба для психики

Comments

( 17 comments — Leave a comment )
tseytlin
Sep. 2nd, 2013 01:33 pm (UTC)
Спасибо!
Читаю с неослабевающим вниманием.
gentlemenka
Sep. 2nd, 2013 03:01 pm (UTC)
Хорошо, что ты это пишешь, а то когда комментов нет, кажется, что никому не нужно :)
l_cherry
Sep. 2nd, 2013 03:21 pm (UTC)
Нужно-нужно! Я тоже очень внимательно читаю, пока в чисто познавательном плане, но надеюсь что и до практического применения однажды дойдет, были такие мысли.
gentlemenka
Sep. 2nd, 2013 06:23 pm (UTC)
Да я в общем-то понимаю, что комментировать тут нечего :) но все равно обратная связь приятна :)
oh_miriam
Sep. 2nd, 2013 07:10 pm (UTC)
*падает ниц второй раз и ждёт продолжения*
gentlemenka
Sep. 2nd, 2013 07:48 pm (UTC)
продолжение следует :)
oh_miriam
Oct. 22nd, 2014 01:53 pm (UTC)
я не тормоз, как известно, я медленный газ.
А дай ссылку на свой сайт.

Edited at 2014-10-22 01:53 pm (UTC)
gentlemenka
Oct. 22nd, 2014 02:13 pm (UTC)
Хе :) У меня несколько :)
Продающий - вот http://4-hobby.com
Контентный - тут http://nazdorovie.com
И две неудачи, развивать лень и некогда, но поскольку есть посетители и рекламодатели, я их не закрываю, русский и английский - когда-то делались под уже умерший сайт-магазин подарков
http://all-gem-stones.com и http://all-gem-stones.net (смотрю, что-то с него картинки слиняли, вот надо будет починить)
oh_miriam
Oct. 22nd, 2014 02:22 pm (UTC)
вот это размах, аж 4 ))
опять вопросы от блондинки - первый понятно, там продажа, а контентный что тебе даёт?
gentlemenka
Oct. 22nd, 2014 03:31 pm (UTC)
Там реклама посторонняя, за деньги :)
Но раньше он был для другого. Тот сайт, что про здоровье, был для интереса, а потом на нем вырос форум, который ведет очень хороший человек :) а те, что про камни, - были призваны продвигать магазин, который я сначала "продала" Васе, потом он пошел по рукам, а потом совсем заглох.
oh_miriam
Oct. 22nd, 2014 06:37 pm (UTC)
понятно.
а с Васей история просто детективная.
gentlemenka
Oct. 22nd, 2014 06:52 pm (UTC)
Васю до сих пор вспоминаю и вздрагиваю
oh_miriam
Mar. 23rd, 2015 09:34 am (UTC)
я бестолочь, всю почту перерыла, не могу найти твой мейл, а мы же переписывались, ыыы. Хотела спросить несколько вопросов, если ты не против *стеснительно ковыряет ножкой пол*
(Screened comment)
oh_miriam
Mar. 23rd, 2015 09:51 am (UTC)
спасибо, стирай, сейчас напишу.

ЗЫ. Падлюка джемейл выдал твой мейл, как ему знакомый, а поиском не искал.
gentlemenka
Mar. 23rd, 2015 09:57 am (UTC)
Может, у меня подпись нерелевантная...
kaverina_l
Sep. 15th, 2014 06:41 pm (UTC)
Очень ждем и благодарны.
gentlemenka
Sep. 15th, 2014 07:07 pm (UTC)
Осталась одна статья :)
( 17 comments — Leave a comment )