glossaire web pour les profanes - webdesign

78
le glossaire web pour les profanes CREA3 - Septembre 2011 a RITA teaching Relax In The Air

Upload: relax-in-the-air

Post on 24-Apr-2015

1.594 views

Category:

Design


0 download

DESCRIPTION

Cours de webdesign destiné aux étudiants de communication de l’école CREA Genève. Le but est qu’ils appréhendent le métier de webdesigner dans sa globalité et soient capables d’avoir un dialogue cohérent avec les acteurs du web. Cela leur permettra aussi de comprendre les codes et le langage du webdesign.

TRANSCRIPT

Page 1: Glossaire web pour les profanes - Webdesign

le glossaireweb pour lesprofanesCREA3 - Septembre 2011

a RITA teaching

Relax In The Air

Page 2: Glossaire web pour les profanes - Webdesign

www.relaxintheair.com @mccasalwww.behance.com/mccasalwww.linkedin.com/in/mccasal

MC CasalDigital art director at relax in the air

Page 3: Glossaire web pour les profanes - Webdesign
Page 4: Glossaire web pour les profanes - Webdesign

GLOSSAIRE

Page 5: Glossaire web pour les profanes - Webdesign

accessibilité

Degré auquel un site peut être utilisé par tous les utilisateurs, en incluant ceux ayant un handicap.

Page 6: Glossaire web pour les profanes - Webdesign

ADRESSE ip

85.4.242.24Une adresse IP (avec IP pour Internet Protocol) est un numéro d'identification qui est attribué à chaque branchement d'appareil à un réseau informatique utilisant l'Internet Protocol.

Page 7: Glossaire web pour les profanes - Webdesign

adwords

AdWords est le nom du système publicitaire du moteur de recherche Google. Celui-ci affiche des bannières publicitaires, qui sont ciblées en fonction des mots-clés que tape l'internaute.

Page 8: Glossaire web pour les profanes - Webdesign

agile

Les méthodes agiles sont des groupes de pratiques de développement. Elles permettent une grande réactivité aux demandes du client.

Page 9: Glossaire web pour les profanes - Webdesign

AJAX

Combinaison de technologies telles que Javascript, CSS, XML, le DOM et le XMLHttpRequest dans le but de réaliser des applications Web qui offrent maniabilité et confort d'utilisation.

Page 10: Glossaire web pour les profanes - Webdesign

ASP .net

Framework de développement web de Microsoft qui permet aux développeurs de construire des sites dynamiques, des applications web et des web services.

Page 11: Glossaire web pour les profanes - Webdesign

BACK END

Partie cachée d’un site et invisible aux visiteurs. Il inclut entre autres l’information de structure, applications et le CMS qui contrôle le contenu.

Page 12: Glossaire web pour les profanes - Webdesign

BANDE PASSANTE

Taux auquel les data sont transférées ou la quantité de datas autorisées à être transférées depuis un hébergement web.

Page 13: Glossaire web pour les profanes - Webdesign

Bounce rate / taux de rebond

Pourcentage d'internautes qui sont entrés sur une page Web et qui ont quitté le site après. Ils n'ont vu qu'une seule page.

Page 14: Glossaire web pour les profanes - Webdesign

breadcrumb

Le fil d’Ariane ou chemin de fer est une aide à la navigation sous forme de signalisation de la localisation du lecteur dans un document.

Page 15: Glossaire web pour les profanes - Webdesign

browser

Logiciel pour présenter, afficher et consulter le World Wide Web.

Page 16: Glossaire web pour les profanes - Webdesign

cache

Les fichiers cache sont ceux qui sont sauvés et stockés par un browser (navigateur) pour rendre la prochaine visite plus rapide.

Page 17: Glossaire web pour les profanes - Webdesign

cloud

Ressources numériques stockées sur des serveurs distants et permettant un accès depuis n’importe quel point de connection au web.

Page 18: Glossaire web pour les profanes - Webdesign

http://www.apple.com/icloud/

cool link

Page 19: Glossaire web pour les profanes - Webdesign

