Esta tarde me percate de algo curioso que pasa en VSCode.
Cuando trabajamos con HTML podemos usar el atajo HTML:5 para que el editor cree por nosotros una estructura básica y empezar a trabajar.
Dicha estructura es la siguiente:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
No esta nada mal, pero dentro del head podemos agregar algunas etiquetas meta y link para complementar un poco más el documento y que se vea más profesional.
La etiqueta <meta>
Contienen metadatos que no se ven en la web final pero que le sirven al documento para que se indexe mejor.
Por ejemplo:
<meta name="author" content="Cristian Fernando">
Podriamos poner el autor de la página.
Y también una breve descripción de lo que la página contiene:
<meta name="description" content="pagina web de prueba">
La etiqueta <link>
Útil para enlazar css:
<link rel="stylesheet" href="" type="text/css">
Importante poner
type="text/css"ya que VSCode no lo hace por defecto.
Y también para poder establer un icon:
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
La estructura mejorada se veria así:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="Cristian Fernando">
<meta name="description" content="pagina web de prueba">
<link rel="stylesheet" href="" type="text/css">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<title>Document</title>
</head>
<body>
</body>
</html>
Quiza hay alguna manera que VSCode cree por defecto una página similar a esta, podriamos crear nuestro propios shortcuts también. Ya que da criterio de uno.
Top comments (0)