@stansult10 авг 2010 в 01:16

Генерирование изображений-заглушек

3 мин

62K

Веб-разработка *

+264

119

Комментарии 119

@nooze 10 авг 2010 в 02:33

P.S. Кто может предложить адекватный перевод слова «плейсхолдер»?

заглушка?

@stansult 10 авг 2010 в 02:57

спасибо, сейчас заменю

@Colwin 11 авг 2010 в 03:53

Лучше не «Генерирование заглушек изображений», а «Генерирование изображений-заглушек».

@stansult 11 авг 2010 в 04:59

да? ну давайте попробуем
может, так лучше

@icc 10 авг 2010 в 03:24

можно еще перевести, как «заполнитель»

@zerkms 10 авг 2010 в 04:28

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

@habraname 10 авг 2010 в 05:08

lingvo.yandex.ru/placeholder/%D0%BF%D0%B5%D1%80%D0%B5%D0%B2%D0%BE%D0%B4/

читайте книги! развивайте воображаение! (Ц)из рекламы %onlineshopname%

@stansult 10 авг 2010 в 06:18

ну я это видел, мне эти варианты не понравились
а заглушка — вполне

@xdevel 10 авг 2010 в 06:31

Для нашей страны к госслужащему вполне можно применить второй перевод.
К подавляющему числу госслужащих

@stansult 10 авг 2010 в 06:59

(ну, offtopiть так offtopiть :))

мне вообще вначале показалось, что это прикол такой
потом посмотрел — правда
но там немного различаются толкования
сам dictionary.com говорит, что это человек, назначенный на госпост в обмен на услугу/поддержку
а wordnet толкует мягче — что-то типа временного и.о.

@SquirrelEx 10 авг 2010 в 04:27

«Заниматель места» :)

@stansult 10 авг 2010 в 07:00

да, он и есть :)
но заглушка как-то звучит естественнее — а смысл тот же

@rblv 10 авг 2010 в 07:14

Мицгол наверное проникся-бы :)

@TravisBickle 10 авг 2010 в 09:38

Столбитель =)

@stansult 10 авг 2010 в 19:05

тоже хороший вариант :)

НЛО прилетело и опубликовало эту надпись здесь

@stansult 10 авг 2010 в 03:06

не за что :)
это мне подсказал коллега (безынвайтный пока)

@stansult 10 авг 2010 в 07:00

о, инвайт! всем спасибо, пошлю коллеге!

@Goodkat 10 авг 2010 в 07:59

placehold.it/350x150/red

@stansult 10 авг 2010 в 08:21

он его воспринимает как placehold.it/350x150/0ed
«r» не знаком, и вместо него ставит «0»

@vmysla 10 авг 2010 в 15:28

прикольно что работает placehold.it/350x150/green ))

@stansult 10 авг 2010 в 18:59

совпадение :)
placehold.it/350x150/00ee0

@vmysla 11 авг 2010 в 10:23

почти совпадение, я специально подбирал))

@noonesshadow 10 авг 2010 в 03:04

Удобная штука, но сразу мысли что лучше на своем хосте так :)

@stansult 10 авг 2010 в 03:05

я думаю, не должно быть сложно разобраться, как они это сделали

@psylostlife 10 авг 2010 в 04:15

Тут все примитивно на уровне реализации, но сама идея — очень ценная.

@r3s3t 10 авг 2010 в 03:06

А я обычно просто использую параметры width и height + background. Пожалуй, попробую твой сервис, интересно.

@stansult 10 авг 2010 в 03:10

тут, мне кажется, удобство в том, что можно размеры видеть (если нужно),
а также цвета подбирать, меняя числа — и смотреть, как выглядит

p.s. это не мой сервис, я просто разместил… :)

@r3s3t 10 авг 2010 в 03:15

Ну да, я понял. :)

@LightServer 10 авг 2010 в 04:10

Это не его матароллер. Он просто разместил объяву. ))

@LightServer 10 авг 2010 в 06:26

Народ, какие могут быть предъявы? Сервис не его, он просто разместил объяву.

@Nc_Soft 10 авг 2010 в 03:18

Интересно, как они монетизируются. Рекламу чтоли вставлять будут на бэкграунд? :))

НЛО прилетело и опубликовало эту надпись здесь

