Commit 964906a9 authored by Eugen Rochko's avatar Eugen Rochko

Add page about federation

parent 2ba3a9e7
Pipeline #262 passed with stages
in 27 seconds
---
title: Decentralization
menu:
docs:
parent: usage
weight: 2
---
Mastodon is a **federated** social network.
## What is federation?
**Federation** is a form of decentralization. Instead of a single central node that all people use, there are multiple nodes, that any number of people can use.
|Grade of centralization|Examples|
|:---------------------:|--------|
|Centralized|Twitter, Facebook, Instagram|
|Federated|E-mail, XMPP|
|Distributed|BitTorrent, IPFS, Scuttlebutt|
A Mastodon server can operate alone. Just like a traditional website, people sign up on it, post messages, upload pictures and talk to each other. *Unlike* a traditional website, Mastodon servers can interoperate, letting their users communicate with each other, just like you can send an e-mail from your GMail address to someone from Outlook.
In practical terms: Imagine if you could follow an Instagram user from your Twitter account and comment on their photos without leaving your account. If Twitter and Instagram were federated services, that would be possible.
## The fediverse
Mastodon uses a standartized, open protocol to implement federation. It is called ActivityPub. Any software that likewise implements federation via ActivityPub can seamlessly communicate with Mastodon, just like Mastodon servers communicate with one another.
The **fediverse** ("federated universe") is the name for all servers that can communicate with each other. That includes all Mastodon servers, but also other implementations:
- Misskey
- Pleroma
- PeerTube
- Plume
- and many more
The fediverse does not have its own brand, so you will more often hear "follow me on Mastodon" than "follow me on the fediverse", but technically the latter is more correct.
## Practical implications
### Addressing people
Mastodon usernames actually consist of two parts:
- The local username, e.g. `alice`
- And the domain of the server, e.g. `example.com`
Just like an e-mail address. For convenience sake, Mastodon allows you to skip the second part when addressing people on the same server as you, but you have to keep in mind when sharing your username with other people, you need to include the domain or they won't be able to find you as easily.
|{{< no >}}|{{< yes >}}|
|:--------:|:---------:|
|I'm @alice on Mastodon!|I'm @alice@example.com on Mastodon!|
The search form in Mastodon will find people either with the above address form, or the link to the person's profile, so you can share that instead if you prefer.
### Following people
As long as you encounter a person within your app's user interface, e.g. the web interface on your home server, or your mobile app, you can just click "follow" and you won't notice a difference if that person is on your server or not.
However if you come across someone's public profile hosted on a different server, there's an obstacle: That server sees you as just another anonymous visitor.
So when you click "follow", a dialog will pop up asking you to enter your own full username (with the domain part, most importantly). This way, the dialog actually sends you back to your home server, where you are logged in and can really do stuff.
You will also notice that dialog when clicking on "reply", "boost" or "favourite" on public pages of other servers.
......@@ -3,7 +3,7 @@ title: Privacy
menu:
docs:
parent: usage
weight: 1
weight: 3
---
## Publishing levels
......
......@@ -7,7 +7,7 @@
</a>
<p class="legal" style="float: right; text-align: right">
<a href='https://joinmastodon.org'>Join Mastodon</a> · <a href='https://bridge.joinmastodon.org'>Find Twitter friends</a> · <a href='https://mastodon.social/@Mastodon' target='_blank'><i class='fab fa-mastodon'></i></a> · <a href='https://twitter.com/MastodonProject' rel='nofollow' target='_blank'><i class='fab fa-twitter'></i></a> · <a href='https://facebook.com/joinmastodon' rel='nofollow' target='_blank'><i class='fab fa-facebook'></i></a>
<a href='https://joinmastodon.org'>Join Mastodon</a> · <a href='https://bridge.joinmastodon.org'>Find Twitter friends</a> · <a href='https://blog.joinmastodon.org'>Blog</a> · <a href='https://mastodon.social/@Mastodon' target='_blank'><i class='fab fa-mastodon'></i></a> · <a href='https://twitter.com/MastodonProject' rel='nofollow' target='_blank'><i class='fab fa-twitter'></i></a> · <a href='https://facebook.com/joinmastodon' rel='nofollow' target='_blank'><i class='fab fa-facebook'></i></a>
</p>
<p class="legal"><a href='https://source.joinmastodon.org/mastodon/docs/tree/master/content/{{.Lang}}/{{.File.Path}}'>View source</a> · <a href='https://creativecommons.org/licenses/by-sa/4.0/'>CC BY-SA 4.0</a> · <a href='https://joinmastodon.org/imprint'>Imprint</a></p>
......
......@@ -340,4 +340,46 @@ main .mastodon-embed {
color: #fff;
font-size: 16px; }
.cta-banner {
background: #2b90d9;
border-radius: 4px;
text-align: center;
padding: 40px; }
.cta-banner h4 {
font-size: 24px;
line-height: 1.08;
font-weight: 600;
margin-bottom: 20px;
color: #fff; }
.cta-banner p {
color: #fff;
font-size: 18px;
line-height: 1.22;
margin-bottom: 20px; }
.cta-banner > a {
font-weight: 500;
color: #2b90d9;
background: #fff;
border-radius: 4px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
font-family: inherit;
display: inline-block;
text-align: center;
font-size: 16px;
text-decoration: none;
line-height: 36px;
padding: 4px 16px;
margin: 0 auto;
border: 0;
cursor: pointer; }
.cta-banner > a.secondary {
padding: 2px 14px;
border: 2px solid #fff;
background: transparent;
margin-left: 4px;
color: #fff; }
@media screen and (max-width: 375px) {
.cta-banner > a {
margin-bottom: 10px; } }
/*# sourceMappingURL=style.css.map */
This diff is collapsed.
......@@ -478,3 +478,55 @@ main {
font-size: 16px;
}
}
.cta-banner {
background: $vibrant;
border-radius: 4px;
text-align: center;
padding: 40px;
h4 {
font-size: 24px;
line-height: 1.08;
font-weight: 600;
margin-bottom: 20px;
color: #fff;
}
p {
color: #fff;
font-size: 18px;
line-height: 1.22;
margin-bottom: 20px;
}
& > a {
font-weight: 500;
color: $vibrant;
background: #fff;
border-radius: 4px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
font-family: inherit;
display: inline-block;
text-align: center;
font-size: 16px;
text-decoration: none;
line-height: 36px;
padding: 4px 16px;
margin: 0 auto;
border: 0;
cursor: pointer;
&.secondary {
padding: 2px 14px;
border: 2px solid #fff;
background: transparent;
margin-left: 4px;
color: #fff;
}
@media screen and (max-width: 375px) {
margin-bottom: 10px;
}
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment