A static site generator for data apps, dashboards, reports, and more. Observable Framework combines JavaScript on the front-end for interactive graphics with any language on the back-end for data analysis.
Framework produces just the required DOCTYPE, stuff, and more stuff. This is in strict compliance with the HTML specification, as I read it, but still counter to every introduction to HTML I've ever seen. In addition, I think it causes problems with meta-tags and SEO.
I bring up this issue because I've noticed that HTML generated by Framework does not work well LinkedIn. In particular, the Open Graph meta tags appear to be ignored. You can check how things will look when you post a link to LinkedIn using their post inspector. You can also link those results. For example, here's the post inspector's analysis of my Mark on Framework blog front page:
I get a warning that I should add an og:image meta-tag and no image appears in the output. If you examine the page source, though, there is an og:image meta-tag that points to an image on the server.
My guess is that LinkedIn looks for the og:image meta-tag within a head element. To test this, I generated a more recent post on my other Framework generated blog. This time, I ran it through the post inspector before linking to it on LinkedIn. Again, the image was missing. So..., I manually edited the HTML to add the additional html, head, and body tags. Then, the og:image tag was picked up, as you can see:
I'm aware of issue 1656, which asks if an explicit head element should be included. While that issue was closed, there still doesn't seem to be a head generated in V1.12.
It would be great if some SEO tools could be included in Framework. As it is, i's a bit of a hassle to use the head function in the config file .
Feel free to upvote my LinkedIn post, which I think is a pretty nice example of what you can do with Framework.
As of V1.12, Framework produces HTML without the standard structure of
Framework produces just the required
DOCTYPE
,stuff
, andmore stuff
. This is in strict compliance with the HTML specification, as I read it, but still counter to every introduction to HTML I've ever seen. In addition, I think it causes problems with meta-tags and SEO.I bring up this issue because I've noticed that HTML generated by Framework does not work well LinkedIn. In particular, the Open Graph meta tags appear to be ignored. You can check how things will look when you post a link to LinkedIn using their post inspector. You can also link those results. For example, here's the post inspector's analysis of my Mark on Framework blog front page:
https://www.linkedin.com/post-inspector/inspect/https:%2F%2Fmcmcclur.observablehq.cloud%2Fmark-on-framework%2F
I get a warning that I should add an og:image meta-tag and no image appears in the output. If you examine the page source, though, there is an og:image meta-tag that points to an image on the server.
My guess is that LinkedIn looks for the og:image meta-tag within a head element. To test this, I generated a more recent post on my other Framework generated blog. This time, I ran it through the post inspector before linking to it on LinkedIn. Again, the image was missing. So..., I manually edited the HTML to add the additional
html
,head
, andbody
tags. Then, theog:image
tag was picked up, as you can see:https://www.linkedin.com/post-inspector/inspect/https:%2F%2Fblog.wncviz.com%2Fposts%2FMisc%2Fhurricanes%2F
Here are a few tangential comments:
head
element should be included. While that issue was closed, there still doesn't seem to be a head generated in V1.12.