CSS: Menus, Fundos de Tela e Botões Prontos Para O Seu Blog
By Dan Di Gregorio | 04 March 2008 | Desenvolvimento
Uma seleção de recursos muito simples utilizáveis mesmo por usuários sem experiência
Pesquisei e selecionei entre os meus sites preferidos no StumbleUpon alguns recursos CSS muito simples de serem utilizados, com exemplos e fontes para copiar, colar e personalizar no seu próprio blog. Propositamente selecionei recursos que podem ser utilizados por usuários não experientes em desenvolvimento CSS e HTML. Têm também alguns utilitários gráficos realmente simpáticos, em perfeito estilo web 2.0. Bom divertimento e bom trabalho!
Menu de navegação CSS
Há 11 barras de ferramentas CSS em estilo web 2.0 prontas para utilizar. Os menus são visualizados na página e funcionam perfeitamente. Basta abrir a fonte para pegar o código e utilizá-lo no seu blog e, eventualmente, personalizá-lo. Você notará que as etiquetas das barras de ferramentas podem ter algumas imagens de fundo: você encontrará os nomes das imagens nas específicas CSS e poderá baixá-las clicando em http://exploding-boy.com/images/cssmenus/.
Teaser Box
São aquelas caixas que evidenciam uma mensagem no contexto geral de uma página web. Ótimas para chamar a atenção dos visitantes. Na página você encontrará tanto o CSS quanto o código HTML para colocá-lo em operação. Aqui também você pode capturar as gifs necessárias pegando-as no mesmo percurso da página web.
CSS Image Popup
Ainda não sei se convém ou não, de qualquer modo, este script CSS permite que você aumente uma imagem através de uma pop-up sem inseri-la na janela do browser. Aqui você pode ver em funcionamento o pequeno script. O CSS é encontrado em picpopup.css.
Submit buttons para formulários web
Se você ama particularidades, o botão de envio de formulários no estilo web 2.0 não pode faltar. Aqui você pode encontrar um guia muito simples com os códigos HTML e CSS para criar o botão.
Evidenciando links visitados
Aqui estão algumas idéias realmente originais e muito simples para personalizar o estilo dos links visitados (Vlink) através do CSS.
Mensagem de erro ou aviso
Simples e ótimo CSS que evidencia uma mensagem de erro ou um simples aviso de maneira eficaz e não invasiva. Os alertas e os erros, do ponto de vista comunicativo, constituem um ponto crucial desde sempre e este código CSS resolve o problema de maneira excelente.
Tabs Generator
Gera online as etiquetas das barras de ferramentas e dos menus de navegação CSS. Você pode configurar praticamente tudo: altura, largura, borda, raio de curvatura, cor, gradiente, orientação e outros. Uma vez gerado o preview você pode salvar a etiqueta baixando-a no seu computador para utilizá-la como fundo nas etiquetas das toolbar CSS.
CSS menu library
São 12 menus CSS prontos para copiar, colar e utilizar no seu blog.
Brilliant button maker
Simpático aplicativo online que permite gerar botões 80×15 no estilo “Powered by FeedBurner”. Ótimo nível de personalização.
Badges 2.0 Generator
Os badges são medalhas que são colocadas nas páginas web para chamar a atenção dos visitantes. Aqui você encontra uma enorme coleção de badges prontos para serem utilizados ou você pode gerar um online personalizando tanto o texto como o aspecto gráfico.
Web 2.0 Logo Creator
É uma aplicação online muito simples que permite que você gere um logo web 2.0 com gradiente, reflexo e símbolo beta.
Strip Generator
Vamos nos esquecer da tela de fundo? Strip Generator permite que você crie online fundos de tela e tirinhas em formato horizontal para completar a obra. Ótimo nível de personalização.
Tags | css, Desenvolvimento, html, web2.0


March 22nd, 2008 at 1:11 pm
Beleza de dicas. São uma mão na roda p/ quem tá começando a blogar. Valeu mesmo!
Antonio