Google Fonts を 2 つ以上読み込む場合は、| を使ってねと Google Fonts のガイドは推奨しています。
例えば Bellefair と Roboto を読み込む時は、| で 2 つのフォント名を区切り指定します。
<link href="https://fonts.googleapis.com/css?family=Bellefair|Roboto&display=swap" rel="stylesheet">これで 1 つの <link> タグで、2 つの Google Fonts を読み込めます。
もちろん 3 つ以上も可能。
<link href="https://fonts.googleapis.com/css?family=Bellefair|Joti+One|Roboto&display=swap" rel="stylesheet">ただ、| を使うと、W3C の HTML 文法チェッカーで下記のエラーが出ます。
Error: Bad value https://fonts.googleapis.com/css?family=Bellefair|Roboto&display=swap for attribute href on element link: Illegal character in query: | is not allowed.
| は、許可されていない不正な文字だと指摘されます。
この HTML 文法エラーを回避するには、| ではなく URL エンコードした %7C を使います。
<link href="https://fonts.googleapis.com/css?family=Bellefair%7CRoboto&display=swap" rel="stylesheet">これで 1 つの <link> タグで、複数の Google Fonts を HTML 文法エラーを出さずに読み込めます。
気をつけたいのが、Google Fonts の公式サイトで 2 つ以上のフォントを選んだ時に | を使った <link> タグを生成されること。
| が使われた <link> タグそのまま使えば、文法エラーになってしまいます。