Quem nunca quis um fundo de de página opaca? Geralmente com Css usava-se o opacity que deixava até o texto semi-transparente, e isso é um dos empecilhos, sem considerar o tamanho do código usado para esse efeito funcionar na maioria dos navegadores.
Criei uma página de exemplo com imagem de fundo transparente, com essa imagem ao lado, que é transparente, e diferentes cores de fundo. Clicando aqui você verá como as imagens transparentes podem ficar em uma página Web.
PixelFormer
Nov 19, 2010 by Blog.foitestado.comproduct0.3PixelFormer é um ótimo software editor de imagem gratuito(ferramentas para otimizar imagens png e ico, tornar imagem transparente)
O Editor de imagens PixelFormer trás alguns diferenciais modernos para criação e edição de imagens, a meu ver dois dos principais são de tornar uma imagem transparente ou parcialmente opaca e outra, a opção de otimizar imagem, ou seja, reduzir drasticamente seu peso em bytes sem perda de qualidade, isso proporcionará uma velocidade maior em enviá-las para web e tornará a navegação de outros usuários mais rápida, tanto se você adicionar elas em páginas de internet como blogs ou sites, a redução de bytes pode tornar este processo de enviar imagem mais rápido, fazendo com que você perca menos tempo enviando as imagens para a web, sem contar na redução de banda, sua, de um servidor e de visitantes que venham a ver essas imagens.
Baixar grátis o Editor PixelFormer
O download possui menos de 1Mb, o programa é em inglês.
Sistema Operacional:
Windows 2000, XP, 2003, Vista e Windows 7.
Computador:
Processador de 500MHz ou mais;
256MB RAM ou ou mais;
Os computadores básicos de hoje possuem isso.
Baixar direto:
Baixar PixelFormer, clique
Ir baixar no site do PixelFormer, clique
Acessórios do editor PixelFormer
A opção Salvar que fica em File(no menu superior) salva todas as imagens que estão sendo editadas, ou seja, salva como um 'Projeto'
Ao lado direito do editor PixelFormer tem a opção Project, cada imagem que você Importar para editar ficará ali, e você pode editar e mudar de uma imagem para outra, fazer colagens entre elas, pegar cores de uma e adicionar na outra, etc.
É bom observar as ferramentas disponíveis no editor, como a seta(botão) que expande a barra de ferramentas.
- Importante: Logo ao abrir o editor você só terá a opção de clicar no menu superior em File, aí terá que escolher uma das opções:
- New... que cria nova imagem
- Open... Abre um projeto, Pixelformer project .pxf
- Import... Abre uma imagem existente em diversos formatos(extensões)
Depois você poderá seguir editando, veja as dicas abaixo.
- Clique no menu superior em Image
- Clique em Import...
- Abrirá uma janela onde você deverá escolher uma imagem e dar um Ok, Enter ou algo no sentido de confirmar.
- Depois de editar a imagem clique novamente no menu em Image(passo 2)
- Clique em Export...
- Abrirá uma nova janela para dar um nome a imagem e escolher o formato do arquivo, Você pode dar um nome diferente a imagem, daí será salva como nova imagem. O formato prefira Portable network graphics(png)
- Abrirá uma janelinha com opções, marque a opção Multipass optimization
- Clique no botão Ok
Para Criar ou Editar uma imagem
Obter e salvar uma imagem otimizada
Colagens de imagens
Detalhe, ao editar imagem, cada colagem que você fizer será um Layer, um layer é como uma camada, uma imagem sobre a outra, ao lado direito você poderá ver que haverá uma ferramenta(Image) com as colagens que você fizer(Layers) e cada layer funcionará como uma imagem individual, após salvar(export...) os mesmos tornam se uma imagem, ficara impossível editar novamente cada layer, a menos que você tenha escolhido a opção Save, está salvará como arquivo .pxf
Isso não é um defeito do editor, mas sim uma qualidade que permite a você uma facilidade de desfazer algo ou trabalhar cada Layer de forma independente, mas isso gera um problema que é você não conseguir copiar uma imagem com mais de um layer, se tentar estará copiando só o layer selecionado, por exemplo, se quiser inserir uma imagem que está editando em outra, o jeito será copiar e colar cada layer ou importar a imagem no formato Png e abrir ela novamente.
A funcionalidade de editar cada layer separadamente facilita algumas coisas, um exemplo é a imagem acima, eu consegui colocar uma logomarca do blog nela, mudar sua cor e opacidade de forma que fique parecendo uma marca d'agua quase imperceptível, é uma forma de assinar uma imagem e dificultar sua retirada sem alterar sua qualidade.
Olá! Baixei o PixelFormer, porém a alteração do plano de fundo não é aplicável ao modelo de blog que possuo, é correto? Grato
ResponderExcluirDaniel M M
ResponderExcluirComo eu disse acima, nesse editor, para fazer uma imagem válida deve usar a opção Export, isso porque usando a opção Save ele salva como pxf e isso é um formato de 'projeto' para ser trabalhado apenas no PixelFormer.
Para poder usar uma imagem trabalhada no PixelFormer deve exportar(Export) ela com formato Portable network graphics(png)
Quanto ao uso de uma imagem como fundo, todo blog é possível alterar, na maioria das vezes alterando no Css, no caso do seu, várias DIVs usam uma imagem de fundo, primeiro teria que retirar elas de cada uma das DIVs e colocar outra no lugar ou especificar uma para body, DIVs são partes ou 'quadros' do blog, no Css do HTML está especificado uma imagem e cor de fundo para algumas das DIVs.
Olá! Baixei o programa Pixelformer, na versão gratuita. Fiz o meu projeto, mas não consigo salvá-lo com extensão ico. Como fazer para salvar e assim criar meu favicon?
ResponderExcluirNo PixelFormer a opção de Salvar para outros formatos é a opção do menu >Image e >Export... aí você escolhe uma das opções disponíveis que aparecerá numa 'janela' onde, logo abaixo do nome tem a opção 'Salvar como' e ao lado você terá que clicar para ver as opções.
Excluir