MODULES WEBMASTER WEBMASTER

Transcription

1 WEBMASTER Pré requis La maîtrise de l environnement Windows ou Mac est fortement recommandé ainsi que l utilisation d internet. Toute personne ayant à gérer des sites web statiques et dynamiques. Etre en mesure de réaliser des sites webs statiques et dynamiques à l allure professionnelle, les mettre à jour et les positionner dans les premiers résultast des moteurs de recherche. Un poste par personne, exposés théoriques, mise en pratique, suivi de travaux de synthèse reprenant les points abordés : 24 jours (24*7h = 168 heures) Introduction, ce que vous avez à savoir Les langages du web HTML / XHTML / HTML5, CSS / CSS3, Javascript, PHP / MySQL. Comment coder en respectant les standards du web? Travailler avec un CMS ou framework Référencer et positionner un site sur un moteur de recherche Où héberger mon site? Quel nom de domaine choisir, où l acheter? Comment mettre en ligne mon site? Formation HTML / XHTML / CSS HTML et XHTML sont des langages dit de description, ils sont des références pour la création de page statique. Le CSS pemet de mettre en forme votre contenu. : 3 jours Formation HTML5 / CSS3 HTML5 est le dernier standard du web, il devient désormais un incontournable, le CSS3 révolutionne le web. : 3 jours Wordpress Le plus célèbre des systèmes degestion de contenu, un incontournable dans les agences web. : 3 jours Prestashop Réaliser facilement votre boutique en ligne avec Prestashop : 3 jours PHP / MySQL Découvrez la programmation en PHP ert manipuler facilement vos bases de données MySQL. : 4 jours Référencement naturel Positionner votre site web dans les premiers résultats des moteurs de recherche. : 1 jour Javascript Javascript et le web devient encore plus dynamique notamment grâce aux apports d ajax et Jquery. : 2 jours Boostrap Twitter et Zurb Foundation Découvez la puissance de ces 2 frameworks. : 5 jours INTRA-ENTREPRISE 400 HT par jour pour la 1ère personne par personne supplémentaire INTER-ENTREPRISE 250 HT par jour et par personne POLE EMPLOI 200 HT par jour et par personne

2 HTML / XHML / CSS Une connaissance du monde de l internet (navigation, recherche) est requise Toute personne désirant créer un site web statique en HTML / XHTML et CSS sans utiliser un éditeur WYSIWIG. Être en mesure de créer des pages web statiques en HTML/ XHTML avec un éditeur basique (Notepad ++) et les mettre en forme avec du CSS. Un poste par personne, exposés théoriques, mise en pratique, suivi de travaux de synthèse reprenant les points abordés. : 3 jours (3*7h= 21 heures) Le matériel et les logiciels Ressources nécessaires Quel éditeur choisir? Notepad ++, Netbeans, Brackets Les navigateurs Structure de base d un document HTML La balise HTML Définition de l encodage La balise HEAD Les metas informations Les balises utiles pour le référencement La balise BODY Mettre en forme du texte Le formatage du texte Les balises d entêtes Les listes non ordonnées Les listes ordonnées Les listes de définition Les abbréviations Les espaces insécables, les sauts de ligne... Les caractères accentués Les paragraphes L alignement des éléments Les tableaux Insertions de tableaux Insertion de lignes et colonnes Fusionner des lignes et colonnes Fractionner des lignes et colonnes Remplissage avec une couleur Mise en forme avancée avec des tableaux Les principaux attributs des tableaux Les images Les formats d images du web Les contraintes liées aux images Insertion d images Les liens hypertexte sur une image Les principaux attributs d une image Les liens hypertexte Création de lien hypertexte sur du texte Vers une page web, vers un serveur ftp Création de lien vers messagerie (mailto) Création de lien hypertexte sur des images Les principaux attributs sur un lien hypertexte Les médias Insertion de flash Insertion de vidéo Flash Insertion de vidéo Youtube Les formulaires La balise form Les champs de texte Les zones de texte Les listes déroulante Les boutons radiox Les cases à cocher Les boutons envoyer et rétablir HTML avancé Insertion de code Javascript. Gestion des couleurs web Caractères spéciaux LC Formateur , rue de Lecelles St Amand les eaux - Bureau : 57 rue des Féves St Amand les Eaux - Tél: +33 (0) Gsm : +33 (0) contact@lc-formateur.com Siret: Déclaration d activité enregistrée sous le numéro

3 HTML / XHML / CSS (SUITE) Norme actuelle et tendance du CSS CSS 2 CSS 3 Compatibilé dans les navigateurs Mettre en ligne mon site De quoi ai je besoin? Les outils indispensables Mise en forme à l aide de CSS Principes des styles Créer des régles de style Comment structurer le CSS? Ou placer votre code CSS? Dans une feuille de style externe Dans un document Dans un style intégré Avantages et inconvénients des différentes méthodes La syntaxe Les sélecteurs de style Les balises Les classes Les identificateurs Les sélecteurs d éléments imbriqués (Héritage) Les pseudo-éléments : les liens CSS, les lettrines Les propriétés CSS La gestion du texte, polices, couleur, taille, grassage... Les arrière-plans Les blocs Les boites Les bordures Les listes Le positionnement Appliquer un style CSS à un élément Sur quelle balise HTML? Avec une classe Avec une id Avec la balise span Cas pratiques Colonnes en CSS Eléments flottants Mise en forme de menu Jquery en CSS Développement d un site en XHTML et CSS

4 HTML5 / CSS3 Connaissance de base des pages web et de la programmation web Développeur web, webmaster Comprendre l importance d HTML 5 et savoir créer des pages web simples en utilisant HTML et CSS 3. Un poste par personne, exposés théoriques, mise en pratique, suivi de travaux de synthèse reprenant les points abordés. 3 jours (3*7= 21 heures) HTML5 Définition et orientations d HTML5 L histoire d HTML et CSS Aperçu des nouveaux standards HTML 5 et CSS3. Définition des pages web et des navigateurs Séparation du contenu (code HTML 5) et de la mise en forme (feuille de style CSS) Utilisation des requêtes multimédias La compatibilité des navigateurs et le futur de HTML 5 Définition des parties de la page par des sections Les balises et les parties de la page HTML 5 : <section>, <article>, <aside>, <nav>, etc Sous-sections HTML 5 : <header>, <hgroup>, <footer> Simplification des contenus multimédias (audio, vidéo, animations) Logiciel de lecture intégré au navigateur Balises simplifiées <audio> et <video> Insertion simplifiée de contenus Flash Les Formats vidéos : Theora, H264 et WebM (codec VP8 ) Définition des éléments graphiques Canvas et le dessin de graphiques sur une page web SVG (Scalable Vector Graphics) et la création de graphiques interactifs CSS3 Les nouveaux sélecteurs CSS3 Puissance des sélecteurs Cibler des balises au sein du même parent Cibler les balises en fonction de leurs attributs Les nouvelles pseudo classes Les bordures des blocs Création et réglage des coins arrondis Utilisation d images Les ombres et effets d ombres Le fond des blocs Spécifier la taille Définir son positionnement Sélection de plusieurs fonds Le texte Ombres et effets d ombres Coupures et mises à la ligne Justifier et aligner le texte Utilisation de polices personnalisées Transformations, transitions et animations Les effets 2D Les effets 3D Les animations simples et multiples Multicolonnage automatique Nombre et largeur des colonnes Trait de séparation des colonnes Espacement entre les colonnes Equilibrage des colonnes

