[html] Beschikbaarheid van HTML karakter

[YellowOnline]

Dit is ongetwijfeld de minst technische post in dit subforum, maar ik zie niet in waar ik het anders kwijt kan.

Bij een klant willen ze van tekst in hun automatische handtekeningen vanaf omdat tekst niet internationaal genoeg is. Ik zou in deze HTML handtekening natuurlijk afbeeldingen kunnen gebruiken voor 'telefoon', 'mobiel', 'fax', 'e-mail' en 'website'; maar nog beter zou het zijn als ze met HTML karakters werken. Meer bepaald:

• ☎
• 🕻
• 🖷
• ✉
• @

Blijkbaar was mijn aanname dat dit los staat van fonts en als zodanig bij iedereen werken moet fout: bij een eerste test blijkt bij minstens één correspondent het tweede ('mobiel') niet te verschijnen (een wit blokje is alles).

Wie kan mij uitleggen waarom en een alternatieve oplossing aanbieden?

[downtime]

Niet elk font biedt alle karakters. Is een karakter niet gedefinieerd dan wordt meestal een wit blokje getoond. Ook niet gek aangezien Unicode verschrikkelijk veel tekens biedt en het gekkenwerk zou zijn om van elke font designer te eisen dat hij alle mogelijke karakters in het font opneemt.

[RobIII]

downtime schreef op vrijdag 20 januari 2017 @ 10:56:
Niet elk font biedt alle karakters. Is een karakter niet gedefinieerd dan wordt meestal een wit blokje getoond. Ook niet gek aangezien Unicode verschrikkelijk veel tekens biedt en het gekkenwerk zou zijn om van elke font designer te eisen dat hij alle mogelijke karakters in het font opneemt.

Exact dat; end-of-story.

Het alternatief is een afbeelding maar ook die laden lang niet altijd overal. En dan hou je nog maar 1 alternatief over: KISS. Gewoon:

Tel: [phone]
Mobiel: 06 345 678 98
Fax: [phone]
Email: [e-mail]
Web: www.domein.nl

Dat kun je eventueel met een monospaced font of een table nog enigszins uitlijnen.

Tel:    [phone]
Mobiel: 06 345 678 98
Fax:    [phone]
Email:  [e-mail]
Web:    www.domein.nl

Tel:	012 345 6789
Mobiel:	06 345 678 98
Fax:	012 345 6788
Email:	[e-mail]
Web:	www.domein.nl

Dat is ook nog eens een stuk duidelijker dan allerlei cryptische icoontjes die lang niet overal 'tzelfde geïnterpreteerd worden.

[ Voor 25% gewijzigd door RobIII op 20-01-2017 11:22 ]

[downtime]

RobIII schreef op vrijdag 20 januari 2017 @ 11:19:
[...]

Dat is ook nog eens een stuk duidelijker dan allerlei cryptische icoontjes die lang niet overal 'tzelfde geïnterpreteerd worden.

Ook dat. Eenvoudige Engelse woorden als email en web worden tot in de verste uithoeken van de wereld begrepen. En iconen zijn lang niet zo universeel als iedereen denkt.

[RM-rf]

• ☎
• 🕻
• 🖷
• ✉
• @

grappig overigens da vrijwel geen enkel icoon werkelijk een Reele moderne weergave is van een functie of apparaat:


Voor email een enveloppe of 'at' teken ( wat oorspronkelijk juist ee toebehoor-koppelteken was voor bv maateenheden) , een oude bakelieten oldschool vaste telefoon als telefoonnummer, of een oude telefoonhoorn.

Zulke visuele tekens zijn zeker net zo ontzettend sterk of overtuigend.
In hets chriftbeeld lijken ze ook eerder verstorend te werken, de dikte en zwartheid is ook binnen hetzelfde lettertype erg verschillende waardoor bv het eerste telefoon-icoon relatief de meeste aandacht opeist.

[YellowOnline]

downtime schreef op vrijdag 20 januari 2017 @ 10:56:
Niet elk font biedt alle karakters. Is een karakter niet gedefinieerd dan wordt meestal een wit blokje getoond. Ook niet gek aangezien Unicode verschrikkelijk veel tekens biedt en het gekkenwerk zou zijn om van elke font designer te eisen dat hij alle mogelijke karakters in het font opneemt.

Mja. Het houdt wel steek als je het zo formuleert.

RobIII schreef op vrijdag 20 januari 2017 @ 11:19:
[...]

Exact dat; end-of-story.

Het alternatief is een afbeelding maar ook die laden lang niet altijd overal. En dan hou je nog maar 1 alternatief over: KISS. Gewoon:

