O que exatamente é um "pixel"?

"Pixel" sempre me confunde sempre que faço trabalhos de banner na web.

Eu uso o CorelDraw x5 para o meu trabalho. Normalmente, prefiro usar polegadas em vez de pixels, pois as polegadas são muito intuitivas para mim. Mas quando eu faço uma conversão "Polegada para Pixel", fico confuso.

• Em CorelDraw: 1 inch = 300px.

• No AuctionRepair.com : 1 inch = 75 pixels.

• No UnitConversion.org : 1 inch = 96 pixels.

Agora, meu cliente está solicitando um banner de 1900x1200px. Como devo fazer a conversão?

Pense no pixel como um átomo. O átomo é uma menor partícula de matéria. Onde como pixel é a menor partícula de imagem digital.

Um átomo possui nêutrons, prótons e elétrons, enquanto um pixel possui valores vermelhos, verdes e azuis :)

O número de pixels por polegada ou centímetro (cm) etc. é chamado de "resolução".

Uma resolução mais alta significa mais pixels por unidade de comprimento.

Se você está projetando para web / desktop, pode dizer 1 Inch = 72 pixels

Para impressão offset (geralmente é usada resolução de 300), você pode dizer 1 inch = 300 pixels

A resolução de impressão é chamada de DPI, que significa "pontos por polegada". Pixels são os pontos. Quanto maior o número de pontos, mais fino será o resultado da impressão.

Agora, meu cliente está solicitando um banner de 1900x1200px. Como devo fazer a conversão?

Se o seu cliente está fornecendo as dimensões em pixels, deve ser algo para desktop / web e você pode projetá-lo em resolução 72.

Se ele precisar de algo para imprimir, você deverá solicitar a resolução ou o tamanho em polegadas, cm etc.

Se um cliente meu pediu uma imagem 1920x1080px, a primeira coisa que preciso saber é o uso pretendido. É para a web, impressão ou ambos?

No mundo da impressão, um pixel (ou elemento de imagem - [pict-el]) não tem significado ou definição. Os pixels não podem ser medidos de forma alguma. Eles não têm tamanho ou unidade predefinidos para calcular seu tamanho. Portanto, não é um termo do "mundo real". Eles são estritamente um termo digital e se referem apenas ao mundo digital.

No sentido amplo, um pixel é o pequeno ponto na tela ou monitor colorido pela luz, com luz de fundo (CRT), LED, plasma ou outras tecnologias. Cada um desses pequenos pontos de cores diferentes (pixels), quando juntos, formam uma imagem para o olho humano. Para usar uma analogia do mundo real, pense nela como uma parede de tijolos ... cada pixel seria um tijolo ... a imagem seria a parede.

Em muitos aplicativos e para muitas pessoas, 1 pixel = 1 ponto. (A Adobe até usa essa teoria.) No entanto, isso também não é totalmente preciso. Um ponto é simplesmente a menor unidade de medida usada pela maioria dos designers no mundo real, em oposição ao mundo digital.

Não existe uma polegada = 72px ou qualquer coisa remotamente próxima. Cada tela na Terra tem uma densidade de pixels diferente . Quantos pixels cabem em uma polegada depende inteiramente da densidade de pixels do seu monitor.

Ao trabalhar no Photoshop para a Web, o que você insere no Resolutioncampo para um novo documento é em grande parte irrelevante. Uma imagem destinada à Web (ou tela) utilizará sua largura e altura de pixel e não fará referência à configuração de Resolução. Veja aqui para obter mais informações sobre resolução (ppi) e a web / tela: É obrigatório manter as imagens em 72DPI para web design? Para a web, a única diferença que o campo de resolução oferece é que permite criar trabalhos mais detalhados no Photoshop. Mas na saída, o campo de resolução é ignorado, usando Save for Web. Se você usar, Exportem vez Save for Webdisso, a resolução será usada para alterar a largura e a altura da imagem com base no seu sistema operacional.de todas as coisas. Os aplicativos Macintosh assumem que cada polegada possui 72 pixels e o aplicativo Windows assume que cada polegada possui 96 pixels. Nenhuma delas é realmente precisa ou verdadeira, mas os engenheiros tiveram que usar alguma coisa . Portanto, uma resolução mais alta Exportresultará em uma largura e altura de pixel maiores.

Agora, onde a impressão encontra pixels ..... resolução ou pontos por polegada (DPI). DPI é essencialmente a densidade de pontos criada por um editor de imagens (ou fabricante de chapas) ao imprimir chapas de impressão. Todas as imagens impressas precisam passar por processos de meio - tom . Além de uma tela de linha específica ou Linhas por polegada (LPI), que determina quantas linhas de pontos serão impressas. A densidade dos pontos no meio-tom determina o nível de detalhe e qualidade na própria imagem. Um meio-tom com um DPI e um LPI mais altos parecerá muito melhor do que um meio-tom com um baixo DPI e um LPI baixo. Se estiver pesquisando alguma correlação entre tela e impressão, o local mais comum para o usuário encontrar um pouco de lógica é pensar que 1 pixel = 1 ponto. Isto não étotalmente preciso, mas está próximo o suficiente para que não seja um problema se essa suposição for usada. É aqui que as pessoas trocam os termos PPI e DPI, pensando que são a mesma coisa. Na realidade, eles não são os mesmos, mas não há grande mal em pensar que são.

Para trabalhos de impressão, o Resolutioncampo na nova janela de documentos do Photoshop é crítico. Na maioria das vezes você deseja uma resolução de 260 ou superior para imagens impressas. Isso equivale a 260DPI, que é a configuração ideal para 175LPI (uma tela de linha comum). 300 dpi são usados ​​com mais freqüência porque é um número redondo uniforme e agradável de lembrar e mais DPI nunca é um problema. O cálculo geral é na verdade 1,5 vezes o LPI igual ao DPI. Então 1,5 x 175 = 262,5. Portanto, é arredondado para 300 dpi.

Se você conhece o uso pretendido .....

• Se for para a web ou para a tela, basta criar um novo documento em 1920x1080px e com a resolução desejada. Uma resolução maior permitirá um trabalho mais detalhado no Photoshop, mas não alterará a saída da Web / tela da imagem. Independentemente da resolução (ppi), a imagem ainda será exibida em 1920x1080 pixels (usando Salvar para a Web).

• Se a imagem for impressa ou ambas, eu usaria o Photoshop para me dar uma idéia do tamanho físico quando impresso. Simplesmente crie um novo documento com as medidas 1920x1080 e insira 300 para a resolução.

Agora mude os "pixels" suspensos para Polegadas:

Isso está usando a teoria interna 1px = 1pt da Adobe, que é tão boa quanto qualquer outra. Mas dá uma idéia geral de que a imagem terá aproximadamente 6,5 "x3,5". Em seguida, eu verificava com o cliente se uma imagem de 6,5x3,5 "atende às suas necessidades.

Oi cliente

Uma imagem de 1920x1080 pixels equivale a aproximadamente 6,5x3,5 polegadas para a produção impressa. Esse tamanho vai funcionar para você? Devo ir maior para impressão?

Obrigado!

Existe um artigo sobre ciência da computação (memorando realmente divertido) intitulado "Um pixel não é um quadrado pequeno" de Alvoy Ray Smith.

Um pixel é uma amostra pontual . Existe apenas em um ponto. Para uma imagem colorida, um pixel pode realmente conter três amostras, uma para cada cor primária, contribuindo para a imagem no ponto de amostragem. Ainda podemos pensar nisso como uma amostra pontual de uma cor. Mas não podemos pensar em um pixel como um quadrado - ou qualquer coisa que não seja um ponto.

Um pixel não é um pequeno quadrado,
um pixel não é um pequeno quadrado,
um pixel não é um pequeno quadrado!
(E um Voxel não é um pequeno cubo)

O termo "pixel" é a abreviação de "elemento de imagem".

Uma imagem consiste em pixels, que são apenas pontos coloridos em um retângulo, sem tamanho .
Para mostrar a imagem, usamos uma tela que mostra pontos coloridos e precisamos decidir quais pontos queremos mostrar onde .

Observando os detalhes, a imagem consiste em pontos separados, cada um com uma cor separada. Como quando você preenchia as caixas em papel quadrilátero com cores, uma em cada caixa. Exceto - importante - que não há papel (que tenha um tamanho) e que as caixas não tenham tamanho físico. É apenas sobre qual ponto de cor está abaixo ou à direita de qual outro .

Se você pensa no tamanho da imagem na tela, é como mostrar esse "papel" na tela - mas não temos idéia de quão "grande" ela é, em termos de polegadas ou mm.

Quando queremos exibir a imagem na tela, vemos que a tela também possui "caixas" que podem mostrar cores. Ambos são chamados de pixels - mas tecnicamente eles são algo diferente.

A coisa mais simples que podemos fazer é atribuir a cada uma das caixas coloridas o "papel" a uma caixa colorida na tela.
Então, o tamanho da tela, em centímetros reais reais, depende do tamanho desses pontos da tela .

Se precisarmos de um determinado tamanho, podemos fazer algo diferente:
podemos apenas decidir qual será o tamanho da imagem . Precisamos saber o tamanho dos pontos da tela. Em seguida, para cada linha, podemos calcular quantos pontos da tela podemos usar para nossos pontos coloridos. Para ajustá-lo, se tivermos mais pontos na tela do que pontos coloridos, precisamos usar alguns pontos coloridos várias vezes ou, se tivermos menos, deixar alguns de fora.

Mais uma confusão para concluir a discussão:

No design e no layout do site, um "pixel CSS" é sempre igual a 1/96 de uma "polegada CSS" , independentemente da resolução da tela. Isso foi feito porque muitos sites antigos usavam medidas baseadas em pixel para o layout, assumindo uma resolução de tela padrão. Para que o tamanho real do texto e outros conteúdos permaneçam consistentes, os navegadores da Web encontram uma conversão aproximadamente uniforme entre os pixels da tela e as unidades de "px" do layout e ajustam sua interpretação de polegadas para que haja sempre uma proporção consistente entre "px" e " em". O mesmo vale para todas as unidades baseadas em polegadas, como "pt" para a fonte - o tamanho da fonte de 12 pontos é sempre igual ao tamanho da fonte de 16 pixels .

Agora que as resoluções de tela são geralmente muito melhores que 96px por polegada, o conceito de "pontos" foi emprestado do mundo da impressão para falar sobre a resolução física real da tela. Existe até uma unidade de pontos por pixel (dppx) para descrever a resolução física proporcional ao pixel CSS padrão. Por exemplo, as novas telas do Mac e iPhone "Retina" têm resolução de 2dppx.

Para sua situação, eu ecoo o conselho de outras pessoas: peça ao seu cliente que esclareça o que é necessário. Dito isto, geralmente se alguém está pedindo arte com medição de pixels, está usando-a em sites. Crie sua imagem exatamente com as dimensões de pixel solicitadas e defina seu software de edição de imagens para usar uma resolução de 96 dpi, a fim de dispor suas réguas e tamanho do texto nas unidades que você se sentir confortável.

Dito isto, pode não ser necessário criar sua imagem com o dobro da resolução (ou seja, 192 dpi), para ter uma versão adequada para as telas Retina, se o cliente descobrir que deseja. Em seguida, seu software de imagem deve ter uma maneira fácil de salvar sua imagem em uma resolução mais baixa e em um tamanho menor de arquivo. É muito fácil converter uma imagem em uma resolução mais baixa que o contrário!

Polegadas são dimensões físicas, enquanto pixels são dimensões da tela. Na mesma resolução, um pixel é fisicamente maior em uma tela maior, pois a densidade ou PPI (pixels por polegada) é controlada pelo tamanho físico da tela versus a resolução. Portanto, ao converter pixels em polegadas, tudo se resume ao que você deseja que seus pixels por polegada (PPI) sejam. Se você deseja 300ppi (padrão para impressão), está simplesmente dizendo "espremer 300 pixels em uma polegada do mundo real". Isso resulta em uma qualidade mais densa do que se você estivesse solicitando 72ppi, pois menos pixels é igual a menos informações de qualidade amontoadas nessa polegada.

As telas geralmente são consideradas 72ppi, mas isso é apenas um padrão e é completamente irrelevante para o tamanho real da tela. A mesma resolução 1920x1080 pode ser 10ppi na tela do estádio ou 400ppi em um telefone móvel.

Um pixel não tem correlação com medidas do mundo real. Como tal, não há como converter polegadas em pixels de maneira consistente. Tudo é arbitrário e depende do que você está fazendo com a imagem em que ele termina.

O que é um pixel no contexto de uma imagem digital? É o menor elemento único da imagem. Ele terá uma cor atribuída a ele. Literalmente, refere-se a um "elemento de imagem" individual .

Imagine que você tem uma lâmpada que pode ser ligada e desligada. Esta é basicamente uma tela de 1x1 pixel, onde a lâmpada é o pixel. Agora compre mais algumas lâmpadas e organize-as de forma quadrada 10x10. Se você conectá-los de uma maneira que você possa ativar e desativar cada um deles como desejar, você terá uma tela com 10x10 "pixels". Você pode até desenhar formas básicas nele.

Agora, se você se afastar o suficiente dessa exibição de lâmpada, o olho não poderá mais distinguir entre essas lâmpadas individuais e tudo o que verá será uma forma contínua, em vez de pixels individuais. Isso acontece, porque o olho tem uma resolução limitada de digitalização; se houver mais pontos (lâmpadas) por polegada do que o olho pode reconhecer, os pixels se transformarão em uma imagem. A resolução dos seus olhos é de cerca de 300 pontos por polegada (DPI). Se você usar uma lupa e observar seu monitor, verá que ele também é composto por pequenas lâmpadas (LCDs), e muito mais. Cerca de 2.073.600 (1920x1080) em uma tela full HD, três vezes, pois existe uma para cada cor RGB que seus olhos simplesmente não conseguem ver, pois são muito pequenos.

Agora, obviamente, o que seu olho pode perceber como pontos individuais ou não depende não apenas da disposição dos pontos (quão próximos eles estão juntos), mas também da distância que você está daquela "tela". É por isso que DPI é um termo relativo de várias maneiras. Se você pegar a mesma tela e se aproximar demais, poderá ver os pixels. Se você estiver muito longe, não poderá mais ler o que está na tela, mesmo que o DPI e a resolução (quantidade de pixels) nunca tenham mudado.

Por esse e vários outros motivos, durante a criação dos primeiros monitores de computador, foi escolhida uma resolução padrão de 72 DPI (Apple) ou 96 DPI (Microsoft). Esse é um bom compromisso entre a distância que o usuário espera estar longe da tela e as limitações técnicas dessa idade. Mas ainda hoje, a maioria das telas segue essa resolução aproximadamente. É por isso que quanto maior a tela, maior a quantidade de pixels.

Agora, se você conhece a resolução de DPI do seu monitor, é muito fácil descobrir quantos pixels existem em cada polegada quadrada. Se, por exemplo, você deseja desenhar um quadrado de 1 x 1 polegada² em um monitor, é possível determinar facilmente quantos pixels essa imagem deve ter (72x72 ou 96x96). Mas também é óbvio que essa imagem será maior ou menor em outras telas com resolução de DPI diferente. O texto legível em uma tela de 24 "a 96 DPI pode ser muito pequeno em um iPhone de 4" a 300 DPI, porque esses 96 pixels (1 polegada) nos 24 "são apenas alguns milímetros no telefone.

Portanto, se o seu cliente solicitar que você crie uma imagem em 1900x1200 px, as primeiras perguntas deverão ser: para qual dispositivo?

Para resolver o dilema de páginas da Web ou aplicativos que deveriam ter boa aparência em diferentes dispositivos, foram inventados formatos que não funcionam com pixels, mas com um comprimento em cm ou mm. A imagem resultante é renderizada de acordo com os recursos do dispositivo, garantindo que um quadrado de 10 x 10 cm ainda seja 10 x 10, independentemente da tela em que é exibida. Mas esse formato obviamente não pode ser um formato de pixel, mas será um formato vetorial .

Embora isso resolva o problema do Mac / Windows / Outros, ele não resolverá uma enorme diferença de tamanho. Seu exemplo de imagem terá 10 x 10 cm em cada dispositivo, mas isso pode cobrir a tela inteira em um telefone celular. Esse problema ainda não está totalmente resolvido, mas a maioria das empresas possui alguma forma de solução para ele. Mas, na maioria dos casos, é necessário desenvolver pelo menos duas páginas, uma para desktop padrão, outra para celulares e, eventualmente, outra para tablets.

Já existem várias respostas úteis, mas talvez eu queira explicar isso de uma maneira diferente.

Ao solicitar uma imagem de 1900 x 1200 pixels, seu cliente não está realmente dizendo nada sobre as dimensões necessárias. Esquecendo a palavra "pixels" por um momento, o cliente está simplesmente dizendo a quantidade de detalhes que eles precisam (por exemplo, a resolução). Eles podem simplesmente pretender dimensioná-lo , conforme necessário.

Se você precisar usar polegadas para seus próprios fins, uma vez que você acha que é mais fácil lidar com essas medições durante o desenvolvimento de seus gráficos, basta usá-las. Usando gráficos vetoriais (o Corel Draw é uma ferramenta vetorial), felizmente, você não precisa se preocupar muito com pixels até chegar a hora de salvar imagens achatadas.

Para estar seguro, comece com um tamanho de tela com a mesma proporção: 1900x1200 é uma proporção de 16:10, portanto, 16 polegadas por 10 polegadas devem funcionar. Quando chegar a hora de salvar ou exportar uma imagem achatada (uma "varredura" ou bitmap), você pode escolher as dimensões de pixel de 1900x1200.

Como não conheço especificamente o Corel, não sei exatamente como inserir essas configurações, mas é provável que elas estejam lá.

Quanto ao "o que é um pixel" , a resposta que diz ser semelhante a um "átomo" é muito boa. Embora se quisermos ser completamente anal, poderíamos dizer com mais precisão que um pixel é uma molécula :

Uma molécula é a menor parte de uma substância que ainda exibe as propriedades dessa substância e um pixel é a menor parte de uma cor que ainda exibe essa cor específica . Ficando menor que isso, você começa a ver as outras cores que foram misturadas para atingir a cor de destino.

Os pixels podem ser espaçados de várias formas, portanto, não representam nenhuma dimensão real. Na impressão, eles podem ter 300 pontos por polegada (DPI); nesse caso, os pixels estão muito próximos - ou, na tela, podem ter 72 DPI, o que significa que estão mais afastados. Eu tenho que assumir que 1900x1200 é destinado a uma tela, a propósito, já que é uma das resoluções de tela padrão. Nesse caso, ele terá a mesma aparência, não importa quantas polegadas em suas dimensões, desde que seja exibido em tela cheia em um monitor de 1900x1200.

Para encerrar, a dimensão de pixel, tecnicamente falando, informa apenas quanta informação a imagem armazenada conterá. Quanto ao tamanho , parecerá basicamente nada por si só.

TL; DR Faça a conversão ao exportar sua imagem do Corel Draw para um arquivo .tif.

