Website review

Miscellaneous and Personal Stuff I Must Share
1

From looking at past threads, it seems there’s a precedent for reviewing websites, but all the same, turn on your ad blocker for the Google ads and don’t click the Amazon links. There, now I can’t possibly make any money. Past threads also seem to be evenly divided between MPSIMS and IMHO, but I’ll post here.

The website is QueerSilents.com.

Okay, first off, I don’t care that it doesn’t validate. I’ve got it to look like I want in Mozilla, Opera, and IE6, that’s all that matters. I’ve even made sure it was navigable in a text browser. I am interested to know what it looks like on a Mac, though, since I don’t have any way of testing that and I know from past experience that text size on Macs bears next to no similarity to its size anywhere else.

There’s the general points I’d like a review on: does the navigation make sense, does the layout make sense, is it immediately apparent what everything’s about, or does each page leave you huddled in a corner crying your eyes out in confusion? It’s all clear to me, but then, I wrote it. Also, though I’ve read everything at least three times over, I’m sure there’re still typos. I don’t expect you to read every page, but if you spot one, do tell.

Specific points I’d like input on: look at either Dickson’s Experimental Film, A Florida Enchantment, Different From the Others, or Sex in Chains. Can you find the reconstruction? Do you understand the reconstruction once you’ve found it? The reconstructions are a big draw, but from looking at my access logs, some people seem to be spending an inordinate amount of time apparently searching for them, and some don’t get the next/last thing and keep returning to the index to advance to the next scene. (The other films don’t have them, which is why I point you specifically to these.)

Plus whatever observations you’ve got for improvement on the design or things like that, I’m open to those. No, I won’t add color.

Beyond review, any tips on increasing my exposure? My last non-business site (same concept, but less broad) gained its popularity from being picked-up by a Victorian-era porn blog (who the hell even knew such things existed or were so very active?). This one is linked to a few times from Wikipedia and I’ve gotten some hits from Google (mostly looking for information on Sidney Drew), but beyond that, still rather slow.

2

What a very cool website!! Overall I really really like it. But yes I do have a few suggestions.

–The text/background color: the background color is too dark grey. There is not enough contrast between the background and text, making it hard on the eyes. I would lighten the background by about 3 shades. Maybe #B9B9B9 or somewhere between #bbbbbb and #cccccc. Also I think the font size is too big. I am a fan of 11 or 12 px. I notice you use a percentage to control your font size; I prefer to use pixels then you can use em to size headings and other styles. Like 1.5em=1.5 times the size of the regular font, etc. I have just noticed that more sites these days are scaling down their font sizes. I think it looks tighter and cleaner.

–the navigation bar on the left is great. However, in addition to the underline on hover, why don’t you change the background color of the button on hover too? I like that.

–More visual interest on the front. There’s too much text and I think people are lazy and don’t want to have to read that much right away. Leave the bulk of the info on frequent queries page. This page is about movies, right? So let’s see some more images on the front!! That would catch my interest hook, line and sinker.

–About the reconstruction. The icon is hard to find. It needs a more prominent spot! It gets lost over in the right hand side of the page.

