Mit der Definition "Arial" wird bei Websites die Anweisung gegeben, die auf dem Gerät installierte "Standardschrift" Arial zu verwenden. Das funktioniert bei Windows-, nicht aber beispielsweise auf Apple-Geräten.
Deshalb werden normalerweise "Font-Familien" verwendet. Im Fall von Arial beispielsweise:
font-family: Arial, Helvetica, sans-serif;
Damit können "fallbacks" definiert werden. Das heisst: Ist Arial nicht vorhanden, wird Helvetica verwendet, und ist auch Helvetica nicht vorhanden, wird eine Schrift ohne Serifen verwendet.
Webfonts dagegen erlauben es, eine Schrift unabhängig vom Gerät beziehungsweise von auf dem Gerät installierten Schriften zu verwenden.
Weitere Informationen zu Webfonts findest Du hier:
https://cms-basics.ch/webfonts/