Redesign the page where we explain services to people

[catherineluse]

If I were new to Kubernetes, I would have no idea which of these options to choose on this page, in spite of the fact that we try to explain them in text:

My problems with this page are:

• It presents normal options with equal visual importance to advanced options. ExternalName and Headless are more advanced options that are geared toward people who want to implement their own service discovery or integrate with something outside of Kubernetes, so they should be visually diminished.
• It gives the misleading impression that if you want to expose a workload, you have to pick one of the five options. In reality though, they build on each other and you might need two. NodePort builds on ClusterIP, and LoadBalancer builds on NodePort. This is why in the Ember UI, when you deployed a workload, Rancher automatically deployed two Services to expose it - both a LoadBalancer AND a ClusterIP. In the new UI, we expect people to be able to manually do that, so we should help them figure it out. In my mind, it should logically cascade from ClusterIP to NodePort to LoadBalancer. (see my notebook picture that I drew below)
• The icons don't convey meaning.
• The text says that LoadBalancer can expose a workload externally, but it leaves out any mention of the fact that you may need an ingress if you don't want to pay for an IP for every service, for example. It also makes it sound like a service of type LoadBalancer is required to expose a workload, but a) NodePorts can also expose workloads externally, especially for development purposes, and b) you can expose any service externally - including the ClusterIPs - if you configure an Ingress to direct traffic to it.

@kwwii I've assigned this to you so that you can be aware of it, but it is very low priority and has no milestone.

This also ties into #5441 and #4845.

A more logical progression with more meaningful icons might look something like this:

In case it helps, here's how I understand the basic decision flow:

Helpful reading:

• https://stackoverflow.com/questions/45079988/ingress-vs-load-balancer
• https://www.ibm.com/docs/en/cloud-private/3.2.0?topic=networking-kubernetes-service-types
• https://medium.com/google-cloud/kubernetes-nodeport-vs-loadbalancer-vs-ingress-when-should-i-use-what-922f010849e0