3 sites pour se former en ligne

Le web est un domaine qui évolue très rapidement. En tant que professionnel de ce secteur, je me forme encore régulièrement afin d’être à jour dans toutes les nouveautés. Il existe de nombreux sites qui permettent d’apprendre par vous même des nouvelles compétences ou d’approfondir ce que vous connaissez déjà. Je vous propose aujourd’hui une sélection de 3 sites pour en apprendre plus dans le domaine du web et du graphisme.

 

Adobe TV

L’excellente chaine d’Adobe. Vous souhaitez apprendre Photoshop, InDesign ou Lighroom? Vous retrouverez de nombreuses formations sur ce site. Les vidéos sont réalisées par des experts Adobe et des membres de l’équipe. Il s’agit d’une excellente source d’information… qui est gratuite en plus 🙂 La version FR comporte moins de vidéos mais elles sont toutes sous-titrées ou en français. Si vous vous sentez à l’aise avec l’anglais, consultez la version internationale qui comporte encore plus de formations.

former_formation_en_ligne_adobe_tv

 

Video2Brain

Vidéo2Brain est la version française de Lynda.com. Ce site est une référence dans le domaine de la formation en ligne. La plate-forme a d’ailleurs été rachetée par Linkedin. Vous retrouverez des formations dans le domaine de la création web mais également des cours de marketing, business,… Une qualité qui a un cout : 19,95€ pour un mois. Vous pouvez tester le site pendant 10 jours gratuitement avant. Il s’agit d’un petit investissement mais la qualité est là 😉

former_formation_en_ligne_video2brain

 

Code Academy

Vous souhaitez vous former au code? Envie de maitriser les langages HTML et CSS? Ce site est fait pour vous! Hyper bien fait et très complet, c’est une excellente ressource. La version de base est gratuite. Si vous souhaitez accéder aux cours supérieurs et au quizz, vous devrez passer à la version “pro” qui est également à 19,95€ par mois.

former_formation_en_ligne_codeacademy

 

Si vous souhaitez vous former, il existe donc des solutions gratuites ou peu cher pour apprendre à votre rythme, de chez vous. De mon côté, j’ai appris énormément comme cela. En lisant des tutoriaux, en regardant des vidéos,…

Connaissiez-vous ces sites? Aimez-vous apprendre par vous même?

Dites moi si vous utilisez ces sites 😉

HTML : 10 codes pour débuter

Je vous l’expliquais dans l’article précédent, connaitre quelques notions et codes d’HTML peuvent vous aider pour bloguer plus facilement. Aujourd’hui, je vous présente 10 codes pour débuter. Il s’agit de notions de base mais ces codes peuvent vraiment être très utiles.

J’ai regroupé les 10 codes qui je trouve les plus intéressants pour les blogs, mais qui sont également accessibles quel que soit votre niveau.

On commence avec un premier exemple 😉

Cela vous est déjà arrivé de vouloir faire un espace dans votre texte, ou dans un widget de votre sidebar, et que le formatage automatique de WordPress/Blogger supprime cet espace ?

Passez en mode édition HTML et inscrivez simplement </ br>

Ce petit code est l’équivalent de la touche “enter” en HTML. De quoi vous faciliter la mise en forme de vos textes 😉

 

Deuxième exemple : tracer un trait, pour faire une séparation, comme celle-ci :

 


 

Cette petite barre de séparation s’affiche grâce au code <hr />

 

Passons à quelque chose de plus “complexe”. Vous souhaitez insérer une image, alors qu’il n’existe pas d’option pour illustrer à cet endroit-là? :

<img src=«URL DE VOTRE IMAGE» />

Mettez simplement l’URL de votre image à l’endroit indiqué dans le code, et votre image s’affichera.

 

Comme il n’est pas évident de se souvenir des codes, je vous ai préparé une “Cheat Sheat”, une feuille antisèche en français 🙂

Celle-ci regroupe les 10 codes de base que je trouve important, accompagnés d’une explication à chaque fois.

 

html_cheat_sheet_10_codes_debuter

 

Cette feuille se trouve dans la librairie. Rendez-vous là pour la télécharger 😉 Vous pourrez alors la garder sur votre ordinateur, et copier-coller les codes quand vous en avez besoin.

 

J’espère que cela vous sera utile. N’hésitez pas à poser vos questions dans les commentaires.

Merci d’être de plus en plus nombreux à lire les articles du blog. Bonne soirée 🙂

HTML : connaitre les bases pour bloguer plus facilement

