Don't confuse Office Add-ins(your first link) and SharePoint Add-ins(your second link) they have absolutely nothing in common.
Office Add-ins
Office Add-ins is a way to add capabilities to the Office clients (Word, Excel, PowerPoint, and Outlook) by having a manifest pointing to a web page (this could be a SharePoint page if you want it).
This requires a new "App", that really only is the manifest.
The manifest points to the same url for all usages in clients, so there is no concept of a app site. Which also means that if you want to store data from multiple users/companies, then you need to figure out how to keep them separated.
But there is also no concept of a web part in here.
SharePoint Add-ins
SharePoint Add-ins is a way to add capabilites to SharePoint sites without creating security and performance problems (for the SharePoint site/server).
This requires a new "App" which is a zip-file with the extension .app, which contains at least a manifest file (but maybe more).
One of the ways a SharePoint Add-in can show information is by implementing a Client web part.
SharePoint Add-ins can be hosted in two ways:
Provider Hosted
In a Provider Hosted add-in the manifest points to the same url(s) for all usages in sites, so there is no concept of a app site. Which also means that if you want to store data from sites, then you need to figure out how to keep them separated.
And you need to provide a hosting for the pages pointed to by the manifest somewhere. (And you might call this a app site)
SharePoint Hosted
In a SharePoint Hosted add-in app file contains a wsp-file to create a app site and the manifest contains tokens so the url(s) are separate for each usage in sites. Which means that storing data separately is handled for you.
App less web parts
If you want to implement a web part without creating an app and a separate site of any kind then you might want to look at some Client Side implementation like Widget Wrangler which was presented in this Pnp Web Cast.