Wordpress Drupal Joomla Magento Umbraco Typo3

cms

Famille de logiciels destinés à la conception et à la mise à jour dynamique de sites Web ou d'applications multimédia.

Page 20: Glossaire web pour les profanes - Webdesign

cookie

Témoin de connection. Il stocke des informations spécifiques sur l'utilisateur, comme les préférences d'un site ou le contenu d'un panier d'achat électronique.

Page 21: Glossaire web pour les profanes - Webdesign

css

Ou Cascading Style Sheets (feuille de style) sont utilisées pour définir le look and feel d’un site en dehors du code HTML du site.

Page 22: Glossaire web pour les profanes - Webdesign

css3

CSS3 est divisé en modules dont chacun permet de gérer séparément les couleurs, des requêtes médias ou encore des sélecteurs. Puissant wow!

Page 23: Glossaire web pour les profanes - Webdesign

www.css3.me

cool link

Page 24: Glossaire web pour les profanes - Webdesign

beta.theexpressiveweb.com

cool link

Page 25: Glossaire web pour les profanes - Webdesign

dns /DOMAIN NAME SERVICE

C’est un service permettant d'établir une correspondance entre une adresse IP et un nom de domaine.

Page 26: Glossaire web pour les profanes - Webdesign

e-commerce

Pour electronic commerce. Acheter ou vendre des produits ou des services via internet ou tout autre réseau informatique.

Page 27: Glossaire web pour les profanes - Webdesign

embed

Permet d’insérer du contenu multimédia ou des formats qui nativement ne sont pas supportés par les navigateurs dans des pages web.

Page 28: Glossaire web pour les profanes - Webdesign

favicon

Image de 16x16 pixel qui reprend généralement le logo du site dans la barre d’adresse du navigateur.

Page 29: Glossaire web pour les profanes - Webdesign

firewall

Logiciel permettant de faire respecter la politique de sécurité d’un réseau. Il définit les types de communication autorisés sur ce réseau.

Page 30: Glossaire web pour les profanes - Webdesign

fixed width

Largeur fixe dans le design d’un site. La largeur reste la même quelque soit la résolution d’écran, la taille du moniteur ou la taille du navigateur.

Page 31: Glossaire web pour les profanes - Webdesign

flash

Logiciel qui permet la création de graphiques vectoriels et de bitmap animés par un langage script appelé ActionScript.

Page 32: Glossaire web pour les profanes - Webdesign

www.nespresso.com/variations/

cool link

Page 33: Glossaire web pour les profanes - Webdesign

front end

L’opposé du back-end. Ce sont tous les composants d’un site que le visiteur peut voir (pages, images, contenu etc).

Page 34: Glossaire web pour les profanes - Webdesign

gif

Format d’image permettant de faire des animations sommaires avec des images en couleurs pleines.

http://gifparty.tumblr.com/

Page 35: Glossaire web pour les profanes - Webdesign

google analytics

Google Analytics lets you measure your advertising ROI as well as track your Flash, video, and social networking sites and applications.

Page 36: Glossaire web pour les profanes - Webdesign

Great creative fonts for free on your website

google fonts

Collection de typographies gratuites et compatibles pour le web.

Page 37: Glossaire web pour les profanes - Webdesign

grid / grille

Série de lignes horizontales et verticales à espacement régulier servant à rétablir l’ordre dans le chaos. Un outil puissantissime au service du designer.

Page 38: Glossaire web pour les profanes - Webdesign

www.thegridsystem.org

cool link

Page 39: Glossaire web pour les profanes - Webdesign

gui

Graphical User Interface / Interface utilisateur qui permet d’interagir avec des devices électroniques avec des images plutôt qu’avec des commandes texte.

Page 40: Glossaire web pour les profanes - Webdesign

hosting /hébergement

Serveur physique sur lequel se trouvent les pages d’un site web.

Page 41: Glossaire web pour les profanes - Webdesign

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html lang="fr" dir="ltr" xmlns="http://www.w3.org/1999/xhtml"><head><title>Hypertext Markup Language - Wikipédia</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><meta http-equiv="Content-Style-Type" content="text/css" /><meta name="generator" content="MediaWiki 1.17wmf1" /><link rel="alternate" type="application/x-wiki" title="Modifier" href="/w/index.php?title=Hypertext_Markup_Language&amp;action=edit" /><link rel="edit" title="Modifier" href="/w/index.php?title=Hypertext_Markup_Language&amp;action=edit" /><link rel="apple-touch-icon" href="http://fr.wikipedia.org/apple-touch-icon.png" /><link rel="shortcut icon" href="/favicon.ico" /><link rel="search" type="application/opensearchdescription+xml" href="/w/opensearch_desc.php" title="Wikipédia (fr)" /><link rel="EditURI" type="application/rsd+xml" href="http://fr.wikipedia.org/w/api.php?action=rsd" /><link rel="copyright" href="http://creativecommons.org/licenses/by-sa/3.0/" /><link rel="alternate" type="application/atom+xml" title="Flux Atom de Wikipédia" href="/w/index.php?title=Sp%C3%A9cial:Modifications_r%C3%A9centes&amp;feed=atom" /><link rel="stylesheet" href="http://bits.wikimedia.org/fr.wikipedia.org/load.php?debug=false&amp;lang=fr&amp;modules=mediawiki%21legacy%21commonPrint%7Cmediawiki%21legacy%21shared%7Cskins%21vector&amp;only=styles&amp;skin=vector" type="text/css" media="all" /><meta name="ResourceLoaderDynamicStyles" content="" /><link rel="stylesheet" href="http://bits.wikimedia.org/fr.wikipedia.org/load.php?debug=false&amp;lang=fr&amp;modules=site&amp;only=styles&amp;skin=vector" type="text/css" media="all" /><style type="text/css" media="all">a.new,#quickbar a.new{color:#ba0000}

/* cache key: frwiki:resourceloader:filter:minify-css:5:f2a9127573a22335c2a9102b208c73e7 */</style><script src="http://bits.wikimedia.org/fr.wikipedia.org/load.php?debug=false&amp;lang=fr&amp;modules=startup&amp;only=scripts&amp;skin=vector" type="text/javascript"></script><script type="text/javascript">if ( window.mediaWiki ) { mediaWiki.config.set({"wgCanonicalNamespace": "", "wgCanonicalSpecialPageName": false, "wgNamespaceNumber": 0, "wgPageName": "Hypertext_Markup_Language", "wgTitle": "Hypertext Markup Language", "wgAction": "view", "wgArticleId": 1386, "wgIsArticle": true, "wgUserName": null, "wgUserGroups": ["*"], "wgCurRevisionId": 68371494, "wgCategories": ["Portail:Informatique/Articles liés", "Standard du web", "Codage du texte", "SGML", "HTML", "Format ouvert", "Protocole réseau sur la couche présentation", "Bon article en ukrainien"], "wgBreakFrames": false, "wgRestrictionEdit": [], "wgRestrictionMove": [], "wgSearchNamespaces": [0], "wgVectorEnabledModules": {"collapsiblenav": true, "collapsibletabs": true, "editwarning": true, "expandablesearch": false, "footercleanup": false, "sectioneditlinks": false, "simplesearch": true, "experiments": true}, "wgWikiEditorEnabledModules": {"toolbar": true, "dialogs": true, "templateEditor": false, "templates": false, "addMediaWizard": false, "preview": false, "previewDialog": false, "publish": false, "toc": false}, "Geo": {"city": "", "country": ""}, "wgNoticeProject": "wikipedia"});}</script>

