blog alpha design joomla

Le blog d' Alpha Design Joomla et autres ...

Comment rendre votre site internet conforme au RGPD ?

Le RGPD késako ?

Le RGPD, c'est à dire le Règlement Général sur la Protection des Données est entré en application Le 25 mai 2018 le règlement européen est entré en application. De nombreuses formalités auprès de la CNIL disparaissent. En contrepartie, la responsabilité des organismes est renforcée. Ils doivent désormais assurer une protection optimale des données à chaque instant et être en mesure de la démontrer en documentant leur conformité par exemple. Plus d'informations ici : https://www.cnil.fr/fr/principes-cles/rgpd-se-preparer-en-6-etapes

La politique de confidentialité de votre site

Il vous faut créer sur votre site une page "politique de confidentialité", pour ce faire consultez ce modèle gratuit de politique de confidentialité : https://help.kooneo.com/article/433-politique-confidentialite-modele-gratuit-telecharger, et adaptez le à vos besoins spécifiques.

Modification du Formulaire de contact Joomla

Pour être conforme aux demandes du RGPD le formulaire de contact de base de Joomla doit être modifié, pour ce faire consultez le tutoriel : Comment rendre le formulaire de contact de Joomla conforme au RGPD ?

4.5 1 1 1 1 1 1 1 1 1 1 Notez cet article 4.50 (1 Vote)

Comment Insérer du contenu à votre site en utilisant du CSS ?

les sélecteurs css pour customiser le design de votre siteSaviez-vous que vous pouvez ajouter du contenu à votre site en utilisant du CSS ? 

Cela peut paraître fou mais c'est la vérité. Je vais vous montrer commenta ajouter du texte à un site internet en utilisant la propriété CSS content. Nous allons aussi utiliser les pseudos-éléments :before et :after

1ère étape. Le code HTML

Pour cet exemple, je vais utiliser le code HTML ci-dessous: 

<div class="content">
    <h2>Texte inséré en HTML (de façon habituelle)</h2>
</div>

Le sélecteur que l'on va utiliser est la class content, plus les pseudos-éléments :before and :after .

En savoir +

Comment cibler des éléments avec des attributs en CSS ?

Sélecteur CSS pour définir le design de votre site.Lorsque l'on travail avec du css, les designers cible généralement les éléments à partir de leur id ou de leur class . Toutefois vous pouvez cibler des éléments en n'utilisant pas ces deux attributs.

Il y a beaucoup  d'exemples ou l'on peut souhaiter cibler un élément tout en évitant d' utiliser ces deux sélecteurs les plus courant . 

Dans cet article nous allons vous montrer comment cibler des éléments avec du CSS et des attributs 2 exemples qui vont plus loin que les id et class. 

Cibler un élément avec un attribut et sa valeur exacte 

Dans notre premier exemple, nous souhaitions cibler ce champ  avec du CSS :

<input type="text" name="myfield">

Nous pouvons utiliser l' attribut  type  comme sélecteur. Le CSS ressemble à ceci  :

input[type="text"] {
 /* Votre CSS personnalisé à insérer */
}

Nous pouvons aussi utiliser l 'attribut  name comme sélecteur. La clé est de mettre l'attribut et sa valeur exacte entre les crochets à coté du tag name :

input[name="myfield"] {
 /* Votre CSS personnalisé à insérer */
}

En savoir +

Comment utiliser des images en background avec du CSS ?

Si vous êtes un nouveau Web Designer, l'une des compétences que vous devez maîtriser  est l'utilisation d’images en background (arrière plan).

Votre design peut nécessiter de remplir complémentent un container CSS avec une image, mais parfois l’image que vous souhaitez intégrer ne remplit que de façon partielle ce container.

Dans ce tutoriel, vous découvrirez 3 exemples d'utilisation, du tag  CSS  background-size  

En savoir +

Comment ajouter des videos Youtube & Vimeo responsives à n'importe quel site ?

Youtube, Vimeo et d'autres hébergeurs vidéos permettent d'intégrer facilement leur lecteurs dans votre site internet.

Toutefois, Youtube, Vimeo et autres ne fournissent pas de vidéos responsives par défaut.

Dans ce court tutoriel nous allons voire comment en utilisant quelques lignes de CSS l'on peut  rendre responsives des videos de Youtube, Vimeo ou autres.

 1. Obtenir le code d'insertion Youtube

  • Rendez-vous sur Youtube
  • Trouvez la vidéo que vous souhaitez  insérer dans votre site
  • Cliquez sur Partager > Intégrer, faites un click droit et copiez le code HTML

responsives videos

En savoir +

Comment créez une Google Maps responsive pour n'importe quel site ?

Les Google Maps sont très faciles à inclure dans un site.

Malheureusement, par défaut, elles ne sont pas responsives. 

Dans ce court tutoriel, je vais vous montrer comment rendre votre Google Map responsive, en utilisant seulement quelques lignes CSS. Cette technique fonctionne avec Joomla, WordPresse, Drupal ou n'importe quelle autre plateforme.  