5 JAVASCRIPT La connaissance du HTML, la pratique d un langage de programmation est un plus Concepteurs ou futurs concepteurs de sites web concevoir des sites web interactifs en utilisant JavaScript et DHTML, créer des animations, des interfaces sécurisées... Un poste par personne, exposés théoriques, mise en pratique, suivi de travaux de synthèse reprenant les points abordés 2 jours (2*7h= 14 heures) Les bases du langage Qu est-ce que JavaScript? Maîtriser les bases : variables, expressions, opérateurs, structures de contrôles Définir des fonctions Gérer les erreurs Accéder aux ressources du navigateur Objets Javascripts Les objets String, Math, Date, Array, Window, Navigator Les méthodes et fonctions JavaScript Animation Gérer les événements OnLoad, OnUnload Gérer les rollovers : OnmouseOver, OnmouseOut Déclencher par rapport au temps : setinterval et settimeout Gérer les zooms, les diaporamas Le DHTML et DOM Accéder aux éléments du document HTML via DOM Modifier, masquer et afficher des objets DHTML Modifier dynamiquement les attributs des éléments d interface (Police, couleur ) Déplacer du texte, des images Gérer un menu dynamiquement Les apports d Ajax L objet HttpRequest Accéder à des ressources et éléments XML et/ou PHP Les bibliothèques Ajax : prototype, script.aculo.us. Les flux RSS Contrôle des données de formulaire Gérer les objets Form, Text, Checkbox, Radio, Button, Submit Utiliser les litstes : Select, Option Sécuriser les saisies Gérer les évenements Javascript Valider les données avec OnSubmit Aider à la saisie avec OnFocus Vérifier les données avec OnChange, OnBlur

6 BOOTSTRAP TWITTER Des connaissances de base en HTML, CSS sont un plus indéniable. Concepteurs ou futurs concepteurs de sites web. Etre en mesure de concevoir des sites web responsive au design innovant avec le framework Bootstrap. Un poste par personne, exposés théoriques, mise en pratique, suivi de travaux de synthèse reprenant les points abordés 3 jours (3*7h= 21 heures) Introduction et prise en main Présentation : concept, versions et historique Qu est-ce qu un framework CSS Framework CSS et «UI Kit» Ressources : Bootstrap Expo Les plug-ins et autres extensions Télécharger et intégrer Bootstrap Générer une version personnalisée de Bootstrap Le système de grille Mise en page statique, fluide, adaptative Le principe Utiliser plusieurs grilles dans une page Imbriquer des grilles Modifier l ordre des colonnes Atelier : création de gabarits de mise en page Les éléments de base (CSS) Présentation La typographie L insertion de code Les tableaux Les images Les outils CSS Atelier : création d une page article Les panneaux Les barres de progression Atelier : création d une fiche produit Les extensions Javascripts Présentation : API Bootstrap Les transitions Les boîtes de dialogue (modales) Menus déroulants Scrollspy Les onglets Les infobulles (tooltip et popover) Alertes et messages d information Afficher / Masquer des éléments : accordéon Carrousel Le système de navigation secondaire «Affix» Atelier : création d une page d accueil Personnaliser Bootstrap avec LESS Qu est-ce qu un préprocesseur Variables et mixins Règles imbriquées Fonctions internes à Bootstrap Composants et approche modulaire Atelier : Mise en place d un mini site complet Les composants réutilisables Les icônes Les boutons Les formulaires La navigation Le fil d Ariane La pagination Les badges Les vignettes et les médias Les listes

7 ZURB FOUNDATION Des connaissances sur le HTML et CSS sont indispensables pour appréhender sereinement cette formation. Etre en mesure de concevoir des sites RWD et les maintenir à jour à l aide du framework Zurb Foundation. Concepteurs ou futurs concepteurs de sites web. Un poste par personne, exposés théoriques, mise en pratique, suivi de travaux de synthèse reprenant les points abordés 2 jours (2*7h= 14 heures) Introduction Qu est-ce qu un framework CSS? Trouver des ressources sur le net Télécharger et installer Foundation Du CSS structuré Organisation de la feuille de style Les medias queries Principe et fonctionnement Le système de grille fluide Le principe de la grille Compter jusqu à 12 Mise en page Utiliser plusieurs grilles dans une page Imbriquer des grilles Les basiques La typographie Les positionnements Les tableaux Les tableaux de prix Les images Les styles imprimables Visibilité en fonction de la taille d écran Les panneaux Les égaliseurs Les barres de progression Vidéo adaptive Les extensions JS Les menus déroulant (Off-canvas, Magellan Sticky nav ) Les boites de dialogue (modal) Les infobulles Les accordéons Les onglets Diaporama Orbit slider Galerie d image Lightbox Les validations de formulaire Personnaliser Foundation avec SASS Qu est-ce qu ;un préprocesseur CSS? Quel intérêt? Les variables Les mixins Les composants Les boutons et groupes de bouton Les formulaires, switch et barres de rangées La navigation Le fil d Ariane La pagination Les étiquettes Les vignettes et les médias Les listes