Tel: [phone]
Mobiel: 06 345 678 98
Fax: [phone]
Email: [e-mail]
Web: www.domein.nl

Dat kun je eventueel met een monospaced font of een table nog enigszins uitlijnen.

Tel:    [phone]
Mobiel: 06 345 678 98
Fax:    [phone]
Email:  [e-mail]
Web:    www.domein.nl

Tel:	012 345 6789
Mobiel:	06 345 678 98
Fax:	012 345 6788
Email:	[e-mail]
Web:	www.domein.nl

Dat is ook nog eens een stuk duidelijker dan allerlei cryptische icoontjes die lang niet overal 'tzelfde geïnterpreteerd worden.

Dat wil mijn klant net niet: teveel personeelsleden in Europa kennen geen Engels - niet in het minst hier in Duitsland - en dat willen ze principieel ook niet. Het ziet er dus naar uit dat ik afbeeldingen ga moeten gebruiken. Voor de RTF/TXT versie mag ik overigens wel Engels gebruiken (zo pragmatisch zijn ze nog).

[RobIII]

YellowOnline schreef op vrijdag 20 januari 2017 @ 17:07:
[...]


Dat wil mijn klant net niet

Dan is het jouw taak je klant de voor- en nadelen te vertellen van elk van de opties. Als 'ie dan nóg voor afbeeldingen of unicode karakters kiest is het een dumbass z'n eigen schuld.

[downtime]

RM-rf schreef op vrijdag 20 januari 2017 @ 12:00:

• ☎
• 🕻
• 🖷
• ✉
• @

grappig overigens da vrijwel geen enkel icoon werkelijk een Reele moderne weergave is van een functie of apparaat:

Het viel me zojuist op dat jouw iconen er op mijn desktop browser heel anders uitzien dan op mijn iPad. Op de desktop zie ik vijf monochrome iconen. Op mijn iPad zie ik er maar 3 en zien ze er compleet anders uit (een rode telefoon, een witte envelop en @ wordt gewoon als letter getoond).

[b2vjfvj75gjx7]

downtime schreef op vrijdag 20 januari 2017 @ 18:10:
[...]

Het viel me zojuist op dat jouw iconen er op mijn desktop browser heel anders uitzien dan op mijn iPad. Op de desktop zie ik vijf monochrome iconen. Op mijn iPad zie ik er maar 3 en zien ze er compleet anders uit (een rode telefoon, een witte envelop en @ wordt gewoon als letter getoond).

Dat is omdat er geen emoji standaard is;

Elke leverancier implementeert zijn eigen icons...

http://mentalfloss.com/article/70879/9-emojis-look-completely-different-other-phones

Er is wel een open-source alternatief om die standaard te forceren - maar vooral Apple weigert die te omarmen (omdat ze bang zijn dat ze gedoe krijgen met mensenrechten, ivm. huidskleur / haardracht / kledingdracht, etc...).

http://emojione.com/

Je weet dus nooit exact hoe "jouw" smiley ontvangen wordt door de andere partij; een reden te meer om ze niet te gebruiken.

[b2vjfvj75gjx7]

offtopic - Het lijkt me sowieso relaxed als Tweakers overstapt op de emoji-standaard...

Eindelijk af van die 8-bit icons met korrelige randen en gewoon nette / minifyed SVG assets in de plaats.

[johnkeates]

b2vjfvj75gjx7 schreef op zaterdag 21 januari 2017 @ 20:00:
offtopic - Het lijkt me sowieso relaxed als Tweakers overstapt op de emoji-standaard...

Eindelijk af van die 8-bit icons met korrelige randen en gewoon nette / minifyed SVG assets in de plaats.

[afbeelding]

[afbeelding]

[afbeelding]

[afbeelding]

Ik hoop het niet. De 8-bit emoticons zijn leuk, en werken prima. De emojione emoji's zijn lelijk, en veel te overdreven voor wat ze moeten doen. Het moet een leuke toevoeging zijn, niet een vervangende taal.

[q-enf0rcer.1]

Waarom voor de iconen niet een font gebruiken dat wel beschikt over alle nodige karakters? Eventueel kun je dit font in je applicatie embedden zodat je ook zeker weet dat het op ieder systeem wordt geladen.

Nog een optie: een icon font.

[ Voor 7% gewijzigd door q-enf0rcer.1 op 24-01-2017 13:06 ]

[RobIII]

