Formation langage de script

Création site internet dynamique


S'inscrire Obtenir un devis

Durée :


05 Jours

Objectifs :


Savoir comment préparer et organiser les contenus prévus pour le site
Apprendre à élaborer la navigation entre les pages du site Internet
Maîtriser l'écriture du HTML
Comprendre et maîtriser la mise en page à l'aide des feuilles de style en cascade (CSS)
Être capable de configurer un serveur Web
Savoir gérer l'interface entre les pages du site, le serveur Web et la base de données
Pouvoir enrichir le contenu d'un site (vidéos, liens dynamiques)

Public :


Personnes utilisant la micro-informatique et Internet qui souhaitent concevoir et développer un site Internet et en assurer la mise à jour

Pré-requis :


Bonne connaissance d'Internet
Utilisation de Windows

Programme :


Partie 1 : Introduction à internet


Les concepts fondamentaux d'Internet ; Intranet
L'architecture du Web
La présentation des principaux navigateurs Internet

Partie 2 : Conception d'un site


L'arborescence d'un site
Les principes de la mise en page pour Internet
Les principes de la navigation interactive
Le traitement et le formatage des médias

Partie 3 : Le HTML


Le HTML : HyperText Markup Language
La création d'une page Web avec HTML et XHTML
Les éléments de l'en-tête et du corps d'une page HTML
Le formatage du texte avec des marqueurs
La création de liens hypertextes
Les listes ordonnées ou non
La conception de tables pour l'affichage de données
La définition des ancres relatives et absolues

Partie 4 : La mise en page à l'aide des feuilles de style en cascade (CSS)


L'attribution de propriétés de style aux balises et marqueurs HTML
La création et l'application de feuilles de style
L'utilisation de styles dans un menu de navigation
Le choix et l'application de styles avec les attributs CLASS et ID
Les feuilles de style externes

Partie 5 : Mise en oeuvre et fonctionnalités d'un serveur Web


La communication entre serveur et navigateur Web
Le protocole HyperText Transfer (HTTP)
Les serveurs

Partie 6 : Savoir configurer un serveur Web


La mise en place de la structure des répertoires
La configuration des accès et sécurisation
L'administration du serveur

Partie 7 : La programmation du serveur


L'interaction client;serveur;script
L'étude du fonctionnement d'applications Web côté serveur
L'accès aux données stockées sur le serveur Web
Le traitement des données côté serveur : PHP, JSP, ASP >> La différence entre les requêtes GET et POST
L'intégration d'un menu de navigation cohérent dans toutes les pages

Partie 8 : Le traitement des données avec des formulaires de saisie


La saisie des données utilisateurs à l'aide d'un formulaire HTML
L'ajout de zones de saisie texte, cases, boutons radio, listes de sélections d'un formulaire
La configuration d'un formulaire pour qu'il fasse appel à un programme côté serveur lors de son envoi
Le traitement des données recueillies par un formulaire à l'aide du langage PHP

Partie 9 : Les bases de données relationnelles et le Web


La définition d'une base de données
La description des enregistrements d'une base de données
Utilisation de SQL pour manipuler la base

Partie 10 : Comment connecter une page web et une base de données


Création de pages web pour insérer, supprimer et mettre à jour les enregistrements
Insertion et récupération des données à l'aide du langage PHP
Intégration de requêtes dans des programmes côté serveur

Partie 11 : Dynamiser et enrichir un site avec JavaScript


Les principes généraux du langage JavaScript
L'intégration de JavaScript s'exécutant dans les navigateurs Web

Partie 12 : Création de pages web interactives avec l'HTML dynamique (DHTML)


Combiner JavaScript avec des feuilles de style en cascade (CSS)
La compatibilité avec plusieurs navigateurs
Le positionnement dynamique de contenu dans une page
Comment afficher et masquer le contenu d'une page
La création d'images avec effet rollover en DHTML

Design Web avec Photoshop et Illustrator


S'inscrire Obtenir un devis

Durée :


05 Jours

Objectifs :


Comprendre et maîtriser les spécificités de la publication sur le Web (formats, interactivité, etc.).
Concevoir et réaliser l'interface des pages d'un site Web. Élaboration de la charte graphique, appropriation des fondamentaux de la présentation sur écran, ergonomie des sites et principes de navigation.