–Overall I think it is a fantastic site! I am very impressed by the research and information you are making available here. (I especially love "such whores we are!!!)

3

For example, I like what you have done on the Gay Silents page, with the cutout guys at the bottom, and the faded round image on the right. More of that type of thing would be good on the front.

4

You would make the background lighter? I will take that into advisement.

You’re suggesting less content on the front page and more images? You see, that’s surprising, because I was already worried it was a bit large, almost 90k. And you would move the intro paragraph to the FAQ page? What would you put on the front page? For the sections, there’s a featured film to talk about, but the front page is just about the website.

The normal font isn’t sized, I just take the default of the person’s browser. The small text is 20% smaller than default, the big text 50% larger. If I did pixel sizing, it wouldn’t change with the individual’s text size, it would be constant. It would make layout easier for me, but I don’t think those with imperfect vision would care about that. I know that, for me, I’m fine sitting at a normal distance from the monitor, but sitting back, I either have to wear my glasses or turn up the text size to 120%. I designed it to be able to go that far and still look right. Beyond that, the lines start to break and the images misalign, but it’s still accessible. It can go smaller, of course. I would think a person preferring small text would set their default lower.

The reconstruction button is, I agree, something of a problem. It’s actually the second, more eye-catching version. The other blended in better, but perhaps it blended in a bit too well since nobody seemed to find it. I could make it slightly bigger, but not too much more–with a sidebar on either side, the text is already smashed between them, I wouldn’t want to make the right side one more than the 150-170 pixels it already is.
The other 15 of you, no comment? None at all?

5

Way too much redundant CSS. You can achieve the same result if you actually had an external cascading style sheet for the entire site that was properly optimized.

Perhaps a bit more white space before your content begins on each page.

While you may not care about validation, have you considered sufficient color contrast at the very least? The contrast between text and background colors is insufficient. Why should you care? Well, the ad links at the bottom of every page pull your eyes away from the page content. Do you really want your web visitors being drawn to the ads that fast and leaving your site so early?

6

Oh, yeah.

Optimize your images, especially the background image. You can substantially reduce your page weight by optimizing the background image, in size and weight.

Finally, if you tackle an all CSS route (eliminating the table used for layout) you can drop the page weight even more.

Overall, the page design works very well with the site theme.

7

As I said, I acknowledge the suggestion to lighten it, but, well, here’s the thing: I keep my monitor quite dark, but the text still shows plainly against the background. Even if I reduce the contrast to under 50%, it’s still highly visible. Turn down the contrast much further and, yes, it does start to disappear, but then so does everything else. The #000000 pure black text simply isn’t very close to the #999999 gray background. The background’s just slightly darker than silver.

As for the stylesheet, yes, good idea, and done, except for the cascading bit, which may be done, but not tonight. It’s easy to forget the browser has to load it every time, since there’s only one copy on the server. The background was as small as it could go without losing quality, but I’ve reduced its color depth by half and it looks acceptable. As to its actual dimensions, those can’t decrease–the undulations wouldn’t mesh.

Doing it totally in CSS is great in theory, but would be a nightmare in practice trying to get a remotely similar layout across browsers. Standards would be great if they were adhered to.

8

Looks fantastic to me in Firefox. I thought this would be about the National Day of Silence, though.

9

Looks fine in Camino 1.0 on OS X 10.3.9, as far as I can tell. Text size is fine. Though I also would suggest increasing the color contrast (You really don’t have far to go - see here).
I think the color difference between the left (navigation) column and the main text area should end at the nav bars and instead be a margin on the left of the main text. The way it is now it feels like the main text is pushed over, instead of being merely separated from the nav. column. ( I realize the way the site’s set up this may not be an easy thing to change; it is pretty minor anyway).
It was not immediately clear that to see the movies you click on the title links. Possibly a button for ‘today’s feature’ might help newcomers (but you can probably analyze it to see if this is really a problem).

The wavy background is fine (provides a nice feeling of depth around the edges) but I didn’t like it when the page got too short and it took up more of the window (which for me is ~800 pixels high). For example ; Just Generally Queer.

One thing that might be a problem with the scene navigation - the buttons are in two different sections. Since these pages are a little longer, the ‘next scene’ isn’t noticed unless you go all the way down. A casual browser might simply go to the page and think the top button is all there is.

Of course, this presents a problem - putting all the buttons up top makes reading straight through complicated. Moving the ‘return to index’ to the bottom makes the most sense. Though the advantage of being at the top lets readers know immediately that it’s there.
My feeling is that they should all be in one place, at the bottom. If I come to a page and simply see the one button at the top, I might think that’s all there is. I’m happier to know that all the navigation areas are in one spot, even if I have to look for it. This is what makes the permanent left column nav bar useful — I know that if I want to travel ‘across’ the site, it’ll be via a link on the left. If I want to move locally, It’ll be at the bottom. Or a hyperlink (which I expect to take me potentially anywhere).

10

Looks dandy on Safari on OSX 10.4.6 - the background and text contrast fine. The layout is pretty clean. The one thing that’s wigging out on my display is that your little rainbow meters overlay the cinema posters on some of the films. I found the reconstruction just fine.

11

Hey, congratulations on making a nice-looking site with lots of organized info on a really obscure topic!! I am a big fan of those sorts of sites.

Two suggestions:

  1. On your form pages, add CSS to the text boxes and submit buttons. Unfortunately you can’t get rid of the default border style around a checkbox (I don’t think…?) but default button and text box design really detract from the detail you’ve strived for with the rest of the site.

  2. Do your G/L/T/Q meters need to be so gay? (haha joke!) I mean colorful. They don’t so much stand out as STAND OUT on the gray-themed site. It’s actually a super-cool idea to use the rainbow as a meter for this type of site but for me at least it takes a minute to get past the color and actually read the meter since my eyes are used to seeing grayscale by the time i get to a page with a meter. I would suggest just going with another gray for your meter.

And no…the reconstruction thing doesn’t stand out too well, which is a shame because that’s some really awesome data that people need to see.

12

Are you doing this site for yourself, or do you really want others to use it? While it is your site and you are building it for your own reasons, applying your personal monitor settings as a criteria for contrast and viewability is not correct. Everyone else has their own monitor settings and they are not the same as yours. Cross browser and cross platform viewing becomes important when you understand that Mac users and their monitor settings are different than Windows users.

While you have already stated you have no desire for validation, you do ask for opinions from others using various browsers. With no real objective standard to measure against, every opinion your read is valid and invalid at the same time. Ultimately, any compromises you may make to accommodate the various opinions will help some, and hurt others.

What I am asking is to make a gesture towards validation, starting with the correct DOC-TYPE. Short of putting in all sorts of code hacks (primarlity to address IE users and their crappy browser), you can achieve a quality site that comes close to validation and offers a similar to almost identical view for most users. It also makes it so much easier to maintain the site. Yes, some may lose out on what you are attempting to accomplish, but at least those that may lose out will be for objective reasons rather than a mishmash of individual preferences.

13

To panamajack:

I’m not entirely clear what you said, but I think you’re suggesting that slightly darker background seen behind the menu being extended beneath the text as well? Or something like that?

What if I just made the first mention of the title a link as well, like the links to the people talked about on the page?

I not certain how I would go about ensuring the window is kept full and not showing too much background. If I just included several blank spaces on the smaller pages, that would be fine for people with high resolutions, but not so much for others. I’ll see what I can come up with, though. Maybe something like I did for the ads at the bottom–basing whether to use the letterbox or the banner ad depending on the width of the browser.

I’ll play with different button configurations. I wouldn’t put them at the top, though, since you’d read down the page, then have to scroll all the way back up to advance the scene.

To Idlewild:

Yes, IE has that same problem, so I send it slightly different HTML. I’ll send the same to Safari.

The recon button is my third attempt, with larger text and a shaded background. I’m glad you find it stands out.

To ZipperJJ:

So, make the form elements the same color as the background? I’ll play with that and see what it looks like.

You know, I thought about doing the rainbomometers in black & white as well. I suppose I didn’t under the reasoning that it was a modern concept juxtaposed against the past. That, and they’re easier to read.

Okay, so larger text and shaded background still blend in. What would you suggest be done to the button to make it jump?

And a tired and growingly impatient reply to Duckster:

Yeah, I know everyone’s monitor is set differently. Most are a hell of a lot brighter. I have used other people’s computers and those in the library, and I have tested it on mine using various settings. When I said I keep mine dark, I do mean dark. The screen captures on the website, to me, are just black boxes, but I know they’re fine on regular settings. The black text, however, contrasts with the near silver background. It is half the spectrum away.

The only Mac user thus far has said the contrast was fine.

Of course I’m designing it for me. I know other people will be the primary users, but I can’t design for them. We all have different tastes. Trying to appease others design-wise is setting off down either the road to dull or to trendy. Neither are very good places. I’ll do what appeals to me; those similarly minded will like it, those apathetic won’t mind, and a some will dislike it. That’s life. I wasn’t really asking for design advice if you read my OP, apart from passingly mentioning that I wasn’t closed to all ideas. I’m more fishing for problems regarding accessibility and navigation.

Doing compliant XHTML would be a hindrance, not a cure. Standards mean nothing when, of your three biggest browsers, one actively shits on them and the others all have their little but often disastrous quirks. I shot it down in the OP and continue to do so.

14

So why ask anyone’s opinion in the first place? Do what you want for your own tastes the rest of the planet be damned. Different strokes and all that.

:smiley:

15

I’ve included a bit of JavaScript to ensure the page fills the screen regardless of how big it is.

I’ve also colored the form elements, but I’m not sure about them. I’ll live with it for a day or so and then decided if I like it.