SlideShare a Scribd company logo
1 of 41
NEOS & SEO
Sebastian Helzle
• Product Owner
@ punkt.de / Karlsruhe
• Neos Core Team Member
• @sebobo
Overview
• Motivation
• The Neos SEO package
• Tracking with Google Analytics & Piwik
• Accelerated Mobile Pages with Fusion
• Rich snippets and cards with Fusion
• Concept for a SEO editing mode
Motivation
The bad parts
The good parts
Better code
The SEO Package
What it does for you
• Provides Mixins for adding
• Simple metadata
• OpenGraph data
• Twitter Cards
• Canonical Link
• XML Sitemap
What it does for you
• Configurable XML Sitemap
• Adds metadata to all page types
• Metadata editable in the inspector
• Good boilerplate for doing SEO in Neos
• Extend it
• Override it
• Provide automatic fallbacks for fields
Other packages
• Search for SEO in the
Neos package list
Tracking with
Google & Piwik
Analytics packages
• See live data in the Neos backend
• See how pages perform while editing
• Easier to decide if a page is valuable
• Add tracking scripts
• Backend modules for „easy“ configuration
• Depends a bit on the setup
Some notes
• Google package maintained by core
• Piwik package maintained by community
• Neos 3.0 compatibility released
• What’s missing
• Separate configurations for multi-sites
• Persist configuration edited via the backend module
• Fully simulate production on staging
Advanced Mobile
Pages with Fusion
What is AMP
• Guidelines for HTML, Javascript & CSS
• Allows validation
• Goal is to increase performance
„Instant articles“
• Forces you to make less cluttered sites
• Automatically runs optimizations
• Can be cached by Google
• Highlighted in search results
AMP specials
• Provides special components & tags
• Is extended all the time with new functionality
• Tracking
• Interactive elements
• Effects
• More on https://www.ampproject.org/docs/reference/components
• Platform support see https://www.ampproject.org/support/faqs/supported-
platforms
Working example
• Checkout out the `shel/blog` package
• Rendering switch for AMP mode
• Injects JS & CSS
• Replaces special tags like img
• Alternative URLs for discovery
• Get inspired and copy!
primaryContent = Neos.Neos:PrimaryContent {
@process.replaceImgTags = ${String.pregReplace(
value, '/<img (.*?)>/s', '<amp-img layout=responsive $1>')}
}
Other ways of doing it
• AMP for a few sites <-> AMP for the whole page
• Use a few specials or a lot
• Override prototype templates for AMP (by Daniel Kestler)
https://www.medienreaktor.de/blog/2017/03/24/instant-articles-und-
google-amp-mit-neos/
Some notes
• Can help political debate
• Compare sources
• Good for areas with slow internet
• Especially in developing countries
• Mainly supported by Google
Rich snippets and
cards with Fusion
<div>
<span>Julius Caesar at Shakespeare's Globe</span>
<span>Wed 01 October 2014 19:30</span>
</div>
<div itemscope="" itemtype="http://schema.org/TheaterEvent">
<span itemprop="name">Julius Caesar at Shakespeare's Globe</span>
<div itemprop="location" itemscope="" itemtype="http://schema.org/PerformingArtsTheater">
<meta itemprop="name" content="Shakespeare's Globe"/>
<link itemprop="sameAs" href="http://www.shakespearesglobe.com/"/>
<meta itemprop="address" content="London, UK"/>
</div>
<div itemprop="offers" itemscope="" itemtype="http://schema.org/Offer">
<link itemprop="url" href="/examples/ticket/0012301230123"/>
</div>
<span itemprop="startDate" content="2014-10-01T19:30">Wed 01 October 2014 19:30</span>
<div itemprop="workPerformed" itemscope="" itemtype="http://schema.org/CreativeWork">
<link itemprop="sameAs" href="http://en.wikipedia.org/wiki/Julius_Caesar_(play)"/>
<link itemprop="sameAs" href="http://worldcat.org/entity/work/id/1807288036"/>
<div itemprop="creator" itemscope="" itemtype="http://schema.org/Person">
<meta itemprop="name" content="William Shakespeare"/>
<link itemprop="sameAs" href="http://en.wikipedia.org/wiki/William_Shakespeare"/>
</div>
</div>
</div>
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "TheaterEvent",
"name": "Julius Caesar at Shakespeare's Globe",
"location": {
"@type": "PerformingArtsTheater",
"name": "Shakespeare's Globe",
"sameAs": "http://www.shakespearesglobe.com/",
"address": "London, UK"
},
"offers": {
"@type": "Offer",
"url": "/examples/ticket/0012301230123"
},
"startDate": "2014-10-01T19:30",
"workPerformed": {
"@type": "CreativeWork",
"name": "Julius Caesar",
"sameAs": "http://en.wikipedia.org/wiki/Julius_Caesar_(play)",
"sameAs": "http://worldcat.org/entity/work/id/1807288036",
"creator": {
"@type": "Person",
"name": "William Shakespeare",
"sameAs": "http://en.wikipedia.org/wiki/William_Shakespeare"
}
}
}
</script>
Rich search results
Rich Cards
What’s possible
• Google provides several
visualizations for different types
• Recipes
• Events
• Products
• Reviews
• Check out Google Search Gallery
How to use it
• Checkout structure on schema.org
• Either add data in html or via Json-LD
• Markup needs to be taken care of
• Json-LD can be appended
• Split presentation from data
• Verify on https://search.google.com/structured-data/testing-tool
Google Webmastertools
Json-LD as datasource
prototype(Neos.Neos:Page) {
head {
ampLink = Neos.Fusion:Tag {}
blogMicroData = Shel.Blog:MicroData {
@if.isBlogEntry = ${q(documentNode).is('[instanceof Shel.Blog:BlogEntry]')}
}
}
}
prototype(Shel.Blog:BlogEntry) {
@process.addMicrodata = Shel.Blog:BlogMicroData
}
prototype(Shel.Blog:MicroData) < prototype(Neos.Fusion:Tag) {
tagName = 'script'
attributes.type = 'application/ld+json'
@context {}
content = Neos.Fusion:RawArray {
'@context' = 'http://schema.org'
'@type' = 'NewsArticle'
headline = ${q(documentNode).property('title')}
datePublished = ${Date.format(q(documentNode).property('publicationDate'), 'c')}
dateModified = ${Date.format(q(documentNode).property('_lastModificationDateTime'), 'c')}
description = ${String.stripTags(q(documentNode).property('entrySummary'))}
mainEntityOfPage = Neos.Neos:NodeUri {
node = ${documentNode}
absolute = true
}
author = Neos.Fusion:RawArray {
'@type' = 'Person'
name = ${q(documentNode).property('authorName')}
}
publisher = Neos.Fusion:RawArray {}
image = Neos.Fusion:RawArray {}
@process.toJson = ${Json.stringify(value)}
}
}
Concept for a SEO
editing mode
Prototype
• Show set data in a
structured view
• Highlight problems
and good parts
More ideas
• Preview like Google
• Needs desktop preview, AMP, etc…
• Twitter Card preview
Even more ideas
• Component for React UI with live updates
• Integration with Elasticsearch for content analysis
• Finish & release the package in a stable version
Some notes
• Find concept on github.com/Sebobo/Shel.SeoView
• Copy and extend!
Questions?

