Seo html russo

Seo&HtmlImpara i trucchi sul codice html e la SEO

Matteo RussoWebdeveloper Html&Php, SEO

Mi Presento

Matteo Russo

Matteo RussoWebdeveloper HTML&PHP, SEO

Sviluppatore siti web• HTML• PHP&MYSQL

SEO• (Master SEOTraining 2014)

Freelance & Collaborazione con Agenzie

Perché conoscere HTML

Giocare senza conoscere le regole?


Ottimizzare un sito per i motori di ricerca: “onpage” primo passo

Migliorare l’esperienza d’uso dell’utente

Compatibilità con tutti i browser e dispositivi, fissi e mobile

Con la pratica si migliora

Non esiste solamente WordPress (e bisogna comunque metterci le mani)!

Gli strumenti indispensabili

Il coltellino svizzero di chi si “sporca le mani”


Notepad++ (o equivalente editor testuale)FirebugScreaming Frog SEO Spider & XenuFileZilla Client (o equivalente Client FTP)Account “Google Webmaster Tools”Account “Strumenti di Bing Webmaster”…tanta pazienza


Perché un editor testuale


Codice pulito

Più ci si sporca le mani, prima si impara


Firebug: meglio di un’autopsia


Ispezione di tutto il codice HTML

Evidenziazione degli elementi, uno ad uno

Modifiche realtime sia ai tag che al CSS

Debug Javascript & jQuery

Analisi del Traffico per individuare i “colli di bottiglia”


Screaming Frog SEO Spider – Lo Strumento n. 1


Errori del sito (40X, 50X) e Redirect (30X)

Validità Url e indicizzazione (index, follow)

Meta Tag & Headline Paragraph

Image Optimization

Creazione Sitemap


Google & Bing Webmaster Tools


Rivendicare la proprietà di un sitoPossibilità di sottoporre le sitemapRichiesta di indicizzazione di una o più pagineQuery di ricercaErrori di scansioneTest per markup e dati strutturatiAnalisi dei link verso il nostro sitoDisavow Tool (rifiuto link)Azioni Manuali (Penalizzazioni)

HTML5 – diamo una mano ai motori di ricerca


<!DOCTYPE html><html lang="it"><head>

<title>Titolo della pagina</title><meta name="viewport" content="width=device-width, initial-scale=1.0">

</head><body>

<header><img src="nome-azienda.png" alt="Sito Web Azienda XYZ">

</header><nav>menu di navigazione</nav><aside>

<section>Ricerca nel form:...</section><nav>... Categorie ...</nav>

</aside> <section>

<h1>Contenuto Tag H1</h1><article>

<h2>Contenuto Tag H2</h2><p>...Contenuto...</p>

</article></section><footer> <p>Copyright 2015 - Tutti i diritti riservati.</p></footer>

</body></html>

HTML5 – tag <head> per la SEO


<html lang=“it"> specifichiamo il linguaggio della nostra pagina

<title>Titolo della pagina</title> il tag più importante, specifica di cosa parliamo

<meta charset="UTF-8"> indichiamo la codifica con cui è scritta la nostra pagina (incluse particolari es. cirillico)

<meta name="description" content=“Riassunto contenuto della pagina"> forniamo sia all’utente che al motore una indicazione breve

<meta name="keywords" content=“elenco keywords"> ormai è pratica comune ometterle causa influenza nulla

<meta name="author" content=“Russo Matteo"> questo viene recepito anche quando condividete un contenuto sui social

Title

Description (o elaborazione Google)

Tag “Author”

HTML5 – tag <body> per la SEO


<strong>testo </strong> <em>testo</em><blockquote>testo</blockquote><mark>testo</mark>Enfasi su determinate frasi e concetti, utile sia all’utente che ai motori di ricerca

<h1>capo paragrafo</h1><h2>titolo importante</h2><p>contenuto</p><h3>titolo meno importante</h3><p>contenuto</p><h2>titolo importante</h2><p>contenuto</p><h3>titolo meno importante</h3>Strutturiamo sempre nel migliore dei modi i nostri documenti

<a href=“mia-url.html” title=“descrizione ampia su cosa contiene la risorsa collegata” rel=“follow” target=“_blank”>anchor text</a>Sfruttiamo il tag title differenziandolo dall’anchor text: potremmo addirittura posizionare alcune pagine di un sito con questa tecnica!

<img src=“nome-file.jpg” alt=“descrizione dell’immagine”> nome del file valido, la descrizione utile per non vedenti e motori di ricerca

HTML5 – markup schema.org


Da cosi….

<div> <h1>Avatar</h1> <span>Director: James Cameron (born August 16, 1954)</span> <span>Science fiction</span> <a href="../movies/avatar-theatrical-trailer.html">Trailer</a></div>

A così….

<div itemscope itemtype="http://schema.org/Movie"> <h1 itemprop="name“>Avatar</h1> <div itemprop="director" itemscope itemtype="http://schema.org/Person"> Director: <span itemprop="name">James Cameron</span> (born <span itemprop="birthDate">August 16, 1954)</span> </div> <span itemprop="genre">Science fiction</span> <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a></div>

I motori di ricerca utilizzano il markup all'interno della pagina in diversi modi; Google, ad esempio, lo utilizza per creare rich snippet nei risultati di ricerca. Nei risultati di ricerca non vengono presentati tutti i tipi di informazioni specificati utilizzando schema.org, ma con il passare del tempo verranno utilizzati più dati in più modi. Inoltre, poiché il markup è accessibile pubblicamente dalle tue pagine web, altre organizzazioni potrebbero scoprire nuovi metodi interessanti per sfruttarlo.

HTML5 – markup schema.org


Sono disponibili tantissimi “item”, scegliamo quelli più adatti ai nostri dati da rappresentare:

Libri Film Musica Ricette Serie TV Eventi Persone Luoghi Attività Commerciali Ristoranti Offerte Schede Prodotto …. Qui la lista completa: http://schema.org/docs/full.html

…tra poco vedremo dove e come testare i nostri dati strutturati!

http://schema.org/docs/full.html

Accesso al sito – robots.txt


Un file robots.txt settato male può BLOCCARE l’indicizzazione del vostro sito!!! Massima attenzione!

User-agent: * Disallow: /Blocchiamo l’accesso a tutto il nostro sito

User-agent: * Disallow: /beta/ Disallow: /admin/Blocchiamo l’accesso solo alla cartella di amministrazione ed alla beta del nuovo sito

User-agent: Google Disallow:Via libera solo al Google-bot

User-agent: * Disallow:Via libera a tutti

Sitemap: http://www.miosito.it/sitemap.xml Indichiamo ai motori dove si trova la sitemap (uno spazio dalla riga precedente!)

http://www.miosito.it/sitemap.xml

http://www.miosito.it/sitemap.xml

Cose da sapere.. – tracciamento dati


Sicuramente terremo traccia del traffico sul nostro sito web.

Apriamo un account Google Analytics Creiamo la proprietà e la vista Recuperiamo il codice di tracciamento Inseriamo nelle nostre pagine, IMMEDIATAMENTE dopo il tag <body>

<body><script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXXXXX-XX', 'auto'); ga('send', 'pageview');

</script><p>…contenuto…</p>

</body>

Inserendo il codice appena dopo il tag body, tracceremo eventuali chiusure anticipate della pagina

Strumenti per Webmaster


Creiamo gli account per entrambi

Inseriamo il nostro sito web, preleviamo il codice di verifica proprietà ed inseriamolo nel tag <head>

<meta name="google-site-verification" content=“AYYGYGYGAYGAYGAYGAYGAAA098908908908908" /> <meta name="msvalidate.01" content=“89C7SD89AS79SA8D70AS98D7AS89D7A" />

Sottoporre sitemap | Controllare le query di ricerca | Controllare eventuali errori di scansione rilevati da Google | Disavow Tool Markup Test

http://www.phpseo.it/



Abbiamo terminato… per oggi


Grazie per avermi seguito, qui di seguito tutti i miei contatti per informazioni e consulenze:

• E-Mail: [email protected]

• Skype: computer-web

• Linkedin: http://it.linkedin.com/in/matteorusso80

• Facebook: https://www.facebook.com/matteo.russo.90260

• Web: http://www.phpseo.it

mailto:[email protected]

http://it.linkedin.com/in/matteorusso80

https://www.facebook.com/matteo.russo.90260

https://www.facebook.com/matteo.russo.90260


Seo html russo

Internet

Transcript of Seo html russo