communauté francophone de joueurs sims
 
AccueilAccueil  Le site  Chaine You Tube  S'enregistrerS'enregistrer  ConnexionConnexion  FAQFAQ  RechercherRechercher  

Partagez | 
 

 [Apprenti] Créer des liens interne (ancre) ou externe (un autre site)

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
Admin
avatar
Fuyaya
Admin
Féminin Date d'inscription : 29/09/2009
Age : 38
Localisation : Aubais

MessageSujet: [Apprenti] Créer des liens interne (ancre) ou externe (un autre site)   Mer 04 Nov 2009, 10:45

Nous allons voir ici les différents codes qui permettent de faire un lien au sein de son site.

Afin que ce soit clair pour tout le monde je vais vous indiquer la structure de notre site exemple:
  • / (c'est ce que l'on appelle la racine)
    • :dossier: images
      • image1.png
      • image2.jpg

    • :dossier: telechargement
      • zip.rar
      • tableau.package

    • :page: index.html
    • :page: mes_créations.html
    • :page: coup_coeur.html
    • :css: design.css



Spoiler:
 


Dernière édition par Fuyaya le Ven 20 Avr 2012, 12:44, édité 3 fois
Revenir en haut Aller en bas
http://fuyaya.tumblr.com/
Admin
avatar
Fuyaya
Admin
Féminin Date d'inscription : 29/09/2009
Age : 38
Localisation : Aubais

MessageSujet: Re: [Apprenti] Créer des liens interne (ancre) ou externe (un autre site)   Mer 04 Nov 2009, 10:58

Créer un lien d'une page à l'autre.


Lorsque l'on rentre l'adresse de votre site, c'est automatiquement le feuille appelée index qui apparait.
A savoir qu'entre une feuille index.html et index. php, c'est la feuille .html qui apparait en premier.

Ceci est la balise qui permet de créer un lien:

Code:
<a href="lien"></a>

Illustration: Je vais créé un lien dans ma feuille index vers ma feuille mes_créations.html

Le lien apparait tel qu'il est écrit:
Code:
<a href="mes_creations.html"></a>

Ce qui sert de lien c'est la phrase "Ici mes créations"
Code:
<a href="mes_creations.html">Ici mes création</a>

Ce qui sert de lien c'est l'image (qui se trouve dans mon dossier image)
Code:
<a href="mes_creations.html"><img="images/image1.png" /></a>

Remarques:

  • Le lien se trouve toujours entre les guillemets ""
  • Pour clore une formule il y a toujours dans la seconde partie ce symbole </img>


Conseil:

Le nom que je donne à mes fichiers:
  • Pas d'accent
  • Pas d'espace, utilisez _
  • Faites bref et explicite
  • Organisez vos feuilles: codez avec des chiffres vos pages par catégories, vous vous y retrouverez mieux (conseil d'Idjya que j'ai suivi et ça change la vie quand on a plus de 80 pages)


Spoiler:
 


Dernière édition par Fuyaya le Mer 04 Nov 2009, 11:18, édité 1 fois
Revenir en haut Aller en bas
http://fuyaya.tumblr.com/
Admin
avatar
Fuyaya
Admin
Féminin Date d'inscription : 29/09/2009
Age : 38
Localisation : Aubais

MessageSujet: Re: [Apprenti] Créer des liens interne (ancre) ou externe (un autre site)   Mer 04 Nov 2009, 11:11

Créer un lien pour télécharger un fichier


Ça va être rapide dans la mesure où c'est aussi simple que ce que l'on a vu précédemment.
Que votre fichier soit hébergé sur votre site ou sur un site tierce, le codage va être le même et en plus petit veinard, c'est le même que celui qu'on a vu précédemment.

Mais avant tout je voudrai attirer votre attention sur le codage du lien en fonction de l'endroit où se trouve votre document.

Cas1: le fichier se trouve au niveau de la racine (comme dans notre exemple les pages)
Code:
<a href="lien"></a>

Cas2: le fichier se trouve dans un dossier
Code:
<a href="dossier/lien"></a>

Dites vous pour vous repérez qu'après les guillemet on prend pour postulat de départ que l'on est à la racine. Si votre fichier se trouve dans un dossier alors vous devez indiquer son nom puis le fichier vers lequel le lien doit pointer.

Illustration:

Je créé un lien vers mon fichier zip. rar
Code:
<a href="telechargement/zip.rar"></a>

Je créé un lien vers mon fichier tableau.package et je remplace le lien par du texte:
Code:
<a href="telechargement/tableau.package">Télécharger ici la merveille des merveilles</a>

Si votre fichier est hébergé sur un serveur alors vous coller entre les "" l'adresse qui vous a été donnée

Vous avez tout compris?

Voici un micro exercice pour vérifier.
J'ai mon fichier poeme.doc qui est dans mon dossier ecriture. Ce dossier ecriture est dans le dossier creation qui est au niveau de la racine. Mon texte qui remplace le lien est: Télécharger mon poème

Ça nous donne ça:

  • /
    • :dossier: creation
      • :dossier: ecriture
        • poeme.doc





Quel est le code pour créer un lien vers le fichier poème.doc?
Réponse:
Spoiler:
 


Spoiler:
 


Dernière édition par Fuyaya le Mer 04 Nov 2009, 14:09, édité 1 fois
Revenir en haut Aller en bas
http://fuyaya.tumblr.com/
Admin
avatar
Fuyaya
Admin
Féminin Date d'inscription : 29/09/2009
Age : 38
Localisation : Aubais

MessageSujet: Re: [Apprenti] Créer des liens interne (ancre) ou externe (un autre site)   Mer 04 Nov 2009, 11:38

Créer un lien vers une section de votre page


Nous allons nous servir pour l'exemple de la page coup_coeur.html

Cela fait quelques temps que vous avez votre site et vous avez eu pas mal de coup de coeur, donc la page est longue et vous souhaitez créer un petit sommaire afin que vos visiteurs aillent droit à l'essentiel!
Comme vous êtes organisés vous aviez mis avant chaque nouveau coup de coeur un titre indiquant le date: Coup de coeur Février, Coup de coeur Mars, etc...

Chaque ligne du sommaire doit renvoyer au titre!

Un titre:

Voici ici le code pour insérer un titre:
Code:
<h1></h1>

H est le code pour le titre en ce qui concerne le numéro cela correspond au niveau (hiérarchie) et renvoie à un style particulier .
Ainsi il peut y avoir des titre h1, h2, h3 sachant que le pus important des niveaux est le 1.
Il y a un style automatique pour chaque niveau de titre, vous pouvez également les paramétrer dans votre feuille de style mais c'est une autre histoire...

Créer un lien infratexte dans la même page:

Le lien infratexte c'est justement un lien à l'intérieur d'une page.

Etape 1: coder le titre

On va mettre ce que l'on appelle une ancre en mettant une balise au niveau du titre pour que le lien sache ce à quoi il mène!
Voici notre titre à la base:
Code:
<h2>Coup de coeur Février</h2>

A présent je rajoute ma balise:
Code:
<a name="fevrier"><h2>Coup de coeur Février</h2></a>

Etape 2: créer le lien qui mène à ma balise

Je vais écrire cette phrase "Voir les coups de coeur de février" qui sera mon lien vers la balise
Code:
<a href="#fevrier">Voir les coups de coeur de février</a>


Créer un lien infratexte dans une autre page:

Imaginons que sur votre page index, vous créez le best of des coups de coeur. Vous voulez créer un lien qui mènera directement au coup de cœur de février qui restera gravé à jamais dans votre mémoire!

Voici dons le code du lien qui permet depuis la page index.html d'atterrir directement dans la page coup_coeur.html au niveau de la balise fevrier.
Code:
<a href="coup_coeur.html #fevrier">Février for ever</a>

Vous avez tout compris?

  • /
    • :dossier: creation
      • :dossier: ecriture
        • sommaire_poeme.html
        • poeme.html


Dans votre page poème vous avez:
Ode à mon chat
La pâte de coing
Mes sims et moi

Vous devez transformer les intitulé en titre de niveau 3
Vous devez céer un lien dans votre page sommaire_poeme.html qui vous mènera directement au poème Mes sims et moi

Quel est le code pour le titre ET pour le lien qui menera à celui-ci?
Réponse
Spoiler:
 


Spoiler:
 
Revenir en haut Aller en bas
http://fuyaya.tumblr.com/
Admin
avatar
Fuyaya
Admin
Féminin Date d'inscription : 29/09/2009
Age : 38
Localisation : Aubais

MessageSujet: Re: [Apprenti] Créer des liens interne (ancre) ou externe (un autre site)   Mer 04 Nov 2009, 11:49

J'espère que c'est clair.
Pour répondre aux question prenez un bout de papier et un stylo parce que de tête c'est moins facile

N'hésitez pas si vous avez des questions et n'oubliez pas que ce que j'ai appris c'est grâce au  Site du zéro
N'hésitez pas a lire les tutos  

Edit pour rajouter le lien comme le suggère Idjya

