fatti trovare dai tuoi clienti
Corso SEO & HTML: #01 Introduzione
Per essere in prima pagina su Google è importante sapere cosa sia il linguaggio HTML. Con questa rubrica voglio farti capire cosa c'è in una pagina web
Hai già sentito parlare di HTML riferito a internet, ma non hai mai capito cosa fosse?
Ti piacerebbe se qualcuno ti facesse un corso accelerato di HTML senza che tu debba necessariamente diventare un tecnico informatico? o un hacker?
Ti piacerebbe capire cosa devi fare per essere in prima pagina su Google a livello di codice HTML?
Corso SEO & HTML
La rubrica che ti spiega solo quello che ti serve sull'HTML, per essere in prima pagina su Google
Oggi incomincia questo appuntamento settimanale in cui ti spiegherò tutto quello che devi sapere sull'HTML per capire cosa c'è dietro a un sito web, nell'ottica di creare un sito web dalle alte prestazioni, per avere un ottimo punteggio SEO ed essere in prima pagina su Google!
Se leggi questo Blog sulla SEO da un po' di tempo, avrai già compreso i meccanismi che stanno alla base della rete internet e come funzionano i web server e i browser.
Ogni mercoledì troverai in questa rubrica un nuovo approfondimento sul linguaggio HTML.
Quali strumenti occorrono
Per scrivere in HTML è sufficiente un editor di testo
Molti credono che Open Office o Microsoft Word siano editor di testo!
⚠ No, quelli non sono editor di testo.
Un editor di testo è un programma come Blocco note, Notepad++, Brackets, vi, cioè un programma che mostra sullo schermo, per ogni byte costituente il file, il corrispondente simbolo individuato sulla tabella ASCII.
Per esempio il byte contenente il numero 65 (in esadecimale 41h) corrisponde alla lettera 'A' (maiuscola)
In origine il codice ASCII era composto da 128 elementi (7 bit), tra cui le lettere non accentate dell'alfabeto, in maiuscolo e in minuscolo, le dieci cifre, una serie di simboli di punteggiatura e matematici, e alcuni comandi per la telescrivente!
Sì, infatti quando nacque il codice ASCII, il suo scopo era di azionare i caratteri mobili di una telescrivente. Le trasmissioni erano a 8 bit in cui 7 bit trasportavano il codice ASCII e un bit aggiuntivo per verificare la parità (un metodo elementare per verificare che non ci fossero errori nella trasmissione).
Negli anni, il codice ASCII si è evoluto e si è trasformato dapprima in ASCII esteso a 8 bit, poi Unicode, UTF ed ora arriva ad includere — oltre ai caratteri accentati — anche i simboli di altre etnie, come la lingua araba, gli ideogrammi cinesi e giapponesi, e addirittura le emoticon 🤩!
Mentre il codice ASCII necessita di un byte (7 o 8 bit) per ogni carattere, con le codifiche Unicode o UTF possono essere necessari addirittura 4 byte per descrivere un singolo simbolo.
Se invece apri con un editor di testo un file .doc di MS-Word o .odt di OpenOffice, ti accorgerai che oltre a quello che hai scritto, ci sono una infinità di altri caratteri incomprensibili, che racchiudono informazioni per l'editor, come ad esempio il font (tipo di carattere), la dimensione del carattere, il formato grassetto, corsivo, sottolineato, l'allineamento e la spaziatura del paragrafo, insomma, tante informazioni che in un file di testo non sono presenti.
Solitamente i file di testo hanno i caratteri tutti della stessa dimensione, come se stessi scrivendo su un foglio a quadretti e ogni carattere viene scritto dentro ad uno scacco.
Invece gli editor come MS-Word e Open Office, per conferire uno stile più aggraziato al testo, utilizzano una dimensione variabile per i caratteri, più sottili per le lettere sottili ( come la 'i' la 'elle' minuscole e più larghi per le lettere maiuscole o le 'm' ...
Questo è dovuto al fatto che i programmi si leggono meglio se i caratteri sono tutti belli incolonnati, anche perché in origine non esistevano i caratteri a dimensione variabile!
In genere i file di testo hanno estensione .txt, ma nel caso specifico del web hanno estensioni di vario genere e ogni estensione ha un significato ben preciso:
- .html / .htm / .xhtml : rappresentano le pagine web in formato HTML
- .xml : rappresenta un documento XML (da cui deriva l' HTML)
- .css : rappresentano i fogli di stile che descrivono l'aspetto grafico di un sito
- .js : contengono codice eseguibile lato client (browser) in linguaggio Javascript
- .php : contengono codice eseguibile lato server in linguaggio PHP
- .sql : talvolta usati per descrivere istruzioni (query) in linguaggio SQL
Tutti i tipi di file menzionati sono scritti in testo puro e contengono istruzioni per i programmi che li devono interpretare. Il testo contenuto al loro interno può essere codificato in semplice codice ASCII, ma può appartenere anche ad alfabeti più moderni, in genere UTF8 o UTF8mb4.
Browser Web
Il client che si usa per navigare in internet si chiama browser
Originariamente i client per navigare in internet erano basati su pagine di ipertesto testuali, un esempio ne è Lynx, ma oggi si usano comunemente browser come Google Chrome, Safari, Mozilla Firefox, Opera, o browser nativi di sistemi operativi mobile come Android Browser, etc...
Per riuscire a costruire siti web in ottica SEO, con l'obiettivo di essere posizionati in prima pagina su Google, è importante utilizzare browser evoluti, che hanno la console sviluppatore. Un tempo erano pochissimi gli strumenti a disposizione, per lo più si trattava di plugin da installare, ad esempio su Mozilla Firefox, ma la loro utilità si è dimostrata talmente fondamentale che sono stati implementati ormai in ogni browser.
Su Google Chrome ad esempio per aprire la console sviluppatore è sufficiente premere insieme i tre tasti: MAIUSCOLO+CTRL+I
Un altro importante strumento che è contenuto all'interno dei browser è la possibilità di esaminare il sorgente (ovvero il codice HTML) di una pagina web. Per esempio in Google Chrome, premendo insieme i due tasti CTRL+u si comanda al browser di aprire il codice sorgente della pagina web corrente.
Aprire il codice sorgente è l'equivalente di aprire la pagina HTML in questione con un editor di testo come notepad++.
In figura si vede il testo in vari colori, ma è un artificio creato dal browser. In realtà il file non contiene in esso alcuna informazione relativa ai colori del testo. Le parole vengono colorate dal browser che ne interpreta il significato ed assegna ad ogni elemento un colore diverso, per dare all'utente la possibilità di distinguere meglio le parti che costituiscono la pagina HTML.
Conclusioni
Hai capito quali strumenti ti occorrono per iniziare a padroneggiare il linguaggio HTML, in modo da portare i tuoi siti web in prima pagina su Google.
Ti do appuntamento alla prossima settimana, nel frattempo metti un like se questo articolo ti è stato utile e condividilo con tutti i tuoi amici che — come te — vogliono essere in prima pagina su Google.
Se qualcosa non ti è chiaro, fammi le tue domande nei commenti, risponderò a tutti, oppure scrivimi in privato.
Iscriviti al Corso SEO Operativo per poter entrare nel gruppo privato dove parliamo ogni giorno di SEO e di come fare per essere in prima pagina su Google, a presto.