If you have started to create your own website, you may have decided to use a template in the first place instead of starting to design it yourself (either because you don't have much idea or because you need a base). In these templates you will see that sometimes there are comments in CSS. And no, by that name we are not referring to the comments or texts that readers put on your website, but small annotations that are made by the developer and that help to know what each part of that great code that forms refers to. the template (and what makes the web look like it really is.
Then, Do you know what CSS comments are? Do you know how they can be done? Today we explain everything so that you know about them.
What are comments?
In this case, we are not going to refer to comments understood as texts that comment on a news item and that allow interaction between a user and a web page. Specifically, we are referring to those that are placed between HTML tags and that are not visually visible, but are found in the programming code of a website, in such a way that an attempt is made to inform the person what the code is for but without this being reflected later on the web (as is).
What are the comments for?
The next thing you may ask yourself is the reason to put comments in a template, or in any programming document. And it is that, believe it or not, these annotations are very effective because, imagine the following situation: you have started to program a page that is going to take you several months. You make a lot of changes, schedules on each of the pages, etc. And all of a sudden, when you look back, you wonder what that code that's on there was for. Or even worse, you have to change a color or a design and you don't know where it is among all the code you have put in. What would be a mess?
Well, Those annotations that you make, as comments in programming, help you to remember the reason for that code or to be able to locate yourself in the project what you have in your hands. Thus, even if weeks, months or years go by, you will know how you left everything and what each code you used referred to.
Other times, these comments are used to test certain aspects, so that they are activated or not on the web depending on whether they give an error when using them.
Of course, that the comments are not going to be seen visually does not mean that you have the freedom to write anything. And, sometimes, the comments can be out of place or make your clients feel offended by what you put there (that is, full-blown discrimination). So you have to be careful and put only what is really necessary. Because, although they will not be seen, today there are many browsers that allow you to explore the HTML code and, with it, make the comments that have been placed visible.
How to put CSS comments
CSS is one of the programming languages, perhaps one of the most widely used, along with HTML, in web pages and creative design. Therefore, knowing him a little more is important. In fact, the one you are going to use the most is CSS3.
Now, if you have already done your "first steps" with the programming, you will know that the codes are used to "dress" the structure and the CSS helps make your website look more attractive. But within them are the CSS comments. These are the same for any programming language, although they are written differently in each of them.
How do you make CSS comments? Well, for this you need to do the following:
- Open the comment with the crooked slash (Shift + 7).
- Then put an asterisk.
- This is the beginning of your comment in such a way that everything you write from that moment on will not be seen on the web visually, although it will be in the HTML code of the web.
- To close the comment, you have to first put an asterisk and then the crooked slash.
- At that time, the next thing you write will visually affect the web and it will be visible.
Visually, the comment would look like this:
/ * Here is the comment that would be visually hidden on the web * /
If you have done it correctly, it is most likely that it will appear in gray and not in black or in other colors as it happens with other codes. That means that it is well specified and it will be a text that will not appear on the web (in the area where you have placed it).
Types of comments in CSS that you can put
While you are working with the HTML it is normal that you put several comments to be able to know what you are doing or to warn you that there are parts without doing or errors that you have to fix. However, afterwards it is important to eliminate those types of comments that are not really going to be of any use. That doesn't mean you should remove them all.
There are some CSS comments that should stick around. Which? The following:
- Clarifying comments. They are CSS comments that help explain something specific. For example, the size of the images in the specific section so you know which images to use.
- Block Comments. That is, the annotations that are made to delimit each section or part of a website: the footer, the header, etc.
- CSS disabled. With this you have to be careful because you have to make sure that it is disabled but that it can work correctly in case you want to use it again. For example, imagine that you have a website and it is very slow. Then you decide to disable the slider that you placed first and see if it improves the web. If so, you could put it back at any time after the problem is fixed.
- Credit comments. Finally, you may want to leave comments that refer to the person who created the code, or the version of the website that you have made, so that you can evolve or give credit to the person who has done the work ( although it is not visually visible in some cases.