Qu'est-ce qu'un «pixel» exactement?

"Pixel" m'embrouille toujours lorsque je travaille sur des bannières Web.

J'utilise CorelDraw x5 pour mon travail. Je préfère généralement utiliser les pouces plutôt que les pixels car les pouces sont beaucoup intuitifs pour moi. Mais quand je fais une conversion "Inch to Pixel", je suis confus.

• En CorelDraw: 1 inch = 300px.

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

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

Maintenant, mon client demande une bannière 1900x1200px. Comment dois-je faire la conversion?

Imaginez un pixel comme un atome. L'atome est une plus petite particule de matière. Où en tant que pixel est une plus petite particule d'image numérique.

Un atome a des neutrons, des protons et des électrons alors qu'un pixel a des valeurs rouges, vertes et bleues :)

Le nombre de pixels par pouce ou centimètre (cm) etc. est appelé la "résolution".

Une résolution plus élevée signifie plus de pixels par unité de longueur.

Si vous concevez pour le web / bureau, vous pouvez dire 1 Inch = 72 pixels

Pour l'impression offset (généralement une résolution de 300 est utilisée), vous pouvez dire 1 inch = 300 pixels

La résolution d'impression est appelée DPI, ce qui signifie "points par pouce". Les pixels sont les points. Plus le nombre de points est élevé, plus le résultat d'impression sera fin.

Maintenant, mon client demande une bannière 1900x1200px. Comment dois-je faire la conversion?

Si votre client vous donne les dimensions en pixels, cela doit être quelque chose pour le bureau / le web et vous pouvez le concevoir en résolution 72.

S'il a besoin de quelque chose pour l'impression, vous devez lui demander la résolution ou la taille en pouces, cm, etc.

Si un de mes clients a demandé une image 1920x1080px, la première chose dont j'ai besoin est de savoir l'utilisation prévue. Est-ce pour le Web, l'impression ou les deux?

Dans le monde de l'impression, un pixel (ou un élément d'image - [pict-el]) n'a aucune signification ni définition. Les pixels ne peuvent en aucun cas être mesurés. Ils n'ont pas de taille ou d'unité prédéfinie pour calculer leur taille. Ce n'est donc pas un terme «réel». Ils sont strictement un terme numérique et ne se réfèrent qu'au monde numérique.

Au sens large, un pixel est le petit point sur un écran ou un moniteur qui est coloré par la lumière, soit rétro-éclairé (CRT), LED, Plasma ou d'autres technologies. Chacun de ces petits points colorés (pixels), lorsqu'ils sont assemblés, forme une image à l'œil humain. Pour utiliser une analogie du monde réel, pensez-y comme un mur de briques ... chaque pixel serait une brique ... l'image serait le mur.

Dans de nombreuses applications et pour de nombreuses personnes, 1 pixel = 1 point. (Adobe utilise même cette théorie.) Cependant, ce n'est pas tout à fait exact non plus. Un point est simplement la plus petite unité de mesure utilisée par la plupart des concepteurs dans le monde réel, par opposition au monde numérique.

Il n'y a rien de tel que 1 pouce = 72px ou quoi que ce soit, même à distance. Chaque écran sur terre a une densité de pixels différente . Le nombre de pixels dans un pouce dépend entièrement de la densité de pixels de votre moniteur.

Lorsque vous travaillez dans Photoshop pour le Web, ce que vous saisissez dans le Resolutionchamp d'un nouveau document est largement hors de propos. Une image destinée au Web (ou à l'écran) utilisera sa largeur et sa hauteur de pixel et ne référencera pas du tout le paramètre Résolution. Voir ici pour plus d'informations sur la résolution (ppi) et le web / écran: Est-il obligatoire de conserver les images à 72 DPI pour la conception web? Pour le Web, la seule différence que le champ de résolution offre est qu'il vous permet de créer des travaux plus détaillés dans Photoshop. Mais en sortie, le champ de résolution est ignoré, en utilisant Save for Web. Si vous utilisez Exportplutôt que Save for Webla résolution, celle-ci est utilisée pour modifier la largeur et la hauteur des pixels de l'image en fonction de votre système d'exploitation.de toutes choses. Les applications Macintosh supposent que chaque pouce contient 72 pixels et l'application Windows suppose que chaque pouce contient 96 pixels. Aucun de ces éléments n'est vraiment exact ou vrai, mais les ingénieurs ont dû utiliser quelque chose . Une résolution plus élevée Exportentraînera donc une largeur et une hauteur de pixel plus grandes.

