Chez oim, forum libre

Débattre => Informatique, questions et interrogations, geek en devenir... => Discussion démarrée par: maximus23 le mardi 02 janvier 2018, 10:19

Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le mardi 02 janvier 2018, 10:19

Tu n'aurais pas vu passer une application indépendante pour la gestion des icomoon car devoir passer par le web pour faire ces choses cela me saoule...

:)
Titre: Où trouver des images vectorielles ?
Posté par: alex le mardi 02 janvier 2018, 10:31
On va dire pessimiste, alors. ;)

Icomoon ? C'est quoi ? :-[
C'est pas des icônes de la lune, hein ? :aa
Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le mardi 02 janvier 2018, 10:37
C'est des blogs d'images vectorielles en svg plus une police adaptée. Le tout est au format blog et est dissocié par un map css.

:)
Titre: Où trouver des images vectorielles ?
Posté par: alex le mardi 02 janvier 2018, 10:46
Ah d'accord !

Utilise plutôt blob. Si tu cherches avec blog, ça va pas le faire. ;)
Désolé, j'utilise très peu les images vectorielles. Les seules images vectorielles que tu trouveras ici, c'est les boutons sociaux. :iz:

Tu cherches des images précises ?
Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le mardi 02 janvier 2018, 11:08
Blob là cela ne me dit rien je vais regarder sauf si tu as un super lien :)

Je ne sais pas dans quelle section on peut parler de tout cela met cela hors des pieds pour ne pas polluer ce topic merci :)

Sinon c'est des images courantes en 16/32/64 que j'utilise un peut pour tout. A la place d'avoir trente images séparées tout est dans la même.

C'est quand même plus simple et plus économique pour les modes responsives.

:)
Titre: Où trouver des images vectorielles ?
Posté par: alex le mardi 02 janvier 2018, 11:32
Je ferai le ménage tout à l'heure, on verra bien quand j'aurai 5 minutes. :kf:
 ^-^

Tu as pensé à regarder sur Github ? C'est là que j'ai trouvé mes boutons sociaux. :)
Sinon, si c'est pour des icônes ou smileys, je ne sais pas trop où trouver ça.

Pour avoir des images gratuites du domaine public, tu as le site publicdomainvectors.org (https://publicdomainvectors.org) pour le vectoriel et publicdomainpictures.net (http://www.publicdomainpictures.net/?jazyk=FR) pour les photos et jolies images.
Tu peux aussi fouiller dans le site publicdomainarchive.com (http://publicdomainarchive.com/).

Les 2 derniers sites devraient plaire à Songe aussi, surtout le dernier. :)
Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le mardi 02 janvier 2018, 11:45
Sinon voilà ce que j'utilise tu comprendras mieux mais je voudrais cela en standalone et non plus en ligne : https://icomoon.io/

:)
Titre: Où trouver des images vectorielles ?
Posté par: alex le mardi 02 janvier 2018, 11:57
Ah oui, d'accord.
Dans ce cas, si c'est pour des icônes de ce type, tu as le très célèbre Font Awesome (http://fontawesome.io/). C'est des fonts et du CSS.
Dans le même gout, tu as le tout aussi célèbre Glyphicons (https://glyphicons.bootstrapcheatsheets.com/) qui est livré avec Bootstrap. Là, c'est du CSS et du JS. Ca permet de faire du vectoriel en JavaScript.

Je l'utilise à dose médicinale ici, mais c'est très riche et bien foutu !
Titre: Où trouver des images vectorielles ?
Posté par: alex le mercredi 03 janvier 2018, 12:51
Voilà, le ménage est fait.
Ton topic à bidules vectoriels est placé ici, Alain. :)

Tu as trouvé ton bonheur du coup ? :??
Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le mercredi 03 janvier 2018, 17:32
Non pas encore ce que je veux.

Il me faudrait un logiciel de traitement pour les fichiers vectoriels et pour avoir les liens mappés directement.

Je ne trouve rien de probant pour le moment. Je ne veux pas de cloud et compagnie je veux un truc portable et efficace.