q-enf0rcer.1 schreef op dinsdag 24 januari 2017 @ 13:04:
Waarom voor de iconen niet een font gebruiken dat wel beschikt over alle nodige karakters? Eventueel kun je dit font in je applicatie embedden zodat je ook zeker weet dat het op ieder systeem wordt geladen.

Nog een optie: een icon font.

Het gaat hier over e-mail. Dan heb je weinig te piesewieten als het op fonts aankomt en kun je alleen maar hopen dag de ander (lees: ontvanger(s)) het font geïnstalleerd heeft

[NMe]

q-enf0rcer.1 schreef op dinsdag 24 januari 2017 @ 13:04:
Waarom voor de iconen niet een font gebruiken dat wel beschikt over alle nodige karakters? Eventueel kun je dit font in je applicatie embedden zodat je ook zeker weet dat het op ieder systeem wordt geladen.

Nog een optie: een icon font.

Hij heeft het over handtekeningen. Ik neem aan dat 'ie daar e-mail mee bedoelt, en dan wordt zo'n iconfont lastiger. Niet onmogelijk, maar ook niet handig genoeg om toch maar toe te passen. De tekst uitschrijven, plaatjes nemen of genoegen nemen met unicode in de wetenschap dat dat niet overal hetzelfde uitziet zijn de drie opties die het meest reëel zijn.

RobIII schreef op dinsdag 24 januari 2017 @ 13:18:
[...]

Het gaat hier over e-mail. Dan heb je weinig te piesewieten als het op fonts aankomt en kun je alleen maar hopen dag de ander (lees: ontvanger(s)) het font geïnstalleerd heeft

Dat klopt met name voor signatures natuurlijk, maar voor spul als nieuwsbrieven zijn er nog wel wat opties. Uiteraard heb je daarbij wel een fallback nodig omdat niet elke client het ondersteunt. Linksom of rechtsom: niet toe te passen wanneer je wil dat de icons er altijd goed uitzien tenzij je een fallbackfont hebt dat ze ook heeft; en als je dat hebt dan had je zo'n iconfont al helemaal niet nodig.

[q-enf0rcer.1]

Dat was me ontgaan, inderdaad een logische aanname maar het stond nergens vermeld en het kwam om één of andere reden niet in me op

Denk inderdaad dat afbeeldingen gebruiken of het uit te schrijven de enige 100% betrouwbare methodes zijn. Je weet tenslotte nooit zeker welke fonts een systeem wel of niet heeft. Mocht je genoegen nemen met 99.9% dan is het wellicht wel mogelijk een font te kiezen dat beschikt over de meeste dan wel niet alle karakters.

[YellowOnline]

Ja, sorry, dat was misschien niet duidelijk, maar het ging inderdaad over de automatische handtekeningen in e-mails (CodeTwo Signature Tools Pro trouwens).

Ik heb nog geen tijd gehad er verder mee te doen. Momenteel hebben ze een andere handtekening per land net de tekst uitgeschreven in de plaatselijke taal, wat het niet urgent maakt maar wel moeilijk te beheren. Waarschijnlijk ga ik voor de versie met afbeeldinkjes. De vraag is dan waar ik een kosteloze icoonset vinden kan die commercieel gebruikt mag worden.

[Spinal]

YellowOnline schreef op woensdag 25 januari 2017 @ 09:53:De vraag is dan waar ik een kosteloze icoonset vinden kan die commercieel gebruikt mag worden.

Font Awesome (SVG's), FamFamFam Silk (kleine PNG's), of een willekeurige set van deze pagina bijvoorbeeld

[YellowOnline]

Spinal schreef op woensdag 25 januari 2017 @ 13:20:
[...]

Font Awesome (SVG's), FamFamFam Silk (kleine PNG's), of een willekeurige set van deze pagina bijvoorbeeld

FontAwesome is ook werkelijk awesome, althans naar mijn smaak. Goeie tip, dankuwel. Alleen nog uitzoeken hoe dat werkt zonder het font maar met de afbeeldingen zelf.

[ Voor 9% gewijzigd door YellowOnline op 25-01-2017 14:57 ]

[RobIII]

YellowOnline schreef op woensdag 25 januari 2017 @ 14:52:
Alleen nog uitzoeken hoe dat werkt zonder het font maar met de afbeeldingen zelf.

In Photoshop de "tekens" typen op een nieuwe layer -> rasterize layer -> PNG van maken. Voila. Kers op de taart: even de PNG's door tinypng.com halen.

[ Voor 8% gewijzigd door RobIII op 25-01-2017 15:17 ]

[YellowOnline]

RobIII schreef op woensdag 25 januari 2017 @ 15:17:
[...]

In Photoshop de "tekens" typen op een nieuwe layer -> rasterize layer -> PNG van maken. Voila. Kers op de taart: even de PNG's door tinypng.com halen.

Dankuwel. Ik zie het principe in ieder geval en kan dat vast in GIMP of zo doen (want PS heb ik niet... niet echt mijn sector).

[NMe]

YellowOnline schreef op woensdag 25 januari 2017 @ 14:52:
Alleen nog uitzoeken hoe dat werkt zonder het font maar met de afbeeldingen zelf.

Pas daarbij op dat je, zoals RobIII al hint, inderdaad PNG's gebruikt en niet de SVG's los als afbeeldingen gebruikt, want dat zal niet elke mailclient ondersteunen.

[Sumpsoned]

Wat heeft bij het toevoegen van afbeeldingen eigenlijk de voorkeur? In een HTML mail verwijzen naar de afbeelding op een server neem ik aan toch? Anders krijg je standaard altijd te zien dat je mail attachments heeft. Nadeel is wel weer dat veel mail-clients niet standaard de afbeeldingen downloaden- al weet ik niet hoe dit zit bij toegevoegde afbeeldingen

[YellowOnline]

Sumpsoned schreef op woensdag 25 januari 2017 @ 16:08:
Wat heeft bij het toevoegen van afbeeldingen eigenlijk de voorkeur? In een HTML mail verwijzen naar de afbeelding op een server neem ik aan toch? Anders krijg je standaard altijd te zien dat je mail attachments heeft. Nadeel is wel weer dat veel mail-clients niet standaard de afbeeldingen downloaden- al weet ik niet hoe dit zit bij toegevoegde afbeeldingen

In de huidige handtekening is een logo en dat doe ik inderdaad embedded om te vermijden dat het niet getoond wordt bij de ontvanger.

[R4gnax]

NMe schreef op woensdag 25 januari 2017 @ 15:57:
[...]

Pas daarbij op dat je, zoals RobIII al hint, inderdaad PNG's gebruikt en niet de SVG's los als afbeeldingen gebruikt, want dat zal niet elke mailclient ondersteunen.

De belangrijkste hedendaagse clients die SVG in een foreground <img /> niet ondersteunen zijn de verschillende Outlook versies. En die kun je technisch nog afvangen met ... VML en <!--[if mso]> conditional comments.

[ Voor 4% gewijzigd door R4gnax op 01-02-2017 00:18 ]

[Compizfox]

b2vjfvj75gjx7 schreef op zaterdag 21 januari 2017 @ 19:57:
[...]


Dat is omdat er geen emoji standaard is;

Unicode (waar Emoji onderdeel van uitmaakt) is zeker wel een standaard, maar het Unicode Consortium legt alleen de betekenis van de symbolen vast, niet het uiterlijk. Het uiterlijk hangt, zoals bij alle characters (ook de normale!) af van de font. Een Emoji zou dus bij elke font dus wel hetzelfde moeten representeren (en dan wel datgene wat staat vastgelegd in Unicode), maar de precieze vormgeving verschilt vaak.

Een telefoon is dus in elke font wel een telefoon, maar wat voor telefoon en hoe die eruit ziet kan per font anders zijn.

---

Spinal schreef op woensdag 25 januari 2017 @ 13:20:
[...]

Font Awesome (SVG's)

Kun je dat gebruiken in een email? Je zou dan de CSS moeten includen. Ik denk niet dat dat mogelijk is...

[ Voor 71% gewijzigd door Compizfox op 01-02-2017 00:38 ]

[Spinal]

Compizfox schreef op woensdag 1 februari 2017 @ 00:29:
Kun je dat gebruiken in een email? Je zou dan de CSS moeten includen. Ik denk niet dat dat mogelijk is...

Oh, blijkbaar heeft Fontawesome geen SVG/PNG versies. De nieuwe versie wel, maar die is nog niet uit. Er zijn wel onofficiële sites waar je SVG/PNG versies van de icoontjes kunt downloaden overigens.

[moozzuzz]

Een ander alternatief zou kunnen zijn:
M (voor gsm/mobiel)
T (voor oldskool deskphone)
E (voor email)

Overigens moet dat bedrijf erg domme medewerkers hebben als ze niet begrijpen dat tel: +xx 123 45 67 89 een telefoon nummer is en fax: +xx 123 45 67 89 een faxnummer (wie gebruikt er nog een fax ) en email: [e-mail].

Een van mijn leveanciers gebruikt een handtekening bestaande uit één plaatje (incl phone/email/fax blabla) én dat is bijzonder hatelijk onhandig.