Solução para Illustrator CC lento, e Dreamweaver CC sem “properties”

Comecei a usar o Adobe Creative Cloud. É fantástico ter todos os softwares da Adobe, que são muito bons, sem ter que escolher um pacote com menos softwares por causa do preço. É verdade que o valor da assinatura ainda é um pouco salgado, mas creio que a tendência seja diminuir, em virtude do grande número de associados (assim espero). As vantagens extras, como o Behance e uso de fontes adicionais, além de sempre ter os programas atualizados também são excelentes.

Bom também é o suporte Adobe. Recentemente tive um problema com meu Illustrator. Instalei o pacote CC e tudo funcionou sem problemas. Até que ficou disponível uma atualização na nuvem. Após esta atualização (para versão 17), o Illustrator apresentou alguns problemas. Trabalhando com Mac, o comando “Quit” não funcionava, sendo sempre necessário usar “Force Quit”. Outro problema foi um “delay” em todos os comandos que eu realizava. Por exemplo, ao mover um objeto, nada acontecia. Quando eu “deletava” este objeto, era realizado o comando anteiror e ele se movia.

Entrei na “Adobe Community” e relatei o meu problema (veja aqui). Rapidamente recebi uma resposta afirmando ser necessário instalar as fontes Verdana e Tahoma, e tudo isso se resolveria. A princípio achei estranho, pois tinha certeza que essas fontes estavam instaladas. Mesmo assim eu as instalei novamente. Para minha surpresa elas não apareceram como “duplicadas” no Font Book. E o problema foi solucionado.

Além disso, eu tinha outro problema com meu Dreamweaver. Quando um elemento era selecionado, nada aparecia no barra de “Properties”. Instalando as fontes, esse problema também foi resolvido.

Modo de cores em imagens

Saber trabalhar com o ‘modo de cores’ de uma imagem é tão importante quanto saber utilizar a resolução correta. Existem vários ‘modos de cores’ para se usar em uma imagem, vamos aos mais conhecidos:

Cores em CMYK
São as 4 cores de escala de gráfica. Toda imagem colorida a ser impressa em off-set deve estar com cores em CMYK.
[DICA: não apenas as imagens, mas todas as cores usadas no documento que não serão "especiais" devem estar em CMYK].
CMYK é a sigla em inglês para as 4 cores: Cyan (azul), Magenta, Yellow (amarelo) e Black (preto). Você pode estar se perguntando o por quê do preto (em inglês black) ser representado pelo K em vez do B. Um dos motivos é porque o preto é considerado a cor chave (Key), onde as demais cores são alinhadas a partir dela. Já ouvi falar também que se fosse usado “B” para o preto, poderia ser confundido com Blue (azul). Estas 4 cores formam todas as outras cores, a partir da porcentagem de cada uma. Por exemplo, o vermelho vivo possui 100% de magenta e 100% de amarelo (0% das demais cores). 0% de todas as cores formam o branco (ou a cor do papel) e 100% de todas as cores formam um preto total (que acaba sendo até mais forte que apenas o 100% preto, por estar “calçado” pelas outras cores).

Cores em RGB
Este padrão de cores está relacionado às cores e um monitor, que trabalha com Red, Green e Blue (vermelho, verde e azul), daí sua sigla. A diferença das cores de RGB para CMYK , é que ele trabalha como luz, ou seja, 0% de todas as cores formam o preto e 100% de todas as cores formam o branco. Quando um arquivo está em RGB, podemos aplicar mais efeitos e filtros em softwares como Photoshop, e mesmo pintar com várias técnicas, como por exemplo no Painter. Apenas não esqueça de converter a imagem final para CMYK se a saída for off-set. Se a imagem for usada em veículos eletrônicos, a cor usada é o RGB, pois oferece mais brilho, cores mais vivas (principalmente tons de azul), pois o modo de cor é o mesmo usado pelo monitor.

Tons de Cinza (grayscale)
Os tons de cinza são as porcentagens do preto, que variam de 0% (branco) até o 100% (preto). Basicamente, uma imagem em garyscale possui apenas uma cor, com variações desta mesma cor, que no seu monitor aparecerá como preto. Mas se esta mesma imagem for importada em um software como Illustrator ou InnDesign, você pode aplicar uma cor a ela, e a imagem terá apenas os tons da cor aplicada. Esta é uma tática usada quando o material produzido possui apenas uma cor, que pode não ser o preto.

Bitmap
Ao contrário dos tons de cinza, uma imagem com modo bitmap não tem variações (porcentagens) da cor. A imagem é representada apenas com preto e branco, ou seja, pixel COM cor, pixel SEM cor. A quantidade de pixels próximos e/ou afastados é que formam as tons da imagem. Uma boa analogia é um desenho feito com “pontilismo”, onde usa-se apenas o ponto preto para representá-la.

