> Tous les forums > Forum des Webmasters
 Créer un mail "newletter" en html avec zone cliquableSujet résolu
Ajouter un message à la discussion
Page : [1] 
Page 1 sur 1
mitai
  Posté le 23/05/2016 @ 16:59 
Aller en bas de la page 
Astucien

Salut !!

Voilà, je souhaiterai créer un mail de type "newsletter" avec une image.jpg que j'ai déjà créé.

Je souhaite insérer une zone cliquable sur une partie de l'image (zone en orange intitulée "Je Participe"), j'ai donc défini ma zone puis enregistré le tout en .html (avec un éditeur html).

Le résultat fonctionne, voilà ce que ça donne : visualiser ici (télécharger et extraire le dossier puis ouvrir le index.html)

Voilà le code HTML complet :

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>essai</title>
<meta name="" content="">
<link href="Sans_Titre1.css" rel="stylesheet" type="text/css">
<link href="index.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="wb_ImageMap2" style="position:absolute;left:65px;top:38px;width:482px;height:873px;z-index:0;">
<img src="images/MergedObject1.jpg" id="ImageMap2" alt="" usemap="#ImageMap2_map">
<map name="ImageMap2_map">
<area shape="rect" coords="85,649,391,739" href="http://www.google.fr" target="http://www.google.fr" alt="" title="">
</map>
</div>
</body>
</html>

Tout est donc OK jusque là.


Le problème c'est que quand je l'envoie par mail, lors de la réception, j'ai mon image qui apparait mais la zone cliquable ne fonctionne pas...

Comment faire ?

PS : dans "format du texte" sous outlook, lors de l'envoi du mail, je suis bien en HTML,

lors que j'ai ajouté mon fichier html je suis allé dans "Joindre un fichier", j'ai choisi mon fichier html et j'ai fait "insérer comme texte".

Merci par avance !!



Modifié par mitai le 23/05/2016 17:00
Publicité
Malcolm
 Posté le 23/05/2016 à 19:08 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Astucien

Salut,

à mon humble avis, c'est une mauvaise idée ... Car tous les lecteurs de mails (outlook en ses différentes versions, thunderbird, ...) ainsi que les webmails (gmail, outlook.com, etc.) et les smartphones (iphone, android, windows phone) risquent de ne pas interpréter de la même façon cette fonctionnalité.

Je te suggère plutôt de découper en plusieurs images ton jpeg, et de le mettre dans la newsletter, une des "sous images" étant cliquable vers le lien "je participe".

Par contre, c'est pareil, rien ne te garantit que tu auras le bon rendu dans tous les systèmes de messagerie ...



Modifié par Malcolm le 23/05/2016 19:08
mitai
 Posté le 23/05/2016 à 19:13 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Astucien

Merci Malcolm !

Mais du coup il n'y aurait aucun autre moyen de trouver une solution plus 'pro' à partir d'un seul fichier HTML ?

Ou bien de créer une page html et de l'insérer simplement dans un mail (mais comment faire ça ?) ^^

Comment font les pro de la newsletter (ebay, rue du commerce, cdiscount etc) pour faire les newsletter qu'ils font ?

Merci encore :)



Modifié par mitai le 23/05/2016 19:14
Malcolm
 Posté le 23/05/2016 à 19:17 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Astucien

Pour les "pros" type Rue du commerce, ebay etc, ils font un mail au code source "crade" (entends par là : en tableaux pour la mise en forme) avec une image découpée en plusieurs sous-images et celles-ci sont placées dans les cases du tableau, dont les bordures ont été évidemment masquées.

Mais ça m'arrive de lire une newsletter sur mon smartphone en téléchargeant les images et de la lire sur un webmail (exemple sur Horde / free.fr) et de ne pas avoir le même rendu visuel des 2 côtés, même pour rueducommerce.

mitai
 Posté le 23/05/2016 à 19:21 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Astucien

D'accord, je ne connaissais pas du tout leur méthode... c'est donc bien du "bricolage" aussi

Je vais suivre tes indications et tenter de découper mon image en plusieurs morceaux... (pourquoi pas dans un tableau)

Mais du coup j'assemble ensuite tout dans outlook ou bien dans un logiciel de création de page web (tel que dreamweaver ou wyziwyg webbuilder) ?

Merci !

Malcolm
 Posté le 23/05/2016 à 20:08 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Astucien

non, dans le logiciel de création de page web :-)

Ensuite tu envoies :

- soit la page HTML avec un lien absolu (tes images sont stockées en ligne et l'utilisateur ne pourra les télécharger que s'il a une connexion à internet

- soit la page HTML avec des images "embarquées" mais le mail reçu est alors plus lourd.

Vu ton image, je pense que tu peux la diviser en 3 images que tu empiles verticalement. Le "haut", le bandeau "je participe" et le dessous du bouton/bandeau.

mitai
 Posté le 23/05/2016 à 20:33 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Astucien

Super merci !

Je ferai ça demain alors :)

Bonne soirée

Page : [1] 
Page 1 sur 1

Vous devez être connecté pour participer à la discussion.
Cliquez ici pour vous identifier.

Vous n'avez pas de compte ? Créez-en un gratuitement !
Recevoir PC Astuces par e-mail


La Lettre quotidienne +226 000 inscrits
Avec l'actu, des logiciels, des applis, des astuces, des bons plans, ...

Les bonnes affaires
Une fois par semaine, un récap des meilleurs offres.

Les fonds d'écran
De jolies photos pour personnaliser votre bureau. Une fois par semaine.

Les nouveaux Bons Plans
Des notifications pour ne pas rater les bons plans publiés sur le site.

Les bons plans du moment PC Astuces

Tous les Bons Plans
72,99 €Kit de 16 Go (2 x 8 Go) de mémoire DDR4 Crucial Ballistix 3200 MHz à 72,99 €
Valable jusqu'au 15 Octobre

Amazon fait une promotion sur le kit de 16 Go (2x8 Go) de mémoire DDR4 Crucial Ballistix 3200 MT/s CL16 qui passe à 72,99 € alors qu'on le trouve ailleurs à partir de 100 €. 


> Voir l'offre
1279,99 €Ultrabook Lenovo Yoga Slim 7 Pro 14 pouces (2.8K IPS, R9-5900HX, 16Go RAM, SSD 1 To) à 1279,99 €
Valable jusqu'au 15 Octobre

Fnac fait une vente flash sur l'ordinateur portable Lenovo Yoga Slim 7 Pro 14 pouces proposé à 1279,99 € au lieu de 1749,99 €. Ce portable est bien équipé avec son écran 2.8K IPS (2880x1800), son processeur AMD Ryzen 9 5900HX, ses 16 Go de RAM, son SSD de 1 To, sa carte graphique intégrée Vega 8. Il possède le Bluetooth 5.1 et le WiFi 802.1 ax, 2 ports USB 3.2, 1 port USB C 3.2, une caméra HD. L'autonomie annoncée est de 14h et la charge rapide permet de le ramener à 50% de sa capacité en seulement 30 minutes. Il pèse 1,32 kg et tourne sous Windows 10 (upgradable à Windows 11).


> Voir l'offre
414,49 €Ecran PC incurvé 34 pouces Gigabyte G34WQC (WQHD, 144 Hz) à 414,49 € livré
Valable jusqu'au 16 Octobre

Amazon Espagne fait une promotion sur l'écran PC incurvé 34 pouces Gigabyte G34WQC qui passe à 396,68 €. Comptez 17,81 € pour la livraison en France soit un total de 414,49 € livré. On le trouve ailleurs à partir de 549 €. Cet écran possède une dalle incurvée 34 pouces VA WQHD (3440x1440) à 1 ms et à 144 Hz (FreeSync Premium et Adaptive Sync). Elle offre le HDR400 et intègre 2 haut-parleurs 2W. Son pied est réglable en hauteur et en inclinaison.


> Voir l'offre

Sujets relatifs
Pas de mail recu avec formulaire html et php
créer site avec webself
créer mappage avec dreamweaver!
Bulle de texte dans une zone cliquable
Créer mon site avec Webzoo.fr
Codage HTML dans Dreamweaver avec une template Photoshop
Pas d'affichage de la zone de saisie avec IE11
Créer un site avec Wiféo
Créer un site avec WIFEO
créer une page web sans codage avec photoshop
Plus de sujets relatifs à Créer un mail "newletter" en html avec zone cliquable
 > Tous les forums > Forum Forum des Webmasters