Please Read: Typophile (TEMP)

Jared Benson's picture

Change is hard.

But the Flash home page had to go. We all knew it was way past its prime.

This temporary Typophile theme you're seeing now puts us back at our roots, in a way. Since 2000, Typophile has been a vibrant community focused around these very forums. It's a community built around a love for the craft of typography and design, and these forums have been home to hundreds of thousands of conversations around type.

Don't worry, this is not the new permanent look for Typophile. It's merely a temporary state while we tighten up a new look for Typophile. Removing the Flash is the first big necessary step toward correcting a number of other bugs (file upload, anyone?) that have been plaguing us. Rather than take the site down while we get things squared away, we opted to keep it up so you can talk type while we're heads-down on the new Typophile.

Yes, we know the theme is not perfect. Go easy, make constructive suggestions and we'll make CSS tweaks as we go.

Most of all, get involved!

BrettR's picture

If we are really ambitious, we could suggest retina display compatibility. Odds are the new Mac's will be Retina Display. I believe Apple did this with their website, but I cannot confirm that at this moment.

kentlew's picture

John, I’m not seeing what you’re describing either. Images are scaled fine in my browser[s]. Which is to say, not scaled at all.

(And here’s a modified link to that comment which should work.)

hrant's picture

1) A big thank you from the crazed Japanese soldier in the
tree for making the Comment box match the actual post.

2) John, I'm not seeing any scaling (FFox 11.0 on Win-XP)
although I am seeing the right-shifting of the top image.

3) Please ghetto-ize the ID Board aysap.

hhp

Chris Dean's picture

@hhp: Do you know of a way to undo manual line breaks? I have to set my type very large to read which results in a pretty funky rag.

hrant's picture

You could set your window to half of the line length, so the
manual linebreaks would blend in with the automated ones.

Otherwise you might have to write a plug-in? But if you're
going to that trouble it would be better to allow the reader
to customize the column width... In fact a good site should
have that feature as an option.

hhp

riccard0's picture

