Lista de cheat sheet para Ajax e Javascript

Já aqui tínhamos falado numa cheat sheet para o prototype, mas desta vez Scott Klarr criou uma lista impressionante de cheat sheet para diferentes frameworks.

Sem duvida visita o artigo oficial onde podes encontrar:

  • Cheat Sheet para Javascript
  • Cheat Sheet para jQuery
  • Cheat Sheet para scriptaculous
  • Cheat Sheet para MooTools
  • Cheat Sheet para Prototype
  • Cheat Sheet para Microsoft Ajax
  • Cheat Sheet para Yahoo YUI
  • Cheat Sheet para Symfony

Façam o download e guardem bem no disco pois nunca se sabe quando dá jeito.

Visitem Scott Klarr.

10 Ajax, CSS, HTML, PHP, Javascript galerias de imagens

minishowcase

Uma potente galeria em PHP/Javascript, no website oficial dizem ser uma solução de tamanho pequeno, mas eu acho que quase 200kb não é assim tão pequeno.

Pontos fortes:

  • Para quem procura uma galeria e apenas isso, minishowcase da conta do recado
  • Rapidez, claro que também depende do servidor, mas mesmo assim esta galeria de imagens é rapida.
  • Fácil de instalar.

Pontos fracos:

  • É uma galeria (e apenas isso), sendo assim é dificil integrar com o resto do website
  • Opções, são varias mas básico.

Site oficial: Minishowcase
Exemplo oficial: Minishowcase Demo
Instruções oficial: Minishowcase Instruções

iphonestyle

AJAX Slideflow Control - estilo iPhone?

Para quem procura uma galeria do estilo do iPhone, esta é a solução mais parecida de momento.

Pontos fortes:

  • O efeito visual é sem duvida bastante atractivo
  • Fácil integração com outras paginas que já tenhas no teu website

Pontos fracos:

  • Ter que preparar as imagens todas em photoshop
  • A sério o factor de ter que criar 3 imagens (esquerdo/centro/direito) em photoshop torna-se bastante cansativo
  • Ter que criar o ficheiro xml

Site oficial: Mediaeventservices
Exemplo oficial: Mediaeventservices Demo
Instruções oficial: Mediaeventservices Instruções

zenphoto

ZenPhoto é talvez uma das plataformas mais completas para quem quer ter uma galeria de imagens na web.

Pontos fortes:

  • Index, Albums e imagens
  • Cria automaticamente thumbnails
  • Podes adicionar imagens através de FTP ou através do browser
  • Os visitantes podem comentar cada foto ou imagem
  • Ajax edita enquanto navegas pela a galeria
  • Themes, podes criar a tua template ou podes fazer download de algumas ja existentes
  • Varias maneiras de procurar, através de datas, tags, titulo e descrição

Pontos fracos:

  • Quando o visitante esta a ver as tuas imagens em tamanho inteiro cada vez que muda de imagem o pedido não é atraves de Ajax

Site oficial: Zenphoto

Exemplo oficial: Zenphoto Demo

Instruções oficial: Zenphoto Instruções

smoothgallery

SmoothGallery é uma galeria que usa bastante tecnicas de Ajax, as vezes ate parece ser criado em Flash.

Pontos fortes:

  • O display
  • A suavidade entre mudanças de imagens
  • Fácil de integrar com o teu website, não é apenas um standalone

Pontos fracos:

  • Quando o visitante clica para ver a imagem em tamanho normal, não existe a opção para voltar para a galeria

Site oficial: SmoothGallery

Exemplo oficial: SmoothGallery Demo

Instruções oficial: SmoothGallery Instruções

pyxygallery

Pyxy-gallery é mais uma galeria em PHP e Javascript que usa lightbox.js para mostrar as imagens da galeria.

Pontos fortes:

  • Apesar de uma ajax para mostrar as imagens numa só pagina é possível fazer o bookmark a imagens individuais.
  • Super leve

Pontos fracos:

  • Beta, falta limar ainda alguns pormenores.
  • Visualmente não é a galeria mais atractiva.

Site oficial: Pyxy Gallery

Exemplo oficial: Pyxy Gallery Demo

Instruções oficial: Pyxy Gallery Instruções

couloir

Couloir é uma solução em Javascript, HTML e CSS que tenta ( e bem ) recriar uma galeria em Flash.

Pontos fortes:

  • Excelente suavidade entre as mudanças de imagem para imagem

Pontos fracos:

  • Não existe suporte
  • O código é oferecido com esta
  • Não oferece a oportunidade de criar álbuns etc.. é apenas mesmo um visualizador de imagens

Site oficial: Couloir

lightbox2

Lightbox2 é talvez uma das lightbox conhecidas e usadas. Baseado nas seguintes frameworks, prototype e scriptaculous.

Pontos fortes:

  • Suavidade de animação entre imagens é talvez uma das melhores
  • Fácil de instalar
  • Fácil integração com o teu website

Pontos fracos:

  • Não é uma galeria completa como outras aqui apresentadas

Site oficial: Lightbox 2

Exemplo oficial: Lightbox 2 Demo

Instruções oficial: Lightbox 2 Instruções

triptracker

TripTracker na minha opinião é excelente para quem tem umas quantas imagens no site e quer uma maneira agradável para os visitantes navegarem entre imagens.

Pontos fortes:

  • Fácil de usar
  • Fácil de instalar
  • Fácil de integrar com o teu website design
  • Excelente navegação entre imagens
  • Opção para enviar a imagem por email
  • Opção para criar um bookmark a imagem

Pontos fracos:

  • Não é de borla
  • Licença normal: $25
  • Licença premium: $500

Site oficial: TripTracker

Exemplo oficial: TripTracker Demo

Instruções oficial: TripTracker Instruções

suckerfish

O que distingue Suckerfish HoverLightbox de outras soluções é o factor de poder criar uma barra de navegação de galerias em que o visitante basta passar com o rato por cima para aparecer uma caixa género “dropdown” com thumbnails das imagens.

Pontos fortes:

  • Diferente de outras soluções

Pontos fracos:

  • Talvez os visitantes mais “básicos” não percebam a primeira como ver as imagens

Site oficial: Suckerfish

Exemplo oficial: Suckerfish Demo

thickbox

ThickBox oferece mais do que apenas uma maneira de ver imagens. Pode tambem mostrar paginas, divs, texto etc..

Site oficial: Thickbox

Exemplo oficial: Thickbox Demo

Instruções oficial: Thickbox Instruções

Shadowbox novo lightbox

shadowboxShadowbox não é apenas mais uma lightbox, apesar de também ser usado para o mesmo efeito. Mas existe vários pontos interessantes nesta extensão como:

  • Standards Shadowbox cria HTML valido que passa os testes por W3C.
  • Frameworks normalmente uma extensão tem que ser usado com apenas uma framework, e todos nos sabemos que as vezes não usamos certas extensões pois não são compatíveis com a nossa framework escolhida. Shadowbox suporta varias frameworks como YUI, Ext, Prototype + Scriptaculous, jQuery e MooTools.
  • Design fácil modificar o design da box, Shadowbox usa um sistema de skins em que basicamente basta modificar apenas um ficheiro CSS.
  • Formatos Quicktime, Windows Media Player, Flash, Flash video e até paginas externas.

Sem duvida que extensão esta bem conseguída e o factor de poderes usar qualquer framework ajuda muito em escolher esta extensão para os próximos projectos.

Nova maneira de seleccionar datas

Nova maneira de seleccionar datasUma nova extensão para quem usa prototype. Desta vez é uma nova maneira de seleccionar datas, em vez dos tradicionais popups Ajaxorized introduz uma nova maneira, uma barra com datas e o usuário apenas necessita de clicar e arrastar.
Apesar de achar uma ideia original e interessante, acho que só resulta se for preciso o usuário escolher um um período de datas, pois fica difícil escolher apenas um dia.
Para mais informações e download visitem Ajaxorized.

Lightview mais uma extensão para as tuas imagens.

Lightview Lightview é mais uma lightbox para mostrar de uma forma elegante e dinâmica as tuas imagens.

Esta extensão utiliza o prototype e para os efeitos utiliza o script.aculo.us.

Para mim um dos pontos fortes desta extensão é a animação suave e sem falhas. Gosto também do facto das caixas terem cantos redondos e não serem imagens (png) como outras extensões.

Um dos pontos fracos é a navegação das imagens, quando queremos mudar para a próxima imagem aparece uma seta, mas quando vamos “tentar” clicar desaparece. O que fez me um pouco de confusão. Até que descobri que para navegar entre imagens basta mesmo só clicar no lado direito ou esquerdo da imagem que esta a ser apresentada.

Algumas das características são:

  • Rápido
  • Fácil de modificar o design
  • A imagem ajusta-se sempre ao tamanho do monitor
  • Facil de usar e instalar

Para mais informações, documentação e download visitem LightView.

AjaxRain apresenta um novo design

Ajax rain com novo designAjax Rain apresenta um novo design.
Com cerca de 915 extensões disponíveis Ajax rain talvez seja o maior site em termos de agregar novas extensões.
Com um novo design e algumas novas funções Ajax rain fica agora ainda mais fácil usar, para procurar a extensão que queremos.
Alguns dos pontos bons do novo design são:

  • Ultimas extensões adicionadas na primeira pagina
  • Ultimos comentários adicionados na primeira pagina
  • Votar nas melhores extensões
  • Poderes criar os teus favoritos
  • Secção das extensões mais populares

Alguns pontos negativos:

  • A primeira pagina esta muito “cheia”

Entretanto aqui pelo o PTAjax estamos a trabalhar num novo design, de momento como podem ver este design é uma template normal, e com o gosto pelo o projecto e os visitantes tem crescido de dia para dia(pelas stats / pena não haver mais comentários) esta na altura de criarmos um design que corresponda as nossas expectativas de crescimento do site.

O novo design vai usar também o wordpress, mas estamos a criar um design de raiz e estamos a programar plugins e a template de raiz.
Sendo assim ainda podera demorar um bom bocado.

O mais engraçado é que já temos o novo design a ser testado e chegamos a conclusão que o design ainda não serve para o que desejamos, o que significa que temos que voltar a por mais umas ideias em papel e em photoshop.

Fica aqui uma imagem da versão que estamos a testar, mas que muito provavelmente nunca ira para o publico.

PTAjax V0
O que não gostamos:

  • Muito verde
  • Muito “cheio”
  • Header
  • Quase tudo

O que gostamos:

  • O vantagem de podermos organizar a primeira pagina com “últimos sites”, “ultimas extensões”

Pois é as vezes o que parece bom no “papel” não resulta e por isso não vamos lançar esta versão.
Dêem uma ajuda e digam se fizemos bem em não continuar o desenvolvimento desta template.