Ionic for a web app only & SEO

Ionic Framework
1

Hello,

I am new to using Ionic, I have two questions that I ask myself:

  • Can Ionic be used to develop a web application without being compiled for iOS / Android?
    If so, are there any recommendations for starting a new project?
  • How to make search engines index pages, because when we display the source code of the page, no HTML content is displayed in the body.

Thank you for your help and advices

2

Hi @codiqa100075846!

Yes, Ionic can be used to develop a progressive web app (PWA), you don’t need to create iOS or Android builds if you don’t want to. The app can be locally served during development with ionic serve and built for production with ionic build --prod. Then you just need to upload the www directory to your web server or service like Firebase, GitHub Pages, Netlify, etc.

I recommend Ionic 4, as it uses the Angular Router and it’s more URL/SEO friendly. If you’re also targeting desktop devices, check out the article I wrote on the Official Ionic Blog: https://blog.ionicframework.com/tips-tricks-for-ionic-on-desktop/. Mike Hartington from the Ionic team also recorded a great screencast about How to build a Progressive Web App (PWA).

Google and most of the main search engines can detect that your app is a Single Page App and render it with Javascript enabled on next crawls (https://developers.google.com/search/docs/guides/rendering). You can also use server-side rendering to deliver a pre-rendered version of the page with Angular Universal.

Best,
Rodrigo

3

Hi FdezRomero,

Thank you very much for your answer, it helped me a lot.

See you soon.

4

Hi.

Just one thing to keep in mind if you want to target IE11 clients (common with businesses still) Ionic is not a good fit.

5

Hi Judgewest2000,

What would you advise me in this case to use?

Thank you.

6

If you like the Angular route then something like material.angular.io. That’s gorgeous on IE11.
Or if you want something more generic Bootstrap is still awesome and isn’t tied to a particular framework.

7

Thank you for your reply,

I find that Material Angulaire is a little light in terms of components, I thought a little Stenciljs!
What do you think?

Thank you.

8

I don’t really know stenciljs well enough to have a decent opinion I’m afraid.

I thought StencilJs was more of a wrapper of all the cool web components stuff as opposed to a set of controls, so you would have to still write / import what you need.

9

I thought server rendering and pre-rendering are different types of rendering, though both are seo friendly when it comes to single page apps. The SPA needs to have dynamic meta tags as well, not just URL. This can be done with angular router or it can be done in react as well. Since Ionic is using Angular Router, the SPA built on it can have dynamic meta tags as well.

10

Does angular universal works with Ionic??