Guida HTML per SEO

[giorgiotave]

Guida HTML per SEO

Introduzione

Questa pagina è un supporto al video Corso di HTML per SEO in modo da avere un riassunto testuale e una raccolta di risorse modulo per modulo del corso.

Per questo motivo è più una guida che un corso

Il Corso Completo

L'intero corso è disponibile su YouTube a questo indirizzo:

Sommario dei Moduli

1. Cosa è l'HTML
2. Costruiamo una pagina
3. Cosa è Google e cosa è la SEO
4. La SEO e l'HTML
5. Esercizi e Strumenti
6. Advanced (Web API, Web Performance per HTML, CSS, Javascript)

Riferimenti dell'Autore

• Il Corso SEO con Giorgio Taverniti
• Giorgiotaverniti.it
• GoogleLiquido.it
• FastLetter: la newsletter di Giorgio Taverniti
• Connect.gt
• FastForward: Canale YouTube curato da Giorgio Taverniti
• Search On
• Search On Consulting

Collaboratori

• Andrea Dragotta
• Andrea Pernici
• Enrico Collorà
• Alessio Pomaro

1. Cosa è l'HTML

1.1 Concetti Base

• Cosa è ARPANET
• Il Tweet della prima email della Regina Elisabetta (1976)
• Robert Cailliau - Wikipedia
• Il Protocollo HTTP
• Proteggere il sito con HTTPS (Google Developers)
• Abilitare HTTPS sui server
• Cos'è HTTP/2 e differenze
• HTTP/3 basato su UDP
• HTTP/2 vs HTTP/3
• Statistiche utilizzo elementi sito (Web Almanac)
• Can I use HTTP3
• HTTP/3 Check
• Codici di stato HTTP - Wikipedia

1.2 Ecco l'HTML

• World Wide Web Consortium (W3C)
• Video Google sull'importanza degli H1
  

1.3 L'HTML 5

• Markup 2022 (The Web Almanac)
• Standard Generalized Markup Language (SGML)
• Nuovi elementi HTML 5 (W3C)

2. Costruiamo una pagina

2.1 URL e Struttura del Sito

• Struttura URL secondo Google
• Guida SEO Starter di Google
• Guida HTML5 di HTML.it
• Tabella supporto browser HTML 5

2.2 La nostra pagina: costruiamola

• HTML Editor Online
• Esempi HTML (W3Schools)
• HTML Reference - Guida completa agli elementi
• NON USARE IL GRASSETTO PER LA SEO - Video
  
• Tag Strong (Mozilla)
• Tag EM (Mozilla)
• Parametri Player YouTube
• Embed Responsively

2.3 Approfondimenti Semantici

• Tag Header
• Tag Footer
• Tag Section
• Tag Article
• Tag Nav
• Estensione Chrome: HTML5 Outliner
• Tipi di contenuti e Tag (WHATWG)

2.3.1 Open Graph

• The Open Graph Protocol
• Facebook Debugger
• Twitter Cards Guide
• Linkedin Share Debugger

2.3.2 Schema (Dati Strutturati)

• Web Almanac: Structured Data
• Structured Data FAQPage (Google)
• Sitelink Searchbox
• SEO By Rank Math (Plugin)
• Yoast SEO (Plugin)
• Schema Validator
• Test Risultati Multimediali Google
• Playlist YouTube Search Console

3. Cosa è Google e cosa è la SEO

• Statistiche Motori di Ricerca (Statcounter)
• Mobile First Indexing (Google)
• Il Messy Middle e il comportamento d'acquisto
• Integrazione Shopify e YouTube

4. La SEO e L'HTML

• Linee Guida Webmaster Google
• Overview del Crawler di Google
• Robotstxt.org
• (http://user-agent-string.info/list-of-ua/bots)
• Gestione URL canonici
• Versioni localizzate (Hreflang)
• Informazioni sulle Sitemap
• Best practice per Title Link
• Linee Guida Google Immagini
• Web Dev Fast (Performance)
• Squoosh.app (Ottimizzazione immagini)

5. Esercizi e Strumenti

I Nostri Eventi

• We Make Future
• Search Marketing Connect
• Social Media Strategies
• Advanced SEO Tool

5.2 Strumenti Semplici

• Bing Webmaster Tool
• Web Archive (Wayback Machine)
• Validator W3C
• Built With (Tecnologie sito)
• Meta SEO Inspector (Estensione)
• Similarweb (Analisi traffico)
• Google Trends
• Microsoft Clarity (Heatmaps)
• Matomo Analytics

5.3 Strumenti Avanzati

• Web Page Test
• Lighthouse
• Screaming Frog SEO Spider
• Visual SEO Studio
• SEMRush
• SEOZoom
• Ahrefs
• Dall-e 2 (AI Image Gen)

6. Advanced

Approfondimenti Tecnici

Andrea Dragotta (Web API)

• Can I use
• Project Fugu (Web Capabilities)
• Developer Mozilla (MDN)
• Codepen

Andrea Pernici (Performance)

• Preload Responsive Images
• Load CSS Simpler

Enrico Collorà (CSS & Design)

• Esempi CodePen di Enrico
• Progressive Enhancement
• (https://web.dev/variable-fonts/)

Alessio Pomaro (Rendering & JS)

• Rendering on the Web
• View Rendered Source Plugin
• Fetch and Render Tool
• Rendering Queue Insights