Alfa Bank

Official Websites

• https://alfabank.ru

Brand Guidelines

2008

Brand Summary

Mission

• To provide high-quality, technologically advanced financial services, maintaining an impeccable reputation and fulfilling commitments, as a leading private bank in Russia with a presence in global financial markets [^1].

Core Values

• quality
• technological advancement
• reputation
• commitment
• regional and international presence

Target Audience

• Private individuals, small and medium businesses, corporate clients, financial organizations, and investors, primarily in Russia and neighboring countries, but also globally [^2].

Personality Traits

• professional
• modern
• clean
• trustworthy
• dynamic

Visual Identity Overview

• The brand uses a clean, professional, and modern visual style with a prominent red and white color palette, a stylized logo, strict typography rules, modular grid layouts, and consistent imagery guidelines. The logo and visual elements are always displayed with precise proportions and color usage, emphasizing clarity and brand recognition [^3].

Categories

Brand Imagery

• На сайте используются следующие виды иллюстраций: фотографии для шапки главной страницы, фотографии для внутренних страниц, фотореалистичные изображения и плоские иллюстрации.
• Правила использования изображений людей: — люди должны обладать приятной внешностью; — разрешается использоваться только фотографии действующих сотрудников Альфа-Банка; — силуэт человека должен быть обрезан ниже пояса; — иллюстрация должна быть «привязана» к последнему пункту левого меню внутренней страницы; — допускается «уход» силуэта под обрез справа; — не допускается эффект «зависания» силуэта в воздухе; — изображение должно быть фронтальным или «три четверти»; — запрещается размещать на сайте снимки, заимствованные из фотобанков.
• Для иллюстрирования проводимых акций допускается использование фотореалистичных, плоских изображений (логотипы бизнесов, силуэты, контурные иллюстрации), а также фирменных иллюстраций для каждой конкретной акции, если таковые имеются. Правила их использования: — изображение предмета должно ясно «считываться»; — предмет должен быть изображен полностью; — должен присутствовать элемент, окрашенный в «Альфа-красный» цвет.
• Запрещается размещать на сайте снимки, заимствованные из фотобанков, а также изображения не соответствующие стилистике сайта.
• Шапка представляет собой прямоугольник со скругленным верхним левым углом (радиус — 10 пикселей), окрашенный в «Альфа-красный» цвет. Шапка размещается в левом верхнем углу главной страницы и имеет отступы 20 и 10 пикселей сверху и слева от границ окна браузера соответственно. Высота шапки — 309 пикселей, ширина составляет 80% от ширины окна.
• В шапке располагаются: логотип, текстовый блок, фотография сотрудника Альфа-Банка и горизонтальное меню.
• В правой части шапки размещается фотография сотрудника Альфа-Банка. Люди на фотографиях должны иметь славянскую внешность. При этом используются только фотографии действующих сотрудников Альфа-Банка.
• Фотография должна иметь вертикальную ориентацию и выступать за верхний край шапки на 5 пикселей. Размер иллюстрации — 302×329 пикселей. Модель фотографируется в расслабленной, свободной, но сдержанной позе, положение тела — анфас либо «три четверти». На модели должна быть деловая одежда, в руках можно держать офисную атрибутику (папка, очки, мобильный телефон и пр.)
• Голова должна находиться в положении анфас или «три четверти». Недопустимо изображения головы в профиль. На лице должна быть легкая улыбка.
• Запрещается размещать на сайте снимки, заимствованные из фотобанков.
• Большой баннер состоит из изображения, иллюстрирующего предложение или услугу банка, которое сопровождается текстом.
• Максимально допустимая ширина графического изображения — 340 пикселей.
• Графическое изображение должно представлять собой один или несколько объектов, но не более трех. Необходимо, чтобы объекты на баннере были видны полностью, четко различались и ассоциировались с предложением или услугой.
• Обязательным условием является использование в графическом изображении «Альфа-красного» цвета (#EF3124). При подготовке изображений, размещаемых на баннере, допустимо использование дополнительных цветов, не входящих в корпоративную палитру.
• Для большого баннера допустимо срезать изображение по левому краю.
• Недопустимо обрезать графическое изображение справа. Изображение, иллюстрирующее предложение или услугу, не должно буквально отражать сопроводительный текст.
• Для баннера можно использовать только статичные изображения, не допускается размещение флеш-роликов и GIF-анимации.
• Малый баннер представляет собой прямоугольную область с пунктирной границей и скругленными левым верхним и правым нижним углами (радиус —10 пикселей). Состоит из графического изображения и текстового блока.
• Максимальная высота малого баннера — 183 пикселя при разрешении экрана 1024×768 пикселей. Ширина баннера зависит от ширины окна браузера. Максимально допустимая ширина — 340 пикселей.
• Графическое изображение должно быть фиксированной высоты, равной 100 пикселям. Ширина варьируется в зависимости от ширины окна браузера. Максимально допустимая ширина — 150 пикселей.
• Графическое изображение должно состоять из одного либо нескольких объектов, но не более трех. Объекты должны быть видны полностью, хорошо различаться и ассоциироваться с предложением или услугой. Обязательным условием является использование в иллюстрации «Альфа-красного» цвета (#EF3124).
• При подготовке изображений, размещаемых на баннере, допустимо использование дополнительных цветов, не входящих в корпоративную палитру.
• Изображение, иллюстрирующее предложение или услугу, не должно буквально отражать сопроводительный текст. Недопустимо срезание изображения по верхнему, нижнему, левому и правому краям.
• Запрещается размещать иллюстрации, не соответсвующие стилистике сайта.
• Для баннеров можно использовать только статичные изображения, не допускается размещение флеш-роликов и GIF-анимации.
• Все изображения, иллюстрирующие разделы сайта, на любой внутренней странице должны располагаться в правом верхнем углу контентной части, справа от меню второго уровня. На большинстве страниц нельзя размещать иллюстрации внутри текста.
• Иллюстрации в теле текста допустимо размещать только на страницах с описанием пластиковых карт.
• При использовании изображений необходимо строго придерживаться правил, описанных в разделе «Общие требования к иллюстрациям для размещения на сайте», стр. 15.

Color Palette

• Все цвета, используемые на сайте, описаны в шестнадцатеричной кодировке HEX. Для удобства они условно разделяются на основные и дополнительные.
• Основные цвета применяются в фирменной символике, для оформления текста и заголовков, ссылок и графических маркеров, информационных плашек. Всего основных цветов четыре: белый (#000000), черный (#FFFFFF), «Альфа-красный» (#EF3124), «Альфа-платиновый» (#D1D5D8).
• Дополнительные цвета необходимы для выделения вспомогательной информации на сайте. Всего используется 8 дополнительных цветов.
• На главной странице логотип окрашен в белый цвет и размещен на фоне «Альфа-красного» цвета (#EF3124). Такое изображение называется негативным.
• На внутренних страницах логотип окрашен в «Альфа-красный» цвет (#EF3124) и размещен на белом фоне (#000000). Такое изображение называется позитивным.
• Недопустимо поворачивать логотип, изменять его пропорции, а также пропорции и расположение элементов логотипа относительно друг друга, использовать цвета, не входящие в корпора-тивную палитру.
• Использование любых других шрифтов, цветов и начертаний не допускается.
• font-family: Arial, Sans-Serif; color: #000000; font size: 0,8 em
• Заголовок 1: font-family: Arial, Sans-Serif; color: #EF3124; font size: 1,44 em
• Заголовок 2: font-family: Arial, Sans-Serif; color: #94999C; font size: 1,12 em
• Цвет ссылки: #08628C
• Цвет сылки при наведении курсора: #EF3124
• Цвет посещенной ссылки: #532371
• Заголовок 3: font-family: Arial, Sans-Serif, Bold; color: #EF3124; font size: 0,88 em
• font-family: Arial, Sans-Serif; color: #94999C; font size: 1,04 em
• font-family: Arial, Sans-Serif; color #94999C; font size: 0,68 em
• font-family: Arial, Sans-Serif, Italic; color: #94999C; font size: 0,8 em
• font-family: Arial, Sans-Serif, Italic; color: #000000; font size: 0,8 em; padding-top: 27 px; padding-left: 18 px; leading: 1.23 em;
• Цвет маркеров в ненумерованном списке: #EF3124;
• Цвет цифр в нумерованном списке: #000000
• В таблицах строки и столбцы разграничиваются только интервалами. Никаких иных разделителей не используется. Строка, активная в данный момент, подсвечивается цветом #E8EAEB.
• Сама шапка отделяется от основной части таблицы горизонтальной чертой, ее цвет — #DDDDDD, толщина — 1 пиксель.
• Выделение элементов цветом недопустимо.
• Шапка располагается в левом верхнем углу главной страницы и имеет отступы 20 и 10 пикселей сверху и слева от границ окна браузера соответственно. Высота шапки — 309 пикселей, ширина составляет 80% от ширины окна.
• Шапка представляет собой прямоугольник со скругленным верхним левым углом (радиус — 10 пикселей), окрашенный в «Альфа-красный» цвет.
• Основной блок «Альфа-красного» цвета (#EF3124) и блок белого цвета (#000000) со скругленными углами (радиус — 10 пикселей).
• Обводка кнопки должна быть окрашена в «Альфа-платиновый» цвет (#D1D5D8).
• Обводка окрашивается в «Альфа-красный» цвет (#EF3124).
• Цвет рамки и промо-блока, расположенного в правом столбце на внутренних страницах, меняется в зависимости от того, к какому разделу страница относится.
• Если она находится в разделе, адресованном частным лицам, используется «Альфа-красный» цвет (#EF3124) рамки и промо-блока. В случае, когда страница относится к разделу для юридических лиц, рамка и промо-блок окрашиваются в «Альфа-платиновый» цвет (#D1D5D8).

Typography

• На сайте Альфа-Банка используются шрифты без засечек. В качестве наборного шрифта выступает Arial во всех начертаниях (жирный, курсивный, подчеркнутый) — в зависимости от области применения.
• Кроме того, используются фирменные шрифты — OCRF-LightC и OCRF-RegularC. Подобное ограничение продиктовано неспособностью современных мониторов корректно растрировать антиквенные начертания. Системные шрифты всегда пропорциональны — разные буквы в них имеют разную ширину.
• На сайте используется следующие CSS для текста: font-size: 0,8 em; font-family: Arial, Sans-Serif
• Начертания фирменного шрифта Альфа-Банка, OCRF-LightC и OCRF-RegularC, используются в заголовке и в горизонтальном меню соответственно. Заголовок и горизонтальное меню располагаются в шапке сайта.
• Фирменный шрифт в заголовке и горизонтальном меню должен размещаться только в растрированном виде.
• Использование любых других шрифтов, цветов и начертаний не допускается.
• На сайте используются заголовки трех уровней. Каждый из них имеет свой размер и цвет.
• Заголовок 1 font-family: Arial, Sans-Serif; color: #EF3124; font size: 1,44 em
• Заголовок 2 font-family: Arial, Sans-Serif; color: #94999C; font size: 1,12 em
• Заголовок 3 font-family: Arial, Sans-Serif, Bold; color: #EF3124; font size: 0,88 em
• Текст font-family: Arial, Sans-Serif; color: #000000; font size: 0,8 em
• Текстовые ссылки Цвет ссылки #08628C Цвет ссылки при наведении курсора #EF3124 Цвет посещенной ссылки #532371
• Примечания font-family: Arial, Sans-Serif; color #94999C; font size: 0,68 em
• А также: font-family: Arial, Sans-Serif; color: #94999C; font size: 1,04 em
• font-family: Arial, Sans-Serif, Italic; color: #94999C; font size: 0,8 em
• font-family: Arial, Sans-Serif, Italic; color: #000000; font size: 0,8 em; padding-top: 27 px; padding-left: 18 px; leading: 1.23 em;
• Цвет маркеров в ненумерованном списке: #EF3124;
• Цвет цифр в нумерованном списке: #000000
• В таблицах строки и столбцы разграничиваются только интервалами. Никаких иных разделителей не используется. Строка, активная в данный момент, подсвечивается цветом #E8EAEB.
• Текст в шапке таблицы набирается шрифтом в полужирном начертании. Сама шапка отделяется от основной части таблицы горизонтальной чертой, ее цвет — #DDDDDD, толщина — 1 пиксель.
• В основной части таблицы используется только обычное, некурсивное начертание. Выделение элементов цветом недопустимо.

Logo Usage

• На главной странице логотип окрашен в белый цвет и размещен на фоне «Альфа-красного» цвета (#EF3124). Такое изображение называется негативным.
• На внутренних страницах логотип окрашен в «Альфа-красный» цвет (#EF3124) и размещен на белом фоне (#000000). Такое изображение называется позитивным.
• Недопустимо поворачивать логотип, изменять его пропорции, а также пропорции и расположение элементов логотипа относительно друг друга, использовать цвета, не входящие в корпора-тивную палитру.
• На сайте используется горизонтальный логотип Альфа-Банка. Крайне важно всегда корректно отображать символ и логотип на странице. Символ можно использовать только с подчеркивающей линией. Запрещено его растягивание или изменение пропорций.
• Логотип располагается на всех страницах сайта, занимая фиксированную позицию в левом верхнем углу. Расстояние от левой и верхней границ шапки составляет соответственно 60 и 17 пикселей. Размер логотипа на главной и внутренних страницах — 144×43 пикселя.
• Каждая внутренняя страница содержит логотип, окрашенный в «Альфа-красный» цвет (#EF3124). На внутренних страницах логотип является ссылкой, ведущей на главную страницу. Исключение составляют страницы, которые открываются в новом окне.
• В шапке располагаются: логотип, текстовый блок, фотография сотрудника Альфа-Банка и горизонтальное меню.
• В шапке главной страницы логотип располагается в левом верхнем углу главной страницы и имеет отступы 20 и 10 пикселей сверху и слева от границ окна браузера соответственно.
• Высота шапки — 309 пикселей, ширина составляет 80% от ширины окна.

Visual Style

• Визуальные атрибуты бренда «Альфа-Банк» зафиксированы в брендбуке, учитываются веб-стандартами и являются базовыми элементами, определяющими внешний вид создаваемых информационных продуктов.
• Настоящий раздел содержит описание компонентов, определяющих внешний вид сайта Альфа-Банка. В нем регламентируется используемая цветовая палитра, задаются принципы подготовки иллюстраций, описывается организация элементов на страницах.
• Модульная сетка сайта Альфа-Банка состоит из четырех колонок. Ниже отображен принцип построения основных блоков и деления колонок модульной сетки. Каждая из колонок занимает 25% от ширины окна браузера при любом разрешении.
• Модульная сетка применительно к главной странице
• Модульная сетка применительно к внутренней странице
• Все цвета, используемые на сайте, описаны в шестнадцатеричной кодировке HEX. Для удобства они условно разделяются на основные и дополнительные.
• Основные цвета применяются в фирменной символике, для оформления текста и заголовков, ссылок и графических маркеров, информационных плашек. Всего основных цветов четыре: белый (#000000), черный (#FFFFFF), «Альфа-красный» (#EF3124), «Альфа-платиновый» (#D1D5D8).
• Дополнительные цвета необходимы для выделения вспомогательной информации на сайте. Всего используется 8 дополнительных цветов.
• На главной странице логотип окрашен в белый цвет и размещен на фоне «Альфа-красного» цвета (#EF3124). Такое изображение называется негативным.
• На внутренних страницах логотип окрашен в «Альфа-красный» цвет (#EF3124) и размещен на белом фоне (#000000). Такое изображение называется позитивным.
• Недопустимо поворачивать логотип, изменять его пропорции, а также пропорции и расположение элементов логотипа относительно друг друга, использовать цвета, не входящие в корпора-тивную палитру.
• На сайте Альфа-Банка используются шрифты без засечек. В качестве наборного шрифта выступает Arial во всех начертаниях (жирный, курсивный, подчеркнутый) — в зависимости от области применения.
• Кроме того, используются фирменные шрифты — OCRF-LightC и OCRF-RegularC. Подобное ограничение продиктовано неспособностью современных мониторов корректно растрировать антиквенные начертания. Системные шрифты всегда пропорциональны — разные буквы в них имеют разную ширину.
• На сайте используется следующие CSS для текста: font-size: 0,8 em; font-family: Arial, Sans-Serif
• Фирменные шрифты Альфа-Банка, OCRF-LightC и OCRF-RegularC, используются в заголовке и в горизонтальном меню соответственно. Заголовок и горизонтальное меню располагаются в шапке сайта.
• Фирменный шрифт в заголовке и горизонтальном меню должен размещаться только в растрированном виде.
• Использование любых других шрифтов, цветов и начертаний не допускается.
• В таблицах строки и столбцы разграничиваются только интервалами. Никаких иных разделителей не используется. Строка, активная в данный момент, подсвечивается цветом #E8EAEB.
• Текст в шапке таблицы набирается шрифтом в полужирном начертании. Сама шапка отделяется от основной части таблицы горизонтальной чертой, ее цвет — #DDDDDD, толщина — 1 пиксель.
• В основной части таблицы используется только обычное, некурсивное начертание. Выделение элементов цветом недопустимо.

Layout And Composition

• Модульная сетка сайта Альфа-Банка состоит из четырех колонок. Ниже отображен принцип построения основных блоков и деления колонок модульной сетки. Каждая из колонок занимает 25% от ширины окна браузера при любом разрешении.
• Модульная сетка применительно к главной странице
• Модульная сетка применительно к внутренней странице
• 25%
• 75%

Web Standards

• Корпоративные веб-стандарты русскоязычного интернет-представительства ОАО «АЛЬФА-БАНК»
• Веб-стандарты Альфа-Банка представляют собой требования к дизайну русскоязычного сайта, реализуемого под брендом «Альфа-Банк». Соблюдение стандартов позволяет обеспечить высокий уровень качества русскоязычного интернет-представительства банка.
• В документе содержатся обязательные требования, которые должны соблюдаться строго, и рекомендации, выполнение которых является желательным, но не обязательным. Предполагается, что веб-стандарты будут использоваться разработчиками, которые обладают опытом и квалификацией, достаточными для правильного понимания и применения изложенных принципов.
• Несоблюдение веб-стандартов способно повлечь за собой снижение качества разрабатываемых информационных продуктов и нарушение единой стилистики. Это приводит к потере ассоциативной связи между ресурсами и, как следствие, снижению посещаемости сайта.

Navigation

• В информационных технологиях термин «навигация» обозначает управление движением пользователя по логически связанным данным. На сайте Альфа-Банка используются пять видов навигации: основная, дублирующая, служебная, а также поиск и карта сайта.
• Основная навигация включает в себя два навигационных блока: главный и второстепенный. Каждый из них состоит из независимых друг от друга элементов (любой пункт меню, в независимости от уровня, на котором он находится, оформляется в виде отдельного блока).
• Главный навигационный блок представляет собой горизонтальное меню, расположенное в нижней части красной шапки сайта. Он содержит ссылки на разделы для частных лиц, корпоративных клиентов, инвесторов, представителей малого и среднего бизнеса, а также финансовых организаций. Подробнее о горизонтальном меню см. на стр. 17.
• Второстепенный навигационный блок — вертикальное меню, которое располагается в правой колонке сайта. Этот блок содержит ссылки, касающиеся внутренней и публичной жизни банка, и событий, связанных с ним. Полную информацию о второстепенном блоке см. на стр. 27.
• Навигация второго уровня располагается только на внутренних страницах сайта непосредственно между заголовком и блоком контента.
• Дублирующая навигация используется на внутренних страницах сайта. Она выполнена в виде «градусника» с выпадающим меню. Благодаря дублирующей навигации пользователь лучше ориентируется на сайте и может быстро перейти в другой раздел.

Additional Properties

Net Profit History

Employees History

Total Assets History

Total Equity History