Contenuto

• Passi
• Metodo 1 di 1: scrivere una pagina HTML
• Consigli
• Avvertenze
• Di che cosa hai bisogno

HTML (Hypertext Markup Language) è il linguaggio di programmazione principale per lo sviluppo di pagine web. Creato come un linguaggio di programmazione semplice e conveniente. La maggior parte delle pagine su Internet sono state sviluppate utilizzando una delle forme di questo linguaggio (ColdFusion, XML, XSLT). Dopo aver letto questo articolo, puoi continuare la tua formazione utilizzando altre risorse su Internet. Prova a cercare su Internet altri articoli relativi a questo argomento.

Passi

Metodo 1 di 1: scrivere una pagina HTML

1. 1 Prima di iniziare a familiarizzare con uno dei passaggi presentati qui, vedere la sezione "Di cosa avrai bisogno".
2. 2 Cosa dovresti sapere prima di iniziare a capire questo problema:
3. 3 Le basi. Hai mai sentito parlare del tag? Il tag è circondato da parentesi angolari, con la parola all'interno. Il tag di fine è scritto nella stessa forma, ma con l'aggiunta di una barra dopo la prima parentesi angolare. Un attributo è una parola facoltativa in un tag utilizzata per aggiungere dettagli a un tag.
4. 4 L'inizio del documento. In qualunque editor di testo stai utilizzando, incolla quanto segue:
   html> head> title> wikiHow / title> / head> body> Hello World / body> / html> big> / big>
   Il tag deve essere chiuso con lo stesso tag, ma con una barra dopo la prima parentesi angolare. Ci sono eccezioni come i tag MET o DOCTYPE.
5. 5 DOCTYPE
   • In genere, la maggior parte delle pagine Web sono impostate DOCTIPO”. Questo aiuta a determinare la codifica e come sarà percepita dai browser web. La maggior parte delle pagine funzionerà senza di essa, "ma ciò è necessario se si desidera abbinare (regolano i tipi di codifiche su Internet e come vengono utilizzate)... Il DOCTYPE per HTML 4.01 è presentato di seguito:! DOCTYPE html PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd"> Questo è uno dei più comuni DOCTYPE utilizzato su pagine di tutto Internet.Innanzitutto, punta al tipo di pagina che descrive l'"html", quindi evidenzia il tipo di codifica e infine la posizione del DOCTYPE, che di conseguenza descrive la pagina per il browser web.
   • Esistono diversi tipi di HTML (diverse versioni sviluppate negli anni), ad esempio utilizzando nuovi tag o tag specifici. Alcuni tag sono deprecati (vengono invece utilizzati altri tag più utili).
   • b> e io> - questo è ciò che viene attualmente imposto ai tag, perché servono per trasformare il testo, ma non le specifiche, di conseguenza, altri tag vengono a sostituirli. Etichetta forte> è un sostituto per b>, e em>, un sostituto per io>.
   • È importante che i tag precedenti vengano sostituiti con tag che vanno oltre la formattazione. Se il testo viene tradotto, non solo la formattazione, ma anche il suo significato rimane lo stesso. Questo è semanticamente corretto.
   • Nella versione XHTML 2.0, b> e io> non utilizzato, proprio come nella versione HTML 3+.
6. 6 HTML "Regola di incapsulamento".
   • Diamo un'occhiata ai tag più importanti attualmente in uso. Durante la creazione della pagina viene utilizzata una struttura semplice. Se un tag è stato aperto, di conseguenza, dovrebbe essere chiuso... Questo vale per l'intera struttura. Ecco un valido esempio della struttura del layout XHTML:
   • !DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Strict // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
   • html xmlns = "http://www.w3.org/1999/xhtml">
   • testa>
   • meta http-equiv = "Content-Type" content = "text/html; charset = utf-8" />
   • titolo> Ciao mondo! / titolo>
   • / testa>
   • corpo>
   • h1> Ciao mondo! / h1>
   • / corpo>
   • / html>
   • Codice di esempio che emette un messaggio Ciao mondo... Questo si chiama test Ciao mondo.
7. 7 Intestazione
   • Il titolo della pagina web è il contenuto tra il tag testa>... Questo contenuto non può essere visualizzato dall'utente (solo il titolo che viene mostrato nel titolo della pagina). Informazioni tra i tag testa>, può racchiudere altri tag, come:
     
     
     • Il tag META viene utilizzato per informazioni utili ai motori di ricerca e ad altre utilità.
     • Tag LINK che crea un collegamento tra documenti, ad esempio per Stili (CSS).
     • Tag SCRIPT, questo include quasi tutti i codici web, con la possibilità di accedere in remoto (da un altro documento).
     • Il tag STYLE, che è essenzialmente uno stile che può essere applicato a una pagina.
     • Il tag TITLE è il titolo che appare come titolo di una pagina nel tuo browser web.
   • Vediamo una demo di alcuni di questi in un'intestazione di esempio presa da questo sito Web (è stata abbreviata):
     • testa>
     • titolo> ... / titolo>
     • meta name = "descrizione" content = "..." />
     • link rel = "foglio di stile" type = "text / css" href = "..." />
     • meta http-equiv = "content-type" content = "testo / html; set di caratteri = UTF-8" />
     • tipo di stile = "testo / css" media = "tutto"> ... / stile>
     • tipo di script = "testo / javascript" src = "..."> / script>
     • / testa>
       
       Nel caso in cui non l'avessi notato, i singoli tag sono stati evidenziati, con le informazioni effettive rimosse. L'esempio è piuttosto breve e mostra quasi tutti i tag che possono essere trovati in testa>ad eccezione del commento HTML (ne parleremo in semplici tag).
8. 8 Tag semplici ovunque
   • Andiamo avanti e vediamo altri tag. Fai attenzione ai tag e ricorda la regola empirica "Incapsulamento".
     
     
     • forte> Enfatizza il testo importante.
     • piccolo> Rimpicciolisce il testo. La dimensione del carattere è misurata in unità standard da 1 a 7, 3 è la dimensione del testo predefinita. ...
     • pre> Definisce un blocco di rich text. Com'è corretto, tale testo viene digitato con un carattere della stessa dimensione e con tutti gli spazi tra le parole.
     • em> Mostra il testo come una frase.
     • del> Cancella il testo.
     • ins> Definisce il testo che è stato inserito nel documento.
     • h1> Uno dei tanti tag di intestazione. I tag di questo tipo iniziano con 'h', con una differenza di numero. Assicurati di chiudere il tag con lo stesso numero.
     • p> Definisce un paragrafo.
     • --- ... ---> A differenza di altri tag, il commento deve essere all'interno del tag stesso. Questa informazione è visibile solo quando viene visualizzato il codice.
     • blockquote> Mostra una citazione, può essere utilizzata con il tag cite>.
     • I pochi esempi sopra non sono un elenco completo di tag esistenti. Per conoscere gli altri, visita.
9. 9 Creare una struttura chiara
   • Le pagine sono progettate per contenere i dati in semplici set di tag in modo da poter analizzare le informazioni in paragrafi. Il computer riconosce i dati, non conosce il contesto o la connessione concettuale. Dobbiamo creare pagine HTML compatibili con il computer. Ciò si ottiene utilizzando il tag div. Aiuta a creare un numero enorme di pagine. Può essere stilizzato con CSS ed è più semplice che creare tabelle di codici di grandi dimensioni per il layout.
     • div> Questo tag è speciale perché può avere uno stile e utilizzare blocchi separati di informazioni che sia l'utente che il computer possono comprendere.
   • Diamo un'occhiata a un semplice layout HTML che utilizza un tag div.
     • !DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Strict // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
     • html xmlns = "http://www.w3.org/1999/xhtml">
     • testa>
     • meta http-equiv = "Content-Type" content = "text/html; charset = utf-8" />
     • titolo> Ciao mondo! / titolo>
     • / testa>
     • corpo>
     • h1> Ciao mondo! / h1>
     • div id = "contentOne">
     • p> Questo è del testo in div # contentOne. / p>
     • div>
     • p> Un paragrafo in una sottosezione di div # contentOne / p>
     • / div>
     • / div>
     • / corpo>
     • / html>
   • L'uso dei tag div> aiuta a trovare e modificare gli stili mentre si lavora con CSS e Javascript. L'HTML utilizzerà una codifica diversa per lavorare con gli stili CSS e Javascript per creare un'esperienza utente migliore e più reattiva.

Consigli

• Dopo aver letto questo articolo, non fermarti a pensare di aver imparato tutto ciò che devi sapere. C'è sempre qualcosa da imparare, soprattutto in questa tecnologia.
• Impara, comprendi e scrivi codice.
• Nota che alcuni tag usano solo>. Para e br sono alcuni esempi. Altri tag aperti con> devono essere chiusi ulteriormente. Ad esempio, "div> / div>".
• Le persone si aspettano nuove scoperte, quindi reinventa, progetta o codifica.
• Una volta che hai imparato molto, prova ad imparare la programmazione dei server.
• Impara a lavorare con CSS e Javascript.

Avvertenze

• Ricorda, HTML riguarda la modifica del contenuto. Ciò significa che l'HTML viene utilizzato solo per archiviare il contenuto in un formato riconosciuto. Altre modifiche devono essere eseguite utilizzando altre tecnologie, come CSS. Significa anche fare “Semanticamente corretto”anche se gli altri non lo ammettono. Altri linguaggi di programmazione aiutano a creare pagine Web (CSS, Javascript e XML). HTML è un costruttore di contenuti.

Di che cosa hai bisogno

• Un editor di testo che supporta la codifica ANSI
• Un browser web come Internet Explorer o Mozilla Firefox
• (Facoltativo) editor HTML wysiwyg o wykiwyg come Adobe Dreamweaver, Aptana Studio o Microsoft Expression Web