Visual Studio Code. Perfil recomendado para el curso Páginas web HTML y hojas de estilo CSS
Visual Studio Code permite utilizar perfiles, lo que permite cambiar de forma sencilla entre distintas configuraciones (extensiones instaladas, preferencias, tareas, atajos y aspecto del interfaz). Además, los perfiles se pueden compartir, lo que facilita la puesta a punto del editor en distintos ordenadores. Por desgracia, los perfiles todavía tienen algunas limitaciones, por lo que la configuración a veces no puede ser completamente automática y requiere algunos pasos finales manuales.
En esta lección se comenta cómo instalar un perfil que corresponde a la Configuración recomendada para seguir este curso de HTML y CSS. Consulte esa lección para conocer todo lo que incluye este perfil.
La URL del perfil recomendado para seguir estos apuntes en Windows es: https://gist.github.com/BartolomeSintes/7290b128a95f302d47a45e189236ce1a (actualizado el 8 de octubre de 2026).
Una vez creado y seleccionado el perfil en Visual Studio Code, no se requieren ajustes adicionales.
Para importar el perfil de Visual Studio Code recomendado para este curso ...
Haga clic en la rueda dentada situada abajo a la izquierda y elija la opción Perfiles:
Se abrirá la pestaña o la ventana de administración de los perfiles (con el título Perfiles):
Haga clic en el triángulo situado a la derecha en el botón "Nuevo perfil" y elija la opción Importar perfil ...:
Se abrirá una caja de texto para escribir la URL del perfil compartido:
Copie la URL del perfil recomendado para seguir estos apuntes en Windows: https://gist.github.com/BartolomeSintes/7290b128a95f302d47a45e189236ce1a (actualizado el 8 de octubre de 2026).
Pegue el enlace en la caja de texto y pulse Intro:
Se mostrará el nuevo perfil en la lista de perfiles de la izquierda y la información sobre el contenido del perfil en la parte dercha de la ventana:
El nombre del perfil se mostrará en una caja de texto:
Ese nombre se puede cambiar, por ejemplo, por un nombre más corto. Es aconsejable que el nombre de cada perfil empiece de forma distinta (el motivo se explica en el apartado siguiente, al seleccionar el perfil). Para terminar, haga clic en el botón "Crear".
Si el perfil contiene referencias a extensiones a las que nunca se ha dado permiso sde mostrará un aviso para hacerlo. Haga clic en el botón "Confiar en publicadores e instalar" para instalar las extensiones incluidas en el perfil.
El perfil creado se mostrará en la lista de perfiles del lado izquierdo. Los detalles del perfil se muestran en el lado derecho. Fíjese en que al crear un perfil este no se selecciona automáticamente (en la captura, el perfil seleccionado sigue siendo el perfil predeterminado).
Este perfil no requiere ajustes adicionales, pero para ser utilizado debe activarse en alguna carpeta o área de trabajo.
Con el Explorador de archivos de Windows, cree la carpeta Documentos > LMSGI > HTMLCSS (el nombre de esta carpeta puede contener mayúsculas):
Cree las carpetas Documentos > LMSGI > HTMLCSS > ejercicios y Documentos > LMSGI > HTMLCSS > pruebas (se recomienda que los nombres de estas carpetas no contengan mayúsculas):
En Visual Studio Code, elija la opción de menú Archivo > Abrir carpeta ...:
Seleccione la carpeta Documentos > LMSGI > HTMLCSS:
Desde la versión 1.57 (mayo 2021) Visual Studio Code incluye un administrador de confianza (Workspace Trust). Visual Studio Code sólo ejecutará archivos cuando se haya indicado que se confía en ellos. La primera vez que se abre una carpeta, Visual Studio Code pregunta si se confía en el contenido de esa carpeta. Haga clic en"Administrar" o en "Modo restringido":
Se muestra una ventana en la que se indica el modo actual (restringido). Para indicar que confía en la carpeta, haga clic en "Confiar":
La ventana indicará el cambio del modo. Cierre la ventana para empezar a trabajar en la carpeta:
Haga clic en el icono Explorador en la barra de actividades para ver el contenido de la carpeta elegida. El nombre de la carpeta se mostrará en la parte superior derecha de la barra de actividades:
Seleccionar el perfil recomendado
Para seleccionar el perfil de Visual Studio Code recomendado para este curso ...
Haga clic en la rueda dentada y elija la opción Perfil. (en la opción Perfil se muestra entre paréntesis el nombre del perfil actualmente seleccionado, que en este caso es el perfil Predeterminado). Se mostrará la lista de pefiles disponible, con una marca en el perfil actualmente seleccionado:
Haga clic en el nombre de perfil que desee seleccionar:
Inmediatamente se activará el perfil que puede modificar algunos elementos del interfaz. En la rueda dentada se muestran las dos primeras letras del nombre del perfil seleccionado (HT en este caso), salvo que el perfil tenga un icono asociado en cuyo caso la rueda dentada se sustituirá por el icono. Esto permite en cualquier momento comprobar el perfil seleccionado.
Si hubiera ambigüedad porque varios perfiles comenzaran por las mismas dos letras, haciendo clic en la rueda dentada, el menú muestra el nombre completo del perfil seleccionado, lo que permite asegurarse de cuál es el perfil seleccionado.
La selección del perfil debe repetirse cada vez que abra por primera vez una carpeta o un área de trabajo. VSCode recuerda la selección.
Para completar la configuración de un perfil, como se comenta en los apartados siguientes, es necesario activar el perfil correspondiente.