Aller au contenu

  • Pas encore inscrit ?

    Pourquoi ne pas vous inscrire ? C'est simple, rapide et gratuit.
    Pour en savoir plus, lisez Les avantages de l'inscription... et la Charte de Zébulon.
    De plus, les messages que vous postez en tant qu'invité restent invisibles tant qu'un modérateur ne les a pas validés. Inscrivez-vous, ce sera un gain de temps pour tout le monde, vous, les helpeurs et les modérateurs ! :wink:

Problème de police

Lollapalooza

Par Lollapalooza
dans Programmation

 Partager

Messages recommandés

Lollapalooza Member

Lollapalooza

Posté(e)
Posté(e)

Hello, j'ai un souci, quand je me connecte à mon site ou que je rafraichis une page, j'ai un changement de police rapide : :P

 

http://img51.imageshack.us/img51/9928/sanstitrevt.jpg

 

Comment cela se fait-il ?

 

IE me détecte ça :

 

Détails de l’erreur de la page Web

 

" Message : '0.offsetWidth' a la valeur Null ou n'est pas un objet.

Ligne : 12

Caractère : 7957

Code : 0

URI : http://talhi.net/wp-includes/js/jquery/ … ?ver=1.3.2 "

 

Merci et bonne soirée :P

Lien vers le commentaire
Partager sur d’autres sites

KewlCat Devil Member !

KewlCat

Posté(e)
Posté(e)

Le temps que le navigateur passe de l'affichage du texte (dans une police sans serif) à la génération du contenu des <canvas> qui vont t'afficher le même titre dans la police non-standard que tu as demandée (et qui est serif) est tout simplement trop long.

C'était une mauvaise idée d'utiliser un script pour obliger le navigateur à modifier l'apparence de toutes les polices de toute la page sans fournir une base (en CSS) qui permet d'avoir un rendu pas trop éloigné du résultat final. Du coup ça permet également d'expliquer l'erreur sur certains navigateurs...

 

C'est quelle version de IE qui plante avec jQuery ?

Lien vers le commentaire
Partager sur d’autres sites
Lollapalooza Member

Lollapalooza

Posté(e)
  • Auteur
Posté(e) (modifié)

Hello et merci pour ta réponse

 

Je pense avoir été trop vite car je vois qu'il y a une section hébergement ... vous pouvez déplacer mon sujet ? Désolé

 

Je pense qu'ici c'est pas trop pour les néophytes ... je suis assez nul dans le domaine en fait :P

 

Désolé si je ne sais pas trop te répondre car je ne comprends pas grand chose, je pense pas avoir utilisé un javascript, je ne sais même pas ce que c'est en fait. Mais si cela peut t'aider, j'avais envoyé hier un mail au support de mon hébergeur et il m'a répondu ça :

Hello,

 

The page displays fine on our end. I am using FireFox to display the page. I tried to refresh the page many times and still got the same page. We recommend that you check your browser and try refreshing without cache (using CTRL + F5).

 

Let us know if you need further assistance.

 

PS : Le souci est lié à tous les navigateurs en fait, pas que IE.

 

Regards,

 

Mourad Dmeiri

http://www.arvixe.com

Arvixe, LLC

 

Je dois peut-être désactiver des plugins, conflits ou quoi ?

 

Merci en tout cas ! :P

Modifié par Lollapalooza
Lien vers le commentaire
Partager sur d’autres sites
KewlCat Devil Member !

KewlCat

Posté(e)
Posté(e)

Je ne suis pas sûr que ce problème puisse être classé dans la catégorie "hébergement" puisque le souci provient de la façon dont a été programmé le site. A moins que tu n'aies délégué le design à ton hébergeur... quoique même dans ce cas c'est toujours un problème de programmation :-P

A lire leur réponse je ne crois pas qu'ils aient bien saisi de quoi tu parlais...

Je regarde le code source de la page et, d'une part je remarque qu'il y a des balises qui n'ont rien à faire dans le <head> (les liens RSS, Twitter et Facebook) et d'autre part je vois très précisément d'où vient le problème :

<script type='text/javascript' src='http://talhi.net/wp-content/themes/gamerpress/js/Myriad_Pro_700.font.js?ver=2.9.1'></script>
<script type='text/javascript' src='http://talhi.net/wp-content/themes/gamerpress/js/Rockwell_Std_400.font.js?ver=2.9.1'></script>

En bloquant ces deux scripts avec AdBlock (ou avec NoScript, mais je n'ai pas NoScript alors je fais avec les moyens du bord) et en rechargeant la page on obtient très exactement le cas correspondant à ton premier screenshot : la page avec les polices par défaut qui sont sans serif.

En clair : celui qui a fait la feuille de style ne s'est pas cassé le tronc et a confié la moitié du boulot à ces deux scripts.

En encore plus clair : ceux qui n'ont pas JavaScript (ou dont le navigateur plante à l'exécution de ces scripts) verront le site avec les très mauvaises polices au lieu de polices équivalentes qui donnent un rendu proche de celui que tu voulais.

Myriad Pro et Rockwell ne sont même pas utilisées dans la feuille de style :

body {
margin:0 auto;
padding:100px 0px 0px 0px;
background:#010101 url(images/body.jpg) top center no-repeat;
font-family:Tahoma,Century gothic, Arial,Tahoma,sans-serif;
color:#161514;
font-size:13px;
}

Tahoma y est deux fois, toutes les fontes sont spécifiques à Windows, toutes les fontes sont sans serif et la police par défaut est explicitement "sans-serif". Pour les autres éléments on retrouve les mêmes fontes, avec parfois Helvetica en bonus (qui est également sans serif) voire "Helvitica" qui n'existe pas...

 

Qui s'est chargé de la réalisation de ce site ?

Lien vers le commentaire
Partager sur d’autres sites
Lollapalooza Member

Lollapalooza

Posté(e)
  • Auteur
Posté(e) (modifié)

Hello et merci pour ta réponse :P

 

En fait, je suis hébergé chez Arvixe. Pour mon école, je dois réaliser un site web qui traite de n'importe quel sujet. J'ai donc installé WORDPRESS sur mon hébergeur, je l'utilise depuis peu et je ne sais pas si j'ai touché à quelque chose (ce dont je ne pense pas, je n'ai touché à rien de spécial). Après, j'ai essayé de réinstaller le thème mais sans résultat. En gros pour répondre à ta question, c'est moi qui ai "réalisé" le site (bien grand mot).

 

Tu penses qu'en changeant de thème, le problème pourrait être résolu ? J'aimerais tellement garder ce thème qui correspond plutôt bien à ce que j'y publie.

 

Merci à toi en tout cas :P

Modifié par Lollapalooza
Lien vers le commentaire
Partager sur d’autres sites
KewlCat Devil Member !

KewlCat

Posté(e)
Posté(e)

A mon avis si tu te contentes de trouver un autre thème tu vas avoir des problèmes similaires (a fortiori si tu te fournis en thèmes chez une équipe qui programme toujours de la même façon).

Tu as uniquement un problème de police, je pense que ce n'est pas super grave si tu supprimes juste les deux scripts et que tu remplaces les noms des polices sans serif des feuilles de style par des polices serif... Certes ça ne sera pas exactement ce que tu voulais mais non seulement ça sera plus léger (ces scripts sont un poil exigeants, tout de même !) mais en plus ce sera plus standard (ton site aura la même apparence si tu le visites depuis une machine équipée d'un navigateur "allégé")

Lien vers le commentaire
Partager sur d’autres sites
Lollapalooza Member

Lollapalooza

Posté(e)
  • Auteur
Posté(e)

Coucou et encore merci pour ton aide,

 

Donc si je résumé bien : Je supprime ces 2 scripts :

 

<script type='text/javascript' src='http://talhi.net/wp-content/themes/gamerpress/js/Myriad_Pro_700.font.js?ver=2.9.1'></script>

<script type='text/javascript' src='http://talhi.net/wp-content/themes/gamerpress/js/Rockwell_Std_400.font.js?ver=2.9.1'></script>

 

ET

 

Je remplace comme ça :

 

body {

margin:0 auto;

padding:100px 0px 0px 0px;

background:#010101 url(images/body.jpg) top center no-repeat;

font-family:Tahoma,Century gothic, Arial,Tahoma,serif;

color:#161514;

font-size:13px;

}

 

J'ai mis serif au lieu de sans-serif

 

C'est bien ça que je dois faire ?

 

Si oui, la police sera comment ? Désolé pour ces questions bêbêtes, je m'y connais pas très très bien :P

 

Merci bonne soirée

Lien vers le commentaire
Partager sur d’autres sites
  • Modérateurs
Dylav Devil Member !

Dylav

Posté(e)
  • Modérateurs
Posté(e)

C'est un petit peu plus compliqué que cela. Pour commencer, connais-tu la différence entre une police avec sérif et une police sans sérif ? Les caractères d'une police avec sérif voient leurs extrémités dotées d'un petit trait perpendiculaire. À titre d'exemple, parmi celles que nous propose l'éditeur du forum, j'ai coché les polices avec sérif.

img-230430vt41n.gif

Ainsi, dans ta feuille de style, il faudra que tu remplaces les polices Tahoma, Century Gothic et Arial (qui sont des polices sans sérif) par des polices avec sérif, comme Courier New, Garamond ou Georgia. :P

Lien vers le commentaire
Partager sur d’autres sites
KewlCat Devil Member !

KewlCat

Posté(e)
Posté(e)

Pour comprendre de quoi il s'agit, rien de tel qu'un petit tour sur Wikipedia : http://en.wikipedia.org/wiki/Serif

La traduction française semble être "empattement"... Si un typographe passe par là, je veux bien une explication ;-)

 

OK pour la suppression des scripts, mais pour le remplacement des polices il ne suffit pas de changer "sans-serif" en "serif" puisque c'est la dernière option de la liste et que cette option n'est prise que si aucune des polices qui la précèdent n'est trouvée sur la machine. Il faut donc fournir une liste de polices qui correspond à ce que tu veux obtenir. A priori il faut que tu commences ta liste par "Rockwell Std" vu que c'est celle que tu voulais utiliser...

Après, comme l'indique Dylav, il faut des polices relativement fréquentes (i.e. susceptibles d'être présentes sur la machine qui affiche la page) et qui, par ordre décroissant, ressemblent le plus à "Rockwell Std". Attention toutefois : "Courier New" est une fonte "monospace" ("à espacement fixe" ?) c'est à dire que toutes les lettres ont la même largeur (ce qui est pratique pour écrire du code afin de gérer correctement les alignements, mais pas forcément adapté à de la présentation de contenu sur une page Web)...

 

-- edit --

Un outils bien pratique pour trouver des fontes similaires : http://www.identifont.com/find?similar=Rockwell&q=Go

Lien vers le commentaire
Partager sur d’autres sites
  • Modérateurs
Dylav Devil Member !

Dylav

Posté(e)
  • Modérateurs
Posté(e)

Je compléterais volontiers la référence de KewlCat par celle-ci, qui confirme le mot “empattement” comme équivalent de l'anglais “serif”. Mais qui avance également, un peu plus loin,

Il est communément admis que les polices à empattements sont plus lisibles sur papier (les empattements formant une sorte de guide pour l'œil du lecteur), alors que les polices sans empattements sont plus agréables à lire sur un écran d'ordinateur. img-154912lrw25.gifWikipédia

À mon avis, il n'y a donc pas qu'une question d'esthétique à prendre en compte dans le choix des polices... :P

Lien vers le commentaire
Partager sur d’autres sites

Rejoindre la conversation

Vous pouvez publier maintenant et vous inscrire plus tard. Si vous avez un compte, connectez-vous maintenant pour publier avec votre compte.
Remarque : votre message nécessitera l’approbation d’un modérateur avant de pouvoir être visible.

Invité
Répondre à ce sujet…

×   Collé en tant que texte enrichi.   Coller en tant que texte brut à la place

  Seulement 75 émoticônes maximum sont autorisées.

×   Votre lien a été automatiquement intégré.   Afficher plutôt comme un lien

×   Votre contenu précédent a été rétabli.   Vider l’éditeur

×   Vous ne pouvez pas directement coller des images. Envoyez-les depuis votre ordinateur ou insérez-les depuis une URL.

×
 Partager
Aller sur la liste des sujets

  • En ligne récemment   0 membre est en ligne

    • Aucun utilisateur enregistré regarde cette page.
×
×
  • Créer...