Come creare un sito Web su pagine GitHub: 12 passaggi (con immagini)

Sommario:

Come creare un sito Web su pagine GitHub: 12 passaggi (con immagini)
Come creare un sito Web su pagine GitHub: 12 passaggi (con immagini)

Video: Come creare un sito Web su pagine GitHub: 12 passaggi (con immagini)

Video: Come creare un sito Web su pagine GitHub: 12 passaggi (con immagini)
Video: 3 TRUCCHI PER GLI STUDENTI! 2024, Maggio
Anonim

GitHub Pages è un ottimo modo per creare il tuo sito personale da zero. È completamente gratuito e richiede solo un account GitHub. Nota, tuttavia, che GitHub Pages non offre il design più intuitivo per creare siti Web (a differenza di Wix o Squarespace), ma è un ottimo modo per acquisire esperienza con HTML/CSS/JS e tutti gli elementi di un sito Web. Questo wikiHow ti mostrerà come iniziare.

Passi

Crea un sito Web su GitHub Pages Passaggio 1
Crea un sito Web su GitHub Pages Passaggio 1

Passaggio 1. Registra un account su GitHub, se non ne hai ancora uno

Prima di poter creare il tuo sito web sulle pagine di GitHub, devi creare un account su GitHub. Se hai già un account su GitHub, assicurati di accedere. Entrambi sono accessibili dalla barra degli strumenti in alto a destra.

Crea un sito Web su GitHub Pages Passaggio 2
Crea un sito Web su GitHub Pages Passaggio 2

Passo 2. Crea un repository su GitHub.

Assicurati di nominare il repository "[your GitHub username here].github.io". Questo inizializzerà il tuo sito web GitHub.

Metodo 1 di 2: utilizzo di un editor di codice

Crea un sito Web su GitHub Pages Passaggio 3
Crea un sito Web su GitHub Pages Passaggio 3

Passaggio 1. Scarica GitHub desktop, se non lo hai già installato

Installare GitHub desktop è semplice come andare su https://desktop.github.com/ e fare clic sul grande pulsante viola "Download". Quindi eseguire il programma di installazione. Questo è necessario per inviare le modifiche al tuo repository.

Crea un sito web su GitHub Pages Passaggio 4
Crea un sito web su GitHub Pages Passaggio 4

Passaggio 2. Installa un editor di codice

Ne hai bisogno per ottenere l'evidenziazione della sintassi su GitHub. Le scelte più popolari includono Atom, Visual Studio Code, Sublime Text e Notepad ++, data la loro sensazione ricca di funzionalità e minimalista. Dopo aver installato un editor di codice, sei pronto per iniziare.

Crea un sito Web su GitHub Pages Passaggio 5
Crea un sito Web su GitHub Pages Passaggio 5

Passaggio 3. Creare un file chiamato "index.html"

Puoi farlo nel tuo editor di codice o online. Puoi anche andare alla posizione del tuo repository sul tuo disco rigido e creare un file "index.html" nella cartella del repository sul tuo disco.

Crea un sito Web su GitHub Pages Passaggio 6
Crea un sito Web su GitHub Pages Passaggio 6

Passaggio 4. Aggiungi il tuo codice HTML

Dovrai imparare l'HTML per essere in grado di codificare una pagina web di base. Ti sarà anche utile imparare CSS e JavaScript in modo da poter aggiungere stile e funzionalità alla tua pagina web.

Ricordati di salvare il file

Crea un sito Web su GitHub Pages Passaggio 7
Crea un sito Web su GitHub Pages Passaggio 7

Passaggio 5. Conferma le modifiche

Torna al desktop GitHub e fai clic sul pulsante blu Commit to master. Quindi fare clic su Push Origin. Questo caricherà le modifiche su GitHub.

Se prevedi di apportare ulteriori modifiche, vorrai estrarre anche l'origine. Fai clic sul pulsante Pull origin nel desktop GitHub per scaricare l'ultimo commit sul tuo computer

Crea un sito Web su GitHub Pages Passaggio 8
Crea un sito Web su GitHub Pages Passaggio 8

Passaggio 6. Visualizza la tua pagina web

Vai a "[il tuo nome utente GitHub qui].github.io" in un browser web. Potrebbe essere necessario bypassare la cache del browser tenendo premuto Ctrl o ⌘ Command mentre si fa clic sul pulsante di aggiornamento per visualizzare la nuova pagina web.

Metodo 2 di 2: utilizzo di GitHub online

Crea un sito Web su GitHub Pages Passaggio 9
Crea un sito Web su GitHub Pages Passaggio 9

Passaggio 1. Creare un file chiamato "index.html"

Fare clic su Aggiungi file, quindi su Crea nuovo file. Questo aprirà un editor di file. Aggiungi "index.html" al campo "Nomina il tuo file".

Crea un sito Web su GitHub Pages Passaggio 10
Crea un sito Web su GitHub Pages Passaggio 10

Passaggio 2. Aggiungi il tuo codice HTML

Dovrai imparare l'HTML per essere in grado di codificare una pagina web di base. Ti sarà anche utile imparare CSS e JavaScript in modo da poter aggiungere stile e funzionalità alla tua pagina web.

Ricordati di salvare il file

Crea un sito Web su GitHub Pages Passaggio 11
Crea un sito Web su GitHub Pages Passaggio 11

Passaggio 3. Conferma le modifiche

Fare clic sul pulsante verde Commit new file per salvare il file su GitHub.

Crea un sito Web su GitHub Pages Passaggio 12
Crea un sito Web su GitHub Pages Passaggio 12

Passaggio 4. Visualizza la tua pagina web

Vai a "[il tuo nome utente GitHub qui].github.io" in un browser web. Potrebbe essere necessario bypassare la cache del browser tenendo premuto Ctrl o ⌘ Command mentre si fa clic sul pulsante di aggiornamento per visualizzare la nuova pagina web.

Suggerimenti

  • Per aggiungere sottopagine, crea semplicemente una nuova cartella su GitHub e aggiungi un file "index.html" in quella cartella.
  • Se registri un nome di dominio, puoi fare in modo che le pagine GitHub utilizzino quel nome di dominio anziché quello predefinito.
  • I repository di pagine GitHub devono essere pubblici, a meno che non si disponga di un account premium.

Consigliato: