Slice & make responsive: Student Reps Template

RESOLVED FIXED

Status

P2
normal
RESOLVED FIXED
6 years ago
6 years ago

People

(Reporter: jdavis, Assigned: sgarrity)

Tracking

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(5 attachments)

(Reporter)

Description

6 years ago
Created attachment 729305 [details]
Student Reps PSD

We have a new email template design that needs to be sliced.

We're going to try something a bit different this time with the email coding so that our new templates are not just mobile friendly - but mobile responsive.

Please see attached PSD for template.

Please see attached example email templates that are optimized for mobile responsiveness and other email goodness.

I'm personally in uncharted territory with coding emails for mobile responsiveness across inboxes/clients/devices. Please advise if you've got people up to the challenge/skillset, or if we need to look for contractors with this specific experience.

One thing to note: please hard-code any/all text & table special effects that can be hard-coded. The less images - the better.


Timeline: Due April 5th*

Please let me know if you have any questions and thanks!

Jess


*If this date isn't possible, please let me know a reasonable timeline. We want to carryover this code & design for other newsletters as soon as possible (ie Firefox & You)
(Reporter)

Comment 1

6 years ago
Created attachment 729306 [details]
Mozilla Foundation's Mobile responsive design HTML
(Reporter)

Comment 2

6 years ago
Created attachment 729307 [details]
Mobile template example HTML
(Reporter)

Comment 3

6 years ago
Created attachment 729311 [details]
Hidden Image + Intro text code example (pretty neat)
Priority: -- → P2
(Reporter)

Comment 4

6 years ago
If possible, it would be great to have this code no later than 4/23 so that I can re-brand it for the May Firefox & You newsletter.

Please let me know if 4/23 deadline is doable.

Thanks!

Jess
(Reporter)

Comment 5

6 years ago
Hey - just wanted to check in on timing. Anyway this can be ready by next week 4/23?

I'm banking on this as part of the Firefox & You redesign for the May newsletter: Bug 855533

Thanks!
Assigning over to Steven. Pretty straight forward but let us know if you have any questions. The whole Web prod team is in Toronto but checking bugzilla and email periodically.
Assignee: malexis → steven
(Assignee)

Comment 7

6 years ago
(In reply to Jessilyn Davis from comment #5)
> Hey - just wanted to check in on timing. Anyway this can be ready by next
> week 4/23?

Yup - we'll have it for you in time. Thanks.

Comment 8

6 years ago
Created attachment 740434 [details]
Student Reps Template Markup

Jessilyn, attached are the files for the responsive email template. It has passed mailchimps inbox inspector so it should be ready to go. Let me know if you have any problems with it.
(Assignee)

Updated

6 years ago
Status: NEW → RESOLVED
Last Resolved: 6 years ago
Resolution: --- → FIXED
(Reporter)

Comment 9

6 years ago
Thanks Stephen! :D

I only had a few problems with padding not working in some email inboxes and some of the fonts changing when they're wrapped in <p> and <a> tags. (The parent styling doesn't always hold true across email clients + browsers if the font style and size is missing from the inside tag. So you have to be super repetitive with the "style" attribute for nested tags.)

I should be able to make these changes pretty easily (add in the repetitive styles and come up with creative ways to ensure the spacing sticks instead of using padding styles).

Overall this looks fab! Thanks!
You need to log in before you can comment on or make changes to this bug.