Prototyper un site web avec Awestruct et Boostrap

Save this PDF as:
 WORD  PNG  TXT  JPG

Dimension: px
Commencer à balayer dès la page:

Download "Prototyper un site web avec Awestruct et Boostrap"

Transcription

1 Prototyper un site web avec Awestruct et Boostrap

2 On va parler de... Prototype Awestruct Bootstrap Bonus (GitHub, JSF)

3 Prototyper : pourquoi? Mettre tout le monde d'accord Avoir un support concret Aide pour rédiger les specs Montrer autre chose que des tonnes de papier au client Faire autre chose que rédiger des tonnes de papier pour le client

4 Prototyper : comment? Léger Portable Agile Rapide Dynamique Hot-deploy Responsive Réel Bon marché

5 Prototyper : comment? Application Java EE HTML pur PHP Générateur en ligne Awestruct

6 Prototyper : comment? Application Java EE : un peu lourd HTML pur PHP Générateur en ligne Awestruct

7 Prototyper : comment? Application Java EE HTML pur : copier, coller, copier, coller,... PHP Générateur en ligne Awestruct

8 Prototyper : comment? Application Java EE HTML pur PHP : sérieusement? Générateur en ligne Awestruct No comment

9 Prototyper : comment? Application Java EE HTML pur PHP Générateur en ligne : trop de limitations Awestruct

10 Prototyper : comment? Application Java EE HTML pur PHP Générateur en ligne Awestruct : essayons donc ça!

11 Awestruct Ruby (désolé...) HTML HAML Textile SASS Layout Extensions

12 Awestruct : installer $ sudo apt-get install rubygems $ sudo gem install awestruct That's it!

13 Awestruct : démarrer $ mkdir prototype $ cd prototype $ awestruct --init $ awestruct -d That's it again!

14 Awestruct : qu'avons-nous là? Configuration Extensions Layouts Génération Code

15 Awestruct : fonctionnement Templating Tout est page Import Layout Variables Profils Extensions Attributs Tags N'importe quoi

16 Awestruct : fonctionnement Scan du projet Génération des pages Extensions Génération du site

17 Awestruct : extensions & helpers Indexifier Posts Paginator Atomizer Tagger TagCloud DataDir IntenseDebate Disqus Flattr Textil Partial Google Analytics No limit!

18 Bilan intermédiaire Nous avons : Nous n'avons pas : Site léger Design Portable Responsive Dynamique Réel Hot-deploy En résumé : ça marche, mais c'est moche...

19 Bootstrap Deux fichiers CSS Design de base Design responsive Un fichier JavaScript Deux images Icônes noirs Icônes blancs Et c'est tout!

20 Bootstrap : philosophie Responsive Modulaire Simple Documenté Production ready Les classes CSS sont reines Les attributs data-* sont rois

21 Bootstrap : grille responsive Un conteneur fixe ou fluide Fixe : largeur connue Fluide : largeur 100% Une grille de 12 colonnes

22 Bootstrap : grille responsive Environnement Largeur Colonne fixe Marge fixe Colonne fluide Marge fluide Smartphone <= 480px Fluide Fluide Fluide Fluide De smartphone à tablette 481px 767px Fluide Fluide Fluide Fluide Tablette en mode paysage 768px 989px 42px 20px % % Défaut 980px 1199px 60px 20px % % Ecran large >= 1200px 70px 30px % %

23 Bootstrap : grille responsive

24 Bootstrap : classes CSS a a.btn a.btn.btn-primary a.btn.btn-primary.btn-large a.btn.btn-primary.btn-large.disabled

25 Bootstrap : classes CSS table.table table.table.table-striped table.table.tablestriped.table-bordered table.table.tablebordered

26 Bootstrap : design

27 Bootstrap : design

28 Bootstrap : design

29 Bootstrap : design

30 Bootstrap : icônes

31 Bootstrap : attributs data-* Envie d'effets modernes? Pas le temps de faire du JavaScript? Pas envie de faire du JavaScript? La flemme d'apprendre le JavaScript? Vous ne savez pas ce qu'est le JavaScript? Bootstrap à la rescousse!

32 Bootstrap : modal panel <a class= btn data-toggle= modal href= #modalpanel >Afficher</a> <div id= modalpanel class= modal > <div class= modal-header > <button class="close" data-dismiss="modal"> </button> <h3>modal header</h3> </div> <div class="modal-body"> <p>one fine body...</p> </div> </div>

33 Bootstrap : dropdown <ul class= nav > <li id= dropdown class= dropdown > <a class="dropdown-toggle" data-toggle="dropdown" href="#dropdown">dropdown<b class="caret"></b></a> <ul class="dropdown-menu"> <li><a href="#">action</a></li> <li><a href="#">another action</a></li> <li><a href="#">something else here</a></li> <li class="divider"></li> <li><a href="#">separated link</a></li> </ul> </li> </ul>

34 Boostrap : résumé Classes CSS JavaScript et data-* Grille responsive Modal panel Boutons Dropdown Tables Onglet Listes Tooltip Formulaires Boutons (split, radio,...) Labels Spy bar Badges Collapse Miniatures Carousel Barres de chargement Typehead

35 Bootstrap : aller plus loin Réalisez votre propre thème visuel Générateur en ligne A la main Utilisez SASS ou LESS

36 Bonus JSF (Java Server Faces) Support des attributs data-* : ticket 1090 de la spec RichFaces Sandbox : premiers composants JSF basés sur Bootstrap is evil! GitHub username.github.com gh-pages branch Script.sh to deploy and push

37 Ressources Awestruct Bootstrap Site officiel Site officiel Site Arquillian Gallerie de sites Référence HAML Gallerie de design

38 Questions?

Présentation du Framework BootstrapTwitter

