Very short trick: rendere invisibili i commenti HTML

Commentare codice HTML è una prassi durante le prime fasi di sviluppo Web. Tuttavia il codice commentato rimane visibile all’interno della pagina, anche se viene ignorato dal browser. Selezionando “Visualizza Sorgente” o “Visualizza Codice” dal nostro browser, saremo sempre in grado di vederlo. I commenti in HTML si applicano utilizzando la sintassi:

1
2
3
4
5
<p>Visibile</p>
<!--
Sono un commento
-->
<p>Visibile</p>

All’interno dei marcatore <!-- e --> è possibile inserire – quindi commentare – sezioni HTML:

1
2
3
4
5
6
7
<p>Visibile</p>
<!--
<div class="right">
   <p>Commentato</p>
</div>
-->
<p>Visibile</p>

Come detto sopra, la parte di codice commentata, quella compresa tra le marcature <!-- e -->, è visibile perchè inviata comunque dal web server a noi client. Il ché produce sicuramente due svantaggi:

  • Il codice HTML è visibile, quando vorrei rimanesse nascosto perchè riguarda sezioni demo o di futura implementazione
  • Le sezioni commentate – se corpose – appesantiscono inutilmente la pagina; sono inviate ma non processate

Un piccolo trucco/consiglio se si ha a disposizione un linguaggio server-side, come PHP o ASP, è quello che utilizzare le procedure di commento di questi ultimi per commentare codice HTML. Tornando agli esempi di sopra, se avete a disposizione PHP si potrebbe usare:

1
2
3
4
5
6
7
<p>Visibile</p>
<?php /*
<div class="right">
    <p>Commentato</p>
 </div>
*/ ?>
<p>Visibile</p>

In pratica invece di usare la coppia <!-- e -->, si usa la coppia <?php /* e */ ?>.
In questo caso, infatti, la pagina viene processata dal vostro server-side-language (PHP o ASP) prima di essere inviata al browser-client. Così facendo il commento PHP viene a scomparire nella nostra pagina e non inviato al browser ma, ovviamente, sempre presente nei sorgenti. :)

Non ci sono commenti per questo Post

Lascia un commento

TAG XHTML PERMESSI: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> INSERIMENTO CODICE:
<pre></pre> // blocco generico
					<code></code> // blocco generico
					[cc_actionscript][/cc_actionscript] // Actionscript
					[cc_actionscript3][/cc_actionscript3] // Actionscript 3
					[cc_css][/cc_css] // CSS Style Sheet
					[cc_html][/cc_html] // HTML
					[cc_js][/cc_js] // Javascript
					[cc_objc][/cc_objc] // Objective-C
					[cc_php][/cc_objc] // PHP
					[cc_sql][/cc_sql] // SQL


Stop SOPA