Maintenant où l'impression rencontre les pixels ... la résolution ou les points par pouce (DPI). DPI est essentiellement la densité de points qui est créée par une photocomposeuse (ou un fabricant de plaques) lors de la sortie des plaques d'impression. Toutes les images imprimées doivent passer par un processus de demi - teintes . En plus d'un écran de ligne spécifique ou de lignes par pouce (LPI) qui détermine le nombre de lignes de points à imprimer. La densité des points dans la demi-teinte détermine le niveau de détail et la qualité de l'image elle-même. Une demi-teinte avec un DPI et un LPI plus élevés sera beaucoup mieux qu'une demi-teinte avec un faible DPI et un faible LPI. Si vous recherchez une corrélation entre l'écran et l'impression, l'utilisateur le plus courant trouve un peu de logique en pensant que 1 pixel = 1 point. Ce n'est pasentièrement précis, mais il est suffisamment proche pour que ce ne soit pas un problème si cette hypothèse est utilisée. C'est là que les gens échangent les termes PPI et DPI en pensant qu'ils sont la même chose. En réalité, ils ne sont pas du tout les mêmes, mais il n'y a pas grand mal à penser qu'ils le sont.

Pour les travaux d'impression, le Resolutionchamp dans la nouvelle fenêtre de document de Photoshop est critique. Le plus souvent, vous souhaitez une résolution de 260 ou mieux pour les images imprimées. Cela équivaut à 260DPI, qui est le réglage optimal pour 175LPI (un écran de ligne commun). 300 dpi est utilisé le plus souvent parce que c'est un bon chiffre rond et uniforme à retenir et que plus de DPI n'est jamais un problème. Le calcul global est en fait 1,5 fois l'IPV est égal au DPI. Donc 1,5 x 175 = 262,5. Il est donc arrondi à 300 dpi.

Si vous connaissez l'utilisation prévue .....

• Si c'est pour le web ou l'écran, créez simplement un nouveau document à 1920x1080px et quelle que soit la résolution que vous souhaitez. Une résolution plus élevée va vous permettre un travail plus détaillé dans Photoshop, mais cela ne changera pas la sortie web / écran de l'image. Quelle que soit la résolution (ppi), l'image sera toujours sortie à 1920x1080 pixels (en utilisant Save for Web).

• Si l'image est destinée à l'impression ou aux deux, j'utiliserais Photoshop pour me donner une idée de la taille physique lors de l'impression. Créez simplement un nouveau document avec les mesures 1920x1080 et insérez 300 pour la résolution.

Basculez maintenant la liste déroulante "pixels" en pouces:

Cela utilise la théorie interne 1px = 1pt d'Adobe, qui est aussi bonne que n'importe quelle autre. Mais cela vous donne une idée générale que l'image sera d'environ 6,5 "x3,5". Je vérifierais ensuite auprès du client pour vérifier qu'une image de 6,5 x 3,5 pouces répondra à leurs besoins.

Salut [client],

Une image de 1920 x 1080 pixels équivaut à environ 6,5 x 3,5 pouces pour la production d'impression. Est-ce que cette taille fonctionnera pour vous? Dois-je aller plus grand pour l'impression?

Merci!

Il y a un article sur l'informatique (vraiment, une note amusante) intitulé «Un pixel n'est pas un petit carré» par Alvoy Ray Smith.

Un pixel est un échantillon ponctuel . Il n'existe qu'à un moment donné. Pour une image couleur, un pixel peut en fait contenir trois échantillons, un pour chaque couleur primaire contribuant à l'image au point d'échantillonnage. Nous pouvons toujours penser à cela comme un échantillon ponctuel d'une couleur. Mais nous ne pouvons pas considérer un pixel comme un carré - ou autre chose qu'un point.

Un pixel n'est pas un petit carré,
un pixel n'est pas un petit carré,
un pixel n'est pas un petit carré!
(Et un Voxel n'est pas un petit cube)

Le terme "pixel" est l'abréviation de "élément d'image".

Une image se compose de pixels, qui ne sont que des points colorés dans un rectangle, sans taille .
Pour montrer l'image, nous utilisons un écran qui peut montrer des points colorés et devons décider quels points nous voulons montrer où .

En regardant les détails, l'image se compose de points séparés, chacun avec une couleur distincte. Comme lorsque vous remplissiez les cases sur du papier quadrille avec des couleurs, une dans chaque case. Sauf - important - qu'il n'y a pas de papier (qui a une taille) et que les boîtes n'ont pas de taille physique. Il ne s'agit que de la couleur du point en dessous ou à droite de l'autre .

Si vous pensez à la taille de l'image à l'écran, c'est comme si vous montriez ce «papier» à l'écran - mais nous n'avons aucune idée de sa «grande» taille, en pouces ou en mm.

Lorsque nous voulons afficher l'image à l'écran, nous voyons que l'écran a également des "cases" qui peuvent montrer les couleurs. Les deux sont appelés pixels - mais techniquement, ils sont quelque chose de différent.

La chose la plus simple que nous puissions faire est d'attribuer à chacune de nos boîtes colorées le "papier" à une boîte colorée sur l'écran.
Ensuite, la taille de l'écran, en centimètres réels réels, dépend de la taille de ces points de l'écran .

Si nous avons besoin d'une certaine taille, nous pouvons faire quelque chose de différent:
nous pouvons simplement décider nous-mêmes de la taille de l'image . Nous devons savoir quelle est la taille des points d'écran. Ensuite, pour chaque ligne, nous pouvons calculer le nombre de points d'écran que nous pouvons utiliser pour nos points de couleur. Pour l'adapter, si nous avons plus de points d'écran que de points de couleur, nous devons utiliser plusieurs points de couleur plusieurs fois, ou si nous en avons moins, en laisser de côté.

Encore une confusion pour terminer la discussion:

Dans la conception et la mise en page d' un site Web, un "pixel CSS" est toujours égal à 1 / 96ème d'un "pouce CSS" , quelle que soit la résolution de l'écran. Cela a été fait parce que de nombreux premiers sites Web utilisaient des mesures basées sur les pixels pour la mise en page supposaient une résolution d'écran standard. Pour que la taille réelle du texte et des autres contenus reste cohérente, les navigateurs Web trouvent une conversion approximativement uniforme entre les pixels de l'écran et les unités de mise en page "px", et ajustent leur interprétation des pouces afin qu'il y ait toujours un rapport cohérent entre "px" et " dans". Il en va de même pour toutes les unités basées sur les pouces, telles que "pt" pour la police - la taille de police 12pt est toujours égale à la taille de police 16px .

Maintenant que les résolutions d'écran sont généralement bien meilleures que 96 pixels par pouce, le concept de «points» a été emprunté au monde de l'impression pour parler de la résolution physique réelle de l'écran. Il existe même une unité de points par pixel (dppx) pour décrire la résolution physique proportionnelle au pixel CSS standard. Par exemple, les nouveaux écrans Mac et iPhone «Retina» sont en résolution 2dppx.

Pour votre situation, je fais écho aux conseils des autres: demandez à votre client de clarifier ce qui est nécessaire. Cela dit, généralement, si quelqu'un demande de l'art avec une mesure de pixels, il l'utilise pour des sites Web. Créez votre image exactement aux dimensions en pixels demandées et configurez votre logiciel de retouche d'image pour utiliser une résolution de 96 dpi afin de disposer vos règles et la taille du texte dans des unités que vous êtes à l'aise d'utiliser.

Cela dit, cela pourrait ne pas nuire de créer réellement votre image à une résolution deux fois supérieure (c'est-à-dire 192 dpi), afin d'avoir une version adaptée aux écrans Retina si votre client découvre qu'il le veut. Ensuite, votre logiciel d'image devrait avoir un moyen facile pour vous d'enregistrer votre image à une résolution inférieure et une taille de fichier plus petite. Il est très facile de convertir une image à une résolution inférieure à l'inverse!

Les pouces sont des dimensions physiques tandis que les pixels sont des dimensions d'écran. À la même résolution, un pixel est physiquement plus grand sur un écran plus grand, car la densité ou PPI (pixels par pouce) est contrôlée par la taille physique des écrans par rapport à la résolution. Ainsi, lors de la conversion de pixels en pouces, tout se résume à ce que vous voulez que vos pixels par pouce (PPI) soient. Si vous voulez 300ppi (standard pour l'impression), vous dites simplement "presser 300 pixels dans un pouce réel". Il en résulte une qualité plus dense que si vous demandiez 72 ppp, car moins de pixels équivalent à moins d'informations de qualité entassées dans ce pouce.

Les écrans sont généralement considérés comme 72 ppp, mais ce n'est qu'une valeur par défaut et n'a aucun rapport avec la taille réelle de votre écran. La même résolution 1920x1080 peut être de 10ppi sur un écran de stade ou 400ppi sur un téléphone mobile.

Un pixel n'a aucune corrélation avec les mesures du monde réel. En tant que tel, il n'y a aucun moyen de convertir les pouces en pixels de manière cohérente. Tout est arbitraire et dépend de ce que vous faites pour faire avec l'image à la fin.

Qu'est - ce qu'un pixel dans le contexte d'une image numérique? C'est le plus petit élément unique de l'image. Une couleur lui sera affectée. Littéralement, il se réfère à un "élément d'image" individuel .

Imaginez que vous ayez une ampoule que vous pouvez allumer et éteindre. Il s'agit essentiellement d'un affichage 1x1 pixel, où l'ampoule est le pixel. Achetez maintenant quelques ampoules de plus et arrangez-les en mode carré 10x10. Si vous les câblez de manière à pouvoir allumer et éteindre chacun comme vous le souhaitez, vous disposez d'un écran brut avec 10x10 "pixels". Vous pouvez même dessiner des formes de base dessus.

Maintenant, si vous vous éloignez suffisamment de cet affichage d'ampoule, l'œil ne peut plus distinguer entre ces ampoules individuelles et tout ce que vous verrez est une forme continue au lieu de pixels individuels. Cela se produit, car l'œil a une résolution de numérisation limitée, s'il y a plus de points (ampoules) par pouce que l'œil ne peut en reconnaître, les pixels se transforment en image. La résolution de vos yeux est d'environ 300 points par pouce (DPI). Si vous prenez une loupe et regardez votre moniteur, vous verrez qu'il est également composé de minuscules ampoules (LCD), juste beaucoup plus. Environ 2073600 (1920x1080) sur un écran Full HD, trois fois, car il y en a une pour chaque couleur RVB, que vos yeux ne peuvent tout simplement pas voir, car ils sont trop petits.

Maintenant, évidemment, ce que votre œil peut percevoir comme des points individuels ou non dépend non seulement de la disposition des points (à quel point ils sont rapprochés), mais aussi de la distance à laquelle vous êtes à cet "écran". C'est pourquoi DPI est un terme relatif à plusieurs égards. Si vous prenez le même écran et que vous vous rapprochez trop, vous pouvez voir les pixels. Si vous êtes trop loin, vous ne pouvez plus lire ce qui est à l'écran, même si le DPI et la résolution (quantité de pixels) n'ont jamais changé.

Pour cela et plusieurs autres raisons lors de la création des premiers écrans d'ordinateur, une résolution standard de 72 DPI (Apple) ou 96 DPI (Microsoft) a été choisie. Il s'agit d'un bon compromis entre la distance à laquelle l'utilisateur doit être éloigné de l'écran et les limitations techniques à partir de cet âge. Mais même aujourd'hui, la plupart des écrans suivent approximativement cette résolution. C'est pourquoi plus l'écran est grand, plus le nombre de pixels est élevé.

Maintenant, si vous connaissez la résolution DPI de votre moniteur, il est très facile de déterminer le nombre de pixels dans chaque pouce carré. Si vous voulez par exemple dessiner un carré de 1 x 1 pouce² sur un moniteur, vous pouvez facilement déterminer le nombre de pixels de cette image (72x72 ou 96x96). Mais il est également évident que cette image sera plus grande ou plus petite sur d'autres écrans qui ont une résolution DPI différente. Le texte lisible sur un écran de 24 "à 96 DPI peut être bien trop petit sur un iPhone de 4" à 300 DPI, car ces 96 pixels (1 pouce) sur le 24 "ne font que quelques mm sur le téléphone.

Donc, si votre client vous demande de créer une image à 1900x1200 px, les premières questions devraient être: pour quel appareil?

Pour résoudre le dilemme des pages Web ou des applications qui sont censées bien paraître sur différents appareils, des formats ont été inventés qui ne fonctionnent pas avec des pixels mais avec une longueur en cm ou en mm. L'image résultante est ensuite rendue en fonction des capacités de l'appareil, garantissant qu'un carré de 10x10 cm est toujours de 10x10, quel que soit l'écran sur lequel elle est affichée. Mais ce format ne peut évidemment pas être un format pixel, mais sera un format vectoriel .

Bien que cela résout le problème Mac / Windows / Autre, cela ne résoudra pas une énorme différence de taille. Votre exemple d'image sera de 10x10 cm sur chaque appareil, mais cela pourrait couvrir tout l'écran d'un téléphone mobile. Ce problème n'est pas encore entièrement résolu, mais la plupart des entreprises ont une forme de solution. Mais dans la plupart des cas, vous devez réellement développer au moins deux pages, une pour le bureau standard, une pour les téléphones mobiles et éventuellement une pour les tablettes également.

Il y a déjà un tas de réponses utiles, mais je voulais peut-être expliquer cela d'une manière différente.

En demandant une image de 1 900 x 1 200 pixels, votre client ne vous dit rien sur les dimensions dont il a besoin. Oubliant le mot "pixels" pendant un moment, le client vous dit simplement de combien de détails il a besoin (c'est-à-dire la résolution). Ils peuvent simplement avoir l'intention de le dimensionner eux-mêmes selon leurs besoins.

Si vous devez utiliser les pouces à vos propres fins, car vous trouvez cette mesure plus facile à gérer pendant le développement de vos graphiques, utilisez-les simplement. En utilisant des graphiques vectoriels (Corel Draw est un outil vectoriel), vous n'avez heureusement pas à vous soucier des pixels jusqu'à ce qu'il soit temps d'enregistrer des images aplaties.

Pour être sûr, commencez par une taille de toile du même rapport d'aspect: 1900x1200 est un rapport de 16:10, donc 16 pouces par 10 pouces devraient fonctionner. Lorsque vient le temps d'enregistrer ou d'exporter une image aplatie (un «raster» ou bitmap), vous pouvez choisir les dimensions de 1 900 x 1 200 pixels.

Je ne connais pas spécifiquement Corel, donc je ne peux pas vous dire exactement comment entrer ces paramètres, mais ils sont très probablement là.

Quant à "qu'est-ce qu'un pixel" , la réponse qui a dit qu'il s'apparente à un "atome" est plutôt bonne. Bien que si nous voulons être complètement anaux, nous pourrions dire plus précisément qu'un pixel est une molécule :

Une molécule est la plus petite partie d'une substance qui présente encore les propriétés de cette substance, et un pixel est la plus petite partie d'une couleur qui présente encore cette couleur particulière . Plus petit que cela, vous commencez à voir les autres couleurs qui ont été mélangées afin d'atteindre la couleur cible.

Les pixels peuvent être espacés de toutes sortes de façons, donc ils ne représentent aucune dimension réelle. En impression, ils peuvent être de 300 points par pouce (DPI), auquel cas les pixels sont très proches les uns des autres - ou à l'écran, ils peuvent être de 72 DPI, ce qui signifie qu'ils sont plus éloignés. Je dois supposer que 1900x1200 est destiné à un écran, soit dit en passant, car c'est l'une des résolutions d'écran standard. Dans ce cas, il aura la même apparence, peu importe le nombre de pouces dans ses dimensions, tant qu'il est affiché en plein écran sur un moniteur 1900x1200.

Pour couronner le tout, la dimension en pixels, techniquement parlant, ne vous indique que la quantité d'informations que l'image stockée contiendra. Quant à la façon grand il regarder , il vous indique fondamentalement rien lui - même.

TL; DR Effectuez la conversion lorsque vous exportez votre image Corel Draw vers un fichier .tif.

Il existe deux façons de décrire une image sur un ordinateur: les bitmaps (également appelés rasters ) et les vecteurs. Un bitmap est une grille de coordonnées qui ont chacune une couleur spécifique, et chaque point est un pixel. La combinaison de tous les points de la grille crée une image. Les photos sont des bitmaps; les pixels correspondent au grain du film ou aux points sur le capteur. Les pixels n'ont pas de taille intrinsèque: ils peuvent être très petits dans une image imprimée au laser, ou très grands sur un écran géant. La taille d'une image en pixels vous indique la résolution à laquelle elle sera lisse. Les images avec une densité de pixels élevée (points par pouce, dpi) sont nettes, tandis que celles avec une faible densité de pixels sont en blocs. Pour voir la différence, comparez Flickr à Minecraft. L'agrandissement d'une image bitmap fait apparaître les pixels plus gros et l'image devient plus bloquante et moins nette.

Les vecteurs sont des descriptions mathématiques de formes disposées dans une image. Ils n'ont pas non plus de taille intrinsèque, mais la manière dont ils se comportent est différente. L'apparence d'un graphique vectoriel ne change pas lorsque vous effectuez un zoom avant, car il est recalculé pour correspondre à l'écran.

Corel Draw est un programme de graphiques vectoriels, et les images que vous créez sont donc des vecteurs. Si votre client veut une image 1900x1200, vous devrez la convertir en bitmap lorsque vous l'exporterez. L'essentiel est que la taille du vecteur et la taille du bitmap soient indépendantes. Vous pouvez créer un fichier Corel Draw de huit pieds sur six et l'exporter en tant qu'image 400x300 pixels. Ou un fichier d'un pouce carré dans Corel Draw peut être exporté en tant que bitmap de 10 000 pixels carrés. Cependant, plutôt que de demander des dimensions en pixels, les programmes vous demandent généralement de spécifier une taille et une résolution pour le bitmap, bien que vous puissiez changer les unités en pixels. Cela vous permet de vous assurer que le fichier aura une résolution raisonnable à la taille souhaitée. En demandant une résolution particulière, votre client veut s'assurer qu'il peut utiliser l'image sur un grand écran ou une petite taille d'impression. L'idée d'une image numérique ayant une taille physique est assez étrange, mais il est plus facile de travailler avec en aval.

Faites donc votre graphique à la taille que vous souhaitez, puis spécifiez la taille des pixels à la fin lorsque vous l'exportez. Une chose à surveiller est que si vous incluez des images bitmap dans le graphique, elles devront avoir une résolution au moins aussi élevée que dans l'image finale. Donc, si la moitié de la largeur de votre graphique est une photo, cette photo doit avoir une largeur de 950 pixels.

Les pixels en CSS (et non en tant que propriété technique d'un support d'affichage) sont des unités de largeur angulaire apparente. Il est donc possible de convertir des pixels, mais uniquement en degrés, radians, etc. Vous pouvez convertir un pixel en pouce, mais vous devez savoir à quelle distance le pouce est.

Sean B. Palmer a une belle page à ce sujet:

La lune de la terre mesure environ 24,3 pixels de large, par exemple. La Tour Eiffel à un mile de distance mesure environ 550,5 px. Cela signifie que lorsque vous effectuez «{width: 24.3px}» dans CSS 2.1, vous créez quelque chose d'aussi large que la lune semble l'être.

Un pixel est le plus petit point d'une image. Il n'a pas de taille physique. Il en obtient un lorsque vous spécifiez la résolution en DPI (points par pouce) ou unité similaire, et que vous la restituez sur un appareil qui respecte cette résolution.

Dans la pratique, il existe de nombreuses occasions où la taille est arbitraire car le concepteur ou le logiciel ne se souciait pas / ne connaissait pas la taille / la résolution de l'affichage et / ou appliquait un facteur de redimensionnement pour s'adapter à la surface disponible.

N'oubliez pas: un pixel n'a pas de taille prédéfinie. Contrairement à un pica.

PSD Tuts a une vidéo qui explique la relation entre les pixels ici

Pixels

Le pixel est la forme la plus petite pour afficher la conception d'une unité d'affichage. Ex: Un moniteur d'affichage se compose de plusieurs pixels qui forment un affichage sur votre écran.