SITES internet ou Web. Larborescence dun site Schéma darborescence Page INDEX ou daccueil images...

Preview:

Citation preview

SITES internet ou Web

L’arborescence d’un site

Schéma d’arborescencePage INDEX ou d’accueil

images

pages

vidéos

diaporamassons

flash

De plus en plus de sites utilisent la partie supérieure pour l’image du site et la partie gauche pour la présentation des menus. Ce sont pour la plupart des compositions banalisées déjà pré-élaborées par des logiciels où il n’est plus qu’à remplir les espaces par des textes et des images de son choix. Ces compositions ne sont guère créatives mais ont l’avantage d’être globalisantes dans leurs contenus respectifs et adaptées à la vision commune de lecture du web.

Onglets de menu de page

Modes de COMPOSITION

Les HYPERLIENS

Menus déroulants verticaux qui laissent apparaître des liens hyperactifs qui vont eux-mêmes, une fois cliqués, nous permettre d’ouvrir de nouvelles pages

Menus déroulants horizontaux en cascade, ici coloré en rouge dès que pointés par la souris

Ces onglets de menu renvoient soit à une nouvelle page qui remplacera celle d’accueil soit dérouleront des menus déroulants qui une fois cliqués, nous feront apparaître soit une nouvelle page (pleine ou « pop up ») .Ce sont les « hyperliens » actifs qui apparaissent souvent en couleur lorsque la souris les survole pour montrer leur singularité de fonction active. Il est ainsi possible de descendre en profondeur dans tous les dossiers et sous-dossiers d’un site pour montrer ou mettre en évidence un détail. Il est de même possible de renvoyer par un simple lien à un site différent sans qu’il n’y ait cependant une quelconque rupture.

La main, symbole d’hyperactivité des liens

Lien direct coloré (ici bleu) et souligné

Vidéos, diaporamas, photos, images, illustrations, textes, typographies, montages sont les constituants plastiques de communication utilisés communément dans tout site internet. Ils sont choisis en fonction de leur contexte informatif et en cela très proche de la composition d’un livre papier.

vidéovidéoillustration :

photomontageillustration : photomontage

illustrationsillustrations

photophoto

diaporamadiaporama

typographietypographietext

etexte

Référents plastiques et textuels d’un site

Les INTITULÉS de NOMS de DOMAINE

Chaque site reçoit un intitulé URL qui détermine sa nature.Ex : .fr : France.com (référence internationale, commerce, communication).org (organisation, associatif, communautaire).net (relatif aux sites internet).eu (europe).info (information).biz (business).pro (professionnel).cc (égale de l’extension .com).tv (archipel des Tuvalu, aussi TV et télédiffusion).me (Monténégro, site perso « moi »).mobi (fonctionne sur tous types de matériel mobile).tel (annuaire universel en temps réel).fm (projets liés à la radio ou autres).mu (musique).name (adresse identitaire)Etc.Ces données sont fournies lors de la création d’un NOM de DOMAINE qui se fait en ligne avec un hébergeur qui diffuse le site sur Internet.

Dominante JAUNE

Dominante JAUNE-ORANGE

Dominante ORANGE

Dominante ORANGE-ROUGE

Dominante ROUGE

Dominante VIOLET

Dominante BLEU

Dominante VERT

Dominante VERT-JAUNE sablé

Dominante ORANGE-MARRON

Dominante MARRON-NOIR

Dominante NOIR

Dominante GRIS

Dominante BLANC

Dominante GRIS-ROSE

Les SONORITÉS d’AMBIANCESCertains sons accompagnent certains sites, cela accentue l’ambiance du site et nous met en emphase avec les images ou pages qui vont suivre :

C:\Mes Sites Web\ptitbestiole\www.ptitbestiol.com\index.htmlC:\Mes Sites Web\kaaron\www.kaarondesign.com\index.htmlC:\Mes Sites Web\agedescancres.com\www.agedescancres.com\index.html

QUESTIONNAIRE***

?

c:

b:

e:

d:

a:

Diapo 1: Donnez le noms de ces parts constituantes de site

Diapo 2: il s’agit ici d’une composition

a: oblique ?

b: justifiée à droite ?

c: justifiée à gauche ?

d: supérieure ?

Diapo 3: il s’agit ici d’une composition :

a: oblique ?

b: justifiée à droite ?

c: justifiée à gauche ?

d: supérieure ?

Diapo 4: il s’agit ici d’une composition

a: oblique ?

b: justifiée à droite ?

c: justifiée à gauche ?

d: supérieure ?

Diapo 5 :a: Combien d’onglets (hyperliens) ce site utilise-t’il ?

b : Pour arriver à la 3° page (détail), combien de liens ont-ils été cliqués ?

c : Comment se nomme cette action graphique qui simplifie, géométrise un élément réaliste ?

Diapo 6 :

a : Quel nombre d’onglets y a t’il ?

b : combien de liens actifs découvrez-vous en dehors de ces onglets ?

c : nommez ces éléments constitutifs (1 à 5) du site.

1

2

3

4

5

a : Quel est l’intrus ?

b : Justifiez…

A

B

C

D

E

F

Recommended