:)
Titre: Où trouver des images vectorielles ?
Posté par: alex le mercredi 03 janvier 2018, 17:50
Ah tu veux le logiciel qui te crée le SVG, le CSS et la map qui va avec ?
Du coup, tu veux un outil qui sorte ça, par exemple :
Code: html
<div class="resp-sharing-button resp-sharing-button--facebook resp-sharing-button--medium">
    <div aria-hidden="true" class="resp-sharing-button__icon resp-sharing-button__icon--solid">
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
            <path d="M18.77 7.46H14.5v-1.9c0-.9.6-1.1 1-1.1h3V.5h-4.33C10.24.5 9.5 3.44 9.5 5.32v2.15h-3v4h3v12h5v-12h3.85l.42-4z">
            </path>
        </svg>
    </div>Facebook
</div>

Je vais chercher de mon côté et je te dis. ;)
Tu as regardé sur Github ? Et Stackoverflow (https://stackoverflow.com) ?

Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le mercredi 03 janvier 2018, 18:58
Bonsoir,

C'est dans le genre mais pas encore avec la même structure.

Pas grave si il faut je vais refaire une intégrale avec icomoon mais bon tout ces softs avec des abonnements par cloud cela me saoule...

:)
Titre: Où trouver des images vectorielles ?
Posté par: alex le mercredi 03 janvier 2018, 19:25
Le bout de code que j'ai donné, c'est le principe du vectoriel. Après, si tu veux ça à la virgule près, ça va être difficile.

Tu payes des abonnements pour avoir des trucs que tu ne trouves même pas ?! :o
Dis toi bien que les images proposées par tes machins payants ont été trouvées sur le net. Ca m'étonnerait que les mecs créent 100% de leur contenu.

Je t'ai dit, je chercherai et je te dirai. Mais faut pas non plus faire une fixation sur le vectoriel, hein ?
C'est pratique, d'accord, mais ça ne remplace pas tout. Les images PNG, JPG, GIF, WEBP, etc. ont encore de beaux jours devant elles ! ;)
Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le jeudi 04 janvier 2018, 11:59
Bonjour,

Ok mais cela ne les remplace pas en dessin d'architecture ou le scale peut-être infini à partir d'un glypg au multiple de 16. Là c'est comme si on avait une police de caractère en image et de plus il y a des programmes qui récupère les dessins et les transposes en vectoriel avec les couleurs et tout le bazar et il n'y a pas photo.

Donc j'ai refait la plupart des glyph avec icomoon que je connais bien mais il faut importer et exporter sans arrêt et après si tu fais un truc qui ne colle pas il faut tout reprendre sinon il faut s'abonner.

:)
Titre: Où trouver des images vectorielles ?
Posté par: alex le jeudi 04 janvier 2018, 12:09
Le vectoriel, c'est trop prise de tête. Je ne suis pas prêt de tout passer en vectoriel ici.

A chaque fois il faut sortir du CSS, mapper le truc en HTML, ça fait 3 millions de lignes de code pour une bête image.
C'est un coup à choper un mal de tête du tonnerre de dieu.
En plus, quand tu relis ton code, si tout est en vectoriel, tu ne sais plus quelle image est quoi. :kl:
Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le jeudi 04 janvier 2018, 12:22
Tu n'as rien à mapper en html tu fais cela par classe c'est beaucoup plus simple et de plus tu as l'index qui correspond au vectoriel donc l'image et le code donc pas le moindre soucis.

C'est comme ci tu utilisais des images png avec un map de position pour les images comme smf le fait par exemples ce qui est un standard maintenant dans la version 2.1 on a plus des images séparées c'est une image en mode map et le tout par classe et ccs également.

:)
Titre: Où trouver des images vectorielles ?
Posté par: alex le jeudi 04 janvier 2018, 12:31
Les sprites CSS, c'est différent. Mais ça c'est bien par contre.
Tu télécharges toutes tes images en une seule requête et elles sont découpées en CSS. Ca j'aime bien. :if:

Sinon, le vectoriel, moi ça me prend le choux. C'est pratique, d'accord, mais qu'est-ce que c'est chiant ! O0
Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le jeudi 04 janvier 2018, 13:14
Tu connais des jeux de sprites du domaine public qui sont déjà mappés avec le css  ^-^  ^-^ ?
Titre: Où trouver des images vectorielles ?
Posté par: alex le jeudi 04 janvier 2018, 13:36
C'est une bonne question, ça, merci de l'avoir posée. :D