Public :


Graphistes

Pré-requis :


Aisance avec l'outil informatique. Connaître un logiciel de traitement d'images, d'illustration vectorielle serait un plus

Programme :


Partie 1 : Fondamentaux de la publication sur le Web et de l'interactivité


Introduction
Historique
Présentation du Web
Les formats
Les tailles d'écran
Les espaces colorimétriques : RVB et hexadécimal
Les différents formats de fichiers images
L'optimisation
L'interactivité
Les spécificités (non-linéarité de la publication Web)
Les liens hypertexte
Les différentes formes de sites Web : site statiques et site dynamiques

Partie 2 : Présentation des logiciels de la suite Adobe


Photoshop : présentation
L'interface et l'espace de travail
Création de nouveaux documents : le paramétrage
Les outils et les méthodes de sélection
L'organisation des calques
Le photomontage
Illustrator : présentation
L'interface et l''espace de travail
Création de nouveaux documents : le paramétrage
Le vectoriel
Les calques et les sous-calques
Les masques d'écrêtage
Dreamweaver
L'interface et l''espace de travail
Création de nouveaux documents : le paramétrage
le HTML : structure du dodument
Les liens hypertextes
La mise en forme
Présentation de Bridge
Présentation d'outils en ligne
Conception
Production
Analyse
Ressources

Partie 3 : Conception fonctionnelle d'un site Web


La préparation du projet
Rédaction du projet sous forme d’une note d'intention
Rédaction du cahier des charges
Définition
Les différents types de sites Web
Les sites vitrines
Le Portfolio
Les sites de e-commerce
Les sites communautaires
Les blogs
Les sites événementiels
Les différentes formes de sites Web
Les sites statiques
Les sites dynamiques
Les CMS
Les niveaux de navigation (navigation dans le site, accès aux rubriques et sous-rubriques, navigation horizontale, verticale, liens, etc.)
L'arborescence du site
Organisation des rubriques
Cinématique des pages
Ergonomie
Les principes de navigation (navigation dans le site, accès aux rubriques et sous-rubriques, navigation horizontale, verticale, liens, etc.)

Partie 4 : La conception graphique


La charte graphique : l'identité visuelle
Ce qui est autorisé, ce qui est défendu
Dimension, « zoning »
Définir les couleurs : titres, sous-titres, texte de lecture, liens hypertexte, boutons des menus, encadrés, etc.
Les styles des polices de caractères
Organiser son interface
Définition du fond d'écran et du fond de page
Définir les espaces (contenu, menus, bandeaux publicitaires, etc.)
Définir les différents niveaux de navigation (navigation dans le site, accès aux rubriques et sous-rubriques, navigation horizontale, verticale, liens, etc.)
Organiser son travail
Créer des bibliothèques de styles
Créer des bibliothèques d'objets
Exporter ses nuanciers
Exporter ses styles

Partie 5 : Réalisation : la page d'accueil


La présentation
Définition du fond d'écran et du fond de page
Définir les espaces (contenu, menus, bandeaux publicitaires, etc.)
Définir les différents niveaux de navigation (navigation dans le site, accès aux rubriques et sous-rubriques, navigation horizontale, verticale, liens, etc.)
Création d'une page d'accueil
Définir une grille de positionnement des différents éléments
Définir les emplacements et la mise en forme du contenu (texte, images, vidéos, etc.)
Prise en compte de l'ergonomie
Atelier pratique : création de l'interface d'une page d'accueil

Partie 6 : Réalisation : les rubriques


Création des pages de rubriques
Déclinaison de la charte graphique dans les pages intérieures
Organisation du contenu texte-images
Positionnement des barres et boutons des menus
Atelier pratique : création de l'interface de pages intérieures
Enrichissement graphiques
Les fonds
Les dégradés des bords
En-tête, pieds de pages
Les vignettes
Atelier pratique : création de l'interface de pages intérieures

Partie 7 : Exportation des documents graphiques