More Related Content

What's hot

Quick start guide to java script frameworks for sharepoint add ins oslo
Quick start guide to java script frameworks for sharepoint add ins osloQuick start guide to java script frameworks for sharepoint add ins oslo
Quick start guide to java script frameworks for sharepoint add ins osloSonja Madsen
 
Going Multi-Tenant with dotCMS
Going Multi-Tenant with dotCMSGoing Multi-Tenant with dotCMS
Going Multi-Tenant with dotCMSdotCMS
 
Back to the 90s' - Revenge of the static website
Back to the 90s' - Revenge of the static websiteBack to the 90s' - Revenge of the static website
Back to the 90s' - Revenge of the static websiteYves Goeleven
 
Alfresco Day Stockholm 2015 - Rapid UI Development
Alfresco Day Stockholm 2015 - Rapid UI DevelopmentAlfresco Day Stockholm 2015 - Rapid UI Development
Alfresco Day Stockholm 2015 - Rapid UI DevelopmentNicole Szigeti
 
Isomorphic WordPress Applications with NodeifyWP
Isomorphic WordPress Applications with NodeifyWPIsomorphic WordPress Applications with NodeifyWP
Isomorphic WordPress Applications with NodeifyWPTaylor Lovett
 
JSON REST API for WordPress
JSON REST API for WordPressJSON REST API for WordPress
JSON REST API for WordPressTaylor Lovett
 
Wordpress as a Backend
Wordpress as a BackendWordpress as a Backend
Wordpress as a BackendAndrew Duthie
 
2011 - SharePoint + jQuery
2011 - SharePoint + jQuery2011 - SharePoint + jQuery
2011 - SharePoint + jQueryChris O'Connor
 
Elastic & Azure & Episever, Case Evira
Elastic & Azure & Episever, Case EviraElastic & Azure & Episever, Case Evira
Elastic & Azure & Episever, Case EviraMikko Huilaja
 
Episerver and search engines
Episerver and search enginesEpiserver and search engines
Episerver and search enginesMikko Huilaja
 
Modernizing WordPress Search with Elasticsearch
Modernizing WordPress Search with ElasticsearchModernizing WordPress Search with Elasticsearch
Modernizing WordPress Search with ElasticsearchTaylor Lovett
 
Introduction to Web Components
Introduction to Web ComponentsIntroduction to Web Components
Introduction to Web ComponentsRich Bradshaw
 
Custom Elements with Polymer Web Components #econfpsu16
Custom Elements with Polymer Web Components #econfpsu16Custom Elements with Polymer Web Components #econfpsu16
Custom Elements with Polymer Web Components #econfpsu16John Riviello
 
Best Practices for WordPress in Enterprise
Best Practices for WordPress in EnterpriseBest Practices for WordPress in Enterprise
Best Practices for WordPress in EnterpriseTaylor Lovett
 

What's hot (20)

Quick start guide to java script frameworks for sharepoint add ins oslo
Quick start guide to java script frameworks for sharepoint add ins osloQuick start guide to java script frameworks for sharepoint add ins oslo
Quick start guide to java script frameworks for sharepoint add ins oslo
 
Going Multi-Tenant with dotCMS
Going Multi-Tenant with dotCMSGoing Multi-Tenant with dotCMS
Going Multi-Tenant with dotCMS
 
Back to the 90s' - Revenge of the static website
Back to the 90s' - Revenge of the static websiteBack to the 90s' - Revenge of the static website
Back to the 90s' - Revenge of the static website
 
Alfresco Day Stockholm 2015 - Rapid UI Development
Alfresco Day Stockholm 2015 - Rapid UI DevelopmentAlfresco Day Stockholm 2015 - Rapid UI Development
Alfresco Day Stockholm 2015 - Rapid UI Development
 
Isomorphic WordPress Applications with NodeifyWP
Isomorphic WordPress Applications with NodeifyWPIsomorphic WordPress Applications with NodeifyWP
Isomorphic WordPress Applications with NodeifyWP
 
JSON REST API for WordPress
JSON REST API for WordPressJSON REST API for WordPress
JSON REST API for WordPress
 
Wordpress as a Backend
Wordpress as a BackendWordpress as a Backend
Wordpress as a Backend
 
Challenges going mobile
Challenges going mobileChallenges going mobile
Challenges going mobile
 
HTML5: Introduction
HTML5: IntroductionHTML5: Introduction
HTML5: Introduction
 
2011 - SharePoint + jQuery
2011 - SharePoint + jQuery2011 - SharePoint + jQuery
2011 - SharePoint + jQuery
 
Elastic & Azure & Episever, Case Evira
Elastic & Azure & Episever, Case EviraElastic & Azure & Episever, Case Evira
Elastic & Azure & Episever, Case Evira
 
Html5
Html5Html5
Html5
 
Episerver and search engines
Episerver and search enginesEpiserver and search engines
Episerver and search engines
 
Modernizing WordPress Search with Elasticsearch
Modernizing WordPress Search with ElasticsearchModernizing WordPress Search with Elasticsearch
Modernizing WordPress Search with Elasticsearch
 
Fluxible
FluxibleFluxible
Fluxible
 
Introduction to Web Components
Introduction to Web ComponentsIntroduction to Web Components
Introduction to Web Components
 
Custom Elements with Polymer Web Components #econfpsu16
Custom Elements with Polymer Web Components #econfpsu16Custom Elements with Polymer Web Components #econfpsu16
Custom Elements with Polymer Web Components #econfpsu16
 
Oracle APEX Nitro
Oracle APEX NitroOracle APEX Nitro
Oracle APEX Nitro
 
pjax+Rails
pjax+Railspjax+Rails
pjax+Rails
 
Best Practices for WordPress in Enterprise
Best Practices for WordPress in EnterpriseBest Practices for WordPress in Enterprise
Best Practices for WordPress in Enterprise
 

Similar to Neos SEO Optimization Guide

Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...
Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...
Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...SPTechCon
 
State of search | drupal dinner
State of search | drupal dinnerState of search | drupal dinner
State of search | drupal dinnerJoris Vercammen
 
SPSNH 2014 - The SharePoint & jQueryGuide
SPSNH 2014 - The SharePoint & jQueryGuideSPSNH 2014 - The SharePoint & jQueryGuide
SPSNH 2014 - The SharePoint & jQueryGuideMark Rackley
 
SharePoint and jQuery Essentials
SharePoint and jQuery EssentialsSharePoint and jQuery Essentials
SharePoint and jQuery EssentialsMark Rackley
 
Untangling - fall2017 - week 9
Untangling - fall2017 - week 9Untangling - fall2017 - week 9
Untangling - fall2017 - week 9Derek Jacoby
 
Darwin web standards
Darwin web standardsDarwin web standards
Darwin web standardsJustin Avery
 
Writing an extensible web testing framework ready for the cloud slide share
Writing an extensible web testing framework ready for the cloud   slide shareWriting an extensible web testing framework ready for the cloud   slide share
Writing an extensible web testing framework ready for the cloud slide shareMike Ensor
 
jQuery Makes Writing JavaScript Fun Again (for HTML5 User Group)
jQuery Makes Writing JavaScript Fun Again (for HTML5 User Group)jQuery Makes Writing JavaScript Fun Again (for HTML5 User Group)
jQuery Makes Writing JavaScript Fun Again (for HTML5 User Group)Doris Chen
 
06 integrate elasticsearch
06 integrate elasticsearch06 integrate elasticsearch
06 integrate elasticsearchErhwen Kuo
 
SPTechCon Boston 2015 - Utilizing jQuery in SharePoint
SPTechCon Boston 2015 - Utilizing jQuery in SharePointSPTechCon Boston 2015 - Utilizing jQuery in SharePoint
SPTechCon Boston 2015 - Utilizing jQuery in SharePointMark Rackley
 
Share point development 101
Share point development 101Share point development 101
Share point development 101Becky Bertram
 
2.28.17 Introducing DSpace 7 Webinar Slides
2.28.17 Introducing DSpace 7 Webinar Slides2.28.17 Introducing DSpace 7 Webinar Slides
2.28.17 Introducing DSpace 7 Webinar SlidesDuraSpace
 
Untangling the web10
Untangling the web10Untangling the web10
Untangling the web10Derek Jacoby
 
HTML5, just another presentation :)
HTML5, just another presentation :)HTML5, just another presentation :)
HTML5, just another presentation :)François Massart
 
Challenges of Simple Documents: When Basic isn't so Basic - Cassandra Targett...
Challenges of Simple Documents: When Basic isn't so Basic - Cassandra Targett...Challenges of Simple Documents: When Basic isn't so Basic - Cassandra Targett...
Challenges of Simple Documents: When Basic isn't so Basic - Cassandra Targett...Lucidworks
 
SPTechCon DevDays - SharePoint & jQuery
SPTechCon DevDays - SharePoint & jQuerySPTechCon DevDays - SharePoint & jQuery
SPTechCon DevDays - SharePoint & jQueryMark Rackley
 

Similar to Neos SEO Optimization Guide (20)

Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...
Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...
Popping the Hood: How to Create Custom SharePoint Branding by Randy Drisgill ...
 
REST easy with API Platform
REST easy with API PlatformREST easy with API Platform
REST easy with API Platform
 
State of search | drupal dinner
State of search | drupal dinnerState of search | drupal dinner
State of search | drupal dinner
 
SPSNH 2014 - The SharePoint & jQueryGuide
SPSNH 2014 - The SharePoint & jQueryGuideSPSNH 2014 - The SharePoint & jQueryGuide
SPSNH 2014 - The SharePoint & jQueryGuide
 
SharePoint and jQuery Essentials
SharePoint and jQuery EssentialsSharePoint and jQuery Essentials
SharePoint and jQuery Essentials
 
Untangling - fall2017 - week 9
Untangling - fall2017 - week 9Untangling - fall2017 - week 9
Untangling - fall2017 - week 9
 
Darwin web standards
Darwin web standardsDarwin web standards
Darwin web standards
 
Writing an extensible web testing framework ready for the cloud slide share
Writing an extensible web testing framework ready for the cloud   slide shareWriting an extensible web testing framework ready for the cloud   slide share
Writing an extensible web testing framework ready for the cloud slide share
 
jQuery Makes Writing JavaScript Fun Again (for HTML5 User Group)
jQuery Makes Writing JavaScript Fun Again (for HTML5 User Group)jQuery Makes Writing JavaScript Fun Again (for HTML5 User Group)
jQuery Makes Writing JavaScript Fun Again (for HTML5 User Group)
 
Intro to HTML 5 / CSS 3
Intro to HTML 5 / CSS 3Intro to HTML 5 / CSS 3
Intro to HTML 5 / CSS 3
 
06 integrate elasticsearch
06 integrate elasticsearch06 integrate elasticsearch
06 integrate elasticsearch
 
SPTechCon Boston 2015 - Utilizing jQuery in SharePoint
SPTechCon Boston 2015 - Utilizing jQuery in SharePointSPTechCon Boston 2015 - Utilizing jQuery in SharePoint
SPTechCon Boston 2015 - Utilizing jQuery in SharePoint
 
Share point development 101
Share point development 101Share point development 101
Share point development 101
 
2.28.17 Introducing DSpace 7 Webinar Slides
2.28.17 Introducing DSpace 7 Webinar Slides2.28.17 Introducing DSpace 7 Webinar Slides
2.28.17 Introducing DSpace 7 Webinar Slides
 
Untangling the web10
Untangling the web10Untangling the web10
Untangling the web10
 
Web Services
Web ServicesWeb Services
Web Services
 
HTML5, just another presentation :)
HTML5, just another presentation :)HTML5, just another presentation :)
HTML5, just another presentation :)
 
Challenges of Simple Documents: When Basic isn't so Basic - Cassandra Targett...
Challenges of Simple Documents: When Basic isn't so Basic - Cassandra Targett...Challenges of Simple Documents: When Basic isn't so Basic - Cassandra Targett...
Challenges of Simple Documents: When Basic isn't so Basic - Cassandra Targett...
 
Demystifying HTML5
Demystifying HTML5Demystifying HTML5
Demystifying HTML5
 
SPTechCon DevDays - SharePoint & jQuery
SPTechCon DevDays - SharePoint & jQuerySPTechCon DevDays - SharePoint & jQuery
SPTechCon DevDays - SharePoint & jQuery
 

More from Sebastian Helzle

Neos CMS & SEO - The Next Level - NeosCon Dresden 2019
Neos CMS & SEO - The Next Level - NeosCon Dresden 2019Neos CMS & SEO - The Next Level - NeosCon Dresden 2019
Neos CMS & SEO - The Next Level - NeosCon Dresden 2019Sebastian Helzle
 
SEO with NeosCMS - Meet Neos Salzburg 2018
SEO with NeosCMS - Meet Neos Salzburg 2018SEO with NeosCMS - Meet Neos Salzburg 2018
SEO with NeosCMS - Meet Neos Salzburg 2018Sebastian Helzle
 
Semantic data in TYPO3 - T3CON18EU
Semantic data in TYPO3 - T3CON18EUSemantic data in TYPO3 - T3CON18EU
Semantic data in TYPO3 - T3CON18EUSebastian Helzle
 
Continuous relaunch – die einzige konstante ist die Veränderung
Continuous relaunch – die einzige konstante ist die VeränderungContinuous relaunch – die einzige konstante ist die Veränderung
Continuous relaunch – die einzige konstante ist die VeränderungSebastian Helzle
 
Tasty Recipes for Every Day 2016 (Neos)
Tasty Recipes for Every Day 2016 (Neos)Tasty Recipes for Every Day 2016 (Neos)
Tasty Recipes for Every Day 2016 (Neos)Sebastian Helzle
 
Conceptual understanding in development
Conceptual understanding in developmentConceptual understanding in development
Conceptual understanding in developmentSebastian Helzle
 
Improving conceptual understanding in development
Improving conceptual understanding in developmentImproving conceptual understanding in development
Improving conceptual understanding in developmentSebastian Helzle
 
Improving editors' lives with Neos CMS
Improving editors' lives with Neos CMSImproving editors' lives with Neos CMS
Improving editors' lives with Neos CMSSebastian Helzle
 
Testen von TYPO3 CMS/Flow/Neos Anwendungen mit Behat und Dalek.js
Testen von TYPO3 CMS/Flow/Neos Anwendungen mit Behat und Dalek.jsTesten von TYPO3 CMS/Flow/Neos Anwendungen mit Behat und Dalek.js
Testen von TYPO3 CMS/Flow/Neos Anwendungen mit Behat und Dalek.jsSebastian Helzle
 
Continuous delivery with open source tools
Continuous delivery with open source toolsContinuous delivery with open source tools
Continuous delivery with open source toolsSebastian Helzle
 

More from Sebastian Helzle (11)

Neos CMS & SEO - The Next Level - NeosCon Dresden 2019
Neos CMS & SEO - The Next Level - NeosCon Dresden 2019Neos CMS & SEO - The Next Level - NeosCon Dresden 2019
Neos CMS & SEO - The Next Level - NeosCon Dresden 2019
 
SEO with NeosCMS - Meet Neos Salzburg 2018
SEO with NeosCMS - Meet Neos Salzburg 2018SEO with NeosCMS - Meet Neos Salzburg 2018
SEO with NeosCMS - Meet Neos Salzburg 2018
 
Semantic data in TYPO3 - T3CON18EU
Semantic data in TYPO3 - T3CON18EUSemantic data in TYPO3 - T3CON18EU
Semantic data in TYPO3 - T3CON18EU
 
Continuous relaunch – die einzige konstante ist die Veränderung
Continuous relaunch – die einzige konstante ist die VeränderungContinuous relaunch – die einzige konstante ist die Veränderung
Continuous relaunch – die einzige konstante ist die Veränderung
 
