logo

Générateurs de boutons

Générateurs de boutons

genarateur de boutonsExcusez cette mauvaise blague (voir image) : en écrivant le titre je n’ai pu m’empêcher de penser à Biactol … Cela dit ce qui suit n’a rien à voir avec des problèmes de peau.

Il s’agit de trois outils très pratiques qui permettent de gagner du temps et de faire des beaux boutons CSS sans images … rien que du code ! dégradés, arrondis, effet de profondeur, ombres … et plus encore.

CSS button generator, Button Maker et CSS3buttongenerator … J’aime bien les trois !

Générateur de QrCode complet

J’ai longtemps cherché à trouver un générateur de QrCode qui pourrait proposer la création d’un QrCode pour les cartes de visites (vCard ou MeCard). Ce que j’avais trouvé jusqu’à présent n’étaient pas assez complet à mon goût. En Voici un qui propose tout ce dont vous pourrez avoir besoin : Texte, Email, Téléphone, Url, vCard, MeCard, SMS, La géolocalisation, Favoris, et même l’envoi de code WIFI.

Le générateur de QrCode d’emandarine

Generateur de Gradient CSS

CSS3 Gradient Generator

Encore un petit outil bien pratique pour les designer web. Un générateur de code CSS pour réaliser des effets radiants sur les boutons ou sur n’importe quel objet de votre CSS.

Ultimate CSS Gradient Generator : Très efficace et complet. Il nous vient de Colorzilla et permet l’ajout de plusieurs couleurs. Il fonctionne sur tout les navigateurs. Produit de grosses lignes de code cependant.

 

 

CSS3 Gradient GeneratorCSS3 Gradient Generator : Très efficace également et quand même plus simple (moins complet quand même) que le précédent.

 

(suite…)

3 Générateurs de nuage de tags

Nous ne reviendrons pas sur l’intérêt ou non d’un nuage de tag sur votre site. Cependant nous nous attarderons un peu sur son esthétique. Car, avouons le, la plupart du temps le nuage de tag est moche ! S’il est acceptable sur un blog, il l’est moins sur un site d’entreprise, parce qu’il prend de la place est n’est pas forcément cohérent en terme marketing. Personnelement, je m’en passe très bien ! d’autant qu’il ne garanti absolument rien en terme de référencement ! Cela dit, il y est des fois, où il est peut être utile de le mettre… quand on vous le demande ! Dans ce cas :

(suite…)

Générateur de « loader »

loaderUn outil pour faire des « loader », vous savez ces petit gif qui tourne pour vous indiquer que votre page est en train de se charger. Si vous avez eu un jour l’occasion de le faire vous même, vous devez savoir combien c’est fastidieux. Heureusement il existe des générateurs très efficaces et complètement paramétrables.

loadinfo.net

Générateurs de Qr code


qrcode emandarineLe Quick reponse code est une sorte de super code barre en 2 dimensions. Alors que le code barre ne stocke que 13 chiffres au maximum, le Qr code peut en stocker plus de 7000 caractères,  soit presque 3000 octets. Créé en 1994 par une société japonaise, vous ne l’avez peut être pas encore remarqué mais il commence à s’afficher un peu partout autour de vous (revues, annuaires, publicité … ).

L’achat récent d’un HTC/Google « Nexus one » m’a permis de tester les performances des Qr codes (tags ou flashcode). Bien qu’encore destiné au détenteurs experts d’un smartphone, le Qr code est un outils prometteur en terme de webmarketing.

Plus besoin de chercher et de noter les informations (adresse mail et physique, nom et informations complémentaires, offres d’emploi …), une photo avec votre smartphone  une application idoine, une connexion internet et le tour est joué : l’ information est déjà sur votre écran.

qrPour les créer et les insérer sur votre site, vos prospectus ou votre carte de visite, il n’y a rien de plus simple :

Nous en reparlerons sur emandarine.

Générateur de radius

Générateur d'ombrage via box-shadow en CSS3

Un outil pratique qui manquait à tous les générateurs que l’on trouve sur ce site. Le générateur de radius compatible sur « presque » tous les navigateurs.

border radius generator Pratique, rapide et simple

Générateur d'ombrage via box-shadow en CSS3Tout aussi pratique, il permet en plus d’ajouter un effet ombré. 

dessiner un code barre

codebarre.jpg

Voici un petit tutoriel fait par mes soins. Ce didacticiel Photoshop s’adresse aux débutants et permet de faire en quelques clics un code barre.

Rien de bien difficile, mais la méthode peut paraitre assez inattendue dans le sens où cela ne consiste pas à coller des barres les unes derrière les autres.

L’exercice est plus intéressant que le résultat, si vous cherchez à obtenir un code barre très réaliste et même fonctionnel, je vous conseille ce logiciel gratuit: code barre generator, qui vous permet d’exporter au format image votre résultat sur 13 chiffres.

