On sharing a website link like Google it gives an image and short text
I have seen websites that have an image instead of the link icon and a description at the bottom Like can anyone tell which HTML tags I can use for this?
CodePudding user response：
Meta tags
The meta tag contains information about the document. Google understands a standard set of meta tags. You can use custom meta tags to provide Google with additional information about your pages. Google can use this information to create rich snippets or enable sorting of search results.
For example, adding the following meta tags to your documents lets you categorize documents by department, audience, and document status.
Adding a meta tag like the following will allow users to sort search results (sorting works only for numeric values):
<meta name="rating" content="5" />Each content attribute can contain up to 1,024 characters. Programmable Search Engine will process up to 50 meta tags per page, but it’s a good idea to keep the number much smaller and more manageable. Programmable Search Engine does do some processing when coverting meta tag content to PageMaps. To check that Google can correctly interpret your meta tags, use the rich snippets testing tool.
Google already recognizes the content of the following meta tags, and won’t use them for sorting, biasing, and filtering search results:
https://support.google.com/programmable-search/answer/2595557?hl=en
CodePudding user response：
Meta tags are the reasons that you can see images and descriptions of websites on Google, Twitter, Facebook, etc. They describe metadata of the page, and usually have a name and content attributes. They go into the <head> section of an HTML document.
Basic meta tags:
<meta charset="utf-8"> <!-- Declare character set for the rest of the page -->
<meta name="description" content="Description of my page"> <!-- Describe your page for crawlers (Google, Bing, Twitter, etc.) -->
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- This lets your page appear scaled for mobile viewers -->
<meta name="author" content="Author"> <!-- Author -->
<meta name="copyright" content="Copyright owner"> <!-- Copyright holder -->
<meta name="robots" content="noindex"> <!-- Don't let search engines index this page -->
Resources: