Le cercle de formations à distance CFAD. PRÉSENTATION </h1> r>> propose le développement de votre site :

Transcription

1 CFAD Le développement de sites Web <h1> PRÉSENTATION </h1> <<ss uuppeer r>>llee cc eer rccl llee ddee ffoor f rmmaat tti iioonnss àà ddi iisst ttaannccee<</ // ss uuppeer r>> propose le développement de votre site : { Publicitaire (à des fins commerciales) D organisation (interne à une structure avec accès sécurisé) Pédagogique (autoformation ou publication de tutoriels) Les langages de programmation employés sont : <<bbr r //>> / Le HTML 5, le Javascript et le Php armé du SQL. Le HTML5 est en fait le langage de description de base qui permet d élaborer les pages, tandis que le Javascript 1 et le PHP 2 sont des langages dynamiques qui offrent la possibilité de rendre les 1 Code exécuté côté client, c est-à-dire par le navigateur Web ; Page 1

2 pages plus interactives, de réaliser des tests, de faire des choix, ou bien, de gérer une base de données via le langage d interrogation SQL 3 Bref, ces outils de développement associés aux streaming 4 multimédia apportent la puissance nécessaire pour rendre un site présentable, performant et extrêmement personnalisé. Et pourtant, en dépit de ces quelques vertus fondamentales, un site doit avant tout être relativement facile d accès en terme de navigation, l enchaînement des pages et le choix des menus devant être astucieux et intuitifs pour un visiteur habitué ou non au site. D ailleurs, un site doit répondre aux normes «accessiweb» W3C afin de rendre heureuses les personnes handicapés! Que faire pour cela? <<bbr r //>> / utiliser un texte alternatif pour les images ; Structurer les pages avec des titres de niveaux ; Afficher un lien «Accès au contenu» afin de permettre aux utilisateurs équipés d une revue d écran d atteindre rapidement le texte de la rubrique cliquée ; Afficher des lecteurs streaming accessibles 2 Code exécuté côté serveur, c est-à-dire depuis le site ; 3 Langage permettant de créer et de faire évoluer une base de données ; 4 Fichiers audio et vidéo joués en ligne directement depuis le site ; Page 2

3 <h1> PROGRAMMATION </h1> Les menus et les sous menus sont écrits dans des fichiers uniques, ainsi, l évolution du site est simple, aucune information commune n est répétée dans le code des pages du site. C est la fonction «require» du PHP qui se charge d insérer les menus dans les différents cadres des pages : Aperçu <div class="left"> <?php // Insertion du menu spécifique à la page d'accueil require ("data/sousmenuaccueil.txt");?> // Insertion du menu global commun à toutes les pages <?php require ("data/menu.txt");?> </div> Pour faciliter vos éventuelles futures interventions dans le code des pages, les commentaires seront grandement appréciés par les puristes! <<bbr r //>> / Aperçu Page 3

4 <?php // Fichier scripts des fonctions externes // Déclaration de l'emploi des variables de session session_start (); function connexion () { // fonction qui permet de se connecter au serveur et à la base de données $connect = mysql_connect("localhost","root","") or die("impossible de se connecter au serveur"); $bdd = mysql_select_db("darkorganize",$connect) or die("impossible de se connecter à la base DarkOrganize"); } Page 4

5 <h1> Aperçu N 1 </h1> Voici la page d accueil d un site pédagogique dédié à l informatique pour les personnes déficientes visuelles. Sur ce site, plus de 800 tutoriels rédigés par P BOULANGER sont publiés gratuitement Page 5

6 <h1> Aperçu N 2 </h1> Dans le cadre de la formation du montage audio, et histoire de se faire une idée du sujet, les intéressés peuvent consulter les archive du site et écouter des montages en streaming Page 6

7 <h1> Aperçu N 3 </h1> Voici un tutoriel publié en ligne. Afin d en facilité la consultation, cette page a été rédigée dans WORD puis enregistrée au format HTML Page 7

8 <h1> Aperçu N 4 </h1> Le module «ApprentiWeb». Il s agit d un module d autoformation en ligne depuis lequel les utilisateurs équipés d une revue d écran peuvent découvrir l univers du Web. Plus de 40 leçons les y attendent! Page 8

9 <h1> Aperçu N 5 </h1> L utilisation d un lien classique «mailto» n est pas la seule solution permettant à un visiteur d écrire au Webmaster 5. D ailleurs, ce procédé est probablement le plus simple à mettre en place, mais require toutefois qu un compte de messagerie ait été au préalable configuré sur l ordinateur. Le formulaire est donc incontournable, en voici un exemple La validation du formulaire peut déclencher l envoi des données par , mais peut également recourir à une base de données 6 5 Le grand patron du site ; 6 Ensemble de fichiers structurés permettant le stockage et l organisation des données ; Page 9

10 <h1> Aperçu N 6 </h1> Page d accueil du site EDV : «Escapade des déficients visuels» Ce site a été spécialement conçu pour que les personnes déficientes visuelles puissent facilement rechercher et mettre la main sur l un des séjours proposés par une association De plus, afin que le Webmaster puisse être indépendant sans pour autant être obligé d apprendre la programmation, les articles de séjours sont gérés dans de simples fichiers texte, c est le site qui fait le reste Page 10

11 <h1> Aperçu N 7 </h1> France-EXPRESS est un site pédagogique dédié aux règles de la grammaire et de la conjugaison de la langue française. Il a été développé dans l unique but de vous énerver et de vous rafraîchir la mémoire Page 11

12 <h1> Aperçu N 8 </h1> StartNet-basic est un site de démonstration permettant aux débutants de découvrir le monde du Web. Ce site est entièrement interactif et animé par le rédacteur et son fidèle compagnon. Page 12

13 <h1> Aperçu N 9 </h1> Ceci est le sommaire de la rubrique «astronomie» du site «Vertige-Univers». Quelques articles du rédacteur et des dizaines de documentaires vous enseigneront le monde merveilleux qui est le nôtre Page 13

14 <h1> Aperçu N 10 </h1> Toujours dans le site «Vertige-Univers», voici un lecteur streaming FLASH 7 permettant de visualiser un documentaire 7 Vidéos au format FLV ; Page 14

15 DarkOrganize est à votre disposition. Il permet en toute sécurité à une structure associative ou professionnelle de partager des informations, contacts, adhérents, planning, suivis de tâches, NewsLetter etc. <</ //bbooddyy>> <</ //hht ttmml ll>> <<!!!! FFi iinn ddeess bbaal lli iiss eess HHTTMMLL --- ->> Page 15