Glossaire web pour les profanes - Webdesign
Upcoming SlideShare
Loading in...5
×
 

Glossaire web pour les profanes - Webdesign

on

  • 1,482 views

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 ...

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.

Statistics

Views

Total Views
1,482
Views on SlideShare
1,253
Embed Views
229

Actions

Likes
3
Downloads
33
Comments
0

7 Embeds 229

http://www.metiers-du-web.com 124
http://www.creadesigner.fr 83
http://feeds.feedburner.com 9
http://www.bonweb.fr 6
http://www.linkedin.com 4
http://us-w1.rockmelt.com 2
http://paper.li 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Glossaire web pour les profanes - Webdesign Glossaire web pour les profanes - Webdesign Presentation Transcript

  • le glossaireweb pour lesprofanesCREA3 - Septembre 2011 Relax In The Aira RITA teaching
  • MC CasalDigital art director at relax in the airwww.relaxintheair.com @mccasalwww.behance.com/mccasalwww.linkedin.com/in/mccasal
  • GLOSSAIRE
  • accessibilitéDegré auquel un site peut être utilisé par tous lesutilisateurs, en incluant ceux ayant un handicap.
  • ADRESSE ip85.4.242.24Une adresse IP (avec IP pour InternetProtocol) est un numéro didentification qui estattribué à chaque branchement dappareil à unréseau informatique utilisant lInternet Protocol.
  • adwordsAdWords est le nom du système publicitaire dumoteur de recherche Google. Celui-ci affiche desbannières publicitaires, qui sont ciblées enfonction des mots-clés que tape linternaute.
  • agileLes méthodes agiles sont des groupes depratiques de développement. Elles permettent unegrande réactivité aux demandes du client.
  • AJAXCombinaison de technologies telles queJavascript, CSS, XML, le DOM et leXMLHttpRequest dans le but de réaliser desapplications Web qui offrent maniabilité etconfort dutilisation.
  • ASP .netFramework de développement web de Microsoftqui permet aux développeurs de construire dessites dynamiques, des applications web et des webservices.
  • BACK ENDPartie 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.
  • BANDE PASSANTETaux auquel les data sont transférées ou laquantité de datas autorisées à être transféréesdepuis un hébergement web.
  • Bounce rate / taux de rebondPourcentage dinternautes qui sont entrés surune page Web et qui ont quitté le site après. Ilsnont vu quune seule page.
  • breadcrumbLe fil d’Ariane ou chemin de fer est une aide à lanavigation sous forme de signalisation de lalocalisation du lecteur dans un document.
  • browserLogiciel pour présenter, afficher et consulter leWorld Wide Web.
  • cacheLes fichiers cache sont ceux qui sont sauvés etstockés par un browser (navigateur) pourrendre la prochaine visite plus rapide.
  • cloudRessources numériques stockées sur des serveursdistants et permettant un accès depuis n’importequel point de connection au web.
  • cool link http://www.apple.com/icloud/
  • cmsWordpress Drupal Joomla Magento Umbraco Typo3Famille de logiciels destinés à la conception et àla mise à jour dynamique de sites Web oudapplications multimédia.
  • cookieTémoin de connection. Il stocke des informationsspécifiques sur lutilisateur, comme lespréférences dun site ou le contenu dun panierdachat électronique.
  • cssOu Cascading Style Sheets (feuille de style)sont utilisées pour définir le look and feel d’unsite en dehors du code HTML du site.
  • css3CSS3 est divisé en modules dont chacun permetde gérer séparément les couleurs, des requêtesmédias ou encore des sélecteurs. Puissant wow!
  • cool link www.css3.me
  • cool link beta.theexpressiveweb.com
  • dns /DOMAIN NAME SERVICEC’est un service permettant détablir unecorrespondance entre une adresse IP et un nomde domaine.
  • e-commercePour electronic commerce. Acheter ou vendre desproduits ou des services via internet ou toutautre réseau informatique.
  • embedPermet d’insérer du contenu multimédia ou desformats qui nativement ne sont pas supportés parles navigateurs dans des pages web.
  • faviconImage de 16x16 pixel qui reprend généralement lelogo du site dans la barre d’adresse dunavigateur.
  • firewallLogiciel permettant de faire respecter la politiquede sécurité d’un réseau. Il définit les types decommunication autorisés sur ce réseau.
  • fixed widthLargeur fixe dans le design d’un site. La largeurreste la même quelque soit la résolution d’écran,la taille du moniteur ou la taille du navigateur.
  • flashLogiciel qui permet la création de graphiquesvectoriels et de bitmap animés par un langagescript appelé ActionScript.
  • cool link www.nespresso.com/variations/
  • front endL’opposé du back-end. Ce sont tous lescomposants d’un site que le visiteur peut voir(pages, images, contenu etc).
  • gifhttp://gifparty.tumblr.com/Format d’image permettant de faire desanimations sommaires avec des images encouleurs pleines.
  • google analyticsGoogle Analytics lets you measure youradvertising ROI as well as track your Flash,video, and social networking sites andapplications.
  • google fontsGreat creativefonts for free on your websiteCollection de typographies gratuites etcompatibles pour le web.
  • grid / grilleSérie de lignes horizontales et verticales àespacement régulier servant à rétablir l’ordredans le chaos. Un outil puissantissime au servicedu designer.
  • cool link www.thegridsystem.org
  • guiGraphical User Interface / Interface utilisateurqui permet d’interagir avec des devicesélectroniques avec des images plutôt qu’avec descommandes texte.
  • hosting /hébergementServeur physique sur lequel se trouvent les pagesd’un site web.
  • <!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> html<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 duweb", "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": Format de données conçu pour représenter les{"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"});} pages web.</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:
  • html5C’est la révision majeure de d’HTML.
  • cool link beta.theexpressiveweb.com
  • jpegFormat d’image compressé pour le web (entreautres)...
  • jqueryBibliothèque JavaScript qui porte surlinteraction entre JavaScript et HTML, et apour but de simplifier des commandes communesde JavaScript.
  • cool link dropr.com
  • landing pagePage d’arrivée principale d’un site.
  • liquid layoutSite dont la largeur est basée sur le pourcentagede la taille de la fenêtre du navigateur. Le layoutdu site change en fonction de la taille dunavigateur.
  • navigationC’est le système qui permet aux utilisateurs d’unsite de se déplacer à l’intérieur de celui-ci.
  • nom de domainetralala.comNom par lequel un site internet est identifié.Lenom de domaine est associé à une adresse IP.
  • open sourceCode source d’un programme informatique faitpour être utilisable par le public. Les programmesopen source sont généralement gratuits ou lowcost et développés par des passionnés souventbénévoles.
  • pageviewRequête pour une page web par le navigateur d’unvisiteur. Pour chaque page vue sur votre site,une personne (ou un search engine spider) a vuvotre page.
  • php.Langage de développement adapté au web etpouvant être embedded dans du HTML.
  • pixelLe pixel, souvent abrégé px, est lunité de basepermettant de mesurer la définition dune imagenumérique.
  • pluginUn plug-in est un petit programme qui étend lescapacités et fonctionnalités d’un site sans devoirretravailler tout le code.
  • PNGFormat d’image compressé pour le web (entreautres)... et qui permet les transparences.
  • prototypageVersion papier ou informatique d’un site montrantses fonctionnalités et sa forme.
  • résolutionNombre physique de pixels sur un écran (ex:1280x1024).
  • responsive webdesignC’est une approche ou philosophie qui défendl’idée d’une grille fluide avec des colonnes quis’adaptent à l’espace disponible sur un écran.
  • cool link colly.com
  • flux rssFichier dont le contenu est produitautomatiquement en fonction des mises à jourd’un sitw. Les flux RSS sont souvent utiliséspar les sites dactualité ou les blogs pourprésenter les dernières mises à jour.
  • ruby on railsLangage de programmation open source aveccomme focus la simplicité et la productivité.
  • scrumFramework de project management itératif etincrémental souvent utilisé dans l’agile softwaredelopment.
  • seo / semProcessus pour augmenter la visibilité d’une siteou page dans les moteurs de recherche via leréférencement naturel.
  • sharepointPlateforme de développement web de Microsoftqui permet de développer des sites axés lemanagement de contenu et de documents.
  • templateFichier type utilisé pour créer un designconsistent sur tout le site web. Il sert de base detravail pour d’autres pages.
  • themeTemplates de sites prédéfinis pour un CMSdonné et évitant l’étape de design dans un site.Généralement payants.
  • ui / user interfaceEspace dans lequel l’interaction entre les humainset des machines ou des interfaces informatiquesont lieu.
  • usabilityApproche pour faire des sites faciles à utilisersans que cela demande des capacités particulièresà l’utilisateur.
  • ux / user experienceCréer des interfaces à haute valeur expérientiellebasées sur l’Affectif versus la Rentabilité.
  • cool link littlebigdetails.com
  • safe web fonts Arial / Helvetica Times New Roman / Times Courier New / Courier Verdana Georgia Trebuchet MSTypographies acceptées par défaut par tous lesnavigateurs et systèmes d’exploitations
  • web standardsCe sont des specifications recommandées par leW3C pour standardiser le design des sites, celadans le but de rendre le travail des designers etdes développeurs plus consistent sur lesdifférentes plateformes.
  • web app ≠ app
  • wireframeGuide visuel qui représente la structure filaire(squelette) d’un site.
  • cool link webdesignledger.com
  • wireflowCombinaison de wireframe et Workflow. Utilisépour décrire l’architecture de l’information dansun site ou une application.
  • wireflow