----------------------------------------------

Idjya a écrit:
La touche _ (le 8 en haut du clavier et non sur le pavé numérique parce que j'en connais qui cherche encore et je ne vise personne) se nomme "underscore" (toutes les touches ont un nom connus de la plupart des utilisateurs de clavier, il est bon de les connaîtres, ça évite les "C'est quoi [Shift]?"...)

Plus les noms des pages sont courts et plus le chargement de la page se fait rapidement, c'est pourquoi j'ai conseillé à Fu de diminuer le nom de ses pages et de chiffrer toutes les images (les miennes pour ma chronique des Clarens sur mon site se nomment par exemple cla_01.jpg). Ce n'est qu'un exemple.

De plus, si vous donnez toujours le même style de nom à vos pages, vous aurez plus de facilité à écrire les codes pour les liens que Fuyaya démontre dans ce tutoriel!
----------------------------------------------

MODE D'EMPLOI

N'hésitez pas à remercier l'auteur de ce tutoriel ou à faire partager votre expérience personnelle. Si vous avez créé quelque chose en suivant le tuto pourquoi pas la poster afin de la montrer à l'auteur

-----------------------------------------

Pour d'éventuelles questions, c'est par ici et si vous souhaitez en apprendre plus sur le sujet, rendez-vous dans la salle travaux pratiques

Bonne journée



Spoiler:
 


Dernière édition par Fuyaya le Sam 11 Jan 2014, 22:42, édité 3 fois
Revenir en haut Aller en bas
http://fuyaya.tumblr.com/
Ange gardien
avatar
idjya
Ange gardien
Féminin Date d'inscription : 05/10/2009
Age : 39
Localisation : Cholet

MessageSujet: Re: [Apprenti] Créer des liens interne (ancre) ou externe (un autre site)   Mer 04 Nov 2009, 13:16

Merci Fu!
Revenir en haut Aller en bas
http://idjya.eklablog.com
As de l'acrylique
avatar
Cynimich
As de l'acrylique
Masculin Date d'inscription : 12/10/2009
Age : 22
Localisation : Québec

MessageSujet: Re: [Apprenti] Créer des liens interne (ancre) ou externe (un autre site)   Mer 04 Nov 2009, 13:42

Ah ! Ben merci ^^

Ça démêle beaucoup dans les méandres de l'internet ^^
Revenir en haut Aller en bas
Poseur d'avant-garde
avatar
Uriox04
Poseur d'avant-garde
Masculin Date d'inscription : 14/10/2009
Age : 24
Localisation : Nantes/Challans

MessageSujet: Re: [Apprenti] Créer des liens interne (ancre) ou externe (un autre site)   Mer 04 Nov 2009, 17:51

Super tuto! Tres bien expliqué!
Je n'aurai pas pu faire mieux lol Very Happy
Bravo fu!! Very Happy
Revenir en haut Aller en bas
http://www.simcasa.fr
Maître du Jeu
avatar
Goby03
Maître du Jeu
Masculin Date d'inscription : 21/08/2012
Age : 21
Localisation : quelque part en auvergne

MessageSujet: Re: [Apprenti] Créer des liens interne (ancre) ou externe (un autre site)   Sam 22 Déc 2012, 14:30

Merci pour ce super tuto Fu'. Il va mettre très pratique pour les listes et mon blog.



Merci Maya pour ces superbes signatures !

Spoiler:
 
Revenir en haut Aller en bas
http://plaisirdessims.blogspot.fr/
Grand artiste du pinceau
avatar
Katnat
Grand artiste du pinceau
Féminin Date d'inscription : 31/05/2012
Age : 50

MessageSujet: Re: [Apprenti] Créer des liens interne (ancre) ou externe (un autre site)   Dim 30 Déc 2012, 18:37

Merci beaucoup Fuyaya pour ce tuto.
Je viens de l'utiliser pour la liste grunge et je crois que j'ai réussi. C'est magique
Revenir en haut Aller en bas
Contenu sponsorisé


MessageSujet: Re: [Apprenti] Créer des liens interne (ancre) ou externe (un autre site)   

Revenir en haut Aller en bas
 
[Apprenti] Créer des liens interne (ancre) ou externe (un autre site)
Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» Liens importants
» HOSPITTLER - Apprenti Chapelain (F - N)
» Des liens à ne pas manquer (pour voir de très belles figu!)
» Un apprenti panda...
» [ABANDON] Un jeune apprenti .

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Sims Artists :: Apprentissage :: Informatique et Internet :: HTML / CSS-
Sauter vers: