Skip to main content
Participating Frequently
November 12, 2022
Question

Résolution Photoshop CC par rapport au web

  • November 12, 2022
  • 3 replies
  • 621 views

Salut à tous,

J'ai un petit problème; avant je travaillais sur un pc portable écran HD et tout allait bien mais depuis que j'ai fais mon pc de bureau avec écran 4K je contaste que le design de site web que je réalise sur Photoshop CC ne correspond pas à ce que je vais coder en site web : les dimensions sont bien plus grandes que ce que je voyais afficher dans Photoshop à 100% de l'affichage.

Par exemple: 100 pixels de large apparaissent comme tel sur le web tandis que dans Photoshop, ça apparaît bien plus petit. Pour avoir une vision plus juste dans photoshop, je dois regarder l'image à 150% en affichage.

Est-ce que quelqu'un saurait comment régler ce problème ? Merci beaucoup d'avance.

This topic has been closed for replies.

3 replies

Participant
July 1, 2024

Bonjour, avez-vous réussi à résoudre votre problème ? J'ai exactement le même soucis que vous. Et si je veux travailler à peu près avec les dimensions du rendu final sur le web, en agrandissant à 200%, c'est pixelisé.

D Fosse
Community Expert
Community Expert
July 1, 2024

The answer has already been given above.

 

Web browsers scale images to 200% when they detect a high resolution screen. This is the industry standard to ensure the same material can be used everywhere, regardless of what screen technology the user happens to have. If it wasn't for this, we'd need two separate internets.

 

This scaling uses four screen pixels to represent one image pixel.

 

Photoshop obviously can't do that. It has to display accurately. Photoshop is used for a whole lot of other purposes than web design.

 

If you set Photoshop to View > 200%, it does excactly the same as your web browser. It uses four screen pixels to represent one image pixel.

 

Note the difference between raster based pixel images, and vector data such as text. Vector data are always rendered at full screen resolution in the browser. But Photoshop, being specifically a raster editor, will render text as pixels, at the document resolution.

Per Berntsen
Community Expert
Community Expert
November 12, 2022
quote

I have a little problem; before I worked on an HD screen laptop and everything was fine but since I made my desktop PC with 4K screen I contaste that the website design I do on Photoshop CC does not correspond to what I will code in website: the dimensions are much larger than what I saw displayed in Photoshop at 100% of the display.

For example: 100 pixels wide appear as such on the web while in Photoshop, it appears much smaller. To have a more accurate vision in photoshop, I have to look at the image at 150% in display.

 

When web browsers detect a high resolution screen, like 4k, they display images at 200%, and use four screen pixels to display one image pixel.

This is to prevent images from displaying too small – the pixels on 4k screens are tiny.

Photoshop doesn't do this – it has to display correctly, and uses one screen pixel to display one image pixel at 100%.

Tony93200Author
Participating Frequently
November 12, 2022

Merci beaucoup,
D'accord, je comprend que les navigateurs web font cela pour que nous continuons d'avoir un affichage normal.
Dans ce cas, comment faire pour que photoshop nous affiche correctement à une échelle de 100% ce que nous verront ensuite sur le web ?

Per Berntsen
Community Expert
Community Expert
November 12, 2022
quote

Thank you very much
Okay, I understand that web browsers do this so that we continue to have a normal display.
In this case, how do we make photoshop correctly display at a 100% scale what we will see next on the web?

 

You should get the same size in Photoshop by viewing at 200%, and you can create a keyboard shortcut for View > 200%.

If you have to view at 155%, it seems that you have changed the resolution of your monitor. Did you do that?

Myra Ferguson
Community Expert
Community Expert
November 12, 2022

Bonjour,

 

Vous pouvez modifier la mise à l'échelle de l'interface utilisateur dans les préférences, mais il semble que vous souhaitiez modifier la résolution de votre moniteur.

 

Pour le modifier dans Windows 10, accédez au bureau, cliquez avec le bouton droit de la souris et sélectionnez Paramètres d'affichage, puis sélectionnez la résolution sous Résolution d'affichage. Essayez 1920 x 1080.

Tony93200Author
Participating Frequently
November 12, 2022

Merci beaucoup pour votre réponse mais l'interface utilisateur ne permet qu'un réglage à 100% ou 200%, mais pour que ce que photoshop me montre corresponde avec la taille sur le web il me faut un réglage à a peu près 155%. N'y a t-il pas d'autres solutions ? Sinon, lorsque je fais mes design pour site web, je serais obligé de mettre à 155% pour réellement voir le résultat final..