Exportation en html
Les outils tranche de Photoshop et de Illustrator
Les zones actives d'une image
Exportation d'un document au format html
Exportation de l'interface pour l'intégration html
Création des repères de zones
Découpage de l'interface
Optimisation des images
Les formats d'image : JPG, GIF, PNG
L'animation : GIF, Flash, CSS 3
Atelier pratique : création de l'interface d'une page Web dans un document html

Partie 8 : Finalisation de l'interface : l'intégration HTML


L'éditeur Web
Insertion des éléments dans une page html
Gestion des liens hypertexte
Insertion et gestion des menus et barres des menus (boutons, onglets, etc.)
L'optimisation des pages
Optimisation des images
Les transparences
Les dégradés
Atelier pratique : création d'un petit site Web comportant plusieurs rubriques

Partie 9 : Conclusion


De l'idée initiale à la réalisation finale
Bilan de la réalisation : contraintes, potentiel et spécificités
La promotion
Le référencement
Faire vivre son site

Découverte et création de sites web


S'inscrire Obtenir un devis

Durée :


05 Jours

Objectifs :


Comprendre les enjeux du Web
Découvrir les outils Web
Construire son propre site Web

Public :


Débutants dans le monde du Web

Pré-requis :


Aucun

Programme :


Partie 1 : Enjeux du Web


Écosystème
Utilité et risques du Web
Interconnexion aux réseaux

Partie 2 : HTML


W3C
HTML, XHTML >> DOM
Balises HTML

Partie 3 : CSS


Utilité
Déclaration d’une feuille de styles
Mise en place

Partie 4 : Javascript


Dynamiser du contenu
Présentation du framework jQuery

HTML 5.0, CSS3, créer des sites Web riches


S'inscrire Obtenir un devis

Durée :


02 Jours

Objectifs :


Apprendre à créer des pages en HTML5 et utiliser les nouvelles balises HTML5
Mettre en page et en forme avec CSS3
Etre capable de faire un site en HTML5
Connaître les nouvelles balises et leurs fonctionnalités

Public :


Webdesigners, webmaster, chefs de projets, ou toute autre personne en charge de site Web.

Pré-requis :


Connaissances de base de HTML et CSS.

Programme :


Partie 1 : Rappels


Contexte : fonctionnement d'un site internet
Rappel sur HTML
Position des navigateurs face aux technologies HTML.
Outils de développement HTML 5.
Les DTD : strict, transitional, frameset.
Les différents composants d'un document HTML : titres, paragraphes, liens, tableaux, formulaires...
Les commentaires.
La structure composite d'un document HTML : images, feuilles de style CSS, JavaScript, Flash...
Le modèle de document (DOM).
La nouvelle vision HTML5

Partie 2 : Introduction au HTML 5


Les objectifs de HTML 5. Les principaux concepts et apports. La " roadmap " de HTML 5. Quand utiliser HTML 5 ? Les différents composants

Partie 3 : HTML5 : structure et syntaxe


La structure d'une page
Les éléments traditionnels structurant un document HTML5 (doctype, html, head, body, meta, ...).
Les nouvelles balises et leurs attributs
Les nouvelles catégories de contenus : Metadata content, Flow content, Sectioning content, Heading content, Phrasing content, Embedded content, Interactive content.
Découvrir les APIs de dessin 2D, de lecture vidéo et audio
HTML5 et CSS3

Partie 4 : Les nouvelles balises HTML


Les images SVG pour le dessin vectoriel.
Les canevas pour le dessin "bitmap".
Différence Canvas vs SVG.
Les nouvelles balises : < mark >, < meter >, < time >, < figure >, ...
Les extensions de balises HTML existantes.
Les nouveaux attributs : a, fieldset, iframe, area, button...
Les microformats.
Présentation et avantages sur le référencement.
Attributs itemprop='nationality' ...
Les formats multimédia. Codecs et API Multimédia.
Gestion vidéo et audio avec les nouvelles balises < audio > et < video > HTML 5.

Partie 5 : Les formulaires


La balise form
Créer et utiliser des formulaires HTML5
Les contrôles disponibles (slider, etc.)
Gestion des dates, des emails, ..
Les validations de formulaire en HTML5

Partie 6 : Web Forms ou les formulaires évolués