J'ai jamais regardé. C'est vrai que ça pourrait être intéressant, parce-que les sprites CSS, c'est la grosse prise de tête pour créer ça.
Heureusement qu'il existe des outils pour faire ça. J'en connais un qui marche très bien : https://spritegen.website-performance.org/ (https://spritegen.website-performance.org/)

Avec ça, pas besoin de chercher des trucs tous prêts. Tu places tes images et tu récupères le code. :if:
C'est d'ailleurs une de mes bonnes résolutions 2018. En utilisant des sprites CSS ici, ça fera économiser 17 requêtes par page ! :jw:
Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le jeudi 04 janvier 2018, 13:40
Celui là je ne le connais pas j'utilise Compass SASS en ligne de commande :)

Je vais regarder cela pour voir si c'est plus simple :)

 :if:

Edit zut c'est en ligne pff... décidément....
Titre: Où trouver des images vectorielles ?
Posté par: alex le jeudi 04 janvier 2018, 13:44
Regarde, tu vas voir, c'est hyper simple.
Tu glisses tes images et tu récupères la grosse image + son CSS. Ou alors tu peux tout mettre dans le CSS, même l'image de départ.

Si tu veux, j'ai le projet Github dans un coin, il faut que je le retrouve. Comme ça, tu l'aurais en local.
Sinon, copie le site. :gj:
Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le jeudi 04 janvier 2018, 13:49
Oui en local ce serait pas mal :)

Copier le site lol ?

:)
Titre: Où trouver des images vectorielles ?
Posté par: alex le jeudi 04 janvier 2018, 13:56
Copier le site lol ?

Ben oui, c'est juste une page. Tout est fait avec du JS. :iq:
Bon, c'est pas très poli, mais au moins après tu as la page en local.

La dernière fois que je l'ai fait, c'était une page pour tester des REGEX. Maintenant, je l'ai en local, je suis tranquille. :)
Mais je suis un vilain, c'est pas bien. :je:


EDIT
J'ai retrouvé le projet Github, tu vas pouvoir l'installer en local ! :gq:
https://draeton.github.io/stitches/ (https://draeton.github.io/stitches/) :)


RE-EDIT
C'est la page du truc en ligne que je t'ai donné. :je:
Voilà le projet Github : https://github.com/draeton/stitches (https://github.com/draeton/stitches)
Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le jeudi 04 janvier 2018, 14:08
Ok merci je vais tester :)

Titre: Où trouver des images vectorielles ?
Posté par: alex le jeudi 04 janvier 2018, 14:21
Je viens juste de le mettre dans mes dossiers Apache.
Ca marche bien. :)

Quand tu as dézippé le truc, il faut dans /stitches*/src/index.html
J'ai mis un "*" parce-que je ne sais pas quelle version tu vas charger, ou même peut-être directement le projet master.
Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le jeudi 04 janvier 2018, 15:59
J'ai pris les deux pour voir si il y a une différence :)

Cela à l'air de fonctionner.

Merci :)
Titre: Où trouver des images vectorielles ?
Posté par: alex le jeudi 04 janvier 2018, 16:04
De mon côté, je me suis décidé aussi, ça y est. Je passe les images en sprites CSS.
J'ai déjà fait la barre de boutons sociaux et les images des news.

Ca fait déjà économiser 7 requêtes par page ! :)
Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le jeudi 04 janvier 2018, 16:18
Oui enfin moi je trouve cela plus pratique que ce soit en sprites ou vectoriels et cela va aussi vite à mettre en place.

Ici le codage est quasi identique au vectoriel à part les déclarations de librairies.

:)
Titre: Où trouver des images vectorielles ?
Posté par: alex le jeudi 04 janvier 2018, 16:25
Ah non, le sprite CSS est beaucoup plus simple à mettre en place.
C'est juste une image et du CSS.

Si il fallait passer les images en vectoriel, je me serais abstenu ! :kd:
Titre: Où trouver des images vectorielles ?
Posté par: alex le jeudi 04 janvier 2018, 17:26
Mine de rien, il marche bien ce petit script. Très efficace ! :if:
Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le jeudi 04 janvier 2018, 17:35
Indique qu'il faut faire un F5 de cache sinon il va y avoir des surprises :)