The elusive anchor (#) bug (http://typophile.com/node/91007?page=2#comment-499787) is still haunting some threads (and I don’t mean the one involving pagination).
Perhaps it’s due to the presence of files attached to the original post?

Michel Boyer's picture

I also experience the right shifting of the first image in Firefox 11.0 on OS X 10.6., for instance in this post on Neuton italic. In this modified copy of the source file, just adding a non breaking space   somewhere before the div class="imageWrap" tag appears to have solved the problem (don't ask me why, I don't know).

John Hudson's picture

Images definitely getting scaled down here. Firefox 5.0.1 on Windows Vista.

The image Riccardo posted ended up only 689 pixels tall on my screen in Typophile, whereas if I right click on the image and select 'Show image' I see the full size image, which is 767 pixels tall.

John Hudson's picture

Oh, hang on a minute: apparently I'd scaled down my Firefox display because at 100% Hrant's hard line breaks look like this:

hrant's picture

My dislike of poetry is the one thing that might get me down from my tree.

hhp

dezcom's picture

So that is why Hrant's posts always look screwy!

Té Rowan's picture

Yep. He's trying to outsmart our browsers by putting his own line breaks, hence the bad flow of his text.

brianskywalker's picture

Note: Almost everyone used to insert hard line breaks (& put their name at the end of each post). Just go and reorder posts in the General forum by date and check out the oldest ones. (Interesting too.)

I'm really happy about some of the new styling, especially the blockquotes. Unordered lists (UL) do leave something to be desired, though.

Image upload doesn't work for me on Chrome/Linux, but does on Firefox/Mac. I end up using my own hosting when I post from linux. This has made me notice that images inserted with <img/> do not have the wrapper for image scrolling, vs. the [img] format.

Bert Vanderveen's picture

Used to be that one could define a ‘signature’ that would turn up magically at the end of a post. Any chance that feature will be reinstated?

FWIW: This is a test of uploading an image: (no dice — looks like the site still won’t do png…)

brianskywalker's picture

PNG works fine for me -- in certain browsers.

5star's picture

I could use a sub forum called Things That Drive Me Crazy!

One of clients that I thought I had neatly dealt on Friday - all of sudden wants to change up the logo .a.ka. the entire branding, from me using a nice cut of Brandon to some hideous thing known as Blacklight D.

F'n idiot!

Perhaps that could be the name of the new sub forum?

I replied to his email as anyone would to an April 1st joke

...sigh.

Florian Hardwig's picture

Used to be that one could define a ‘signature’ that would turn up magically at the end of a post. Any chance that feature will be reinstated?

I hope not. This (a general, off-topic message) belongs on your profile page. Having it repeated with every single comment feels like spam to me, sorry.

riccard0's picture

I’m with Florian on this one. Anything related to the poster should rather belong to where name and avatar sit.

Florian Hardwig's picture

So that is why Hrant's posts always look screwy!

Yes, isn’t it ironic? Aiming for some (arbitrarily determined) ‘ideal’ line length in order to help the reader, but actually making it a complete nuisance to read for every other one. Stop it, please. This is 2012. You don’t know about my line lengths, neither my default nor the one I want.

Bert Vanderveen's picture

Anything related to the poster should rather belong to where name and avatar sit.

But what about all of those users that use pseudonyms? Just one line… please?

paragraph's picture

There are only a few people here who use hard returns in their posts, and hey, they usually use the signature as well — as if we, the readers, could not tell from the user's name (and icon) on the left who the author was.

Personally, I feel that their main message is: I will do as I damn please, and I do not care what you see or think.

riccard0's picture

tell from the user's name (and icon) on the left who the author was.

That's why I wish more people would use a personalised avatar.

hrant's picture

Florian, the year has nothing to do with it - sheep following
trends is one of the worst things about society. And reading is
more important than how brutish web design remains, after
all these years. If my linebreaks are in fact making it worse*
then I will change right here right now. But not just for a few,
for some of whom it's really a matter of "web design principles",
for which I have little respect - people come first, not mannerism.
I've been using computers since 1977, and it's the one thing I've
learned. I recently started a thread exactly to figure out what
proportion of users are seeing what John showed, to see if I need
to adapt. I got no real feedback. Here's another chance for us all.

* And I certainly don't mean for some HTML-
standards berserker, I mean for real people.

I'm not going to simply give up and not worry. When I see
your (plural) posts, where the longer paragraphs become
intimidating in terms of readability, I physically don't want
to read them, and I write to be read, not to vent. Is it a shock
that all your long paragraphs read like crap? What good piece
of typesetting has lines that are like spaghetti? We complain
about letter-size paper being about an inch too wide for good
typesetting and waste a good 1/4 of the area, post-rationalizing
that whitespace is just as important as content, but we're entirely
happy with simply caving in online?

Jan, I'm a designer at heart, and I have four kids. I almost never
do as I damn please, and caring is my blood. Why do you think
I go to the trouble? It's really a lot of extra work, and I don't
believe in waste.

About my "signature": it takes 3 seconds, it might sometimes
help searchability, and it adds an extra layer of information, saving
people from having to flick their gaze to the top-left (I often have
to divert my gaze to see who wrote the post). I've been using "hhp"
since 1998 (tellingly lowercased, even though I don't believe in
moron-grammar) so think of it as a personal tradition, a slight
touch of color in a sea of pure text, not an instance of vanity.

This is not an ant farm, and we are not slaves to browser technology.

hhp

eliason's picture

Your linebreaks are in fact making it worse.

hrant's picture

For what proportion of users?
It's human nature that most people volunteer information
mostly to counter (meaning that people won't speak up
when things are working fine) so I need more data.

hhp

hrant's picture

> I got no real feedback.

Actually I did get some feedback, which seemed to
show that very few people use Typophile on portable
(i.e. narrow-column) devices. One question is, do a
large proportion of full-fledged computers also use a
narrow column when browsing? I'm a bit surprised
that John is having to scale down Firefox.

Craig, the truth is We Don't Know. So on which side
should I err? The one that's lazier? Not my style.

And if I do give up on manual linebreaks, that will not
suddenly make the deplorable state of web typography
OK, it will not make things sufficiently readable.

hhp

caffeinemood's picture

Well I actually have no problem here with your line breaks

riccard0's picture

I, for one, see Hrant's posts as I suppose he meant they to appear.
Still, they're disruptive of the reading flow, since formatted differently from all others.
They look almost like blockquotes.

hrant's picture

Question: Does the new layout of Typophile
enforce narrower columns? I have however
noticed some (iPad?) users complaining.

hhp

Karl Stange's picture

Hrant, for what it is worth I view Typophile daily on a combination of iPhone4, MacBook Air (Lion 10.7.3 /Safari 5.1.3 (7534.53.10)) and most recently an iPad3. In all cases the way your posts are formatted does not bother me in the slightest.

hrant's picture

1) Do you mean there are no funny linebreaks,
or that they just don't bother you?
2) Is there a line-length/linebreak difference
between the old Typophile and the new one
on any of your devices?

hhp

dezcom's picture

Hrant's posts almost always break badly on my system and make reading them problematic.

John Hudson's picture

The new column width seems to be proportional to window width below a certain threshold, whereas the old Flash site used a fixed width column. I run Firefox in a vertically oriented window in the middle of my 30" monitor, since this is the most efficient use of space and is best for the majority of sites. If I maximise the window, then Hrant's posts look okay. I'd be in favour of a return to fixed column width.