Présentation du Framework BootstrapTwitter COUARD Kévin HELVIG-LARBRET Blandine Présentation du Framework BootstrapTwitter IUT Nice-Sophia LP-SIL IDSE Octobre 2012 Sommaire I. INTRODUCTION... 3 Définition d'un framework... 3 A propos de BootstrapTwitter...

Plus en détail

Bootstrap 3 pour l'intégrateur web CSS et Responsive Web Design

Bootstrap 3 pour l'intégrateur web CSS et Responsive Web Design Chapitre 1 : Introduction A. Le développement des sites Web 14 B. Les fonctionnalités de Bootstrap 14 C. La compatibilité avec les navigateurs 15 D. Télécharger les exemples 15 Chapitre 2 : Installer Bootstrap

Plus en détail

2 LES BASES DU HTML 19 Qu est-ce que le HTML? 20 De quand date le HTML? 20 Écrire son propre code HTML 22

2 LES BASES DU HTML 19 Qu est-ce que le HTML? 20 De quand date le HTML? 20 Écrire son propre code HTML 22 SOMMAIRE INTRODUCTION La collection Classroom in a Book TinyUrL Conditions requises Installation du programme Copie des fichiers Classroom in a Book ordre recommandé pour les leçons Démarrage instantané

Plus en détail

Formation Joomla 3 Réalisez votre Template

Formation Joomla 3 Réalisez votre Template Formation Joomla 3 Réalisez votre Template Flash-comet.com Cours version 2015 1 Sommaire Contenu du cours... 3 Création d'un template avec "Template Créator CK"... 3 Principe de fonctionnement... 3 Ce

Plus en détail

Nouveautés joomla 3 1/14

