Bonjour
Pourquoi n'utiliseriez vous pas, si vous en avez besoin, les icones disponibles sur mon site ? Si un des éléments ci-dessous vous intéresse, cliquez-le simplement et sauvegardez-le sur votre machine. Ceux de ces éléments dont je suis l'auteur sont libres de droits. Les autres peuvent aussi être reproduits sur une page web, parfois dans des limites spécifiées par le détenteur des droits (en général mention de source, parfois lien vers le site d'origine et/ou limitation à une utilisation non commerciale). Pour plus de détail, suivre dans chaque cas le lien vers le site source.
Avertissement: Pour la manipulation des images GIF (animation, fonds transparents), j'utilise le shareware Gif Construction Set d'Alchemy Mindworks. C'est une version dûment enregistrée à mon nom qui, dès que je sauvegarde un fichier, lui ajoute une étiquette m'en attribuant la paternité au moins partielle. C'est dans certains cas plutôt abusif mais c'est indépendant de ma volonté. Si j'utilisais (illégalement) une version sans licence, il y aurait quand même une étiquette d'identité, mais elle sous-entendrait que le fichier a été pondu ou bidouillé par un pirate. Je rétablis ci-dessous, dans les cas où c'est nécessaire, le crédit dû à la vraie source.

Boutons lumineux
x x x x x x x x
Le rouge est remanié à partir d'une source publique sur Internet, les autres sont construits par mes soins en éditant les couleurs et en veillant à la transparence du fond.

Boutons linguistiques

eo en fr es pt ru ar
br cy ga gd eu gl ca oc co
fi no sv da nl de it el ja
Petits drapeaux (ou leur approximation possible en icone) pour faire des liens vers des versions d'une page web écrites dans d'autres langues (principalement européennes). À part la première, l'esperanto, créée spécialement pour les relations internationales, on trouve dans la rangée du haut des langues impériales de grande communication utilisées dans plusieurs pays, voire sur plusieurs continents, et/ou par des populations se comptant en centaines de millions d'individus. Le symbole utilisé est généralement le drapeau du pays dont la langue est originaire (celui de la Grande-Bretagne plutôt que celui des États-Unis ou de l'Australie par exemple). Pour l'arabe et le chinois (ce dernier à venir), le choix d'un pays représentatif est soit impossible, soit inacceptable dans une partie de la zone où la langue est employée. Ces langues sont donc simplement représentées par leur nom, dans leur propre écriture. La seconde rangée est consacrée à des langues minoritaires d'Europe occidentale, parlées par des peuples auxquels l'histoire n'a pas accordé d'institutions étatiques (ni parfois d'institutions du tout) et/ou par une partie seulement de la population de la région ou du pays concerné. Le drapeau de la République d'Irlande est utilisé pour symboliser l'irlandais (gaélique), en pratique (très) minoritaire dans son propre domaine, mais reconnu comme langue officielle par cet État. Dans les autres cas, les drapeaux sont ceux par lesquels les peuples concernés se font reconnaître, fût-ce officieusement. La troisième rangée est consacrée, avec les mêmes conventions que pour la première, à des langues nationales, dont la pratique est officielle et majoritaire dans un pays, et s'étend éventuellement à un ou deux pays voisins. Dans tous les cas, les langues sont identifiées par les noms des fichiers graphiques. Ceux-ci sont écrits langYY.gif, où YY est un code de deux caractères (minuscules) désignant la langue concernée selon la norme ISO 639. C'est ce même code qui doit être utilisé pour déclarer la langue d'une page HTML dans les balises META de l'en-tête, ou pour spécifier l'attribut lang. Dans certains cas, ces codes peuvent être en pratique les mêmes que les codes ISO 3136 servant à identifier les pays (fr à la fois pour la France et la langue française), mais ils peuvent aussi en différer (br pour le Brésil comme code de pays, pour le breton comme code de langue).

Icones de liens
x x x
Pour faire des liens vers des pages de liens.

Flèches Droite/Gauche (Suite/Retour)
x x x x x x x x x
x x x x x x x x x
Les deux premières (grises) sont prises telles quelles sur le site de Brest 96, la deuxième édition de la grande fête des vieux gréements. Je ne pense pas que cela constitue une grave infraction au droit d'auteur. Les autres ont été construites par mes soins comme pour les boutons lumineux.

Flèches Haut/Bas
x x x x x x x x x
x x x x x x x x x
Évidemment obtenues (par mes soins), par rotation des précédentes et correction appropriée des ombres. Il reste un léger défaut de centrage, que j'aurai peut-être le temps de corriger un de ces jours.

Boutons personnalisables
x x x x
x x x x
Ces fonds de boutons peuvent être complétés à votre guise avec le logiciel graphique de votre choix. Ils sont au format GIF et codés avec une palette de 16 couleurs. La première (indice 0) est transparente. Construire un élément en l'utilisant revient à creuser dans le bouton un trou qui laissera apparaître le fond de page. Sous logiciel graphique cette couleur sera visualisée comme presque blanche (FDFDFD). Les trois couleurs suivantes (indices 1 à 3) sont propres à chaque bouton et correspondent respectivement au bord à l'ombre, à la surface du bouton et au bord éclairé. En les modifiant, vous pouvez donc obtenir d'autres fonds de boutons. Le bord éclairé du bouton gris clair est presque blanc, mais son code (FEFEFE) diffère légèrement de celui de la couleur transparente pour éviter que les logiciels graphiques ne fusionnent les deux couleurs à l'occasion des modifications. Les autres couleurs, à utiliser pour ajouter des éléments, sont identiques pour tous les boutons. Les indices 4 à 11 correspondent à diverses couleurs de base, l'indice 12 à un vrai blanc (FFFFFF), 13 et 14 à deux nuances de gris, et 15 au noir.

Points typographiques
x x x x x x x x x x x x x x x
-Ce ne sont pas vraiment des points que je vous propose, mais des carrés. Typographiques parce que destinés à être intégrés dans du texte, soit en début de paragraphe (par exemple dans des listes), comme le montre le présent exemple, soit en fin de texte. Ce dernier emploi est assez fréquent dans l'édition pour marquer la fin d' un article ou d'un chapitre. Les carrés sont constitués d'une zone visible de 12 pixels sur 12 pixels, suivis à leur droite d'une zone invisible (fond transparent) de même taille. Les paramètres de taille réelle pour le code qui les appelle (balise <img...) sont donc width=24 height=12, et il est inutile de faire suivre ces points d'un espace : celui-ci est inclus dans le fichier graphique. En fin de texte en revanche, l'esthétique de la présentation peut demander que le carré soit précédé d'un espace. Il est préférable que ce dernier soit insécable (entité HTML &nbsp;) pour éviter que ce qui est en fait le point final se retrouve (tout seul) en début d'une ligne. La taille des points est calculée pour qu'ils s'intègrent à du texte composé avec une police de type Times et de taille "4". (code de définition <font face="Times" size=4>). Pour du texte de taille "3", comme c'est le cas ici, on peut réduire la taille de 25% (comme c'est également fait dans le présent exemple) avec width=18 height=9. Le point noir n'est pas plus petit que les autres. La bordure noire utilisée pour les autres couleurs est simplement remplacée dans ce cas par une bordure gris neutre, qui peut ne pas être visible sur le fond par défaut de la fenêtre de votre navigateur. Même chose pour la zone principale du carré gris.

Cale d'espacement universelle
imgnul
Vous ne voyez rien ici, sauf la bordure qui signale un lien (et qui est supprimée pour les autres icones). C'est normal, il s'agit d'une image invisible, en fait un GIF entièrement constitué de pixels transparents. Les dimensions réelles sont de 2 pixels sur 2 (et la taille du fichier est de moins de 100 octets), mais l'affichage est agrandi à l'aide des paramètres width et height. C'est comme cela que l'icone s'utilise, pour obtenir dans une page un espace vide de la taille que l'on souhaite. Un exemple est fourni par la page où sont énoncées les conditions de reproduction des photos de mon site, où la cale d'espacement est utilisée pour positionner la signature, en bas de la page. Cette signature occupe à elle seule un paragraphe aligné à droite (balise <p align="right">), mais pour éviter qu'elle soit complètement collée au bord droit de la page, le texte de la signature est immédiatement suivi d'un code qui le décale à gauche de 100 pixels et qui s'écrit :
<img src="./imgnul.gif" width=100 height=2 border=0 alt="">
Il n'est pas vraiment nécessaire d'inclure le paramètre border=0 pour maintenir invisible l'image, puisque celle-ci n'est pas utilisée pour un lien, mais c'est une précaution contre d'éventuels comportements atypiques de certains navigateurs. Ce sont d'ailleurs en partie les différences de comportement entre navigateurs qui justifient dans ce cas l'emploi de la cale d'espacement. Le même résultat pourrait en principe être obtenu en faisant suivre la signature d'une série d'espaces insécables (entité &nbsp;) mais certains navigateurs condensent en un seul espace ce genre de série. Dans le sens de la hauteur, l'emploi de la cale, ajustée à l'aide du paramètre height, permet un réglage plus précis des espaces que l'ajout de lignes vides (balise <br>).

Fonds d'écran
x x x x x x
Le premier était un fond gris au format GIF trouvé quelque part sur le Web. Il me semble que c'était dans la galerie de A1Clipart, mais je n'en suis pas sûr (ce site est de toute façon une excellente source de graphisme pour le web, et ses liens pointent vers les meilleures ressources). J'ai éclairci ce fond pour obtenir plutôt un blanc cassé, et je l'ai converti en JPEG pour qu'il prenne moins de place. J'en ai tiré les quatre suivants en modifiant la balance au profit de couleurs pastel. Pour le dernier de la rangée, plus récent, j'ai trouvé une nouvelle méthode permettant d'obtenir un fichier GIF à la couleur voulue, un peu plus léger que la version JPEG. Les autres fonds auraient pu être refaits de cette manière, mais cela aurait nécessité la réécriture de trop nombreux liens de fond de page sur ce site.

x
L'original de ce fond à bordure vient de chez Windy. J'ai d'abord dû le rallonger pour qu'à haute résolution le motif à l'ancre ne se répète pas au milieu de l'écran en le barrant d'une colonne gênante. Le fond lui-même était bleu clair uni. Je l'ai remplacé par le motif du fond bleu de la première ligne, dont j'avais préalablement ajusté la nuance de base au même bleu clair.

Divers


bouton bouton
bouton
bouton bouton
J'ai créé ces boutons pour symboliser, sur la page de référence à propos de mon site, certains sujets ou certains sentiments. Comme indiqué plus haut, ils sont donc libres de droits. Si vous les utilisez, j'apprécierais cependant que vous trouviez un moyen de mettre sur votre site un lien vers le mien.


Malbouffe J'avais mis ici une parodie, dont je suis l'auteur, du logo d'une multinationale de la malbouffe, pour servir à qui voulait, comme on voulait. Je l'ai retirée en attendant d'être sûr que le droit commercial ne rend pas ce genre de choses illégales. Mais la présence d'une case réservée pour un motif graphique auto-censuré par prudence est en elle-même significative. Et l'icone d'auto-censure peut servir.


Construction Cette création de Grenadine est disponible en version originale sur son site, La FONDerie/Web-Déco. J'ai réduit ici le nombre de couleurs de 256 à 16 pour prendre moins de place (3749 octets contre 8629). La transparence du fond s'en est trouvée détruite, et j'ai dû la rétablir.


NoSpam Redessiné par mes soins, d'après un élément de GIF animé créé par Cedge Design pour un site de campagne anti-spam qui n'est plus en ligne.


Interdiction Symbole créé par mes soins pour illustrer une page spéciale "Error 403 Forbidden". Cette page, accompagnée d'une interdiction d'accès (code réponse 403), s'affiche sur le présent site lorsqu'un filtre (dans le .htaccess ou un script PHP) détecte une requête illégitime : robot ne respectant pas les règles d'exclusion par exemple. L'icone peut bien entendu servir à illustrer tout autre message d'interdiction.


mail Je ne sais même plus où j'ai trouvé ça, tellement il y a d'icones de courrier sur le Web. Mais je l'ai réenregistré avec une meilleure compression, et le logiciel dit que c'est à moi (voir en haut de page).



à suivre... (quand j'aurai le temps)

Retour à la page d'accueil