Can we use Cufon-font for mobile site? - mobile

We have a site with Cufon-font and it's working fine in all the browsers except IE therefore, we've used Google font for IE css. We are now intend to create mobile site for it using same Cufon-font. My question is, Will it be ideal to use Cufon-font for a mobile site ? And will it cause any performance issues ? if "Yes" is there are any solution for it ?
Because from research I found some bottle necks and positive result for mobile. For example
Opera Mini supports (to a certain degree).
IPhones are good at Cufon-font.
From my personal experience I've visited the current web site (which is using Cufon-font) with the Samsung Galaxy W mobile and for some detail pages it took 18 seconds load. Until it loads the page completely the fonts are displayed as normal.
Is there a way to overcome these issues ?
Any comments would be appreciated.

On the IE issue, IE 10 supports custom fonts and that should work for you, previous versions of IE do not. As far as the time to load, that all depends on the bandwidth, the device, etc. So if you loading of over 3G its going to be slow for a large file.

Related

Only AMP pages or non-AMP pages + AMP pages

Currently, we are trying to implement AMP to our current website. Non-AMP version is already ready and works as it supposed to be. Question is: 'which one would be better: to change all current pages to AMP or creating additional AMP pages and put canonical link to original pages?'
There is no doubt that AMP is fast, beautiful and high-performing across devices and distribution platforms. It can run on desktop and mobile both. But AMP is basically for mobile. I think that we should run separate for desktop (non-amp) and mobile (amp).
In general we support the latest two versions of major browsers like Chrome, Firefox, Edge, Safari, Opera and UC Browser. We support desktop, phone, tablet and the web view version of these respective browsers.
Beyond that, the core AMP library and built-in elements should aim for very wide browser support and we accept fixes for all browsers with market share greater than 1 percent.
In particular, we try to maintain "it might not be perfect but isn't broken"-support for the Android 4.0 system browser and Chrome 28+ on phones.

Does mobile-first-indexing mean developing in a lower res?

I just got notification that my site is now in the mobile first index in Google.
So does this mean that I should change my developing and work at a lower resolution oprimarily and then check "just to make" that it looks OK at higher resolutions?
I would imagine that there's very few people looking at my website on a mobile device due to its nature.
Tablets and smaller PCs maybe though.
I also got notified on Google Search Console.
I don't think that to optimize for it is to lower your website resolution.
Some basic optimization I might suggest are:
Make your website responsive
Avoid using heavy fonts and images
You can declutter your mobile view from the desktop, do not worry if the content will be different, as long that it will still relevant to your desktop.
Make sure your pages are crawlable by search engine robots (Check your javascript)
You can check this timely discussion about optimizing for mobile-first indexing
https://www.propelrr.com/blog/questions-google-mobile-first-indexing

Sencha Touch and Internet Explorer 10

Sencha Touch is brilliant but IE cannot open websites which is developed using Sencha Touch.
I am not interested in using IE, but my opinion is not important since many others may use it.
Since Microsoft announces HTML-5 Support and I have worked with the great tools to make native apps even using HTML-5 and Java so it is obvious that IE 10 must support HTML5. But it seems sencha touch websites cannot be explored by IE 10 too, since I cannot explore Kitchen Sink (on sencha.com) using IE 10 however I can easily do this using Chrome.
Further to this problem, I want to make an web-site for a small company, is it right to use Sencha Touch to develop it or jQuery is a better choice? (I yearn for you say Sencha Touch :) since I am completely unfamiliar with jQuery)
I appreciate the time you are spending.
Sincerely yours,
PEYMAN MORTAZAVI
Call me old-fashioned, but when I see the Kitchen Sink demo failing in IE10, I blame the developers behind the demo, and not those behind the browser. IE10 is an oustanding browser that is worthy of our attention, and not merely for the fact that it will be used by millions upon millions immediately following its official release, but also because it's a great browser from a technical perspective.
If you're going to build a solution for your clients, you should avoid libraries that wish to distance themselves from supporting half of the market, meaning they don't actively develop with IE in mind. The excuses for not supporting IE simply aren't there today as your code won't require that much variance to work properly in the latest version of Microsoft's browser.
Use jQuery, jQuery Mobile, or jQuery UI. You can get some great UI from and with all of them, and you'll find excellent support in all major browsers.
I am porting my Sencha Touch 2.0 app to 2.2.1 in order to support IE10.
So I have first-hand knowledge in the effort.
all Sencha websites / apps build previous to 2.2.0 and by developers targeting webkit browsers will never work on ie10 reliably because a bunch of stuff had to be done to the core of Sencha Touch in order for ie10 to work. Everyone has to go back and do what I'm doing... line by line of CSS and a few JS changes as well (esp if you do canvas stuff)
Running an old "kitchen sink" which was not properly architected for 2.2.1 and tested on IE10 is not going to work either. I do not know how much time Sencha folks spent testing kitchen sink on IE10 ...but one would assume...
I think what has thrown Sencha for a loop is developers don't have time or money to build business apps twice - once on ExtJS for laptop/desktop and 2nd time on Sencha Touch 2 for tablet touch/gesture support. This is the strange land of SDK's because the tablet real-estate so closely resembles that of a small laptop -- ergo as long as your UX people a really good, they can architect an experience that crosses over from tablet to laptop pretty good by building one code base in Sencha Touch.
But oooops - Sencha figured we'd all be building to small phones - a market dominated by webkit browsers. If that were the case, then this argument of IE market share would not hold - we all know Windows Phone numbers. It's hard to fudge/spin that. What's causing the rub is the tablet-laptop screen size being so similar.
IMHO...
IE10 in the Windows 8 preview is the same version that is slated for the tablets and mobile devices they have been producing. Saying it is for desktop support is not a very useful statement. The problem is this is what Microsoft is about to spend a very large amount of money marketing and pushing to businesses. This is not a case of a tablet/phone library not supporting a desktop, but of a tablet/phone library not supporting a target platform that is about to have billions of dollars of marketing spent to deploy it.
Any mention of Internet explorer seems to evoke deep emotion in everyone! However IE is a fact of life.
I would suggest that you use Google Chrome Frame. The first time IE visitors arrive at your site you can alert the user to install Google Chrome Frame and redirect them. It's a bit messy for the first visit but after that it should be seamless.
As I understand it Google Chrome Frame no longer requires admin rights to install.
Obviously people should just install Chrome in the first place but nobody's perfect.
Sencha Touch 2 is not designed to work on IE10. If desktop support is important for you, then you should use Ext JS 4.
Chrome and Safari use WebKit which Sencha Touch requires in order to function.
Internet Explorer might be able to display Sencha Touch apps in the future:
http://www.appleinsider.com/articles/08/11/06/microsofts_ballmer_considers_using_webkit_within_ie.html
http://www.favbrowser.com/opera-firefox-and-internet-explorer-to-implement-webkit-prefixes/
But who knows?
I had spent a month getting a project to work with Sencha Touch, but had to choose a more accessable framework. The goals of the project were to work across as many browsers (desktop and mobile) as possible. The webkit preference for Sencha, while admirable in how it is achieved, made it unusable for my needs.
I am glad they changed their licensing since I tried it. That was the second stumbling point for our project.

TinyMCE or other WYSIWYG Editors for Mobile Devices?

Is it possible to use a WYSIWYG text editor (especially TinyMCE) for a mobile device or is that not supported yet? Will it ever be supported?
This weblink Compatibility table for support of contenteditable attribute in desktop and mobile browsers. will give you a clue about this issue.
I was looking for the same thing today, so I thought to share this link with you.
It is possible to use it on a mobile device, but the javascript functionality in those browsers is limited, so not everything is possible (own plugins and several interactions with own CMS i.e.).
Keep in mind too that heavy js-usage on a page will slow down all its functionality on mobile devices cause the system is not as powerfull as a personal computer. I had the problem that the js overhead of a CMS delayed js-functionality in the browser so that clicking checkboxes and selecting input fields was almost not usable.
It might be necessary to redisign the whole CMS around such an editor to run fast enough to make it work.

Repurposing a site for mobile platform

I have an existing website running. I want this site to be able to be viewed on mobiles smart phones as well. I am ready to shave off some stuff, but would like to know how can I test this and are there any tools/guidelines on how to repurpose the site to be best viewed on mobile phones ? How to detect on the web site whether a mobile phone or a PC is hitting the site and accordingly serve the appropriate content.
There are few factors to consider such as:
- screen size
- touch vs non-touch
To detect whether the mobile phone hitting your site, you can simply verify the user agent.
There is a good article on this at A List Apart which will answer your implementation questions: Put Your Content in My Pocket
You can test by setting the user agent of your browser to that of mobile device. This can be done in safari under the develop settings, or firefox has various plugins.
And a tip, don't use anything that requires hover functionality. Touch screens don't hover.
You will find out it's a strange new world at http://mtld.mobi/
First decision you should make is which mobile platforms you want to support, then start coding...
As some one mentioned http://mtld.mobi/ is the best place to start for resources but for testing I would use http://ready.mobi that will test and debug your site and provide interface to viewing your website in mobile platforms.
First you need to decide what platforms/browsers you are going to support. If it is only smart phones like Android/Iphone/Blackberry it would be a pretty safe bet that as long as the website works in crome and isn't VERY javascript intensive and the site is catered for smaller screens it would be fine.
That is the theory in practise mobile is mobile and real world testing is the only way to go for 100% coverage.

Resources