Website feedback
Post Reply
Quote
Re: Website feedback
Posted by Gollum on Thu Mar 2nd at 11:25pm 2006


Linky: http://www.h2index.com/source/temp/index.html

Hello old friends (and new faces) I am on one of my perennial visits to Snarkdom.

This has always been a great place to get feedback on any creative project, especially one with a computer element. I'm making a website which, though it has nothing to do with Half-Life, is perhaps interesting nonetheless for its features and design.

It's a web guide to instruct badminton players. The original guide is the most popular online article on the subject of "badminton grip" (by Google rank). This will be a major update.

So I'd like to know what you discerning Snark-citizens (Snarkizens?) think of the site. Do you like the look? Is it easy to use? Is there anything you would change? Do you see any bugs?

This is largely a technology demo, with little content (three pages).

Although the primary purpose of this site is to provide information, I have also used it as my web developing "sandbox". It's my attempt to build a standards-compliant, attractive site, with some clever stuff thrown in too. Hope you like it <img src=" SRC="images/smiles/icon_smile.gif">





Quote
Re: Website feedback
Posted by Addicted to Morphine on Fri Mar 3rd at 12:01am 2006


Great looking site Gollum, I really like the low-glare (snarkpit-esque) feature and the background and transparencies are nice.

I'm using FF 1.0.7 and I noticed that when I manipulate the text size the box surrounding the text doesnt always scale correctly, or the text itself gets out of place. It fixes itself once I press mouse3 to scroll. If you'd like screengrabs I can give you some.

Also -- the underlining doesn't extend all the way across when I enlarge the text.

Unfinished sentence here:

? quoting Gollum's Site
In the single-page version, you may choose whether to print photographs.

Note that your

The above features also require javascript, so they may not work for you.

You can navigate the site using the table of contents, which also shows your current location.


Looking good man... definitely dig the dynamism that comes with the the beginner/intermediate/advanced settings, but I didn't really see any difference in content, as of yet anyway.






Quote
Re: Website feedback
Posted by Orpheus on Fri Mar 3rd at 12:33am 2006


Welcome home Mike.

This may or may not be a concern for you since the majority of your hits will probably come from a school you attend or one similar and they will surely have broadband.

The web page took in excess of 45 seconds to load fully. I was connected at 4.2 at the time and I feel thats about normal for dial up.

I will attempt to comment further but as you know, I am not particularly in love with badminton

I do however like the ease on the eyes color scheme you chose. Not only is it easy to read, but somehow you picked different colors that harmonize well.

Good luck with this.

[edit] Oh f**king cool. The top layer is semi-transparent. I can actually see the background when I scroll. Nice. smiley





The best things in life, aren't things.



Quote
Re: Website feedback
Posted by Gollum on Fri Mar 3rd at 8:50am 2006


Very perceptive comments, guys <img src=" SRC="images/smiles/icon_smile.gif">

I've also noticed the Firefox "text resize bug". I don't *think* there's anything I can do about this -- it's a very simple javascript function, which suggests that the problem is Firefox's rendering. I would be very happy, however, if anyone could suggest a method of fixing it.

In Firefox 1.5, the rendering errors only occur on the links in the top panel, not in the main text body.

A screenshot would be helpful, so I can be sure we are seeing the same thing.

Could you also post a screenshot of the "underline not extending" problem, please? I think you may be referring to the third-level headings, but I cannot replicate this bug in Firefox 1.5. Or are we still on the top-panel links?

Good pickup with the incomplete sentence.

Orph, your comment about download time is highly relevant. My audience is the entire online global badminton community, so I cannot assume broadband.

I'm in two minds about this one. On the one hand, I hate large images on the web. On the other hand, I like the look of the site.

Do the large images force you to wait for the content, or were you able to start reading the content immediately? And was it the CORRECT content, or did you get stuck with that red notice about javascript?

In fact, perhaps I should test this myself by uploading HUGE versions of the images to slow down my broadband...




Quote
Re: Website feedback
Posted by Gollum on Fri Mar 3rd at 10:15am 2006


Hmmm. The large image sizes DO seem to delay reading the content. I'll have to see what I can do about that...



Quote
Re: Website feedback
Posted by Captain P on Fri Mar 3rd at 10:51am 2006


The text resizing works fine here (using FF 1.5.0.1) though the small size is the same as the original size?
A workaround could be loading the page with a different stylesheet, though I never tried that before, I know it's possible one way or another. image

All in all, it makes a solid impression, but it does take some scrolling down before you get to some actual usefull content. Put the read help links in a sidebar or panel or such, as they're nice tools but not the focus of the site.

The images don't hinder reading the main text body, but the readability help links only show up after the images are loaded. I also noticed some hidden textblocks aren't hidden during the image loading (a big red div with a notice towards beginners or such).






Quote
Re: Website feedback
Posted by Gollum on Fri Mar 3rd at 3:27pm 2006


Does anyone know a good way to force images to load after other content? I'm not having much luck so far <img src=" SRC="images/smiles/sad.gif">



Quote
Re: Website feedback
Posted by Addicted to Morphine on Fri Mar 3rd at 4:10pm 2006


Here are some screenshots of the problem:

After pressing the larger text button a couple times this is what the top box looks like:

image

Everything else lower on the page scales correctly.

After I press and hold my mouse3 button (which is how I easily scrollup and down the page with my mouse) the screen resizes correctly. Everything except for the underlining of the words (yet again the problem is only in this first box):

image

When I press Reset Text Size it ends up looking like this:

image

When I press the mouse3 button it fixes it again:

image




Quote
Re: Website feedback
Posted by Gollum on Mon Mar 6th at 9:50am 2006


Morphine-- thanks for the screen grabs. The problem seems to be much more pronounced under FF1.07 than FF1.5.

In case anyone can see how to fix this, here is the relevant Javascript:

/*==========================================
The functions below deal with text-size
============================================*/

function textsize()
{
var max = 5;
var min = 1;
var x = document.getElementById("main");
var y = document.getElementById("nav");
x.style.fontSize = '1em';
recallSize();

var as=document.getElementsByTagName("a");
for (i=0;i<as.length; i++) { //loops through all anchors + assigns onclick by class
if (as.item(i).className == "text_plus"){
as[i].onclick=function()
{
var textSize = parseFloat(x.style.fontSize.replace('em', ''));
textSize += 0.2;
if (textSize > max) (textSize = max);
x.style.fontSize = textSize + 'em';
}
}
if (as.item(i).className == "text_minus"){
as[i].onclick=function()
{
var textSize = parseFloat(x.style.fontSize.replace('em', ''));
textSize -= 0.2;
if (textSize < min) (textSize = min);
x.style.fontSize = textSize + 'em';
}
}
if (as.item(i).className == "text_reset"){
as[i].onclick=function()
{
x.style.fontSize = 1 + 'em';
}
}
}

}


function recallSize() {

var x = document.getElementById("main");
var textSize = 1 + "em";
var cookie = readCookie("Badminton-guide-textSize");
if (cookie) {
textSize = cookie
x.style.fontSize = textSize;
}
}


function getSize() {

var x = document.getElementById("main");
var textSize = x.style.fontSize;
return textSize;
}




Quote
Re: Website feedback
Posted by Gollum on Mon Mar 13th at 12:47pm 2006


I have updated the site, with the intention of improving the load time for 56k users. Could anyone with a slow connection please help me test this?

What I want to see: the content loads quickly, and the images load afterwards. You should not see the red javascript box.

What I want to know: does this happen for you?

How to test: clear your browser cache, then visit http://www.h2index.com/source/temp/index.html .

Thanks!




Quote
Re: Website feedback
Posted by Orpheus on Mon Mar 13th at 1:35pm 2006


1st test:

After I cleared my history, my temp internet files and my cookies (a process fraught with grief considering replacing it with 56k will take ages)

The page, upon clicking the link:

30 seconds of white.
25-35 seconds of page loading with no scrolling available.
10 seconds of last minute loading.

Total time from link click to completion approx. 1 minute.

will delete everything and do a second attempt. My connection is 4.2k

[edit#1]

Second test:

10 seconds of white page.
33 seconds of page loading with no scrolling available.
3 seconds of last minute stuff.

will do one final testing. Strangely enough, Snarkpit loads and scrolls smoothly with everything deleted/cleared even though the page is loading all the avatars and images on the given page (this page).

[edit#2]

Final test:

8 seconds of white page.
25 seconds of page loading with no scroll available.
3 seconds of last minute stuff.

Yes, before anyone asks, I waited for Snarkpit to complete before I clicked the link so no stray bits of bandwidth will be wasted. (bandwidth, what a stupid concept when used in conjunction with 56k )

Hope that helps Mike.

Hopefully, you can get a few more 56k users to test since I do not trust my connection.





The best things in life, aren't things.



Quote
Re: Website feedback
Posted by Gollum on Mon Mar 13th at 5:53pm 2006


Thanks Orph, that's really helpful <img src=" SRC="images/smiles/icon_smile.gif">

It's bad news, of course <img src=" SRC="images/smiles/sad.gif"> Those load times are far too long, and indicate that the images loading does not work as I had intended in Internet Explorer (it appears to work in FF).

I will have another go soon....ish.

Thanks Jon. Hopefully next time I'll get it right!




Quote
Re: Website feedback
Posted by Orpheus on Mon Mar 13th at 6:16pm 2006


? quoting Gollum

Thanks Jon. Hopefully next time I'll get it right!

Dude, I feel really uncomfortable with you making alteration based exclusively on my experiment.

Don't you have any other friends on 56k other than me?

I have serious reservations about my connection. I got way to used to DSL and everything seems skewed.





The best things in life, aren't things.



Quote
Re: Website feedback
Posted by Gollum on Mon Mar 13th at 6:19pm 2006


It's not entirely based on your experiment. I had an existing suspicion that this would happen, based on a test with a very large image (3Mb).

Your evidence is sufficient to confirm my suspicion, at least for now.

But, of course, more data points would always be welcome <img src=" SRC="images/smiles/icon_smile.gif">




Quote
Re: Website feedback
Posted by Orpheus on Mon Mar 13th at 6:41pm 2006


? quoting Gollum

But, of course, more data points would always be welcome

And of course, my stupid ass keeps forgetting to tell you about this.

Read on Master Gollum.

This may/might/should solve your testing shortfalls.

Good luck.





The best things in life, aren't things.



Quote
Re: Website feedback
Posted by Gollum on Mon Mar 13th at 7:03pm 2006


Ooooh!

Looks interesting <img src=" SRC="images/smiles/icon_smile.gif"> This might save me some testing hassle.




Quote
Re: Website feedback
Posted by parakeet on Tue Mar 14th at 9:25pm 2006


also i perfer the glare resistant over the original , though both are quite amazing. i really want to know how you did the clear framely guys... they are pretty


.else /me ~kill you
www.arclan.net



Quote
Re: Website feedback
Posted by Gollum on Tue Mar 14th at 10:26pm 2006


The "see-through" effect, whereby the body appears to show some of the background behind it, is a trick image

In reality, it's not translucent. I've used CSS background attachments to fake the effect.

CSS allows you to fix background images relative to the viewport, so that they remain in place when you scroll. There are in fact several images that go together to make up this fake compositing effect.

Eric Meyer is probably the first person to come up with this idea on CSS Edge: http://www.meyerweb.com/eric/css/edge/complexspiral/demo.html .

I also needed to trawl the web for a fix for Internet Explorer (it's only a partial fix, because it does not allow centreing of the image).

Look at my stylesheets, paying particular attention to the background images in style.css and ie_hacks.css. The supporting javascript for IE is found in ie_hacks.js.




Quote
Re: Website feedback
Posted by Crono on Wed Mar 15th at 3:42am 2006


Making something translucent is easy ... I used to use it on drop down menus. And it works in IE too ... but my menus didn't :

Let's see here ... Yep. Can't find it.

I'll keep looking, but I know I've done this before and actually made it transparent. Frames and everything were visible and the transparency could be set to whatever opacity. I'm sure I used some JS too though. It's been a long time. <img src=" SRC="images/smiles/sad.gif">



Blame it on Microsoft, God does.



Quote
Re: Website feedback
Posted by Gollum on Wed Mar 15th at 9:31am 2006


Apart from the fix for IE, my method of "fake translucency" uses only CSS (and simple CSS, too).

On the other hand, it does require more images than genuine transparency would need. But it also gives more control over the effect you want.





Post Reply