Clean design...

[patenaudemat]

Hey anybody,

http://www.riasp.org/jobs

I'm looking for opinions on a site I just designed for a local organization. It's a web portal for school administrators to post job listings. It's written in all PHP/HTML. Since it's password protected, there are some areas you can't get to, but it all looks the same. Tell me what you think!

Keep in mind that this will be used by educational administrators, so it has to be clean, readable, and extremely simple, or they won't be able to figure it out.

It validates as HTML Transitional 4.01, and CSS 1.0, should expand and contract automatically for resolutions 800 X 600 and greater (I'm designing on 1,024 X 768), and looks the same in all of the major browsers (MSIE, Mozilla/Netscape, Opera).

Thanks!

[spufi]

Even as a person who enjoys minimal designs, I would have been really tempted to add some color to the design. Beyond the background image, there is very little in terms of design to it. I would have done at least these two things. One, color "RIASP" differently than the rest of the header. Give the links different colors than the defaults. I probably would have added a slightly darker background around the content area too.

Your code may be valid, but it could be more sematic too.

"<FONT SIZE=6>RIASP Educational Position Portal</FONT>"

Should be...

"<h1>RIASP Educational Position Portal</h1>"

And then use CSS to style it as needed.

[davidbrent]

Alternatively you could just use plain old

<span style="font-size: 10px;">Wednesday, July 7th, 2004</span>
<span style="font-size: 14px;">RIASP Educational Position Portal</span>

on another count, a personal preference but i do not find the font easy on the eye. Maybe a change to a basic Arial, Verdana, serif? Just an idea.

hope that helps.
Best Wishes,
David

[patenaudemat]

spufi: Your code may be valid, but it could be more sematic too.

"<FONT SIZE=6>RIASP Educational Position Portal</FONT>"

Should be...

"<h1>RIASP Educational Position Portal</h1>"

And then use CSS to style it as needed.

I know, I know... it's technically the same. It's just that I'm not the best in CSS, and at the time it was simpler to do this because I don't wan't the trailing blank line after the heading that you get when you use <hX>.

Also, in case you were wondering, on numerous occasions I use <BR><BR> instead of <P>. That's because when I use <P>, it stops putting text in the "little white box." Again, this was simpler at the time... I was on a slight deadline to finish this.

So, yes, in this project, semantics could be better. But I usually am pretty good at using them! I tried to avoid some of this by using a <DIV> or a <SPAN>, rather than stylesheeting the <P> tag, but... once again... I didn't have the time I would have liked to iron that out-- for some reason, it was causing problems in IE (of course... typical Microsoft).

As for adding color, RIASP didn't want it to be too colorful-- pretty straightforward. However, one color commonly used by RIASP is a dark red, similar to that used on this site. Therefore, I could do the links and the heading, as well as the border around the content, in the dark red color. That would make it a little bit more interesting. I don't want to do it yet-- I have over 100 files in this project, and I was too lazy to do an SSI header, so it would take to long to upload on my dial-up connection. I'll use RIASP's T1 when I get up there. Visualize!

And the font... I don't want to make it too fancy, and I want it to be compatible with most computers, but suggestions are surely welcome! Maybe I'll try the Arial family. Thanks for all your help!

[spufi]

I guess I'm still not seeing how going the way of doing things more sematically woudn't of been better. I guess I would have to have seen what was causing problems when you tried to do it the sematic way. Also about changing all of the pages, one externally linked CSS file will take care of that.

[patenaudemat]

That's how I did it... one CSS file.

I don't have the heading color specified in the CSS file, and I'm just lazy to go back and fix it. I'll probably do it by the end of the day though.

[patenaudemat]

Man, this is funny... it's amazing to see how bad at web design I was just over a year ago. And how little I knew about semantics.

My latest design for this company's website: http://www.riasp.org

I'm also completely dumping this setup, and redesigning the job board in a few weeks. Stumbled across this old thread while Googling, and, realizing how incredibly stupid I sounded, thought I'd defend myself with my new knowledge. ;)

-Matt