seo-talk.yml

## Search engine optimization for symfony developers
### International PHP Conference - Munic 2018
#### Maximilian Berghoff

---

# !Prophet && !Profit

Note: two almost eqaul words, but a lot cusultants use it the other way around


---

# SEO?

Note: so lets concentrate on things we know, .. (CLICK) ... 
---

# User Experience

Note: ... and on things which are good for the user at all
- search engines do not care about user 
- but they care about reaching content as easy as possible
- mostly for own purpose
- but is a thing the user benefits also

---

# Positive Ranking
#### (from a techncial perspective)

- Fast pages
- Secure pages
- Well Structured Source Code
- Open information

--- 

# Negative Ranking
#### (from a techncial perspective)

- Deep & complex navigation structure
- Fakes (Popups, ..)

---

# Result
#### (Not related to any Framework)

Note: Nothing to do with any Frameork, caus it is doable in plain php and some templating also:

---

## Links - Navigation

Note: Questions:
- Do user (i mean that one visiting our page) understand wordings like navigation, routing?
- Does the user see the URL? or care about it?
- URL was used to transport a Link, but have you ever seen a user typing a link from a sheet of paper?
- From my POV routing and navigation becomes more and more unteressting
- a better aproach would be ... (CLICK) ..

---

## Links
## Do not break - do not cheat

Note: nothing technicial
- just for the user, so they should be visible
- lets controll the routing from a technical perspective
- controll means: it works -> monitoring 
- make it easy to create valid existing links in your app - avoid hardcoded links

---

## SSL
## No HTTPS - Less secure

Note: there are even browser not connecting to that page
- non HTTPS Site will loose ranking
- there is no reason not have a HTTPS page
- plase add a certificate
- haveing letencrypt makes it easy

---

## HTML | Source Code

Note: it becomes usual to have a dom created by templates with increasing dependency depths
- or, created by frontend-frameworks on the fly
- or, created by limits of a css library
- so lets have ...

---

## Valid Source Code

Note: We should have valid source code at all. At least the one a search enginge sees first should not be:
- broken
- delivered fast
- and well structured ... (KLICK) ... i mean ...

---

## Structured headlines

Note: it is no secret, but the priority in our headlines is a feature to:
- give a semantic structure
- separate content
- to highlight
- and not to: set text positons and breake order of headlines by changing size.
- user and search engine will be happy
  And ... (CLICK) ...

---

## Structuring HTML elements
#### (`<header></header>`, `<sitebar></sitebar>`, `<article></article>`)

Note: you should use structural html tags as they are given. so there is no need to have ... (CLICK) ...

---

##  Instead of
####`<div class="nav"></div>`
## use
####`<nav></nav>`

Note: ... 
- had several tasks, which are not technicial at all
- we can give technicial support
- i.e. tools to validate html on the fly for content editors to not create invalid html. 
- but we should outout valid html at all
- lets have a look on some other information ... (CLICK) ...

---

# Meta information

Note: i mean
- we have had items to present content in a valid and structured way.
- now we present additional information especial for search engins or preview on search engine list or SM-Apps
- what wee need are ... (CLICK) ...
---

## Meta tags - basic

Note: That is a base set of meta tags, thos one we should know at all
- give browser information for view port
- title, description and som keywording
- canonical link - we will see him later.
- former important information for search information
- currently used, but alsmos not influce on ranking

---

## Meta tags - open graph

Note: that is a kind of a namespaced information. Almost equal to the basic one in this example, but
- used to make a web page to a rich object in a social graph
- used by facebook
- further information -> Link

---

## Meta tags - Twitter

Note: You ever asked how those nice images are done, when sharing links on twitter
- this one is the answer
- and it is just an other namespace compared to og
- we have seen some tags with content now, but ... (CLICK) ... 

---

## Who does the administration?

Note: i mean, that can be extra field on my adminstration pannel next to the content-editor, but:
- makes that sense to edit on every article or page my content app delivers?
- what is a good way to introduce that values into my response?

---

# Framework
## Symfony

Note: ... here we should start using a toolset
- and having a php application there is only one choice
- but it is up to you
- your choice will hopefully have a feature set i try to show now
- ... (CLICK) ...

---

Note: This a version your <head> seciton could look like. 
- looks shorter and easier now
- part of the toolset is obvios now ...(CLiCK) ...

---

## SonataSeoBundle

Note: feature rich bundle to serve seo relevant functions.
- main interface for us is the `SeoPage` object
- it offers setter to set values
- which are used by that view helper

---

## SeoPage

Note: just add some lines to a listener in symfony request ciycle
- inject page object as a service
- and set the values

---

## Add Listener