<style type="text/css">/*<![CDATA[*/.source-html4strict {line-height: normal;}.source-html4strict li, .source-html4strict pre { line-height: normal; border: 0px none white;}/** * GeSHi Dynamically Generated Stylesheet * -------------------------------------- * Dynamically generated stylesheet for html4strict * CSS class: source-html4strict, CSS id: * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann * (http://qbnz.com/highlighter/ and http://geshi.org/) * -------------------------------------- */.html4strict.source-html4strict .de1, .html4strict.source-html4strict .de2 {font: normal normal 1em/1.2em monospace; margin:0; padding:0; background:none; vertical-align:top;}.html4strict.source-html4strict {font-family:monospace;}.html4strict.source-html4strict .imp {font-weight: bold; color: red;}.html4strict.source-html4strict li, .html4strict.source-html4strict .li1 {font-weight: normal; vertical-align:top;}.html4strict.source-html4strict .ln {width:1px;text-align:right;margin:0;padding:0 2px;vertical-align:top;}.html4strict.source-html4strict .li2 {font-weight: bold; vertical-align:top;}.html4strict.source-html4strict .kw2 {color: #000000; font-weight: bold;}.html4strict.source-html4strict .kw3 {color: #000066;}.html4strict.source-html4strict .es0 {color: #000099; font-weight: bold;}.html4strict.source-html4strict .br0 {color: #66cc66;}.html4strict.source-html4strict .sy0 {color: #66cc66;}.html4strict.source-html4strict .st0 {color: #ff0000;}.html4strict.source-html4strict .nu0 {color: #cc66cc;}.html4strict.source-html4strict .sc-2 {color: #404040;}.html4strict.source-html4strict .sc-1 {color: #808080; font-style: italic;}.html4strict.source-html4strict .sc0 {color: #00bbdd;}.html4strict.source-html4strict .sc1 {color: #ddbb00;}.html4strict.source-html4strict .sc2 {color: #009900;}.html4strict.source-html4strict .ln-xtra, .html4strict.source-html4strict li.ln-xtra, .html4strict.source-html4strict div.ln-xtra {background-color: #ffc;}.html4strict.source-html4strict span.xtra { display:block; }

/*]]>*/</style><style type="text/css">/*<![CDATA[*/@import "/w/index.php?title=MediaWiki:Geshi.css&usemsgcache=yes&action=raw&ctype=text/css&smaxage=2678400";/*]]>*/</style><style type="text/css">/*<![CDATA[*/.source-xml {line-height: normal;}.source-xml li, .source-xml pre {

html

Format de données conçu pour représenter les pages web.

Page 42: Glossaire web pour les profanes - Webdesign

html5

C’est la révision majeure de d’HTML.

Page 43: Glossaire web pour les profanes - Webdesign

cool linkbeta.theexpressiveweb.com

Page 44: Glossaire web pour les profanes - Webdesign

jpeg

Format d’image compressé pour le web (entre autres)...

Page 45: Glossaire web pour les profanes - Webdesign

jquery

Bibliothèque JavaScript qui porte sur l'interaction entre JavaScript et HTML, et a pour but de simplifier des commandes communes de JavaScript.

Page 46: Glossaire web pour les profanes - Webdesign

dropr.com

cool link

Page 47: Glossaire web pour les profanes - Webdesign

landing page

Page d’arrivée principale d’un site.

Page 48: Glossaire web pour les profanes - Webdesign

liquid layout

Site dont la largeur est basée sur le pourcentage de la taille de la fenêtre du navigateur. Le layout du site change en fonction de la taille du navigateur.

Page 49: Glossaire web pour les profanes - Webdesign

navigation

C’est le système qui permet aux utilisateurs d’un site de se déplacer à l’intérieur de celui-ci.

Page 50: Glossaire web pour les profanes - Webdesign

tralala.com

nom de domaine

Nom par lequel un site internet est identifié.Le nom de domaine est associé à une adresse IP.

Page 51: Glossaire web pour les profanes - Webdesign

open source

Code source d’un programme informatique fait pour être utilisable par le public. Les programmes open source sont généralement gratuits ou low cost et développés par des passionnés souvent bénévoles.

Page 52: Glossaire web pour les profanes - Webdesign

pageview

Requête pour une page web par le navigateur d’un visiteur. Pour chaque page vue sur votre site, une personne (ou un search engine spider) a vu votre page.

Page 53: Glossaire web pour les profanes - Webdesign

php

.Langage de développement adapté au web et pouvant être embedded dans du HTML.

Page 54: Glossaire web pour les profanes - Webdesign

pixel

Le pixel, souvent abrégé px, est l'unité de base permettant de mesurer la définition d'une image numérique.

Page 55: Glossaire web pour les profanes - Webdesign

plugin

Un plug-in est un petit programme qui étend les capacités et fonctionnalités d’un site sans devoir retravailler tout le code.

Page 56: Glossaire web pour les profanes - Webdesign

Format d’image compressé pour le web (entre autres)... et qui permet les transparences.

PNG

Page 57: Glossaire web pour les profanes - Webdesign

prototypage

Version papier ou informatique d’un site montrant ses fonctionnalités et sa forme.

Page 58: Glossaire web pour les profanes - Webdesign

résolution

Nombre physique de pixels sur un écran (ex: 1280x1024).

Page 59: Glossaire web pour les profanes - Webdesign

responsive webdesign

C’est une approche ou philosophie qui défend l’idée d’une grille fluide avec des colonnes qui s’adaptent à l’espace disponible sur un écran.

Page 60: Glossaire web pour les profanes - Webdesign

colly.com

cool link

Page 61: Glossaire web pour les profanes - Webdesign

flux rss

Fichier dont le contenu est produit automatiquement en fonction des mises à jour d’un sitw. Les flux RSS sont souvent utilisés par les sites d'actualité ou les blogs pour présenter les dernières mises à jour.

Page 62: Glossaire web pour les profanes - Webdesign

ruby on rails

Langage de programmation open source avec comme focus la simplicité et la productivité.

Page 63: Glossaire web pour les profanes - Webdesign

scrum

Framework de project management itératif et incrémental souvent utilisé dans l’agile software delopment.

Page 64: Glossaire web pour les profanes - Webdesign

seo / sem

Processus pour augmenter la visibilité d’une site ou page dans les moteurs de recherche via le référencement naturel.

Page 65: Glossaire web pour les profanes - Webdesign

sharepoint

Plateforme de développement web de Microsoft qui permet de développer des sites axés le management de contenu et de documents.

Page 66: Glossaire web pour les profanes - Webdesign

template

Fichier type utilisé pour créer un design consistent sur tout le site web. Il sert de base de travail pour d’autres pages.

Page 67: Glossaire web pour les profanes - Webdesign

theme

Templates de sites prédéfinis pour un CMS donné et évitant l’étape de design dans un site. Généralement payants.

Page 68: Glossaire web pour les profanes - Webdesign

ui / user interface

Espace dans lequel l’interaction entre les humains et des machines ou des interfaces informatiques ont lieu.

Page 69: Glossaire web pour les profanes - Webdesign

usability

Approche pour faire des sites faciles à utiliser sans que cela demande des capacités particulières à l’utilisateur.

Page 70: Glossaire web pour les profanes - Webdesign

ux / user experience

Créer des interfaces à haute valeur expérientielle basées sur l’Affectif versus la Rentabilité.

Page 71: Glossaire web pour les profanes - Webdesign

littlebigdetails.com

cool link

Page 72: Glossaire web pour les profanes - Webdesign

safe web fontsArial / Helvetica

Times New Roman / TimesCourier New / Courier

VerdanaGeorgia

Trebuchet MSTypographies acceptées par défaut par tous les navigateurs et systèmes d’exploitations

Page 73: Glossaire web pour les profanes - Webdesign

web standards

Ce sont des specifications recommandées par le W3C pour standardiser le design des sites, cela dans le but de rendre le travail des designers et des développeurs plus consistent sur les différentes plateformes.

Page 74: Glossaire web pour les profanes - Webdesign

web app ≠ app

Page 75: Glossaire web pour les profanes - Webdesign

wireframe

Guide visuel qui représente la structure filaire (squelette) d’un site.

Page 77: Glossaire web pour les profanes - Webdesign

wireflow

Combinaison de wireframe et Workflow. Utilisé pour décrire l’architecture de l’information dans un site ou une application.

Page 78: Glossaire web pour les profanes - Webdesign

wireflow