BLOGUE 9) Exemple de banderoles

Vous pouvez modifier le gabarit de votre blogue selon votre design (Layout Tab > Edit HTML). Assurez-vous de faire une copie de votre gabarit avant de retravailler le code.
Une façon simple de modifier un blogue est de remplacer la banderole (blog header). (Layout Tab > Page Elements)

• Free Webpage Headers (en anglais)
• 45 Free Beautiful Blog Headers (en anglais)

Assurez-vous de télécharger des banderoles qui sont fournies selon la licence Creative Commons. Selon Wikipedia, les licences Creative Commons constituent un ensemble de licences régissant les conditions de réutilisation et/ou de distribution d'œuvres (notamment d'œuvres multimédias diffusées sur Internet).
C’est-à-dire, il est important que vous avez le droit de partager (copier et distribuer) et de modifier une image pour des fins non commerciales.
Ou simplement, faites vos propres banderoles!

BLOG 9. Example of a blog header

You can modify your blog template to fit your own design (Layout Tab > Edit HTML). Always make a copy of your original template before tweaking the code.
An easy way to customize your blog is to replace the blog header (Layout Tab > Page Elements) .

• Free Webpage Headers
• 45 Free Beautiful Blog Headers

Make sure to download page headers that are provided under a Creative Commons License. Creative Commons is a non-profit organization dedicated to allowing creators to easily and freely share their work with others through the use of six basic types of licenses.
In simple terms, make sure you have the rights to Share (copy, distribute and transmit) and to Remix (adapt) the work for Non Commercial uses.
Or better yet, make your own headers!

BLOGUE 8) Exemple d'une galerie de photos

Vous pouvez insérer une galerie de photos dans votre blogue en utilisant :

• Flikr (avec Yahoo)
• Picasa (avec Google).

BLOG 8. Example of a Slideshow

You can embed a slideshow into your blog by using applications like:

• Flikr (with a Yahoo account)
• Picasa (with a Google account).

BLOGUE 7) Exemple d'un clip vidéo d'une autre source

Vous pouvez aussi copier le code HTML (<embed>) d'un autre site Web afin de le copier dans votre blogue.

Voisins, 1952
« Court métrage d'animation le plus célèbre de Norman McLaren pour lequel il remporte un Oscar. Le film raconte l'histoire de deux voisins vivant dans l'amitié et le respect jusqu'à ce qu'une fleur pousse à la ligne mitoyenne de leurs propriétés. S'ensuit une querelle qui mènera les deux voisins au tombeau. » — Office national du film du Canada (ONF)

Musique Plus est un autre site Web qui vous permet d'intégrer leurs vidéos. Il suffit de cliquer sur le bouton "embed" pour copier et coller le code HTML dans votre blogue.

BLOG 7. Example of embedded video from other site

You can also copy and paste HTML code (<embed> tag) from other websites that share their content into your blog.

Neighbours, 1952
"In this Oscar®-winning short film, Norman McLaren employs the principles normally used to put drawings or puppets into motion to animate live actors. The story is a parable about two people who come to blows over the possession of a flower." — National Film Board of Canada (NFB)

Musique Plus is another site that allows you to embed their videos. Just click on the "embed" button to copy the HTML code into your blog.

BLOGUE 6) Exemple d’un clip vidéo YouTube

Vous pouvez facilement copier le code HTML pour votre vidéo dans l’interface YouTube, pour ensuite le coller dans un article dans votre blogue. Voici les paramètres de YouTube pour télécharger vers leur serveur :

• Format vidéo : MPEG4 (.AVI ou .MOV)
• Résolution pour la vidéo 4:3 : 640 x 480 pixels (ceci est l’ancienne résolution pour la télévision)
• Résolution pour la vidéo 16:9 : 1290 x 720 pixels (télévision grand écran)
• Format audio : MP3 (taux d’échantillonnage de 44.1 kHz)
• Images par seconde : 30
• Durée maximum : 10 minutes
• Grandeur maximum : 1 GB

Liens de référence : (en anglais)

1. How to add a video to your blog
2. YouTube Help Section

BLOG 6. Example of a YouTube movie

In the YouTube interface, you can easily copy and paste HTML code from your movie into your blog. Here are the video and audio upload settings that YouTube recommends:

• Video Format: MPEG4 (.AVI or .MOV) 
• Resolution for 4:3 video: 640 x 480 pixels (this is the older TV format)
• Resolution for 16:9 video: 1290 x 720 pixels (this is wide screen)
• Audio Format: MP3 (44.1 kHz sampling rate) 
• Frames per second: 30 
• Maximum length: 10 minutes 
• Maximum file size: 1 GB 

More helpful links:

1. How to add a video to your blog
2. YouTube Help Section

BLOGUE 5) Exemple d’une carte Google

Voir les langues dans une carte plus grande

Le IFRAME permet d’intégrer du contenu externe dans le blogue.

• Vous pouvez utiliser la carte Google de façon créative en insérant du texte, des images et des liens dans les fenêtres intruses (pop-up) au sein de la carte.
• Vous pouvez aussi utiliser vos propres icônes.

BLOG 5. Example of a Google Map

View Tongues in a larger map

The IFRAME enables you to embed external content into your blog.

• You can use a Google Map in creative ways by inserting text, images and links into the pop-up bubbles on your map.
• You can also use your own custom icons.

BLOGUE 4) Exemple d’un « roll-over »

Au lieu de vous fier à l’hébergement de Blogger, vous pouvez intégrer dans votre blogue des images qui sont hébergées sur votre propre serveur. Ceci vous donne plus de maîtrise par rapport à vos images et vous permet de faire des roll-overs.

BLOG 4. Example of a roll-over

You can also put images into your blog that are saved on your own server rather than in Blogger. This gives you more control over your images and allows you to make roll-overs.

BLOGUE 3) Exemple d’une image

Salon du Livre à Montreal

Note : Quand vous importez une image en Blogger, vous pouvez spécifier la taille. Toutes les images qu’on trouve actuellement en ligne ont une résolution de 72 ou 96 PPI (points par pouce), car un écran d’ordinateur ne peut pas afficher une résolution supérieure. Puisque les appareils numériques ont tendance à sauvegarder les images à une très haute résolution ou à une grande taille, l’application Blogger doit recadrer l’image afin qu’elle puisse être intégrée dans le gabarit. Le recadrage peut aussi améliorer la vitesse de téléchargement.

BLOG 3. Example of an image

Salon du Livre in Montreal

TIP: When you import an image into Blogger, you can specify the size. Anything on the Web needs to be 72 or 96 DPI (dots per inch) as a computer screen can only display these resolutions. The average digital camera saves pictures at a very high resolution or size. This is why the blog application needs to crop the image so that the image will fit into the template and also to improve download speed.

BLOGUE 2) Exemple d’un article (note ou billet)

Quelles sont les caractéristiques principales d’un blogue ?

• Rythme périodique c’est-à-dire l’élément chronologique (journal de bord ou journal intime)
• Nuage des mots-clés ou « tags » ou « labels » (permet la collaboration)

Vous pouvez structurer votre contenu selon :

• la date
• le thème (sujet, lieu, etc.)
• le rôle (rédacteur, journaliste, webmestre, photographe)

Note : Il est fortement suggéré de ne pas copier/coller directement de Microsoft Word en Blogger puisque ce logiciel va incorporer beaucoup de code superflu dans l’article. Vous pouvez soit coller votre texte dans un simple éditeur de texte avant de le coller en Blogger, soit utiliser la fonction « T » (en haut à droite) dans la fenêtre « Compose » pour enlever le code superflu.

BLOG 2. Example of a text post

What are the main characteristics of a blog?

• time element (like a journal or diary)
• tags (enables collaboration)

You can structure your content:

• by date
• by theme (subject matter, location, etc)
• by role (Editor, Journalist, Webmaster, Photographer)

TIP: It is advisable not to copy directly from Microsoft Word into the Blogger interface as Word brings a lot of unwanted formatting into your blog post. You can either paste your text into a simple text editor before pasting into Blogger or use the "T" icon at the top right of the Compose window to remove the formatting.

BLOGUE 1) Étapes pour créer un blogue

Quelles sont les étapes pour créer un blogue?

1. Recherche
   Pensez à ce que seront les grandes lignes de votre blogue. Quel sera le filon qui réunira le tout? Est-ce qu’il y aura un thème particulier? Quel sujet vous donne envie de faire de la recherche et rédaction? Visitez d’autres blogues pour trouver de l’inspiration.
   
   
2. Planification
   a) Il faut d’abord créer un profil Google. Ceci vous aidera à créer d’autres profils connexes (Blogger, Google Maps, Picasa et YouTube).
   b) Écrivez tous ces détails dans un petit carnet ou dans un document électronique (GoogleDocs) pour faciliter l’accès.
   
   
3. Créer le blogue
   Lorsque vous créez le compte Blogger, vous pourriez modifier :
   a) l’adresse Web
   b) le gabarit (Template)
   c) la mise en page (Page Elements)
   d) les paramètres du blogue (Blog Settings)
   e) le profil personnel
   
   