Générateur de Sprites

website_performance.gifNon, cela n’a rien à voir avec la boisson gazeuse. Le générateur de Sprites (Petit objet graphique) CSS permet de gagner du poids sur votre feuille de style.  Grâce à cet outil vous n’aurez qu’une image à télécharger pour votre site. Le générateur de Sprites s’occupe de vos images pour n’en faire qu’une seule  au format PNG. Une au lieux de plusieurs, ce qui rend plus rapide la lecture de votre page et cela sur n’importe quel navigateur. L’autre avantage : les images de vos boutons, par exemple, n’attendent pas que vous passiez votre curseur dessus pour se télécharger.

Bien que l’outil soit capable de vous donner tous les éléments nécessaires pour l’intégration des informations sur votre feuille de style, cela peut paraitre un peu complexe. Sur votre CSS cela donne quelque chose comme ça



Cette technologie est utilisée par Yahoo.

Générateur de balises meta

meta generator_1.jpg Les balises <meta>, vous le savez certainement, sont très importantes en matière de référencement naturel. Certains CMS proposent des outils pour les remplir à partir du back office. D’autres non ! alors j’ai construit un petit outil PHP et javascript pour faciliter cette « fastidieuse tâche » qui consiste à écrire entre les guillemets, sans se tromper tout en faisant attention aux accents.

Je le mets à disposition de ceux qui en auront besoin. Ce n’est pour le moment qu’une version Beta qui fonctionne très bien sur tous les navigateurs récents, mais qui pourrait être complétée, ne serait-ce que pour les infos-bulles explicatives.

L’outil Meta Generator a été fait pour faciliter ce petit travail : Les accents sont HTMLisés et il ne reste qu’à écrire les mots clés dans les champs, pour que l’outil génère des <meta> prêtes à être mises entre les balises <head>.

Domain Name Generator

namegenearator.jpgPour ceux qui ont vraiment du mal à commencer sur internet, voici un petit outil qui leur permettra de les aider a choisir leur nom de domaine parmi l’existant disponible. Bien sûr on pourrait penser qu’il faille être franchement peu inspiré, mais pourquoi pas !

L’outil a l’avantage de proposer des noms de domaine courts (moins de 6 lettres en moyenne). L’inconvénient, c’est que ces noms de domaine n’évoquent rien !

Quelques petits exemples : efcel, gibmyn, metll, nutrop …

Bon courage !

Effect générator

Pour diverses raisons vous n’avez pas Flash chez vous et pourtant vous aimeriez bien pouvoir placer sur votre site un petit slide show de vos photos favorites ou une petite animation sympathique pour égayer votre blog.

fx.jpgEffect generator et un outil gratuit de type Web2. En quelques clics vous aurez vite compris : l’outil est ergonomique et intuitif. Les constructeurs du site ont ajouté deux petits tutoriels vidéo (en anglais) qui vous aideront dans vos premiers pas.

Voici un petit exemple de ce que j’ai fait, en quelques minutes, à partir de mes photos.



Lorem Ipsum

lorem ipsum_1.gifUn générateur de texte bien sympathique et pratique, en français et en « simili-latin ». Ce site vous permettra de générer du texte « lorem Ipsum » pour la construction de vos maquettes de site web, adapter vos polices à votre style. Ce générateur vous permet de choisir le nombre de chapitres, de choisir le nombre de mots et de mettre tout cela en majuscules ou non.

Pour la petite histoire, le texte latin « Lorem Ipsum », utilisé depuis le XVIème siecle par les rédacteurs pour présenter un aspect final de leur travail, n’a pas de valeur sémantique. Il s’inspire de l’œuvre de Cicéron.  Ce texte et les mots qui le composent ont été tant manipulés qu’un latiniste aurait du mal à en comprendre le sens : « Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit… » soit  « Il n’existe personne qui aime la souffrance pour elle-même, ni qui la recherche ni qui la veuille pour ce qu’elle est… « 

Source : Wikipedia

Keyword Generator

KGen est une extension du navigateur firefox utile au référencement des sites web. Elle permet de visualiser et d’évaluer le poids des mots clés importants ou récurrents dans un site.

emandarine_copieminiature.jpgPourquoi faire ?

  • pour écrire des articles qui seront mieux référencés par les moteurs de recherche
  • pour étudier le contenu des sites concurrents
  • pour améliorer le contenu de vos propres pages

Il est possible de trier les mots clés selon leur taille, leur poids, par répétition, par ordre alphabétique.
On peut aussi créer une liste de mots à ignorer.

Vous pouvez visiter le site de l’auteur pour en savoir plus.

Découvert sur Blog URFIST