Christophe, Mickael, Fabien, Thomas et Gerald vous ont préparé le Bookmark du développeur pour SmashingCoding.
Vous trouverez toute une série de ressource en Français et en Anglais pour vous aider a évoluer dans l’univers si vaste du développement.
Bonne Lecture!
L’iPhone a peine né est déjà un appareil retenant toutes les attentions, il est certain que nous risquons de devoir développer prochainement des versions dédiée de plusieurs de nos sites.
Aussi, je vous propose pour commencer la fonction javascript qui vous permettra de contrôler l’orientation de l’iPhone afin de pouvoir adapter parfaitement votre minisite.
évidemment, je n’ai pas encore testé.
CSS, quand tu nous tiens, voici encore 53 blogs au design très tendance pour trouver de l’inspiration pour vos créations.
1. Alex Buga
Ajouter automatiquement son logo sur les images volées
Une image volée c’est une image hébergée sur votre site et affichée sur un autre.
Sur le principe, je ne suis pas contre, tant qu’on rend à César ce qui appartient à César…
Mais la grande majorité des sites/forums/blogs qui affichent les images hébergées ailleurs ne prennent même pas la peine de préciser d’où elle provient. C’est rageant de perdre de la bande passante dans ces conditions.
Il y’a deux solutions à ce problème : interdire l’accès à vos images depuis d’autres sites ou signaler vous-même que cette image est hébergée chez vous en ajoutant un filigrane à l’image.
C’est de cette deuxième solution que je vais parler. Mais pour faire ça proprement, on va ajouter ce filigrane de façon automatique et uniquement en cas de vol d’image, de façon à ce que le filigrane ne s’affiche pas sur votre site.
Le watermark (filigrane), consiste à rajouter une image sur une autre. Elle va par exemple servir à signaler de quel site provient une image.
Il existe déjà des fonctions de gestion des images en PHP dont imagecopymerge qui permet de faire le collage rapidement mais qui gère très mal la transparence des fichiers PNG.
Pour faire un collage propre il va donc falloir le faire soit même. Voilà donc l’explication pas à pas.
L’air de rien, générer sa palette de couleur afin de préparer son template/CSS, c’est essentiel.
Une étape souvent oubliée. Ici, je vous propose une liste d’outil qui vous permettront de créer celle ci en s’inspirant d’une image:
BigHuge Labs Palette Generator
Qui a dit qu’il fallait se prendre la tête avec la librairie GD de PHP pour faire un graphique? Certes GD c’est bien mais c’est du code et du code pour obtenir quelque chose bien léché. On peut aussi utiliser des librairies toutes faites utilisant GD comme Artishow par exemple (ce qui donne, soit dit en passant, des trucs vraiment bien). Mais, il en faut bien un, ce genre de script est (ou peut être) lourd voir même très lourd en temps de traitement et en traitement à proprement parlé. En plus mais c’est très rare, certains hébergeurs ne proposent même pas GD.
Bref, il faut trouver quelque chose qui nous fait tout ça mais délocalisé. Et c’est là que mon ami Google intervient. Il va vous permettre de générer une image d’un graphique par une simple adresse, si c’est pas beau
Les designers et les intégrateurs seront tous d’accord avec moi : la typographie pour le web est un véritable casse-tête. Si l’on veut pauffiner un tant soit peu sa mise en page, on se retrouve très vite face a des choix cornéliens : soit on mise sur l’accessibilité, et dans ce cas, on se retrouve bloqué au panel très peu élargi de polices disponibles, soit on mise sur la qualité graphique, et l’on remplace l’ensemble de ses titres par des images.
Si la première solution n’a pour seul inconvénient de frustrer le graphiste, la deuxième va l’obliger, dans le cas d’un blog par exemple, de générer une multitude de titres, ce qui s’avère etre relativement chronophage. De plus, lorsque le site changera de look, quelqu’un devra se farcir la corvée de changer tout les titres, un par un.
Bien sur, il existe des solutions basées sur Flash, comme sIFR, mais cette dernière n’est pas vraiment un must en terme d’accessibilité, bien au contraire.
Or, il existe une solution simple, efficace, et accessible, pour remplacer dynamiquement du texte par des images. Cette solution, publiée par Stewart Rosenberger sur A List Apart, est basée sur deux outils que nous connaissons bien : PHP, couplé à la librairie graphique GD, et JavaScript.
Pour exemple, vous pouvez aller jetter un oeil sur mon blog ou sur la page de démo, ensuite, nous verrons comment mettre cette solution en place très facilement. (lire la suite…)
Si il y a bien quelque chose de difficile à trouver pour un webmaster, c’est les images libres qui correspondent exactement à ces besoins.
Voici une liste de 44 sites contenant divers types d’images libres. A vous de chercher maintenant
Coté design, le web2 c’est la grande mode les coins arrondis, quand on en connait la taille, c’est assez facile à réaliser, mais c’est plus compliqué si le contenu ou la taille de la fenêtre peuvent redimenssioner la zone.La technique de base consiste à imbriquer plusieurs éléments à la suite afin de pouvoir définir plusieurs images fonds avec des positionnements différents.
La boite est découpée en 9 zones :
SmashingCoding est un blog collaboratif rédigé par des web-développeurs