4. Créer un billet (note, article)
   a) Insérer du contenu provenant d’autres logiciels (Notepad, Word ou Dreamweaver)
   b) Explorer la différence entre le mode « composer » et HTML
   c) Modifier une liste de billets
   d) Modifier la date et le temps de vos billets
   e) Utiliser des mots-clés (tags) pour structurer le contenu
   f) Insérer du contenu externe (carters, vidéos, audio, galerie de photos)
   
   
5. Modifier le gabarit de votre blogue selon votre design
   a) Remplacer la banderole (blog header)
   b) Faire une copie du gabarit
   c) Modifier le code HTML (mise en page, couleurs, images)
   d) Exporter le contenu de votre blogue dans un fichier de données XML pour enregistrer ou importer dans un nouveau gabarit
   
   
6. Faire la promotion de votre blogue
   a) Utilisez d’autres outils de média sociaux (Facebook, LinkedIn, Twitter, etc.) pour promouvoir votre blogue

BLOG 1. Steps to making a blog

What are the steps to making a blog?

1. Research
   Think about the overall concept of your blog. Will there be a particular theme? What would you like to blog about? What is your subject matter? Look at other blogs that inspire you to get ideas.
   
   
2. Set-up
   a) Create a Google Account. This will help you link other accounts (Blogger, Google Maps, Picasa and YouTube).
   b) Write all your account details in a book or make a digital file in Google Docs for easy access.
   
   
3. Create Blog
   When you create a Blogger account, you will be able to create your
   a) URL (web address)
   b) Template
   c) Page Elements
   d) Blog Settings
   e) Personal profile
   
   
4. Create Posts
   a) Paste content from other software (Notepad, Word or Dreamweaver)
   b) Explore difference between Compose and HTML mode
   c) Edit list of posts
   d) Modify the time and date of posts
   e) Use tags to structure content
   f) Embed external content (maps, videos, sound, slideshows)
   
   
5. Modify Blog Template to your own design
   a) Replace blog header
   b) Make copy of blog template
   c) Tweak HTML code (page layout, colours, images)
   d) Export your blog content into an XML file to save or import into new template
   
   
6. Promote your blog
   a) Use other social media tools (Facebook, LinkedIn, Twitter, etc.) to promote your blog

Bienvenue à Coucou graphique

Bienvenue au site Web de Coucou graphique où nous allons :

• APPRENDRE les techniques de base du blogage
• FAIRE des exercises simples afin d'intégrer du contenu multimédia
• EXPLORER des techniques de narration électronique.

Qu'est-ce Coucou graphique?

Coucou graphique fournit des conseils pratiques sur l'art du blogage — de Blogger à Twitter. Le blogue a servi d'outil pédagogique pour ces programmes éducatifs de Metropolis bleu.

Tweet Pals - Twitosphère propose aux Canadiens de 13 à 16 ans de vivre une expérience culturelle et linguistique unique, en correspondant dans leur langue seconde sur le réseau d'information Twitter et sur un blogue créé spécialement pour le projet.

Le programme VOISINS / NEIGHBOURS s'adresse aux jeunes de 14 à 19 ans en dehors du contexte scolaire. Il propose le développement, la création et la production d'un magazine électronique dans la deuxième langue officielle.

Pourquoi le coucou?

L'oiseau coucou annonce l'arrivée du printemps chaque saison et occupe habituellement l'horloge coucou. Malgré le fait qu'il a développé quelque peu une mauvaise réputation selon l'ornithologie et le folklore, Coucou graphique a adopté cet oiseau comme mascotte: pour son appétit vorace (pour l'art), pour son sens de travail et pour son esprit compétitif. Pour en savoir plus sur Coucou graphique.

Welcome to Cuckoo Grafik

Welcome to the Cuckoo Grafik site where we will:

• LEARN basic blog techniques
• DO simple exercises to integrate multimedia items
• EXPLORE digital narrative techniques.

What is Cuckoo Grafik?

Cuckoo Grafik provides simple blogging tips — from Blogger to microblogging (Twitter). This blog was used as a pedagogical tool for these Metropolis Blue Educational Programs.

Tweet Pals - Twitosphère is an innovative programme designed to provide young Canadians aged 13 to 16 with a unique linguistic and cultural experience through correspondence in their second official language, on the social network Twitter and on a blog.

NEIGHBOURS / VOISINS is an innovative project targeting young people aged 14 to 19 in an extracurricular context. It aims to improve young Canadians' linguistic abilities in the second official language through the development, creation and production of an electronic magazine.

Why the Cuckoo?

Renowned for its unique voice, the cuckoo bird is the harbinger of spring & the usual occupant of the cuckoo clock. Although it has developed somewhat of a bad reputation in ornithology & folklore, Cuckoo Grafik has adopted the bird as its moniker & mascot: for its voracious (art) appetite, its strong work ethic & its competitive drive. More about Cuckoo Grafik.