Веб-дизайн

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

А бывает другая ситуация: вы – владелец сайта – не можете взять в толк, почему народ бежит с ресурса в первые 5 секунд? Почему летающие снежинки и чарующие звуки на вашем сайте не увеличивают конверсию?! Возможно, проблема в дизайне сайта, а точнее, в его юзабилити. Все эти подводные камни можно обойти, изучая уроки веб дизайна, собранные в этом разделе КодоМазы. Вообще, разработка графического представления интернет ресурса и его структуры – лишь малая часть того, что называется UI – пользовательским интерфейсом, который, в свою очередь входит в глобальное здание UX – опыта пользовательского взаимодействия.

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

   

Обзор основных графических редакторов

В статье дается описание основным графическим редакторам, особенности, преимущества и недостатки.

Современные стили веб-сайтов

Веб-дизайн – это гармоничный микс творчества и коммерции, направленный на создание определенного интернет-ресурса. Его владелец, что вполне понятно, имеет конкретную цель: получение дохода. Стиль сайта, Первым делом, определяет характер его деятельности и непосредственно то, чем он занимается. Грамотный веб-дизайнер подходит к построению ресурса именно с этой стороны.

Делаем в Photoshop макет сайта в виде открытой книги

Урок web дизайна в Photoshop, в котором предлагается создать очень простой, и может даже примитивный, но оригинальный и своеобразный макет сайта в виде открытой книги с закладками между страницами.

Основные правила оформления сайта

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

Конструкторы сайта (обзор)

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

Рекламные баннеры на сайте

Использование баннера как популярного средства раскрутки сайта.

Как создать в Photoshop дизайн сайта в стиле Clean WEB-2.0

В этом уроке веб-дизайна вы узнаете, как шаг за шагом, создать в Photoshop красивый и очень своеобразный, гладкий дизайн сайта в стиле «Web 2.0». Для того чтобы усвоить урок, достаточно знакомства с интерфейсом программы Photoshop.

Создаём элегантный макет сайта для фотографа

Урок web дизайна в Photoshop, где вы узнаете, как сделать PSD макет web страницы с красивым дизайном в темных тонах, который идеально подходит для сайта портфолио, ориентированного на демонстрацию фотографий. В данном уроке используются типовые приемы и методы, которые обычно применяются при разработке макетов сайтов.

Подбор цветового решения в веб-дизайне

В этой статье будет рассматриваться визуальная часть — одна из самых главных в разработке сайта.

Современные тенденции сайтостроения

Современные тенденции сайтостроения и важность модернизации архитектуры сайта в соответствии с растущими требованиями рынка.

Дизайн и оформление писем для E-mail рассылок

Методы оформления E-mail рассылок. Что необходимо учитывать и как подготовить такую рассылку?

HTML 5 и CSS 3 новые возможности создания веб-страниц

Рассмотрим новые и интересные возможности в использовании HTML 5 и CSS 3.

Как создать логотип?

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

Создаём в Photoshop элегантный и простой Web макет блога

Урок web дизайна в Photoshop, в котором вы увидите процесс разработки подкупающе простого и чистого PSD макета главной страницы блога с элегантным, симпатичным дизайном.

Обзор программ для снятия скриншотов

В статье рассмотрены следующие программы для создания скриншотов: KiberInfinity's Screen Shooter, Image Uploader, Lightshot, PicPick, SimpleScreen и другие.

Восприятие человеком формы логотипа

Статья о том, как различные формы логотипа влияют на восприятие человека.

Создаём макет сайта с рождественской темой в красных и золотых тонах

Урок web дизайна в Photoshop, в котором показан процесс разработки красивого и нарядного макета сайта с рождественской темой в красных и золотых тонах. Дизайн макета вызывает праздничное настроение.

Классификация веб-сайтов

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

Оптимизация изображений под поисковые системы

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

Использование анимации на сайте

Особенности применения анимации на сайте.

Дизайн коммерческого сайта

Основные принципы дизайна для разных коммерческих сайтов.