Note: to have those values set in each response i'd add a listener
- here we use the 'point' onKernelRequest
- you could do it on your own, it should work
- but having it that way, we are one step away from usinng my first little open source project .. (CLICK) ...

---

# CMF SeoBundle

Note: ...
- it is more then 5 years ago when Lukas fixed me with the Symfony CMF
- back that time i was working for company mostly working on content stuff and i really liked the idea
- so i starting playint around with it
- in Feb. 2014 i started working with the SeoBundle, starting with an proposal, over an POV 
- and finaliy i had a first stable verseion together with CMF 1.1
- who does not know what CMF can talk to me afterwards in short: it is a Framework to solve CMS tasks inside of your Symfony Application
- today i am one of the core maintainers of the complete ecosphere
- and one last word to it: my major steps out of the smal little company up the most awesome Web Company in Germany, was caused in my OS work
- but now lets have a look how that bundle should solve your issues

---

### Content in the center

Note: lets forget how to persist that kind of object for now
- important is: we need that interface
- `SeoMetadata` will containtain most of our data, we need to set in our meta tags
- persisting it in a CMF compatible way, and doing some ... (CLICK) ...

---

## Cmf Seo - Configuration

Note: here you can see that i'd recomand to a use cmf-seo together with its core bundle too.
- title and description are translated at all and can live as an extension
- it is up to you
- the variable part is the one you can pass from your content.
- same for descritpion and keywords

---

## Cmf Seo
### That's it

Note: not with the talk, but you don't need anything else.
- have the seo data beside your content, you persisted on some way, our `Listener` will catch it up and pass it to the `SeoPage` of sonata
- you should set the helper function i mentioned before

---

### I do not whant to edit it on each Content element

Note: i'd expect that sentence by your content editors
- i would react to, caus except, that you got the seo stuff easier in, your content editor got the same work
- we can do better ... (CLICK)

---

## Extractors

Note: When using CMF SeoBundle you should use the thing i called `Extractors`
- at the end they are simple interfaces
- interfaces to define content and methods to fetch seo properties right out of the content

---

## Extractors


Note: Doing it that way your content editor does not have to copy-paste the title around
- you simply define a kind of a transformer function.
- can be overwritten by values living in SeoMetadata
- means, exceptions can be handled in admin also

---

## More then Meta Tags

Note: sure SEO is moren than having meta tags
- but having a kind of automatism for it can be really good
- but that bundle is able to do more.
- so what about .. (CLICK) ...

---

## Alternate languages

Note: having the content in a tree alike structure can really help to handle translations.
- just move your translations to leafs of your tree, to have them together
- this aspect would make it easy to respond question for alternative languages
- that means other languages the content exists in
- for SeoBundle ... (CLICK) ...

---

## CMF SeoBundle - Alternate Languages

### Configuration
### Twig function
### Result
Note: it is just a configuration and a twig function to get alternate languages.

---

## Sitemap

Note: Yes, that is a seo topic at all.
- we do need them to give complete overview of the navigation for the user also
- search engines use them to get all routes and information how when to come back next time
- so ... (CLICK) ...

---

## Sitemaps

### Configuration
### Define Routing
### Implement `SitemapAwareInterface`
#### Navigate to `/sitemaps/default.[html|xml|json]

Note: again
- we need some configuration only
- add routing 
- and navigate to the url in the format you which
- We expect  a flag on your content, to mark it as visible on a specific sitemapg
- behind the scenes a voting system can be extended if you would like to do it more complex

---

## Error Handling

Note: I count even that topic belongs to SEO
- cause, i as a user expect valid status codes when visiting a page that does not exist 404
- cause, i as a user expect friendly hint, where i can go else

---

## Error Handling

### Configuration

### Ready to get your errors

Note: that's it again. 
- having that template the SeoBunle will overwrite the error handling in Symfony and respond with an own page
- will display the stuff you define it it  - i.e. a link to homepage and other
- will also serve some suggestions
- why suggestions? 
- having conent in a tree alike strucure makes it easy to evaluate possible parents or siblings of a falsy url 
- that is especially for me as i make so many typos
- let's have a look into the future also

---

# Structured Data

Note: ...
- i must admit, that this them is not futuristic at all
- quite common to define more information for search engins in a JSON-LD

---

## Structured Data

Note: that is the magic
- That are values a seo package should serve
- and i will do so
- again it will be separated in a common part, which lives in SonataSeoBundle
- and a part which lives in CMF context
- but structured data isn't that json-ld string at all

---

## Structured Data - Part Two

Note: we can define and mark specific entities inside html dom.
- there is a complete list of possible entities can be found on schema.org
- there Person, Address, Organisation, down to the Broadcasting company you see here.