RSS-лента

Лучшие CMS интернета бесплатно для создания сайта

Дизайн сайта, технологии своими руками

веб дизайн сайта

Дизайн сайта – это первое с чем сталкивается клиент при просмотре вашего портфолио. Именно по дизайну сайта оценивается уровень вашей работы, и компании в целом.

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

Дизайн сайта и Юзабилити

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

Дизайн начальной страницы сайта

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

dizain

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

Роль навигации в дизайне сайта

Когда мы находимся на каком-то сайте, мы постоянно про себя оцениваем разработку дизайна сайта: «Эти ребята действительно хорошо все сделали?». И наша оценка является основным фактором, определяющим наше отношение к сайту. От нее зависит, придем ли мы на этот сайт еще раз или нет. Естественно, что тщательно разработанная навигация — это одна из возможностей, чтобы произвести благоприятное впечатление на пользователя.

Логотип в дизайне сайта

Логотип или название сайта выполняет в дизайне ту же роль, что и вывеска на входе в какое-либо учреждение. Мы ожидаем, что логотип сайта будет находиться в верхней части страницы, обычно в верхнем левом углу или, по крайней мере, в непосредственной близости к нему, — аналогично тому, как мы привыкли видеть табличку с наименованием учреждения прямо на его главном входе. Это объясняется тем, что логотип представляет весь сайт в целом, и, следовательно, он занимает самую верхнюю позицию в логической иерархии сайта. Ввиду вышесказанного, можно сделать логотип самым заметным объектом дизайна на странице с различными визуальными CSS эффектами.

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

Правильное размещение формы поиска в дизайне сайта

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

Вкладки и табы в дизайне сайта

Разработчики дизайна всегда стремятся сделать свои страницы визуально более привлекательными, но не в ущерб скорости загрузки страниц. Грамотно разработанные вкладки и табы делают страницы красивее и интереснее и при этом не увеличивают общий объем страниц. На мой взгляд, вкладки являются превосходным навигационным устройством для больших сайтов. Для того чтобы вкладки хорошо работали и создавали нужный дизайн эффект, их графика должна создавать визуальную иллюзию того, что активная вкладка находится впереди других вкладок. Именно это свойство — даже больше, чем внешнее подобие, — вызывает ощущение того, что это вкладка.

vkladki

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

Название страницы в дизайне сайта

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

Заключение.

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

  • Что это за сайт? (Логотип сайта)
  • На какой странице я нахожусь? (Название страницы)
  • Какие главные разделы на этом сайте? (Разделы)
  • Какие опции есть на этом уровне? (Локальная навигация)
  • Где именно я нахожусь в общей структуре сайта?(Указатели «Вы находитесь здесь»)
  • Каким образом осуществляется поиск

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

Июл
11

Что такое фавикон, фавиконы для сайта

изобр1

Добрый день уважаемые читатели блога «Золотой серфер». Сегодня по многочисленным просьбам я постараюсь, доступным языком объяснить, как установить, сделать или просто сменить иконку — фавикон, которая отображается: в браузерной строке сайта, закладках (favorites), результатах поиска от яндекс favicon ico, или например, на специфических ресурсах (каталогах, социальных проектах).

Май
6

WordPress плагин Display Widgets

Display Widgets_min

Всем привет. Не так давно я уже рассказывал вам про популярные виджеты, которые расширяют функционал административной панели в WordPress. Но, в той статье я не рассказал про один не очень популярный, но нужный плагин. Для тех пользователей, которым нужно менять контент сайдбара на различных страницах и избежать при этом создания множества сайдбаров и дублирования виджетов, есть одно интересное решение. Решение заключается в использовании плагина под названием Display Widgets.

Мар
29

Какой формат изображения лучше

форматы файлов

Всем привет. При публикации новой статьи, часто возникает вопрос, а какого формата использовать изображения в статье? В целях оптимизации изображения для достижения наилучшего результата, вы должны выбрать формат растрового изображения.
В этой статье мы кратко обсудим популярный GIF и формат JPEG, а затем проанализируем формат PNG, и развеем некоторые заблуждения по поводу использования тех или иных форматов.

Фев
6

Примеры 404 страницы ошибки для вдохновения

stranica oshibki

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

Фев
2

Создаем страницу ошибки 404

vu5wAJgdlIo

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

Фев
1

Вёрстка сайта с нуля

verstka

Всем привет. С понятием верстка сайта знакомы все, кто сталкивался с интернет-бизнесом, разработкой сайтов или просто заказом ресурса. Вёрстка сайта это создание web-страниц с помощью редактора, если сайт разрабатывается как индивидуальный, или на основе готовых площадок и макетов.

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

Окт
9

Как создать Яндекс поиск для сайта

яндекс поиск для сайта

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

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

вверх