@gibson_dev 10 авг 2010 в 03:28

Не все в этом мире должно быть монетизировано

@psylostlife 10 авг 2010 в 04:16

only for fun

@vasilyyaremchuk 10 авг 2010 в 04:22

на главной странице title — «Quick and simple image placeholders»
h1 — "… A quick and simple image placeholder service."

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

а теперь внимательно смотрим на банер внизу главной страницы — реклама фрилансерского сервиса.
Вполне очевидно, что кто-то из фрилансеров может искать «Quick and simple image placeholders», которые часто необходимы в работе, например, верстальщика.

@icc 10 авг 2010 в 03:22

полезный сервис, спасибо

@drfisher 10 авг 2010 в 05:09

@XuMiX 10 авг 2010 в 05:44

Хотите ДОС?:)

Copy Source | Copy HTML <?php for ($i = 1;;$i++) { for ($j = 1;;$j++) { file("http://placehold.it/$ix$j"); } } ?>

@denver 10 авг 2010 в 06:11

— Ну и зараза же ты, родной…
— Он хуже. Он просто кю!

@out0f0rder 10 авг 2010 в 06:25

Зачем у вас внешний цикл, если внутренний никогда не кончится?

@calg0n 10 авг 2010 в 06:35

эт чтоб наверняка :)

@XuMiX 10 авг 2010 в 06:41

ну, чтобы симметрично:)

@XuMiX 10 авг 2010 в 06:44

блин, точно%) Вот так симметрично:)

Copy Source | Copy HTML <?php for ($i = 1;;$i++) { file("http://placehold.it/$ix$i"); } ?>

@elw00d 10 авг 2010 в 06:52

Для того, чтобы сформировать квадрат, не обязательно указывать через MxN, достаточно просто M.

НЛО прилетело и опубликовало эту надпись здесь

@psylostlife 10 авг 2010 в 11:28

placehold.it/3999x3999

Весит 26 килобайт :)

@psylostlife 10 авг 2010 в 11:28

Кстати, это максимальное разрешение, которое разрешено на этом сервисе.

@pomkaster 10 авг 2010 в 12:26

placehold.it/3999x4001

@alexg 10 авг 2010 в 09:11

и все равно работать не будет…
If a dollar sign ($) is encountered, the parser will greedily take as many tokens as possible to form a valid variable name. Enclose the variable name in curly braces to explicitly specify the end of the name.

НЛО прилетело и опубликовало эту надпись здесь

@XuMiX 10 авг 2010 в 10:02

В данном случае — пофик

@Paaashka 10 авг 2010 в 09:54

Как много проблем могут найти профессионалы в всего пяти строчках кода. :)

@XuMiX 10 авг 2010 в 10:17

ок, для гурманов:
Copy Source | Copy HTML
namespace ConsoleApplication1
{
    using System;
    using System.Net;

    public static class Program
    {
        public static void Main(string[] args)
        {
            for (int i = 1;; i++)
            {
                var req = WebRequest.Create(string.Format(«placehold.it/{0}x{0}», i));
                req.BeginGetResponse(RespCallback, new object());
                req.Abort();
            }
        }

         private static void RespCallback(IAsyncResult asynchronousResult)
         {
             return;
         }
    }
}

@XuMiX 10 авг 2010 в 06:42

господа минусяторы, если вы не вдуплились, я как-бы намекаю создателю сервиса, что надо от такого защититься

@stansult 10 авг 2010 в 07:14

создатели сервиса вряд ли по-русски читают :)
там на странице внизу есть ссылки на их твиттер-аккаунты (Brent и Russell)
добавлю-ка я это в пост

@XuMiX 10 авг 2010 в 06:51

АААаааАААаа111!!! карма-карма-карма!!!)) Еще минусов еще:))

@Golden_Grey 10 авг 2010 в 06:13

@stansult 10 авг 2010 в 07:15

да, забавная :)

@Golden_Grey 10 авг 2010 в 07:21

Ещё бы поддержку кириллицы — цены б не было…

@stansult 10 авг 2010 в 08:23

вот тут кириллица работает
сейчас в пост добавлю

НЛО прилетело и опубликовало эту надпись здесь

@stansult 10 авг 2010 в 07:15

не знаю
может, им предложить, чтоб сделали unicode-поддержку?

@nehxby 10 авг 2010 в 08:04

Да, если на чем-то понятном написано, не вопрос и самому сделать поддержку. Пусть только сырцы дадут

@stansult 10 авг 2010 в 08:23

там выше дали адрес, где всё есть, и кириллица работает

@stansult 10 авг 2010 в 08:23

то есть ниже :)

@nehxby 10 авг 2010 в 09:00

да, ниже и я заметил. но т.к. там все работает, то и сорсы ни к чему, так ведь?

@stansult 10 авг 2010 в 09:22

ну, народ найдёт, что поправить :)
вот это, к примеру

@Dominic 10 авг 2010 в 06:30

Простите за неосведомленность, но что за формат ".lpeg"?

@Spavvn 10 авг 2010 в 06:48

Опечатка, наверное.

@stansult 10 авг 2010 в 07:25

да, точно :)
а я повёлся

@stansult 10 авг 2010 в 07:25

вот прикол :)
а я решил, что просто незнакомый мне формат — картинка-то проявилась как надо! и в адресе — нормально, «lpeg» этот стоит :)
но дело в том, что по умолчанию там всем даётся формат gif, и картинка в посте на самом деле — просто gif, под названием 99cccc.lpeg.gif :)

сейчас поправлю пост — видимо, у них правда опечатка просто :)

@k0rv1n 10 авг 2010 в 06:31

Я пользуюсь dummyimage.com/
Внизу страницы, кстати, пачка ссылок на исходники для разных языков, есть даже модуль для друпала.

@kuzvac 10 авг 2010 в 07:03

Этот удобнее.

@stansult 10 авг 2010 в 08:06

о, здорово!
отличный сервис, ещё один :)

@stansult 10 авг 2010 в 08:09

вы будете смеяться, но автор этого сервиса — тот же Russell Heimlich :)
видимо, допилил немного совместное творение и у себя повесил

@kuzvac 10 авг 2010 в 09:23

О, точно)

@stansult 10 авг 2010 в 09:01

спасибо большое!

заменил в посте примеры на dummyimage.com
до ката оставил изначальную ссылку, чтоб нагрузка шла на оба сервера :)

@vadimus 10 авг 2010 в 07:03

Хотите верьте, хотите нет, но этот блинки сгенерирован из заглушек 5×5

Заметно небольшое торможение, когда отображается страница. Все-таки серверу приходится генерировать сотню картинок.

@vadimus 10 авг 2010 в 07:15

Упс, фокус не удался! Пока был предпросмотр, все было окей, а при загрузке парсер каждую картинку перенес.

Действующая модель.

@stansult 10 авг 2010 в 08:04

классно!!!
и не лень же :)

@vadimus 10 авг 2010 в 09:07

Следующий шаг: написание териса на JS!

@psylostlife 10 авг 2010 в 07:44

Я, пожалуй, поверю.

P.S.
Кстати, интересны мощности их сервиса. Почему-то уверен, что картинки генерятся один раз, а потом просто берется готовый файл и отдается по идентичному запросу. По крайней мере, я бы так и сделал.

@vadimus 10 авг 2010 в 09:05

Ну да, без кэша не обошлось. Можно либо:
− создавать картинки «физически»,
− кэшировать в MySQL,
− еще как-то.

Специалисты по производительности, расскажите, как сделать лучше?

@maxshopen 10 авг 2010 в 09:40

Зачем здесь Mysql, да еще с такой нестандартной функцией? Просто на диск класть картинки, а потом проверять — если файл есть — отдаем его, нет — генерим и сохраняем новый. И факультативно заголовки выставляем, чтобы браузер у себя тоже закэшировал

@psylostlife 10 авг 2010 в 09:49

Конечно физически, в мускуле хранить — извращение.

@stansult 10 авг 2010 в 09:11

тогда, если народ увлечётся нестандартными текстами, нагрузка у них возрастёт

@psylostlife 10 авг 2010 в 09:53

М? :)

@vadimus 10 авг 2010 в 10:59

Да, Блинки прилег отдохнуть!

На самом деле картинка отображается корректно в моих комментариях. Почему-то в посте тег img получил свойство css display:block, или запрет на обтекание.

@xn__p2a 10 авг 2010 в 11:49

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

@vadimus 10 авг 2010 в 19:02