Ci & proServer
Ci & proServerCi & proServer
Ci & proServer
 
Tasty Recipes for Every Day 2016 (Neos)
Tasty Recipes for Every Day 2016 (Neos)Tasty Recipes for Every Day 2016 (Neos)
Tasty Recipes for Every Day 2016 (Neos)
 
Conceptual understanding in development
Conceptual understanding in developmentConceptual understanding in development
Conceptual understanding in development
 
Improving conceptual understanding in development
Improving conceptual understanding in developmentImproving conceptual understanding in development
Improving conceptual understanding in development
 
Improving editors' lives with Neos CMS
Improving editors' lives with Neos CMSImproving editors' lives with Neos CMS
Improving editors' lives with Neos CMS
 
Testen von TYPO3 CMS/Flow/Neos Anwendungen mit Behat und Dalek.js
Testen von TYPO3 CMS/Flow/Neos Anwendungen mit Behat und Dalek.jsTesten von TYPO3 CMS/Flow/Neos Anwendungen mit Behat und Dalek.js
Testen von TYPO3 CMS/Flow/Neos Anwendungen mit Behat und Dalek.js
 
Continuous delivery with open source tools
Continuous delivery with open source toolsContinuous delivery with open source tools
Continuous delivery with open source tools
 

Recently uploaded

TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024Lonnie McRorey
 
Data governance with Unity Catalog Presentation
Data governance with Unity Catalog PresentationData governance with Unity Catalog Presentation
Data governance with Unity Catalog PresentationKnoldus Inc.
 
Varsha Sewlal- Cyber Attacks on Critical Critical Infrastructure
Varsha Sewlal- Cyber Attacks on Critical Critical InfrastructureVarsha Sewlal- Cyber Attacks on Critical Critical Infrastructure
Varsha Sewlal- Cyber Attacks on Critical Critical Infrastructureitnewsafrica
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024BookNet Canada
 
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptxThe Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptxLoriGlavin3
 
Zeshan Sattar- Assessing the skill requirements and industry expectations for...
Zeshan Sattar- Assessing the skill requirements and industry expectations for...Zeshan Sattar- Assessing the skill requirements and industry expectations for...
Zeshan Sattar- Assessing the skill requirements and industry expectations for...itnewsafrica
 
Abdul Kader Baba- Managing Cybersecurity Risks and Compliance Requirements i...
Abdul Kader Baba- Managing Cybersecurity Risks  and Compliance Requirements i...Abdul Kader Baba- Managing Cybersecurity Risks  and Compliance Requirements i...
Abdul Kader Baba- Managing Cybersecurity Risks and Compliance Requirements i...itnewsafrica
 
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptxThe Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptxLoriGlavin3
 
The Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsThe Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsPixlogix Infotech
 
Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24
Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24
Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24Mark Goldstein
 
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...Wes McKinney
 
The State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxThe State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxLoriGlavin3
 
Design pattern talk by Kaya Weers - 2024 (v2)
Design pattern talk by Kaya Weers - 2024 (v2)Design pattern talk by Kaya Weers - 2024 (v2)
Design pattern talk by Kaya Weers - 2024 (v2)Kaya Weers
 
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxA Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxLoriGlavin3
 
Top 10 Hubspot Development Companies in 2024
Top 10 Hubspot Development Companies in 2024Top 10 Hubspot Development Companies in 2024
Top 10 Hubspot Development Companies in 2024TopCSSGallery
 
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024BookNet Canada
 
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotes
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotesMuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotes
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotesManik S Magar
 
How to write a Business Continuity Plan
How to write a Business Continuity PlanHow to write a Business Continuity Plan
How to write a Business Continuity PlanDatabarracks
 
Digital Identity is Under Attack: FIDO Paris Seminar.pptx
Digital Identity is Under Attack: FIDO Paris Seminar.pptxDigital Identity is Under Attack: FIDO Paris Seminar.pptx
Digital Identity is Under Attack: FIDO Paris Seminar.pptxLoriGlavin3
 
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...Alkin Tezuysal
 

Recently uploaded (20)

TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024
 
Data governance with Unity Catalog Presentation
Data governance with Unity Catalog PresentationData governance with Unity Catalog Presentation
Data governance with Unity Catalog Presentation
 
Varsha Sewlal- Cyber Attacks on Critical Critical Infrastructure
Varsha Sewlal- Cyber Attacks on Critical Critical InfrastructureVarsha Sewlal- Cyber Attacks on Critical Critical Infrastructure
Varsha Sewlal- Cyber Attacks on Critical Critical Infrastructure
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
 
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptxThe Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx
The Fit for Passkeys for Employee and Consumer Sign-ins: FIDO Paris Seminar.pptx
 
Zeshan Sattar- Assessing the skill requirements and industry expectations for...
Zeshan Sattar- Assessing the skill requirements and industry expectations for...Zeshan Sattar- Assessing the skill requirements and industry expectations for...
Zeshan Sattar- Assessing the skill requirements and industry expectations for...
 
Abdul Kader Baba- Managing Cybersecurity Risks and Compliance Requirements i...
Abdul Kader Baba- Managing Cybersecurity Risks  and Compliance Requirements i...Abdul Kader Baba- Managing Cybersecurity Risks  and Compliance Requirements i...
Abdul Kader Baba- Managing Cybersecurity Risks and Compliance Requirements i...
 
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptxThe Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
The Role of FIDO in a Cyber Secure Netherlands: FIDO Paris Seminar.pptx
 
The Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsThe Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and Cons
 
Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24
Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24
Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24
 
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
 
The State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxThe State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptx
 
Design pattern talk by Kaya Weers - 2024 (v2)
Design pattern talk by Kaya Weers - 2024 (v2)Design pattern talk by Kaya Weers - 2024 (v2)
Design pattern talk by Kaya Weers - 2024 (v2)
 
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxA Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
 
Top 10 Hubspot Development Companies in 2024
Top 10 Hubspot Development Companies in 2024Top 10 Hubspot Development Companies in 2024
Top 10 Hubspot Development Companies in 2024
 
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
 
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotes
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotesMuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotes
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotes
 
How to write a Business Continuity Plan
How to write a Business Continuity PlanHow to write a Business Continuity Plan
How to write a Business Continuity Plan
 
Digital Identity is Under Attack: FIDO Paris Seminar.pptx
Digital Identity is Under Attack: FIDO Paris Seminar.pptxDigital Identity is Under Attack: FIDO Paris Seminar.pptx
Digital Identity is Under Attack: FIDO Paris Seminar.pptx
 
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
 

Neos SEO Optimization Guide

  • 2. Sebastian Helzle • Product Owner @ punkt.de / Karlsruhe • Neos Core Team Member • @sebobo
  • 3. Overview • Motivation • The Neos SEO package • Tracking with Google Analytics & Piwik • Accelerated Mobile Pages with Fusion • Rich snippets and cards with Fusion • Concept for a SEO editing mode
  • 9. What it does for you • Provides Mixins for adding • Simple metadata • OpenGraph data • Twitter Cards • Canonical Link • XML Sitemap
  • 10. What it does for you • Configurable XML Sitemap • Adds metadata to all page types • Metadata editable in the inspector • Good boilerplate for doing SEO in Neos • Extend it • Override it • Provide automatic fallbacks for fields
  • 11. Other packages • Search for SEO in the Neos package list
  • 13. Analytics packages • See live data in the Neos backend • See how pages perform while editing • Easier to decide if a page is valuable • Add tracking scripts • Backend modules for „easy“ configuration • Depends a bit on the setup
  • 14. Some notes • Google package maintained by core • Piwik package maintained by community • Neos 3.0 compatibility released • What’s missing • Separate configurations for multi-sites • Persist configuration edited via the backend module • Fully simulate production on staging
  • 16.
  • 17. What is AMP • Guidelines for HTML, Javascript & CSS • Allows validation • Goal is to increase performance „Instant articles“ • Forces you to make less cluttered sites • Automatically runs optimizations • Can be cached by Google • Highlighted in search results
  • 18. AMP specials • Provides special components & tags • Is extended all the time with new functionality • Tracking • Interactive elements • Effects • More on https://www.ampproject.org/docs/reference/components • Platform support see https://www.ampproject.org/support/faqs/supported- platforms
  • 19. Working example • Checkout out the `shel/blog` package • Rendering switch for AMP mode • Injects JS & CSS • Replaces special tags like img • Alternative URLs for discovery • Get inspired and copy!
  • 20. primaryContent = Neos.Neos:PrimaryContent { @process.replaceImgTags = ${String.pregReplace( value, '/<img (.*?)>/s', '<amp-img layout=responsive $1>')} }
  • 21. Other ways of doing it • AMP for a few sites <-> AMP for the whole page • Use a few specials or a lot • Override prototype templates for AMP (by Daniel Kestler) https://www.medienreaktor.de/blog/2017/03/24/instant-articles-und- google-amp-mit-neos/
  • 22. Some notes • Can help political debate • Compare sources • Good for areas with slow internet • Especially in developing countries • Mainly supported by Google
  • 23. Rich snippets and cards with Fusion
  • 24. <div> <span>Julius Caesar at Shakespeare's Globe</span> <span>Wed 01 October 2014 19:30</span> </div>
  • 25. <div itemscope="" itemtype="http://schema.org/TheaterEvent"> <span itemprop="name">Julius Caesar at Shakespeare's Globe</span> <div itemprop="location" itemscope="" itemtype="http://schema.org/PerformingArtsTheater"> <meta itemprop="name" content="Shakespeare's Globe"/> <link itemprop="sameAs" href="http://www.shakespearesglobe.com/"/> <meta itemprop="address" content="London, UK"/> </div> <div itemprop="offers" itemscope="" itemtype="http://schema.org/Offer"> <link itemprop="url" href="/examples/ticket/0012301230123"/> </div> <span itemprop="startDate" content="2014-10-01T19:30">Wed 01 October 2014 19:30</span> <div itemprop="workPerformed" itemscope="" itemtype="http://schema.org/CreativeWork"> <link itemprop="sameAs" href="http://en.wikipedia.org/wiki/Julius_Caesar_(play)"/> <link itemprop="sameAs" href="http://worldcat.org/entity/work/id/1807288036"/> <div itemprop="creator" itemscope="" itemtype="http://schema.org/Person"> <meta itemprop="name" content="William Shakespeare"/> <link itemprop="sameAs" href="http://en.wikipedia.org/wiki/William_Shakespeare"/> </div> </div> </div>
  • 26. <script type="application/ld+json"> { "@context": "http://schema.org", "@type": "TheaterEvent", "name": "Julius Caesar at Shakespeare's Globe", "location": { "@type": "PerformingArtsTheater", "name": "Shakespeare's Globe", "sameAs": "http://www.shakespearesglobe.com/", "address": "London, UK" }, "offers": { "@type": "Offer", "url": "/examples/ticket/0012301230123" }, "startDate": "2014-10-01T19:30", "workPerformed": { "@type": "CreativeWork", "name": "Julius Caesar", "sameAs": "http://en.wikipedia.org/wiki/Julius_Caesar_(play)", "sameAs": "http://worldcat.org/entity/work/id/1807288036", "creator": { "@type": "Person", "name": "William Shakespeare", "sameAs": "http://en.wikipedia.org/wiki/William_Shakespeare" } } } </script>
  • 29. What’s possible • Google provides several visualizations for different types • Recipes • Events • Products • Reviews • Check out Google Search Gallery
  • 30. How to use it • Checkout structure on schema.org • Either add data in html or via Json-LD • Markup needs to be taken care of • Json-LD can be appended • Split presentation from data • Verify on https://search.google.com/structured-data/testing-tool
  • 33. prototype(Neos.Neos:Page) { head { ampLink = Neos.Fusion:Tag {} blogMicroData = Shel.Blog:MicroData { @if.isBlogEntry = ${q(documentNode).is('[instanceof Shel.Blog:BlogEntry]')} } } }
  • 35. prototype(Shel.Blog:MicroData) < prototype(Neos.Fusion:Tag) { tagName = 'script' attributes.type = 'application/ld+json' @context {} content = Neos.Fusion:RawArray { '@context' = 'http://schema.org' '@type' = 'NewsArticle' headline = ${q(documentNode).property('title')} datePublished = ${Date.format(q(documentNode).property('publicationDate'), 'c')} dateModified = ${Date.format(q(documentNode).property('_lastModificationDateTime'), 'c')} description = ${String.stripTags(q(documentNode).property('entrySummary'))} mainEntityOfPage = Neos.Neos:NodeUri { node = ${documentNode} absolute = true } author = Neos.Fusion:RawArray { '@type' = 'Person' name = ${q(documentNode).property('authorName')} } publisher = Neos.Fusion:RawArray {} image = Neos.Fusion:RawArray {} @process.toJson = ${Json.stringify(value)} } }
  • 36. Concept for a SEO editing mode
  • 37. Prototype • Show set data in a structured view • Highlight problems and good parts
  • 38. More ideas • Preview like Google • Needs desktop preview, AMP, etc… • Twitter Card preview
  • 39. Even more ideas • Component for React UI with live updates • Integration with Elasticsearch for content analysis • Finish & release the package in a stable version
  • 40. Some notes • Find concept on github.com/Sebobo/Shel.SeoView • Copy and extend!

Editor's Notes

  1. SEO black magic Hide parts of menus Manipulate content & links
  2. Semantic rich data for content Think about the information you have -> information architecture Write correct code
  3. Leads to better code Better project Reusable data
  4. Simple metadata: as title, description, keywords, robots OpenGraph: type, title, description, image
  5. Facebook „Instant Articles“ were not that „instant“ Optimizations like deferred loading of images
  6. Simple html
  7. With microdata
  8. As JsonLD