Хабр Курсы для всех
РЕКЛАМА
Практикум, Хекслет, SkyPro, авторские курсы — собрали всех и попросили скидки. Осталось выбрать!
Хабр доступен 24/7 благодаря поддержке друзей
Комментарии 32
Идеальный дизайн с «идиальным» заголовком быть не может, подправьте пожалуйста… )
Я так понял вас интересует имеено дизайн, а не движок галереи. Сам стою перед такой же проблемой — не могу найти решение организовывать на одном листе вертикальные и горизонтальные превьюшки. Пока вижу 3 варианта:
1. выравнивание по высоте и центрирование по ячейке, тогда пригают пробелы между картинками
2. выравнивание по ширине — но тогда сложно с подписями к превьюшкам
3. «кропить» до квадрата, идеальный вариант в том случае, если кропить каждую фотографию вручную.
Какие изменения я вижу на вашей странице:
1. Отцентрировать по ширине превьюшки.
2. Облегчить информацию под превьюшками, наверное убрать слова «просмотров», «комментариев», а обозначить их иконками. Убрать секунды во времени — достаточно минут. И что-то сделать с этими дикими именами файлов :) Может совсем их убрать?
1. выравнивание по высоте и центрирование по ячейке, тогда пригают пробелы между картинками
2. выравнивание по ширине — но тогда сложно с подписями к превьюшкам
3. «кропить» до квадрата, идеальный вариант в том случае, если кропить каждую фотографию вручную.
Какие изменения я вижу на вашей странице:
1. Отцентрировать по ширине превьюшки.
2. Облегчить информацию под превьюшками, наверное убрать слова «просмотров», «комментариев», а обозначить их иконками. Убрать секунды во времени — достаточно минут. И что-то сделать с этими дикими именами файлов :) Может совсем их убрать?
> 1. выравнивание по высоте и центрирование по ячейке, тогда пригают пробелы между картинками
подложите по картинку лёгкий серый фон или какой вам нужен, пробелы будут ровными
подложите по картинку лёгкий серый фон или какой вам нужен, пробелы будут ровными
Да, интересует именно дизайн фотогалереи, компоновка правильная, фрагменты, с програмингом проблем нет.
Про саму картинку нашел сегодня еще один вариант есть квадрат, допустим 150х150 с рамкой тоненькой, внутри которых уже будет сами фотки, которые не превышают, например, 135х135. Таким образом и фотки будут не урезаные и верстка ровненькая.
По поводу нашей страницы, согласен, кучу лишней инфы, надо будет убирать.
Думаю над блоками фотогалереи. Видимо пора вводить разделы, а то ничего не найти. С разделами будет удобней.
Сейчас у нас есть отдельно последние добавленные фотографии, последние альбомы, топ фотографов, топ пользователей. Топы интересны, но думаю их стоит спрятать внутрь. И, наверное, убрать последние альбомы, лучше оставить только последние фотки. А альбомы уже пусть будут внутри в разделах, которые надо будет ввести.
Про саму картинку нашел сегодня еще один вариант есть квадрат, допустим 150х150 с рамкой тоненькой, внутри которых уже будет сами фотки, которые не превышают, например, 135х135. Таким образом и фотки будут не урезаные и верстка ровненькая.
По поводу нашей страницы, согласен, кучу лишней инфы, надо будет убирать.
Думаю над блоками фотогалереи. Видимо пора вводить разделы, а то ничего не найти. С разделами будет удобней.
Сейчас у нас есть отдельно последние добавленные фотографии, последние альбомы, топ фотографов, топ пользователей. Топы интересны, но думаю их стоит спрятать внутрь. И, наверное, убрать последние альбомы, лучше оставить только последние фотки. А альбомы уже пусть будут внутри в разделах, которые надо будет ввести.
Ужасно раздражают кропнутые в квадрат ровненькие миниатюры. Фотографии получаются ущербными, неинтересными, разумеется, кроме тех, которые сам автор сделал квадратными. Люди обрезаны, дома обрезаны, все какое-то неестественное. На фотомоушен так сделано. Смотреть их галерею просто не могу, хотя там есть отличные «редкие» авторы, фотографии которых больше нигде не посмотришь, так заботливо отсортированные по альбомам и тэгам.
По опыту моей фотогралереи скажу, что очень важно дать возможность посетителям рассмотреть панорамные кадры (очень широкие), что не всегда удается сделать из-за их большого объема, скролла и т.д. И также оптимальный вариант для полноэкранного просмотра — не менее 1024х768 пикс.
По опыту моей фотогралереи скажу, что очень важно дать возможность посетителям рассмотреть панорамные кадры (очень широкие), что не всегда удается сделать из-за их большого объема, скролла и т.д. И также оптимальный вариант для полноэкранного просмотра — не менее 1024х768 пикс.
На мне тоже сейчас галерея висит, как в плане движка, так и в плане дизайна…
Тут не может быть единственного ответа, все зависит от тематики, типа сайта, количества фотографий/разделов, размера фотографий, информации которая предлагается вместе с этими фотками… я бы еще мог написать, но хочу сходить перекурить, поэтому остановлюсь :)))
Тут не может быть единственного ответа, все зависит от тематики, типа сайта, количества фотографий/разделов, размера фотографий, информации которая предлагается вместе с этими фотками… я бы еще мог написать, но хочу сходить перекурить, поэтому остановлюсь :)))
Как перекурите, отписывайтесь :) Очень интересно.
А вам для какого типа сайта галерея нужна?
А вам для какого типа сайта галерея нужна?
Ааа… ну раз интересно, тогда поясню :))
Мне на самом деле для схожей тематики, для фотографа делаю, т.е. ключевой момент тоже свадьбы. А т.к. фотограф видный, то нужно тоже что-нибудь качественное, с функцией администривания, хотя бы минимальной. Для меня програмная часть сейчас более остро стоит, чем проблема дизайна. Дизайн это легко, а вот сделать так, чтобы просмотр этих фоток и перемещение между разделами были быстрые, интуитивно понятные и ненавязчивые, — намного сложнее. Сначала я рассматривал варианты flash галереи, т.к. я с флешем очень неплохо дружу, но сейчас решил отказаться от него… сейчас хотел объяснить почему я отказался, думал минут 5, но так ничего и не вспомнил… надо снова сесть, прикинуть, переосмысмлить… значит ушел я от флеша, и пришел к jquery. Сейчас в небольшом ступоре нахожусь, надо бы вернуться к усиленному решению этого вопроса :)))
Да, и прекрати обращаться ко мне на Вы)))
Мне на самом деле для схожей тематики, для фотографа делаю, т.е. ключевой момент тоже свадьбы. А т.к. фотограф видный, то нужно тоже что-нибудь качественное, с функцией администривания, хотя бы минимальной. Для меня програмная часть сейчас более остро стоит, чем проблема дизайна. Дизайн это легко, а вот сделать так, чтобы просмотр этих фоток и перемещение между разделами были быстрые, интуитивно понятные и ненавязчивые, — намного сложнее. Сначала я рассматривал варианты flash галереи, т.к. я с флешем очень неплохо дружу, но сейчас решил отказаться от него… сейчас хотел объяснить почему я отказался, думал минут 5, но так ничего и не вспомнил… надо снова сесть, прикинуть, переосмысмлить… значит ушел я от флеша, и пришел к jquery. Сейчас в небольшом ступоре нахожусь, надо бы вернуться к усиленному решению этого вопроса :)))
Да, и прекрати обращаться ко мне на Вы)))
Мне вот такая нравится:
popcornnews.ru/artist/9112/photo#img16189
popcornnews.ru/artist/9112/photo#img16189
Это уже как внутри организовать. Как будет внутри я представляю (не так как у нас сейчас — «внутренности» мы возьмем с другого нашего проекта, если интересно могу показать). Мне больше интересует как организовать главную страницу галереи, а внутри — чтобы уже переносилась навигация галереи главной страницы.
Посмотрите, как замечательно! phototalks.net/cms.jpg
Проскакивало в этом топике habrahabr.ru/blogs/i_am_advertising/46566/
Проскакивало в этом топике habrahabr.ru/blogs/i_am_advertising/46566/
Земляк, у вас просто масса лишнего. Если убрать — сразу станет круто.
Главное — фотографии, занимают меньше половины площади. Не меньше занимают подписи, на мой взгляд, лишние. Получается унылая батарея и дырки около вертикальных фоток — отстой. Может, стоит поиграть с пользователем, и показывать информацию прямо на фотке, при наведении? Это спасёт нас от батареи надписей, которые подавляющее большинство посетителей не очень интересуют (вспомните про пользовательские сценарии).
Не стоит показывать названия файлов вообще нигде (11032909212639.jpg или 00032909212429.jpg — ну зачем мне это знать?).
У вас совершенно правильно и круто фотки выравниваются по высоте. Но, пожалуйста, пожалуйста, уберите разрядку в текстах! :-)
Получится чище и опрятнее, что-то в духе этой черновой картинки:
Главное — фотографии, занимают меньше половины площади. Не меньше занимают подписи, на мой взгляд, лишние. Получается унылая батарея и дырки около вертикальных фоток — отстой. Может, стоит поиграть с пользователем, и показывать информацию прямо на фотке, при наведении? Это спасёт нас от батареи надписей, которые подавляющее большинство посетителей не очень интересуют (вспомните про пользовательские сценарии).
Не стоит показывать названия файлов вообще нигде (11032909212639.jpg или 00032909212429.jpg — ну зачем мне это знать?).
У вас совершенно правильно и круто фотки выравниваются по высоте. Но, пожалуйста, пожалуйста, уберите разрядку в текстах! :-)
Получится чище и опрятнее, что-то в духе этой черновой картинки:
Так аккуратненько, согласен, но некоторые фотографии совсем теряются из виду. Например девушку в очках я замечаю сразу, а предпоследнюю во втором ряду и самую первую не видно. Я как фотограф (в свободное время) когда демонстрирую фотографии хочу, что-бы на каждую из них обратили внимание!
При таком раскладе фотографии ланшафтной ориентации оказываются в более выгодном свете, чем портретные.
При таком раскладе фотографии ланшафтной ориентации оказываются в более выгодном свете, чем портретные.
Дмитрий, вы, безусловно, правы, но, боже, сколько тут запятых! :-) мне это кажется меньшей из зол. Представьте, если мы станем насильно кропить фотки до квадрата — какой получится хотя бы первая во втором ряду? Выход — в том чтобы сделать все фотки больше чем у меня. На интересную фотку посетитель всё равно кликнет, чтобы всё рассмотреть.
Нет, до квадрата не нужно конечно! Я свой фотоальбом делаю (переделываю, зачеркиваю и снова переделываю) уже месяца 3. Я понимаю, что на чем-то надо остановиться. Есть вариант как на фото.сайте — фотографии любого формата и ориентации, но каждая заключена в прямоугольную (квадратную) ячейку. С одной стороны ритмичность не «давит», а с другой — всё ровненько и отдельные фотографии не получаются «зажатыми».
Кстати а по какому принципу вывешивают фотографии в реальных галереях, а не виртуальных?
Кстати а по какому принципу вывешивают фотографии в реальных галереях, а не виртуальных?
Спасибо за комментарий, земляк :)
Я тоже думаю, что в первую очередь надо выделить самое главное — сами фотографии. В плане убрать лишнюю информацию, а так же то, как можно сделать по вашему примеру — здорово. Чистенько так получилось.
Фотографии я думаю только в рамки засунуть, пусть будут фотографии разного размера, рамки главное будут одни и те же, из-за этого будет чистенько выглядеть.
Мысль сейчас — нужно ли И последние фотографии И последние альбомы или нет на главной странице фотогалереи. И второе — нужно ли разделять на главной странице галереи фотографии фотографов и обычных пользователей. И если да, то как… вот это пока в голову никак не идет.
Я тоже думаю, что в первую очередь надо выделить самое главное — сами фотографии. В плане убрать лишнюю информацию, а так же то, как можно сделать по вашему примеру — здорово. Чистенько так получилось.
Фотографии я думаю только в рамки засунуть, пусть будут фотографии разного размера, рамки главное будут одни и те же, из-за этого будет чистенько выглядеть.
Мысль сейчас — нужно ли И последние фотографии И последние альбомы или нет на главной странице фотогалереи. И второе — нужно ли разделять на главной странице галереи фотографии фотографов и обычных пользователей. И если да, то как… вот это пока в голову никак не идет.
А что такое «Последние альбомы»? Последние обновлённые или последние созданные? И зачем их вообще показывать, если я и так захожу, и вижу какие-то клёвые фотки? Не бывает же у пользователя обычно такого желания — посмотреть на новые альбомы. Он просто хочет увидеть, кто там что нафоткал (обычные и профессиональные работы — в общей ленте, как мне видится).
Кстати, мы с вами закончили одну школу.
Кстати, мы с вами закончили одну школу.
Осторожней с рамками. Бессмысленные рамки — бич интернета. Когда одну кнопочку окружает пять рамочек и плашечек — это ужасно.
Так и с фотками. Фотка уже сама по себе ограничивается на белом, так как чаще она темнее фона, незачем ей рамка. Разве что сеееееренькая =)
Так и с фотками. Фотка уже сама по себе ограничивается на белом, так как чаще она темнее фона, незачем ей рамка. Разве что сеееееренькая =)
ты уверен что на деле все фотки расположутся именно вот так вот красивенько?
А что бы вы сделали с получившимися белыми канавами? Они же аж вибрируют между фотками, глаза видят в первую очередь не фотки, а эти узоры, которые образует пустое пространство между фотками.
А представьте, если фоток будет много строк и столбцов? Останется только этот забор, который будет вибрировать при переводе взгляда с фотки на фотку, на фотографиях-то и не сосредоточится!=)
А представьте, если фоток будет много строк и столбцов? Останется только этот забор, который будет вибрировать при переводе взгляда с фотки на фотку, на фотографиях-то и не сосредоточится!=)
Много конструктивного сказано в комментах, повторяться не хочется. Я лишь позволю себе напомнить Вам о сайте flickr.com. Я б обратил внимение на нюансы реализации юзабилити на нем… Я конечно не говорю про содрать все и готово, но там можно позаимствовать, когда и что нужно отображать, а что можно отобразить в каких-то дополнительных (читать как незначительных) блочках, а что-то может вообще не отображать, потому как заинтересует 2% посетителей только.
Естественно в данном случае Само Фото стоит на первом месте, следовательно нужно сделать на нем же и акцент. Название, дата создание и всякая другая инфа должна уйти на второй план.
Естественно в данном случае Само Фото стоит на первом месте, следовательно нужно сделать на нем же и акцент. Название, дата создание и всякая другая инфа должна уйти на второй план.
А я бы о Cooliris напомнил. Можно выцепить идейки из этого красивейшего движка.
Милые галереи иногда получаются при использовании js, например benjaminsterling.com/jquery-jqgalviewii-photo-gallery/
Еще, мне кажется, всю дополнительную информацию, навроде количества просмотров, комментариев, даты добавления (обычно, вообще менее всего интересует людей), лучше прятать и показывать, скажем, при наведении на превьюшку
Еще, мне кажется, всю дополнительную информацию, навроде количества просмотров, комментариев, даты добавления (обычно, вообще менее всего интересует людей), лучше прятать и показывать, скажем, при наведении на превьюшку
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Дизайн фотогалереи