В исходном коде переноса нет. Он точно такой же, как на странице комментариев. Так что проблема именно с CSS.

@stansult 19 апр 2012 в 02:02

не прошло и пары лет, а картинка уже показывается верно :)
парсер поправили, видать

@taliban 10 авг 2010 в 07:08

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

тоже в принципе удобно, и одновременно можно подобрать картинку под тематику сайта а не просто цветные квадраты…

@stansult 10 авг 2010 в 08:11

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

@saver_ag 10 авг 2010 в 11:57

Следует помнить, что у картинки может быть правообладатель.

@taliban 10 авг 2010 в 22:35

1 — для тестирования пофигу
2 — по первой претензии картинка уберется, так как не критичен контент

@maxshopen 10 авг 2010 в 07:12

Удобная штука. Если кому надо — вот примерная регулярка для разбора урла:

(?ix)
(?:
  (\d+)
  (?:[x](\d+))?
  (?:[/]([a-f0-6]{6})?)?
  (?:[.](jpe?g|gif|png))?
  (?:[&]text=(.+))?
)

@maxshopen 10 авг 2010 в 07:57

опечатался, вместо [a-f0-6] надо [a-f0-9]

@stas_agarkov 10 авг 2010 в 16:26

а для чего?

@maxshopen 10 авг 2010 в 17:31

Ну если захочется у себя локально такой сервис поднять, например. Там делов на полчаса. На денвере например поднять хост img и в коде писать <img src='http://img/200x300' />

@printf 10 авг 2010 в 07:44

@stansult 10 авг 2010 в 08:19

странно, как у вас кириллица вышла?
когда я ваши символы копирую — выходит
новые пишу — не выходит…

а, или это не «Ё», а латинское Ë? :)

@spmbt 10 авг 2010 в 08:29

(Дубль для ссылки: ) Да, dummyimage.com поддерживает кириллицу, а этот — нет
Ещё они оба одинаково не поддерживают перенос строки: %0D работает, а %0A нет (вообще обрезает строку).

@sa_melnikov 10 авг 2010 в 08:00

Идея очень интересная

@AVR 10 авг 2010 в 09:52

плейсхолдер = местоблюститель

@xn__p2a 10 авг 2010 в 11:59

Мицгол?

@soider 10 авг 2010 в 19:07

Местозасталбливатель

@stansult 10 авг 2010 в 19:15

особенно хорошо звукосочетание "лбл" :)

@stansult 10 авг 2010 в 19:04

для прикола — ничё так :)
но для статьи — я б не рискнул

@asolntsev 10 авг 2010 в 19:14

Классно!
А всё-таки было бы неплохо, если вы упомянули в статье, зачем это надо.

@stansult 10 авг 2010 в 19:18

я там упомянул

Может пригодиться для html-верстки

подробнее, думаю, излишне — исходя хотя бы из «количества пользователей, добавивших пост в избранное» :)

@asolntsev 10 авг 2010 в 19:23

Я не ставлю под сомнение, что это полезно при html-вёрстке.
Просто я, видимо, далёк от этой темы, поэтому не совсем понимаю, как это будет применяться. Чувствую, что полезно, но как конкретно — …

Ну ладно, из-за меня одного не надо напрягаться :)

@stansult 10 авг 2010 в 19:24

я добавлю пару строчек
если у кого есть идеи — пишите, ещё добавим

@stansult 10 авг 2010 в 19:34

добавил

@Shugich 10 авг 2010 в 20:31

Не люблю подобные заглушки…

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

А так сервис очень даже удобный.

@stansult 10 авг 2010 в 21:28

я думаю, что это больше для себя, пока верстаешь

@Shugich 10 авг 2010 в 21:42

По сути да (хотя я даже для себя не использую такое)… Был бы я ленив, то пользовался бы с удовольствием.

@bolnikh 12 авг 2010 в 08:48

Сделал аналог dummyimage у себя на хостинге — dummyimage.ru

пробуйте, критика приветствуется.

Пока просто генерация, без кеширования результатов

@stansult 12 авг 2010 в 18:20

отлично работает имхо

jpg явно отличается, ещё более размытый текст, чем у dummyimage.com :)
мне кажется, это хорошо, чтоб на вид отличалось

Зарегистрируйтесь на Хабре, чтобы оставить комментарий