Structure du site

Infobrol - logo du site

Travaux en cours

Le site comporte actuellement 5796 documents informatifs, et 13417 pages diverses.

Modifications en cours: 216/5796
Pages à modifier: 54% 54%

Les modes de navigation

Depuis le 01/08/2003 (voir nouvelles), il n'est plus possibles de sélectionner le type de navigation personnalisée  (selon les différents modes). Par exemple, le choix était offert au visiteur de bénéficier des frames (cadres) ou pas, un mode rapide permettait la substitution des images par des liens vers ces dernières, etc.

 

Deux boutons (page précédente et page suivante) sont présents en haut et en bas de page, et permettent une navigation linéaire, à la manière d'un livre (page par page).
Si vous atteignez le site par une page quelconque, les boutons "page précédente" ne vous permettent donc pas de retourner à votre page d'origine (les boutons de votre navigateur sont là à cet effet), mais vous enmènent à la page précédente de la structure du site. De la même manière, si vous ouvrez un livre au hazard, vous tournez la page pour reculer à la page précédente ou la page suivante.

Les liens les plus généraux se trouvent sous forme de boutons en haut de page.

Dans la partie latérale (suivant l'interface sélectionnée, à gauche ou à droite) se trouvent une série de liens vers les pages d'accueil des différents chapitres.
En sous-section, une série de liens en rapport à ce chapitre proposent des pages clés.
Il est bien entendu qu'il est impossible par manque de place de proposer un lien vers chaque page du chapitre. Le premier lien de la section pointe donc soit vers le sommaire qui présente l'ensemble des pages de la section, soit vers la première page de la section.

 

L'interface...

Dans la partie latérale, une boîte de sélection vous permet d'adapter l'interface de l'infobrol à votre goût. Si vous estimez que l'affichage des pages est trop long, vous pouvez essayer un autre style.

  • Styles actuels :
    • sans style : Page sans feuille de style
    • Sans couleurs : Simple feuille de style de mise en page.
    • Gris-blanc : Style minimum, peu de couleurs.
    • Gris-Bleu-Orange : Dominante de gris, titres en orange, fond de page gris-bleu, fond de texte gris clair.
    • 2016 : Couleurs infobrol Gris-Bleu-Orange minimales
    • 2016 : Style 2016 pour le brol
  • Styles de l'ancienne interface :
    • sans style : propose des textes noirs sur fond blanc, la couleur des liens est celle par défaut (bleu), bref : moche mais efficace.
    • Xp : ajoute des effets de couleurs sans dégradés (inspirées du monde windows) et des boutons de navigation aux formes carrées.
    • "squale" utilise plus ou moins les mêmes effets, mais dans des teintes inspirées de la plongée (gris bleuté, jaune, blanc).
      Le panneau de navigation latéral se trouve à droite, et utilise un effet de pointeur au survol.
    • grand cru : est inspiré des vins (bordeau, noir, gris). Le menu latéral est réduit à sa plus simple expression, avec un léger effet de survol.
      La partie supérieure présente des onglets et non des boutons.
    • transition : utilise le style grand cru, mais permet au visiteur de découvrir les effets de transitions entre les pages (sous internet explorer).
    • dossiers : marque le retour du menu latéral à gauche, et présente les pages comme un ensemble de feuilles reliées par des anneaux, sur un fond structuré. Ce style utilise des images pour le fond, les parties en carbone, les boutons, et les anneaux du bloc de feuilles.

 

Aperçu des styles

Les anciens styles basés sur des tableaux

La mise en page de ces interfaces reposait sur des balises de tableaux. L'interface s'adaptait à la résolution du visiteur car elle était basée sur des cellules extensibles.
Exemple : le bandeau supérieur est composé d'une cellule de départ (de largeur fixe : celle de la colonne du menu ), puis d'une cellule dont la longueur était variable (définie en %) et dont le fond était composé d'une image de 1 pixel de large , d'une hauteur identique au bandeau, puis enfin la dernière cellule (de longueur fixe).
L'image de la cellule centrale était définie en hauteur, et étirée en largeur à la totalité de la cellule.

Le tout premier...
Style premier
Que de sombres idées...
Style underground
Tout en rondeurs...

Les différents boutons offraient un effet de transparence. Au survol, le visiteur avait l'impression qu'une ampoule colorée (suivant la fonction du bouton) s'allumait à l'intérieur.
C'était le style qui m'avait demandé le plus de temps à réaliser, mais celui que je préférais.

Style vert de gris
L'ancienne version du style Xp

Chaque bouton était une image, avec un effet de pression au survol.
Lers effets de relief étaient renforcés par les dégradés d'ombres.

Style Xp v1

 

Les anciens styles sans tableaux

La mise en page est à présent définie dans la feuille de style au moyen de balises de positionnement, ce qui offre une plus grande liberté.
Le bandeau supérieur et ler bandeau latéral sont basés sur des styles appliqués aux listes à puces.

L'interface "sans style"
Style sans style

Cette interface reprend en partie la feuille de style du précédent style "Xp", mais sans aucune image. L'ensemble repose uniquement sur des définitions de couleurs de fond et des effets de bordures (effet de survol des boutons).

Xp v2 - system
Style Xp v2
Interface "squale"
Style squale
Interface "grand cru"
Style grand cru
Interface "transition"

Basée sur grand cru (le but de cette interface n'est que de proposer au visiteur un aperçu des effets de transitions entre les pages) :

Style transition
Interface "dossier"
Style dossier
Interface "gris-bleu-orange"

C'est l'interface qui aura jusqu'à présent duré le plus longtemps (pratiquement dix ans). L'ensemble du site repose alors sur une hiérarchie de classes en PHP, avec moteur de rendu produisant une sortie XHTML stricte. L'aspect visuel est entièrement géré par un système de modèles (templates) et de feuilles de style.

Chaque page comprend une en-tête avec une image correspondant au chapitre, des menus paramètrables selon une interface de gestion pour l'utilisateur.

Style gris-bleu-orange
Interface "responsive"

Une présentation adaptée (du moins dans la mesure de mes possibilités) aux nouveaux media tels que les tablettes, lecteurs, etc.

Le moteur produit du code HTML5, structuré en articles, sections, etc. Le style est encore plus sobre, presque minimaliste, un fil d'Arianne permet une navigation plus structurée entre les dossiers et les chapitres.

Style responsive

 

L'histoire du site

C'est aux pressions morales et menaces diverses que le site doit d'être en ligne, car il en est encore au stade d'ébauche, et est en constante évolution. Il ne sera jamais un produit fini.

L'objectif était assez simple: me fournir un outil de travail en structurant les diverses données accumulées dans d'innombrables fardes, ou dans les recoins les plus inattendus de mes disques durs. Très égoïste comme démarche, non ?

Le support hypertexte me semblait un bon moyen d'accéder rapidement à certaines informations, et le défit fut de stocker l'entièreté du site sur une disquette de 1,44Mo, afin de l'avoir partout à disposition.

Ensuite, le serveur de notre intranet m'a permis d'héberger le site dans une clandestinité presque totale, afin de pouvoir accéder de presque partout (et pour un nombre restreint d'utilisateurs) aux données, jusqu'au moment où j'ai été forcé de le retirer du serveur... Toute la partie du site qui contient les données relatives à la mise en œuvre du réseau tactique ne pouvant se trouver sur l'Internet, se trouve donc stockée en local sur ma machine.

 

Les dossiers

Nom#Description
Informations7665Accueil, carte du site, index complet, construction et présentation du site, moteur de recherche interne, nouveautés, l'auteur, etc.
Photographie10Le blog PhotoBrol, les albums photo, le flux de photos, les statistiques des meta-données des photos,…
Informatique97Le matériel, le fonctionnement d'un ordinateur et de ses principaux composants, les systèmes d'exploitation, astuces diverses, logiciels, etc.
Les réseaux73Cours sur les réseaux locaux, protocoles, architectures, mise en oeuvre, etc.
Programmation5457Les bases de la programmation, structures des langages. Les exemples sont le plus souvent illustrés de codes C ou Java.
Outils55Divers utilitaires de l'infobrol (outils de conversions, etc.).
Généralités58Des cours pour survoler les notions de logique, analyse, calculs matriciels, statistique, probabilités, etc.
Actualités0Les nouvelles du monde de l'informatique. Ces articles sont rédigés par les membres de l'infobrol.
Astuces0Astuces diverses. Ces articles sont rédigés par les membres de l'infobrol.
Réservé-Espaces réservés en fonction du groupe du membre.

Espaces réservés

Pour des raisons de discrétion et de sécurité, les pages dont l'accès est réservé à certains groupes en fonction de leurs droits ne sont pas comptabilisées ici.

 

Les chapitres

Nom#Description
Navigation7Pages de navigation : Sommaires, affichage des X dernières pages,moteur de recherche interne, etc.
Outils25Les services et ressources de l'infobrol : Générateurs de mots de passe, outils de conversions (températures, distances, dates), avatars, niouzes (Nouveautés du monde informatique), astuces, forums, météo, traduction, téléchargements, images et vidéo
Le site14Tout ce qui tourne autour du site : Nouvelles du site- FAQ (questions les plus fréquentes)- L'auteur- Historique et structure du site- Statistiques de fréquentation- etc.
Matériel informatique18Principes et manipulation du matériel informatique, processeur, mémoires, bus, connecteurs, etc.
Généralités Informatique7Généralités sur l'informatique. En réalité, toutes les pages que je ne sais pas caser autre-part ;-)
Généralités OS11Informations diverses sur les systèmes d'exploitation DOS, Windows, etc.
Systèmes d'exploitation17Principes de fonctionnement des divers systèmes d'exploitation.
UNIX - Linux9Utilisation des systèmes d'exploitation Unix et Linux (Installation, Packages, principes, mode console, etc.).
Windows NT5Principes de bases de l'utilisation de Windows NT, du niveau utilisateur au niveau administrateur réseau.
Windows 20008Principes de bases de Windows 2000. Les différentes versions, Active Directory, GPO (Group Policies Object), etc.
Programmes0Comment utiliser divers programmes.Par exemple Microsoft Exchange, Nero Burning Rom, Photoshop, etc.
Office20Comprendre et utiliser les programmes de la suite Microsoft Office.- Outlook- Word- Excel- AccessVersions depuis Office 97 jusque Office 2003
VBA - VBS7Initiation à VisualBasic for Application et à VBScript. Codes commentés.
Généralités réseau34Classements, terminologies, introduction aux réseaux.
Normes et standards24Différentes normes appliquées dans le monde des réseaux :- UIT-T (ex CCITT)- V et X- IEEE- etc.
Modèle OSI10Les diférentes couches du modèle de référence OSI.
Analyse19Initiation à l'analyse et à la modélisation des systèmes informatiques. Patterns et bonnes pratiques...
Logique8Introduction à la logique mathématique, qui finalement régit les principes de fonctionnement de nos programmes et de nos ordinateurs.Algèbre de Boole, demi additionneur, Karnaugh
Matrices5Comprendre les principes de base du calcul matriciel.
Graphes18Introduction aux graphes
Stat - Proba3Initiation aux statistiques et probabilités.
SGBD26Algèbre relationnelle, requètes SQL, etc.
Cryptologie9Comprendre les principes de base de la cryptologie (confidentialité, authentification, intégrité) avec nos amis Alice, Bob et Charlie.
Compilateur30Les principes de programmation applicables à tous les langages- Représentations de données- Architecture matérielle (Von Neuman)- Algorithmes- Micro-programme- Langage Machine- Langages de programmation- etc. Les notions de bases pour comprendre ce qui se passe dans un compilateur.
Programmer30Les principes de base de la programmation et de l'algorithmique. Les exemples sont le plus souvent en pseudo-code, mais aussi en Pascal, C, ou Java. D'autres chapitres proposent des informations plus précises sur les langages tels que Java, C et C++, C#, JavaScript, VB, ASP, PHP, etc.
Programmation déclarative6Les principes de la programmation déclarative, et plus spécialement de la programmation logique avec Prolog, pour entrevoir qu'il existe autre chose que la programmation impérative...
Java28Le langage de programmation Java
API Java5150
C & C++33Pages relatives aux langages C et C++
C Sharp34Initiation au langage C#
Visual Studio0Utilisation de Visual Studio (depuis le site de Microsoft)
.NET0La librairie MSDN du framework .NET
SGML HTML XML10Une initiation aux différents langages de structure ou de présentation de données, que l'on peut rencontrer sur le net.
CSS28Les feuilles de style en cascade
Optimisation Web8Comment optimiser votre site Web en gagnant par exemple sur la quantité d'information à envoyer au navigateur client, ou en utilisant les bonnes balises.
Fun Web6Votre site est tout à fait correct, mais vous désirez le rendre plus attrayant. Vous pouvez utiliser les filtres, transitions de pages, jouer avec les couleurs...
PHP - MySQL12Utiliser le langage PHP pour traiter le code du côté serveur, utiliser les informations hors de bases de données, et gérer les bases de données avec MySQL.
Manuel PHP0
Le Web en vrac9Informations diverses en rapport avec le Web (Utilisation des forums phpBB, les fichiers .htpasswd et .htaccess, etc.).
Introduction au JavaScript12Comprendre les principes du langage JavaScript. Codes commentés.
Objets JavaScript25Les Objets et Méthodes en JavaScript.
JavaScript en vrac12Codes JavaScript et informations diverses.
Le brol du brol11Toutes les pages qui ne nécessitent pas un nouveau chapitre.
Glossaire29Glossaire des termes utilisés en informatique, dans les télécommunications, ou dans certains sujets abordés sur le site.
Photo7La photographie, actualités, matériel, astuces, albums photo, statistiques metadata photo

Pages dynamiques

Seules les pages dont le contenu est statique sont prises en compte ici, vous pouvez consulter les statistiques du site pour plus d'informations.

Liens des chapitres

Vous pouvez cliquer sur un chapitre pour atteindre son sommaire ou sa première page.

 

Remerciements

Je dois donc remercier en premier mon épouse Dominique et mes enfants pour leur patience face à mes lubies informatiques chronophages, mais je dois aussi remercier tous les râleurs qui m'ont forcé à mettre en ligne le site, ainsi que tous ceux qui se présentent à ma porte avec les questions les plus inattendues qui me fournissent sans cesse l'occasion de me remettre en question...

 

Document créé le 19/03/02 01:00, dernière modification le 10/06/17 07:34
Source du document imprimé : //info/historique.html

L'infobrol est un site personnel dont le contenu n'engage que moi. Le texte est mis à disposition sous licence CreativeCommons(BY-NC-SA). Plus d'info sur les conditions d'utilisation et sur l'auteur.