Хабр Курсы для всех
РЕКЛАМА
Практикум, Хекслет, SkyPro, авторские курсы — собрали всех и попросили скидки. Осталось выбрать!
Хабр доступен 24/7 благодаря поддержке друзей
Комментарии 80
Хм, не проще ли по-умолчанию создавать из пользовательского изображения preview-изображение, при нажатии на которое можно посмотреть оригинальное изображение которое при чем можно выдавать тоже не в чистом виде, а через скрипт, чтобы и его отмасштабировать, хмм собственно и первоначальное изображение можно выдавать через скрипт.
При необходимости могу поискать и примеры применения подобных методов, хотя в гугле и так их предостаточно.
При необходимости могу поискать и примеры применения подобных методов, хотя в гугле и так их предостаточно.
UPD А масштабировать средствами браузера - не благодарное занятие, алгоритмы у них оставляют желать лучшего хотя и постепенно развиваются, но при этом файл всеравно ведь грузится оригинальный (бооольшой).
Угу, но это так сказать защита от дурака, который не хочет читать правила или не хочет им следовать... По умолчанию подразумевается, что юзвери будут хорошо себя вести и вставлять люстры не более 500px по ширине. Я наивен? :)
Вы очень наивны, пользователь по-умолчанию имеет в руке гранату, куда он ее кинет он даже сам не знает.
Так, что подобные ситуации нужно пресекать технически на стороне сервера(CMS например)-кратко
Сам счас как раз оч активно этим занимаюсь правда масштаб у меня несколько кх, веселей, на проекте 23 000++ компаний и у каждой свои тараканы.
Так, что подобные ситуации нужно пресекать технически на стороне сервера(CMS например)-кратко
Сам счас как раз оч активно этим занимаюсь правда масштаб у меня несколько кх, веселей, на проекте 23 000++ компаний и у каждой свои тараканы.
Не очень корректный пример, но всё же вот » http://drupal.ru/ Никакой защиты от громадного изображения из веба не стоит, сегодня тестил в надежде узреть решение. Конечно надо делать скидку на то, что там большой % думающих людей... да и тематика обязывает.
> алгоритмы у них оставляют желать лучшего
Говорите за свой браузер :)
Говорите за свой браузер :)
Говорю за свои браузеры opera 9.5, ff2.15-3rc3 - хоть убей с photoshop не сравнить :)
Вы видете на глаз разницу между билинейным сглаживанием и бикубическим без лупы? Вы наверное из тех, кто слышит разницу между mp3 320kbps и CD-записью :)
В первую очередь я вижу разницу между обработанным вручную изображением и отскалированным автоматически.
ЗЫ например рекомендуется для лучшего результата скалировать поэтапно, а не сразу от размера А к размеру Б приводить особенно если между ними большая разница.
ЗЫ например рекомендуется для лучшего результата скалировать поэтапно, а не сразу от размера А к размеру Б приводить особенно если между ними большая разница.
Вас обманули.
О боже! Кто это сделал? А почему есть очевидная разница??
Потому что вам хочется в это верить. Или пример в студию.
Кстати, я сказал что разницы не будет? Я сказал что не будет лучшего результата (будет хуже или сравнимый). Чтобы это понять, достаточно представлять как работают алгоритмы интерполяции.
Кстати, я сказал что разницы не будет? Я сказал что не будет лучшего результата (будет хуже или сравнимый). Чтобы это понять, достаточно представлять как работают алгоритмы интерполяции.
Исходная: http://www.wallpaperez.net/wallpaper/car…
Photoshop vs Mozilla: http://www.picamatic.com/show/2008/06/17…
Photoshop vs Mozilla: http://www.picamatic.com/show/2008/06/17…
Не плохой пример, только еще хорошо бы версию FF привести, так как у них от версии к версии алгоритмы и методы манипуляций с изображениями не стоят на месте.
И вы говорите что разницы нет или что будет хуже или сравнимо если делать вручную???
Взгляните на приведенный вами пример.
ЗЫ особенно на контрастные переходы
Взгляните на приведенный вами пример.
ЗЫ особенно на контрастные переходы
Вы совсем чукча?
Я не говорил, блин, что делая вручную будет хуже или сравнимо, я сказал что при последовательном уменьшении несколько раз будет не лучше, чем при одном уменьшении. Читай, читайте, думайте, и только потом пишите.
Я не говорил, блин, что делая вручную будет хуже или сравнимо, я сказал что при последовательном уменьшении несколько раз будет не лучше, чем при одном уменьшении. Читай, читайте, думайте, и только потом пишите.
Контрастные переходы — это и есть разница между билинейной и бикубической интерполяцией. Меня такая интерполяция для обычной пользовательской иллюстрации в сообщении, не влезшей в 500px дизайна, вполе устраивает.
Приведите пример что именно вы хотели бы видеть, так сказать условия эксперимента.
И вспомните собстно с чего началось- ...я вижу разницу между обработанным вручную изображением и отскалированным автоматически...
Этапы ручного скалирования если есть желания получить хороший результат и есть немного времени:
1.Уменьшение изображения в несколько шагов, в среднем 2-3 выходит (в зависимости от изображения желательно выбрать режим при скалировании)
2.Яркость +5-10%
3.Шарпен - по желанию
4.*альтернатива 3шагу - ручная отрисовка(контурная(?)) некоторых деталей
-это все относилось к Photoshop
-кратко.
И вспомните собстно с чего началось- ...я вижу разницу между обработанным вручную изображением и отскалированным автоматически...
Этапы ручного скалирования если есть желания получить хороший результат и есть немного времени:
1.Уменьшение изображения в несколько шагов, в среднем 2-3 выходит (в зависимости от изображения желательно выбрать режим при скалировании)
2.Яркость +5-10%
3.Шарпен - по желанию
4.*альтернатива 3шагу - ручная отрисовка(контурная(?)) некоторых деталей
-это все относилось к Photoshop
-кратко.
Как ни странно, я тоже «вижу разницу между обработанным вручную изображением и отскалированным автоматически». А началось с того, что вы сказали что вы сказали «алгоритмы масштабирования у браузеров оставляют желать лучшего». Яркость +5-10%, шарпен - по желанию, это что — алгоритм масштабирования?
Учитесь отличать теплое от мягкого.
Учитесь отличать теплое от мягкого.
вы отвечали на мой пост в котром я писал - "В первую очередь я вижу разницу между обработанным вручную изображением и отскалированным автоматически." - что - "Вас обманули." - так?
и далее по тексту вашего сообщения: "это что — алгоритм масштабирования"
Скалирую по шагам мы можем изменять алгоритм масштабирования на каждом из них при желании - таким образом добиваясь наиболее подходящего результата, как минимум таким образом мы можем улучшить результат по сравнению с со скалированием в один шаг.
и далее по тексту вашего сообщения: "это что — алгоритм масштабирования"
Скалирую по шагам мы можем изменять алгоритм масштабирования на каждом из них при желании - таким образом добиваясь наиболее подходящего результата, как минимум таким образом мы можем улучшить результат по сравнению с со скалированием в один шаг.
UPD Гдето на хабре, при желании воспользуйтесь поиском, была статья про методы работы с изображениями в разных браузерах, если мне не изменяет память сравнивались Safari FF IE
Смешно. Вы сами-то пробовали? Попробуйте, наконец, разница очевидна любому человеку, имеющему глаза :) и она не в пользу браузеров.
Кстати, разницу между мп3 любой степени сжатия и цд услышать легко - ухо довольно чувствительно к фазовым искажениям. Вы просто не обращаете на неё внимание. Вон, японцы на слух "р" и "л" не различают, хотя для нас разница более чем очевидна. Этот тот же самый случай.
Кстати, разницу между мп3 любой степени сжатия и цд услышать легко - ухо довольно чувствительно к фазовым искажениям. Вы просто не обращаете на неё внимание. Вон, японцы на слух "р" и "л" не различают, хотя для нас разница более чем очевидна. Этот тот же самый случай.
> Кстати, разницу между мп3 любой степени сжатия и цд услышать легко
Я со сверхчеловеками спорить не буду :)
Я со сверхчеловеками спорить не буду :)
Повторяю, если вы не поняли. Для 99% японцев любой человек, слышащий разницу между "р" и "л" является сверхчеловеком. Но мы то с вами прекрасно эту разницу слышим. С мп3 ровно то же самое. Разница там хорошо слышима тем, кто понял в чём она заключается :).
> Смешно. Вы сами-то пробовали? Попробуйте, наконец, разница очевидна любому человеку, имеющему глаза.
Попробовал, пример привел выше. Разница действительно очевидна, она в применении алгоритма, биилнейного против бикубического. Для данного топика, более быстрой биилнейной интерполяции хватает с головой.
Попробовал, пример привел выше. Разница действительно очевидна, она в применении алгоритма, биилнейного против бикубического. Для данного топика, более быстрой биилнейной интерполяции хватает с головой.
Что бы создать превью его надо где то хранить, а задача как раз избежать этого. Или возможно я вас как то не так понял. За примеры из гугла буду благодарен.
Ну собственно нашел не плохой скритец правда он в составе cms, но в полне самостоятелен и не плохо написан чтобы было не сложно разобраться. Скачайте typolight(можно не инсталить просто выложите на сервак) и там найдите image.php который собственно и выполняет в реальном времени операции над изображениями (по-умолчанию в целях безопасности системы изображения загружайте в директорию tl_files). Форма обращения к файлам например такая src="image.php?src=tl_files/1144.jpg&height=100&width=400" вобщем там не сложно разобраться.
Во-первых, мучать пользователя загрузкой многомегабайтной (возможно) картинки, чтоб потом ее ужать браузером до 500пх с помощью max-width - издевательство.
Во-вторых, превью - это хорошо, но учтите, что ресайз картинки 2500х2500 до 500х500 способен вполне реально повесить процессор.
Вот так-то. Ищите золотую середину.
Во-вторых, превью - это хорошо, но учтите, что ресайз картинки 2500х2500 до 500х500 способен вполне реально повесить процессор.
Вот так-то. Ищите золотую середину.
Поддерживаю, можно например проверять изображение по ссылки при отправлении сообщения/др. материала содержащего его на сервер на соответствия максимальному размеру файла и тд.
ищу :)
Определяем размер картинки, если приличный - ресайзим, если нет - шлём нафиг. Всё элементарно, в том числе и реализация. Золотой середины здесь нет, если правильный и неправильный способы.
Захватить мир очень легко... достаточно своять ядерного оружия, да побольше и укрыться в надежном месте...вопщем всё просто.
Я прекрасно понимаю алгоритм, я знаю как это должно быть в идеале, но я не знаю как это реализовать, а если б знал не спрашивал бы об этом в посте.
Я прекрасно понимаю алгоритм, я знаю как это должно быть в идеале, но я не знаю как это реализовать, а если б знал не спрашивал бы об этом в посте.
То есть, вам нужно готовое решение, которое можно будет скопипастить в свой проект?
Ох... Вы знаете, что такое drupal? Знаете какое количество модулей под него написано? И не поверите иногда среди них находиться именно то,что нужно, что долго искал или собирался делать сам, так вот сообщество друпалеров вполне может помочь в таком поиске, либо просто задать вектор как Kaaboeld...
Зачем писать пустые комменты о том что белое это белое, а черное это черное?
Зачем писать пустые комменты о том что белое это белое, а черное это черное?
Повесить кстати не должен - не такой уж большой размер. Я ~3000 картинок таких как то batch-ресайзил - вот там да, весь сервер прочувствовал. Если по одной - не думаю что будут особые эффекты.
overflow:hidden?
У меня есть сайт. И я хотел выровнять текст по центру. Сначала я написал так: <font align="center">text</font>, но потом узнал что есть css и написал так: <div style="text:center">test</div>.
Вот думаю написать про это статью.
Ваш совет мне очень помог, так и сделаю.
А если по теме я бы сделал так: искал бы в тексте поста src картинок и заменял бы его на вид http://site.ru/img/?src=src где лежал бы php скрипт который проверял размеры картинки и если они неудовлетворяют, то ресайзил бы ее и сохранял на у себя (можно даже временно), ну а дальше header('location:'.$new_src); Разумеется к этому нужно было бы добавить проверку есть ли уже копия картинки на сервере любым удобным вам методом.
А причём тут вообще Drupal? :)
Сам я не совсем в теме, но чтобы уж совсем не повесить, хорошо бы сбросить expression:
div.content img { width: expression(runtimeStyle.width = this.offsetWidth < 500 ? "auto" : 500); }
Кстати не работает
упс, точней не работает под ФФ
Ну и не должен, под CC его, под CC! :)
Кто такой CC??
И кстати спасибо. И Вам и автору поста.
Подтолкнули. У меня теперь при аплоаде ресайз, а при ссылках - стилем width режется. Беее) Красотища.
И кстати спасибо. И Вам и автору поста.
Подтолкнули. У меня теперь при аплоаде ресайз, а при ссылках - стилем width режется. Беее) Красотища.
Об этом говорил автор в посте, если коротко, то это conditional comments.
imagepicker уже отменили?
модуль image для ССК тоже отменили?
для ресайза модуль imagecache канул в лету?
учите матчасть!
модуль image для ССК тоже отменили?
для ресайза модуль imagecache канул в лету?
учите матчасть!
Про imagepicker не знал, но смотря на остальное мне кажется вы не до конца прочитали условия задачи. Я не хочу грузить изображение на сервер, я хочу, что б оно оставалось на внешнем источнике.
Посмотрел imagepicker. Full html всем пользователям. ИМХО этот модуль исключительно для админов на стэнд элон сайтах. + он грузит имейдж на сервер.
Эх лишь бы в матчасть послать...
Эх лишь бы в матчасть послать...
Я, конечно, дико извиняюсь. Может, я неправильно понял условия задачи.
Но модные пацаны делают так:
Кстати, еще вот какие требования есть к модности:
Но модные пацаны делают так:
- Перед загрузкой картинки на сервер проверяем, не слишком ли большой размер файла. Вообще, эта проверка желательна, но не всегда катит — однажды делал сайт-портфолио для фотографа, так он здоровенные файлы постил. Но это, конечно же, исключение. А вообще проверять, чтобы загружаемые файлы не были больше какого-то разумного предела, необходимо. Не забываем, что тот же ненавистный php это за нас делает.
- Перед загрузкой картинки на сервер проверяем ее геометрические размеры — опять же, как и в предыдущем пункте, не всегда актуальная проверка, но в большинстве случаев — необходима.
- Здесь не очень модные пацаны тупо отправляют клиенту какую-нибудь ошибку насчет того, что он охренел.
- Нормальные пацаны (вроде меня :) дают возможность клиенту с помощью какой-нибудь js-библиотеки сделать crop изображения (т.е. выбрать область изображения, которая им действительно нужна).
- Сервер с помощью какой-нибудь ImageMagick пропорционально ресайзят картинку до какого-то условленного значения, и делают thumbnail, потому как лучше отдать статику, нежели каждый раз гонять туда/сюда полноразмерный файл, который предлагается ресайзить браузеру… Думаю, почему так, понятно и без меня.
- Сервер отдает клиенту thumbnail или там картинку, который wysiwyg с помощью document.execCommand вставляет в поле.
Кстати, еще вот какие требования есть к модности:
- Ajax и все такое.
- Никаких всплывающих окон браузера — используйте какой-нибудь thickbox.
Заботьтесь о здоровье партнера и используйте презервативы.- lightbox
>Перед загрузкой картинки на сервер проверяем
Это всё замечательно, и реализуется не очень модными паЦанами с помощью IMCE. Я же писал «...но возможности загрузки на сайт изображений нет, есть вариант только размещения иллюстраций, которые находятся в сети...»
Это всё замечательно, и реализуется не очень модными паЦанами с помощью IMCE. Я же писал «...но возможности загрузки на сайт изображений нет, есть вариант только размещения иллюстраций, которые находятся в сети...»
Грузим картинку на сервер, делаем thumbnail и она уже указывает на внешнюю картинку. Можно с lightbox. Во всяком случае, имеем все плюсы и ни одного минуса.
Это вариант навскидку. Щас еще подумаю.
Это вариант навскидку. Щас еще подумаю.
пишут пользователи тоже пусть на других сайтах, а у вас вырезки только пусть хранятся. что за хостинг такой, что невозможно 100кб картинку разместить?
терзают меня смутные сомнения, что все эти ограничения от жадности чьей-то.
терзают меня смутные сомнения, что все эти ограничения от жадности чьей-то.
У пользователей с разным рейтингом разные возможности. Допустим анонимам давать доступ к загрузке на сервер файлов как минимум не разумно.
Остальным же желательно предоставлять два варианта размещения изображений. Посмотрите как это реализованно на хабре, я могу как загрузить так и просто указать откуда показывать, к слову обратите внимание на АПдейт данного топика.
Да, и ваша ирония совсем не к месту...
Остальным же желательно предоставлять два варианта размещения изображений. Посмотрите как это реализованно на хабре, я могу как загрузить так и просто указать откуда показывать, к слову обратите внимание на АПдейт данного топика.
Да, и ваша ирония совсем не к месту...
1. Допустим анонимам давать доступ к загрузке на сервер файлов как минимум не разумно.
Полностью согласен.
2. Остальным же желательно предоставлять два варианта размещения изображений.
Вам про вариант загрузки на сервер писалось. Если Вы уверены в порядочности пользователей, то предоставьте им первый вариант.
Ирония, как раз-то, к месту. ;)
Полностью согласен.
2. Остальным же желательно предоставлять два варианта размещения изображений.
Вам про вариант загрузки на сервер писалось. Если Вы уверены в порядочности пользователей, то предоставьте им первый вариант.
Ирония, как раз-то, к месту. ;)
ну пусть тогда скрипт забирает картинку по урлу, ужимает ее и сохраняет в кеш.
в картинках, которые не просматривались больше Н дней проверяется, доступны ли они по своему внешнему урл. если да - то удаляются из кеша и выводятся способом, описанным в топике.
в картинках, которые не просматривались больше Н дней проверяется, доступны ли они по своему внешнему урл. если да - то удаляются из кеша и выводятся способом, описанным в топике.
У меня схема простая (правда, это ASP.NET, но смысл тот же) - приложение лезет по урлу картинки, в ответ читает Stream с соответствующим Content-type, создает из него картинку, уменьшает ее и выдает в виде Response. Впрочем, решение временное, не теряю надежды придумать что-нибудь более практичное.
Комментарии не читала, возможно, уже предложили, но если хотите чистый css, без обработки картинки на сервере, попробуйте overflow:scroll — самый приличный вариант, по-моему.
Если бы у меня стояла такая задача, я б, наверное, вместо придумывания хитроумных алгоритмов использовал бы немного другую схему.
1. Возьмите себе несколько аккаунтов на бесплатном или дешевом хостинге с поддержкой PHP
2. Дальше устанавливаете на них скрипт ресайза изображений. Если хотите - можете даже сохранять тумбнейлы, но обязательно с дублированием на другом сервере.
3. Чтобы вас не прикрыли - распределяйте динамически нагрузку между серверами. При достаточно грамотном подходе - нагрузки никто даже не заметит. Админы обращают внимание на скрипт только тогда, когда вы выбираетесь за топ на достаточно долгое время. Также распределение нагрузки на такой "кластер" позволит вам не бояться того, что какой-то из аккаунтов прикроют.
Извините за долгий пост,но выгружу пару картинок.
Идея на оригинальность не претендует, но можно получить хорошие мощности и обьем места.
1. Возьмите себе несколько аккаунтов на бесплатном или дешевом хостинге с поддержкой PHP
2. Дальше устанавливаете на них скрипт ресайза изображений. Если хотите - можете даже сохранять тумбнейлы, но обязательно с дублированием на другом сервере.
3. Чтобы вас не прикрыли - распределяйте динамически нагрузку между серверами. При достаточно грамотном подходе - нагрузки никто даже не заметит. Админы обращают внимание на скрипт только тогда, когда вы выбираетесь за топ на достаточно долгое время. Также распределение нагрузки на такой "кластер" позволит вам не бояться того, что какой-то из аккаунтов прикроют.
Извините за долгий пост,но выгружу пару картинок.
Идея на оригинальность не претендует, но можно получить хорошие мощности и обьем места.
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Ресайз картинок из веба или борьба с вредными пользователями…