IRCC - Opimization prototyping space

This is a repository used by IRCC to prototype and test ideas.

How to use the templates

1. Select one of the templates in the template folder:

• basic: basic layout (https://test.canada.ca/ircc/templates/template-basic-en.html)
• subway-landing: index page for the subway pattern (https://test.canada.ca/ircc/templates/template-subway-landing-en.html)
• subway-section: page with the subway navigation on the right (https://test.canada.ca/ircc/templates/template-subway-section-en.html)
• topic: page with the beta theme-topic layout (https://test.canada.ca/ircc/templates/template-topic-en.html)
• steps: page with numbered steps (with big numbers in circles) (https://test.canada.ca/ircc/templates/template-steps-en.html)

2. Duplicate the template in the right folder - or copy the code from the template in a new file in the right folder

3. Modify the title tag and the breadcrumb trail, if applicable

4. Locate the section that has this comment: "CONTENT STARTS HERE"

5. Start editing the content - you can copy paste patterns from the basic template, or copy-paste code from other Canada.ca pages

6. Besides the title and breadcrumb trail, only edit code that's between CONTENT STARTS HERE and CONTENT ENDS HERE.

Import a page from Canada.ca

If you want to bring a Canada.ca page in GitHub to test ideas:

1. Duplicate or copy the code of the basic template in the right folder and give it an appropriate name

2. Go to the Canada.ca page, and open the source code

3. Copy the code, starting with the H1 tag, and stopping before a div called "pagedetails", which starts the prefooter with the Report a problem1

4. Paste the code in the GitHub file, replace all the code that starts with the H1 and ends right before the 'CONTENT STOPS HERE' comment.

Links in GitHub

Relative links in GitHub are odd.

• ./ looks for the path in the folder you're on
• ../ looks for the path one folder up
• ../../ looks for the path 2 folders up
• etc.

---

IRCC - Espace de prototypage de l'équipe d'optimisation

Ceci est un dépôt tilisé par IRCC pour réaliser des prototypes et tester des idées.

Comment utiliser les modèles

1. Sélectionnez l'un des modèles dans le dossier des modèles :

• basic : mise en page de base (https://test.canada.ca/ircc/templates/template-basic-fr.html)
• subway-landing : page d'index pour la navigation de style métro (https://test.canada.ca/ircc/templates/template-subway-landing-fr.html)
• subway-section : page de section avec la navigation de style métro sur la droite (https://test.canada.ca/ircc/templates/template-subway-section-fr.html)
• topic : page avec la mise en page Bêta pour les pages de thème et de sujet (https://test.canada.ca/ircc/templates/template-topic-fr.html)
• steps : page avec les étapes numérotées avec un gros chiffre (https://test.canada.ca/ircc/templates/template-steps-fr.html)

2. Dupliquez le modèle dans le bon dossier - ou copiez le code du modèle dans un nouveau fichier dans le bon dossier.

3. Modifiez la balise titre et le fil d'Ariane, le cas échéant.

4. Localisez la section qui a ce commentaire : "CONTENT STARTS HERE"

5. Commencez à modifier le contenu - vous pouvez copier-coller les modèles du modèle de base ou copier-coller le code d'autres pages de Canada.ca.

6. Outre le titre et le fil d'Ariane, ne modifiez que le code qui se trouve entre CONTENT STARTS HERE et CONTENT ENDS HERE.

Importer une page de Canada.ca

Si vous voulez importer une page de Canada.ca dans GitHub pour tester des idées :

1. Dupliquez ou copiez le code du modèle de base dans le bon dossier et donnez-lui un nom approprié.

2. Allez sur la page Canada.ca et ouvrez le code source.

3. Copiez le code, en commençant par la balise H1, et en vous arrêtant avant un div appelé "pagedetails", qui commence le pré-pied de page avec la section "Signaler un problème ou une erreur sur cette page".

4. Collez le code dans le fichier GitHub, en remplaçant tout le code qui commence par le H1 et se termine juste avant le commentaire 'CONTENT STOPS HERE'.

Liens dans GitHub

Les liens relatifs dans GitHub sont étranges.

• ./ recherche le chemin du fichier dans le dossier dans lequel vous vous trouvez.
• ../ recherche le chemin du fichier un dossier plus haut
• ../../ cherche le chemin du fichier 2 dossiers plus haut
• etc.