Cómo añadir comentarios en CSS

comentarios en css

Si te has puesto manos a la obra a crear tu propia página web, es posible que, de primeras, hayas decidido utilizar una plantilla en lugar de ponerte a diseñarla tú mismo (bien porque no tienes mucha idea o porque necesitas una base). En estas plantillas verás que, en ocasiones, hay comentarios en CSS. Y no, por ese nombre no nos estamos refiriendo a los comentarios o textos que ponen los lectores en tu web, sino pequeñas anotaciones que se hacen por parte del desarrollador y que ayudan a saber a qué se refiere cada parte de ese gran código que forma la plantilla (y que hace que la web se vea como es en realidad.

Entonces, ¿sabes lo que son los comentarios CSS? ¿Sabes cómo se pueden hacer? Hoy te explicamos todo para que sepas sobre ellos.

¿Qué son los comentarios?

que son los comentarios CSS

En este caso, no nos vamos a referir a los comentarios entendidos como textos que comentan una noticia y que permiten una interacción entre un usuario y una página web. En concreto, nos estamos refiriendo a aquellos que se ponen entre etiquetas HTML y que visualmente no son visibles, sino que se encuentran en el código de programación de una web, de tal manera que se intenta informar a la persona para qué sirve el código pero sin que esto vaya a reflejarse después en la web (tal cual).

¿Para qué sirven los comentarios?

Lo siguiente que te puedes preguntar es el motivo por el que colocar comentarios en una plantilla, o en cualquier documento de programación. Y es que, aunque no lo creas, esas anotaciones son muy eficaces porque, imagina la siguiente situación: te has puesto a programar una página que te va a llevar varios meses. Haces muchos cambios, programaciones en cada una de las páginas, etc. Y, de repente, cuando echas la vista atrás, te preguntas para qué era ese código que hay ahí puesto. O peor aún, tienes que cambiar un color o un diseño y no sabes dónde está entre todo el código que has puesto. ¿A que sería un lío?

Pues bien, esas anotaciones que haces, a modo de comentarios en programación, te ayudan a recordar el motivo de ese código o a poder ubicarte en el proyecto que tienes entre manos. Así, aunque pasen semanas, meses o años, sabrás cómo lo dejaste todo y a qué se refería cada código que utilizaste.

Otras veces, esos comentarios se utilizan para poder probar ciertos aspectos, para que estos se activen o no en la web dependiendo de si dan error a la hora de usarlos.

Eso sí, que los comentarios no se vayan a ver visualmente no quiere decir que se tenga libertad para escribir cualquier cosa. Y es que, a veces, los comentarios pueden estar fuera de lugar o hacer que tus clientes se sientan ofendidos por lo que pones ahí (o sea una discriminación en toda regla). Así que debes tener cuidado y poner solo lo que realmente es necesario. Porque, aunque no se van a ver, hoy día hay muchos navegadores que permiten explorar el código HTML y, con ello, hacer visibles los comentarios que se hayan puesto.

Cómo poner comentarios CSS

Cómo poner comentarios CSS

El CSS es uno de los lenguajes de programación, quizá uno de los que más se utiliza, junto con el HTML, en páginas web y diseño creativo. Por eso, conocerlo un poco más, es importante. De hecho, el que más vas a utilizar es el CSS3.

Ahora bien, si ya has hecho tus «pinitos» con la programación sabrás que los códigos sirven para «vestir» la estructura y el CSS ayuda a que se vea más atractiva tu web. Pero dentro de ellos, están los comentarios en CSS. Estos son iguales para cualquier lenguaje de programación, si bien se escriben de manera diferente en cada uno de ellos.

¿Cómo se hacen comentarios CSS? Pues para ello necesitas hacer lo siguiente:

  • Abre el comentario con la barra torcida (Shift + 7).
  • A continuación, pon un asterisco.
  • Este es el inicio de tu comentario de tal manera que todo lo que escribas a partir de ese momento no se va a ver en la web visualmente aunque sí estará en el código HTML de la web.
  • Para cerrar el comentario, tienes que poner primero un asterisco y, a continuación, la barra torcida.
  • En ese momento, lo siguiente que escribas sí que afectará visualmente a la web y podrá verse.

Visualmente, el comentario quedaría así:

/* Aquí tienes el comentario que quedaría oculto visualmente en la web */

Si lo has hecho bien, lo más seguro es que te aparezca en gris y no en negro o en otros colores como ocurre con otros códigos. Eso quiere decir que está bien especificado y será un texto que no aparecerá en la web (en la zona donde lo hayas colocado).

Tipos de comentarios en CSS que puedes poner

Tipos de comentarios en CSS que puedes poner

Mientras estás trabajando con el HTML es normal que coloques varios comentarios para poder saber lo que haces o bien para avisarte de que hay partes sin hacer o errores que tienes que arreglar. Sin embargo, después es importante eliminar ese tipo de comentarios que realmente no van a servir para nada. Eso no quiere decir que debas quitarlos todos.

Hay algunos comentarios en CSS que sí se deben quedar. ¿Cuáles? Los siguientes:

  • Comentarios aclaratorios. Son comentarios CSS que ayudan a explicar algo concreto. Por ejemplo, el tamaño de las imágenes en la sección concreta para que sepas qué imágenes deben usar.
  • Comentarios de bloques. Es decir, las anotaciones que se hacen para delimitar cada sección o parte de una web: el footer, el header, etc.
  • CSS deshabilitado. Con esto tienes que tener cuidado porque has de asegurarte que está deshabilitado pero que puede funcionar correctamente en caso de que se quiera volver a utilizar. Por ejemplo, imagina que tienes una web y va muy lenta. Entonces decides inhabilitar el slider que has colocado de primeras y ver si mejora la web. Si es así, podrías volver a ponerlo en cualquier momento una vez se solucione el problema.
  • Comentarios de créditos. Finalmente, puedes querer dejar los comentarios que hacen referencia a la persona que ha creado el código, o la versión que tiene la web que has hecho, de tal forma que puedas ir evolucionando o le des crédito a la persona que ha hecho el trabajo (aunque no se vea visualmente en algunos casos.

El contenido del artículo se adhiere a nuestros principios de ética editorial. Para notificar un error pincha aquí.

Sé el primero en comentar

Deja tu comentario

Tu dirección de correo electrónico no será publicada.

*

*

  1. Responsable de los datos: Miguel Ángel Gatón
  2. Finalidad de los datos: Controlar el SPAM, gestión de comentarios.
  3. Legitimación: Tu consentimiento
  4. Comunicación de los datos: No se comunicarán los datos a terceros salvo por obligación legal.
  5. Almacenamiento de los datos: Base de datos alojada en Occentus Networks (UE)
  6. Derechos: En cualquier momento puedes limitar, recuperar y borrar tu información.