{"id":328,"date":"2011-06-02T16:19:08","date_gmt":"2011-06-02T16:19:08","guid":{"rendered":"http:\/\/wiki2.professionearchitetto.it\/il-codice-html-e-come-funziona-una-pagina-web\/"},"modified":"2011-06-02T16:19:08","modified_gmt":"2011-06-02T16:19:08","slug":"il-codice-html-e-come-funziona-una-pagina-web","status":"publish","type":"post","link":"https:\/\/www.professionearchitetto.it\/wiki\/il-codice-html-e-come-funziona-una-pagina-web\/","title":{"rendered":"Il codice HTML e come funziona una pagina web"},"content":{"rendered":"<p>Una <a rel=\"nofollow\" target=\"_blank\" class=\"external text\" href=\"http:\/\/it.wikipedia.org\/wiki\/Pagina_Web\">pagina web<\/a> \u00e8 una pagina del World Wide Web con collegamenti ipertestuali che abilitano la navigazione da una pagina o una sezione all&#8217;altra. <\/p><p>Pi\u00f9 pagine web collegate fra loro, ed ospitate sullo stesso server web, costituiscono un <b>sito web<\/b>. <\/p><p>Le pagine web di solito sono file di testo scritti in un <b>linguaggio HTML<\/b>, un codice che permette di definire la modalit\u00e0 di presentazione grafica della pagina, la struttura del testo, la\u00a0 fonte e la dimensione dei caratteri, la presenza di immagini, di video, etc. <\/p><p>A differenza di un file di Word o di un PDF, le pagine web NON contengono fisicamente immagini, o video, ma solo dei riferimenti a file esterni; un meccanismo simile agli XREF di AutoCAD. Le pagine web contengono quindi solo il testo e le informazioni sull&#8217;impaginazione. Immagini, animazioni e video sono file a parte. <\/p><p>La sintassi del linguaggio <a rel=\"nofollow\" target=\"_blank\" class=\"external text\" href=\"http:\/\/it.wikipedia.org\/wiki\/HTML\">HTML<\/a> \u00e8 costituita principalmente da elementi detti <i>Tag<\/i> che definiscono la struttura grafica della pagina; i Tag sono dei codici convenzionali racchiusi da un segno di maggiore e minore (&lt;tag&gt;).&lt;\/tag&gt; <\/p> <table id=\"toc\" class=\"toc\"><tr><td><div id=\"toctitle\"><h2>Indice<\/h2><\/div> <ul> <li class=\"toclevel-1 tocsection-1\"><a href=\"#formattazione_di_base\"><span class=\"tocnumber\">1<\/span> <span class=\"toctext\">formattazione di base<\/span><\/a><\/li> <li class=\"toclevel-1 tocsection-2\"><a href=\"#i_Link\"><span class=\"tocnumber\">2<\/span> <span class=\"toctext\">i Link<\/span><\/a><\/li> <li class=\"toclevel-1 tocsection-3\"><a href=\"#le_Immagini\"><span class=\"tocnumber\">3<\/span> <span class=\"toctext\">le Immagini<\/span><\/a><\/li> <li class=\"toclevel-1 tocsection-4\"><a href=\"#Struttura_del_testo\"><span class=\"tocnumber\">4<\/span> <span class=\"toctext\">Struttura del testo<\/span><\/a><\/li> <\/ul> <\/td><\/tr><\/table> <h2> <span class=\"mw-headline\" id=\"formattazione_di_base\"> formattazione di base <\/span><\/h2> <hr style=\"height: 2px; width: 100%;\"\/> <p>i TAG <b>&lt; b &gt;<\/b> o <b>&lt; strong &gt;<\/b> indicano un testo in grassetto. <\/p><p>es.  <\/p><p><code>L'agile &lt; b &gt;volpe bruna&lt; \/b &gt; salt\u00f2 sul cane infingardo.<\/code> <\/p><p>viene visualizzata in questo modo:  <\/p><p>L&#8217;agile <b>volpe bruna<\/b> salt\u00f2 sul cane infingardo. <\/p> <hr style=\"height: 2px; width: 100%;\"\/> <p>i TAG <b>&lt; i &gt;<\/b> o <b>&lt; em &gt;<\/b> indicano un testo in corsivo. <\/p><p>es.  <\/p><p><code>L'agile &lt; i &gt;volpe bruna&lt; \/i &gt; salt\u00f2 sul cane infingardo.<\/code> <\/p><p>viene visualizzata in questo modo:  <\/p><p>L&#8217;agile <i>volpe bruna<\/i> salt\u00f2 sul cane infingardo. <\/p> <hr style=\"height: 2px; width: 100%;\"\/> <p>in combinazione: <\/p><p><code>L'agile &lt; i &gt;<\/code><code>&lt; b &gt;<\/code><code>volpe bruna<\/code><code>&lt; \/b &gt;<\/code><code>&lt; \/i &gt; salt\u00f2 sul cane infingardo.<\/code> <\/p><p>viene visualizzata in questo modo:  <\/p><p>L&#8217;agile <i><b>volpe bruna<\/b><\/i> salt\u00f2 sul cane infingardo. <\/p> <hr style=\"height: 2px; width: 100%;\"\/> <p>Avrete notato che questi tag hanno una notazione di apertura (b) e chiusura (\/b).  <\/p><p>In questo modo si delimita il testo che andr\u00e0 visualizzato in grassetto. <\/p> <h2> <span class=\"mw-headline\" id=\"i_Link\"> i Link <\/span><\/h2> <p>Un tag fondamentale \u00e8 quello che permette di collegare una pagina ad un&#8217;altra. <\/p><p>&lt; a href=&#8221;<i>indirizzo della pagina<\/i>&#8221; &gt;testo visualizzato&lt; \/a &gt; <\/p> <h2> <span class=\"mw-headline\" id=\"le_Immagini\"> le Immagini <\/span><\/h2> <p>&lt; img src=&#8221;<i>indirizzo del file<\/i>&#8221; width=&#8221;<i>larghezza<\/i>&#8221; height=&#8221;<i>altezza<\/i>&#8221; \/&gt; <\/p> <h2> <span class=\"mw-headline\" id=\"Struttura_del_testo\">Struttura del testo<\/span><\/h2> <p>Questo gruppo di tag ha la funzione di definire le varie parti del contenuto della pagina. <\/p><p><b>&lt; br \/&gt;<\/b> a capo semplice <\/p><p><b> &lt; p &gt; &#8230; &lt; \/p &gt; <\/b>paragrafo <\/p><p><b> &lt; h1 &gt; &#8230; &lt; \/h1 &gt;<\/b> titolo 1 (di solito \u00e8 il titolo della pagina, ce ne dovrebbe essere solo uno per pagina) <\/p><p><b> &lt; h2 &gt; &#8230; &lt; \/h2 &gt;<\/b> titolo 2 (di solito \u00e8 il titolo dei capitoli o dei paragrafi) <\/p><p><b> &lt; h3 &gt; &#8230; &lt; \/h3 &gt; &lt; h4 &gt; &#8230; &lt; \/h4 &gt;<\/b> titolo 3, 4 etc. <\/p><p><b> &lt; ul &gt; &lt; li &gt; &#8230; &lt; \/li &gt; &lt; \/ul &gt;<\/b> Elenchi puntati <\/p><p><b> &lt; ol &gt; &lt; li &gt; &#8230; &lt; \/li &gt; &lt; \/ol &gt;<\/b> Elenchi numerati <\/p><p>Non hanno solo una funzione grafica, ma soprattutto servono a definire una struttura gerarchica del testo. \u00c8 un aspetto da non sottovalutare, perch\u00e9 i motori di ricerca valutano l&#8217;importanza delle sezioni di testo contenute nella pagina anche in funzione dei tag indicatori. <\/p> <!-- Tidy found serious XHTML errors -->  <!--  NewPP limit report Preprocessor node count: 19\/1000000 Post-expand include size: 0\/2097152 bytes Template argument size: 0\/2097152 bytes Expensive parser function count: 0\/100 -->  <!-- Saved in parser cache with key wikidb-mw_:pcache:idhash:794-0!*!*!!it!*!* and timestamp 20130404090254 --> ","protected":false},"excerpt":{"rendered":"<p>Una pagina web \u00e8 una pagina del World Wide Web con collegamenti ipertestuali che abilitano la navigazione da una pagina o una sezione all&#8217;altra. Pi\u00f9 pagine web collegate fra loro, ed ospitate sullo stesso server web, costituiscono un sito web. Le pagine web di solito sono file di testo scritti in un linguaggio HTML, un [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":{"0":"post-328","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-w"},"views":1982,"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.professionearchitetto.it\/wiki\/wp-json\/wp\/v2\/posts\/328","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.professionearchitetto.it\/wiki\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.professionearchitetto.it\/wiki\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.professionearchitetto.it\/wiki\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.professionearchitetto.it\/wiki\/wp-json\/wp\/v2\/comments?post=328"}],"version-history":[{"count":0,"href":"https:\/\/www.professionearchitetto.it\/wiki\/wp-json\/wp\/v2\/posts\/328\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.professionearchitetto.it\/wiki\/wp-json\/wp\/v2\/media?parent=328"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.professionearchitetto.it\/wiki\/wp-json\/wp\/v2\/categories?post=328"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.professionearchitetto.it\/wiki\/wp-json\/wp\/v2\/tags?post=328"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}