Крутилки при загрузке картинок
Крутилки при загрузке картинок — одно из самых ужасных изобретений Веба 2.0.
Почему? Потому, что они ничему не помогают, зато всему остальному мешают.
Классическая крутилка встречалась ещё в досовских приложениях и представляла собой быстро сменяющие друг друга символы ##| / − \## . Она просто показывала, что программа не зависла. Логика была в том, что если она зависнет, она уже не сможет ничего крутить.
В современных прикладных программах, как правило, рисованием интерфейса занимается отдельный тред, поэтому крутилка может спокойно продолжать крутиться даже тогда, когда тот тред, про который она крутится, давно завис или вовсе аварийно завершился.
Есть у крутилки и другой смысл.
Вот Спотлайт показывает крутилку, пока ищет. Поскольку результаты поиска появляются ещё до того, как он заканчивается, крутилка даёт понять, что они могут дополниться. Когда крутилка погасает, это значит, что перед нами — всё, что нашлось.
Таким образом, крутилки работают тогда, когда оценить реальный прогресс с выполнением текущей задачи невозможно, либо это не имеет смысла потому, что процессу совершенно необязательно доходить до конца, чтобы принести пользу. В других случаях мы должны показывать прогрессбар (естественно, если есть способ оценить сделанную часть работы). Кроме собственно прогресса, он позволяет ещё и оценить равномерность выполнения процесса, прикинуть, сколько осталось ждать.
Учитывая, что картинка имеет вполне определённый объём и скачивается с некоторой известной и, как правило, достаточно стабильной скоростью, ясно, что прогрессбар тут намного уместнее крутилки.
Но ведь постепенно загружающаяся картинка — это и есть прогрессбар загрузки картинки! Больше ничего и не нужно.
Даже целый генератор крутилок сделали.
Крутилки — это чудесная вещь. Я просто привёл пример ошибочного их применения.
А если картинка в JPEG Progressive? Тогда она будет постепенно детализироваться, что уже не есть явный прогрессбар.
И тем не менее.
Кстати, я обычно поэтому и не использую такой джипег.
Более того, если крутилка показывается *вместо* загружаемой картинки, а не *поверх* нее, ситуация становится еще хуже. Во-первых, пользователь лишается возможности оценить, хочет ли он продолжать загрузку (поскольку часто уже взгляда на фрагмент изображения достаточно для того, чтобы прервать процесс). Во-вторых, предположим, что канал медленный или нестабильный: тогда пользователь, не знающий о реальном состоянии дел, имеет все шансы не дождаться загрузки, скажем, последних 10% файла, что очень обидно.
Если же показывать крутилку поверх (или, наоборот, фоном), она *в некоторых случаях* имеет смысл. Например, если по внешнему виду обслуживаемого крутилкой изображения нельзя определить, полностью ли оно загрузилось.
Собственно, я как раз и говорил о крутилках, которые показываются вместо.
Крутилка, показывающаяся поверх, не так сильно мешает, но она по-прежнему бессмысленна: о том, загрузилось ли изображение или ещё нет, нам подскажет интерфейс браузера.
Илья, про интерфейс браузера я согласен. Но с маленькой оговоркой: не все браузеры имеют хороший интерфейс. Если, например, браузер просто выводит в некоторую статусную строку техническую информацию вида «Загружается изображение http://www.example.com/picture.jpg», большинство пользователей ничего не поймет. Игнорировать «неудачников» или пытаться им помочь — это в каждом конкретном случае индивидуальное решение разработчика.
Или, например, роутер режет рекламу, блокируя доступ к определенным доменам. Все элементы страницы, которые могут быть загружены, уже на месте, а крутилка браузера еще долго не останавливается — пока браузер по таймауту не прекратит загрузку того, что ему все равно не дадут.
Прогрессивный джипег при некоторых условиях весит ощутимо меньше.
Вообще непонятно, зачем нужно отображать процесс загрузки картинки. Кого может интересовать, насколько загрузилась картинка? Обычно важно только загрузилась она или нет, но это и без индикаторов прекрасно видно. Естственно мегабайтная картинка для пользователя с диалапом — это отдельный случай.
Но иногда заказчик хочет, чтобы тут крутилось, здесь мигало, а потом блестки и пш-ш-ш-ш... И это основное, что он проверяет при сдаче заказа.
!!Крутилки — это чудесная вещь. Я просто привёл пример ошибочного их применения.!!
Сорри, в спешке я невольно придал комментарию негативный оттенок.
Конечно да, асинхронный индикатор, как и многие другие элементы интерфейса, следует использовать со осознанием его назначения.
согласен, но не могу и припомнить сайтов с такими крутилками.
А что делать в тех случаях, когда процент уже загруженного мы не знаем, частично картинку показывать не желаем по тем или иным причинам?
Крутилка — это всего лишь красивый аналог песочных часов Windows. «Мы в процессе обработки команды, ждите».
Назовите «те или иные причины».
По каким причинам не показывают незаконченные работы? Неохота смазывать впечатление от кадра при его частичной загрузке, к примеру.
!!Назовите «те или иные причины»!!
Несколько раз видел какртинки-шутки, юмор которых основан на том, что пользователю в первую очередь бросается в глаза. При частичном отображении эффект теряется.
Но ведь совершенно нормально вообще не показывать процент загруженности, если изображение не слишком большое.
В случае с картинкой-шуткой это решает вполне понятную задачу.
Но такую хрень обычно любят лепить на всякие скриншоты, которые картинками-шутками назвать довольно трудно.
Насчет частого неуместного использования «такой хрени» остается только согласиться.
Поддержу. Кстати, лично мне импонирует круговой индикатор загрузки в Chrome (pie diagram) — аккуратно, наглядно и много места не занимает.
Неделю назад в проекте как раз задумывался какой индикатор использовать, остановился на циклической крутилке без дополнительной индикации: время загрузки информации с сервера чаще всего будет небольшим (30-40 Кб), а вот ожидание отклика от сервера (произвольного) — вещи слабо предсказуемая.
Хромовская крутилка вообще обалденная. Она сначала крутится назад медленно, когда соединения ждёт, а потом, когда уже качает страницу, начинает крутиться вперёд быстро. Вкуснятина.
!!Она сначала крутится назад медленно, когда соединения ждёт, а потом, когда уже качает страницу, начинает крутиться вперёд быстро.!!
Озвучить этот процесс можно так: «Э-э-э... о, поехали, поехали, грузим, грузим!»