Iniziare con il tuo sito web può essere un compito scoraggiante. Questo è particolarmente vero se hai esperienza limitata con la creazione di siti web. Per aiutarti a iniziare, Dynadot fornisce hosting gratuito di una pagina con ogni acquisto di dominio. Il nostro hosting a una pagina include una "wizard" per aiutare le persone che non conoscono l'HTML a costruire i propri siti web. Tuttavia, la nostra procedura guidata non ti permette di fare così tanto per il tuo sito come fa l'HTML, quindi ecco alcune basi per iniziare*:

grassetto
corsivo
sottolineato

Dimensione Carattere
Il modo più semplice per cambiare la dimensione del carattere è usare questi tag:

<big>aumenta il carattere di una dimensione</big>
riduce il carattere di una dimensione

Se hai bisogno di andare ancora più grande o più piccolo con il tuo carattere, puoi usare questi tag più specifici:

aumenta la dimensione del carattere del numero tra virgolette
diminuisce la dimensione del carattere del numero tra virgolette

Puoi anche essere più specifico con la dimensione del font specificando un numero da 1 a 7 come dimensione del font, con 1 che è la dimensione più piccola e 7 la più grande:

carattere più piccolo 8 pt
carattere più grande 36 pt

Un'altra opzione con la dimensione del carattere è usare i tag di intestazione da 1 a 6, che inseriscono anche spaziatura attorno al testo:

<h1>intestazione più grande</h1>

<h6>intestazione più piccola</h6>

Colore Carattere
Oltre a cambiare la dimensione del tuo carattere, puoi anche regolare il colore.

blu
rosso

Se vuoi usare una tonalità diversa di rosso o blu, puoi inserire un numero esadecimale di sei cifre invece della parola "red" o "blue." Tutti i colori sono composti da rosso, blu e verde e ogni colore ha il proprio "code." I primi due numeri (o a volte lettere) del codice rappresentano il rosso, poi i successivi due rappresentano il verde, e gli ultimi due rappresentano il blu. Puoi scaricare Color Cop per PC o Misuratore di Colore Digitale per Mac e usa questi prodotti per passare il mouse su qualsiasi colore sullo schermo e ti darà il codice di cui hai bisogno. Ad esempio, se dovessi usare il codice per il blu che vedi sopra, sarebbe così:

stesso blu
e qui è un esempio di un'altra tonalità di blu che puoi scegliere usando il codice

Tipo di Carattere
Infine, puoi cambiare il tipo di carattere del tuo font. Puoi usare Microsoft Word se hai bisogno di idee.

carattere arial
carattere comic sans ms
lucida handwriting

Ora dovrai mettere tutto insieme. Per qualsiasi cosa con la parola "font" puoi semplicemente inserire tutte le informazioni in un unico tag. Se vuoi usare i tag di intestazione o aggiungere grassetto, corsivo o sottolineato, puoi aggiungerlo nel loro tag separato.

puoi mettere tutto insieme

puoi mettere tutto in grassetto

oppure puoi mettere in grassetto parte di esso

Spaziatura
Ora che sei in grado di regolare il tuo font, vorrai creare paragrafi, interruzioni di riga e in alcuni casi potresti dover aggiungere manualmente spazi:

usando i tag di paragrafo metti il tuo testo nel suo paragrafo...

...e nella riga successiva

Usare gli interruzioni di riga è come... 
...premendo invio per passare alla riga successiva e a differenza di tutto il resto su questa pagina non ha bisogno di un tag di chiusura (questo è un tag di chiusura ). Puoi semplicemente inserirlo di nuovo... 
...per andare alla riga successiva di nuovo.

Non avrai bisogno di usare codice per spazi tra il testo (come dalla barra spaziatrice) a meno che non voglia aggiungere spazi aggiuntivi, perché HTML riconoscerà solo uno anche se ne metti più di uno con la barra spaziatrice. Per dare spazio tra il testo puoi usare il codice:  

Collegamenti
Una cosa che probabilmente vorrai aggiungere al tuo sito web sono i link ad altre pagine del tuo sito o anche ad altri siti web. I link sono facili da aggiungere usando questo codice:

<a href="http://www.dynadot.com">questo link porta alla homepage di Dynadot</a>

Potresti notare che se clicchi sul link sopra si apre in una scheda o finestra separata nel tuo browser, a seconda delle impostazioni del browser. Questa è una cosa facile da aggiungere ed è consigliata se stai collegando a un sito esterno o non vuoi perdere le persone su una certa pagina (come un blog), perché mantiene quella pagina aperta per i tuoi clienti in modo che possano tornare indietro senza dover cliccare il pulsante indietro nel loro browser. Tutto quello che devi fare è aggiungere target="_blank" dopo il tuo link:

<a href="http://www.dynadot.com" target="_blank">questo link porta alla homepage di Dynadot</a>

Immagini
Infine, potresti voler aggiungere immagini al tuo sito. Per aggiungere un'immagine con HTML dovrai ospitarla da qualche parte. Se non hai un posto dove ospitare l'immagine tu stesso, puoi usare un servizio come Tiny Pic.com che ti permette di caricare le tue immagini gratuitamente e genera il tag HTML per te. Se non vuoi creare un account, puoi semplicemente salvare l'HTML che genera (ma non salvarlo in Microsoft Word, perché Word a volte aggiunge cose che fanno sì che il codice non funzioni più). Tieni presente che alcune immagini sono molto grandi e potresti volerle ottimizzare in modo che occupino meno spazio. Ci sono alcuni ottimizzatori di immagini gratuiti che puoi usare per ridurre la dimensione del file delle tue immagini, come Image Optimizer.net. Here is an example of a basic image tag:
<img src="https://i45.tinypic.com/9bkglk.jpg"> che assomiglia a questo: Dynadot logo

Puoi anche aggiungere bordi alla tua immagine, cambiarne le dimensioni e aggiungere spaziatura attorno ad essa:

<img src="https://i45.tinypic.com/9bkglk.jpg" border="2" width="100" height="30" vspace="10" hspace="20" align="left">

Come puoi vedere, l'immagine ha un bordo, è più larga e più corta, ed è stata spaziata intorno alla parte superiore e inferiore e a destra e sinistra. È anche allineata a sinistra, quindi il testo ora appare accanto all'immagine.

Puoi anche aggiungere un link alla tua immagine. Devi solo mettere i tag del link attorno al tag dell'immagine in questo modo:

<a href="http://www.dynadot.com" target="_blank"><img src="https://i45.tinypic.com/9bkglk.jpg" border="0"></a>
Ora puoi cliccare su questa immagine e ti porta alla nostra homepage:

Questo a volte aggiunge un bordo attorno all'immagine nel colore blu che vedi sui link di testo. Per rimuoverlo, aggiungi semplicemente border="0" al tuo tag immagine. Potresti anche notare che l'HTML generato da Tiny Pic.com ha alt="Image and video hosting by Tiny Pic" all'interno del tag immagine. Puoi usarlo per mettere testo con la tua immagine nel caso non venga visualizzata correttamente nel browser di qualcuno. Aggiungere testo alternativo può anche aiutare con l'ottimizzazione per i motori di ricerca (SEO).

Ora che si spera ti senti più a tuo agio con l'HTML, puoi mettere alla prova le tue abilità sul tuo sito web. Ma prima di salvare con HTML potenzialmente imperfetto, suggeriamo di testare il tuo HTML con un servizio gratuito come onlinehtmleditor.net. Ha anche alcuni semplici pulsanti HTML in alto per aiutarti. Ora devi solo ottenere il tuo dominio se non ne hai già uno e inizia con il tuo sito web oggi!

*Si prega di notare che il tag font è deprecato e potrebbe non essere visualizzato correttamente in tutti i browser. È meglio definire lo stile del font in CSS, che tratteremo in un post del blog successivo.

Post di Robyn Norgan

Basic HTML - Getting Started with Your Website

<h1>intestazione più grande</h1>

<h6>intestazione più piccola</h6>