Tous moteur de recherche fonctionne de la même manière.

Les composantes principales sont les suivantes:

un index (lieu -> structure de données ou tous les resultats des recherches sont stockés, l' organisation des donnees rappelle dans son principe de base l'index d'un livre pour les concordances bibliques ), un crawler (programme qui se charge de parcourir le web et qui acquiert le contenu des documents à indexer,) un engin d'indexation qui transforme ces documents pour les stocker en une forme appropriee dans l'index ),et un "front-end" qui comprend l'interface gaphique (GUI) qui capture la requete exprimee par l'utilisateur, et la transmet à l'engin de recherche proprement dit, et finalement l'engin de recherche qui est la piece centrale : identifie les documents pertinents à la requete en accedant l'index - ces candidats sont transmis au front-end qui permet l'affichage des resultats de la recherche.

la plateforme de developpment de choix de Google est C++ sur Linux et Java

On envoie donc le crawler, parcourir le web et stocker tous les résultats de son parcours dans l'index.

Mais quels sont les résultats qui s'afficheront en premier pour une requete arbitraire?

Google innova dans la facon de classer les liens. Avez vous déja entendu parler du PageRank?

C'est en fait un jeu de mots, page rank est vraiment le poids de la page mais un rank "statique" indépendant de la requete : c'est ca l'innovation, de melanger un poids independant de la requete avec le traditionel poids de l'IR qui regarde la pertinence du document à la requete en analysant la distribution des mots dans le document par rapport au corpus ( l'inventeur n'est pas Larry mais Sergey Brin et Larry ensemble - et Sergey à au moins autant contribue, Sergey est plus technique et Larry s'occupe plus du coté business tout en restant vraiment technique )

Le pagerank peut etre hyper simplifie en l'expliquant comme un ensemble de petits agents qui se promenent sur le graphe du web à partir de pleins de sources difefrentes en une marche alléatoire :

s'ils se retrouvent sur des meme croisements ,cela veut dire que ces points de rencontre sont importants et ils recoivent un fort pagerank.

Ce qui est complique c'est le modele probabiliste qui decrit ce processus alléatoire.


Pour une requete Lambda:
Rang 1 : Le site de Lambda ( 5 liens poitant sur ce site)
Rang 2 : Lambda site web ( 4 liens pointant sur ce site)
Rang 3 : L'histoire de Lambda ( 3 liens pointant sur ce site)
Rang 4 : Tous sur Lambda ( 2 liens pointant sur ce site)

Attention le pageRank n'est pas le procédé le plus utilisé pour classer les sites internet sur Google.

Certains paramêtres sont prit en compte: contenu du site internet ( mots-clef, titre de la page ... ).

Google fait donc un mix des paramêtres et du pageRank.


Les resultat viennent de facon automatique : google n'interpretre pas les résultats de facons semantique, ce ne sont toujours que des statistiques sur une chaine de caractère .

Donc, pour une requete ayant deux significations, l'une beaucoup plus populaire que l'autre, vous trouverez quand même des sites relatifs aux deux sens du terme.

On peut donc imaginer un ensemble d'algorythme de base avec des heuristiques d'approximation puiqu'il n'y a pas une unique solution au probleme, mais plein d'approximations.
En plus de s'occuper de classer les sites internet, il se doit de detecter les Spams (le filtre de Google est d'ailleur excelent).

Les Spams ne se limite pas aux messages indésirable que vous recevez par email, c'est aussi les sites internet indésirables trafiqué pour avoir un bon classement sur Google.
Une des Techniques les plus courantes à été d'écrire à répétition sur un fond blanc et en blanc un mot correspondant à une requete courante. ( Fameuse Histoire de la rêquete "Cars" ( voitures ) sur Altavista qui affichait des sites pornographiques)

Faisont un récapitulatif de certaines des fonctions de l'algorythmes de Google:
1) Classement des sites, indexation avec les mots clef
2) Calcul du PageRank
3) Mix des deux Techniques
4) Bloquer les sites indésirables
Et plein d'autres encore...
Digg this

| Send by Email/Envoyer cet article par Email edit post
Introduction

Alors voila, la définition de la colonne de droite est forte intéressante mais elle ne vous explique pas comment marche une feuille de style.
Je ferai cela étapes par étapes sans entrer dans de longs et complexes détails.
Commencons donc par une vue d'ensemble.

