Home
Greetings guest! members can rogu in here.
(hide this)

Lightbox

 
Lightbox
Thanks for the feedback on userbility - its been most helpful so far.
The next thing I need your feedback on is the way the gallery images are displayed.

For example, lets say you are on yesterdays NitroPlus article and click on the first image to enlarge it. You are then taken away to the gallery slide. After browsing through the photos for a while, its difficult to find the original post.

I was thinking of using a lightbox and you can see on in action at the Chaos Head page - click on an image and the screen fill fade with an image in the middle of the screen. I was thinking of having a description below the photo and a "next", "previous" thumbnails at the bottom of the image. This means that the original article is still behind when you close the photos.

Do you have any other ideas of how I should be displaying the images?
Theres also the gallery for each category like this - where should this go?

I notice a lot of bloggers bunch a group of thumbnails at the end of a post sometimes - is this good or bad?
Posted on 2008/03/26 09:14
Danny Choo in Tokyo
Director/代表取締役
Registered on 2006/12/11 11:06
chun in home feeling sleepy LOL
part time illustrationist, doll clothing seamstress
Registered on 2007/01/09 14:33
I noticed this for some sites I go to (example http://pupe.jp/)

Where after U upload pix, they usually show a smaller version, when you click on it the images are displayed like how chao head's images does, click on the image to close the window. I personally don't mind it and wish my website does it!
(ID #161616) Posted on 2008/03/26 09:23
sulk in Toronto, Canada
Director/Technical Director, Cameraman
Registered on 2007/04/02 13:04
I've always liked the lightbox function when viewing pictures. The only thing i think is a bit annoying is if it blocks out hte text on the page too much (ie too dark)
And if you had next/previous buttons that would be really useful too.
And maybe at the bottom you could have smaller thumbnails with all of the pictures, or a link to the archive of the pictures for that article. Just so people can see all of the pictures in one set.
(ID #161617) Posted on 2008/03/26 09:25
D_Blade in Montreal
Non-profit org. volunteering work addict
Registered on 2006/12/31 22:48
Hmmm, what I have seen so far about images on a site is that:

- Pictures in galleries grouped without any explanation makes people lose the main point;
- Pictures in galleries with summary for each picture makes the thing clogged after a while;
- The use of flash for images (whether with or without a next, previous or pause/stop button) is unfair for low-speed connections... But even for broadband ones, the loading time for one single image can be atrocious;
- Flash for images can be a better protection against theft;
- Putting a stack of images at the end or another point of the post is horrible... I'd prefer them to be spread out.

I feel that you already have the best solution available, meaning images that one click on, with information balloons and that can be viewed in separate tabs/windows.
Why not putting a very brief description for each in balloons?
Well, then, that is all I could say on it... Hope it's helpful!
(ID #161618) Posted on 2008/03/26 09:26
Tempest in Germany
Student
Registered on 2007/11/07 06:56
I agree. I like the way it is right now.
(ID #161654) Posted on 2008/03/26 10:04
D_Blade in Montreal
Non-profit org. volunteering work addict
Registered on 2006/12/31 22:48
I meant Java, not Flash (thanks Ed, for indirectly correcting me).
(ID #161663) Posted on 2008/03/26 10:12
Edward in Michigan U.S.A.
Troubleshooter, Universal Exports
Registered on 2006/12/24 12:02
^o^ javascript...  Sorry couldn't resist D_Blade. 
(ID #161669) Posted on 2008/03/26 10:20
D_Blade in Montreal
Non-profit org. volunteering work addict
Registered on 2006/12/31 22:48
I'm such a neophyte regarding that kind of stuff... *laughs*
(ID #161674) Posted on 2008/03/26 10:24
Benjamin Takeyo in Lieu de la batille decisive
ひきこもり/Hikikomori. Suits my current state more than a 大学生/University Student. ^^
Registered on 2007/12/04 23:16
About viewing the images on a separate tab/window, usually users have to right-click on the image to get the options, so here's what I think, why not give the options when they left-click on the image, like the options given whenever the front page article images are clicked?

But keep the options limited to a small number, too many might confuse the readers. ^^

(ID #161713) Posted on 2008/03/26 12:22
D_Blade in Montreal
Non-profit org. volunteering work addict
Registered on 2006/12/31 22:48
More options for the win!!
It will then become a "choose your destiny" quest or a "you are the hero" book. 
Jesting again.
No really, I love the idea of customization (to cater to virtually every taste)... This said, default options please me much already.
(ID #161769) Posted on 2008/03/26 15:36
little-hollow in Christchurch, New Zealand
Registered on 2007/11/30 04:37
in firefox ya can open hyperlink in new tab by clicking the middle mouse button
(ID #162228) Posted on 2008/03/27 12:05
ornehx in Penang, Malaysia
dannychoo.com no aidokusha
Registered on 2007/12/25 23:02
hmm shame on me..me firefox 2 years using, but still right-click -> new tab

thanks for the tip.
(ID #162249) Posted on 2008/03/27 13:44
Chong Mizunaga in an Afro
Afro-ed Student
Registered on 2007/12/15 09:57
Yeah, I got too used to that function, and when I changed to IE for a while, I was wondering why it didn't work ^^;
(ID #162508) Posted on 2008/03/28 00:02
KanMuI in Paris
student
Registered on 2007/11/03 08:00
nice idea! with the light box you can customize you windows and write comment^^"

and in the html it's not very complicated
(ID #161637) Posted on 2008/03/26 09:51
ZombieNinja in You Ess Of Aye
Wanna-be-Danny-Choo
Registered on 2007/01/03 06:16
Not a fan of lightbox, I just have to say that. Maybe it's just been the quality of the sites i've seen that use it, but usually the photos pop up to small and in low resolution. Does lightbox allow for your great higher res pics, Danny?
(ID #161643) Posted on 2008/03/26 09:54
cease in UK
Student/Artist/Film-maker
Registered on 2007/06/04 03:57
lightbox idea sounds good! i have seen it being used on some art sites before and it works well!
(ID #161646) Posted on 2008/03/26 09:59
xorsyst in United States
Web Designer
Registered on 2007/12/14 08:39
Well the small pictures are configurable, but the whole idea of it is usability. While many people have large screen monitors, the majority of people around the world are still 1024x768. Thats why the standard lightbox picture may seem small to you. I actually use Thickbox as my image popup of choice. I'm a big fan of the work JQuery is doing.
(ID #161651) Posted on 2008/03/26 10:02
Edward in Michigan U.S.A.
Troubleshooter, Universal Exports
Registered on 2006/12/24 12:02
Yes!  Thanks for posting that!  I used ThickBox http://jquery.com/demo/thickbox/  in a project at the end of last year.  Being JQuery it was easy to implement.  Well, I found it easy... ^^ 
(ID #161672) Posted on 2008/03/26 10:24
Danny Choo in Tokyo
Director/代表取締役
Registered on 2006/12/11 11:06
I like the thickbox thing but most seem prefer no lightbox type implementation.
(ID #161865) Posted on 2008/03/26 18:40
SG in UK
Art/Media Student (Wannabe Illustrator)
Registered on 2006/12/28 05:39
Lightbox sounds like a great idea, its better than a pop up box. I take that the Lightbox is coded in Ajax?
I tried to use a Ajax Tab thing and it does not work for me offline :S

I think that the lightbox is a good idea, get some people to test drive it, (how long a image load for accessibility, usability etc.) Can't wait to see it working :]
(ID #161653) Posted on 2008/03/26 10:03
Edward in Michigan U.S.A.
Troubleshooter, Universal Exports
Registered on 2006/12/24 12:02
A lot of them are Javascript.
(ID #161659) Posted on 2008/03/26 10:08
ornehx in Penang, Malaysia
dannychoo.com no aidokusha
Registered on 2007/12/25 23:02
if its javascript..then some users might have java version incompatiblity..??
(ID #161673) Posted on 2008/03/26 10:24
SG in UK
Art/Media Student (Wannabe Illustrator)
Registered on 2006/12/28 05:39
True, some don't have the latest or even installed Java (ie my dad lol).

I'm sure most of this community have at least a compatible version.
(ID #161682) Posted on 2008/03/26 10:44
Edward in Michigan U.S.A.
Troubleshooter, Universal Exports
Registered on 2006/12/24 12:02
Rats Danny I have a few links with many different types of lightboxes.  Maybe you have seen these sites as well.

I do like what you have now, but I do think a lightbox is the way to go.  I'm assuming that the lightbox will show each photo in a given post only.  One will still be able to go to the gallery if they want photos from past post, right?

I do like the gallery you have now, but yes I do get lost from time to time. ^^

Back to Sumultron I go...

By the way, I thought I seen "Coda" icon in your dock.  Have you tried that app.?  What is your impression of Coda.


(ID #161665) Posted on 2008/03/26 10:16
Danny Choo in Tokyo
Director/代表取締役
Registered on 2006/12/11 11:06
Coda is good - been using it for a while now. Before used to use Smultron.
(ID #161864) Posted on 2008/03/26 18:39
Last{[0]}Raven in ☆DANNYCHOO Site ☆
Raven, AMV & MAD maker, Otaku
Registered on 2008/01/02 12:55
hmmmm the current way you use displaying the pictures is the best i think danny
(ID #161667) Posted on 2008/03/26 10:19
dreaming Artemis in Malaysia
Full time nerd
Registered on 2007/11/28 09:55
What you have proposed is a great idea. I have seen the meido cafe use this idea to great affects. I think it works great!
(ID #161670) Posted on 2008/03/26 10:22
Koji98 in Arlington, Texas
Your local Otaku Cashier.
Registered on 2007/11/04 12:31
I personally like the way it is now. Mostly because I create tabs when viewing pictures, that way I can just create a bunch of tabs with every picture in a gallery, and then look at each one individually, then x it out with the next picture already loaded and ready.
(ID #161679) Posted on 2008/03/26 10:39
wickedclown in California, USA
Otaku, Computer tech, Student
Registered on 2007/12/07 21:33
Thats what I do too xD.  Makes it easier to view photos in the proper order.  I tend to create new tabs for a lot of the links that I click.
(ID #161695) Posted on 2008/03/26 11:23
Echonov in Canada
Animation Student
Registered on 2008/03/01 13:23
Agreed.

Mechanisms that prevent me from accomplishing this method only annoy me.
(ID #161757) Posted on 2008/03/26 14:50
FatBastard in over his head
Meat Puppet
Registered on 2007/11/04 18:16
Hey Danny, my opinion about lightbox is mixed. They are great if there are only a small number of pics to view per post, but when there is alot I tend to skip to gallery to view them. If you code it to load faster it may help. Otherwise I find restrictive to move between them.

Navigation wise, previous/next function looks good with a rollover overlay on the left/right side of the pic respectively. Gallery link can be accessable below pic centered if ppl wanna skip. To increase loadability for slow conn, you may want to limit # of pics per gallery page, and give numbered page links of "1,2, etc". 

Hope this helps. 
(ID #161684) Posted on 2008/03/26 10:50
Evo_Spec in Alberta, Canada
Registered on 2007/10/21 13:13
i like it either way, i don't really look at the images that often, so it's nice to have it the way it is because if i'm interested in a picture, i can view it in a higher res. (i always open a new tab)
if you decied to do the lightbox just make sure it's high res ^_^
(ID #161690) Posted on 2008/03/26 10:59
Observer
Registered on 2007/12/28 21:40
I despise lightbox.  I'm conditioned to expect that a thumbnail image links directly to a zoomed image.  If I want to view an image in the foreground, I click on it.  If it doesn't load, or I wish to interrupt its loading, I trust that my browser's navigation and caching works, and hit the back button.

AJAX isn't good when used for navigation... this is a basically what lightbox is.  It is modal; when you enter lightbox, you cannot do anything until you exit.  You are forced to wait for the image to load.  If the site is slow, this is no fun.  If you use your browser 'back button' to abort mission, you could possibly leave the site rather than the lightbox. "Modal" usually refers to dialogs.  Dialogs involve communication.  Lightbox isn't communication; it is only data sent to you; there is no input from you except to close the thing.

Get rid of the modal aspect and navigation issues of the lightbox and it's better.  Until then, for sites that use lightbox, I'm sticking to a newly formed habit ever since tabbed browsing came about: loading links in the background.
(ID #161694) Posted on 2008/03/26 11:16
Martin Wandering in Taibei
Student, Spiral Warrior
Registered on 2008/02/04 10:01
I agree with these concerns about a lightbox function, though on the whole I think Danny's idea of how to implement it would be as good as can be expected. I too prefer to open images in new tabs, and get a little thrown off when a lightbox pops up instead.
(ID #161737) Posted on 2008/03/26 13:22
D_Blade in Montreal
Non-profit org. volunteering work addict
Registered on 2006/12/31 22:48
By the way Danny, I guess that lightbox would be a nice way to protect your images, but would it also mean that we cannot save those images for ourselves?
(ID #161700) Posted on 2008/03/26 11:42
lsio83 in Boston
Student
Registered on 2007/11/25 06:34
I personally don't like lightbox. It is true that it looks cool and fancy, but I don't like it blocks the whole content, and it is kinda slow for loading a big image.  Also, even it has a next and prev buttons, I always seem to close it and reopen a new one.  I think people like to click on a thumbnail than a next button.
(ID #161707) Posted on 2008/03/26 12:06
Student
Registered on 2007/08/22 13:35
I prefer the pics gallery looks like [url=http://worldofwarcraft.com/info/dungeons/mag-gallery.html]This[/url] altho, it seems hard to code
(ID #161712) Posted on 2008/03/26 12:21
Student
Registered on 2007/08/22 13:35
http://worldofwarcraft.com/info/dungeons/mag-gallery.html
O well, url seems not working in here
(ID #161714) Posted on 2008/03/26 12:22
kaeze in Melbourne, Australia, Earth
Illustrator & Designer
Registered on 2007/04/09 18:37
Personally, I think Lightbox is awesome!  I've been using it for a few clients' website galleries at work but have yet to update my own sites' galleries.  There are a lot of versions out there but my favourite so far is "Lightbox Plus."

I also like how the gallery works on the some pages of the Akibablog.net site.  Basically it's similar to lightbox but zooms in & out the thumbnail / picture.  Here's an example, scroll down to the gallery towards the end of the post:
http://en.akibablog.net/archives/2008/03/deadball-080324.html#more
(ID #161733) Posted on 2008/03/26 13:10
wickedclown in California, USA
Otaku, Computer tech, Student
Registered on 2007/12/07 21:33
Wow, I LOVE that.  That is the best photo viewing feature I've ever seen.  I can even enlarge multiple photos at a time and move them around in the window.  I vote for this, whatever it's called and however it would be coded xD.
(ID #161755) Posted on 2008/03/26 14:46
kaeze in Melbourne, Australia, Earth
Illustrator & Designer
Registered on 2007/04/09 18:37
I've since had a more look at the source codes in akibablog.net and it looks like it's a javascript much like Lightbox called "Highslide JS".  Unlike Lightbox however, it's not licensed under the Creative Commons which means if you want to use it for commercial purposes, you have to pay... :(  Download it here: http://vikjavev.no/highslide/download.php

BTW, I meant Lightbox 2 http://www.huddletogether.com/projects/lightbox2/#overview
(and not Lightbox Plus as mentioned in my comments above).  
(ID #161873) Posted on 2008/03/26 19:03
anonymouszro in a place beside a mouse
mouse clicker
Registered on 2007/08/23 07:07
looks nice.  a bit of fading in the background may help too.
(ID #161852) Posted on 2008/03/26 18:18
kaeze in Melbourne, Australia, Earth
Illustrator & Designer
Registered on 2007/04/09 18:37
I agree totally! ^___^

It'd be cool if Danny could somehow combine Lightbox (the loading, fade in and out and the faded background effects) with Highslide (zoom in and out and the movable slide)
(ID #161877) Posted on 2008/03/26 19:09
サメル in Seattle, WA, USA
Student
Registered on 2008/02/04 05:48
I do like the lightbox idea. But please don't just group all photos at the end of a post, I think it makes the blog look sloppy and cheap. As long as the lightbox will show the image full sized, you should just do that and keep the photo placement how it is now.
(ID #161741) Posted on 2008/03/26 13:46
まっすぐGO! in Melbourne, Australia
Registered on 2007/11/19 18:46
No. The lightbox is very annoying because i have to switch to some other website or task while waiting for the image to load.

My new windows open in new tabs so if the image opens in a new tab i can go on browsing the site while waiting for the image to load.
(ID #161747) Posted on 2008/03/26 14:01
Registered on 2006/12/24 23:42
hey Danny, one thing I want to ask about lightbox, would it affect the number of pages you have on google and other search engines? wouldn't your current setup wherein each image has a page makes sure that you have a lot of pages for googlebot to sift around? 
if adding lightbox does have an adverse effect on your site, I think it might be better to leave the image handling the way it is right now.
then again search engine optimization is one of your forte. I might just be babbling about something that has no bearing on search engine results. ^^; lol 
(ID #161762) Posted on 2008/03/26 15:10
Danny Choo in Tokyo
Director/代表取締役
Registered on 2006/12/11 11:06
Having too many pages is bad SEO. All my slides were indexed but I removed them using the NOINDEX,FOLLOW tags. For example I want people to land on an article or news post and not on a slide.
(ID #161894) Posted on 2008/03/26 19:58
Registered on 2006/12/24 23:42
ah.. I never thought about that. it does make sense to make sure people land on the articles rather than on a image page. ^^ consider me educated. ^^  domo arigato gozaimasu Danny sensei! orz
(ID #161943) Posted on 2008/03/26 21:45
Henry in Makati, Philippines
anime/cosplay events organizer
Registered on 2006/12/25 19:17
the light box is a great idea as long as it the image that would be viewed is not hi-res 'coz that would really choke the bandwidth for some low bandwidth users ^^;;;
(ID #161776) Posted on 2008/03/26 15:59
Drieick in Mars
Logis Of The Adeptus Mechanicus
Registered on 2008/03/12 14:41
While a lightbox is great, I do believe it'd be more  server friendly to sort the images by category instead of just displaying them all on a single page.
But, Mr. Choo, I do insist that you modify the style of the lightbox; I've seen that style so many times, on so many different web domains.
(ID #161810) Posted on 2008/03/26 17:13
Ricky in Brisbane, Australia
Pharmacist / Student
Registered on 2007/03/28 18:26
I like the interface as it is.  It starts to get annoying when you start implementing that flashbox feature.
(ID #161830) Posted on 2008/03/26 17:39
Evil King in Vlaardingen, the Netherlands, Earth
Student and full-time otaku
Registered on 2007/12/19 00:24
The way shown above is nice to quickly watch a pic, but I sometimes find that the quality is very low. Also, as it is embedded in some Java/CSS/whatnot code (sorry not a progger myself), usually I can't right-click-save those pics. But if the quality was 100% and the saving is easy, this style would be very handy
(ID #161844) Posted on 2008/03/26 18:01
soonkiong in Kuching, Malaysia
Student
Registered on 2007/08/22 12:50
I like the way as it is now... since I open the picture links in a new tab anyway... 
(ID #161851) Posted on 2008/03/26 18:15
Hiyuu in Singapore
Musician, Sound Engineer, Student
Registered on 2008/03/23 05:35
I prefer the way it is now - with "tabbed browsing" all i have to do is open the picture-link in a new tab, that way i can open multiple images in tabs and then return to the original post when i'm done!

Lightbox has given me lots of trouble before, ranging from:
-picture too big, if the picture is opened in a new tab i can zoom in and out with ease from the default plugins
-picture doesn't popup at immediate location, it instead pops up at the top of the post or somewhere else
-can only view one image at a time, with tabs or multiple windows i can compare images or save them for later and read the article first
-when using slow internet connection e.g. wifi, lightbox is a pain.
(ID #161899) Posted on 2008/03/26 20:10
Katsuyoshi in Poland
Perv
Registered on 2007/11/11 03:20
I suggest the first solution. I prefer it if the pic is enlargend and I can switch to another one without closing it. Also it's a lot better to just click "close" after you finnish browsing and automaticlly are send back to the article.
(ID #161944) Posted on 2008/03/26 21:47
lostandfound in a UFO... catcher...
Part human, part student, 100% loser
Registered on 2007/10/22 02:10
Argh! Complicated computer talk! *Head explodes*
(ID #161980) Posted on 2008/03/26 22:57
gurugurutrex in Vancouver, B.C., Canada
オタク by moonlight, Graphic Designer by daylight
Registered on 2007/11/08 03:37
How about do it like getchu.com? You click on one of the thumbnails and you can go "previous" and "next" to browse all the images in the same page?
(ID #162031) Posted on 2008/03/27 01:50
gurugurutrex in Vancouver, B.C., Canada
オタク by moonlight, Graphic Designer by daylight
Registered on 2007/11/08 03:37
Oh, just a quick question.
Can we still right click and save the image in the light box? I know some site don't allow you to do that. =(
(ID #162033) Posted on 2008/03/27 01:52
Sauronu in Bulgaria
Programmer
Registered on 2007/01/15 23:39
I like the current setup, never liked this js+ajax type of galleries. I like to open few images in new tabs, and then look at them, with the ajaxed images you can open only one at a time and if your internet is slow then you have to wait for the stupid pic to show, and also cant continue to read the article cauze the stupid loading picture is hiding it :) So Danny pls dont make any changes in that direction :))
(ID #162049) Posted on 2008/03/27 02:53
super rats in Philadelphia, PA (USA)
Everything
Registered on 2007/01/15 11:33
I have a simple lightbox script installed on my site (no navigation, just overlays the enlarged image).  I like how it blacks out the background, which makes the eye perceive the colors in the photo more vividly.  

I don't see how it prevents anyone from right click >> open link in new tab if they want to do it that way.

But, I guess I should ask my users about it as well, whether it is a nuisance or not.  I have switched from JPEG to PNG for the enlarged view so load times for the lightbox might be annoying.
(ID #162058) Posted on 2008/03/27 03:33
super rats in Philadelphia, PA (USA)
Everything
Registered on 2007/01/15 11:33
Oh, I see on the Chaos Head page it won't let you right-click for options.
(ID #162059) Posted on 2008/03/27 03:38
Key-Ta-Rho in Germany
University Student
Registered on 2008/03/27 04:00
I like Lightbox (looks pretty damn good imo), but i have one Problem with it: it´s not possible to save the pix, or at least i can´t. So it would be cool if you could put at the end of the post one link where you can down all the pix in high-res at once. I hated to go the gallery only to see the pix in high res and everytime right-click-save for every single pic.
(ID #162064) Posted on 2008/03/27 04:18
Atrus in the land of Oz
Student (for-ev-er)
Registered on 2008/02/21 08:37
That would be awesome!  
(ID #162079) Posted on 2008/03/27 06:33
litokid in Toronto, Canada
your annoying commercial break
Registered on 2007/11/25 09:34
...As a repeat of what everyone has said, I'd vote against the lightbox. It looks slick, but it's hell when it doesn't load in an instant. I've grown to dislike them in general.
(ID #162085) Posted on 2008/03/27 07:14
Danny Choo in Tokyo
Director/代表取締役
Registered on 2006/12/11 11:06
Thanks all for the feedback. Looks like most of you don't like the lightbox so I wont be introducing it.
(ID #162089) Posted on 2008/03/27 07:37
qingy in center of the galaxy
SMS
Registered on 2007/10/06 05:09
doesn't really matter to me, but whatever makes the site load faster. i know some people don't have high speed internet access.
(ID #162121) Posted on 2008/03/27 08:24
Gubinodo in France
Still wondering...
Registered on 2007/12/30 01:17
Hello Danny, hello everyone.

I'm a bit late on this one but anyway I wanted to say that there is a lighter version of Lightbox called Slimbox which I am using on my blog (official Slimbox page is here: http://www.digitalia.be/software/slimbox).
Slimbox indirectly enables image saving. Just right-click on the displayed picture and choose "view image" :) Also Slimbox enables to close an image/abort loading by clicking anywhere on the black zone. And the black zone displays only above the fold (it reloads if you scroll up or down).

Also for people saying that it's impossible to save a picture with Lightbox, it seems that it's just a version problem. The latest version of Lightbox enables saving as can be seen here: http://www.huddletogether.com/projects/lightbox/

And finally, like kaeze said, Highslide JS is great too but it is not free for commercial use (if I remember).

Ok that's all :p
(ID #162520) Posted on 2008/03/28 00:21
Skull_Commander in On Earth
IT Guys
Registered on 2007/09/16 03:54
It's a good idea and it'll also reduce the traffic to your site :)
(ID #162542) Posted on 2008/03/28 00:41
Latest Items (See all items)
Hentai Anime
comments(120)
Meet Aya Hirano
comments(93)
Max Factory Mikuru
comments(34)
Mobile Lingerie
comments(52)
Resinya Shana
comments(44)
300000 Yen
comments(97)
Hatsune Mickey
comments(55)
Kotobukiya Elf