Which link tag to copy from google font out of the three link tags it give?-CodePudding

In order to add the google font into the site, it gives 3 link tags after selecting your preferred font. For example, if I want to embed Merriweather. The link tags it give are as follows

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Merriweather:ital@1&display=swap" rel="stylesheet">

What are these 3 tags? and which one should I copy and paste in my head element?

CodePudding user response：

In short... You load them all, and the first two improve the speed and efficiency of loading font or fonts and, consequently, also improve the performance of Your website.

https://www.cdnplanet.com/blog/faster-google-webfonts-preconnect/

https://www.w3.org/TR/resource-hints/#preconnect

The third one We do not need to explain ..:-D I hope So :P

I hope this helps You :-) Best Regards !

CodePudding user response：

Use the third one and then you have to specify the font-family CSS. checkout this link https://codeburst.io/intro-to-google-fonts-for-web-developers-5559b63807d3