8 WORDPRESS L utilisation régulière d un système d exploitation Windows ou Mac et d un navugateur internet est nécessaire Toute personne ou webmaster souhaitant créer son site web et l administrer via CMS Maîtriser le CMS Wordpress pour créer et administrer un site Internet. Un poste par personne, exposés théoriques, mise en pratique, suivi de travaux de synthèse reprenant les points abordés 3 jours (3*7h= 21 heures) Installer Wordpress Présentation de Wordpress Installation locale de WAMP Modification du fichier de configuration Installation de Wordpress en 5 minutes Les articles Créer, modifier, supprimer un article Mise en forme de l article ation Créer, modifier, supprimer une catégorie Affecter un article à une catégorie Les mots clés Les médias Ajouter, modifier, supprimer une image Joindre un fichier à un article ou une page Les liens Insertion de lien Les options du lien Ajouter, modifier, supprimer une catégorie de lien Les pages Créer, modifier, supprimer une page Mise en forme de la page ation Mettre une image à la une Les commentaires Ajouter un commentaire Gérer les statuts des commentaires L apparence Installer, activer un théme Les options du théme Activer, déscativer un Widget Ajouter, modifier, positionner un menu Gérer l entête de votre site Changer l arrière plan de votre site L editeur (Modifier le code HTML, CSS, PHP) Les extensions Installer une extension Activer, désactiver une extension Configurer une extension Editer une extension Les utilisateurs Ajouter, modifier un utilisateur Affecter les droits aux utilisateurs Gérer votre profil Les outils Installer de nouveaux outils Les imports Les exports Les réglages Paramétrage du blog Les options de lecture et d écriture Les options de discussion Les options des médias Les options des permaliens Mise en ligne de votre blog Quel type d hébergement? Transférer mon site chez mon hébergeur

9 PRESTASHOP Utilisation régulière de système Windows ou Mac et d un navigateur internet Toute personne désirant mettre en place un site marchand. Être capable d installer et d administrer une boutique en ligne réalisée avec Prestashop Un poste par personne, exposés théoriques, mise en pratique, suivi de travaux de synthèse reprenant les points abordés 3 jours (3*7h= 21 heures) Téléchargement et installation Télécharger Prestashop Installer un serveur local pour configurer sa boutique Configuration de prestashop Transfert FTP pour la mise en ligne Configuration de la boutique Gestion des langues Gestion des taxes (zones, états) Gestion des transporteurs et des livraisons Gérer vos préférences de boutiques (apparence, logo, s...) Le catalogue des produits Créer et supprimer des catégories de produits Créer et renseigner des fiches produits Créer des déclinaisons de produits (tailles, couleurs, ) Gérer le catalogue (fabricants, attributs, prix dégressifs) Personnaliser sa boutique Prestashop Les outils nécessaires Installer des templates Déplacer les blocs dans la page Les plus Créer des bons de réduction Insérer des CMS (création de pages de contenu) Gérer de multiples utilisateurs et de leurs permissions Statistiques et optimisation du volume de commandes Visualiser des paniers Optimiser référencement SEO (URL-rewriting, keywords ) Sauvegarde et sécurité Principales règles de sécurité Sauvegarder le site Sauvegarder la base de données Les comptes clients Créer et modifier des comptes clients Gérer des groupes de clients Les commandes et la facturation Gérer les commandes et les factures Gérer des retours produits et avoirs Gérer des stocks produits Mode de paiement sécurisé Présentation des solutions de paiement Avantages et inconvénients Installation d un module bancaire

10 PHP / MYSQL Pré- requis Avoir de bonnes bases et connaissances en HTML, utiliser couramment Internet Toute personne souhaitant s initier à la programmation sous PHP afin de développer des applications performantes Acquérir les compétences indispensables au développement de sites internet dynamiques. Savoir manipuler les données d une base de données relationnelles à partir de l application. Mettre en œuvre les sessions pour conserver l information côté serveur Un poste par personne, exposés théoriques, mise en pratique, suivi de travaux de synthèse reprenant les points abordés : 4 jours (4*7h= 28 heures) Les bases du langage PHP Constantes, variables, types de données Les opérateurs de calcul et les opérateurs logiques Les structures de contrôle (if, switch) Les boucles itératives (for, while, do, foreach) Inclusion de fichiers (include, require) Les chaînes de caractères Mise en forme, gestion des espaces HTML et caractères spéciaux Recherche et comparaisons de sous-chaînes La concaténation Les expressions régulières Les tableaux (Array) Les différents types de tableaux (indicés, associatifs) Création de tableaux Les différentes méthodes pour lire un tableau Opération sur les tableaux (extraction, tri, ajout ou suppression d éléments) Les fonctions Créer ses fonctions Fonctions avec un nombre de paramètres variables Portée des variables Divers Redirection et headers Insertion de javascripts Manipulation des dates Manipulation des chaînes de caractères Collection de bibliothèques PEAR Gestion des formulaires Rappel sur les éléments de formulaires Méthodes GET et POST Récupération des paramètres ($_GET, $_POST) Upload de fichiers Gestion des fichiers Création, ouverture et fermeture d un fichier Lecture, écriture et modifications de fichiers Informations sur les fichiers Les s Envoi de mail simple Envoi de mail HTML avec pièces jointes Gestion des erreurs Gérer les erreurs d un site Web Création d un fichier de logs Sécurité Fichier.htaccess et.htpassword Injections SQL : principe et contre-mesure Fichier php.ini Variables persistantes : Cookies et Session Avantages et inconvénients des cookies et sessions. Les variables de session Fonctions liées aux variables de session Utilisation des Cookies Utilisation d une base de données Mysql Présentation de Mysql et des concepts fondamentaux Les bases, tables, champs, enregistrements Introduction au langage SQL Sélection, modification, suppression Fonctions Mysql Traitement des résultats des requêtes et encodages UTF-8 / ISO

11 REFERENCEMENT NATUREL La connaissance du monde de la création de site web est indispensable pour cette formation Webmaster débutant ou confirmé, responsables marketing Être en mesure de référencer son site dans les moteurs de recherche et annuaires et obtenir des résultats dans Google qui est le moteur de recherche de référence Un poste par personne, exposés théoriques, mise en pratique, suivi de travaux de synthèse reprenant les points abordés 1 jour (1*7h= 7 heures) Qu est ce que le référencement et le positionnement? Définition Pourquoi référencer son site? Positionner son site en 1ère page sur les moteurs de recherche Le référencement naturel ou payant Différence entre les 2 méthodes Avantages et inconvénients Les moteurs de recherche Qu est ce qu un moteur de recherche? Les principaux moteurs de recherche Comment un moteur de recherche voit mon site? Ajouter mon site Les annuaires Qu est ce qu un annuaire? Y a t-il encore un intérêt? Défini des mots clés Définir une cible Définir une zone Définir des groupes de mots clés pertinents Le codage de votre site Les éléments à prendre en compte lors de la création La structure des pages Le nom des pages Quelles sont les balises à ne pas négliger? L importance des liens Avoir un code source valide W3C Valider mon code source Un peu de marketing Rendre mon site plus attractif Rédiriger un contenu intéressant et cohérent Placer les éléments au bon endroit Le pagerank de Google Qu est ce que le PageRank Comment l augmenter? L échange de lien L impact des réseaux sociaux Quel intérêt? Pourquoi communiquer sur les réseaux sociaux? Facebook Google + Twitter Viadéo etc... Une version mobile Est ce indispensable? Le responsive design Aprés avoir indexé mon site Que dois je faire? Mon site n est pas retrouvé, comment faire? Les outils Un compte Gmail Google analyttics Intégration Exploitation de l outil Opter pour des méthodes correctives Les outils pour les webmaster Analyse Opter pour des méthodes correctives