4.6 About Page

[ocean90]

We need an awesome about page for 4.6.

Deadline: July 27, 2016 (which is RC1)

[hugobaeta]

Brainstorming being done on a ​Google Doc

[PranaliPatel]

Replying to ocean90:

We need an awesome about page for 4.6.

Deadline: July 27, 2016 (which is RC1)

Added suggestion for tagline in the google document.

[hugobaeta]

First pass. Updated sections and text strings. Still needs interactive bits and images.

[hugobaeta]

Uploaded a first patch with updated sections and text strings. I left the video and images from 3.5 in there as placeholders. Here's a preview: ​https://cldup.com/E9IBX2FjrE.png

[ocean90]

#37500 was marked as a duplicate.

[ramiy]

Moving my patch from ticket #37500

[hugobaeta]

The images for the about page ​can be found here.
I'd appreciate some feedback, but these can go in RC2 as a first patch.

Here's a preview of it (keep in mind, this screenshot doesn't include @ocean90 latest patch of content, and I'd like to adjust some spacing around in CSS after these go properly in, but it's a decent preview):

[ocean90]

37246.3.diff​ includes the images from @hugobaeta. Screen: ​https://cloudup.com/ck9e6MYlppa

[Presskopp]

In my eyes the broken link 'symbol' is not very intuitive. I'd go for something more like:

​http://www.iconsdb.com/orange-icons/broken-link-icon.html

[jeremyfelt]

2 changes in 37246.4.diff​:

• boost your site’s rather than boost your site#8217;s
• "query term information" rather than "query term informations"

Otherwise +1

[melchoyce]

Replying to Presskopp:

In my eyes the broken link 'symbol' is not very intuitive. I'd go for something more like:

​http://www.iconsdb.com/orange-icons/broken-link-icon.html

@hugobaeta is using the existing un-link icon in core. Since this is part of a wider conversation, can you make an issue about it here? ​https://github.com/WordPress/dashicons/issues

[Presskopp]

np

​https://github.com/WordPress/dashicons/issues/129

[ocean90]

In 38183:

About Page: First pass for 4.6 with strings (not yet translatable) and images (not CDN).

Props macmanx, jorbin, hugobaeta, DrewAPicture, peterwilsoncc, iamfriendly, rahulsprajapati, vishalkakadiya, petya, celloexpressions, westonruter, mikeschroder, zetaraffix, mapk, boonebgorges, adamsilverstein, jeremyfelt, rosso99, karmatosed, swissspidy, michael-arestad, ramiy, ocean90.
See #37246.

[ocean90]

In 38184:

About Page: First pass for 4.6 with strings (not yet translatable) and images (not CDN).

Merge of [38183] to the 4.6 branch.

Props macmanx, jorbin, hugobaeta, DrewAPicture, peterwilsoncc, iamfriendly, rahulsprajapati, vishalkakadiya, petya, celloexpressions, westonruter, mikeschroder, zetaraffix, mapk, boonebgorges, adamsilverstein, jeremyfelt, rosso99, karmatosed, swissspidy, michael-arestad, ramiy, ocean90.
See #37246.

[ocean90]

In 38213:

About Page: Second pass for 4.6.

• Update images for native fonts and editor features.
• Add video animation with image fallback for update feature.
• Rename "Simplified Disaster Recovery" to "Content Recovery".
• Fix broken layout on credits and freedoms pages.

Props hugobaeta, SergeyBiryukov, ocean90.
Fixes #37590.
See #37246.

[ocean90]

In 38215:

About Page: Use a better version of the mp4 video.

The previous version had the wrong colors. Also remove ogv from the list, it has the wrong colors too and all current browsers support either the mp4 or webm format.

See #37246.

[joemcgill]

Update srcset and sizes

[joemcgill]

37246.6.diff​ updates the srcset and sizes attributes for the static images. For this pass, I experimented with using ​http://www.responsivebreakpoints.com/ to automatically generate the sources based on optimal file size differences, which is pretty neat.

I also wanted to note that in past few releases we've moved the images to the w.org CDN before release, but I'm not sure who handled that part of the workflow.

[ocean90]

Replying to joemcgill:

I also wanted to note that in past few releases we've moved the images to the w.org CDN before release, but I'm not sure who handled that part of the workflow.

I'll do that once the images/videos are final.

[ocean90]

In 38234:

About Page: Update video for streamlined updates and add srcset/sizes attributes for the static images.