1. Obtenir le code d'insertion de Google Maps

  • Rendez-vous sur Google Maps
  • Faites un recherche pour trouver la zone de Google Maps que vous souhaitez inclure dans votre site
  • Cliquez sur le lien Partager 

 google maps responsive 1

  1. Cliquez sur Intégrer la carte
  2. Sélectionnez le code Iframe
  3. Faites un click droit et copier le code d'insertion 

En savoir +

Comment créer des colonnes avec column-count en CSS ?

Largeur de colonnes en utilisant column-count

Valentin Garcia est l'auteur de l’article How to Create Columns with column-count in CSS dont la traduction est autorisée par ostraining.com.

Dans un tutoriel précédent, nous avons expliqué qu'il peut être dangereux d'utiliser des largeurs (width) en HTML pour définir la mise en page.

Heureusement, le CSS est suffisamment  puissant pour  imiter des balises HTML désuètes. Par exemple, vous pouvez créer des colonnes en CSS en utilisant la propriété column-count. Ce peut être très utile pour les mises en page d'un site, mais aussi pour diviser des longs textes  en colonnes.

Dans ce tutoriel nous allons voir comment créer des colonnes avec column-count.

En savoir +

Comment savoir si votre site est conforme aux exigences de la loi française ?

Rendez-vous sur http://www.legiscope.com/, saisissez l' adresse de votre site, puis votre adresse mail afin de pouvoir recevoir le rapport d'audit.

Le robot Legiscope qui parcourra votre site est, ce jour,  en version Béta ce qui peut générer quelques imprécisions ou erreur dans leur rapport.

Toutefois l'intérêt de leur audit est de produire un sommaire intelligible des améliorations que vous devez apporter à votre site pour être en pleine conformité avec la loi française afin de vous prémunir d'éventuelles sanctions pénales et/ou financières.

En savoir +

Les 10 meilleurs astuces pour améliorer la vitesse de chargement de votre site Joomla

Cet article nous décrit les 10 meilleurs astuces pour améliorer la vitesse de téléchargement de votre site :

  1. Choisissez un bon hébergeur
  2. Cache de Joomla!
  3. G-Zip
  4. Supprimez les extensions inutiles
  5. Cache du navigateur dans le .htaccess
  6. Optimisez vos images
  7. Utilisez un CDN
  8. Optimisez le CSS + Javascript
  9. Extensions pour l'optimisation de la vitesse
  10. Optimisation pour mobile

En savoir +

Multisites : une mauvaise idée pour la majorité des sites

Dans cet article Ostraining nous dévoile pourquoi le "Multisites", c'est à dire l'administration de plusieurs sites à partir d'une seule installation d'un CMS, est en général un mauvaise idée pour la plus part des sites.

Consultez cet article (en anglais) : http://www.ostraining.com/blog/general/multisites-bad-idea/

5 1 1 1 1 1 1 1 1 1 1 Notez cet article 5.00 (1 Vote)

Comment créer votre propre favicon et remplacer celui de Joomla ?

remplacer le favicon joomlaLe favicon est la petite icône de 16×16 pixels située devant l’URL du site dans la barre d’adresse ou devant les noms de page des onglets selon votre navigateur.

Par défaut, après une installation Joomla, le favicon que vous apercevez est celui de Joomla, il vous faut donc créer un favicon à votre image.

Des outils gratuits, sont disponibles sur le Web, pour vous aider à créer votre propre favicon

En savoir +

La Way Back Machine : ou comment vos sites se font archivés au fil du temps, & restent toujours consultables par les internautes...

logo way back machineLa Way Back Machine, ou Internet Archive, archive non seulement tous les sites web, mais en conserve aussi leurs différentes versions au cours du temps.

Ce jour elle a archivée plus de 368 milliards de pages web.

En la consultant vous pouvez par exemple, pour votre propre site, retrouver l'évolution de son design, ou de son contenu, au fil des années.

Testez la : http://archive.org/web/

Comment indiquer à la Way Back Machine de ne pas archiver mon site mais aussi de le "désarchiver" ?

En savoir +

Optimiser ses images pour améliorer la vitesse de téléchargement de son site

Optimiser le poids de vos images peut améliorer considérablement le temps de téléchargement de votre site.

Ce tutoriel couvre les point suivants :

  • Quel format d'image pour quelle utilisation ?
  • Quel format d'image à utiliser pour les JPG, baseline ou progressive ?
  • Considérations sur le poids & la compression
  • Que faire pour la haute résolution et les écrans retinas ?
  • Outils gratuits pour optimiser vos images sous Windows
  • Recommendations générales & récapitulation

Consultez ce tutoriel (en anglais) : http://www.ostraining.com/blog/webdesign/optimizing-website-images/

4.75 1 1 1 1 1 1 1 1 1 1 Notez cet article 4.75 (2 Votes)

En poursuivant votre navigation sur ce site, vous acceptez l'utilisation de cookies pour notamment réaliser des statistiques de visites