Предлагаю помощь в подготовке иллюстраций

    Наверное я кого-то просто достал с этой темой, а кого-то нереально достал.

    Я опять хочу сказать про иллюстрации к статьям.

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

    Раньше я просто минусовал такие статьи, полагая что так уменьшаю энтропию вселенной. Сейчас же я хочу предложить помощь тем, кто хочет сделать лучше, но не знает как.

    Все просто — вы присылаете мне личное сообщение с ссылкой на опубликованную статью, или слепок черновика, сделанный с помошью сервиса peeep.us, если статья еще не опубликована. Я отвечаю вам ссылками на пережатые изображения. Иногда даю советы, что еще можно сделать.

    Срок действия акции пока не ограничивается.

    image — 17 кб. — 7,2 кб.
    Поделиться публикацией
    Похожие публикации
    Ой, у вас баннер убежал!

    Ну. И что?
    Реклама
    Комментарии 77
    • +3
      Раньше я просто минусовал такие статьи

      Надеюсь вы в комментах отображали свою точку зрения на счет данного действия?
      • +53
        По своему опыту, товарищ homm часто сообщал об этом в личку и даже присылал нормально сжатые изображения. Так что не надо налетать.
      • +8
        Лучше по шагам распишите, что вы делаете для сжатия картинки. И как вы узнаете, что эту картинку можно еще сжать, а эту без потери качества нельзя. Так думаю будет больше пользы для общества.
        • +2
          Таких топиков полно, и они интересны в первую очередь верстальщикам. Простым людям некогда вдаваться в такие подробности.
          • +4
            Были бы достаточно простые инструменты с парой простых схем-объяснений — был вы выхлоп.
            • +2
              Скачал специально Paint.NET, т.к. знаю, что там можно поиграться качеством/объемом и вот что получил:

              6.81 КБ
              • +3
                > и вот что получил:
                И вы получили картинку с рваными краями.

                • –6
                  И какие же края бывают, как не «рваные»? Ведь это пиксели…
                  • +16
                    Ну, нерваные бывают.

                    • –7
                      Откуда красный фон, зачем и почему столько плюсов за демонстрацию своей глупости? Вот вопросы, которые меня интересуют.

                      На белом фоне разницы с оригиналом не видно, все остальное — писькомерки.
                      • +13
                        Вот бы все фоны вдруг стали белыми. Заживем!
                        • +3
                          На хабре все фоны белые )
                          Впрочем, если картинка содержит самостоятельную иллюстрацию, а не элемент дизайна, то можно вообще выкинуть прозрачность и сделать ей белый фон.
                          • +9
                            > На хабре все фоны белые )
                            Эта картинка была не на белом фоне.
                            • +1
                              Не все, есть еще корпоративные блоги с кастомным дизайном.
                    • +7
                      Возможно, но с другой стороны когда вы смотрите баннер, вы же не увеличиваете его в 10 раз, чтоб узнать, рваные там края или нет.
                      С другой стороны вас то же понимаю, вам как профессионалу, хочется чтоб был «порядок». Но ведь не все являются верстальщиками и многим при написание статьи не столько важно, сколько будет весить картинка, важнее его содержимое. И часто не важно, размытые у картинки границы или нет.
                      • +6
                        Тут увеличение в 2 раза. На самом деле хорошо видно и без увеличения.
                        • –1
                          А без красного фона?
                          • +6
                            А без красного фона будет фон другого цвета. Если он совпадает с цветом крайних пикселей, рваные края будут невидны. Всегда знать, на каком фоне будет использоваться изображение, нельзя. Тем более, что он может быть неоднородным.
                            • –1
                              Вы же предлагаете подготовку картинок для статьи на Хабр. На Хабре фон белый. Вопросы?
                              • +6
                                А, дак вы не знаете предыстории. Этот персонаж известного фильма еще с утра использовался в рекламе на самом Хабре под каждой статьей. Сейчас её уже выключили. Фон там был, конечно, не красный, но и не белый.
                                • –6
                                  Предыстории меня не волнуют. Человек сделал меньше размера картинку по вашим же условиям («для статьи на хабре»). По-моему тут больше нечего обсуждать, просто надо это признать и не затуманивать сознание фонами.
                                  • +4
                                    Это не картинка для статьи для хабара — это первая картинка, попавшаяся под руку. Она была не на белом фоне. Это даже признавать не нужно, это так и есть.
                      • +1
                        А JPEG вообще прозрачность не поддерживает, насколько я знаю. Претензии не в тему. В одном случе теряем качество за счет искажений, в другом за счет палитры.
                        • +1
                          Собственно, затупил. В примерах обе картинки PNG. Это в тексте JPG упоминалось.
                  • +1
                    Я бы все-таки был очень признателен, если бы Вы написали такаю статью — я бы с удовольствием показал ее своему верстальщику.
                • +1
                  На мой взгляд пережатие через Adobe Photoshop (инструмент «Save for Web and Device..» в меню «File») картинки даст хорошие результаты при минимуме затрат. Уверен есть утилиты или инструменты в различных просмоторщиках\редакторах, позволяющие делать аналогичное («Не всем нужен фотошоп»).
                  • +1
                    Из бесплатного — paint.net под винду и GIMP под линукс с GTK (чем пользуются приверженцы KDE и всего, что не использует GTK, уж извините, не знаю).
                    • 0
                      Gimp прекрасно работает и в винде
                    • 0
                      Не совсем. Подбор оптимального сжатия JPG методом тыка — иногда затратный по времени, на моём опыте гораздо быстрее и лучше результат получается если сохранить с качеством 100 и скормить jpegmini.com, а потом еще для надёжности вырезать метаданные например JPEG & PNG Stripper'ом.
                      Но иногда он фейлит, по моему опыту — например в изображениях с фокусом на переднем плане и размытым фоном, плохо получаются края контрастного объекта.

                      PNG-24 вообще без разговоров — на средних и крупных изображениях optipng + pngout дают сжатие в разы.

                  • –36
                    Ох уж эти шрифто/картинко фаперы.
                    Даже в нашей глухой деревне интернет 20мбит везде.
                    • +9
                      И вы наивно полагает, что любая страничка в любой момент готова прилететь к вам именно с такой скоростью, не взирая на загруженность канала сервера и то, что вы делите канал с соседями по подъезду?
                      • +16
                        Общежитие НГУ: 2 мбит/с — максимально быстрый тариф. Так где ваша деревня располагается?
                        • 0
                          Видимо, для него «дефолт сити» стал уже деревней.
                        • НЛО прилетело и опубликовало эту надпись здесь
                          • +3
                            Не поверите, Краснодарском крае куча народу пользуется dialup-ом и gprs не только дома, но даже и на работе
                            • +2
                              Мой мобильный GPRS огорчает ваш комментарий.
                            • –25
                              мне кажется, или тут помимо прочего полезного идет реклама сервиса peeep.us???
                              • +33
                                Да, идет реклама бесплатного очень полезного сервиса. Очень рекомендую. Пользуйтесь, пожалуйста.
                                • –23
                                  а что там полезного ???
                                  • +8
                                    О, с помошью это прекрасного сервиса вы можете расшаривать почти любые закрытые странички (кроме уж совсем махрово-аяксовых), не давая никому свой пароль, например так. А еще вы можете сохранить любую страничку в определенном виде для истории, например так.
                                    • +5
                                      Не плохой баланс в рублях.
                                      • +2
                                        ооооо… действительно хороший сервис )))
                                        • +2
                                          Так что, забанил вас mktums или нет? Нам интересно.
                                          • 0
                                            У него была депрессия, он всех тогда побанил. Сейчас жив-здоров.
                                  • +15
                                    Раньше я просто минусовал такие статьи, полагая что так уменьшаю энтропию вселенной

                                    Мы нашли этого засранца, вали его1!!!
                                  • +3
                                    По быстрой оптимизировать свои картинки
                                    • +5
                                      Вручную выполнять рутинную работу глупо. Разумнее прикрутить оптимизатор к habrastorage.org.
                                      • +2
                                        Лучше тогда в момент загрузки поставить галочку «оптимизировать объем картинок». Или после загрузки показать 2 ссылки — один на оригинальную, а второй на оптимизированную.
                                        А то мало ли…
                                        • +2
                                          Ещё было бы здорово на habrastorage выдавать уменьшенные кликабельные копии…
                                        • +25
                                          Раньше я просто минусовал такие статьи, полагая что так уменьшаю энтропию вселенной


                                          Ну просто graphic nazi :)
                                          • +4
                                            А я всё-таки поддержу коммент господина AigizK, и попрошу статейку на тему сжатия, дабы не просить каждый раз чужого дядю и не ждать, пока у него будет время))
                                            • +2
                                              Я конечно понимаю, что канал у всех разный (кто-то вообще через gprs сидит иногда), но мне кажется что достаточно много статей просто не предназначены для просмотра на:
                                              1. Мобильных устройствах, ибо статьи с большим кол-вом изображений/видео просто неудобно просматривать на маленьком дисплее (и не важно, какое там разрешение, дело не в нём)
                                              2. Узких каналах, ибо содержат «тяжеловесные» примеры/ссылки на приложения/видео и т.п. увесистый контент, который, можно так сказать, обязателен к изучению, дабы полностью вникнуть в суть

                                              Это, конечно же, скорее относится к профильным блогам и некоторым специфическим статьям, но всё же… Именно поэтому, как мне кажется, многие не затрагивают оптимизацию своих изображений. Кстати минусовать такие статьи за то, что автор упустил из виду оптимизацию изображений мне кажется вовсе неверным — всё же рейтинг не для того был сделан?

                                              Впрочем, я согласен с тем, что в некоторых статьях для широких масс стоит заниматься оптимизацией, и что не стоит ставить в заголовок статьи (который будет виден в списке статей) огромные изображения, чем многие «грешат». Ну и, понятное дело, метровые изображения в любой статье вовсе «не вариант» :)
                                              • +1
                                                Скриншоты в JPEG пестрят артефактами независимо от размера дисплея или ширины канала.
                                                Вряд ли подобные явления можно объяснить иначе как компьютерной безграмотностью.
                                                • 0
                                                  Я не спорю про JPEG — лично я никогда вообще не пользуюсь этим форматом (фотоаппаратом как-то не приходилось пользоваться, да) — имхо он создан лишь для издевательства над людьми. По мне так смысла сжимать изображение (даже в 3-4 раза) если оно теряет своё качество просто нет. Это было весьма актульно лет 5-10 назад, но времена меняются — мы неизменно движемся в сторону улучшения качества/размера (во всех смыслах).

                                                  Я говорил лишь о возможном большом размере PNG изображений и случаях, когда в их оптимизации особого смысла нет. Не более.
                                              • +6
                                                Вы, конечно, меня запинаете, но у меня мнение такое: лучше пусть люди с полезными статьями об свои наработках в электронике, коде, которые кое-как сняли фото своеё поделки на свою мыльницу сохранят её хоть в bmp, и свои начерченные схемы из Altium Designer снимут скриншотом и сохранят его в jpg, но зато статья ценная, понятная, уникальная. И совсем не похожа на статьи тех о ком не говорят. Хотя у них лого лисы и хрома сохранено в отличном качестве, но статья то ни о чем.
                                                • +1
                                                  А если еще с оформлением все в порядке, то статья сразу теряет ценность?
                                                  • +2
                                                    Нет она становится хорошо оформленной, ценности она не теряет и не обретает. Хватит уже статей хорошо оформленных и ни о чем. Итак похерили хабр, зато статьи оформленные.
                                                    Пусть лучше такие люди смело пишут хорошие ИНФОРМАТИВНЫЕ статьи, а не боятся что тут их запинают орфографией и картинками «png вместо jpg», «jpg вместо png».
                                                    Я не говорю, что оптимизация это неважно, я просто говорю главное не она!
                                                    • +5
                                                      А если у статьи картинка чуть больше, чем могла бы быть, то теряет, и её надо минусовать?

                                                      Вот человек тратит время и силы, пытается поделиться с окружающими чем-то полезным. «На, сволочь, минус! Картинка не в пнг!»
                                                  • +7
                                                    Изображение из статьи при желании можно еще сильнее ужать:
                                                    — 4,3 кб.
                                                    Если сильно присмотреться, можно придраться, но в целом, на мой взгляд, все хорошо и альфа на месте.
                                                    • +2
                                                      habrahabr.ru/blogs/DIY/131502/ — размер иллюстраций уменьшен с 2,3 мб до 400 кб.
                                                      • +3
                                                        «полагая что так уменьшаю энтропию вселенной»
                                                        No pasaran!
                                                        2-ой закон термодинамики говорит о невозможности уменьшать энтропию вселенной. Можно только перегонять её из одних частей в другие.
                                                        • 0
                                                          На мой взгляд, скриншоты надо делать в png-8 (если не важен цвет) или png-32 (если важен).
                                                          Все остальное — в jpeg (в фотошопе «сохранить для веба») и качеством в 60% (либо в 51% для особо продвинутых).

                                                          Это простое правило позволит снизить излишний объем раза в 2-3. В большинстве случает этого достаточно.
                                                          • 0
                                                            Два скриншота ко двум моим последним блогозаписям (про Chainvas и затем про -prefix-free) были, за нехваткою времени, позаимствованы из статьи «Useful Coding Tools and JavaScript Libraries For Web Developers» на сайте «Smashing Magazine».

                                                            К сожалению, там они приводились в формате JPEG и оттого не соответствуют Вашим высоким стандартам качества.

                                                            Если Вы готовы создать их аналоги в формате PNG (именно создать, потому что преобразование из JPEG в PNG бессмысленно: оно объединило бы высокий объём PNG и несовершенную информационную целостность JPEG), и если эти аналоги выйдут не менее красивыми, то на здоровье. А не то прошу Вас в сём случае считать себя свободным от Вашего обещания.
                                                            • 0
                                                              Обещания? Я вроде обещал только помочь в случае обращения.
                                                              • 0
                                                                Верно. Однако я не могу судить о том, следует ли в этом случае и впрямь обратиться.
                                                                • 0
                                                                  А, в этом плане :) Нет, я не смогу отрисовать заново.
                                                            • НЛО прилетело и опубликовало эту надпись здесь
                                                              • +1
                                                                Помоему автору делать нечаго, пустил бы свое свободное время в более нужное русло.
                                                                • 0
                                                                  Для тех кто не хочет никуда пересылать, кратко алгоритм:

                                                                  Начинаем с того, что думаем можем ли мы пересчитать количество цветов на изображении в уме
                                                                  (т.е вот есть черный, красный, синий и темно-синий — значит можем, или «дофига оттенков синего» — значит не можем).

                                                                  Если можем, то сохраняем в png, если нет — в jpg, любой программой.
                                                                  Таким образом подгатавливаем все изображения в одной папке.

                                                                  Скачиваем программу (http://rghost.ru/19467051), о которой автор писал на хабре (http://habrahabr.ru/blogs/web_design/121096/) и создаём ей ярлык на рабочем столе или панели total commander-а (я выбрал второй вариант).

                                                                  После чего просто перетаскиваем папку на ярлык и на единственный вопрос программы отвечаем Normal/Default если лень думать, или на своё усмотрение если внимательно читали вышеуказанную статью.
                                                                  • 0
                                                                    А почему ссылками?
                                                                    У Вас какой-то хитрый алгоритм, который Вы не хотите никому раскрывать, или просто публичный сервис оптимизации еще не готов?
                                                                    • 0
                                                                      А как, если не ссылками, пересылать изображения в интернете? Мои россказни об оптимизации, думаю, мало заинтересуют людей, которым нужно просто выложить изображения к топику.
                                                                      • 0
                                                                        Дайте людям вебинтерфейс сервиса, где они смогут ужать свои картинки.

                                                                        Или Вы просто ратуете за уменьшение веса, но при этом не являетесь представителем какого-то сервиса ужимания?
                                                                        • 0
                                                                          Это самое «ужимание», оно не полностью роботизированный процесс, там нужно прикладывать ручки и время. Хочешь попрактиковаться? Местный пользователь x128 выложил свою среду для оптимизации — CQ, но пользоваться ею желающих немного.
                                                                    • 0
                                                                      А мне не поможете? У меня около 5 изображений для сайта — нужно их профессионально обработать и сделать миниатюры к ним. У меня как-то по дилетантски выходит — тяжелые больно.

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

                                                                      Самое читаемое