To Pop or not?

[Baggy]

We have a News page on our business website and frequently we wish to add small articles that might only run to a couple of paragraphs.

 

Currently, we put the title(s), followed with a one sentence (or part sentence) introduction to the topic, then 'read more ....' as a link to another page where the full article resides. The problem, as I see it, is that a brief article doesn't a) need a full web page and doesn't really look right if the page is largely blank.

 

I have been thinking that the links to short articles could produce a 'pop-up' window in front of the current page, showing the article. Is this a good idea?

 

If so, can anyone kindly advise me how to do it please?

 

Apologies if I am using the wrong terminology for this question.

[lm]

you can start with CSS "show me some more" snippet.

 

And of course there are many JS based scripts:

accordion type ( google "js accordions") where more of the content opens below the button on click and

lightbox type (also JS - google "JS lightbox" ): extra content appear in the "lighbox" window.

 

More accessible seems CSS snippet but many JS lightboxes and accordions scripts also decently degrade if JS is off.

[Baggy]

Thanks for the reply. Can you please explain what this means :-

 

"More accessible seems CSS snippet but many JS lightboxes and accordions scripts also decently degrade if JS is off."

[Baggy]

I've been having a look around and quite like the way this works : http://sandbox.leigeber.com/tinybox/

 

Would this or something like it do what I want?

[lm]

"More accessible seems CSS snippet but many JS lightboxes and accordions scripts also decently degrade if JS is off."

What I meant is that using JS could cause some difficulties in accessibility ( if for example, JS is off, the content of lightbox will be unaccessible).

Further, in some cases JS can make page content unreadable for search engines and screen readers.

So when you choose lightbox, look for the accessible one, if possible, not only on how pretty they are.

More reading about it:

Creating accessible JS

and as example of how to evaluate code snippet on usability/accessibility/degradability:

http://mondaybynoon.com/2006/03/27/suckerfish-hoverlightbox/

[administrator]

"I have been thinking that the links to short articles could produce a 'pop-up' window in front of the current page, showing the article. Is this a good idea?"

 

This is something you want to avoid. Usability studies have shown (and my own experience) that people don't like pop-up windows. Just have the article appear in the main window.

 

... People like to use the 'back' button and pop-ups add an extra level of complexity that will only frustrate.

 

Stef

[PicnicTutorials]

Fancybox is real nice too. Gives you every option you need as well.

[Baggy]

Stef,

 

thanks for your response. I know a lot of people are anti pop-up, but I feel really uncomfortable having a web page with very little content - just doesn't look right.

 

When you say 'just have the article appear in the main window', what do you mean please? Are you referring to something like Accordian?

[falkencreative]

I believe Stefan was thinking of an actual pop up -- a completely new page -- not something popped up in a lightbox, where the content stays all in one page.

 

Personally, I'd highly consider something like the "Show me more" link that Im posted... Depends on the length of the text you needs to display, but I'd avoid a lightbox, and just show the text directly in the same news page if possible.

[Baggy]

Ben,

 

thanks, I like the 'show me more' particularly now it's got the 'less' button - http://www.stunicholls.com/various/more.html

 

However, I'm not at all sure how to install/use it though, can you/someone kindly tell me where I can find instructions please?

Edited November 9, 2009 by Baggy

[virtual]

Scroll to the bottom of the page and there is a download link there, which will probably contain some instructions. If not get back to us once your have downloaded the files.

[carmen007]

pop up is not a good idea perhaps you should use min height in a style sheet which i think should solve your problem as the page will appear according to the content length.

[Baggy]

Carmen007 - appreciate your comment but I want to try it (not live) to see how it looks/works and then decide.

 

Virtual - I have downloaded it - no instructions (sadly). I have created a hidden page to experiment but it's not working right. The >>more and <

 

I should add that the site I'm trying to use this in has a CMS, which might be having some effect?

Edited November 10, 2009 by Baggy

[lm]

Have you got the example page more.html ( from the zip file) working?

If not, upload it ( together with more.css and .js ) files to some test directory and give us a link.

 

In case you got the example page working, edit all content replacing all text to yours and see if it works for you.

Now you are ready to add HTML to your working page.

Make sure that Doctype of a test page is the same ( in the example it is

Also dont forget to add links to css and .js files in the

of a page.

[Baggy]

Unfortunately, the site we are now using is held by a third party who provide the hosting and provide all the templates/designs. As a result, we don't have full ftp access so cannot save the .js files(s) or access the header code.

 

Although we can see the code for some of the site, a lot of the important stuff is not accessible. I guess the lack of total control is a trade-off for the functionality we gain in terms of design flexibility and the cms.

 

I am going to have to re-think this one to see if there's a way of presenting small articles without them having to occupy a full (dedicated) page. Ideas/suggestions are welcome.

 

Thanks for the help folks.