Logo CSS

Mise en forme originale d'un site existant

Site web

Mai 2013

Contexte

Une mise en forme originale à créer

Dans le cadre d’un concours CSS, il a été demandé à chaque étudiant de réaliser un CSS original, à partir d’un site web tout fait.

Objectif

Trouver une idée avec du dynamisme

Malgré les contraintes techniques imposées, à savoir l’unique recours à du CSS, je souhaitais que cette mise en forme permette à l’utilisateur de tout de même agir pour visualiser les différentes parties du site.

J’ai donc décidé de partir sur l’image fixe d’un iPhone avec des parties à survoler pour faire apparaître chaque section du site.

Ce choix m’offrait aussi la possibilité de styliser chaque partie différemment avec une charte graphique spécifique (police, couleurs…).

Compétences développées

  • Montée en compétences en CSS
  • Conception d’une mise en forme
  • Gestion de contraintes techniques
  • Autonomie

Compétences développées

Montée en compétences en CSS
Conception d’une mise en forme
Gestion de contraintes techniques
Autonomie

Solution

Un écran d’iPhone comme modèle

Sur l’exemple d’un écran d’iPhone, j’ai modifié chaque partie du site pour que des pages s’affichent au survol des applications ayant une notification.

J’ai ensuite stylisé chaque page pour qu’elle corresponde au style iOS de l’époque !

Technologies utilisées

CSS 3