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

Приведем простой пример задачи. Вам нужно сделать фотографию на документы. Можно пойти двумя путями - сходить в фотоателье и сфотографироваться там, отдав за 4 маленьких фотографии, напечатанных на листе 10*15 см рублей 150. Второй вариант - сфотографироваться дома, подготовить к печати лист А4, на который втиснуть столько своих фотографий разных размеров, что хватит на несколько лет вперед. Потом идете в фотоателье и печатаете свое творение на листе А4 рублей за 30. Вроде бы с одного заказа выгода смехотворная, но если нужно распечатать фотографии сразу для нескольких человек (например, когда вся семья фотографируется на визу перед путешествием в другую странц), то можно сэкономить более существенную сумму. И это лишь один из примеров. Другой вопрос - как соблюсти размеры фотографий, чтобы на отпечатке они были ровно 4*5 см (или каким-то другим размером). Для того, чтобы подогнать размер отпечатка к требуемому, нужно разобраться в связи сантиметров , пикселей и точек на дюйм .

Пиксели

Пиксель - это одна точка, из которых состоит изображение. Также пикселем называется ячейка изображения на мониторе или жк-телевизоре. Рассмотрите монитор вблизи и вы увидите едва заметную сеточку, одна ячейка этой сетки - и есть пиксель. Фотография, которую вы скачали с фотоаппарата имеет разрешение несколько мегапикселей, то есть, например, 6000 пикселей в ширину и 4000 пикселей в высоту - это 6.000 * 4.000 = 24.000.000 пикселей или 24 мегапикселя. При просмотре на мониторе картинка автоматически масштабируется до разрешения монитора (около 2 мегапикселей). Если мы пытаемся увеличить масштаб (растягиваем фотографию), то до какой-то степени картинка растягивается без видимой потери качества, но потом на ней появляются характерные квадратики. Это происходит, когда реальное разрешение фотографии меньше того, что мы хотим видеть - размер пикселя на фотографии стал больше размера пикселя на мониторе.

Сантиметры

Что такое "сантиметр", я думаю, объяснять не нужно. В нашем случае в сантиметрах измеряется размер отпечатков фотографии. Обычно фотографии печатаются размером 10*15 см, но иногда используются более крупные форматы - 20*30 см (примерно соответствует формату А4), 30*45 см (А3) и больше. Вероятно, вы сталкивались с проблемой - вы нашли на каком-то сайте красивую фотографию и решили ее распечатать ее крупным форматом (например, 20*30 см), но распечатав, заметили, что качество отпечатка не слишком хорошее - конткры объектов получились немного размытыми. Что самое печальное - никакой обработкой эту фотографию не исправить. И все потому, что разрешение фотографии на сайте составляет, к примеру, 900*600 пикселей. То есть, на 1 пиксель на отпечатке будет иметь размер примерно 0.33 миллиметра - при этом сложно рассчитывать на "звенящую" резкость! И здесь появляется еще один параметр качества изображения, при помощи которого можно оценить качество отпечатка - DPI

DPI

DPI сокращение английской фразы Dots per Inch, что на русский переводится как точки на дюйм. Эта величина как раз показывает, сколько пикселей изображения приходится на один "погонный" дюйм при печати (дюйм равен 2.54 см). Еще есть величина DPC (точек на сантиметр), но она используется реже - как ни крути, все эти технологии печати пришли к нам оттуда, где в ходу дюймы, футы, фунты и т.д. Итак, вернемся к нашему примеру - картинке 900*600 пикселей, которую мы решили напечатать форматом 30*20 см. Переведем для удобства сантиметры в дюймы - получаем 11.8 * 8.9". Если поделить 900 пикселей на 11.8", то получаем разрешение печати 76 DPI . Это примерно соответствует разрешающей способности монитора с его "крупными" пикселями, поэтому картинка на экране смотрится хорошо. Но чтобы получить отпечаток приемлемого качества, нужно разрешение печати как минимум 150 DPI, а если хотим совсем хорошую детализацию, не менее 300 DPI. Чтобы обеспечить такое разрешение при печати 30*20 сантиметров, оригинальное цифровое изображение должно иметь разрешение 3540 * 2670 пикселей - это около 9 мегапикселей. Вот и нашли причину, почему фотографии, распечатанные "из интернета" выглядят нерезко и мутно. Теперь вернемся к нашему вопросу - как подогнать разрешение картинки, чтобы оно печаталось заданным размером? В качестве примера рассмотрим подготовку фотографий для документов.

Создание собственного фото на документы - пошаговая инструкция

