Intégration #1 : introduction

Preview:

DESCRIPTION

Intégration #1 : introduction

Citation preview

Une introduction à l’intégration web

Intégration ?

Une définition de l’intégration

L’intégration est la procédure par laquelle on part d’un fichier graphique (le plus souvent au format PSD de Photoshop) pour arriver à un contenu HTML de type page web ou email HTML.Source : definitions-webmarketing.com

Navigateur et intégration

HTML

CSS

JS

Images

Client

une histoires de l’intégration

1990 - 1992 : les débuts du web

1993 - 1998 : tableaux & images

mrshowbiz.com - 1998

1998 - 2002 : Flash is king

http://free-flash-website.com/login/mm/flash/fla_4_5_6/applications/CD_roms/res_cd_rom/

BU/free4u_vCS5.html

2003 - 2005 : CSS devient le standard

myspace.com - 2003

2006 - 2009 : Javascript s’impose

jeuxvideo.com - 2008

2010 - 2012 : responsive web design

mashable.com - 2012

2013 - 2014 : web app

spotify.com - 2014

Langages & librairies

HTML, la structure

L’Hypertext Markup Language, généralement abrégé HTML, est le format de données conçu pour représenter les pages web.Source : wikipedia.org

CSS, le design

Les feuilles de style en cascade, généralement appelées CSS, forment un langage informatique qui décrit la présentation des documents HTMLSource : wikipedia.org

Préprocesseurs CSS

Frameworks

Bootsrap

Foundation

Les outils de l’intégrateur

Un navigateur

+ developer tools

FireFox Chrome Chrome Canary

Un éditeur de texte

Sublime Text Coda 2 Brackets

Design

Photoshop Illustrator

Test & validation

Intégrateur, un métier

Le boulot de l’intégrateur (1)

Le boulot de l’intégrateur (2)

Découpage sémantique

Le boulot de l’intégrateur (3)

Sites web & mobile

Emails

Ou travaille l’intégrateur ?

Startup Freelance Agence

Les contraintes de l’intégrateur

Respect des standars

Respect des formats

Respect des délais

Respect du design / de la plateforme

Le dilemme de l’intégrateur

Principes VS

Pratique

L’environnement de l’intégrateur

Chef de projetClient Webdesigner

Développeur backDéveloppeur front Référenceur

UX designer

Rédacteur

Les compétences de l’intégrateur

Suggestion de veille pour l’intégrateur en français

http://www.hteumeuleu.fr

http://www.lesintegristes.net

http://www.blogduwebdesign.com

http://www.alsacreations.com

Combien gagne un intégrateur ?

K€ brut/an – Source Urban Linker pour l’IDF

Merci pour votre attention.

BibliographieFaire comprendre le métier d'intégrateur web - Rémi Parmentier http://vimeo.com/105428541

Intégrateur lève toi et conçois- Bertrand Keller http://vimeo.com/51941103 The evolution of webdesign - Design Juices http://www.designjuices.co.uk/2011/09/web-design-evolution/

L’intégration web, cette leçon d’humilité - Marie Guillaumet, http://www.lesintegristes.net/2013/03/19/integration-web-humilite/

La vie des intégrateurs, chapitre V : et plus si affinités… - Eric Le Bihan http://www.lesintegristes.net/2012/09/06/la-vie-des-integrateurs-chapitre-v-et-plus-si-affinites/

A Day in the Life-Front End Engineer - Elle Morgan https://www.youtube.com/watch?v=w9UDoIeOG-E

Intégrateur dans la vraie vie - Christophe Andrieu http://www.stpo.fr/blog/integrateur-dans-la-vraie-vie/

CréditsCrossRoad - Responsive WordPress Magazine / Blog - Serge Kij https://www.flickr.com/photos/zergev/8145106535/

mrshowbiz.com, myspace.com, jeuxvideo.com, mashable.com http://archive.org/web/

Recommended