WordPress.org

Make WordPress Core

Opened 3 years ago

Closed 3 years ago

Last modified 3 years ago

#37246 closed task (blessed) (fixed)

4.6 About Page

Reported by: ocean90 Owned by: ocean90
Milestone: 4.6 Priority: high
Severity: normal Version:
Component: Help/About Keywords: ui-feedback has-patch
Focuses: ui Cc:
PR Number:

Description (last modified by ocean90)

We need an awesome about page for 4.6.

Deadline: July 27, 2016 (which is RC1)

Attachments (14)

37246.diff (14.4 KB) - added by hugobaeta 3 years ago.
First pass. Updated sections and text strings. Still needs interactive bits and images.
37500.patch (2.3 KB) - added by ramiy 3 years ago.
Moving my patch from ticket #37500
37246.2.diff (18.8 KB) - added by ocean90 3 years ago.
37246.3.diff (17.6 KB) - added by ocean90 3 years ago.
broken-link-64.png (1.8 KB) - added by Presskopp 3 years ago.
37246.4.diff (17.7 KB) - added by jeremyfelt 3 years ago.
37246.5.diff (6.2 KB) - added by ocean90 3 years ago.
37246.6.diff (3.6 KB) - added by joemcgill 3 years ago.
Update srcset and sizes
37246.7.diff (12.2 KB) - added by ocean90 3 years ago.
about.php.patch (1.3 KB) - added by ramiy 3 years ago.
37246.8.diff (2.0 KB) - added by ocean90 3 years ago.
https://wordpress.slack.com/archives/core/p1470890054003385
37246.9.diff (1.6 KB) - added by ocean90 3 years ago.
37246.10.diff (842 bytes) - added by ocean90 3 years ago.
37246.11.diff (4.5 KB) - added by joemcgill 3 years ago.
Adds srcset and sizes to streamlined updates image.

Download all attachments as: .zip

Change History (59)

#1 @hugobaeta
3 years ago

Brainstorming being done on a Google Doc

#2 @ocean90
3 years ago

  • Description modified (diff)

#3 in reply to: ↑ description @PranaliPatel
3 years ago

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.

#4 @ocean90
3 years ago

  • Priority changed from normal to high

This ticket was mentioned in Slack in #core by ocean90. View the logs.


3 years ago

This ticket was mentioned in Slack in #design by karmatosed. View the logs.


3 years ago

#7 @ocean90
3 years ago

  • Owner set to ocean90
  • Status changed from new to assigned

This ticket was mentioned in Slack in #core by ocean90. View the logs.


3 years ago

@hugobaeta
3 years ago

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

#9 @hugobaeta
3 years ago

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

#10 @ocean90
3 years ago

#37500 was marked as a duplicate.

@ramiy
3 years ago

Moving my patch from ticket #37500

This ticket was mentioned in Slack in #design by hugobaeta. View the logs.


3 years ago

#12 @ocean90
3 years ago

  • Keywords has-patch needs-refresh added; needs-patch removed

@ocean90
3 years ago

#13 @hugobaeta
3 years ago

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):

https://cldup.com/5OiGgGuE5s.png

@ocean90
3 years ago

#14 @ocean90
3 years ago

  • Keywords needs-refresh removed

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

#15 follow-up: @Presskopp
3 years ago

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
3 years ago

#16 @jeremyfelt
3 years ago

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

#17 in reply to: ↑ 15 @melchoyce
3 years ago

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

#19 @ocean90
3 years ago

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.

#20 @ocean90
3 years ago

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
3 years ago

#21 @ocean90
3 years ago

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.

#22 @ocean90
3 years ago

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.

This ticket was mentioned in Slack in #core by ocean90. View the logs.


3 years ago

@joemcgill
3 years ago

Update srcset and sizes

#24 follow-ups: @joemcgill
3 years ago

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.

#25 in reply to: ↑ 24 @ocean90
3 years ago

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.

#26 @ocean90
3 years ago

In 38234:

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

Props hugobaeta, joemcgill.
See #37246.

This ticket was mentioned in Slack in #core by ocean90. View the logs.


3 years ago

This ticket was mentioned in Slack in #core by ocean90. View the logs.


3 years ago

#29 @adamsilverstein
3 years ago

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

https://cl.ly/2l1O0S2b1J2o/About__WordPress_Dev__WordPress_2016-08-10_16-43-54.jpg

@ocean90
3 years ago

#30 @ocean90
3 years ago

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.

#31 @ocean90
3 years ago

  • Resolution set to fixed
  • Status changed from assigned to closed

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.

#32 follow-up: @ramiy
3 years ago

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

#33 @Presskopp
3 years ago

@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
3 years ago

#35 @ramiy
3 years ago

See the attached patch.

#36 in reply to: ↑ 32 @ocean90
3 years ago

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
3 years ago

#37 @ocean90
3 years ago

In 38248:

About Page: Fix punctuation errors in two strings.

See #37246.

#38 @ocean90
3 years ago

In 38249:

About Page: Fix punctuation errors in two strings.

Merge of [38248] to the 4.6 branch.

See #37246.

@ocean90
3 years ago

#39 in reply to: ↑ 24 @ocean90
3 years ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

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.

This ticket was mentioned in Slack in #core by ocean90. View the logs.


3 years ago

@joemcgill
3 years ago

Adds srcset and sizes to streamlined updates image.

#41 @joemcgill
3 years ago

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.

#42 @ocean90
3 years ago

  • Resolution set to fixed
  • Status changed from reopened to closed

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.

#43 @ocean90
3 years ago

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.

#44 @ocean90
3 years ago

In 38267:

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

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

#45 @ocean90
3 years ago

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.

Note: See TracTickets for help on using tickets.