En plus on ne saura plus piquer tes images :)
Titre: Où trouver des images vectorielles ?
Posté par: alex le vendredi 05 janvier 2018, 10:37
Pour ne pas forcer les gens à vider leur cache, j'ai une soluce.
Il suffit de mettre v suivi d'un chiffre dans le nom du fichier.
Exemple : https://static.chez-oim.org/Images/banniere2.v1.png (https://static.chez-oim.org/Images/banniere2.v1.png)

Si le fichier est modifié, j'ai juste à passer de v1 à v2.
Comme ça, ça m'évite d'emmerder le monde avec mes demandes de vidage de cache. Si le nom du fichier change, il est rechargé. ;)


Le coup du hotlinking, j'y ai déjà pensé, t'inquiète pas. ^-^
Quand j'aurai le temps, je remettrai public les tutos grepolis mais avec des images dans des sprites CSS.
Comme ça, y a que les geeks qui sauront comment faire pour me piquer les images, et ce sera pas en hotlink. :gb:
Titre: Où trouver des images vectorielles ?
Posté par: alex le vendredi 05 janvier 2018, 17:22
Pour ceux qui s'intéressent aux images de leur site, il existe un outil en ligne qui analyse la page que vous lui donnez et vous donne plein de renseignements utiles sur vos images et des images optimisées en prime ! :gq:

Voilà ce site : https://webspeedtest.cloudinary.com/ (https://webspeedtest.cloudinary.com/)
Titre: Où trouver des images vectorielles ?
Posté par: maximus23 le vendredi 05 janvier 2018, 19:08
Bonsoir,

Moi j'ai du faire mon F5 chaque fois sinon je me retrouvais avec ton logo à la place des enveloppes  :gh: ^-^

Mais bon rien de bien grave.

Pour les images c'est vrai qu'il faudrait repenser le tout car avec le https on a quelques soucis avec les images et en plus pour trouver un outil optimal d'optimisation suivant les formats c'est pas toujours évident surtout si on veut des palettes de couleur et graphique de haut niveau.

:)
Titre: Où trouver des images vectorielles ?
Posté par: alex le vendredi 05 janvier 2018, 19:30
C'est parce-que tu es passé quand je bricolais que tu as été emmerdé.
A chaque fois, je me rendais compte que j'oubliais une image et ça modifiait tout.
Sinon, quand j'ai eu terminé, j'ai nommé correctement les fichiers et il n'y avait pas besoin de vider le cache. Les fichiers quasi définitifs étaient chargés automatiquement.
Tu as du le remarquer, personne ne m'a dit que les images déconnaient. Parce-que si tu rates l'image des sprites, tu n'as plus une seule image sur la page d'accueil à part la bannière ! ;)

Bon ! Il me reste les sections et les posts à faire. Je vais faire ça tranquille ce week-end. Je devrais trouver 5 minutes. :aa
Maintenant que je suis sur la lancée, ça devrait le faire. C'est comme les microdata, ça me faisait chier, mais dès que je m'y suis collé, j'ai pas arrêté jusqu'à la fin.

Sinon, pour optimiser les images, je passe toujours par optipng et jpegtran. Si je trouve un site comme je t'ai donné, je regarde mais je fais attention.
Optimiser c'est bien, mais il ne faut pas dégrader la qualité de l'image ! Ca, c'est pas négociable. Certains sites te disent qu'ils divisent par 3 le poids des images, mais le résultat est dégueulasse !


Pour les images c'est vrai qu'il faudrait repenser le tout car avec le https on a quelques soucis avec les images

Comment tu fais pour être emmerdé avec les images et le HTTPS ? C'est quoi le souci ? :-\

Si tu veux que les navigateurs bloquent tout ce qui n'est pas HTTPS et affichent toujours un joli cadenas, il suffit de créer un hearder Content-Security-Policy comme ceci dans ton index.php :
Code: php
header("Content-Security-Policy: default-src https:; script-src https: 'unsafe-inline' 'unsafe-eval'; style-src https: 'unsafe-inline'");

Comme ça, le proxy n'est pas utilisé et c'est tant mieux !