Design for 4WebHelp.net

Posted: Sat Mar 01, 2003 5:50 pm (21 years, 1 month ago)

verto wrote:

Just visited myself with NS 4.7 while using it for something else (still use it for testing, among other reasons), and Garth's right that many pages here don't display well. Also, like 'Guest' mentioned, found it's impossible to post or read posts, and I had to switch browsers also.

For what it's worth, I may have figured out the problem. (I was the one posting as guest earlier.) Mainly because I ran into the same thing on my site when I moved the styles to an external style sheet. Smile

Exact same symptoms, easy fix.

In my external style sheet - call it mine.css - I had included some additional code for border widths around form elements. In fact, it's the stuff that is in the formIE.css file, had I looked. It turns out that those extra style elements were what was screwing up NS. When I removed them from mine.css and added a link back in the header to load the IE stuff separately, everything worked.

It's an easy test, if you want to try it.

The lines in my style sheet that were causing the problem were:

Code:

border-top-width : 1px;
border-right-width : 1px;
border-bottom-width : 1px;
border-left-width : 1px;

in the input, textarea, select portion of the style sheet. When I removed them from mine.css and left them in formIE.css, and editing my overall_header.tpl to call both:

Code:

... that fixed the problem. I noticed in your style sheet that you have added a border-width setting in the same area; I bet if you take that out your site will work fine with NS 4.7. If that bothers you. Wink

Nice site... I need to register.

Dave

Team Member Joined: 06 Jan 2002 Posts: 2564

Yeah, I actually noticed that months ago, on the main site. I then added the following to the style sheet for the main site:

Code:

