2010-03-11 4 views
1

Je viens d'entrer dans le développement web sérieusement, et j'essaye de faire une page qui semble la même taille physique (en pouces) à travers tous les navigateurs et les plates-formes Je crois qu'une combinaison de valeurs en pourcentage et Les valeurs en pouces peuvent rendre une interface utilisateur cohérente.éléments HTML taille physique

mon propre système est un écran de 15,4 pouces avec 1920 x 1200 pixels, c'est-à-dire 144 DPI.

est ici le plus simple, le code HTML qui ne se présente pas de la bonne taille sur un navigateur, sauf FireFox (ai essayé sur Chrome 3, 4, Opera 10.5, IE7)

<html><head> 
<body> 
<div 
style="position:absolute; width:2in; height:1in; border:1px solid" > 
hello world</div> 
</body></html> 

Chrome, Opera et IE rendent une Boîte de .67 pouces (Ils semblent supposer un écran de 96 DPI)

Je suis sous Windows XP, mais je ne vois pas pourquoi cela ferait une différence. Rendu incorrect similaire sur d'autres machines que j'ai testées.

Je pensais que quand je dis « 1Dans » en HTML, cela signifie un pouce réelle dans le monde réel ....

Comment puis-je gérer cela?

Merci à l'avance, Vivek

Edit:

en 2006 j'ai développé un contrôle activeX qui a fait le montage vidéo en direct pour un site Web, en 2008, nous avons commencé à voir beaucoup de Vista utiliser et plus écrans DPI qui rendu l'interface utilisateur inutilisable, j'ai retravaillé l'application afin que tout soit mis à l'échelle selon DPI, puisque tout le monde heureux qu'ils n'ont pas besoin de lunettes pour utiliser la fonctionnalité ....

La raison pour laquelle Win7 et Vista ont cette " Le mode de mise à l'échelle DPI "permet aux applications non compatibles DPI (mais il bascule fondamentalement la toile de l'application, les applications semblent floues).

Je ne peux pas croire qu'appeler GetDeviceCaps() ou l'équivalent X-Windows est plus difficile que le codage en dur 96 DPI. De toute façon cela n'affecterait pas n'importe quelle page qui mesure en pixels ....

+0

À court d'écrire une règle à l'écran, je ne sais pas pourquoi vous voulez faire cela? –

+1

Il me semble que vous venez d'un arrière-plan d'impression. Les sites Web suivent des principes totalement différents, il est préférable d'adapter votre pensée au nouveau paradigme au lieu d'essayer de le forcer à faire ce que vous aviez l'habitude de faire auparavant. Je n'ai pas vu un seul site Web qui essaie d'utiliser des pouces pour définir les tailles. – dbemerlin

Répondre

0

Je ne pense vraiment pas que vous pouvez, pour être honnête.

Le DPI de l'écran est déterminée dans le matériel, soit un 15,4" écran avec une résolution 1920x1080 = 144DPI.

Pourquoi avez-vous le site pour apparaître comme les mêmes dimensions physiques? Certes, la même taille, proportionnelle à l'écran est assez? Par exemple si ma résolution est 1920x1080, votre site devrait prendre jusqu'à 50% du large.Si j'utilise 1600x1050, il devrait prendre 60%?

1

Au lieu de donner la taille en px vous juste donnez-le en pourcentage, afin qu'il puisse tenir sur n'importe quel écran basé sur le pourcentage

0

En bref - vous ne pouvez pas, au moins pour vous se sur l'écran. L'utilisation d'unités du monde réel dépend du fait que les clients connaissent le DPI approprié pour le système. Entre les clients qui ne dérangent pas, et les systèmes qui ne sont pas configurés correctement, c'est une situation désespérée.

Si vous souhaitez que l'échelle s'adapte à une taille raisonnable pour le système de l'utilisateur, il est préférable d'utiliser les unités em en fonction de la taille de police de l'utilisateur.Cela pose toujours des problèmes lorsque les valeurs par défaut ne conviennent pas et que l'utilisateur ne les a pas modifiées, mais cela est plus souvent le cas que les unités physiques.

4

Impossible à faire. Période.

Les écrans sont une grille de pixels et c'est l'unité seule reconnue par l'affichage physique. Toute autre mesure doit être convertie en pixels pour l'affichage. Cette conversion est effectuée par le sous-système graphique du système d'exploitation, qui possède un paramètre interne «DPI», car il est arbitraire et ne correspond pas nécessairement au DPI physique réel d'un périphérique réel. Windows, par exemple, a une résolution par défaut de 96 DPI indépendamment de l'affichage auquel il est connecté.

Lorsque vous regard sur une page avec quelque chose avec une hauteur de « 1Dans », votre machine regarde, calcule que, puisqu'il est défini pour 144 DPI, « 1Dans » signifie 144 pixels et en fait 144 pixels de haut , indépendamment de la distance physique que ces 144 pixels occuperont sur votre écran. Lorsque l'utilisateur Windows typique avec le paramètre par défaut de 96 DPI le regarde, son ordinateur calcule que "1in" = 96px et le fait 96 pixels de haut, encore une fois quelle que soit la distance physique correspondant à ces 96 pixels.

Et vous savez quoi? C'est une bonne chose. Cela signifie qu'un utilisateur ayant une mauvaise vision peut réduire le paramètre DPI de son pilote vidéo et que tout ce qui est en pouces, cm, point, em ou autres unités du monde réel (autrement dit tout autre élément que le pourcentage ou les pixels) afin qu'ils puissent le voir plus facilement. À l'inverse, ceux d'entre nous qui ne dérange pas un petit texte peuvent artificiellement augmenter nos paramètres DPI pour réduire tout cela et obtenir plus sur nos écrans.

La tyrannie de la page imprimée, forçant les choses à une certaine taille que cela nous plaise ou non, n'est plus. Embrassez la puissance que cela donne à vos utilisateurs sur leur expérience. N'essayez pas d'enlever cela - vous ne réussirez pas et vous ne ferez que déranger les gens dans le processus.

+0

Windows par défaut à 96 DPI mais on peut le définir à n'importe quoi sur les propriétés d'affichage. J'écris beaucoup d'applications natives, je détecte le DPI du système (tel que défini par Windows) et redimensionne mon interface graphique et les polices. Je pense que tous les navigateurs devraient faire la même chose, Le point que je fais est que Firefox le fait! Les autres navigateurs ne le font pas - Sur mon système, le texte en 8 points est trop petit pour être lu, si les pages Web sont spécifiées en pouces, alors je n'aurais pas à les zoomer. l'API GetDeviceCaps() récupère le DPI fourni par l'utilisateur, est-il donc si difficile d'utiliser cette valeur au lieu d'un 96 codé en dur? –

+0

Et quant à la tyrannie des tailles fixes - Une zone de texte de 40 pixels de haut, qui semble normale sur mon système, aurait l'air positivement hideuse sur 96 DPI Même si je l'ai spécifié en pourcentage, une étiquette qui représente 2% de ma taille d'écran sera look surdimensionné sur les systèmes DPI inférieurs ... Comment voulez-vous voir le beau texte 16 pt par défaut, juste parce que c'est la taille lisible sur mon système. Si un utilisateur veut une taille plus grande, il y a la fonctionnalité de zoom disponible sur tous les navigateurs. Bien sûr, les panneaux doivent être proportionnellement espacés en pourcentage, mais sûrement pas de contrôles avec du texte à l'intérieur. –

+0

Ne détectant pas le système DPI est un problème d'application, toute boîte à outils GUI (qui, à mon avis, comprend des mises en page HTML rendues) devrait en tenir compte. Utiliser la taille de la police comme une mesure est une solution stupide, je ne veux pas que toutes mes interfaces graphiques explosent juste parce que j'augmente la taille de la police par défaut d'un point ou deux .... –