Siti Web, blog, pagine Web: concetti già familiari ai nostri tempi. Con lo sviluppo di Internet, i siti per l'hosting di pagine web sono diventati incredibilmente popolari, e questo non sorprende: per alcune persone avere un proprio sito web è una necessità, per altri è un piacevole divertimento. Nel primo caso si parla solitamente di aziende, società, imprenditori privati, quando pubblicizzano qualsiasi prodotto o servizio richiesto. Il secondo riguarda i blogger.
Oltre a questo, ci sono utenti Internet che cercano semplicemente informazioni, leggono blog, guardano video e così via.
Per creare un sito web di qualità, ci sono molte opzioni. Ci concentreremo sulla programmazione web tramite HTML.
Cos'è HTML
HTML sta per Hyper Text Mark-Up Language. Tradotto dall'inglese, significa "Lingua di markup ipertestuale".
In altre parole, l'HTML è un insieme di codici con cui puoi creare gli elementi principali del sito, la sua cornice, comecome le parole sono composte da frasi.
I codici HTML sono scritti esclusivamente in lettere latine e sono chiamati tag e ogni codice è racchiuso tra parentesi angolari. Alcuni tag sono accoppiati, altri non sono accoppiati.
Associati significa che devono essere usati in coppia a colpo sicuro. Ad esempio, il tag di apertura indica dove inizia su una pagina Web e il tag di chiusura indica dove si ferma. Quest'ultimo si differenzia dal primo per la presenza di una barra dopo la parentesi angolare di apertura. Ad esempio, è il tag di apertura,è il tag di chiusura.
I tag non accoppiati non hanno bisogno di un partner.
Molti tag possono avere attributi - elementi aggiuntivi che gli conferiscono un significato più specifico. Ad esempio, il tag.
Dove viene utilizzato HTML
La comprensione classica di dove è necessario l'HTML è la creazione di siti Web.
In pratica questo può bastare, visto che l'HTML permette di creare gli elementi principali del sito, i menu (anche multilivello), impostare lo sfondo, inserire testo, immagini, audio, video, modificare i font e molto altro.
Tuttavia, ci sono altre lingue che ti permettono di aggiungere elementi più interessanti e spesso necessari a una pagina web:
- CSS imposta gli stili per l'intero sito senza la necessità di prescrivere costantemente le caratteristiche di stile dei singoli elementi utilizzando i tag, ad esempio il colore e il carattere del testo.
- Il linguaggio di script ti consente di sviluppare e incorporare mini-programmi (script) nel sito, che vanno dacose estetiche banali (cambiare il colore del link passandoci sopra con il mouse) e finire con quelle funzionali (raccogliere gli indirizzi email dei clienti, i numeri di telefono).
- Con PHP puoi sviluppare il tuo guestbook o il tuo sistema di commenti.
Anche HTML viene utilizzato nella creazione di email per la distribuzione.
Cos'è un collegamento
Ti permettono di navigare verso un' altra pagina web, sia interna che esterna al sito.
I link HTML sono comunemente usati:
- Per accedere a una risorsa web esterna.
- Per spostarti tra le pagine del sito.
- Per andare su Google Forms.
Spesso viene indicato anche un collegamento alla fonte in HTML, soprattutto perché quando si copia materiale da un altro sito, è necessario specificare l'autore. In caso contrario, la copia senza attribuzione può rientrare nelle definizioni di violazione del copyright, furto di contenuti e ritorni di fiamma. Inoltre, l'uso di materiali presi in prestito e non esclusivi riduce le prestazioni SEO e l'indicazione di un collegamento alla fonte riduce i rischi.
Tipi di link
Nel senso classico, un collegamento è l'indirizzo di una risorsa web a cui puoi accedere facendo clic su di essa.
Oltre a questo, ci sono collegamenti ipertestuali: testo e immagini. In questi casi, il collegamento HTML è "nascosto" sotto qualche frase (parola) o immagine e per seguirlo è necessario fare clic sul testo o sull'immagine.
Altri tipi di link:
- Unvisited - un collegamento che non è stato ancora cliccato durante una sessione particolare. Ad esempio, se hai seguito questo link ieri, poi hai spento il computer e lo hai riacceso oggi, ora il link non è più visitato, poiché è iniziata una nuova sessione.
- Attivo - in questo stato, il collegamento viene salvato per un tempo molto breve: l'intervallo tra il clic sul collegamento e il seguirlo.
- Visitato - un link che è già stato visitato almeno una volta durante una sessione.
Per i normali collegamenti di testo, quelli visitati tendono a cambiare colore se non diversamente specificato.
Un'immagine con collegamento ipertestuale non cambia il suo aspetto, indipendentemente dal fatto che sia visitata o meno.
Come inserire un collegamento regolare
Molte risorse web percepiscono l'indirizzo del sito come un link, lo rendono immediatamente cliccabile e lo evidenziano con il colore. Ad esempio, se l'indirizzo viene inviato in un messenger o tramite e-mail, cliccandoci sopra, puoi andare al sito.
Nel caso in cui tu crei un sito usando HTML, devi inserire un link usando un tag speciale. Sarà simile a questo: indirizzo del sito web. Il testo del collegamento in HTML deve essere specificato per intero, con protocollo.
Come inserire un collegamento ipertestuale di testo
In precedenza si diceva che un collegamento ipertestuale svolge la stessa funzione di un collegamento normale, ma sembra esteticamente più gradevole: al posto dell'indirizzo di un sito, che spesso è inutilmente lungo, viene indicata una parola o una frase. Ad esempio, nella frase "Cerca informazioni qui", puoi nascondere il collegamentola parola "qui". Verrà evidenziato e facendo clic su di esso si porterà l'utente al sito desiderato.
Come creare un collegamento HTML è già stato discusso in precedenza. È possibile inserire un collegamento ipertestuale di testo utilizzando lo stesso tag. L'unica differenza è che è necessario specificare tra i tag il testo sotto il quale verrà nascosto il collegamento: testo visibile.
Come inserire un collegamento ipertestuale di un'immagine
Qui è un po' più complicato. Usiamo lo stesso tag, ma al posto del testo, devi specificare il percorso dell'immagine.
Il percorso è la posizione dell'immagine. Se l'immagine (foto) si trova su un servizio di condivisione file, è necessario specificare tutte le cartelle lungo il percorso dell'immagine tramite una barra. Puoi anche includere un collegamento a un'immagine, se possibile.
Per taggare
oltre a src, sono applicabili anche altri attributi, che ti consentono di regolare l' altezza, la larghezza e la posizione dell'immagine e molto altro. Alcuni di loro:
- Src - specifica il percorso dell'immagine.
- Lowsrc - identico all'attributo precedente, ma specificato per immagini di bassa qualità.
- Altezza - altezza dell'immagine.
- Larghezza - la sua larghezza.
- Alt - descrizione dell'immagine. Quando passi il mouse su una foto o un'immagine, viene visualizzato il testo specificato in questo attributo.
- Border - determina lo spessore del bordo attorno all'immagine.
Gli attributi sono specificati dopo il tag e sono inclusi inla sua composizione. L'attributo deve essere seguito dal suo valore. Ad esempio, per gli attributi " altezza" o "larghezza" (altezza, larghezza) specifica l' altezza dell'immagine sulla pagina web. L'unità di misura è pixel, se non diversamente specificato.
Assomiglia a questo: <a href="indirizzo della pagina web"
. Questi attributi aiuteranno a impostare la dimensione appropriata per l'immagine. Il bordo aiuta a creare un bordo invisibile attorno all'immagine.
Gli attributi di cui sopra si applicano separatamente al tag di inserimento dell'immagine. Ad esempio:.
Cosa sono i link di ancoraggio
Creare link di ancoraggio è un'abilità molto utile. Spesso è necessario disporre una pagina Web con un lungo blocco di testo o con più sottosezioni su una pagina. In questo caso, puoi iniziare immediatamente con un elenco di collegamenti a sottosezioni del testo o della pagina web e quando fai clic su di essi, l'utente andrà direttamente alla sezione richiesta.
La creazione di link di ancoraggio richiederà un uso maggiore dei tag di attributo rispetto ad altri tipi di link.
In primo luogo, è necessario impostare il valore complessivo per ogni blocco di informazioni o sottosezione di testo utilizzando l'attributo in alto, quindi associarlo al collegamento corrispondente.
Le loro caratteristiche sono più estese, quindi è consigliabile prima padroneggiare la creazione di link più semplici, per poi passare alla formazione dei link di ancoraggio.
Suggerimenti
Aiuto da espertiprogrammatori:
- Puoi fare in modo che le informazioni su un link vengano visualizzate al passaggio del mouse in HTML. Per questo può tornare utile l'attributo alt, che utilizziamo anche per gli elementi grafici.
- È possibile creare un elenco di collegamenti utilizzando HTML. In particolare, questo può essere utile per i link di ancoraggio, così come quando devi fare un elenco di risorse web che possono essere seguite da un link direttamente dalla pagina web corrente.
- Con l'aiuto di CSS e JavaScript, oltre ad alcune funzioni HTML, puoi creare un design di collegamenti di testo e collegamenti ipertestuali diverso dal solito. Ad esempio, quando passi il mouse su un collegamento, può cambiare il suo colore e tornare a quello precedente quando il cursore è lontano da esso. Questo può essere fatto con uno script JavaScript personalizzato. Inoltre, il colore del collegamento può essere impostato su qualcosa di diverso dal blu per i non visitati o dal viola per i visitati. Questo è il lavoro dei CSS.
- Non abusare dei link. Una pagina web con molti link inappropriati appare sciatta e sciatta.
- Assicurati che l'utente capisca che il collegamento ipertestuale con l'immagine è in re altà un'immagine e non solo un'immagine.
Conclusione
È molto facile collegarsi a una pagina in HTML. È importante seguire tutti i punti principali di questo linguaggio, poiché anche un piccolo errore può portare al fatto che non ci saranno risultati e il codice non funzionerà.
