WordPress SEO Theming - Πως η html5 επηρεάζει στο seo ενός wordpress site (Αλέξανδρος Ίτσιος - SEO Strategist, I&K EnterLogic LTD)

WordPress SEO Theming - Πως η html5 επηρεάζει στο seo ενός wordpress site

Transcript

1. WordPress SEO Theming Πως η HTML5 Επηρεάζει ένα WordPress site
2. 15 Ιαν, 2014 Αθήνα, Ελλάδα Παρουσιαστής: Αλέξανδρος Ίτσιος SEO Strategist I. & K. EnterLogic LTD.
3. 1 Τι είναι η HTML5? 2 Τι είναι το SEO? 3 Τμηματοποίηση Site & Κύρια HTML5 Tags 4 Τυπική Δομή ενός WordPress HTML5 Document 5 WordPress Optimization (Tools & Plugins) 6 Ερωτήσεις Περιεχόμενα Γρήγορη Επισκόπηση 2
4. Τι είναι η HTML5? Η HTML5 θα γίνει το νέο πρότυπο για την HTML. Έχει σκοπό να ενσωματώσει όχι μόνο την HTML4, αλλά και την XHTML 1, καθώς επίσης και το DOM Level 2 HTML. Σχεδιάστηκε με cross-platform λογική (tablet, smartphone, netbook, Smart TV) για να παρουσιάζει οτιδήποτε χρειαζόμαστε σε έναν browser χωρίς να χρειαζόμαστε πρόσθετα plugins, όπως γινόταν παλιότερα για audio, video, παιχνίδια, εφαρμογές κ.α. 3
5. Ποιος Έφτιαξε την HTML5? Η HTML5 δημιουργήθηκε από μία ομάδα developers των εταιρειών Mozilla, Opera και Apple. Σκοπός του συγκεκριμένου οργανισμού ήταν να εξελίξουν το HTML4 Πρότυπο προσθέτοντας την δυνατότητα υποστήριξης για web applications, μιας και δεν ήταν ευχαριστημένοι με την εξέλιξη της XHTML. To W3C απέρριψε το αίτημα τους και έτσι το 2004 δημιούργησαν το WHATWG (Web Hypertext Application Technology Working Group), μιας και πίστευαν ότι ο στόχος τους ήταν η σωστή κατεύθυνση για το web. 4
6. Ποιος Έφτιαξε την HTML5? Το 2005 δημοσιεύουν το πρώτο «πρόχειρο» πρότυπο, το οποίο λεγόταν Web Applications 1.0. To 2006 το W3C δέχτηκε να εξελίξει την hTML4 αντί για την XHTML, και μετονόμασαν το Web Appliations 1.0 σε HTML5. Το 2007 υπήρξε η πρώτη λειτουργική έκδοση της HTML5. Μέχρι το 2020 θα έχει ολοκληρωθεί το δοκιμαστικό κομμάτι της html5 και το 2022 θα θεωρείται το standard πρότυπο. 5
7. Τι είναι το SEO? To SEO είναι μια τεχνική, η οποία βοηθά τις μηχανές αναζήτησης (Google) να βρουν και να κατατάξουν υψηλότερα την ιστοσελίδα σας στα οργανικά τους αποτελέσματα, σε σχέση με τους ανταγωνιστές σας, όταν γίνεται μία αναζήτηση. Με αυτό τον τρόπο η ιστοσελίδα σας αποκτά περισσότερους επισκέπτες. 6
8. Τμηματοποίηση Site Οι μηχανές αναζήτησης (Google, Yahoo, Yandex κ.α.) γίνονται εξυπνότερες μέρα με τη μέρα, πράγμα που σημαίνει ότι ακόμη και τώρα κατανοούν τα διαφορετικά τμήματα μιας ιστοσελίδας για τους δικούς τους λόγους. Μέχρι στιγμής δεν υπήρχε η δυνατότητα οι webmasters να προσδιορίσουν με ακρίβεια τα διαφορετικά τμήματα και τη σημαντικότητα τους στις μηχανές αναζήτησης, αλλά αυτό θα αλλάξει με την HTML5. Με την HTML5 οι μηχανές αναζήτησης θα γνωρίζουν ποιο περιεχόμενο μέσα σε μια ιστοσελίδα είναι σημαντικότερο σε σχέση με κάποιο άλλο και φυσικά ποια εξωτερικά ή εσωτερικά links είναι σημαντικότερα σε σχέση με άλλα. 7
9. Κύρια HTML5 Tags Ποια HTMl5 Tags έχουν μεγαλύτερη αξία από πλευράς SEO; 8 <article> Article Tag <section> Section Tag <header> Header Tag <aside> Aside Tag <footer> Footer Tag <nav> Nav Tag
10. Article Tag <article> To <article> tag είναι πιθανότατα η καλύτερη προσθήκη που υπάρχει μέχρι τώρα από πλευράς SEO. Το <article> tag μας επιτρέπει να προσδιορίσουμε που αρχίζει και που τελειώνει το κυρίως κείμενο σε μία online δημοσίευση όπως τα blogs ή τα portals. Έτσι οι μηχανές αναζήτησης όπως το Google θα γνωρίζουν ακριβώς το σημείο που θα δώσουν περισσότερη βαρύτητα, σε σχέση με τα άλλα σημεία της ιστοσελίδας. 9
11. Section Tag <section> To <section> tag μπορεί να χρησιμοποιηθεί για να κατανοούν οι μηχανές αναζήτησης αποτελεσματικότερα πότε πρόκειται για διαφορετικό τομέα της ιστοσελίδας. Το κύριο πλεονέκτημα είναι ότι με αυτό το tag μπορούμε να προσθέσουμε διαφορετικά εσωτερικά τμήματα, όπως τα <header> και <footer> tags και έτσι οι μηχανές αναζήτησης θα κατανοούν αποτελεσματικότερα σε ποιο σημείο πρέπει να δώσουν περισσότερη έμφαση. Για παράδειγμα αν οι λέξεις μιας πρότασης βρίσκονται σε έναν κύριο τομέα, πιθανότατα να σημαίνει ότι έχουν μεγαλύτερη βαρύτητα σε σχέση με τα σημεία που εμφανίζονται σε άλλους δευτερεύοντες τομείς της συγκεκριμένης σελίδας. 10
12. Header Tag <Header> To <header> πρέπει να τονιστεί ότι διαφέρει από το <head> tag της ιστοσελίδας. Συνήθως εμφανίζεται στην αρχή της κάθε ενότητας και μπορεί να περιέχει χρήσιμο περιεχόμενο όπως headings, παραγράφους κ.α. 11
13. Footer Tag <footer> Στo <footer> τοποθετούμε πληροφορίες λιγότερο χρήσιμο για τις μηχανές αναζήτησης. Για παράδειγμα μπορούμε να τοποθετήσουμε εδώ τα WordPress tags, πότε δημοσιεύτηκε το άρθρο, ποιος είναι ο αρθρογράφος κλπ. 12
14. Nav Tag <nav> Με τo <nav> tag πλέον μπορούμε να προσδιορίσουμε με σαφήνεια στη μηχανής αναζήτησης ποιο είναι το σύστημα πλοήγησης της ιστοσελίδας, σε αντίθεση με δευτερεύοντα μενού σε ένα WordPress site, όπως ήταν μέχρι τώρα τα blogroll links κ.α. 13
15. Aside Tag <aside> Στo <aside> tag τοποθετούμε συνήθως δευτερεύοντες πληροφορίες οι οποίες έχουν σχέση με την κύρια ροή του περιεχομένου – ιστοσελίδας. 14
16. WordPress Header <header.php> <!DOCTYPE html> <html <?php language_attributes(); ?>> <head> <meta charset="<?php bloginfo( 'charset' ); ?>" /> <title><?php bloginfo('name'); ?> <?php wp_title(); ?></title> <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" /> <?php wp_head(); ?> </head> <body <?php body_class(); ?>> <header> <h1> <a href="<?php echo home_url(); ?>" >2nd WordPress Meetup</h1> <nav> <?php wp_nav_menu(); ?> </nav> </header> 15
17. Sidebar <sidebar.php> <aside> <article> <figure> <?php if ( has_post_thumbnail() ) { the_post_thumbnail(); } </figure> <h3> <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a> </h3> <?php the_excerpt(); ?> </article> </aside> 16
18. footer <footer.php> <footer> <p>Powered By I & K EnterLogic LTD</p> </footer> <?php wp_footer(); ?> </body> </html> 17
19. WordPress Optimization Tools & Plugins 1. Minify JQuery (jsmini.com) & CSS (cssminifier.com) 2. W3 Total Cache 3. Image Optimization (Smush.it - WP-SmushIt Plugin, Lazy Load Plugin, SEO Friendly Images Plugin) 4. Database Optimization (WP-Optimize Plugin) 5. Expire Headers (μέσω .htaccess) 6. Google Sitemap (Plugin) 7. Χρήση Στατικής HTML όπου είναι εφικτό 8. Αφαίρεση περιττών widgets, plugins κλπ 9. WordPress YOAST 18
20. Μη Διστάσετε να ρωτήσετε… Ερωτήσεις