How to Hide HTML Comments in Your Web Pages
When you design your web page things need to be organized. This includes little notes you make for
yourself as reminders. When you take time to hide HTML comments you recognize where to make changes later. It’s easy to learn with this web design tutorial and will save you time and headaches later!
When viewing the HTML code of a web page, you might notice some strange tags that really stand out throughout the HTML code.
These tags contain words that are not found on the web page when viewing it online. They are hidden HTML comment tags. Here’s an example of how a web designer might hide HTML code using the comment tags.
See the 3 comment tags below. Notice, each tag has a purpose.
What these “hide” tags represent are areas of the HTML code that are not seen by visitors who are looking at your web pages online.
However, your comments can be seen by anyone who views your HTML source code.
So, don’t put any sensitive information here such as passwords, funny stuff or personal information.
The 3 “Hide HTML Code” Tags Explained
Remember, the tags above are fictional. I’m only using these as examples to explain how beneficial it can be to hide HTML code for future reference.
Comment Tag #1 is just a general statement.
Comment Tag #2 states “Navigation menu links start here,” meaning you can quickly locate your navigation menu in your HTML code by looking for this message. If you decide to make a change to your navigation menu six months from now, this comment will still be there. So, you can easily locate the menu codes when you need to make a change.
The Next Comment Tag In Inserting Hidden HTML Comments
Comment Tag #3 states “Articles start here,” which could mean a section of article links begins there or actual article text.
The text within the tags can say anything you want. Change the text only, but leave the tags in tact at the beginning and ending of your comment.
Website Updates Made Easy
As you can see, hiding HTML code for future reference can come in handy when you need to update your web pages. As a beginner, it will help you recognize where your codes are within the HTML code quickly.
Hide HTML Code Step by Step
Step 1: To hide HTML code within your web pages, go to your HTML code with a text editor or HTML editor. Click on “Edit” and “Find.”
Step 2: Type in a word or phrase that would be located near where you need to insert your comment tag.
Step 3: Once you find the spot, insert the comment tag between major HTML tags of the page. Don’t insert it within your other main codes. For example, look for the ending of a major tag by the “/” backward slash. A paragraph would end with the letter “p” preceeded by a backward slash and both within brackets.
Step 4: Next, type one of the comment tags above into your chosen spot and change the text to whatever you want. Be sure it’s something you will recognize later.
Test It Out!
After inserting your comment tag using the instructions above, test it out on the Web. Transfer your web page to your site using FTP.
Go online to look at your page. Be sure that no part of the comment tag appears on your visible web page. If it doesn’t appear – and if nothing else is moved or disorganized – then you have succeeded!
If you’re hesitant about trying this out on your main site pages, then copy one of the main pages into a “test” page, and insert the comment tag on the test page only. Once you know how to hide HTML code in your page successfully, then place the comment tags in your main site pages.
Future Preparation for Website Design
You can never prepare enough when designing a website. Plan before you start. Decide how your web pages will be organized. Get help when you can. Also, be sure and hide HTML code tags early on in a basic template for your website.
Do You Want More Tips Like This One on Adding Hidden Text in Pages?
A good start in getting more tutorials and a class twice to three times weekly is by checking out our web design beginners e-course and free bonus you can get at no charge. It will really be useful in your website design adventure – I guarantee it!
Most web sites are uniform throughout as far as the menu bars and basic layout are concerned. When you save your pages from the template, the comment tags will already be in each page for you.
This will save much time later. Always consider what’s ahead before getting started with your site design. Learn about hidden text and get started with a web design course to learn more.