HTTP vs TCP vs UDP with this example?

Familiarize yourself with the OSI model. Read the Wikipedia thoroughly, it will probably answer the questions you'll have after reading this answer.

HTTP and TCP aren't alternatives. These protocols work in two different layers. HTTP needs some transport layer protocol. HTTP only defines common "language" for client and server, but not how to send data - that's not a job for application layer. It assumes existence of a reliable transport layer protocol. HTTP is almost always transported over TCP.

HTTP usually uses IP. Again, HTTP as an application layer protocol only defines common language. It doesn't, however, define how client and server are identified and how client specifies which server it wants to talk to. That's a job for IP which is used for addressing clients.

DNS isn't an alternative to IP. DNS doesn't even make much sense without IP. Well, technically it could work just as well with other addressing protocols, but that's what everyone uses nowadays. DNS is an Internet phone book. My IP address is currently 95.155.82.60 and you probably can't remember that. What's more, it will change in 5 minutes, because I'm leaving home and I'll be using mobile connection instead of my Wi-Fi. DNS is a service with a known, unchanging IP address that translates domain names (such as superuser.com) to IP addresses.

So when you type superuser.com:

• Your browser resolves superuser.com to an IP address
• It opens a TCP connection with that IP address
• It sends a HTTP request over that connection

UDP In UDP client is like TCP only but with less reliability and better speed.

More or less. Larger messages are fragmented into bite-sized packets by UDP and TCP. TCP guarantees that all packets arrive and are in correct order, otherwise nothing is received. This can take some time and a few retries. UDP doesn't care.