Je vous parle aujourd’hui d’HTML, un language utilisé pour coder et créer des sites. Ce sujet peut faire peur et être compliqué à aborder. Le but de cet article n’est pas de vous former de A à Z à l’HTML (il faudrait bien plus que 500 mots pour ça) mais de vous donner quelque clés pour aborder ce langage. En effet, pas besoin d’être un expert pour utiliser quelques codes qui vous faciliteront la vie. Je vous propose donc de découvrir quelques notions et vous explique comment les utiliser.

 

HTML?

Pour bien commencer, c’est quoi l’HTML? De son nom complet Hypertext Markup Language, c’est le format de données conçu pour représenter les pages. (Merci Wikipédia 😉 ). Vous voulez voir à quoi ressemble de l’HTML ? Faites simplement un clic droit sur cette page et sélectionner « afficher le code source ». Une nouvelle fenêtre va s’ouvrir avec cela :

 

html_blog_bloguer_wordpress_code

 

Il s’agit code entier de cette page, en HTML. Je vous rassure, pas besoin de défricher tout ça. Mais il y a une notion importante à connaître avant d’aborder la suite : les balises.

 

 

Les balises

Le langage HTML est composé de balises. Ce sont des « mots-clés », placés entre ces signes < >, qui donnent des indications au navigateur. Les balises expliquent comment une page, des photos, des parties de texte,… doivent être affichées.

A chaque fois que vous utilisez une balise, vous devez la fermer en utilisant la balise de fin. Il s’agit de la même balise avec un « / »

Par exemple :

<title>The Cherry on the Web</title>

La balise title indique qu’il s’agit du titre de mon site. C’est donc ce titre là qui s’affiche sur la fenêtre d’un navigateur.

 

Un autre exemple ?

<strong> Bonjour tout le monde ! </strong>

La balise strong indique que le texte doit être affiché en gras. Ici, le texte Bonjour tout le monde ! s’affiche donc en gras. Comme j’ai bien placé ma balise de fin après le point d’exclamation, le texte après ne s’affiche plus en gras.

 

Il se peut que vous utilisiez des balises dans des balises. L’ordre d’ouverture et de fermeture des balises doit être respectées.

Exemple :

 

html_blog_bloguer_wordpress_code2

 

Utilisation de l’HTML

 

Alors c’est bien chouette ces détails techniques mais concrètement, que pouvez-vous faire avec ces codes HTML ?

A un niveau débutant pour un blog, je vois deux aspects très pratiques :

–        Travailler dans l’éditeur de texte

–        Forcer certaines options dans les widgets

 

L’éditeur de texte.

Vous avez certainement déjà remarqué qu’il y a deux options pour écrire vos articles : Visuel & Texte.

html_blog_bloguer_wordpress_code3

La première, et certainement la plus utilisée, et un éditeur WYSIWYG. Vous avez un aperçu direct de votre texte. Pour mettre du texte en gras, il suffit de cliquer sur le bouton « bold ». Mais vous avez certainement déjà été bloqué par WordPress pour des mises en page plus complexes. Et oui, cet éditeur hyper pratique a ses limites. Si vous souhaitez avoir une meilleure prise en main de l’affichage de votre texte, et pouvoir jouer avec des options non présentes dans l’éditeur visuel, il est temps de passer au mode « texte ».

 

html_blog_bloguer_wordpress_code4

Votre article est ici en HTML. Vous pouvez désormais intégrer des balises HTML.

 

Les widgets

Pour la sidebar d’un blog, les widgets sont très utiles. Par contre, il n’y a pas toujours toutes les options nécessaires. Vous pouvez par exemple utiliser un widget pour indiquer vos réseaux sociaux et n’être pas satisfait car les liens s’ouvrent dans la fenêtre actuelle. Pour « débloquer » ce style de problème, utiliser les bons codes HTML est une solution très rapide et très facile.

Je vais vous donner un exemple concret. La partie « Librairy » du footer en bas de cette page est présentés comme cela :

html_blog_bloguer_wordpress_code5

 

Pour avoir exactement la mise en page que je souhaitais, j’ai simplement utilisé un widget de base « Texte » et ai ajouté mon image et le lien en dessous en html.

 

html_blog_bloguer_wordpress_code6

 

Connaître des codes HTML et savoir comment les utiliser est donc très pratique pour des blogueurs. Ils vous permettent d’avoir le rendu que vous souhaitez de manière très rapide.

 

Il reste un dernier élément : comment connaître les codes ? 🙂

Vous ne pouvez pas deviner par vous même quelle balise utiliser pour mettre du texte en gras ou en italic. Cela s’apprend. C’est pour cela que le prochain article vous présentera une première liste de code.

J’ai volontairement couper les deux parties sur deux jours, afin de vous laisser « digérer » cette théorie.

 

Si quelque chose n’est pas clair, n’hésitez pas à les poser dans les commentaires.

 

Bonne soirée et à bientot pour la suite !