Commentaires   |   Accueil     Archives     Précédent     Suivant    Forum     Mon Twitter     Débuter sur Mac

Avertissements :

Créer son propre modèle qui apparaîtra  dans la liste des modèles à la création d’une nouvelle page est une véritable galère et c’est plus à de la bidouille qu’autre chose. Si le coeur vous en dit, je vous donne le lien du site 11mystics qui vous explique les premiers pas pour dupliquer et modifier un thème d’iWeb (la maîtrise de l’anglais et d’un peu de rudiments de code de site web est nécessaire malheureusement).




Le but de cet article  n’est pas de créer ce type de modèle, Il s’agit de donner quelques conseils pour créer une page que vous personnaliserez et qui servira de modèle aux prochaines pages de votre site.


La Personnalisation des pages :


Pour donner une homogénéité à votre site :

  1. Gardez le même thème du début à la fin.

  2. Utilisez les mêmes polices, les mêmes couleurs, les mêmes tailles de polices pour un même type d’écrits d’une page à l’autre (rien de plus déstabilisant de commencer une page avec un  paragraphe en «Arial 13’’ blanc» , un autre sur une autre page en «Verdana 15’’ gris-clair» ou «Comic sans Serif 14’’». Je le précise parce que je l’ai vu parfois.

  3. Concernant les couleurs, je vous conseille de faire votre propre palette de couleur : pour cela, voir la fenêtre des couleurs.

  4. Si vous affichez le menu de navigation, donnez-lui  la même largeur et la même position sur toutes vos pages pour permettre à vos visiteurs de surfer rapidement d’une page à l’autre sans rechercher les liens. Rien de plus déstabilisant qu’un menu qui va afficher un lien à droite sur la première ligne sur une première page et l’afficher à gauche sur la seconde ligne d’une seconde page. Et sans tomber dans ces extrémités, une dizaine de pixels de décalage d’une page à l’autre suffit à ennuyer vos visiteurs (parfois moins).
    Aidez-vous si besoin de l’inspecteur des mesures (voir image ci-dessous).

Un peu de bon sens. Rien de plus.







Si vous avez modifié un thème en changeant les arrières-plans par exemple, je vous conseille d’avoir une page qui vous servira de modèle et que vous dupliquerez pour fournir les nouvelles pages .

Les thèmes blancs, noirs, modernes (les 2) sont les plus facilement modifiables. La plupart des autres thèmes (utilisant des images) ne permettent pas toujours  d’enlever ou de modifier certaines images ou d’élargir les pages.




Voici ma page de modèle en image crée à partir d’une entrée de blog du thème noir (avec l’affichage de la disposition)




La duplication des pages :


La duplication de la page peut se faire faire :

via le menu contextuel (clic droit) dans la barre de menu  (ou barre de menu > Edition > Dupliquer ou cmd D) :



ou par le menu conextuel dans la listes des entrées des blogs et des podcasts :




Toutes les pages ne peuvent être dupliquées c’est le cas par ex. des pages d’entrées et d’archives d’un blog ou d’un podcast



Vous trouverez la page de modèle de ce blog à cette adresse. cette page contient deux  textes courts qui seront facilement éditables.
Personnellement je n’utilise qu’un type de page, les pages de blog donc je n’ai qu’un seul modèle mais si vous utiliser plusieurs modèles de pages  (ex. Bienvenue, Fiche personnelle,  Film, Photos, etc.) il faudra créer un modèle par type de page (pas simple) .


Mais tout ne peut être dupliqué :

C’est le cas quand on doit utiliser des modèles de pages différents : un modèle Bienvenue, un modèle Photos, un modèle Albums etc.

ou simplement un blog (ou de podcast) qui contient 3 types de pages : l’accueil, l’entrée et l’archive de blog.

Dans ce cas, il va falloir faire un modèle pour chacun de ces types de Pages et faire en sorte que les modèles se ressemblent entre eux.


L’art du copier-coller :


Si on ne peut pas dupliquer une page «Bienvenue» pour faire une page «Photos» (et vice-versa), il est possible de copier certains objets (certaines zones de textes, image, vidéo, widget) d’une page pour les coller dans l’autre : en général, ils se colleront au même endroit sur la nouvelle page.


Méfiez vous quand vous faites certaines modifications sur une page : certaines zones de textes et certains emplacement d’image (blog, podcast) ou de vidéos (pages «Film») ont leur importance, généralement iWeb laisse apparaitre un encart jaune quand on laisse la souris stationner sur ces zones bien particulières, par ex.:

«Saisissez le texte de l’entête de votre page web ici» sur toutes les pages

«Saisissez le titre de votre page ici» sur toutes les pages sauf «Vide»

«Saisissez le texte principal de votre page ici» sur toutes les pages sauf «Vide»

«Cette image est un paramètre fictif. Faites glisser un nouveau fichier multimédia ici pour le remplacer»  page d’accueil et entrées de  «blog» et de «podcast»

«Cette séquence est un paramètre fictif. Faites glisser un nouveau fichier multimédia ici pour la remplacer» sur la page «film»


        


Je vous déconseille d’effacer à l’une de ces zones. Elles ont leur importance : Une article de ce blog est dédié en partie à ces 3 premières zones  de textes : «adresses et titre des pages» consultez ette page pour un complément d’information. Il en est de même pour l’image des entrées de blogs et des podcasts «cette image est un paramètre fictif. Faites glisser un nouveau fichier multimédia ici pour le remplacer», elles ne sont pas à effacer, c’est un emplacement particulier, si vous effacez cette image  vous effacez cet emplacement et ces propriétés. Contentez-vous, comme c’est indiqué, de glisser une image dessus  si vous voulez voir une miniature de cette image dans le «récapitulatif de blog» sur la page d’accueil du blog ou du podcast. Il en est de même pour la vidéo de la page vidéo, elle est à remplacer , jamais à effacer si vous voulez la voir apparaître dans un album.


la disposition




la disposition vous permet de distinguer les 4 parties de votre page, chacune apparaissant séparée des parties adjaceantes par une barre horizontale. ces 4 parties sont : la navigation, l’entête, le contenu et le pied de page.




Veillez à ce que vous mettiez  bien un objet (image texte fragment HTML dans la même partie pour chacun de modèle de page). Si ça peut sembler bête à lire comme ça




En glissant cette image à l’intérieur de ma page, je suis averti par un rectangle bleu clair de la zone où mon image sera placée (voir image ci-dessus) .



Une fois que les objets correspondants d’une page à l’autre sont dans les bonnes zones de votre page (les mêmes d’un modèle de pages à l’autre)


Copier ( cmd alt C ) et coller (cmd alt V) le style du texte ou le style de graphisme





Au revoir

+

Bonjour

=

Au revoir

Une zone de texte A avec un style dont on se tape.

Une zone de texte B dont on veut copier le style :

cmd alt C

 

 

 

cmd alt V

Une zone de texte A avec le style de B




Si vous avez changer la police, la couleur, l’alignement horizontal et vertical, l’espacement, l’ajout d’une ombre etc. Le style de celui si peut être copié si vous sélectionnez un texte ou une zone de texte et collez (alt cmd V) sur un autre texte ou zone de texte (de la même ou d’une autre page).

De même pour les images, où vous pourrez copié traits (cadres), ombres et reflet ,


l’inspecteur




Il est important de bien positionner les éléménts communs d’une pages à l’autre. Aidez vous de l’inspecteur de mesures (taille d’un objets et sa position).

Jeter un coup d’oeil à la marge des zones de textes dans l’inspecteur de textes > onglet texte. La marge des zones de texte n’est pas copiée lors de la «copie de style (cmd alt C) . Une marge différente est souvent à l’origine de taille de zone de texte quand on essaie de les réduire à leur taille minimum. Vérifiez l’espacement la couleur et l’alignement  de chaque zone de texte si vous n’avez pas copié un style d’une page à l’autre.