input, select, textarea {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
border-color : #000000;
padding-left: 3px;
<? if (!strstr($HTTP_SERVER_VARS['HTTP_USER_AGENT'] ,'Mozilla/4.79')) { ?>
border-width: 1px;
background-color: #FFFFFF;<? } ?>

I'll make the suggested changes to the forums though. Thanks Very Happy

. Lucky Netscape 4 doesn't know how to use the @import command! Laughing

WebHelper Joined: 01 Mar 2003 Posts: 69 Location: Texas

Anonymous wrote:

Nice site... I need to register.

Dave

Anonymous no more. Wink

I like your layout for the Previous / Email / Print / Next topic links. I borrowed the look, created my own graphics, and adjusted my forum to work the same way. Good job on that one.

I found it interesting seeing which "mods" you've made here, and which ones you haven't. One of the most popular mods on my site is the "set focus" mod, or whatever it's called. It uses a wee bit o java script to put the cursor into the first blank item on a form. For example, when you log in, you can start typing right away, you don't have to first click on the login field.

Anyway, I look to be able to "borrow" more ideas from your site. Cool

And maybe even learn something or two in your forums. Very well done. Cheesy Grin

WebHelper Joined: 01 Mar 2003 Posts: 69 Location: Texas

Just went back and reread this entire topic. Seems that the gradient was a big topic of discussion. Smile

Suggestion: keep the gradient (it looks nice) but consider reducing the height from 100 pixels to 1. And it will tile just as easily as if it were 100 pixels high, like it is now. When I played around with the image it turned out to be about half of the size.

Also, and I'm not absolutely sure about this one, but isn't there a css directive on how the background image is displayed? If so, you could chop off all of the blue, leaving just the shaded part. Set your background color to blue, so that the gradient fades into the background color. And set the image to tile vertical, but not horizontal. That way you can cut even more of your background image.

Just food for thought... I finally joined the modern age and got high speed internet at home, so I'm not as concerned as I used to be. But believe me, when I was limited to dialup, I always tried to figure out ways to reduce the total byte size of my pages.

Another bonus: less bandwidth to pay for. Wink

Team Member Joined: 06 Jan 2002 Posts: 2564

drathbun wrote:

I like your layout for the Previous / Email / Print / Next topic links. I borrowed the look, created my own graphics, and adjusted my forum to work the same way. Good job on that one.

No, I'm not going to take the credit on this Very Happy

. It's a mod by Daz from ForumImages (http://www.forumimages.com/).

drathbun wrote:

I found it interesting seeing which "mods" you've made here, and which ones you haven't. One of the most popular mods on my site is the "set focus" mod, or whatever it's called. It uses a wee bit o java script to put the cursor into the first blank item on a form. For example, when you log in, you can start typing right away, you don't have to first click on the login field.

Interesting Smile

. May be one I'll add. Do you have a link to it?

Team Member Joined: 06 Jan 2002 Posts: 2564

drathbun wrote:

Just went back and reread this entire topic. Seems that the gradient was a big topic of discussion. Smile

Suggestion: keep the gradient (it looks nice) but consider reducing the height from 100 pixels to 1. And it will tile just as easily as if it were 100 pixels high, like it is now. When I played around with the image it turned out to be about half of the size.

Wierd that nobody ever thought of that. I guess it's because I too have DSL Very Happy

. Will see what I can do with this gradient, while keeping the same background. If it is the same all the way done then it can probably be cut to 1-2 pixels as you said.

Edit: Done. Please let me know if anything looks wierd.

WebHelper Joined: 01 Mar 2003 Posts: 69 Location: Texas

Daniel wrote:

Wierd that nobody ever thought of that.

Hey, who you callin' weird? Twisted Evil

Quote:

Edit: Done. Please let me know if anything looks wierd.

Looks fine.

Here's a link to the "set focus" mod. I think I changed it a bit, but am essentially using the base logic:

http://www.phpbbhacks.com/searchresults.php?version=&query=set+focus

Essentially what you do is add some javascript to each page that includes a form, like the login screen, for example, Then when the form is invoked, the cursor automatically starts in the first empty field. It really gets irritating when I go to phpBB boards that don't have it now... especially phpbb.com. Laughing

Here's the javascript code, as I've implemented it on my site:

Code:

I put this into a file called setfocus.js in a specific directory on my site. In overall_header.tpl, I reference this external file using:

Code:

This goes in between the <head> and </head> tags.

Finally, to call the code in a page, for example, the login form... first, you have to name every form (something phpBB didn't do), as in:

Code:

Then, at the end of the page (after the </form> tag) add this code:

Code:

<script language="javascript" type="text/javascript">

</script>

You need to reference the form using the same name you used at the beginning of the form. Fairly basic, actually, and you'll wonder why you ever put up with the software without it once you set it up.

My opinion, anyway. Wink

So Daz is the one that built the original button bar; very cool. I know his work.

Dave

WebHelper Joined: 01 Mar 2003 Posts: 69 Location: Texas

... btw, you fixed Netscape 4.7 too. Very Happy

Just signed back on to check.

Dave

Team Member Joined: 06 Jan 2002 Posts: 2564

I've now added the mod you suggested. Thanks! Smile

WebHelper Joined: 01 Mar 2003 Posts: 69 Location: Texas

Daniel wrote:

I've now added the mod you suggested. Thanks! Smile

I noticed!

BTW, there is one minor item that you might want to consider altering. I don't allow polls (except for one area) on my forum, so I never noticed this before. But now if you "preview" your message before posting, the cursor jumps to the first empty field... as it is supposed to... which happens to be the first poll field. So to view the message you are trying to preview, you have to scroll back up.

I expect that the exception code in the javascript would not be too difficult. If I get time this weekend, I might try and see what I can come up with.

Other than that, it's nice, isn't it? Very Happy

Dave

Team Member Joined: 06 Jan 2002 Posts: 2564

Sorry, I can't even replicate what you're talking about. Sad

WebHelper Joined: 01 Mar 2003 Posts: 69 Location: Texas

Daniel wrote:

Sorry, I can't even replicate what you're talking about. Sad

Okay, try this. Reply to this mesage. If the subject is blank, the cursor will start there. I entered a subject for this post.

Next, click "Preview" rather than "Submit". Where is your cursor? In this forum, since polls aren't allowed, it's fine. There aren't any empty fields.

Now go to the "Chit Chat" forum, and enter a post there. Click preview. In that forum, where you allow polls, the first "empty" field is the first poll option, so the cursor goes there. Depending on the size of your browser window, you would have to scroll back up to the top of the screen to see your previewed message.

I'm going to have the same problem on my forum; I just hadn't noticed it there, and nobody else had complained. Wink

Those steps should help you replicate the problem...

Dave (happy with his one-line sig once again Wink

)

Team Member Joined: 06 Jan 2002 Posts: 2564

Actually polls are allowed in this forum, IIRC, it's just that when you reply it doesn't give you the option of a poll. I was able to replicate the problem, and I do agree that it would be better to have it jump to the message field, however I really am not proficient in Javascript Sad

.

WebHelper Joined: 01 Mar 2003 Posts: 69 Location: Texas

Daniel wrote:

Actually polls are allowed in this forum, IIRC, it's just that when you reply it doesn't give you the option of a poll.

D'oh! I know that...

Quote:

I was able to replicate the problem, and I do agree that it would be better to have it jump to the message field, however I really am not proficient in Javascript Sad

.

Like I said, I'll have the same problem on my forum. I'll give it a shot this weekend, if I can get the code working, I'll send you the update.

Dave

WebHelper Joined: 01 Mar 2003 Posts: 69 Location: Texas

I've been meaning to leave this comment in this thread for a while, just kept forgetting. Rolling Eyes

I would like to make a suggestion about the layout used for the top of the page.

Try setting your screen resolution to 800 x 600 and view the forum index. What do you see? The top third is your logo, the next third are menu options, then there is the link for the email subscription, and finally on the bottom is your "since your last visit" data. Or at least some of it. There's not much on that screen that let's me know what's going on with this site.

I know that 800 x 600 is an "older" video resolution, but here are still quite a few folks out there that use it. Okay, understanding that this forum is more technical in nature, and I bet that very few folks using it are running 800 x 600. On the other hand, you're not giving folks that are running that resolution much of a chance.

Do you need the large "dead space" at the top? You could shrink your logo, and put it into the border of the forum, push the menu items over to the right some, and make a lot more room. Not to mention, much less scrolling. Smile

I noticed that the "dead space" isn't really dead; it changes the text as you move from area to area. But I would rather leave that info off and have more useful space.

Back to the 800 x 600 argument for a moment... you might say that nobody who is anybody runs that resolution, and you're probably right, as I said before. But - quick poll - how many of you run your browser at full screen? In other words, even though I run a much higher video resolution, I hardly ever run my browser full screen. So screen real-estate doesn't translate into browser window size.

And someone that is running 800 x 600 is probably running their browser full screen, just because they can't see anything otherwise. Shocked

Anyway, here's a mockup of what I am talking about. You can really increase the usable space at the top of your forum by going with something like this.

You might notice there's no "Register" link. That's because I'm logged in. Smile

I'm already registered, there's no reason to see the link. When I log out, sure. But when I log out, you don't need to show some of the other menu items, since they only make sense when you log in. I would replace Profile and Personal Messages and Logout with Register and Login when the user logs out. I did that on my site; it's really quite easy. I even added an Admin link to the menu at the top if an Admin logs in.

But with this change to your layout, you have all of the same useful information that you have now, in less - in this case, much less - space. Which means less scrolling, and more visible content. Cool

Just some food for thought. Feel free to completely ignore me. Very Happy