Nouveautés joomla 3 1/14 Nouveautés joomla 3 1/14 Table des matières 1 Responsive... 1 2 Bootstrap... 1 3 LESS CSS intégré... 1 4. JUI (pour les développeurs d'extensions)... 1 5. Le Mambo days vs le Génial UX... 2 6. 7 étapes

Plus en détail

Documentation Template Creator CK

Documentation Template Creator CK 1 2 Remerciements Je tiens à remercier tous ceux qui m'ont soutenu et encouragé dans ce projet, ceux qui m'ont aidé, qui ont répondu à mes questions et qui m'ont permis au fil du temps de rassembler toutes

Plus en détail

Java EE Applications web

Java EE Applications web Java EE Applications web Applications web Deux types d applications web: Applications orientées présentation Contenu statique: Html,xml, XVG Contenu dynamique: jsp, jsf, servlets Applications orientées

Plus en détail

Pages et sites Web. Table des matières 1. Microsoft Expression Web S'orienter vers l'accessibilité...12

Pages et sites Web. Table des matières 1. Microsoft Expression Web S'orienter vers l'accessibilité...12 Pages et sites Web Table des matières 1 Microsoft Expression Web S'orienter vers l'accessibilité...12 Espace de travail Installer le logiciel...13 Lancer/quitter Microsoft Expression Web 2...13 Découvrir

Plus en détail

Intégrateur Web HTML5 CSS3

Intégrateur Web HTML5 CSS3 Intégrateur Web HTML5 CSS3 L objectif de la 3W Academy est de former des petits groupes d élèves à l intégration de sites internet ainsi qu à la création d applications web simples telles qu un blog ou

Plus en détail

Objectifs. Programmation Tablette. Journée type. Organisation. Dominique Rossin Cours 1 - HTML / CSS

Objectifs. Programmation Tablette. Journée type. Organisation. Dominique Rossin Cours 1 - HTML / CSS Objectifs Programmation Tablette Dominique Rossin Cours 1 - HTML / CSS Comprendre le fonctionnement d une application Web Comprendre le fonctionnement d une application Smartphone Programmer et déployer

Plus en détail

Optimiser pour les appareils mobiles

Optimiser pour les appareils mobiles chapitre 6 Optimiser pour les appareils mobiles 6.1 Créer un site adapté aux terminaux mobiles avec jquery Mobile... 217 6.2 Transformer son site mobile en application native grâce à PhoneGap:Build...

Plus en détail

jquery Mobile La bibliothèque JavaScript pour le Web mobile Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2

jquery Mobile La bibliothèque JavaScript pour le Web mobile Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2 jquery Mobile La bibliothèque JavaScript pour le Web mobile É r i c S a r r i o n Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2 1 Installation de jquery Mobile

Plus en détail

Formation Webmaster : Création de site Web Initiation + Approfondissement

Formation Webmaster : Création de site Web Initiation + Approfondissement Contactez notre équipe commerciale au 09.72.37.73.73 Aix en Provence - Bordeaux - Bruxelles - Geneve - Lille - Luxembourg - Lyon - Montpellier - Nantes - Nice - Paris - Rennes - Strasbourg - Toulouse Formation

Plus en détail

WordPress, thèmes et plugins : mode d'emploi

WordPress, thèmes et plugins : mode d'emploi WordPress, thèmes et plugins : mode d'emploi Sommaire 01 Faisons connaissance 1.1 Qui suis-je? 1.2 WordPress en 2 mots 1.3 Thème et plugin 02 Si je veux 03 Quelques extensions utiles 04 Comment chercher

Plus en détail

FORMATION WEBMASTER AVANCEE :

FORMATION WEBMASTER AVANCEE : FORMATION WEBMASTER AVANCEE : OBJECTIF : 300 HEU RE S - 4 MOIS Apprendre à créer des sites internet par diverses méthodes en apprenant les bases des différents langages que constituent la création de site

Plus en détail

LOT03P6 - Domino 8.5 : XPages dans Domino Designer 8.5 - Partie 6

LOT03P6 - Domino 8.5 : XPages dans Domino Designer 8.5 - Partie 6 LOT03P6 - Domino 8.5 : XPages dans Domino Designer 8.5 - Partie 6 Objectifs du développement en 8.5 Fournir un outil de développement moderne Faire pour les développeurs ce que Notes 8 a fait pour l'utilisateur

Plus en détail

GOOGLE ANALYTICS. Ajout du code de suivi sur PowerBoutique. Ajout du code de suivi Google Analytics. Page 1 / 7 TUTO / GOOGLE ANALYTICS

GOOGLE ANALYTICS. Ajout du code de suivi sur PowerBoutique. Ajout du code de suivi Google Analytics. Page 1 / 7 TUTO / GOOGLE ANALYTICS Ajout du code de suivi Google Analytics Page 1 / 7 I. Création du compte sur Google Analytics 1. Connectez-vous à www.google.fr 2. Entrez «Google Analytics» dans la barre de recherche. 3. Cliquez sur le

Plus en détail

MyECP Development. let s get to it!

MyECP Development. let s get to it! MyECP Development let s get to it! Plan 1.Git et Gitlab 2.Installation du projet 3.Fonctionnement (workflow) 4.Techno & architecture du code Git et Gitlab In Git we trust Git : le travail à plusieurs Git

Plus en détail

Lizmap: Webmapping, sans développement! Valorisation de données spatiales

Lizmap: Webmapping, sans développement! Valorisation de données spatiales Lizmap: Webmapping, sans développement! Valorisation de données spatiales Philippe Clastre, INRA, Avignon Nailloux, 26-28/ Mai / 2014 SOMMAIRE Lizmap: Principes Mise en forme des données (Qgis) Le plugin

Plus en détail

NOTICE INTERFACE WIFI

NOTICE INTERFACE WIFI NOTICE INTERFACE WIFI Notre interface d administration WIFI vous permet de : Personnaliser votre portail WIFI Gérer & paramétrer votre installation WIFI Tél : 02 40 71 71 21 Email : contact@va-solutions.fr

Plus en détail

Guide Reseller Onbile

Guide Reseller Onbile Guide Reseller Onbile Cher Revendeur, Avez-vous un doute en ce qui concerne le fonctionnement du Panneau d Administration du Plan Reseller de Onbile? Le guide Reseller Onbile est ce dont vous avez besoin!

Plus en détail

Google Tag Manager Optimisez le tracking de votre site web

Google Tag Manager Optimisez le tracking de votre site web Avant-propos A. Remerciements 11 B. À propos de l auteur 12 C. À propos de ce livre 13 Chapitre 1 : Les systèmes de gestion de balises A. Introduction 17 B. Les systèmes de gestion de balises 17 1. Introduction

Plus en détail

TSI-V5 Manuel d installation

TSI-V5 Manuel d installation TSI-V5 Manuel d installation 1 Sommaire Introduction... 3 Pré-requis... 3 Installation SQL SERVER 2008... 3 Introduction... 3 Installation... 3 Prise en main... 7 Application TSI... 9 Premier démarrage

Plus en détail

Bootstrap 3 INTRODUCTION. À l origine, projet interne lancé au sein de l entreprise Twitter

Bootstrap 3 INTRODUCTION. À l origine, projet interne lancé au sein de l entreprise Twitter INTRODUCTION À l origine, projet interne lancé au sein de l entreprise Twitter Août 2011 Bootstrap V1, Janvier 2012 Bootstrap V2, Août 2013 Bootstrap V3 Bootstrap est un frameworks HTML/CSS Bibliothèque

Plus en détail

jquery Mobile La bibliothèque JavaScript pour le Web mobile Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2

jquery Mobile La bibliothèque JavaScript pour le Web mobile Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2 jquery Mobile La bibliothèque JavaScript pour le Web mobile É r i c S a r r i o n Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2 Table des matières PREMIÈRE PARTIE

Plus en détail

Vittoria Quick Cart v1.0.0 Manuel d installation et d utilisation de l extension Vittoria Quick Cart v1.0

Vittoria Quick Cart v1.0.0 Manuel d installation et d utilisation de l extension Vittoria Quick Cart v1.0 Manuel d installation et d utilisation de l extension Vittoria Quick Cart v1.0 1 Sommaire 1. A propos de ce manuel... 2 2. Mise à jour du manuel... 2 3. Installation de l extension via la clé d installation

Plus en détail

Logiciel : GLPI Version : 0.72.4 SYNCRHONISATION DE GLPI AVEC ACTIVE DIRECTORY. Auteur : Claude SANTERO Config. : Windows 2003.

Logiciel : GLPI Version : 0.72.4 SYNCRHONISATION DE GLPI AVEC ACTIVE DIRECTORY. Auteur : Claude SANTERO Config. : Windows 2003. Ce document est libre de droit, merci simplement de respecter son auteur. Toutes remarques ou commentaires seront les bienvenues. ATTENTION : La mise à jour par script entre GLPI et Active Directory ne

Plus en détail

ADAPTATION DES INTERFACES. ROUYER Florian et BENNOUR Salah

ADAPTATION DES INTERFACES. ROUYER Florian et BENNOUR Salah ADAPTATION DES INTERFACES ROUYER Florian et BENNOUR Salah SOMMAIRE Sujet Android Ionic Comparaison Conclusion Sujet Plateforme de partage de livres Fonctionnalités : Géolocalisation Visualisation Map Visualisation

Plus en détail

Questions à choix multiples Page 1 de 10

Questions à choix multiples Page 1 de 10 INF2005 Programmation web Examen intra hiver 2015 Question #1 Qui a gagné la guerre des fureteurs dans les années 1990? a) Netscape b) Internet Explorer c) Firefox d) Chrome e) Opera f) Mosaic g) Aucune

Plus en détail

HTML5 et CSS3 pour des sites Responsive Web Design

HTML5 et CSS3 pour des sites Responsive Web Design Chapitre 1 : Introduction A. Le design Web aujourd'hui 11 B. Le Responsive Web Design 11 C. Les approches dans la conception 12 D. Le lâcher-prise 12 E. Les objectifs du livre 13 F. Les outils de l intégrateur

Plus en détail

Accès à distance. Guide du client AnyConnect pour utilisateurs de MAC. Rédigé le 5 février 2013 par Andrée Proulx

Accès à distance. Guide du client AnyConnect pour utilisateurs de MAC. Rédigé le 5 février 2013 par Andrée Proulx Accès à distance Guide du client AnyConnect pour utilisateurs de MAC Rédigé le 5 février 2013 par Andrée Proulx Direction des services administratifs 1 CONTENU Présentation du service WebVPN... 3 Accès

Plus en détail

Atelier Construction Plug-in avec la plateforme Eclipse JUG Poitou-Charentes BARON Mickaël 18 septembre 2009. Leçon n 2 : Perspectives

Atelier Construction Plug-in avec la plateforme Eclipse JUG Poitou-Charentes BARON Mickaël 18 septembre 2009. Leçon n 2 : Perspectives Atelier Construction Plug-in avec la plateforme Eclipse JUG Poitou-Charentes BARON Mickaël 18 septembre 2009 Leçon n 2 : Perspectives Temps estimé : 20 minutes Le but de cette deuxième leçon est d apprendre

Plus en détail

Initiation à la Prog. Sous Android (Session 1) med.hossam@gmail.com

Initiation à la Prog. Sous Android (Session 1) med.hossam@gmail.com Initiation à la Prog. Sous Android (Session 1) med.hossam@gmail.com Plan Statistiques Différences entre Mobile App, Mobile Site et Web App Développement pour terminaux mobiles Outils de développement pour

Plus en détail

P13 [PROJET SI28 : ECRITURE INTERACTIVE ET MULTIMEDIA] Jourdaine Marc Lefèvre Mathilde Rossier Titouan Salles Martin. Responsable : Serge Bouchardon

P13 [PROJET SI28 : ECRITURE INTERACTIVE ET MULTIMEDIA] Jourdaine Marc Lefèvre Mathilde Rossier Titouan Salles Martin. Responsable : Serge Bouchardon P13 Jourdaine Marc Lefèvre Mathilde Rossier Titouan Salles Martin Responsable : Serge Bouchardon [PROJET SI28 : ECRITURE INTERACTIVE ET MULTIMEDIA] Sommaire Concept... 3 Objectifs... 3 Public-cible...

Plus en détail

Programme HTML5 / CSS3 Professionnel

Programme HTML5 / CSS3 Professionnel Programme HTML5 / CSS3 Professionnel Déclaration d'activité enregistrée sous le n 52 44 06789 44 auprès du Préfet de région des Pays de la Loire. Format du cours :Plate-forme d apprentissage numérique

Plus en détail

NFA016 : Introduction. Pour naviguer sur le Web, il faut : Naviguer: dialoguer avec un serveur web

NFA016 : Introduction. Pour naviguer sur le Web, il faut : Naviguer: dialoguer avec un serveur web NFA016 : Introduction O. Pons, S. Rosmorduc Conservatoire National des Arts & Métiers Pour naviguer sur le Web, il faut : 1. Une connexion au réseau Réseau Connexion physique (câbles,sans fils, ) à des

Plus en détail

Responsive Web Design (RWD)

Responsive Web Design (RWD) Responsive Web Design (RWD) CSS 3 et présentation avancée 1 Qu est ce que le responsive? Démo : Chrome + guardian.com 2 Qu est ce que le responsive? 3 Pourquoi? Explosion de la variété des supports source

Plus en détail

WordPress Référencement naturel (SEO) Optimiser. son référencement. Daniel Roch. Préface d Olivier Andrieu

WordPress Référencement naturel (SEO) Optimiser. son référencement. Daniel Roch. Préface d Olivier Andrieu Daniel Roch Optimiser son référencement WordPress Référencement naturel (SEO) Préface d Olivier Andrieu Groupe Eyrolles, 2013, ISBN : 978-2-212-13714-9 Table des matières AVANT-PROPOS... 1 Pourquoi ce

Plus en détail

Gestion Bibliothèque. Résumé

Gestion Bibliothèque. Résumé Gestion Bibliothèque Résumé Ces travaux seront réalisés dans le cadre du cours Web Services Miage NTDP afin de permettre aux étudiants d assimiler les concepts théoriques vus en cours. L idée est de développer

Plus en détail

Picasa Utilisation : 1 ère partie

Picasa Utilisation : 1 ère partie Picasa Utilisation : 1 ère partie Pour ouvrir Picasa, faîtes un double clic sur l icône présente sur le bureau. Vous pouvez également cliquer sur le menu Démarrer, Tous les programmes, Picasa 3. Lorsque

Plus en détail

Créer son site web. Avec la distribution e-change http://www.plateforme-echange.org/ Benoît Mamet Cédric Morin

Créer son site web. Avec la distribution e-change http://www.plateforme-echange.org/ Benoît Mamet Cédric Morin Créer son site web Avec la distribution e-change http://www.plateforme-echange.org/ Benoît Mamet Cédric Morin 1 Personnaliser l'apparence du site Avec la distribution e-change 2 La version rapide 3 Choisir

Plus en détail

Développement Partie Cliente

Développement Partie Cliente ISI 1022 : Jean-Noël Sorenti. Année 2002/2003 Développement Partie Cliente ISI 1022 : 1 ISI 1022 : Développement Partie Cliente Le développement partie cliente concerne tout développement étant interprété

Plus en détail

PRETASHOP. Etre à l'aise avec l'utilisation d'un ordinateur et d'internet. Maitriser les bases de Microsoft Word.

PRETASHOP. Etre à l'aise avec l'utilisation d'un ordinateur et d'internet. Maitriser les bases de Microsoft Word. PRETASHOP LES OBJECTIFS : Vous verrez comment installer Joomla! localement puis sur un serveur distant, concevoir l organisation de votre site, rédiger vos premiers articles, maitriser les feuilles de

Plus en détail

Windows XP. Microsoft. Sommaire :

Windows XP. Microsoft. Sommaire : Microsoft Windows XP Sommaire : OUVERTURE DE SESSION...2 LE BUREAU...3 CHANGER D ENVIRRONEMENT...4 NOUVEAU RACCOURCI...7 LE MENU DEMARRER...9 LES PROGRAMMES AU DEMARRAGE...11 LA GESTION DES FICHIERS...12

Plus en détail

Utilisation de l éditeur.

Utilisation de l éditeur. Utilisation de l éditeur. Préambule...2 Configuration du navigateur...3 Débloquez les pop-up...5 Mise en évidence du texte...6 Mise en évidence du texte...6 Mise en page du texte...7 Utilisation de tableaux....7

Plus en détail

Plateforme Systempay v1.24 Personnalisation avancée de la page paiement. Version 1.2a

Plateforme Systempay v1.24 Personnalisation avancée de la page paiement. Version 1.2a Plateforme Systempay v1.24 Personnalisation avancée de la page paiement Version 1.2a Rédaction, Vérification, Approbation Rédaction Vérification Approbation Nom Date/Visa Nom Date/Visa Nom Date/Visa Lyra-Network

Plus en détail

Ajouter les miniatures dans le re sultat de recherche pour SharePoint Foundation 2013

Ajouter les miniatures dans le re sultat de recherche pour SharePoint Foundation 2013 Ajouter les miniatures dans le re sultat de recherche pour SharePoint Foundation 2013 Après avoir installé SharePoint Foundation 2013, puis configuré le moteur de recherche, voyons comment personnaliser

Plus en détail

Tutoriel Ionic framework

Tutoriel Ionic framework INGÉNIEURS EN SCIENCES INFORMATIQUES ADAPTATION DES INTERFACES A L ENVIRONNEMENT Tutoriel Ionic framework Tutoriel et présentation du framework IONIC : technologie permettant la réalisation d applications

Plus en détail

Guide Template kibana-hakabana. Joshua Monier joshua.monier@e-josh.fr

Guide Template kibana-hakabana. Joshua Monier joshua.monier@e-josh.fr Guide Template kibana-hakabana. joshua.monier@e-josh.fr 1 sur 14 Sommaire : I. Introduction : 3 II. Ce que nous voulons : 4 III. Comment y parvenir? 5 1. Le changement de couleur de fond : 5 2. Changer

Plus en détail

INSTALLATION DE LA PAIE

INSTALLATION DE LA PAIE INSTALLATION DE LA PAIE (Réseau) PREREQUIS POUR LES SYSTEMES WINDOWS VISTA HOME OU VISTA PRO Cliquez sur Démarrer Cliquez sur Panneau de configuration Cliquez sur Comptes Utilisateurs Cliquez sur Activer

Plus en détail

MODE D EMPLOI WORDPRESS

MODE D EMPLOI WORDPRESS MODE D EMPLOI WORDPRESS Comment gérer votre site internet 1 Pour ce mode d emploi, nous allons prendre l exemple de la gestion du site jcebretagne.org Tout d abord, une suite d'article qui peuvent être

Plus en détail

Une interface moderne et multi devices avec Drupal Focus sur Omega

Une interface moderne et multi devices avec Drupal Focus sur Omega Une interface moderne et multi devices avec Drupal Focus sur Omega Romain Jarraud Formateur / consultant Drupal Anne- Sophie Picot Chef de projets Publier du contenu aujourd hui > Plateformes de consultation

Plus en détail

CCP3: Contribuer à la réalisation de supports de communication numériques

CCP3: Contribuer à la réalisation de supports de communication numériques Nous CCP3: Contribuer à la réalisation de supports de communication numériques Le titre professionnel est composé de trois certificats de compétences professionnelles (CCP) Celui-ci prépare à la certification

Plus en détail

Présentation du CD-Rom

Présentation du CD-Rom Présentation du CD-Rom Contenu Le CD-Rom contient le matériel nécessaire à la mise en œuvre des séances. Typologie d activités Ce document permet de trouver rapidement une activité en fonction de critères

Plus en détail

Programmation Android Ce que vous devez savoir. Cours Android - F. Michel 1 / 18

Programmation Android Ce que vous devez savoir. Cours Android - F. Michel 1 / 18 Programmation Android Ce que vous devez savoir 1 / 18 Plan 1 Connaissances essentielles 2 Définition d une GUI et adaptation au contexte 3 L objet Intent 2 / 18 Connaissances essentielles Sur la plate-forme

Plus en détail

Créer une trace, obtenir son fichier gpx et sa carte Ou Afficher un fichier trace GPX

Créer une trace, obtenir son fichier gpx et sa carte Ou Afficher un fichier trace GPX Créer une trace, obtenir son fichier gpx et sa carte Ou Afficher un fichier trace GPX Logiciels nécessaires : - - - Google Chrome comme navigateur internet FireShot qui est un add-on qui se greffe sur

Plus en détail

Le langage PHP permet donc de construire des sites web dynamiques, contrairement au langage HTML, qui donnera toujours la même page web.

Le langage PHP permet donc de construire des sites web dynamiques, contrairement au langage HTML, qui donnera toujours la même page web. Document 1 : client et serveur Les ordinateurs sur lesquels sont stockés les sites web sont appelés des serveurs. Ce sont des machines qui sont dédiées à cet effet : elles sont souvent sans écran et sans

Plus en détail

Programme de Formation

Programme de Formation Windows / PC - initiation Etre à l aise avec Windows, savoir se situer, organiser son environnement et classer ses documents Tout utilisateur désireux d être rapidement autonome dans l utilisation de l

Plus en détail

Galerie de photo Sommaire du Manuel

Galerie de photo Sommaire du Manuel Galerie de photo Sommaire du Manuel 1 INTRODUCTION... 2 2 OU SE TROUVE LE MODULE GALERIE DE PHOTOS... 2 3 CREER UN NOUVEL ALBUM DE PHOTOS EN REALISANT UNE RUBRIQUE... 2 4 COMMENT VISUALISER LA GALERIE

Plus en détail

Souris de voyage sans fil à 5 boutons Manuel de l utilisateur

Souris de voyage sans fil à 5 boutons Manuel de l utilisateur Souris de voyage sans fil à 5 boutons Manuel de l utilisateur Caractéristiques 1. Transmission sans fil à radiofréquence de 27 MHz 2. Utilisation de 256 codes d identification pour éviter l interférence

Plus en détail

Interakting groupe Business & Decision

Interakting groupe Business & Decision Magento Référence Date de création 2 octobre 2009 Date de diffusion Magento_2009-12-16_MANUEL D'INSTALLATION ET INTERAKTING SLIDER_v3.2.doc Version 3.2 Magento ----- Manuel d'installation et d'utilisation

Plus en détail

Aide à l utilisation du logiciel IziSpot.Mobi

Aide à l utilisation du logiciel IziSpot.Mobi 1 Sommaire 1. Description logiciel (explication des menus)... 3 1.1. Description de la barre de menu... 3 2. Onglet configuration... 4 2.1. Gestion du logo... 4 2.1.1. Affichage du zoom... 4 2.1.2. Disposition

Plus en détail

Procédure d installation détaillée

Procédure d installation détaillée Procédure d installation détaillée G e s r i s k v e r s i o n 4. 1. 1 c e r t i f i é e R T S S e n d a t e d u 01- j u i n - 2 0 1 1 TÉLÉCHARGEMENT DU PACKAGE D INSTALLATION Pour télécharger les fichiers

Plus en détail

Raport de projet Webui Oardocker

Raport de projet Webui Oardocker Raport de projet Webui Oardocker EUDES Robin, ROSSI Ombeline 7 avril 2015 Table des matières 1 Introduction 2 2 Cahier des charges 2 3 Technologies et outils utilisés 3 3.1 OAR-Docker...........................................

Plus en détail

Présentation de Muse

Présentation de Muse Présentation de Muse J. ROMAGNY 1. CONSEILS... 4 2. INTERFACE... 5 A. CREATION DE SITE... 5 960 Grid System avec Muse... 6 B. PLAN DU SITE... 7 C. CONCEPTION (EDITION DES «MASTER PAGES» ET PAGES)... 8

Plus en détail

Site agrogembloux.be - document public COMMISSION PHOTO. Version 2015.02.23

Site agrogembloux.be - document public COMMISSION PHOTO. Version 2015.02.23 Site agrogembloux.be - document public COMMISSION PHOTO Programme pour adapter les photos au site internet et Mode d emploi pour uploader les photos sur le site Version 2015.02.23 (dernière version toujours

Plus en détail

TP N 4. Par défaut, la page d accueil affiche les 10 derniers articles publiés.

TP N 4. Par défaut, la page d accueil affiche les 10 derniers articles publiés. TP N 4 Page d accueil Wordpress Ojectif Gérer du texte avec des images Accueil par défaut Par défaut, la page d accueil affiche les 10 derniers articles publiés. Nous souhaitons une page d accueil avec

Plus en détail

jquery Mobile (HTML5, CSS3, JavaScript) Développez vos applications Web mobiles

jquery Mobile (HTML5, CSS3, JavaScript) Développez vos applications Web mobiles Caractéristiques du Web mobile 1. Définition du Web mobile 13 2. Un marché en expansion 15 2.1 Multiples fabricants de smartphones et tablettes 15 2.2 Multiples OS 15 2.3 Multiples navigateurs 17 2.4 Évolutions

Plus en détail

Vittoria Detect Language Manuel d installation et d utilisation de l extension Vittoria Detect Language

Vittoria Detect Language Manuel d installation et d utilisation de l extension Vittoria Detect Language Manuel d installation et d utilisation de l extension Vittoria Detect Language 1 Sommaire 1. Installation de l extension via la clé d installation dans Magento Connect... 3 2. Installation de l extension

Plus en détail

Guide d utilisation de la clé mémoire USB

Guide d utilisation de la clé mémoire USB Service des bibliothèques Guide d utilisation de la clé mémoire USB I- Préambule Politique de prêt : Le Service des bibliothèques vous permet de faire l emprunt d une clé mémoire pour une période de 48

Plus en détail

Créer son questionnaire en ligne avec Google Documents

Créer son questionnaire en ligne avec Google Documents Créer son questionnaire en ligne avec Google Documents (actualisation et précision de l article paru sur http://www.marketing- etudiant.fr/actualites/collecte-donnees.php) Se connecter avec son compte

Plus en détail

DOCUMENTATION MISE A JOUR ANTIBIOGARDE. V4.0 en v4.1

DOCUMENTATION MISE A JOUR ANTIBIOGARDE. V4.0 en v4.1 DOCUMENTATION MISE A JOUR ANTIBIOGARDE V4.0 en v4.1 Version d Antibiogarde 4.1 Version du document 1.0 Date dernière mise à jour du document 15/06/2010 Retrouvez cette doc à jour sur : http://www.antibiogarde.org/activation/

Plus en détail

Dreamweaver CC pour PC/Mac Pour des sites full CSS conformes aux standards du W3C

Dreamweaver CC pour PC/Mac Pour des sites full CSS conformes aux standards du W3C Introduction L'Internet aujourd'hui 7 Le World Wide Web Consortium et les standards 7 Les logiciels de conception de sites web 7 L'objectif du livre 8 Le Creative Cloud d Adobe 9 Interface de conception

Plus en détail

Création d un site web avec Nvu. Pensez à sauvegarder fréquemment dans votre espace de travail les documents que vous réalisez!

Création d un site web avec Nvu. Pensez à sauvegarder fréquemment dans votre espace de travail les documents que vous réalisez! Création d un site web avec Nvu Pensez à sauvegarder fréquemment dans votre espace de travail les documents que vous réalisez! Le but de ce TP est d utiliser le logiciel Nvu pour réaliser un site simple

Plus en détail

HTML. Notions générales

HTML. Notions générales 1 HTML Le langage HTML est le langage de base permettant de construire des pages web, que celles-ci soient destinées à être affichées sur un iphone/android ou non. Dans notre cas, HTML sera associé à CSS

Plus en détail

Université Bordeaux, UF Mathématiques et Interactions Licence 2 MIASHS (2014/2015)

Université Bordeaux, UF Mathématiques et Interactions Licence 2 MIASHS (2014/2015) Université Bordeaux, UF Mathématiques et Interactions Licence 2 MIASHS (2014/2015) Conception de Sites Web Dynamiques : TD 2 HTML5 statique, feuille de style CSS, Mise en page, Framework Bootstrap http://www.labri.fr/perso/preuter/cswd2015

Plus en détail

GUIDE CONFIGURATION. KBox sous Windows

GUIDE CONFIGURATION. KBox sous Windows GUIDE CONFIGURATION KBox sous Windows TABLE DES MATIERES 2. INTRODUCTION... 2 3. INSTALLATION... 3 TELECHARGEMENT DE L EXECUTABLE... 3 INSTALLATION DE KBOX... 3 4. CONFIGURATION DE LA KBOX... 7 EDITION

Plus en détail

KWISATZ_TUTO_pocket_pc février 2013 KWISATZ POCKET

KWISATZ_TUTO_pocket_pc février 2013 KWISATZ POCKET Table des matières -1) KWISATZ :...2-1.1) Introduction :...2-1.2) Installation :...3-1.2.1) KWISATZ :...3-1.2.2) Installation de REMOTE DISPLAY :...7-1.3) Configuration :...9-1.3.1) Configuration de l