Há duas maneiras de descrever uma imagem em um computador: bitmaps (também conhecidos como rasters ) e vetores. Um bitmap é uma grade de coordenadas, cada uma com uma cor específica e cada ponto é um pixel. A combinação de todos os pontos na grade cria uma imagem. Fotos são bitmaps; os pixels correspondem ao grão do filme ou aos pontos no sensor. Os pixels não têm tamanho intrínseco: podem ser muito pequenos em uma imagem impressa a laser ou muito grandes em uma tela gigante. O tamanho de uma imagem em pixels informa sobre a resolução na qual ela ficará suave. Imagens com alta densidade de pixels (pontos por polegada, dpi) parecem nítidas, enquanto as imagens com baixa densidade de pixels parecem irregulares. Para ver a diferença, compare o Flickr com o Minecraft. A ampliação de uma imagem de bitmap faz com que os pixels pareçam maiores e a imagem se torna mais bloqueada e menos nítida.

Vetores são descrições matemáticas de formas organizadas em uma imagem. Eles também não têm tamanho intrínseco, mas a maneira como eles se comportam é diferente. A aparência de um gráfico vetorial não muda à medida que você aumenta o zoom, porque é recalculado para corresponder à tela.

O Corel Draw é um programa de gráficos vetoriais, e as imagens que você cria são, portanto, vetores. Se o seu cliente deseja uma imagem de 1900 x 1200, será necessário convertê-la em um bitmap ao exportá-la. O principal é que o tamanho do vetor e o tamanho do bitmap sejam independentes. Você pode criar um arquivo do Corel Draw de três por três metros e exportá-lo como uma imagem de 400 x 300 pixels. Ou um arquivo com uma polegada quadrada no Corel Draw pode ser exportado como um bitmap com 10.000 pixels quadrados. No entanto, em vez de solicitar dimensões de pixel, os programas normalmente solicitam que você especifique um tamanho e uma resolução para o bitmap, embora você possa alterar as unidades para pixels. Isso permite garantir que o arquivo tenha uma resolução razoável no tamanho desejado. Ao solicitar uma resolução específica, seu cliente deseja garantir que eles possam usar a imagem em um tamanho de tela grande ou pequeno. A idéia de uma imagem digital com tamanho físico é meio estranha, mas é mais fácil trabalhar com a jusante.

Portanto, faça seu gráfico com o tamanho que desejar e especifique o tamanho do pixel no final ao exportá-lo. Uma coisa a se observar é que, se você incluir qualquer imagem de bitmap no gráfico, elas precisarão ter pelo menos a resolução mais alta que a imagem final. Portanto, se metade da largura do gráfico for uma foto, ela precisará ter 950 pixels de largura.

Pixels em CSS (e não como propriedade técnica de uma mídia de exibição) são unidades de largura angular aparente. Portanto, é possível converter pixels, mas apenas em graus, radianos, etc. Você pode converter um pixel em uma polegada, mas precisa saber a que distância a polegada está.

Sean B. Palmer tem uma boa página sobre isso:

A lua da Terra tem cerca de 24,3 px de largura, por exemplo. A Torre Eiffel a uma milha de distância tem cerca de 550,5px de altura. Isso significa que, quando você faz "{width: 24.3px}" no CSS 2.1, está criando algo tão largo quanto a lua parece.

Um pixel é o menor ponto em uma imagem. Não possui tamanho físico. Ele obtém um quando você especifica a resolução em DPI (pontos por polegada) ou unidade semelhante e a processa em um dispositivo que respeite essa resolução.

Na prática, há muitas ocasiões em que o tamanho é arbitrário porque o designer ou o software não se importava / não sabia sobre o tamanho / resolução da tela e / ou aplicou um fator de redimensionamento para caber na superfície disponível.

Lembre-se: um pixel não tem tamanho predefinido. Ao contrário de uma paica.

O PSD Tuts tem um vídeo que explica a relação entre pixels aqui

Píxeis

Pixel é a menor forma de exibir design para uma unidade de exibição. Ex: Um monitor de exibição consiste em vários pixels que formam uma exibição na tela.