Доброго вам дня, мои дорогие друзья. Вот часто сталкиваюсь с ситуацией. Например хочу поставить аватарку на какой-нибудь сайт, вырезаю нужную область своего фото или другой картинки, сохраняю. А когда захожу на сайт, то оказывается, что он принимает фотографии для аватарок размером не более 150*150 пикселей и 100 килобайт, например.
Я смотрю на свою фотографию, а она размером 1920*1200 и весит больше мегабайта. Естественно такую фотографию этот сайт не загрузит. А что делать? Ну в общем ради этого мы здесь и собрались.
В сегодняшнем уроке я покажу вам как уменьшить размер картинки в фотошопе, чтобы подогнать ее под свои нужды. Причем дело коснется как размера пикселей, так и размера килобайт (ну или мегабайт), а качество даже не пострадает. Только не путайте уменьшение размера картинки с обычным , так как мы тут будем реально уменьшать картинку, а не создавать видимость. Возьмем сегодня такую картинку.
В открывшемся окне вы можете увидеть две ячейки (ширина и высота) с текущим размером картинки. Именно здесь вам и предстоит поменять сам размерчик.
По умолчанию ширина и высота связаны такой цепочкой. Это означает, что размер пропорционален. То есть если вы измените значение в любой из этих двух ячеек, то автоматически сменится размер и во второй ячейке. Т.е. пропорции изображения сохранятся.
А если вы нажмете на эту цепочку, то связь разорвется и изменение любого значения не приведет к изменению другого значения. Картина станет непропорциональной.
Как и при создании нового документа в фотошопе, вы можете выбрать единицы измерения, например пиксели, сантиметры, дюймы или вообще проценты от текущего изображения.
После изменения размера, вверху данного окошка вам покажется текущий размер изображения в килобайтах (или других единицах), а в скобках старый размер. Это не финальный размер, так что внимание на него особо не обращайте.
Ну как суть ясна? Давайте лучше для большей ясности посмотрим на живом примере.
Мне нужна фотография для сайта размером 200*200 пикселей. Я беру нашу фотку размером 1920*1200 и загружаю в фотошоп. А дальше по пунктам.
Если изображение нужно для того, чтобы закинуть его на сайт, а не держать как памятную фотографию, то можно его сохранить немножечко другим способом. При этом способе размер картинки (ну то есть ее вес) уменьшится еще в несколько раз, причем никакой потери качества вы не заметите.
Итак, у нас снова неразмеченная картинка с большим разрешением. Если нужно кадрировать, то кадрируйте, но дальше вы должны нажать «Файл» , затем «Экспортировать» , а в следующем выпаде выберете «Сохранить для web (старая версия)» .
ВНИМАНИЕ! Данный путь действителен для Фотошопа версии 2015. Для более ранних версий вы просто заходите в меню «Файл» и выбираете «Сохранить для web». Никакого пункта «Экспортировать» там не будет.
В открывшемся окне выберете «Высокое качество JPG» и качество можно не ставить больше 60 . Если выставить больше, то разницы вы не заметите, а картинка-то будет больше места занимать, хоть и не очень значительно.
Ниже вы увидите строчку «Размер изображения» . Суть абсолютно такая же, как и в предыдущем примере. Вам нужно уменьшить размер по ширине и высоте. Даже цепочка есть). Ставим до 200*200, ну а потом нажимаете «Сохранить» . Вуаля)
В итоге, с помощью двух вышеуказанных способов, я получил два изображения размером 200*200 пикселей. Но у первого изображения размер (объем) составляет 26 килобайт, а у второго 10. Соответственно второй использовать удобнее, но только, если вы сохраняете для сайтов. Для обычного хранения уменьшенной копии лучше использовать первый способ.
Кстати точно также можно увеличивать изображения и фотографии. Для этого точно также вбиваете новые размеры в ячейки. Но я бы вам не советовал, так как потеря в качестве ощутимая. Конечно сделать без потери качества реально, но гораздо сложнее.
Ну а так вот вам хорошие инструменты для уменьшения размера фотографий и других изображений. Ведь сложного ничего нет, правда? Кстати для более глубокого изучения фотошопа предлагаю вам ознакомиться с замечательным курсом по фотошопу для начинающих . Уроки в формате видео очень хорошо воспринимаются и удобнее для изучения программы. Все уроки рассказаны человеческим языком, в отличие от многих других подобных курсов. Я сам решил недавно посмотреть этот курс и узнал для себя немало нового и интересного. так что не теряйтесь.
Ну а на этой веселой ноте я свой сегодняшний урок заканчиваю. Тренируйтесь, практикуйтесь, а самое главное не забудьте подписаться на обновление моего блога, если хотите буть в курсе всего самого интересного. Успехов вам и пока-пока!
С уважением, Дмитрий Костин.
2 голосаДоброго времени суток, уважаемые читатели. Сегодня вас ждет очень простой урок, вы научитесь работать с размерами объектов. Необходимо это практически каждый раз, когда вы открываете программу фотошоп. Думаю, что и продвинутый пользователь может почерпнуть из этой публикации несколько полезных советов.
Итак, приступим? Как уменьшить объект в фотошопе.
В некоторых случаях вам нужно уменьшить размер не целой картинки, а лишь ее части. Как это сделать? Открываем фото и выбираем прямоугольное выделение.
Если вы кликните на левую клавишу мыши и задержитесь на несколько секунд на кнопке, то перед вами откроется дополнительное меню. Тут есть интересный инструмент круглое выделение, можно использовать и его (см. ).
Выделяем нужный фрагмент картинки.
Теперь одновременно зажимаем кнопку CTRL + T.
Сейчас вы воспользовались быстрыми клавишами. Можно было пойти по длинному пути: открыть в верхней панели «Редактирование», а затем выбрать «Свободное трансформирование».
Зажимаем на клавиатуре кнопку Shift и тянем за угол выделенного объекта в сторону.
Итак, я выделил вот этот цветок.
А затем нажал Ctrl + T. Помните, вы можете сделать это и через панель сверху: Редактирование – свободная трансформация.
Можете перетащить, дергая за углы, увеличить или уменьшить – на все ваша воля.
Ну или воспользуйтесь функцией, которая находится в верхней панели.
Я нередко пользуюсь онлайн версией photoshop. Сайтов много, например, вот этот: editor.0lik.ru или вот этот online-fotoshop.ru , не суть. Все они одинаковые и выглядят так.
Зачем пользоваться этим сервисом, если есть программа на компе? Все дело в том, что прога тормозит процессы и даже открывает изображение довольно долго, особенно если компьютер слабый. Этот сервис попроще и полегче, а потому и работает в разы быстрее. Он незаменим, если нужно выполнить какую-то простую операцию быстро или поработать над пачкой картинок.
Первым делом ставим русский язык. В разделе Language.
Многие сочетания клавиш тут не работают, как в программе на компьютере. Однако для открытия файла вы можете использовать сочетание клавиш CTRL+O или воспользоваться верхней панелью: Файл – Открыть.
Чтобы выделить объект можно воспользоваться любым из описанных мной предыдущих методов, а вот для того чтобы включить «свободное трансформирование» на вставленной картинке нужно обязательно залезть в верхнюю панель. Привычное CTRL+T откроет новую вкладку в вашем браузере.
Здесь также нет дополнительных функций, которые открываются при нажатии на правую кнопку мыши.
Но увеличить или уменьшить картинку можно гораздо быстрее.
Если вы хотите улучшить свои знания фотошопа, то могу порекомендовать вам курс Зинаиды Лукьяненко — «Фотошоп с нуля VIP 3.0» , одной из основательниц сайта Photoshop-master . На нем кстати тоже можно найти кучу интересных уроков, которые структурированы по уровню сложности.
Но основное преимущество проекта, это курсы на любой вкус и потребность:
Ну а для тех, кто видит свое будущее в области рекомендую другой вариант. Онлайн школа, которая позволит всего за 2 месяца освоить новую профессию! (Веб-дизайнер: эффективный сайт от идеи до реализации )
Программа идеально подходит для новичков, но также будет интересна и тем, кто уже давно в деле. Не редко удается поработать с мастерами, трудящимися в крупнейших веб-студиях России: Red Keds, Agima, лаборатория Касперского.
Возможно, пока вы не знаете этих названий, но убеждаю, совсем скоро вы поймете, на кого ориентируются все веб-мастера и к тому времени уже сможете сказать: «А я у него учился» или «Эта работа из моего портфолио было создано под руководством эксперта из этой студии».
По завершении курса вам предстоит не только выполнить, но и защитить дипломную работу! По результатам вам выдадут (или не выдадут) самый настоящий диплом, который может оказать решающее значение при приеме на работу или во время выполнения заказа.
На самом деле это не первый раз, когда стартует данная школа. Ее окончили уже 300 учеников и вы можете не только почитать их отзывы на сайте, ссылку на который я вам дал, но и пообщаться на фейсбуке. Думаю, вам дадут расширенную оценку, если вы этого захотите и постучитесь к человеку в друзья.
Если же вы ищете варианты попроще, обратите внимание на сайт Алексея Захаренко: «ВЕБ-ДИЗАЙН для начинающих» . В течение трех дней можете бесплатно ознакомиться с этим сайтом и не только понять основы, но и выяснить, действительно ли вам интересна эта тема.
Это немаловажно. Прежде чем платить большие деньги за обучение в школе на Нетологии определитесь с этим вопросом. А затем сделайте первый шаг на пути к любимой работе.
Если вам понравилась эта статья, подписывайтесь на рассылку и получайте больше полезной информации. Удачи в ваших начинаниях и до новых встреч.
Добрый день, друзья! Сегодня покажу . Для чего? У Вас есть на сайте картинки? Думаю, да. Именно изображения занимают на странице много места и влияют на то, как быстро браузер откроет вашу страницу. А хочется побыстрей, ведь посетитель может не дождаться загрузки и закроет ваш ресурс. А если уменьшить размер картинки мы уменьшим количество скачиваемых данных и улучшим работу сайта.
Для ускорения работы сайта надо использовать такой способ, как . Также, скорость загрузки зависит и от хостинга. Пользуюсь lealhost с оптимальным тарифным планом, проблем никаких.
Уменьшить вес картинки можно различными программами и онлайн-сервисами, но рекомендую использовать графический редактор Adobe Photoshop. В сравнении с другими результат лучше.
Уменьшить размер картинки можно как по размеру, так и по весу. Перед тем как надо знать размер блока под контент, (то место где будет располагаться изображение). Рассмотрим как сжать картинку в фотошопе по шагам.
После таких манипуляций получили картинку размерами 600х401 пиксель. Вес 47 КБ. То есть уменьшили вес изображения практически в 10 раз!
>> Как изменить размер изображения в Фотошопе
В этой статье я хочу Вас научить, в программе фотошоп, а также как уменьшить вес картинки, при этом качество самой картинки не сильно изменилось. Я расскажу и покажу эти действия наглядно на скриншотах (в картинках), что и как нужно делать, чтобы ваша картинка изменилась в размере и весе. Вам только останется выполнить все действия, которые я буду показывать и рассказывать.
В настоящее время стало модным на всех сайтах, помимо самого главного - текста, применять баннеры, видео, анимацию и к дополнению перечисленным - применять изображения. Изображения могут быть разного характера - это и фото и скриншоты и т.д. Причем, функция у них одна - показать какой-то процесс или действие помимо текста, в наглядном виде. Я не скажу Вам что-то новое, если скажу, что изображения лучше передают информацию посетителю, чем обычный текст. Но, выше по приоритету, конечно же - видео. В основном картинки применяют на сайтах с целью разбавить большой текст, чтобы посетители не уставали их читать и с целью показать наглядно то, про что пишется в данной статье.
В общем, плюсов много применения изображений для сайта, блога и в других целях в интернете. Но, есть и недостатки данного метода. Заключается он в том, что если Вы много будете применять на своем сайте или блоге изображений в хорошем качестве и с большим весом каждую картинку, то это не очень хорошо скажется на загрузку страницы сайта, где находятся эти изображения. И посетитель, у которого не высокая скорость интернета или он платит за трафик в мегабайтах, то он просто не дождется загрузки данной страницы сайта и покинет ее. Поэтому, в этой статье я еще Вам хочу показать процесс, который позволит Вам уменьшить не только размер изображения, но и вес при не значительной потере качества. Вес картинки можно в некоторых случаях изменить в 10 раз. Поэтому, не стоит пренебрегать такой возможностью сделать скорость загрузки ваших страниц сайта быстрее. Плюс ко всему и поисковые системы уделяют загрузки сайта пристальное внимание.
Итак, что же нужно сделать, чтобы изменить размер изображения и при этом еще и уменьшить вес изображения. Для этих целей я Вам понадобиться программа Фотошоп любой версии. На самом деле способов изменить размер изображения большое количество и каждый применяет свой способ по вкусу, но в данной статье я покажу этот процесс именно в Фотошопе, так как я сам использую данную программу для своих изображений, которые я потом вставляю себе на сайт. И в этой статье все картинки были сжаты и уменьшены в размере именно в этой программе.
Итак, что Вам нужно сначала сделать. Вам нужна сама программа Фотошоп. Ее Вы можете достать в интернете в свободном доступе. Причем, можно качать программу любой версии - это не важно, так как программа Фотошоп претерпела изменений, только в дизайне, а функции и инструменты остались прежние и на прежних местах. Единственное, с каждой новой версией Фотошопа добавляется какая-то новая возможность. Но в данном случае это не как не отражается на том, что я хочу Вам показать в данной статье, а именно как изменить размер изображения в фотошопе.
Я надеюсь, Вы уже скачали и установили данную программу. После этого запустите ее. У Вас должна появиться примерно такая рабочая область программы фотошоп, которая показана на скриншоте.
Здесь все просто: вверху программы основное меню; слева основные инструменты; справа дополнительное меню с инструментами. Для того чтобы изменять изображение его нужно открыть в данной программе. Чтобы это сделать существует 2 способа.
1-способ : наведите мышкой на основную серую область и дважды нажмите левую клавишу мыши, после чего у вас появиться окно вашего компьютера, где вы должны выбрать то изображение, которое вы хотите изменить в размере.
2-способ : в самом верху программы есть горизонтальное меню и там есть слово "Файл". Нажмите на него.
После этого у Вас появится выпадающее меню, где Вы должны найти слово "Открыть" и перейти по нему. После чего у Вас появиться уже знакомое окно с папками на жестких дисках на вашем компьютере и там найти нужное изображение. После этого в основном сером окне появится то изображение, которое вы открыли в программе фотошоп.
Теперь для того, чтобы приступить к следующему этапу, который будет заключаться в изменении размера изображения, нужно в верхнем меню перейти в меню "Изображение".
После этого у вас появится выпадающее меню, где Вы должны найти такую строку "Размер изображения". Перейдите по данному пункту меню.
После чего у Вас появится окошко, в котором Вы и будете изменять размер изображения. Здесь если Вы будете менять размер, к примеру, ширины, то автоматически изменится высота и наоборот. Это делается для того, чтобы не изменялись пропорции изображения. По отдельности здесь Вы размер изображения не выставите. Это Вы можете сделать дальше, когда будете сохранять данное изображение. Поэтому, здесь Вам нужно выставить размер одного значения либо ширины, либо высоты.
После того, как Вы выставили значения и нажали ОК, Вам нужно следующим этапом сохранить данное изображение, причем там же можно изменять пропорции изображения высоты и ширины таким, каким Вы хотите видеть данное изображение и при этом еще и уменьшить вес (сжать) изображение. Для этого откройте меню "Файл" в верху программы и перейдите в меню "Сохранить для Web и устройств".
После у Вас появиться окно, в котором Вы можете дополнительно изменить размер и качество изображения. Если Вы хотите изменить размер изображения по отдельности, Вам нужно нажать на значок, который показан стрелкой в низу скриншота. После этого цепь разорвется, и Вы можете изменять пропорции изображения по вашему вкусу. После того, как Вы измените изображение в верху данного окна, Вы можете выбрать формат и качество данной картинки. После этого, в основном окне, Вы должны наблюдать все введенные вами изменения и внизу будет размер данной картинки. После того, как Вас все устроит, нажмите "Сохранить" и выберете на компьютере то место, где Вы хотите сохранить данное изображение.
Все, после этого Вы берете данную картинку и вставляете себе на сайт.
На этом я данную статью заканчиваю и теперь я думаю, у Вас не возникнет вопрос, как изменить размер изображения в фотошопе.
Если Вам статья понравилась, то по возможности оставьте свой комментарий, чтобы я смог оценить качество своей работы.
Привет, друзья!
Это очередной материал по работе с изображениями.
В нем вы узнаете, как уменьшить размер изображения без потери качества с помощью Paint, Photoshop и онлайн сервиса.
Причем, узнаете, как делать это в двух аспектах. Ведь размер изображения имеет 2 смысла:
Данный материал подойдет всем, кого интересует уменьшение размера своих изображений, фотографий и так далее. И очень полезен будет владельцам сайтов, так как категорически не рекомендуется размещать в своих материалах картинки большого размера и веса.
Начнем с небольшого рассмотрения надобности всех действия, рассматриваемых ниже.
Касаемо изменения высоты и ширины картинки, то тут вариантов множество: необходим нужный размер для печати, для размещения на сайте, для уменьшения того же веса картинки, так как при уменьшение размеров он снижается.
Уменьшение веса может потребоваться для экономии веса на носителе (жесткий диск, флешка и так далее), для быстрой загрузки изображений на сайте и так далее
Вариантов на самом деле огромное количество. Чтобы не томить мы приступаем к практике.
По традиции я даю подробный видео-урок, в котором все показал наглядно.
Теперь для любителей текстовых инструкций.
Для изменения размеров высоты и ширины я не рекомендую пользоваться какими-то онлайн-сервисами, так как это можно сделать с помощью стандартного набора программ и даже стандартным редактором операционной системы Windows - Paint.
Открываем изображение в Paint и на вкладке "Главная" имеется пункт "Изменить размер".
Нажав на него мы можем изменить размер, не потеряв при этом качество (если уменьшаем) и не утеряв пропорции. Для этого обязательно активируем настройку для сохранения пропорций.
Изменяя параметры размеров по горизонтали и вертикали, вы регулируете ширину и высоту изображения соответственно. Выбрать необходимые параметры, жмете на кнопку "Ок", а затем сохраняете итоговый файл на компьютер.
На это изменение размера изображения в Paint закончили.
Кстати, изменение параметров ширины и высоты также влияет на вес изображения. Поэтому, берите это на заметку.
Теперь рассмотрим вариант с помощью Photoshop.
Открываем в программе наше изображение и двигаемся в пункт "Изображение - Размер изображения".
В следующем окне изменение происходит аналогично, как и в Paint. Убедитесь, что стоит чек-бокс для сохранения пропорций и ставьте необходимые параметры высоты или ширины.
После нажатия на кнопку "Ок" параметры размера будут применены и можно сохранить файл.
Данных способов вполне достаточно для изменения размеров высоты и ширины изображений.
Теперь мы рассмотрим 2 способа, как можно уменьшить вес изображений.
Но перед этим хочу заметить, что один способ вы уже знаете. Если вам не нужны изображения сверх больших размеров, то можно уменьшить их высоту и ширину, тем самым вес уменьшится в несколько, а то и в десятки раз.
Данный способ будет очень полезен владельцам сайтов, так как, чем меньше весит страница, тем она быстрей загружается. А это очень важно. Подойдет способ также для любых нужд.
После открытия изображения в фотошопе нужно сразу его сохранить, но не обычно, а для web и устройств.
В следующем окне необходимо задать параметры качества изображения:
Также можете менять размеры прямо в этом окне, а не отдельно через пункт "Изображение - размер изображения", как я это показал в пункте ранее. Это очень удобно.
После настройки параметров сохраняете настройки (см. скриншот выше).
Только этим способом мне удалось снизить вес картинки с 116 кб до 75 кб, не изменяя при этом размеров (высота и ширина остались прежними).
В данном способе можете играться со значением качества. Все зависит от того, зачем вам нужно убавить вес изображения. Вполне возможно, что сможете поставить параметр и поменьше, сделав вес еще меньше.
Теперь рассмотрим, как уменьшить вес при помощь онлайн сервиса.
Данный способ очень кстати уже для уменьшенных изображений. Например, если я уже уменьшил картинку ранее в Photoshop, то сервисом мы можем добить размер окончательно.
Сервис имеет название krakin.io . Переходим на него. Я дал ссылку уже сразу на страницу выбора изображения.
На данной странице нужно сначала определиться со степенью сжатия изображения. За это отвечают 2 параметра:
Определиться с данным параметром вы сможете, только протестировав их. Поэтому, попробуйте сжать картинку и так и так, а затем уже выбрать нужный вариант.
Изображение сразу оптимизируется и отчет о проделанной работе мы увидим под областью для выбора файла.
Видно, что оригинальный размер файла был 77 кб, а после оптимизации он стал 59 кб. Также показывает сколько было сжато в килобайтах (18 кб) и в процентном отношении (23.8%).
Чтобы сохранить сжатое изображение, необходимо нажать на кнопку "Download this file" в последней колонке "Status". Нас перекинет на новую вкладку, где откроется итоговое изображение, чтобы мы могли его оценить. Для сохранения нужно нажать правую кнопку мыши на изображении и выбрать пункт "Сохранить картинку как".
Если вы смотрели видео в начале статьи, где я наглядно показал процесс и все нюансы данной статьи, то знаете, что только этими способами можно уменьшить изображение с 360 кб до 40 кб. И это не предел.
Данный материал подошел к концу. Всех способов, описанных в статье, как обычному пользователю интернета, вам будет с головой.
В комментариях ниже мне будет интересно узнать какие-то ваши способы для уменьшения веса картинок. Может имеется что-то более простое, но эффективное. Поэтому, жду вас ниже возле формы комментариев.
С уважением, Константин Хмелев!