Nouveaux types pour < input > (url, email, number, range, week, date, datetime, ...)
Nouveaux attributs (placeholder, autofocus, min, max, step, required, ...)
Styles CSS applicables pour la validation
Nouveaux éléments < output >, < progress >, < meter >, < datalist >...

Partie 7 : Audio et Video en HTML 5


Les éléments audio et video
Les conteneurs
Contrôler la vidéo, l'audio avec l'API HTML5

Partie 8 : La mise en forme du texte


Support des polices distantes @font-face.
Mise en forme du texte.
Gestion des débordements par text-overflow.
Gestion des enchaînements par wrap-option, white-space-treatment...
Effets de couleur et d'ombre sur texte text-fill-color, text-shadow...
Les modes multi-colonnes avec column-count, column-width...

Partie 9 : La mise en forme des boîtes


Les ombres avec box-shadow.
Les coins arrondis avec border-radius...

Partie 10 : La mise en forme du fond


Les fonds multiples.
Les gradients de fond (-webkit-gradient).
Les fonds ajustés aux conteneurs.

Partie 11 : Les transformations


Les transformations : translations, rotations, homothéties (-webkit-transform).
Les animations : les animations, les transitions (?webkit-transition).

AJAX, JavaScript, web 2


S'inscrire Obtenir un devis

Durée :


05 Jours

Objectifs :


Cette formation vous apportera toute la connaissance pour interfacer le langage avec les éléments graphiques des pages Web et ainsi pouvoir réaliser des menus déroulants, des animations, modifier dynamiquement les styles de présentation ou encore réagir aux actions de l'utilisateur... Il vous apprendra également à lancer des requêtes au serveur (Ajax) et à manipuler des données XML.

Public :


Comprendre le fonctionnement du web 2.0
Développer des interfaces riches en utilisant JavaScript
Rendre un site dynamique : le DOM, les événements et AJAX
Maîtriser JavaScript pour savoir utiliser facilement les librairies comme jQuery

Pré-requis :


La connaissance de l'environnement Windows, la maîtrise du langage HTML et une culture générale de l'Internet sont requises. Les principes de base de la programmation sont nécessaires, la connaissance d'un langage sera un atout.

Programme :


Partie 1 : Module Présentation des technologies du web


HTML, XHTML, HTML5 et CSS
Langage serveur et base de données
JavaScript et AJAX
XML et JSON
Protocole HTTP et navigateurs
Les standards

Partie 2 : Outils de travail


Présentation et installation d'un IDE
Les différents navigateurs
Rappels XML

Partie 3 : Rappels HTML


Partie 4 : Règles XHTML et DOCTYPE


Content-Type et encodage
Les balises importantes

Partie 5 : Rappels CSS


ID, classes et sélecteurs
Propriétés de styles courantes
Positionnement, tailles et marges
Propriétés d'affichage pour effets visuels

Partie 6 : Les bases de JavaScript


Fonctionnement et sécurité
Insérer du JavaScript
Variables, types, opérateurs
Conditions et boucles
Les fonctions
Actions différées et répétées
Savoir déboguer et gérer les variantes

Partie 7 : Les objets de base de JavaScript


Syntaxe objet et JSON
Objets window, document, navigator, screen, location et history

Partie 8 : Agir sur la page : le DOM


Noeuds, sélection et modification
Modification des styles CSS

Partie 9 : Gestion dynamique des événements


Evénements généraux et attente du chargement de la page
Evénements sur les formulaires
Evénements souris et clavier
Réagir, ne plus réagir, déclencher
Contexte et comportement par défaut

Partie 10 : AJAX


Principe et sécurité
L'objet XMLHttpRequest
Méthodes HTTP, en-tête et données
Gestion du retour
Le résultat (texte, XML ou JSON)

Partie 11 : Programmation orientée objet avancée


Principe et avantages
Syntaxe, JSON et contexte
Classes : constructeur et prototype
Compléter ou modifier JavaScript
Héritage
Méthodes statiques et abstraites, interfaces et parent

Partie 12 : Introduction à un framework : jQuery


Avantages et utilisation
Sélection facilitée et plus avancée des éléments et de leurs contenus
Modification des styles CSS
Gestion améliorée des événements
AJAX simplifié
Effets visuels rapides