Plus en détail

Utiliser SQL Server 2008 R2 Reporting Services comme source de donne es pour Microsoft Excel

Utiliser SQL Server 2008 R2 Reporting Services comme source de donne es pour Microsoft Excel Utiliser SQL Server 2008 R2 Reporting Services comme source de donne es pour Microsoft Excel Excel est un des meilleurs outils de manipulation de données et parfois il est nécessaire d exploiter des données

Plus en détail

Cours en ligne Développement sur mobile avec Android

Cours en ligne Développement sur mobile avec Android Cours en ligne Développement sur mobile avec Android We TrainFrance info@wetrainfrance Programme général du Cours Développement sur mobile avec Android Module 1 - Programmation J2ee A) Bases de programmation

Plus en détail

CRÉATION D UN SITE INTERNET. Document de travail =================================== SOMMAIRE

CRÉATION D UN SITE INTERNET. Document de travail =================================== SOMMAIRE CONCEPTION RÉALISATION HÉBERGEMENT CRÉATION D UN SITE INTERNET Document de travail Aide à l établissement du cahier des charges. Ce document aborde les thèmes principaux de la mise en place d un site Internet

Plus en détail

NFA 074. 06 - Projet HTML-CSS

NFA 074. 06 - Projet HTML-CSS NFA 074 06 - Projet HTML-CSS 06 - Projet HTML-CSS Le plus grand soin a été apporté à la réalisation de ce support pédagogique afin de vous fournir une information complète et fiable. Cependant, le Cnam

