(Websites) which technology

From looking at the BBC source, looks like a css/javascript driven page mostly.

The CSSgallerylist, as the name suggests again is mostly css with a little javascript twisted in. All of the image rollovers and resizes are a css code.

Its fairly easy to design something like this, as long as you have your main layout designed, the fancy stuff is easy enough just to code in to place around it.

Plenty of references of how to do these things, I use http://www.cssplay.co.uk/ quite a lot, it has an awesome collection of css tips and tricks and working demos of all.
 
Sure I read a big article on the new bbc web design in web designer mag a while ago - they were going through how they achieved some of the efefcts using JQuery.

reading the link they said they used to use jquery but changed as it didn't work on enough browsers for a company like the bbc e.g. ie5 and very old safari

edit: http://www.bbc.co.uk/glow/docs/articles/what_is_glow.shtml

Why not use an existing library?

There are a range of excellent open source JavaScript libraries available, the most popular amongst the BBC developers we spoke to being jQuery. In fact, an early version of the new BBC homepage was built using jQuery, and we still admire it enormously.

However, on reviewing the major libraries we found that none met our standards and guidelines, with browser support in particular being a major issue.
 
The part you'll be interested in, with regards to cssgallery, is this bit:
Code:
/*
 * Url preview script 
 * powered by jQuery (http://www.jquery.com)
 * 
 * written by Alen Grakalic (http://cssglobe.com)
 * 
 * for more info visit http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery
 *
 */
 
this.screenshotPreview = function(){	
	/* CONFIG */
		
		xOffset = -25;
		yOffset = -249;
		
		// these 2 variable determine popup's distance from the cursor
		// you might want to adjust to get the right result
		
	/* END CONFIG */
	$("a.screenshot").hover(function(e){
		this.t = this.title;
		this.title = "";	
		var c = (this.t != "") ? "<br/>" + this.t : "";
		$("body").append("<p id='screenshot'><img src='"+ this.rel +"' alt='url preview' />"+ c +"</p>");								 
		$("#screenshot")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px")
			.fadeIn("fast");						
    },
	function(){
		this.title = this.t;	
		$("#screenshot").remove();
    });	
	$("a.screenshot").mousemove(function(e){
		$("#screenshot")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px");
	});			
};


// starting the script on page load
$(document).ready(function(){
	screenshotPreview();
});
 
i think I am right in saying sites such as the bbc use only HTML/CSS because of the server load? It is much easier for a server to serve a static page than it is a dynamic one.

This makes it cheaper, faster etc.

Thanks for the glow link - might start using that in my own projects.
 
i think I am right in saying sites such as the bbc use only HTML/CSS because of the server load? It is much easier for a server to serve a static page than it is a dynamic one.

This makes it cheaper, faster etc.
I don't understand what you mean? The BBC have a mammoth CMS which serves pages to browsers. Every CMS, no matter what language it's written in will serve HTML and CSS (and probably JS) to the browser.

Could you imagine the BBC creating every single page by hand? I'd pity the poor guy who has to replicate a design change accross 5,000,000 pages :)

BTW while Glow is better for browser compatibility, the jQuery syntax is much nicer and easier to use. Plus jQuery also has tons of plug-ins created for it.
 
BTW while Glow is better for browser compatibility, the jQuery syntax is much nicer and easier to use. Plus jQuery also has tons of plug-ins created for it.

I do find it funny that they spent all that money creating their own library just to support IE5 and equiv. I mean, such a small amount of users must be used to most webpages not working correctly for them. I don't know anyone who still tests or codes for IE5.
 
I don't understand what you mean? The BBC have a mammoth CMS which serves pages to browsers. Every CMS, no matter what language it's written in will serve HTML and CSS (and probably JS) to the browser.

Could you imagine the BBC creating every single page by hand? I'd pity the poor guy who has to replicate a design change accross 5,000,000 pages :)

BTW while Glow is better for browser compatibility, the jQuery syntax is much nicer and easier to use. Plus jQuery also has tons of plug-ins created for it.

Their CMS out puts HTML, that's the difference.

All off the shelf packages work using ASP.NET or PHP (or similar) which output HTML as a final product but require processing to that point. Its 'on the fly' html if you like.

If you search archives of old BBC news you will see the html pages are not updated and are done to 800x600. Here is an example:

http://news.bbc.co.uk/1/hi/in_depth/uk/2000/newsmakers/1768724.stm
 
All the BBC pages have the .stm extension, that's the same as .shtml, isn't it?

i.e. Server Server Includes, quite a primitive "templating" system.
 
The extension you see is irrelevant. It could well just be PHP but labelled with a .stm extension.



Because those were done before their current design/system, and didn't see any point in altering the archive.

i am 99% sure bbc CMS outputs plain HTML / JS to server.

I know you can map extensions....

If it was done via the traditional CMS route then why when they updated layouts/templates etc did the old content not get update also?
 
If it was done via the traditional CMS route then why when they updated layouts/templates etc did the old content not get update also?
Presumably they had a clean break at some point regardless of which system they use/used.
 
i am 99% sure bbc CMS outputs plain HTML / JS to server.

I know you can map extensions....

If it was done via the traditional CMS route then why when they updated layouts/templates etc did the old content not get update also?

Output to server? You mean output to client? And of course, HTML/CSS is a client side language, even with PHP it will output the client side language and not the PHP.

Well if the old page were all static HTML files or even just an older CMS, it would mean manually editing them all to add in the new CMS code.
 
All the BBC pages have the .stm extension, that's the same as .shtml, isn't it?

i.e. Server Server Includes, quite a primitive "templating" system.

You can map any extension to any functionality. For a laugh, I had my pages ending '.barry' to try it out and prove this very point to someone else.
 
Back
Top Bottom