Как создать анимационную иконку для сайта

В статье говорится о том, как создать анимационную иконку.

Скорость загрузки сайта - повелитель внимания

О влиянии скорости загрузки сайта на внимание посетителей.

Оптимизация JPG изображений

Оптимизация изображений в формате JPG. Сжимать изображения полезно для более быстрой загрузки веб-страниц.

Минимализм (стиль clean & simple) в веб-дизайне

Многие, известные всему миру дизайнеры давно поняли: все гениальное – просто. Зачем что-то усложнять? Ведь современный человек и так решает сразу много проблем. А если еще тратить кучу времени на восприятие веб-страниц? Времени совсем не останется.

Макет галереи изображений с футуристической темой космоса в Photoshop

Иллюстрированный урок web дизайна, из которого вы узнаете, как создать в Photoshop макет 3D галереи изображений с футуристической темой космоса. Для создания иллюзии трехмерного изображения автор использует тонкие эффекты освещения и теней в совокупности с трансформацией перспективы. К уроку прикладывается исходный файл PSD Photoshop.

Создаём в Photoshop элегантный и простой Web макет блога (Часть 2)

Продолжение урока web дизайна, в котором мы создаём PSD макет главной страницы блога с элегантным, симпатичным дизайном.

Делаем меню с «лунной» поверхностью в Photoshop

Урок web дизайна в Photoshop, где автор показывает, как создать макет сайта, в котором шапка с заголовком и меню расположены на красочной, фигурной панели с резко освещенной, «песчаной» поверхностью, напоминающей лунную. Как web макет, проект по-детски прост, но идею и впечатляющие эффекты вполне можно использовать для дизайна сайтов.

Создаём в Photoshop современный макет игрового сайта (Часть 4)

Четвёртая часть урока по созданию в Photoshop современного макета игрового сайта в темных тонах.

Макет галереи изображений с футуристической темой космоса в Photoshop (Часть 2)

Продолжение урока web дизайна, из которого вы узнаете, как создать в Photoshop макет 3D галереи изображений с футуристической темой космоса.

Создаём в Photoshop современный макет игрового сайта

Урок web дизайна, в котором раскрыт процесс создания в Photoshop современного, впечатляющего макета игрового сайта в темных тонах.

Создаём элегантный макет сайта для фотографа (Часть 2)

Продолжение урока web дизайна в Photoshop, где вы узнаете, как сделать PSD макет web страницы с красивым дизайном в темных тонах, который подходит для сайта портфолио, ориентированного на демонстрацию фотографий.

Создаём в Photoshop креативное, современное меню

Урок Photoshop, посвященный созданию оригинального, современного и креативного меню в форме диска с эффектом объема. Специальные термины и команды Photoshop в тексте приводятся на двух языках.

Инструменты веб-дизайнера

В статье даны общие представления о работе веб-дизайнера и инструментах, которые он использует.

Создаём в Photoshop современный макет игрового сайта (Часть 3)

Третья часть урока по созданию в Photoshop современного макета игрового сайта в темных тонах.

Создаём в Photoshop современный макет игрового сайта (Часть 2)

Вторая часть урока по созданию в Photoshop современного макета игрового сайта в темных тонах.

Применение изображений и графики в веб-дизайне

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

Создаём в Photoshop креативное, современное меню (Часть 2)

Продолжение урока web дизайна в Photoshop, посвященного созданию оригинального, современного и креативного меню в форме диска с эффектом объема.

Обращаем внимание на дизайн сайта

Рассмотрены основные моменты, на которые следует обратить внимание при выборе и разработке дизайна сайта.

Оптимальные решения при медленной загрузке сайта

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

Создаём макет сайта с рождественской темой в красных и золотых тонах (Часть 2)

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

Возможно ли безопасное обновление сайта?

Об опасностях обновления сайта.


Авторизация

Если у Вас нет учетной записи, зарегистрируйтесь

Напомнить пароль
Создание учётной записи
Напомнить пароль
Войти в личный кабинет