Duotone
Quando uma imagem está com tons de cinza, no photoshop é possível se usar “duotone”. Com o duotone, você pode utilizar de 2 a 4 cores para representar uma imagem, criando imagens duotônicas (duas cores), tritônicas (três cores) e quadritônicas (quatro cores). Se a saída for em off-set, e não possuir cores especiais, você deve converter a imagem finalizada para CMYK. Além disso, imagens com modo de cor duotone só podem ser salvas como PDF, PSD e EPS, então talvez você precise converter o final para RGB se desejar usá-las como JPG ou PNG.

Index color (cores indexadas)
Antigamente, quando a maioria das pessoas usavam internet por acesso discado, era essencial que as imagens tivessem o menor peso possível em termos de memória. Uma imagem colorida com cores indexadas deixa o arquivo menor, sendo mais rápida sua visualização e com menos bits para transferência e carregamento. Um arquivo com cores indexadas possui uma tabela de cores, onde é armazenada apenas as cores presentes na imagem.

[DICA FINAL: Imagens coloridas devem estar em CMYK para impressão em off-set; e em RGB (ou Index) para uso em internet ou outros veículos digitais.]

Redirecionar Página com HTML

Há pouco tempo precisei de um comando para que uma página HTML pudesse redirecionar automaticamente para outra página. O site de um cliente possuía uma página chamada “produtos.html“. No decorrer de uma atualização, precisei usar alguns comandos e a página precisou ser salva em PHP, passando a se chamar “produtos.php“. O problema é que após anos do site no ar, outros sites e usuários já possuíam o link para a antiga página HTML, e seria um problema se não encontrassem a página anterior e nem mesmo a atual.

Para resolver isso, a solução que encontrei foi simples. Eu mantive o arquivo antigo HTML (produtos.html), com o mesmo nome, mas em branco. Entre as tags HEAD inseri o comando <meta http-equiv=”refresh” content=”1″; url=”produto.php”>

Com esse comando, quem possuía o link antigo é redirecionado à nova página em PHP. O número 1, em content, significa que o redirecionamento acontece após um segundo.

Como evitar SPAM nos comentários do seu Blog (WordPress)

Spans não vêm apenas em e-mails. Quando se tem um blog, com comentários disponíveis, é comum você receber vários comentários que não são pertinentes a seu post. São spans (propagandas de outros sites, produtos, ou apenas brincadeiras). Isso sempre irrita, pois temos que “moderar” sobre estes comentários, apagando-os, a toda hora, em vez de gastar nosso tempo com comentários verdadeiros.

Geralmente estes spans são gerados por “robôs”, que entram em vários blogs para deixar sua mensagem. Procurei algumas soluções e encontrei um “plugin” que está sendo eficiente até agora. Este plugin gera um “Captcha“, ou seja, aquela imagem com letras e números que você tem que digitar o equivalente em um campo. Isso resolve, pois um “robô eletrônico” não tem olhos para ver a imagem, interpretá-la e digitar o equivalente no campo correpondente (pelo menos, por enquanto). O nome do plugin é “SI Captcha Anti-spam”.

No painel de controle do Worpress, clique em “plugin” e “adicionar novo”.

No campo pesquisar, digite o nome do plugin (SI Captcha Anti-spam). É o primeiro que aparece. Selecione “instalar agora” (como já instalei, na minha imagem aparece como ‘instalado’).

 Selecione “instalar agora”. Depois de instalado, é necessário ativá-lo. Após ativá-lo, você pode configurar as opções, que ficam em plugins (Opções SI Captcha). O plugin é gratuito, mas se você gostou dele e foi útil, pode fazer uma doação ao desenvolvedor.

Resolução de imagens (bitmap)

Saber a resolução certa de uma imagem para um trabalho é muito importante para garantir boa qualidade nos seus projetos. Para internet é preciso adequar qualidade com otimização, ou seja, a imagem deve ser leve e ter boa resolução. Para impressão em gráfica, a qualidade também é relacionada a uma unidade de medida específica, que se muito elevada pode ser desnecessária e “atolar” seu HD, e muito abaixo gera uma impressão ruim.

Quando falamos em resolução de imagem, estamos falando de imagens bitmap. Este tipo de imagem é formada por um conjunto de pixels (o menor ponto de um monitor). Arquivos como JPG, GIF, TIF, PNG, entre outros, contém este “mapeamento de bits”.

Há uma diferença sutil, mas importante entre pixel e ponto. Pixel é a menor unidade de um monitor, seu tamanho é fixo*. Um ponto (dot) é a menor unidade usada na impressão de uma imagem, e seu tamanho é relativo. De modo geral, vemos uma foto no computador através do conjunto de seus pixels e vemos uma foto impressa através do conjunto de seus pontos. Por esta razão, uma foto com muitos pixels pode ficar ruim se a saída for em uma impressora com poucos DPI.

* A visualização do pixel pode ser alterada nas configurações do monitor, onde você escolhe quantos pixels de altura e largura quer que o monitor apresente, mas o pixel continuará tendo o mesmo tamanho para qualquer imagem do seu computador.

