Add structured data and blog-like structure to amp-live-list example

[ericlindley-g]

Hey @kul3r4, just getting this into github in bug form.

@erwinmombay 's demo: http://erwinm.herokuapp.com/examples.build/live-blog.amp.min.html

Recommended structure:

At the top of the example: Page title date (doesn't have to be updated) Paragraph at top that doesn't change

and for each new post: Post title byline Date/time of post Image paragraph of text sharing buttons

code for the above example can be found in the docs for amp-live-list

[sebastianbenz]

I prefer to keep the single blog items simpler:

• content
• date / time
• sharing buttons with anchor links

Adding title byline etc adds too much noise (and it's not really common with publishers either). Title and byline are usually only at the top. See this sample from the guardian:

https://www.theguardian.com/sport/live/2016/jul/20/tour-de-france-stage-17-live

[ericlindley-g]

Omitting the title and byline sounds good as a first pass—both versions show up a lot in the wild (possibly in different balances in US v. Europe), but let's take the fastest path to making something and can embellish later if we need to

Some examples w/ Byline/Title: NYT Washington Post CNN

[sebastianbenz]

Thanks for these samples Eric - wasn't aware of these.

Let's start with the simple version then. We can always add more...

[ericlindley-g]

Sounds good—thanks!

[sebastianbenz]

The first version is now online as a draft.

[ericlindley-g]

Great—it looks really nice already!

Is it ready for feedback? With just a quick look I would recommend a date/time format that includes the date, to contextualize the numbers, and including more text in the body of the article, to make it feel more like a blog. Lorem ipsum is fine (and may actually help communicate that it's placeholder content, whereas now it's easy to read each update as a pinterest-like card highlighing the object in the image

[sebastianbenz]

Makes sense. @kul3r4 what do you think?

[kul3r4]

Make sense to me, will add those suggestions.

[ericlindley-g]

Thanks — I would suggest looking at a few live blogs, and modeling the variety of content type and length. For instance, in this example:

• Some updates are short, some are long, and have multiple paragraphs and even bullets • Some updates have images embedded in the body of the update, some don't have an image at all (in particular, it's unlikely that a live blog would always have a different image for each header, so it might make sense to figure out what these updates look like when there isn't an image, so there can be a few of those, too.