Plus en détail

Dreamweaver - Créer son site internet avec Dreamweaver

Dreamweaver - Créer son site internet avec Dreamweaver 2 Jours Dreamweaver - Créer son site internet avec Dreamweaver dans CREATION WEB - SITE INTERNET Objectifs de la formation Création de site web avec Dreamweaver Concevoir un site Web en HTML avec les fonctions

Plus en détail

Facebook PS Shop Tab. Pré-requis Serveur. Pré-requis Facebook

Facebook PS Shop Tab. Pré-requis Serveur. Pré-requis Facebook Facebook PS Shop Tab Version : 2.2.7 Date de dernière mise à jour : 29/12/2011 Développement : Business Tech modules@businesstech.fr Démo : http://www.facebook.com/arthusandco Pré-requis Serveur La nouvelle

Plus en détail

SENSIO LABS. Formation Maîtrise de Symfony et Doctrine Niveau 1. Sensio. 92-98 boulevard Victor Hugo. 92115 Clichy

SENSIO LABS. Formation Maîtrise de Symfony et Doctrine Niveau 1. Sensio. 92-98 boulevard Victor Hugo. 92115 Clichy SENSIO LABS Formation Maîtrise de Symfony et Doctrine Niveau 1 Sensio 92-98 boulevard Victor Hugo 92115 Clichy 1 SOMMAIRE Introduction... 3 Le framework symfony... 3 Objectifs de la formation... 3 Public

Plus en détail

Tout pour monter son site Web. IUFM de Bourgogne

Tout pour monter son site Web. IUFM de Bourgogne Tout pour monter son site Web IUFM de Bourgogne Pourquoi utiliser les technologies Web? Visible par toutes les plates-formes (PC, Mac, Unix ) Technologies simples et descriptives Contenu principalement

Plus en détail

INSTALLATION CD PERMANENT Version Nomade

INSTALLATION CD PERMANENT Version Nomade INSTALLATION CD PERMANENT Version Nomade SOMMAIRE 1 Introduction...2 1.1 Vue d ensemble...2 1.2 Configuration recommandée...2 2 Guide d installation...3 2.1 Sélection du répertoire d installation de l

Plus en détail

Depuis votre ordinateur de bureau

Depuis votre ordinateur de bureau Le standard RSS représente un moyen simple d'être tenu informé des nouveaux contenus d'un site web, sans avoir à le consulter directement. Nous allons voir ci dessous comment récupérer le flux RSS des

Plus en détail

KompoZer. Composition du site : _ une page d'accueil : index.html. _ une page pour la théorie : theorie.html. _ une page pour les photos : photos.

KompoZer. Composition du site : _ une page d'accueil : index.html. _ une page pour la théorie : theorie.html. _ une page pour les photos : photos. KompoZer Créer un site «simple» Composition du site : _ une page d'accueil : index.html _ une page pour la théorie : theorie.html _ une page pour les photos : photos.html _ une page avec la galerie : galerie.html

Plus en détail

Remerciements. Je tiens à remercier tous ceux qui m'ont aidé et soutenu dans ce projet. Merci à tous! Cédric KEIFLIN

Remerciements. Je tiens à remercier tous ceux qui m'ont aidé et soutenu dans ce projet. Merci à tous! Cédric KEIFLIN KEIFLIN Cédric 1 Janvier KEIFLIN Cédric 2 Janvier Remerciements Je tiens à remercier tous ceux qui m'ont aidé et soutenu dans ce projet. Merci à tous! Cédric KEIFLIN KEIFLIN Cédric 3 Janvier Mes sites

Plus en détail

Guide de l utilisateur Faronics System Profiler Standard

Guide de l utilisateur Faronics System Profiler Standard 1 2 Derniere modification : Mai 2009 1999-2009 Faronics Corporation. Tous droits reserves. Faronics, Deep Freeze, Faronics Core Console, Faronics Anti-Executable, Faronics Device Filter, Faronics Power

Plus en détail

Vous pouvez, avec vos tablettes, prendre des photos (possibilité selon vos tablettes d avoir deux prises de vues : avant/arrière).

Vous pouvez, avec vos tablettes, prendre des photos (possibilité selon vos tablettes d avoir deux prises de vues : avant/arrière). Vous pouvez, avec vos tablettes, prendre des photos (possibilité selon vos tablettes d avoir deux prises de vues : avant/arrière). PRENDRE DES PHOTOS : Appuyer sur l icône Paramètres Applications de votre

Plus en détail

Etape 1 : Récupération de la clé d installation

Etape 1 : Récupération de la clé d installation DESINSTALLATION REINSTALLATION DU LOGICIEL SOLID Avant de procéder à la désinstallation et réinstallation du logiciel, s assurer que vous avez Solid avec la dernière mise à jour. Exemple : Si la version

Plus en détail

Procédure : Apache et DNS

Procédure : Apache et DNS Procédure : Apache et DNS Dans ce tutoriel, je vais vous expliquer comment créer et gérer plusieurs site web avec un serveur Apache et un serveur DNS. Dans ce tuto je vais travailler avec une VM Debian

Plus en détail

Installation et configuration du serveur syslog sur Synology DSM 4.0

Installation et configuration du serveur syslog sur Synology DSM 4.0 Installation et configuration du serveur syslog sur Synology DSM 4.0 Préambule Avoir un NAS équipé avec la version 4.0 ou ultérieure du DSM de Synology. Installation Pour installer le paquet Syslog Server,

Plus en détail

Intégrer une application Visio avec partage d écran

Intégrer une application Visio avec partage d écran Facile 0 mn Vous avez trouvé sur Internet une application que vous souhaitez intégrer dans NetEcole. Nous allons voir étape par étape avec un exemple concret (Gotomeeting) comment faire. Cela sera peut

Plus en détail

Webmaster / Webdesigner / Wordpress

Webmaster / Webdesigner / Wordpress Webmaster / Webdesigner / Wordpress Pré-requis : Projet professionnel. Bonne maîtrise de l'ordinateur. Bases en infographie et / ou traitement de texte fortement recommandées. Objectifs : Concevoir un

Plus en détail

Création du site dans Dreamweaver :

Création du site dans Dreamweaver : CHARGER, CREER et ENREGISTRER 1. Se connecter au RESEAU du COLLEGE avec tes 2 mots de passe 2. Charge le logiciel Au lancement du logiciel, l écran suivant s affiche : Palette des objets Lanceur Zone de

Plus en détail

TP2 : Initiation à la Programmation avec Android

TP2 : Initiation à la Programmation avec Android TP2 : Initiation à la Programmation avec Android 1 TP2 : Initiation à la Programmation avec Android Programmation Mobile Objectifs du TP Ce TP est une initiation à Android. Nous allons réaliser les premiers

Plus en détail

Dossier de conception. Conception d un site E-learning

Dossier de conception. Conception d un site E-learning Conception d un site E-learning Encadré par : Mr. LACHGAR Mohamed Réalisé par : LECHQER Younesse ELEOUAD Abdelhadi SOMMAIRE I. PERIMETRE DU PROJET... 2 1.1. ENJEUX ET VISION DU PROJET... 3 1.2. ARCHITECTURE

Plus en détail