Предположим, вам нужно сделать несколько фотографий размером 4*6 см и разместить их на листе 20*30 см. Как это сделать?

1. Берем исходное изображение, открываем его в Photoshop. Выбираем пункт меню "изображение" - "размер изображения". Перед нами открывается такое диалоговое окно:

В открывшемся диалоге мы видим две группы настроек - "размерность" и "размер печатного оттиска". В группе "размерность" отображаются размеры цифрового изображения в пикселях. Эти настройки не трогаем! В группе "размер печатного оттиска" устанавливаем нужный нам размер в сантиметрах (единицы измерения выбираются из выпадающих списков). В нашем случае это 4*6 см. Также задаем разрешение при печати - 300 пикселей на дюйм, этим мы обеспечим хорошее качество печати.

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

1. Ctrl + A (англ) - выделить все
2. Ctrl + C (англ) - скопировать в буфер обмена

То, что скопировано в буфер обмена мы будем переносить на отдельный холст, см п.2. 2. Теперь нам надо создать новое изображение, которое будет соответствовать листу 20*30 см, который мы пойдем распечатывать в фотолабораторию. Выбираем меню "Файл", "Создать", появляется диалоговое окно:

Указываем размер фотобумаги, на которой будет выполняться печать (20 на 30 см) и выставляем разрешение в пикселях на дюйм такое же, какое имеет наша фотография - 300 DPI. Нажимаем ОК.

3. Появилось пустое изображение с прозрачным фоном. Нажимаем комбинацию клавиш Ctrl + V и вставляем наше первое изображение на новый холст. Это будет выглядеть примерно так:

Изображение вставлено как новый слой. Передвигаем его в верхний левый угол, затем выбираем меню "Слой", "Создать дубликат слоя".

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

Сохраняем картинку в формате JPEG, копируем на флешку и идем в фотолабораторию. Оператору говорим следующее - "напечатайте это изображение форматом 20*30 см с разрешением 300 DPI без масштабирования ". При этом маленькие картинки будут иметь точно такой размер, какой мы для них указали - в нашем случае 4*6 сантиметров. При себе желательно иметь линейку, чтобы проверить размеры отпечатков.

Предлагаю рассмотреть, что это за звери - форматы фотографий JPG и RAW, на что они влияют и когда на них стоит обращать внимание. Что такое размер фото и вес файла, как они измерятся и от чего зависят.

Почти все фото камеры могут сохранять фотографии в формате JPG (даже камеры телефонов и планшетов). Во всех зеркальных и без зеркальных камерах, а так же в продвинутых компактах в дополнение к JPG есть, как минимум, RAW и RAW+, и иногда TIFF.

Чтобы разобраться с форматами, для начала нужно договориться, что подразумевается под понятиями "размер" фотографии и "вес" файла (фотографии). Предлагаю рассмотреть эти понятия на более осязаемых объектах... например, на вкусностях.

1 | Что такое пиксель:

Если измерить размер этой вазочки с ягодами, то это буде где-то 10 сантиметров в высоту и этак сантиметров 13 в ширину... примерно. То есть мы привыкли измерять предметы сантиметрами (метрами, километрами и так далее). Если же говорить о фото этой же вазочки, то изначальный размер фотографии - 7360 пикселей (px) в ширину на 4912 пикселей (px) в высоту. Это максимальный размер фото, на который способна моя камера Nikon. Для размещения этого фото на сайте, размер фото уменьшен до 1200px на 798px (зачем, расскажу чуть позже).

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

2 | Можно ли пиксели перевести в сантиметры:

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

Чтобы вы не ломали голову над делением размера фото на разрешение и не переводили дюймы в сантиметры, в любой программе для просмотра и редактирования фото (например, в Photoshop) есть функция просмотра размера изображения фото в сантиметрах. Она вам понадобится, чтобы понять, какого максимального размера фотографию в хорошем качестве (с разрешением 300 dpi), вы сможете напечатать на бумаге или другом материальном носителе.

Например, это фото с тропическими цветами Франжиспани, можно напечатать размером 61 см на 32 см.

Чтобы узнать размер фото в пикселях и сантиметрах в программе Photoshop, нужно нажать комбинацию клавиш Alt+Ctrl+I или зайти в меню Image (Изображение) Image size (Размер изображения).

Вернёмся к реальности цифровых фото - к пикселям и размерам фото в пикселях. Что произойдёт, если уменьшить количество пикселей в фото? Ответ - ухудшиться качество фотографии. Например, я взяла фото этой же вазочки с ягодами, что в начале статьи, и уменьшила размер фото до 150 пикселей в ширину. При таком уменьшении программа уничтожает часть пикселей. Фотография стала миниатюрной:

