OUGD504 Brief 03 A brief history of… - Introduction to Design for Web

☞ On the 6th August 1991, the CERN, the European nuclear research laboratory, authorized the use of the World Wide Web protocol on which is based on the majority content on the Internet. We can find below the first web page.

Le 6 août 1991, le Cern, le laboratoire européen de recherches nucléaires, autorisait l'utilisation du protocole World Wide Web sur lequel est basé la majeure partie des contenus créés sur internet. En dessous se trouve la première page web.

http://info.cern.ch/hypertext/WWW/TheProject.html

The first published photo represents a girl false band, the Cernettes :

Pour la première photo mise en ligne sur le web, le Cern a créé un faux girl band, les Cernettes :

☞ Terminology :

- HTML (Hypertext Markup Language) : the standard language used in the creation of web pages

- HTTP (Hypertext Transfer Protocol) : the basis for the transfer of data across the World Wide Web

- URL (Uniform Ressource Locator) : also known as a web address and used to refer web pages

- CSS (Cascading Style Sheet) : a style sheet mark up language used for formatting

Il existe plusieurs formats de données :

- HTML (Hypertext Markup Language) : le langage standard utilisé dans la création de pages web 

- HTTP (Hypertext Transfer Protocol) : la base pour le transfert de données sur le World Wide Web 

- URL (Uniform Ressource Locator) : également connu sous le nom d'une adresse internet et utilisé pour référencer les pages web 

- CSS (Cascading Style Sheet) : une feuille de style utilisé pour le formatage

☞ Before starting to design a website, here's what we have to think about :

- What is the purpose of this website?
- Who is the target audience ?
- Why this website needs to exist ?

Avant d'élaborer un site internet, voici à quoi on doit réfléchir :

- Quel est le but du site ?

- À qui il est destiné ?

- Pourquoi ce site doit exister ?

☞ Considerations to design :
- Size : there are other sizes to take into account, they're different compared with print supports and it's necessary to work with all screens 
- Colours : they're not the same as print, we can use the RGB pallet but it needs to stay "safe"
- Fonts : we have to use common web fonts (like Arial, Times) because it replaced if our "fantasy fonts" are not installed in the users computer

Paramètres pour la conception :

- Taille : il y a d'autres tailles à prendre en compte, elles sont différentes de celles des supports imprimés et elles doivent s'adapter pour les écrans des utilisateurs

- Couleurs : le choix des couleurs se limite à la palette RVB et leur cobinaison doit rester harmonieuse

- Typographies : on doit choisir des typographies communes (ex : Arial, Times) car elles peuvent être remplacées si elles ne sont pas installées sur l'ordinateur des utilisateurs

☞ Trends
- The decline of skeuomorphism (a derivative object that retains ornamental design cues from structures that were necessary in the original)
- The rise of flat design
- Single page website (ex : Cyclemon)
- Responsive design
- Type based websites

Tendances :
- Le déclin du skeuomorphism (un objet dérivé qui réutilise les propriétés du modèle original) 
- L'essor du flat design 
- Les sites web en une page
- Responsive Design 
- Sites basés sur la typographie

Example of skeuomorphism : the digital shelf

As a conclusion, a website needs to be effective to catch the audience in the first few second after its opening.

En conclusion, un site doit être efficace pour attirer l'attention du public en quelques secondes après son ouverture.