Props hugobaeta, joemcgill.
See #37246.

[adamsilverstein]

I’m not sure why "Internationalized Domain Names” is capitalized, i don't think it needs to be?

[ocean90]

In 38244:

About Page: Third pass for 4.6.

• Adjust strings.
• Make strings translatable.
• Improve margin between copy and images.

Props Ipstenu, SergeyBiryukov, Presskopp, jeremyfelt, afragen, helen, Clorith, macmanx, DrewAPicture, voldemortensen, jorbin, MattyRob, ocean90.
See #37246.

[ocean90]

In 38245:

About Page: Updates for 4.6.

Merge of [38213], [38215], [38234], and [38244] to the 4.6 branch.

Props hugobaeta, Ipstenu, SergeyBiryukov, Presskopp, jeremyfelt, afragen, helen, Clorith, macmanx, DrewAPicture, voldemortensen, jorbin, joemcgill, MattyRob, ocean90.
Fixes #37246.

[ramiy]

@ocean90 one string has a URL in the translations string. It should be replaced with a placeholder, like the other strings.

[Presskopp]

@ramiy

I bet you are talking of

<a href="https://translate.wordpress.org/">WordPress.org&#8217;s community of translators</a>

which has the idea of being translated to the URL of the respective local community.
A note for translators saying so would still be nice.

[ramiy]

@Presskopp / @ocean90

​https://make.wordpress.org/core/2016/07/05/customizer-apis-in-4-6-for-setting-validation-and-notifications/

[ramiy]

See the attached patch.

[ocean90]

Replying to ramiy:

@ocean90 one string has a URL in the translations string. It should be replaced with a placeholder, like the other strings.

Right, looks like we missed that. I'm not going to change it since we're in string freeze and there is no harm in having the link there.

[ocean90]

​https://wordpress.slack.com/archives/core/p1470890054003385

[ocean90]

In 38248:

About Page: Fix punctuation errors in two strings.

See #37246.

[ocean90]

In 38249:

About Page: Fix punctuation errors in two strings.

Merge of [38248] to the 4.6 branch.

See #37246.

[ocean90]

Replying to joemcgill:

For this pass, I experimented with using ​http://www.responsivebreakpoints.com/ to automatically generate the sources based on optimal file size differences, which is pretty neat.

@joemcgill Can you document the settings which you have used? I noticed that we missed the attributes for the video fallback image: https://core.trac.wordpress.org/browser/trunk/src/wp-admin/about.php?rev=38248&marks=88#L74.

Note: The current image is the wrong one, 37246.10.diff​ has the correct image.

[joemcgill]

Adds srcset and sizes to streamlined updates image.

[joemcgill]

37246.11.diff​ adds srcset and sizes to the mobile image for streamlined updates and also modifies the order of image candidate strings in each srcset to address a bug in iOS8 where the first candidate will always be selected when using w descriptors (See #35030 for background).

For each image, I used the following settings on ​responsivebreakpoints.com:

1. Resolution: 200px to 1050px for full width images, 200px to 496px for 2-col images.
2. Step size: started with 15KB and reduced until the tool generated at least 4 sizes.
3. Maximum Images: 10 (but never approached that many)
4. Retina Resolution: Select this option

After downloading the generated files, I uploaded the files to CloudUp and updated the markup in the about.php file.

[ocean90]

In 38257:

About Page: Enhance responsive images.

• Add srcset and sizes to the mobile image for streamlined updates.
• Modify the order of image candidate strings in each srcset to address a bug in iOS8 where the first candidate will always be selected when using w descriptors, see #35030.

Props joemcgill.
Fixes #37246.

[ocean90]

In 38258:

About Page: Enhance responsive images.

• Add srcset and sizes to the mobile image for streamlined updates.
• Modify the order of image candidate strings in each srcset to address a bug in iOS8 where the first candidate will always be selected when using w descriptors, see #35030.

Merge of [38257] to the 4.6 branch.

Props joemcgill.
See #37246.

[ocean90]

In 38267:

About Page: Add release video and move images to CDN.

Props jerrysarcastic, rosso99, petya, hugobaeta, jerrysarcastic.
See #37246.

[ocean90]

In 38268:

About Page: Add release video and move images to CDN.

Merge of [38267] to the 4.6 branch.

Props JerrySarcastic, rosso99, petya, hugobaeta, RoseAppleMedia.
See #37246.