WebFont non visibili su mobile 
Autore: Enrico -
Visite 3669,
Followers 2,
Condiviso 0
Ciao, ho installato il font MULTICOLORE su wsx5 come webfont inserendo tutti i file necessari, ma da mobile (iPhone) non si vede correttamente in quanto il font viene cambiato.
Potete vederlo sui titoli OPERE SVOLTE, URBANIZZAZIONI, OPERE IDRAULICHE, ecc.
www.studios2o.it
Postato il
... non ho iDispositivi! per confrontare; ...ma cosa si dovrebbe vedere...?...
... su PC vedo alcuni! di quei testi che hai indicato, con le grazie, e su android vedo su tutti in simil Arial...
... poi mi sembra che la ricerca del font locale forse! andrebbe posizionata prima dell'URL, e poi contiene caratteri strani, non so se voluti: ('☺')
... se hai fatto copia/incolla, ripetilo da un documento blocco note in codifica UTF-8...
... di più da parte mia non posso dirti, ed attendi eventuali altri, esperti in tale campo...
.
Autore
Praticamente da desktop (almeno sul mio) si vede il font corretto, mentre da mobile cambia, e cambia pure tra testi che dovrebbero avere lo stesso font cambiato, difficile da spiegare, guardate l'allegato.
"..poi mi sembra che la ricerca del font locale forse! andrebbe posizionata prima dell'URL.." non ho capito, dovrebbe fare tutto WSX5 in automatico se inserisco i file giusti nella finestra dei webfont.
... sul PC su CH-FF vedo IDRAULICA/STRADALI/EDILIZIA con i caratteri uguali a STRADALI del tuo STAMP...
... per i font locale, allora come non detto, pensavo che fosse codice tuo; comunque nel codice vedo quei caratteri strani postati prima, e magari non c'entra niente...
.
Autore
Quindi da desktop si vedono giusti da quanto mi dici.. il problema è su mobile.. i file eot;woff;svg inseriti nella finestra di webfont li ho dovuti "creare" con un convertitore partendo dal ttf originale, ma non credo sia quello, più che altro un font visualizzato in due modi diversi sullo stesso dispositivo? Boh
... cioè come in allegato ...
.
Non si vede nemmeno da desktop.
Tu vedi il font "Multicolore" correttamente da desktop perché probabilmente l'hai installato nel S.O.
Il problema è dovuto ad uno spazio di troppo alla fine del nome del font della proprietà font-family nel codice @font-face che WS inserisce in ogni CSS di pagina (vedi allegato).
Se correggi manualmente il file studios2o.it/pcss/index.css potrai verificarlo tu stesso.
Nel CSS del menu, invece questa discordanza non c'è quindi dopo la correzione non vedrai il font corretto nel menu.
Da cosa possano dipendere queste discordanze non saprei.
Potrebbe dipendere da WS e/o dal tipo di font.
Se non vuoi cambiare tipo di font e/o non risolvi in altro modo, potresti aggiungere la regola CSS corretta in HEAD al Passo 1 - Avanzate (ovviamente tra i tag style).
Autore
Si ma in pratica c'è un problema sul codice creato da wsx5.. bisognerebbe sistemare
Buongiorno Enrico,
prova a riscaricare il font da un altro sito e reinserirlo, allegami se puoi il pacchetto dei font così che possa provare direttamente.
Fammi sapere.
Autore
Ho già provato a scaricarlo da altri fonti, ma non cambiava nulla. In allegato i font.
Buongiorno Enrico,
grazie per il font, l'ho inserito in WebSite X5, ma come puoi vedere dal mio screen anche selezionandolo nell'editor non risulta corretto (forse tu lo vedi corretto perchè il programma legge quello di sistema).
Credo quindi dipenda da quel particolare font che non è corretto e quindi non viene letto correttamente.
Autore
Capito.. sostituirò il font.
Autore
Però però però... ho provato a sostituire il font con un Google Font.. ma ad esclusione del pc dove l'ho installato su tutti gli altri dispositivi viene sostituito, (ho inserito il tff di google e poi il codice @import nell'apposito campo).
[font utilizzato sulle voci del menu e sui soliti titoli "urbanizzazione", "opere edili", "opere idrauliche"...]
Dove sbaglio?
Autore
Ho provato anche ad inserire il codice "link Ref..." anzichè il @import ma non cambia nulla
prova a sostitutire la font "multicolore" con "Arial Rounded", che dovrebbe essere simile... se fai una googolata la trovi su alcuni siti gratuitamente...
Autore
Infatti non ho usato MULTICOLORE perché lo staff ha detto che non è molto compatibile, ma NUNITO presente nei GoogleFonts, ma non funziona (ad esclusione sul PC dove è installato).
Autore
Ho tentato anche con un progetto da zero, ma niente stesso problema:
http://ericgroup.altervista.org/beta/nunito/
enrico, la butto là... non è che il codice @import url('https://fonts.googleapis.com/css?family=Nunito');
lo metti tra i tag <style> e </style>? perchè non ci vanno.. va solo la riga @import....
________________
ho fatto una veloce prova... con FireFox da questo problema anche a me, invece con Chrome funziona a dovere (senza <style> e </style> naturalmente)... quindi dovrebbe essere un problema di browser...
Autore
Ecchecavolo
Ovvio che avevo inserito anche i tag style.. sulla guida dicono di incollare il codice @import e quello ho importato
Vabbè, comunque ora funziona e va anche su Firefox.
Grazie mille
@Skeggia, anche io ho segnalato una difformità di visualizzazione tra come si vede un font su Chrome e come si vede su Firefox, il topic è qui: https://helpcenter.websitex5.com/it/post/159859
Andando sul Topic potresti/potete fare una prova e farmi sapere? Grazie.
Per i font che non si vedono allo stesso modo sui dispositivi mobili rispetto ai Computer, confermo. A me non fa vedere uguali nemmeno i Font predefiniti di Windows su dispositivi mobili, dove immancabilmente vengono sostituiti da altri. Provate a vedere il font Trebuchet MS presente ad inizio presentazione, dove c'è scritto: "Quello che vedi in questa pagina è un TEMPLATE PER WEBSITE X5 realizzato da me... ecc ecc" nella Home di questo mio sito: http//www.ggwebdesign.altervista.org
A me sullo smartphone lo sostituisce con un altro Font (ve ne accorgete subito dalla lettera M visibile sui PC, tipica del Font Trebuchet MS). Il Font Arial Black presente nel testo "SITI WEB - TEMPLATE PER WEBSITE X5- LAVORI GRAFICI" sempre in alto in Home page, sullo smartphone viene anch'esso sostituito. Vi chiedo riscontro per escludere che sia solo un problema del mio Smartphone, grazie mille
ciao giuseppe, credo che Arial Black non sia un font standard di windows (mi spiego meglio, ci sono varie versioni di Arial, in cui ad esempio, in una famiglia, il black è compreso nella tendina delle varianti, mentre esiste un arial black a parte...)... il comportamento del browser nei due casi è differente... nel primo lo accetta come font standard nel secondo lo sostituisce in quanto NON standard... credo che sia questo il tuo problema... per il trebuchet ms a me si vede normalmente nei due browser... per gli smartphone non ti posso aiutare... io odio navigare da quelle periferiche, quindi...
ciao
Grazie Skeggia per le delucidazioni sul font Arial Black
Il problema del Trebuchet MS era invece relativo solo alla visualizzazione su smartphone. Su questi ultimi, a me, viene sostituito da altro Font.
Grazie ancora
..."teoricamente" il Trebuchet MS (come tutti i font marchiati con la T e la spunta verde
http://help.websitex5.com/it/v13/pro/web_font_def.htm?zoom_highlightsub=font
...andrò a verificare, poichè sto proprio facendo un sito col Trebuchet...
Ciao Claudio.. . Guarda nello screeshot quel che si vede a me da smartphone: non é il font Trebuchet che invece è normalmente visibile sul computer così come da me impostato.
Ciao
Autore
Ma hai per trebuchet-ms hai trovato i pacchetto già fatto con tutti i formati di (eof...) o sei partito dal ttf ed hai convertito, perchè la conversione alcune volte ti crea si il file ma i file creati (come nel mio caso il font Multicolore) non funzionano a dovere.
"teoricamente" per il Trebuchet non dovresti fare nulla essendo marchiato con la T spuntata di verde... come specificato nel mio post prima...
...con il mio smartphone Lumia , vedo perfettamente sul tuo sito il Trebuchet , mentre mi sostituisce l'ArialBlack ... !!!
Enrico, non vorrei sbagliare ma io con il Trebuchet MS non ho fatto nulla. Nel senso che è il Trebuchet installato di default su Windows.
Claudio si, dell'Arial Black sapevo anche. Tra l'altro lo cambia anche sul computer da browser a browser come ho spiegato nel topic piú sopra.
...infatti se leggete qui:
il paragrafo "Utilizzare i Web Fonts in WebSite X5"
http://help.websitex5.com/it/v13/pro/index.html?web_font_def.htm
il Trebuchet è un "Safe Fonts"
E infatti Claudio, il Trebuchet MS a me ha la T spuntata di verde. Però sullo smartphone me lo sostituisce con altro.
...Giuseppe, scusa con che smartphone ?
perchè io ho verificato con il Lumia (windows phone) ed i SafeFonts si vedono "tutti" tranne:
book antica, impact e palatino
ci capisco sempre di meno...
Claudio, a me è uno ZTE Blade A452..
Anche io ci capisco sempre di meno, sta di fatto che ho realizzato siti e tamplate che hanno i font tutti diversi tra loro in base alle visualizzazioni se vengono effettuate su PC da Browser a Browser, oppure da Pc a Smartphone e ora tu mi confermi anche una discordanza di visualizzazione da Windows Phone a Smartphone... che casino però. Da qualche parte c'è il problema, vai a capire dove.
Buongiorno Giuseppe,
dipende anche dal browser usato, di solito non è consigliabile usare quelli preinstallati nel dispositivo ma per esempio scaricare Chrome.
Ciao Riccardo. Uso Chrome su smartphone, aggiornato anche all'ultima versione. Non è quello il problema.
Il discorso di "safe font" va rivisto, visto l'aumento di dispositivi mobili nel web.
Già in questo vecchio articolo del 2013 si parlava di "Web safe font morti":
http://www.howdesign.com/resources-education/web-safe-fonts-are-dead-font-guru-thomas-phinney-talks-web-fonts/
Un altro fattore importante (safe font parlando) da prendere in considerazione è l'elenco di font appartenenti alla stessa famiglia che dovrebbe essere specificato nei CSS di WS, esempio:
font-family:Arial, Helvetica, sans-serif;
Ma, come scritto nell'articolo, oggigiorno potrebbe non essere sufficiente.
Se volete stare abbastanza tranquilli usate Google Fonts o Web Fonts che, tanto per precisare, usano tutti e due la direttiva @font-face
Grazie Lemonsong, articolo molto interessante e suggerimento sicuramente utile se non si vuole rischiare di avere i font scelti "a caso" dal browser.
Grazie per le delucidazioni Lemonsong.