Hacker News Reader

Comment by benatkin | Hacker News Reader

I'm not sure having an email be 900px wide (the table has 3 300px wide cells) is a good idea. Wouldn't that get a horizontal scrollbar on the iPad no matter the orientation? When it's horizontal there's a sidebar; when it's vertical it's only 768px wide.

View on HN

MailChimp templates are all 600px wide, as a comparison, and that's what they recommend. It's annoying, since so many people have large monitors (notably me - so much white space around my drafts), BUT as you point out so many recipients are viewing emails on mobile devices (phone, tablet, even netbook-size laptops) as well as webmail clients and the Outlook preview pane.

Isn't it the browsers responsibility to figure out how to layout your content?

In a perfect world, yes.

In reality, you can't trust all browsers to behave the way standards dictate. If you're doing business online, through email, etc. you need to be able to reach as many people as possible and that may mean sending 600px wide emails instead of 900px.

And in case my original point lacked context, I was talking about marketing for a business to customers - even B2B has to assume a variety of customers that have little to no technical skills and aren't opening emails on their 19" laptop.

My Mail window is at most 700px wide. That’s about 400px to 500px for the content. Most of the text-only mails I receive fit comfortable in that space without any scrolling and the line length is just perfect (60 to 80 characters per line).

Why would I want my Mail window to be any bigger? I have all the space I need for comfortable reading and filing and more than half a screen to do something useful with. I don’t really see how the size and resolution of the monitor figures into the size of the window of your mail app at all.

Yes, displaying a list with as many messages as possible and as many mailboxes as possible for comfortable filing might require additional space (beyond the 700px I like) but that seems to be inconsequential for the size with which you display the actual email message (my 400px to 500px), i.e. you don’t have to maximize the window of your mail app to achieve that.

Anyway, why use fixed width layouts at all? Are mail apps so backwards that fluid layouts are not possible?

Are mail apps so backwards that fluid layouts are not possible?

Outlook uses Microsoft Word's HTML rendering engine. So, in short, yes.

Thanks for the input benatkin. The table was really just an example but I definitely agree that a more standard width table would be better. I updated it to 600px in width.

You're welcome. It's just an example but it should be ready for people to send to themselves, look at on their devices, and see if they like it. That's how HTML 5 Boilerplate works. The first thing I did after I browsed to HTML 5 Boilerplate on my laptop was open it up on my phone.

Looks like that has been changed.

https://github.com/seanpowell/Email-Boilerplate/commit/45663...

Agreed. Not to mention the very large percentage of people that open your emails in a web client on a 1024px wide screen.

Or use an email client with a horizontally split screen.

It seems you mixed up horizontal and vertical splitting. It happens a lot, I'm afraid. I wish it didn't happen so often. It's tedious to clear up such basic confusion when there are so many important user interface challenges to discuss.

Also 900px wouldn't be a problem if not for a vertical split. 900px < 1024px. JoelSutherland is assuming that the window is divided, with some kind of a navigation pane taking up part of the width. This is the case in most email clients.

Last I checked, horizontal and vertical splitting was ambiguous, but you sound very sure your way is right. Do you have a reference to support your confidence?

For example, both emacs and the Java JSplitPane call a "horizontal split" a split of the horizonal axis, resulting in two left/right panes. Meanwhile, vim calls the same operation a "vertical split."

Wouldn't a fluid approach be better? I haven't done much HTML/CSS in the last year.

I wouldn't recommend fluid layouts with email, most email clients are stuck on HTML 3.2 and have limited CSS support.

Definitely not. Short lines are easier to read. There is a reason why 72 or 80 characters are normal.

Fluid might work, depending on whether mail clients support max-width. You can cap the maximum amount of character per line like that.

Recent versions of Outlook put the message to the right of the message list. I'm pretty sure you'll get terrible horizontal scrollbars on a 900px wide message.

I'm not sure having a web page be 1300px wide is a good idea either.

Seems like the designers of both must be using widescreens...

This is correct. Emails should be no wider than 600px

Reply on news.ycombinator.com