Теперь попробуем "растянуть" фото на всю страницу:

Как видите, детализация уже не та, так как часть пикселей (а вместе с ними и деталей) отсутствует.

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

3 | Какой размер фотографии (сколько пикселей) оптимален:

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

В некоторых случая нужно уменьшать размер фотографий. Как я писала выше, для сайта я уменьшаю размер фото до 1200 пикселей по длинной стороне. Если загрузить фото в полном размере, страницы сайта будут очень долго загружаться, а это многим посетителям может не понравится (не говоря уже о поисковиках Гугл и Яндекс).

Размер фотографий измеряется в пикселях (px). От количества пикселей зависит размер фото на экранах мониторов, и какого размера можно напечатать фотографию.

4 | Размер файла или "вес фотографии":

Теперь разберёмся с "весом фотографии". Так уж исторически сложилось, что в этом вопросе много путаницы и размер файла довольно часто называют "весом фотографии", что скорее удобно, чем правильно. Размер файлов измеряется мегабайтами (МВ) или килобайтами (КВ). И тут стоит помнить, что в отличии от килограммов, где 1 кг = 1000гр, 1 мегабайт = 1024 килобайт.

Как это выглядит на практике: представим ситуацию, что в вашем фотоаппарате есть карта памяти на которой написано 64GB (гигабайта) . Если посмотреть, сколько же там именно этим байтов (на компьютере правой кнопкой мыши выбрать "свойства"), то окажется, что на этой карте памяти 63567953920 байт и это равно 59,2 GB. От того, насколько большие файлы создаёт ваша камера, зависит, как много фото поместится на этой карте памяти. Например, у меня помещается 830 файлов с фото в формате RAW (о форматах читайте ниже).

От чего завит размер файла:

• Во-первых, от размера фото (того, что пикселями измеряется): файл с первой фотографией ягодок (размер фото 7360x4912 px) - это 5.2 MB, а она же, уменьшенная до 150 рх будет "весить" 75,7 КВ (в 69 раза меньше).
• Во-вторых, от формата (JPG, TIFF, RAW), о чём читайте ниже.
• В-третьих, размер файла (или "вес фото") зависит от количества деталей: чем их больше, тем "тяжелее" фотография (что наиболее релевантно для JPG формата).

Например, вот в этой фотографии с обезьянами со Шри-Ланки множество мелких чётких (говоря языком фотографов, "резких") деталей и размер файла с этой фотографией - 19.7MB, что существенно больше чем ягодки в вазочке на белом фоне (5.2MB).

Если вы спросите, какого размера фото я могу напечатать с фотографии, которая весит 2МБ. Никто вам не сможет ответить, пока не узнает количество пикселей. А лучше, конечно, ещё и взглянуть на фото, так как некоторые умельцы любят доставать фото из глубин интернета, увеличивать количество пикселей программно, а потом хотеть напечатать её на обложке журнала. Получается как на примере выше с растянутой фотографией вазочки шириной 150 px.

Размер файла (часто называют "вес фотографий) измеряется в мегабайтах (МВ) или килобайтах (КВ) и зависит от формата, размера в пикселях и детализайии фотографии.

5 | Форматы фото:

И, наконец-то, мы подошли к вопросу форматов изображения и типа сжатия файлов, от которых тоже зависит размер файла с фото.

Практически все фото камеры могут сохранять фотографии в формате JPG (даже камеры телефонов и планшетов). Это самый распространённый формат изображений и его "понимают" все компьютеры и программы для просмотра изображений. В формате JPG фото можно загружать в соц сети, выкладывать в блоге, добавлять в файлы Word, Power Point и так далее. JPG можно обрабатывать в Фотошопе, Лайтруме и других программах для редактирования изображений.

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

Что стоит помнить о формате jpg - это сжатый формат и у него есть степени сжатия. Чем выше степень сжатия, тем меньше размер файла за счёт уменьшения детализации и качества фото. Поэтому не рекомендуется многократное редактирование и пересохранение (повторное сжатие) одной и той же фотографий в формате jpg.

Во всех зеркальных и без зеркальных камерах, а так же в продвинутых компактах в дополнение к JPG есть как минимум RAW, и часто ещё и TIFF.

Немного теории:

• TIFF (англ. Tagged Image File Format) — формат хранения растровых графических изображений (в том числе фотографий). TIFF стал популярным форматом для хранения изображений с большой глубиной цвета. Он используется в полиграфии, широко поддерживается графическими приложениями.
• RAW (англ. raw — cырой, необработанный) — формат цифровой фотографии, содержащий необработанные данные, полученные с фотоматрицы (та штука, что в цифровых камерах заменила плёнку).

Лично я никогда не фотографирую в формат TIFF. Не могу даже придумать, зачем мне это нужно, если есть RAW. TIFF без сжатия я могу использовать для сохранения фото, которые ещё планирую доработать в программе Photoshop.

6 | Преимущества и недостатки формата RAW:

У меня в камере почти всегда стоит RAW формат, так как я собираюсь обрабатывать (редактировать) фото в Лайтруме или Фотошопе. У RAW есть ряд существенных недостатков:

• Нет возможности просмотра файлов без предварительной конвертации. То есть для просмотра фото в формате RAW вам нужна специальная программа, поддерживающая этот формат изображений.
• Больший объём файлов, чем при сохранении в JPEG (с моё камеры Nikon D800 размер файла с фото в формате RAW - это 74-77 МБ). Это означает, что меньше фотографий поместится на флешке.
• RAW невозможно загрузить в соц сети, блог, и иногда даже отправить по почте. Вначале RAW нужно конвертировать в RAW конвертере (например, Adobe Camera Raw), который поддерживает тип файла с вашей модели камеры.

Почему же профессиональные фотографы часто предпочитаю RAW, а не JPG? Потому что RAW.

Вы знаете все о размещении картинок в социальных сетях и как никто умеете заинтересовать подписчиков классным визуальным контентом? А в курсе ли вы, какие размеры и пропорции должны быть у изображения, чтобы оно идеально вписалось в вашу ленту новостей?

Если вы ответили «нет», то наш пост для вас!

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

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

Идеальный размер изображений для социальных медиа

Размер изображений — довольно объемная тема, но постараемся не вдаваться в излишние подробности и перечислим только самое главное.

Как вы уже могли догадаться, для фотографии профиля, обложки страницы, рекламы на Facebook или записей в Twitter нужны изображения разных форматов.

Большинство ведущих социальных медиа, например, Вконтакте, Facebook или Twitter, позволяют управлять отображением картинки профиля и обложки страницы — вы можете менять размер и двигать фотографию до тех пор, пока она не встанет, как вам надо.

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

Но как сделать так, чтобы изображение в хронике или новостной ленте выглядело максимально эффектно?

С целью изучения влияния изображений на степень вовлеченности аудитории — количество ретвитов, кликов и так далее, сервисом Buffer было обнаружено, что твиты с картинками получают на 150% больше ретвитов, чем обычные текстовые посты.

Экспериментируя с размерами картинок, которые гарантированно хорошо будут работать в социальных медиа, были найдены два универсальных размера изображений: 1024 x 512 пикселей для альбомной (горизонтальной) ориентации и 800 x 1200 пикселей — для портретных (вертикальных) фотографий.

Квадратные картинки с разрешением 1200 x 1200 пискселей лучше всего подходят для новостной ленты в Facebook и LinkedIn, альбомные с разрешением 1200 x 627 пикселей также отлично впишутся в посты Facebook или Twitter, а портретные изображения с разрешением 736 x 1128 пикселей можно удачно использовать в Pinterest и Google+.

Рассмотрим подробнее, почему это так.

Оптимальные размеры изображений для Facebook

От ориентации изображения зависит его итоговый размер в Facebook.

Если вы прикрепляете к посту квадратную картинку, ее ширина в Facebook составит 470 пикселей — максимально возможный размер изображения в новостной ленте. Даже если его изначальная длина и ширина — 800 x 800 пикселей, оно все равно отобразится на фейсбуке с разрешением 470 x 470 пикселей:

Если вы загрузите изображение альбомного формата, фейсбук сожмет его до 470 пикселей по ширине, а высота изменится пропорционально:

Картинки с шириной меньше 470 пикселей показываются в фактическом размере — выровненные по левому краю с белым полем справа.

Если вы загрузите изображение портретного формата, Facebook уменьшит его до 394 пикселей по высоте и выровняет картинку по левому краю — справа также останется белое поле, а ширина изменится пропорционально высоте.

Например, если вы загрузите картинку 500 на 700 пикселей, фейсбук изменит ее размеры до 281 х 394 пикселей:

Таким образом, изображение, прикрепленное к посту на фейсбук, может отобразиться несколькими способами: все зависит от размеров картинки (ширины и высоты в пикселях) и ее ориентации.

А что насчет ссылок?

Изображения предварительного просмотра при «расшаривании» ссылок подгоняются до 470 х 246 пикселей:

Тэг «og:image» можно либо вставить вручную в раздел на каждой странице лендинга, либо воспользоваться плагином вроде Yoast SEO для WordPress, который автоматически обрабатывает код и вставляет его в нужное место.

Когда вы создаете картинку для вставки в тэг «og:image», помните — большое изображение будет автоматически обрезано сверху и снизу и уменьшено до 470 x 246 пикселей:

Если тэг «og:image» страницы, ссылкой на которую вы делитесь, прописан не совсем корректно или картинка по ссылке в тэге слишком маленькая, фейсбук не отобразит ее в полную ширину: миниатюра изображения будет помещена в маленькую рамочку слева от текста.

Миниатюры таких картинок — квадратных, альбомной или портретной ориентации — будут сжаты и обрезаны до квадрата 158 x 158 пикселей:

В отдельных случаях длинные изображения (вроде инфографики) сжимаются до 158 пикселей по ширине и 237 пикселей по высоте:

Самый подходящий размер картинок для постов и «расшаривания» ссылок в Facebook — это 1024 х 512 пикселей. Такие изображения не совсем соответствуют описанным выше параметрам, но они хорошо выглядят на Retina-дисплеях (с высокой плотностью пикселей) и неплохо вписываются в полноразмерные области в ленте новостей.

(И как вы увидите ниже, этот формат изображений также идеально подходит для постов в Twitter).

Оптимальные размеры изображений для Twitter

На десктопных экранах картинки в ленте твиттера отображаются с размерами 506 пикселей по ширине и 253 пикселя по высоте, что соответствует пропорциям 2:1 (это значит, что каждым двум пикселям ширины соответствует 1 пиксель высоты).

Если вы прикрепляете к твиту изображение с размерами 800 х 400 или 1000 х 500 пикселей — или любого другого размера, соответствующего параметрам 2:1 — то ваше изображение отобразится в хронике полностью.

Вот пример изображения с расширением 1024 x 512 пикселей (соотношение 2 к 1), подогнанного до размера 506 x 253 пикселей в хронике твиттера.

(Обратите внимание: если вы загрузите изображение, которое по размеру меньше 506 пикселей по ширине, то справа останется белое поле).

Если разрешение картинки выходит за рамки соотношения 2 к 1, Twitter автоматически обрежет лишнее — полный вариант картинки можно будет увидеть только при клике на нее.

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

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

Размеры изображений для Twitter Cards

Twitter Cards — инструмент для создания расширенных постов в Twitter. Изображения используются во всех девяти типах Twitter Cards, мы же разберем подробнее два вида, которые лучше всего подходят для распространения контента в соцсетях: Summary card (стандартная карточка) и Summary card with large image (карточка с акцентом на изображении).

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

(Очень часто плагины для автоматической вставки кода для Facebook на сайт также поддерживают и Twitter Cards).

Любой тип карточек содержит соответствующие изображения-миниатюры:

1. Изображения для обычных карточек (Summary Cards) должны быть с разрешением не менее 120х120 пискелей и весить меньше 1MB. Для расширенного твита и его страницы-описания картинка будет обрезана до соотношения 4:3 и уменьшена до 109x82 пикселей. Для использования во встроенных твитах изображение также будет обрезано и уменьшено до разрешения 120 на 120 пикселей.

2. Изображения для карточек с акцентом на изображении (Summary Cards with large images) должны быть как минимум 280 пикселей по ширине 150 пикселей по высоте, сама же картинка также обязана весить меньше 1MB.

Все изображения для карточек с большими картинками по ширине составляют 506 пикселей. Это касается изображений как альбомной, так и портретной ориентации: ширина в любом случае составит 506 пикселей, а высота — сколько получится (минимума или максимума здесь нет). Квадратные картинки отображаются с разрешением 506 х 506 пикселей, соответственно.

Любое изображение меньше 506 пикселей по ширине будет выравнено по левому краю, справа останется белое поле:

Интересно отметить, как Twitter Cards кадрирует картинки. Для основных видов карточек изображения обрезаются следующим образом:

• квадратные и портретные фотографии обрезаются только снизу (и никогда — по сторонам);
• картинки альбомной ориентации, наоборот, обрезаются с боков (и никогда не кадрируются ни сверху, ни снизу);
• для карточек с большими изображениями никакой заметной обрезки не происходит.

Если вам интересно, как ваши картинки будут выглядеть в Twitter Cards, вставьте ссылку в бесплатный валидатор карточек твиттера (Twitter’s free card validator) — откроется окно предпросмотра.

Идеальные размеры изображений для постов в LinkedIn

Если вы загружаете картинку напрямую, ее максимальная ширина в ленте составит 350 пикселей, по высоте же изображение будет изменено пропорционально ширине, несмотря на ориентацию картинки. К примеру, изображение с расширением 700 х 500 пикселей будет уменьшено до 350 на 250 пикселей:

Исключением из этого правила является LinkedIn Showcase Pages — инструмент, позволяющий компаниям создавать страницы для ответвлений бренда (например, Adobe создал отдельные страницы для Adobe Creative Cloud, Adobe Marketing Cloud и т. д.)

На таких страницах миниатюры и специальные изображения для ссылок отображаются либо в стандартном размере 180 х 110, либо в чуть большем — 442 х 248 пискселей:

LinkedIn использует ту же разметку Open Graph, что и Facebook или другие соцсети. Если вы правильно оптимизируете свой лендинг для фейсбука, то и в LinkedIn ссылки на него тоже будут выглядеть хорошо.

Дополнительный способ делиться контентом в LinkedIn — публиковать статьи через LinkedIn Pulse: сервис создал серьезную платформу для публикации контента, которая позволяет добавлять картинки-миниатюры к статьям. Понравившийся контент появляется на страницах пользователей и в ленте LinkedIn Pulse.

В ленте домашней страницы изображение при обновлении Pulse отображается с размером 180 х 110 пикселей — как и для всех картинок в ссылках. Если же ссылка появляется в списке рекомендованных, размеры миниатюры составят 70 х 37 пикселей:

На странице Pulse список публикаций находится в левой колонке. Миниатюры изображений здесь квадратные — со стороной 70 пикселей. Миниатюра в верхней части статьи отображается с шириной 698 пикселей и высотой 400 пикселей.

(Обрезка таких изображений происходит с боков, поэтому на итоговой картинке будет отображаться центр изображения).

Идеальные изображения для постов в Google+

Как и другие социальные сервисы, упомянутые выше, Google+ выбирает картинки при помощи разметки Open Graph. Если же изображение, прописанное в мета-тэгах, меньше 426 пикселей по ширине или ссылка на него не существует, Google+ может вставить квадратную миниатюру со стороной 150 пикселей слева от новости.

Если вы загружаете картинку напрямую в Google+, она тоже отобразится с шириной не больше 426 пикселей. При клике на URL новости изображение откроется с расширением не более 506 пикселей по ширине:

Если ваша картинка меньше 346 пикселей по ширине, Google+ размещает ее по центру, оставляя белые поля по бокам.

Google+ также может показывать фотографии шириной в две колонки новостного потока — такие изображения загружаются с шириной 886 пикселей, а высота меняется автоматически:

Идеальный размер изображений для Pinterest

Pinterest включает несколько специальных мест, где появляются опубликованные изображения, или «пины» (от англ. a pin — булавка).

На «доске» Pinterest ширина каждого изображения — 235 рх, высота изменяется пропорционально:

При клике на изображение оно увеличивается до 736 пикселей по ширине, а высота подгоняется соответственно:

Кроме этих двух мест, пины можно обнаружить на обложках «досок» пользователей и в рекламных блоках сбоку, где отображаются рекомендованные и похожие пины.

По официальному заявлению Pinterest, лучшее соотношение сторон для изображений в этой сети — что-то среднее между 2:3 и 1:3,5, причем по ширине картинка должна быть не меньше 600рх.

Если вы не знаете, что такое соотношение сторон — это то, как ширина и высота картинки соотносятся друг с другом. Например, у картинки с соотношением сторон 2 к 3 может быть, к примеру, следующее расширение: 600 пикселей по ширине на 900 пикселей по высоте, 800 пикселей по ширине на 1200 пикселей по высоте и так далее.

У изображения с соотношением сторон 1 к 3,5 разрешение может быть таким: 600 пикселей по ширине на 2100 пикселей по высоте, 800 пикселей по ширине на 2800 пикселей по высоте и т. д.

Пины с соотношением сторон более, чем 1:3,5, обрезаются снизу и отображаются в новостной ленте с возможностью полного просмотра при нажатии на кнопку «Развернуть пин» в нижней части картинки:

Идеальные размеры изображений для Instagram

До недавнего времени все фотографии в инстаграме были квадратными с разрешением 1080 х 1080 пикселей. Но с августа 2015 года алгоритм сервиса обновился: теперь помимо квадратных, пользователи могут загружать также портретные и альбомные изображения.

Ширина всех фотографий в ленте новостей Instagram составляет 600 пикселей, а на мобильных устройствах изображения открываются по ширине экрана. Квадратные картинки показываются в ленте с разрешением 600х600 пикселей:

При загрузке фотографии в Instagram теперь можно выбрать ее ориентацию: по умолчанию по-прежнему установлен квадратный формат, но при нажатии на кнопку со стрелками в левом нижнем углу изображения или при «растягивании» картинки пальцами, она отобразится в почти нужном вам виде.

«Почти» — потому что если изображение выходит за рамки установленных Instagram пропорций, оно будет обрезано. Диапазон подходящих для инстаграма соотношений сторон достаточно велик: от 1,91:1 до 4:5.

В профилях пользователей и в области поиска картинки все так же показываются в виде сетки квадратов, но ширина стороны увеличилась с 161 до 291 пикселей. Для отображения прямоугольных фоток берется середина изображения: обрезка происходит с боков, если картинка альбомной ориентации, и сверху и снизу — если портретной:

Идеальные размеры изображений для Вконтакте и «Одноклассников»

Лучший размер изображения для баннера Вконтакте — 700 на 500 пикселей, а максимальный размер — 1000 х 700 пикселей. Картинки других размеров загрузятся с потерей качества, но с сохранением пропорций:

С июля 2015 в ОК можно загружать изображения с расширением до 1680 х 1680 без потери качества:

Лучший размер для публикаций в Одноклассниках теперь — 1680 x 1260 пикселей. В ленте такие картинки отображаются с максимально возможным разрешением — 548 x 411, а при клике на изображение оно открывается в разрешении 780 х 585 пискселей:

Таким образом, максимальная высота картинки портретного формата в ленте составляет 411 пикселей, а ширина подгоняется соответственно. Максимальная ширина картинки альбомного формата — 548 пикселей, а высота изменяется пропорционально.

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

Конвертер длины и расстояния Конвертер массы Конвертер мер объема сыпучих продуктов и продуктов питания Конвертер площади Конвертер объема и единиц измерения в кулинарных рецептах Конвертер температуры Конвертер давления, механического напряжения, модуля Юнга Конвертер энергии и работы Конвертер мощности Конвертер силы Конвертер времени Конвертер линейной скорости Плоский угол Конвертер тепловой эффективности и топливной экономичности Конвертер чисел в различных системах счисления Конвертер единиц измерения количества информации Курсы валют Размеры женской одежды и обуви Размеры мужской одежды и обуви Конвертер угловой скорости и частоты вращения Конвертер ускорения Конвертер углового ускорения Конвертер плотности Конвертер удельного объема Конвертер момента инерции Конвертер момента силы Конвертер вращающего момента Конвертер удельной теплоты сгорания (по массе) Конвертер плотности энергии и удельной теплоты сгорания топлива (по объему) Конвертер разности температур Конвертер коэффициента теплового расширения Конвертер термического сопротивления Конвертер удельной теплопроводности Конвертер удельной теплоёмкости Конвертер энергетической экспозиции и мощности теплового излучения Конвертер плотности теплового потока Конвертер коэффициента теплоотдачи Конвертер объёмного расхода Конвертер массового расхода Конвертер молярного расхода Конвертер плотности потока массы Конвертер молярной концентрации Конвертер массовой концентрации в растворе Конвертер динамической (абсолютной) вязкости Конвертер кинематической вязкости Конвертер поверхностного натяжения Конвертер паропроницаемости Конвертер паропроницаемости и скорости переноса пара Конвертер уровня звука Конвертер чувствительности микрофонов Конвертер уровня звукового давления (SPL) Конвертер уровня звукового давления с возможностью выбора опорного давления Конвертер яркости Конвертер силы света Конвертер освещённости Конвертер разрешения в компьютерной графике Конвертер частоты и длины волны Оптическая сила в диоптриях и фокусное расстояние Оптическая сила в диоптриях и увеличение линзы (×) Конвертер электрического заряда Конвертер линейной плотности заряда Конвертер поверхностной плотности заряда Конвертер объемной плотности заряда Конвертер электрического тока Конвертер линейной плотности тока Конвертер поверхностной плотности тока Конвертер напряжённости электрического поля Конвертер электростатического потенциала и напряжения Конвертер электрического сопротивления Конвертер удельного электрического сопротивления Конвертер электрической проводимости Конвертер удельной электрической проводимости Электрическая емкость Конвертер индуктивности Конвертер Американского калибра проводов Уровни в dBm (дБм или дБмВт), dBV (дБВ), ваттах и др. единицах Конвертер магнитодвижущей силы Конвертер напряженности магнитного поля Конвертер магнитного потока Конвертер магнитной индукции Радиация. Конвертер мощности поглощенной дозы ионизирующего излучения Радиоактивность. Конвертер радиоактивного распада Радиация. Конвертер экспозиционной дозы Радиация. Конвертер поглощённой дозы Конвертер десятичных приставок Передача данных Конвертер единиц типографики и обработки изображений Конвертер единиц измерения объема лесоматериалов Вычисление молярной массы Периодическая система химических элементов Д. И. Менделеева

1 сантиметр [см] = 37,7952755905511 пиксель (X)

Исходная величина

Преобразованная величина

твип метр сантиметр миллиметр символ (X) символ (Y) пиксель (X) пиксель (Y) дюйм пайка (компьютер) пайка (типографская) пункт НИС/PostScript пункт (компьютерный) пункт (типографский) среднее тире цицеро длинное тире пункт Дидо

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

Общие сведения

Типографика изучает воспроизведение текста на странице и использование его размера, гарнитуры, цвета и других внешних признаков для того, чтобы текст лучше читался и красиво выглядел. Типографика появилась в середине 15-го века, с появлением печатных станков. Расположение текста на странице влияет на наше восприятие - чем лучше его расположить, тем больше вероятность, что читатель поймет и запомнит то, что написано в тексте. Некачественная типографика, наоборот, делает текст плохо читаемым.

Гарнитуры подразделяют на разные виды, например на шрифты с засечками и без. Засечки - декоративный элемент шрифта, но в некоторых случаях они облегчают чтение текста, хотя иногда происходит и наоборот. Первая буква (голубого цвета) на изображении набрана шрифтом с засечками Бодони. Одна из четырех засечек обведена красным цветом. Вторая буква (желтая) - набрана шрифтом Футура без засечек.

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

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

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

Определение единиц

Размер букв в типографике обозначается словом «кегль». Существует несколько систем измерения кегля, но большинство из них основано на единице «пайка» в американской и английской системе измерения (англ. pica), или «цицеро» в европейской системе измерения. Название «пайка» иногда пишут как «пика». Существуют несколько видов пайки, которые слегка отличаются по величине, поэтому, используя пайку, стоит помнить, какая именно пайка имеется в виду. Изначально в отечественной печати использовали цицеро, но сейчас часто встречается и пайка. Цицеро и компьютерная пайка похожи по величине, но не равны. Иногда цицеро или пайку напрямую используют для измерения, например, чтобы определить размер полей или колонок. Чаще, особенно для измерения текста, используют производные единицы, полученные от пайки, такие как типографские пункты. Размер пайки определяется в разных системах по-разному, как описано ниже.

Буквы измеряют так, как показано на иллюстрации:

Другие единицы

Хотя компьютерная пайка постепенно вытесняет другие единицы, и возможно заменит более привычные цицеро, наряду с ней также используются другие единицы. Одна из таких единиц - американская пайка Она равна 0,166 дюйма или 2.9 миллиметра. Существует еще и типографская пайка . Она равна американской.

В некоторых отечественных типографиях и в литературе о печати до сих пор используют цицеро - единицу, которая широко применялась в Европе (за исключением Англии) до появления компьютерной пайки. Один цицеро равен 1/6 французского дюйма. Французский дюйм немного отличается от современного дюйма. В современных единицах один цицеро равен 4,512 миллиметра или 0,177 дюйма. Эта величина почти равна компьютерным пайкам. Один цицеро - это 1,06 компьютерных пайки.

Круглая шпация (em) и полукруглая шпация (en)

Описанные выше единицы определяют высоту букв, но существуют также единицы, обозначающие ширину букв и символов. Круглая и полукруглая шпации - как раз такие единицы. Первая также известна как кегельная шпация или em, от английского, обозначающего букву M. Ее ширина исторически равнялась ширине этой английской буквы. Аналогично, полукруглая шпация, равная половине круглой - известна под названием en. Сейчас эти величины не определяют с помощью буквы M, так как эта буква может иметь разный размер у разных шрифтов, даже если кегль одинаков.

В русском языке используются короткое и длинное тире. Для обозначения диапазонов и интервалов (например, во фразе: «возьмите 3–4 ложки сахара») используется короткое тире, называемее также тире-en (англ. en dash). Длинное тире используется в русском языке во всех остальных случаях (например, во фразе: «лето было коротким, а зима - длинной»). Оно называется также тире-em (англ. em dash).

Проблемы с современными системами единиц

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

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