CSS en francais signifie feuille de style en cascade, je vais donc utiliser le mode d'écriture de haut en bas et non par ligne ( les modes restent aux choix en fonction de la préférences du webmaster ).

Tout d'abord on doit indiquer au navigateur qu'il va etre en présence d'une feuille de style. Deux choix s'offrent à nous:
1) créer une feuille de style qui prendera donc l'extension de fichier ".css"
2) écrire la css dans la page HTML, sans oublié de préciser les balises : "style type="text/css"" et "/style"

Nous allons nous contenter de la deuxième solution.

Mais comment ca marche?

1) Relation css et div

Lorsque l'on rédige une css on doit comprendre que celle ci va nous permettre de definir des cadres qui auront en fonction des attributs, des comportements différents à l'affichage du navigateur.

Attention: la difficulté de rédaction d'un code réside dans le fait que les navigateurs ne comprennent pas toujours le code de la meme manière, votre site pourrat donc être différent sur Firefox et sur Internet explorer.
Nous verrons bien plus tard ce que l'on nomme les Hack Css et surtout, bien plus intéressant, les bugs de Internet Explorer ou vous comprendrez la nécessité de stopper la navigation avec celui ci et de passer à un navigateur comme Mozilla.

La CSS fonctionne de la même manière qu'un arbre généalogique avec des ancêtres, parents, et enfants.

Explication :

Comme nous l'avons vu précédemment la css permet de définir des cadres ( et pas seulement ) afin de structurer une page internet.

Chaque cadre se verra porter un identifiant qui permettera de faire la relation entre son orientation sur la page et ses attributs.

Cas pratique:

Nous créons dans notre feuille de style notre cadre appelé "cadre1", il suffit d'ajouter un dièze devant l'identifiant du cadre :

#cadre1{
}

Il nous reste plus qu'a placer notre "cadre1" dans le coeur de notre page HTML donc entre les balises "BODY".
Les cadres sont appellés "DIV" et son identifié par leurs noms dans la CSS (ici cadre1). On va donc écrire :

div id="cadre1"
/div
Entre les deux balises nous pouvons écrire le contenu du cadre "cadre1".

Nous n'avons donné aucun attributs au cadre "cadre1" dans la CSS.

Propriété CSS

Je ne vais pas vous exposer la liste des propriétés des feuilles de style mais pour une bonne comprehension du fonctionnement nous utiliserons les propriétés les plus courantes.

Pour information, voila une des meilleures liste du web par Jack Daniel.



Une css se presente donc en cascade (rédaction de haut en bas). Les propriétés d'un css sont en anglais, un tout petit niveau d'anglais est donc nécéssaire.

Nous allons maintenant voir l'écriture dans une css d'un cadre ayant les propriétés suivantes:
Le cadre est noir, de taille 400 pixels en largeur et 300 pixels en hauteur, décallé sur la gauche d'une marge de 20 px ( px = pixels ).
Ne vous affolez pas vous allez comprendre.

Comme nous l'avons vu au premier chapitre un cadre se definit dans la CSS comme suit:

#cadre1{
}


Nous allons établir une liste des attributs :

Cadre noir -> le cadre "cadre1" doit donc avoir une couleur de fond noir :

background-color: #000000; ou background-color: black; ou background-color: #000

background: #000000; ou background: black; ou background: #000

Nous préfererons la notation backgroud-color même si la seconde convient.

Personnellement je ne vois pas la nécéssité de connaitre les codes couleurs par coeur, retenez les principaux: noir (#000000), blanc (#FFFFFF) , gris (#CCCCCC) et en comprenant le fonctionnement d'un code hexadécimale vous pouvez vous même éclaircir ou foncer les couleurs. (pour plus d'information voir couleurs hexadécimale sur Google).

Le cadre doit avoir une largeur de 400px :

width: 400px; (width = largeur)

Le cadre doit avoir une hauteur de 300px :

height: 300px; (height = hauteur)

Le cadre doit être décallé de 30px sur la gauche (donc une marge de 30px a gauche de la page) :

margin-left: 30px; (margin = marge et left = gauche)

Récapitulatif :
Pour un cadre noir, de taille 400 pixels en largeur et 300 pixels en hauteur, décallé sur la gauche d'une marge de 20 px ( px = pixels ).

La css s'écrira donc:

#cadre1{
width: 400px;
height: 300px;
margin-left: 30px;
background-color: #000;
}