DPI (sigla em inglês para ‘dots per inch‘) significa “pontos por polegada”.  Toda imagem impressa é composta por pontos, e é a quantidade destes em uma polegada que define sua qualidade final. Por exemplo, quando temos uma imagem com 100 DPI, significa que em uma polegada existem 100 pontos. Em termos gráficos, quanto maior o número de pontos nesta polegada, menor deverá ser o tamanho deste ponto e consequentemente, a imagem será impressa com uma melhor definição. É possível também medirmos a resolução por centímetro (pontos por centímetro), mas DPI é o mais comum.

[Geralmente associamos DPI (pontos por polegada) e PPI (pixels por polegada) como sendo sinônimos. No ramo gráfico não há mesmo muita distinção entre as 2 nomenclaturas, o que podemos relacionar é DPI a impressão em papel (um ponto de tinta) e PPI a resolução em monitores (um ponto de luz)]

Para internet, uma imagem de boa qualidade terá um mínimo de 72 DPI. Para impressão em gráfica, uma imagem deve ter um mínimo de 300 DPI (há casos onde 250 DPI é possível). Para impressão em plotter (como um banner), 150 DPI é aceitável, mas sempre confirme com seu fornecedor a resolução desejada.

No ramo gráfico, também usamos LPI (‘lines per inch‘), conhecido como “lineatura”. Esta medida indica o número de linhas (com pontos) presentes em uma polegada. Assim como o DPI, quanto maior o número, maior será a resolução.  Esta medida geralmente é usada na saída de um trabalho, ao fechá-lo para impressão, muitas vezes é adicionado automaticamente, conforme o ‘drive‘ usado. Hoje em dia, com envio de arquivos fechados em PDF para gráficas, acabamos deixamos o controle do LPI para o “impressor”.

É importante também saber sobre a relação entre DPI e as dimensões de uma imagem. O DPI é SEMPRE inversamente proporcional às dimensões da imagem. Ou seja, se você amplia uma figura, sua resolução cai, assim como reduzindo suas medidas, o DPI aumenta. Veja o exemplo abaixo, como funciona esta relação:

Note que uma imagem 10 x 10 cm com 300 DPI é exatamente igual a uma imagem 20 x 20 com 150 DPI. DPI e dimensões sempre devem ser observados juntamente. Você pode receber uma imagem com 300 DPI e perceber que ela está em baixa, se ela tiver 10 x 10 cm e você precisar utilizá-la com 30 x 30 cm. Da mesma forma, você pode receber uma imagem com 72 DPI e, antes de reclamar com seu fotógrafo ou fornecedor de imagens dizendo que ela está com pouca resolução, irá perceber que ela está com 125 x 125 cm, ideal para se usar com 30 x 30 cm.

Um dos erros mais comuns quando se trata de resolução é aumentar o DPI via software, sem alterar as dimensões da imagem. Isso não a deixa com mais definição, pois o ponto dela já está desenhado e será ampliado sem alterar as imperfeições. Há softwares no mercado que tentam corrigir estas perdas dos pontos ao ampliar a resolução via software. Mas recorra sempre a uma imagem feita originalmente com uma resolução maior.

Isso não significa que você nunca possa ampliar a resolução de uma imagem via software. (No Photoshop, basta marcar a opção “Resample Image” na caixa de diálogo “Image Size”). Quando eu faço uma ilustração, primeiramente a desenho a lápis, digitalizo a 150 DPI e envio para o cliente aprovar. Com 150 DPI, a imagem fica com boa visualização e leve para envio via e-mail (grayscale em JPG). Se o cliente a imprimir, estará com qualidade razoável para impressoras a jato de tinta. Com o lápis aprovado, é hora de finalizá-la, através de uma mesa digitalizadora, com o traçado feito digitalmente. Para isso, eu não preciso digitalizar novamente a imagem com 300 DPI. Posso alterá-la via software, aumentando a resolução (e até as dimensões). Em uma nova camada, eu inicio a finalização, que será criada com o arquivo já contendo 300 DPI e o tamanho final desejado. A camada do lápis depois é descartada. Mas lembre-se, a resolução é alterada antes de iniciar a finalização a traço.

Para terminar, podemos também descobrir qual a resolução de uma imagem olhando apenas para suas dimensões, desde que sejam expressas em pixels. Esta não é uma maneira comum no ramo gráfico, sendo mais usual para profissionais que trabalham com imagens digitais, como fotógrafos. Note que monitores e televisores tem sua resolução expressa apenas em pixels. No exemplo mostrado anteriormente, veja que mesmo alterando os DPI e dimensões em cm (mantendo a proporcionalidade), as dimensões em pixels não sofreram alteração.

Este é o mesmo modo que uma câmera digital trabalha com resolução. E se você criar uma imagem nova no Photoshop, usando as dimensões em pixels, perceberá que não importa o valor que será colocado em ‘pixels/inch‘. Depois ele ajusta as medidas em outra unidade de medida conforme o DPI digitado (que você pode conferir posteriormente em Image Size), mas ao criar o arquivo novo em pixels, não é necessário se preocupar com DPI.