eliason's picture

Craig, the truth is We Don't Know. So on which side
should I err? The one that's lazier? Not my style.

Me, I'd err on the side that doesn't cause the effect seen in the image John Hudson posted for any viewers.

hrant's picture

I've never shot for the lowest common denominator.
But if we are in fact talking about more than a fringe
browser setup, then such a compromise might make
sense. Without however pretending it's a Good solution.

hhp

kentlew's picture

Hrant — When I view on my desktop, your line breaks don’t bother me (though the transitions are sometimes a bit jarring). When I view on my iPhone, which I do about a third of the time, then they break badly and it’s a real nuisance.

John — The current layout seems to resize proportionally for a browser window narrower than about 1280px. (Although, some elements also break below a certain width — most notably the tables used for the forum listings — which is partly why viewing on a mobile device is so annoying.) Going the other direction, it maxes out with a comment width of 580px (the standard from the old layout).

After all the initial complaints, I gave Jared my override CSS to provide a quick fix to what seemed [to me] to be the most objectionable elements of the new temp template. That’s how y’all wound up with this current incarnation.

I believe that restoring the 580 width was one of the things I had done; I think it was originally even wider (but I could be misremembering).

The html structure and css for Typophile is a bit of a mess, from what I’ve looked into. There are plenty of things that could/should be done better to be more flexible both for desktop and mobile devices. Lots of folks have made good suggestions. I imagine that some of this would involve revising the underlying page templates and html. There's only so much that can be adapted through the CSS alone.

I made no attempt to clean up the existing CSS nor to create robust additions. I was doing it mostly for myself; and I just happened to have addressed many of the things people were initially discussing. So I offered my Stylish overrides to Jared to tack on the end of the Typophile CSS as a quick fix (— mostly because I was tired of all the whinging).

But I have no interest in spending more time to chase down everyone’s whims and complaints. So the ball is back in Punchcut’s court.

brianskywalker's picture

Hrant: Honestly, your posts are no problem on the computer I'm using right now. It's only a couple years old and has a decent (by current standards) resolution. Actually, it's nice because (as you argue) the width of the lines are more natural to read. On my Mac, however, which has a lower resolution of 1024 x 768, Typophile's new layout often makes your blocks of text break, and it's much harder to read.

Honestly I think the problem is twofold:
1. Typophile should be setting their text column thinner, and it really can't be measured in %, as they are doing now, since it make the column width wider or shorter depending on the device/resolution. Although it would require redoing a lot of the CSS, measuring in EM would ensure the lines are always optimal length.
2. You (Hrant) really should stop inserting hard line breaks. Especially if/when Typophile fixes the column width issue, because it would not break on lower resolutions (my Mac isn't a handheld—I use it for work), and also the line-length would be handled by Typophile and be consistent with the formatting of the other posts.

JamesT's picture

What they could do is add a media query to deal with screen width. Therefore, if the resolution is less than, let's say 1080px, the center column would expand to be 75% instead of 50%.

JamesM's picture

I have no problems with hrant's line breaks. His lines look shorter than other posts, but its no big deal to me.

Frode Bo Helland's picture

Hrant: Your line breaks break my Android phone. It’s a pain.

Michel Boyer's picture

For those using Stylish with Firefox,

.node p { 
  padding-top: 1px !important ;
}

prevents the first image of the top post from being shifted outside the middle column when not preceded by some text.

kentlew's picture

That, or this works also:

.imageWrap {clear: both; }

if you don’t want all your paragraphs to have an extra pixel padding (not that you’d probably really notice).

You shouldn’t even need to add “!important” to this declaration (like you do with so much Stylish) because there is no superceding rule in the default CSS.

Michel Boyer's picture

If I don't put the !important in the line above, the script simply does not work (I checked). As for your script, I agree, it works as is and it is more clean since it prevents that extra pixel padding.

Dan B.'s picture

Hrant, here's an example (iPhone 3 with Safari). I had to zoom in the page (proportionally, mind you; the text wraps the same way when zoomed out).

kentlew's picture

Michel — Yes, your declaration requires the “!important” property, as you wrote it, in order to override. I was just noting that the lack of it in mine was not an oversight.

Té Rowan's picture

Hmm... add a one-line hash link to the Type ID Forum at the top of the Forums page that moves the focus down to the actual TypeID Forum links?

hrant's picture

Just please don't complain that I've started using too many paragraph breaks...

hhp

hrant's picture

And you know what's really cool? That "new" graphic causes the first two lines to end short...

I'm sorry, but "web design" remains an oxymoron.

hhp

apankrat's picture

Jared, please add back "Flag" option for comments (and preferably hide the comment if it's flagged more than 2-3 times). There's just too much spam lately.

Syndicate content Syndicate content