A tab is a way of separating content, yet keeping it easy to flick from one piece to another, similar to the labels in a binder.
In a web browser's main application, the tabbed areas are completely separate web pages. In a web page, though, the information is usually related, for example various pages of a form.
An accordion is similar to a tab. It separates parts of related data so that only one piece of data is visible at a time. Throughout the chapter, when I speak about tabs, the same information can usually be applied to accordions as well.
The main visual difference between the two is that, with tabs, the handles for flicking between the various pages of data are kept either horizontally or vertically along an edge of the tabbed area. However, with accordions, the handles are more akin to chapter headings, as they are shown interleaved with the pages.
Another visual difference is that with a tab, the tabbed area immediately shifts to the newly selected area...