Analyse de mon site par validator W3C

Bonjour, et me revoilà... j'avance petit à petit, je reviendrai bientôt sur les sujets encore ouverts... mais voici les polices que j'ai piquées sur Google fonts, elles sont dans mon css comme suit :

/* CSS Document */
@import url(http://fonts.googleapis.com/css?family=Fredericka+the+Great|Jolly+Lodger|Rye|Joti+One);

font-family: 'Fredericka the Great', cursive;

font-family: 'Jolly Lodger', cursive;

font-family: 'Rye', cursive;

font-family: 'Joti One', cursive;

et le validator W3C me dit :

4 cursive Erreur lors de l'analyse grammaticale. [: 'Fredericka the Great']
4 cursive Erreur lors de l'analyse grammaticale. cursive;
6 cursive Erreur lors de l'analyse grammaticale. [: 'Jolly Lodger']
6 cursive Erreur lors de l'analyse grammaticale. cursive;
8 cursive Erreur lors de l'analyse grammaticale. [: 'Rye']
8 cursive Erreur lors de l'analyse grammaticale. cursive;
10 cursive Erreur lors de l'analyse grammaticale. [: 'Joti One']
10 cursive Erreur lors de l'analyse grammaticale. cursive;
81 h4 Propriété erronée : font-size Trop de valeurs, ou valeurs non reconnues : 1,0

ok pour la ligne 81 c'est 1 point zéro et pas virgule... mais pour les polices???

merci de votre aide

jjaco, autodidacte, pensionné et passionné.

7 réponses

  1. merci BG62, je regarde à tout ça...
    0
    1. Modérateur
      ok, @+ alors ...
      0
  2. Modérateur
    bien reçu l'url ...
    tu as dans ton code html des choses comme ceci :
    header, dic id= ...., nav, ul, section, h1, h2, h3, h4, article, p, ....

    qui doivent être correctement reliées à ta feuille de style, qui n'est pas complète ....
    et pour l'instant, voici ce que cela donne avec une css valise:
    @import url('http://fonts.googleapis.com/css?family=Fredericka+the+Great|Jolly+Lodger|Rye|Joti+One');
    @font-face {
    {
    font-family : "'Fredericka the Great'";
    font-style : normal;
    font-weight : 400;
    src : local('Fredericka the Great'), local('FrederickatheGreat'), url(http://themes.googleusercontent.com/static/fonts/frederickathegreat/v2/7Es8Lxoku-e5eOZWpxw18oRQ8DD0aAk7ES4QQYHqQcw.ttf) format('truetype');
    }
    }
    @font-face {
    {
    font-family : "'Jolly Lodger'";
    font-style : normal;
    font-weight : 400;
    src : local('Jolly Lodger'), local('JollyLodger'), url(http://themes.googleusercontent.com/static/fonts/jollylodger/v1/RX8HnkBgaEKQSHQyP9itiYnF5uFdDttMLvmWuJdhhgs.ttf) format('truetype');
    }
    }
    @font-face {
    {
    font-family : "'Joti One'";
    font-style : normal;
    font-weight : 400;
    src : local('Joti One'), local('JotiOne-Regular'), url(http://themes.googleusercontent.com/static/fonts/jotione/v1/XiXBM8y3L5iol1funD8Z8fesZW2xOQ-xsNqO47m55DA.ttf) format('truetype');
    }
    }
    @font-face {
    {
    font-family : "'Rye'";
    font-style : normal;
    font-weight : 400;
    src : local('Rye Regular'), local('Rye-Regular'), url(http://themes.googleusercontent.com/static/fonts/rye/v1/oL17Hdyt4cnc6u-d2vEFZQ.ttf) format('truetype');
    }
    }
    #page {
    width : 80%;
    margin : auto;
    }
    header {
    background-color : #CCFFFF;
    border-bottom : 2px solid blue;
    border-right : 2px solid blue;
    }
    #titre_principal {
    display : inline-block;
    }
    #image {
    width : 150px;
    padding-top : 25px;
    float : left;
    }
    header h1 {
    font-family : 'Jolly Lodger', arial;
    font-size : 5em;
    color : blue;
    padding-top : 0;
    padding-left : 25px;
    }
    #image, header h1 {
    display : inline-block;
    margin-bottom : 5px;
    margin-left : 90px;
    }
    nav {
    text-align : right;
    width : 75%;
    display : inline-block;
    }
    nav ul {
    list-style : none;
    }
    nav li {
    display : inline;
    padding-left : 40px;
    padding-right : 40px;
    text-decoration : none;
    }
    nav a {
    font-size : 1.3em;
    text-decoration : none;
    }
    nav a:hover {
    color : red;
    border : red solid 2px;
    }
    section, aside {
    display : inline-block;
    }
    section {
    background-color : grey;
    width : 75%;
    position : relative;
    }
    section, h1 {
    color : white;
    font-size : 1.2em;
    text-align : center;
    }
    h4 {
    text-align : center;
    font-size : 1.0em;
    }
    article, p {
    text-align : left;
    font-family : "comic sans ms";
    font-size : 0.9em;
    color : #80699F;
    padding : 10px 20px 10px 20px;
    background-color : yellow;
    }
    #logo {
    width : 100px;
    margin-left : 60px;
    }
    aside h3 {
    font-family : 'comic sans ms', arial, georgia;
    font-size : 0.8em;
    text-align : center;
    }
    aside {
    width : 24.5%;
    height : 400px;
    background-color : #80699F;
    float : right;
    color : white;
    }
    footer {
    position : relative;
    margin-top : 5px;
    width : 100%;
    background-color : salmon;
    }
    

    commence donc par changer ta page style.css en mettant ceci dedans ...
    @+
    0
    1. Dis-moi z'en plus... C'est quoi MP? 'j'en apprends tous les jours!'
      0
      1. oui bien sur je peux te donner le lien du site, mais comment le faire en confidentiel?
        ou alors je dois en faire un duplicata rien qu'avec des pseudos. Rassures-toi c'est pas un site illégal...
        merci
        0
        1. Modérateur
          tu peux envoyer en Mp si tu veux ...
          0
      2. Modérateur
        rien d'autre étonnant ...
        déjà, ton lien donne ceci:
        @font-face {
          font-family: 'Fredericka the Great';
          font-style: normal;
          font-weight: 400;
          src: local('Fredericka the Great'), local('FrederickatheGreat'), url(http://themes.googleusercontent.com/static/fonts/frederickathegreat/v2/7Es8Lxoku-e5eOZWpxw18vc3vBAn7YvtW9hNjxWZBR0.woff) format('woff');
        }

        donc une seule police, pas 36, et de plus il est noté "local" ....
        as-tu un lien pour voir tout ça ???
        0
        1. merci bg62,
          je n'ai rien d'autres dans la css, j'ai enregistré les url, j'ai décompressé et j'ai copier coller dans la css.
          J'ai ensuite appelé la police avec:
          header h1{
          font-family: 'Jolly Lodger' , arial;
          font-size:5em;
          color:blue;
          padding-top:0px;
          padding-left:25px;
          }
          j'ai déjà changé le cursive en arial
          Pour moi, il n'y a pas de problèmes puisque j'obtiens le résultat souhaité, mais comme j'ai appris le fonctionnement du validator, je m'étonne du résultat de l'analyse.
          Merci de vos remarques et commentaires.
          0
          1. Modérateur
            ^bonjour;)
            pourrais-tu mettre le code de ta CSS ( ou autre ....) (le début !!! ) qui appelle tout ça ???
            0