Attention pour que le cadre1 apparaisse sur notre page, il ne faut pas avoir oublier d'écrire entre les deux balises "body",

div id="cadre1"
/div



Et il vous suffit d'écrire entre les balises "div" le contenu de votre cadre1. ( petit piège, vous ne verrez rien dans le cadre 1 même si il existe du contenu au cadre, pourquoi?)

Et oui à ne pas oublier, la couleur par default du texte et la couleur noir. Il faut donc ajouter la propriété "color" et la couleur associé (#fff) pour obtenir un fond noir et un texte blanc.

#cadre1{
width: 400px;
height: 300px;
margin-left: 30px;
background-color: #000;
color: #fff
}

Dans ce post je tenté de vous expliquer trés sommairement le fonctionnement d'une feuille de style, mais le plus compliqué reste à venir.
Aprés une grande expérience de construction de feuille de style, le plus complexe est de créer des sites internet conforme aux standards W3C et aussi, des sites ayant le même rendu sur tous les navigateurs (souvent les deux sont liés, bien que certains navigateurs et en particulier celui de Microsoft ne respecte pas à la lettre les standards.
C'est pourquoi je vous recommande vivement de vous familiariser avec les standards.
Pour faire verifier votre feuille de style ainsi que votre page HTML : http://validator.w3.org/


Digg this

| Send by Email/Envoyer cet article par Email edit post
C'est vrai ca, que choisir quand on doit donner une couleur à une propriété CSS?
Prenont l'exemple du blanc, comme nous l'avons dit dans le précédent message, blanc peut s'ecrire de 4 manières :

#ffffff
#FFFFFF
#fff
white

Les deux premières notations sont les mêmes bien que l'on retrouve souvent l'écriture en majuscule.
La troisième est la notation la plus interressante, en effet, elle permet d'afficher la couleur blanc avec seulement 3 "f".

Petit rappel sur les couleurs ...

"Le système hexadécimal est un système de numération utilisant la base 16.Le nom hexadécimal provient du fait qu'il utilise les 10 premiers chiffres arabes (décimal, dix) puis les 6 premières lettres de l'alphabet latin (hexa, six) : 0 1 2 3 4 5 6 7 8 9 A B C D E F." wikipedia.org

En supprimant trois caractères au codage de la couleurs, on allége le poids de la feuille de style, le codage étant plus léger et on allége donc un site tout entier.

Pour terminer, l'ecriture en anglais des couleurs est trés attirantes mais reste limité...
Digg this

| Send by Email/Envoyer cet article par Email edit post

Les accents

Posted on 13:45, under , ,

Probléme souvent rencontré par les webmestre, le problème d'affichage des accents se resout trés facilement.
En effet dans la balise "head" on place le code suivant:

meta content="text/html; charset=utf-8" http-equiv="content-type"

Qu'est ce que cela signifie?

On cherche absolument à indiquer aux navigateurs le format des caractères (character encoding) présent sur le site.
Sans cette ligne le navigateur affichera des caractères étranges à la place de vos accents.
Le format est donc : Utf-8 (UTF-8 (UCS transformation format 8 bits) est un format de codage de caractères défini pour les caractères Unicode (UCS))

Pour des problèmes d'affichage qui persistent malgrè l'encodage en utf-8 laissez moi un commentaire, Merci.
Digg this

| Send by Email/Envoyer cet article par Email edit post

Le doctype

Posted on 13:28, under ,

Qu'est ce que le doctype?

Comme sous nom l'indique, de document (doc) et de type, le doctype sert à indiquer à quel type de document le navigateur a à faire.
C'est en fait la première chose à ecrire lors de la rédaction d'une page html.
Il se presente comme cela :

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" ->*


Pour tout vous avouer le doctype est nécessaire aux webmestres afin de faire valider son site par le w3c.
Autrement dit, si vous supprimer le doctype, l'affichage du site restera inchangé, certains navigateurs n'en tiennent meme pas compte.
Etant donné l'importance de celui ci je ne m'attarderai pas sur la description du role du doctype.

*Il manque les balises <>
Digg this

| Send by Email/Envoyer cet article par Email edit post