Elyézer Rezende » imagem http://elyezer.com Desenvolvimento Web Fri, 23 Dec 2011 10:54:50 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 Convertendo Imagens via Terminalhttp://elyezer.com/convertendo-imagens-via-terminal/?utm_source=rss&utm_medium=rss&utm_campaign=convertendo-imagens-via-terminal http://elyezer.com/convertendo-imagens-via-terminal/#comments Fri, 18 Jul 2008 18:06:32 +0000 Elyézer http://elyezer.com/?p=59 Continue reading →]]> Recentemente fui nomeado como website mantainer do projeto TextFlow (projeto do Yuri Malheiros). Para que eu consiga fazer as mudanças no site utilizo ssh pra acessar o servidor, que foi liberado pelo meu amigo Og Maciel, responsável pela hospedagem do site do projeto.

E ao me deparar com a seguinte sitação: tinha acabado de enviar uma imagem pro servidor e seu tamanho não estava adequado ao layout. Me veio a seguinte questão: é possivel alterar o tamanho de uma imagem utilizando o terminal?

Fazendo essa mesma pergunta pro Google, ele me responde: Sim!

Foi ai que encontrei um artigo no Estúdio Livre falando sobre o assunto.

Para redimensionar uma imgem utilizando o terminal, podemos fazer isso utilizando a ferramenta convert que “converte entre diversos formatos de imagem bem como redimensiona, borra, corta, tira ruído, desenha, roda e mais. O convert usa o ImageMagick para realizar as operações. Digite “man convert” em um terminal para obter mais ajuda.”

Para redimensionarmos uma imagem basta o simples comando:

convert imagem.jpg -scale 50% imagem_pequena.jpg

Onde:

  • convert é nossa ferramenta.
  • imagem.jpg é a imagem original.
  • -scale 50% estamos dizendo para a ferramenta redimensionar a imagem original para 50% do tamanho original.
  • e finalmente imagem_pequena.jpg é o nome do arquivo que conterá a imagem redimensionada.

Com isso pude alterar o tamanho da imagem que não estava de acordo com o layout sem ter que modificar usando um editor de imagens e depois novamente ter que enviar o arquivo pro servidor.

Para maiores detalhes sobre as outras funcionalidades você pude consultar o manual dessa ferramenta utilizando o comando “man convert” ou pode visitar o artigo do Estúdio Livre para alguns exemplos.

[update] Para converter mais de um arquivo basta seguir a dica que o André Noel indicou [/update]

]]> http://elyezer.com/convertendo-imagens-via-terminal/feed/ 6 Modo correto de mostrar tooltip em imagenshttp://elyezer.com/modo-correto-de-mostrar-tooltip-em-imagens/?utm_source=rss&utm_medium=rss&utm_campaign=modo-correto-de-mostrar-tooltip-em-imagens http://elyezer.com/modo-correto-de-mostrar-tooltip-em-imagens/#comments Wed, 03 Oct 2007 12:05:28 +0000 Elyézer http://elyezer.com/modo-correto-de-mostrar-tooltip-em-imagens/ Continue reading →]]> Encontrei este tutorial que aborda o assunto de tooltip em imagens. Ao contrário de que muitos acham, inclusive eu achava, é que o atributo alt incluída dentro da tag img já mostrava como tooltip. Porém o atributo alt tem a semântica de mostrar o texto que lhe foi atribuido em caso da imagem não ser carregada.

Então, o que deve ser feito para mostrar um tooltip em uma imagem? Simples, mantém o atributo alt para que, caso a imagem não seja carregada, mostre o alternate text. E, assim como se faz em links, adicionar o atributo title e atribuir o texto que se deseja como tooltip a esse atributo.

Modo errado de mostrar a tooltip:

<img src="http://imagem.png" alt="Texto mostrado quando a imagem não está disponível" />

Modo correto de mostrar a tooltip:

<img title="Texto do tooltip para esta imagem" src="http://imagem.png" alt="Texto mostrado quando a imagem não está disponível" />

Lembrando que, isso é somente para navegadores que resolveram esse “problema”.

Fonte: ALT and TITLE.

]]> http://elyezer.com/modo-correto-de-mostrar-tooltip-em-imagens/feed/ 0