dúvida sobre qual tecnologia usar em tela/página com ABAS?

Front-end
#1

Colegas,
Estou desenvolvendo um projeto onde o site vai ter abas.
Em cada aba clicada, vai ser carregado dentro de um div especifico
o conteúdo.
Por exemplo:
Quando clicar na aba treinamento, carregará uma lista de treinamentos
por tecnologia, dentro da àrea central.

______________   _________   ________
| Treinamentos | | Produtos | | Contato |
|______________|_|__________|_|_________|_____
|                                             |
|                                             |
|                                             |
|                                             |
|                                             |
|                                             |
|                                             |
|                   Àrea Central              |
|                                             |
|                                             |
|                                             |
|                                             |
|                                             |
|_____________________________________________|

A minha pergunta é a seguinte:

  Qual a melhor forma de implementar isto ?
  AJAX ( pensei em utilizar o DWR para isto )
  JSF  ( Que é onde eu gostaria de fazer, mas não sei se é possível neste caso )
  
   Eu gostaria de sugestões, pois este post será util para outros colegas também.
   
   Ob.: 
      Para simular o resultado desejado, eu criei uma função Javascript que de acordo com a aba clicada
      ele faz um document.getElementByID("divxyz").innerHtml="<b>escreve algo</b>";
#2

Tenta isso aqui:

http://prototype.conio.net/ - Javascript Prototype

http://script.aculo.us/ - Script.Aculo.Us

E tem esse aqui que é exatamente o que precisa, e usa os 2 acima:

http://tetlaw.id.au/view/blog/fabtabulous-simple-tabs-using-prototype/

Att.

#3