Archives de l'auteur gildas_p

Flexbox

novembre 16, 2021 1:55 pm Publié par gildas_p Commentaires fermés

Quelques liens et ressources sur les blocs Flex : Rappelez-vous la base : on applique flex et ses options sur le bloc parent, et ça agit sur ses enfants directs... Voir l'article

Ajuster des images et des images de fond

décembre 7, 2021 3:55 pm Publié par gildas_p Commentaires fermés

Voici une page de démo pour comprendre comment on peut ajuster une image (ou une image de fond) dans un format donné, sans la déformer. Parfait pour des images élastiques... Voir l'article

Firefox : Exécuter du code Javascript en local

septembre 10, 2020 2:55 pm Publié par gildas_p Commentaires fermés

Par défaut, les navigateurs actuels n’autorisent pas l’exécution de votre code Javascript en local (depuis votre disque dur), ou de façon limitée. Vous aurez par exemple un message d’erreur quand... Voir l'article

Petite synthèse
de choses vues en cours

octobre 6, 2022 7:28 pm Publié par gildas_p Commentaires fermés

En évolution… → ça se passe ici.

Progressive Web App

mars 7, 2022 12:26 pm Publié par gildas_p Commentaires fermés

Installez votre site web comme une app native sur mobiles et tablettes, pour bénéficier du plein écran, d’un contrôle de l’orientation, et d’une belle icône sur le bureau de votre... Voir l'article

favicon : les icônes de site web

mars 24, 2021 5:39 pm Publié par gildas_p Commentaires fermés

La « favicon« , c’est l’icône affichée dans l’onglet du navigateur, et dans les favoris. Il y a actuellement 2 formats possibles : le .ico à l’ancienne, et un autre format plus... Voir l'article

Contourner le cache du navigateur

janvier 22, 2022 5:41 pm Publié par gildas_p Commentaires fermés

Quand on travaille sur un site en ligne les navigateurs gardent en mémoire les images et certains scripts après la première visite (le css par ex). Si vous faites une... Voir l'article

Intégrer une typo à votre site

octobre 6, 2022 7:24 pm Publié par gildas_p Commentaires fermés

Pour que votre site affiche votre typo même sur un poste ou elle n’est pas installée, il faut l’embarquer dans votre site internet : on appelle ça une « webfont« . Pour... Voir l'article

Maptiler Desktop pour des cartes Leaflet non-géographiques

mars 25, 2022 12:31 pm Publié par gildas_p Commentaires fermés

MapTiler Desktop est un logiciel qui va vous permettre de transformer une grande image en tuiles, pour l’utiliser dans Leaflet. Tout est permis : dessin scanné, carte de jeu vidéo... Voir l'article

Leaflet basemaps : différentes cartes géographiques pour Leaflet

mars 22, 2022 10:04 pm Publié par gildas_p Commentaires fermés

Une page où visualiser différentes cartes gratuites utilisables avec leaflet.js, faire votre choix, et obtenir le code Javascript pour l’utiliser dans votre carte interactive. Ca se passe ici.

Leaflet.js – cartes interactives

février 23, 2021 4:25 pm Publié par gildas_p Commentaires fermés

Leaflet.js est une librairie Javascript de cartographie interactive. Leaflet propose toute une série de tutos officiels, ainsi qu’une documentation qui détaille toutes les fonctions et leur utilisation. Installation La page... Voir l'article

Fonctions Javascript utiles

mars 21, 2022 11:42 am Publié par gildas_p Commentaires fermés

Un petit fichier avec quelques fonctions Javascript utiles : random(min, max) un peu comme la fonction de p5jsrandom(min, max, true) permet d’obtenir un nombre entier randomColor() pour obtenir une couleur... Voir l'article

Ressources P5js

mars 7, 2022 12:30 pm Publié par gildas_p Commentaires fermés

Pour approfondir votre pratique de P5js, quelques liens utiles : Le site openprocessing.orgLes exemples de p5js.orgExemples pratiques et codes commentés

jquery simpleSlider

décembre 15, 2021 3:31 pm Publié par gildas_p Commentaires fermés

Une librairie simple à prendre en main pour afficher des sliders d’images (ou d’autre chose).Démo et téléchargement ici.

jQuery easyDrag

décembre 15, 2021 3:24 pm Publié par gildas_p Commentaires fermés

Une librairie compacte pour rendre n’importe quel élément de mise en page déplaçable à la souris, ou au doigt.Disponible ici, avec des explications.

HTML5 audio – video, et video en fond de page…

décembre 15, 2021 4:31 pm Publié par gildas_p Commentaires fermés

Pas vraiment un article ou un tuto, mais tout est là !Et ce n’est même pas compliqué (une fois qu’on a trouvé l’astuce)…

Récap. jQuery, guide complet

mars 1, 2021 5:10 pm Publié par gildas_p Commentaires fermés

jQuery est une librairie Javascript qui ajoute de nombreuses fonctionnalités pour manipuler le contenu d’une page web, et mettre en place une interactivité sur-mesure. jQuery est écrit en Javascript, on... Voir l'article

Petite synthèse HTML-CSS

octobre 15, 2021 5:09 pm Publié par gildas_p Commentaires fermés

Qui sera complétée par la suite… Sélecteurs CSS Pour cibler vos blocs HTML en CSS, vous avez à votre disposition plusieurs syntaxes : article {} sélection par type de balise... Voir l'article

Récap. CSS : placer, centrer, positionner, etc

décembre 10, 2020 8:23 pm Publié par gildas_p Commentaires fermés

Un pdf de 10 pages qui reprend tous les points importants vu en cours. (MAJ le 17/12/2020)

Un template de site web vierge

décembre 9, 2020 6:00 pm Publié par gildas_p Commentaires fermés

Un dossier de base pour démarrer vos projets web : arborescence des dossiers (js, css, img) index.html pré-rempli (balises pour le référencement, appels des scripts, etc) une feuille de style... Voir l'article

Positions CSS

octobre 19, 2020 5:40 pm Publié par gildas_p Commentaires fermés

position: static; par défaut, l’élément fait partie du flux normal de la page position: relative; le mode « triche », permet de déplacer un élmt par rappoort à sa place de départ... Voir l'article

Les sélecteurs CSS

octobre 19, 2020 5:24 pm Publié par gildas_p Commentaires fermés

Comme nous l’avons vu en cours, il y a 3 manières principales de cibler un élément en CSS : par type de balise ex : article {} va sélectionner toutes... Voir l'article

Connexion FTP au serveur web

octobre 22, 2021 2:17 pm Publié par gildas_p Commentaires fermés

Pour mettre en ligne vos exercices, il va falloir vous connecter au serveur web mis à votre disposition via une connexion FTP (File Transfer Protocol). Pour ça on utilise un... Voir l'article

Structure recommandée d’un site HTML5

octobre 19, 2020 4:50 pm Publié par gildas_p Commentaires fermés

Ces balises sont comme des <div>, avec des infos en plus à destination des moteurs de recherche.Si les robots comprennent mieux votre site, il sera mieux référencé !

Snippets pour SublimeText 3

septembre 29, 2020 9:27 am Publié par gildas_p Commentaires fermés

Sur pc, à dézipper dans c:/utilisateurs/xxx/appdata/roaming/sublime text 3/packages/user/perso/ (si le dossier appdata/ n’est pas accessible, il faut aller dans les options de l’explorateur windows, et afficher les dossiers cachés) Sur macOS:... Voir l'article

Personnaliser SublimeText 3 avec des « Packages »

septembre 25, 2020 2:56 pm Publié par gildas_p Commentaires fermés

Sublime Text intègre un utilitaire pour télécharger et installer des « packages » qui augmentent les capacités du logiciel. Il existe énormément de packages, développés par des utilisateurs pour toutes sortes de... Voir l'article

Couleur aléatoire en Javascript

décembre 8, 2015 12:43 pm Publié par gildas_p Commentaires fermés

Voici une petite fonction à utiliser où vous le souhaitez, pour remplacer une couleur du genre ‘#FFFFFF’ : function randColor(){ return '#'+(function(h){return new Array(7-h.length).join("0")+h})((Math.random()*(0xFFFFFF+1)<<0).toString(16)); } Il faut coller la fonction... Voir l'article

Prof Gildas P.

Ressources et articles à destination de mes étudiants en design graphique de l'Université Rennes 2