|
| |
|
|
Mane
Posts: 105
Joined: 7/7/2005
Status: offline
 |
School Website - 8/21/2008 17:58:46
This is a website I took a part in creating, for a high school.
It took quite a while to put together, as it includes apps like news, events calendar, photo gallery and so on.
http://www.bellhs.net
Please bring up any problems with typography and accessibility (or anything else you see).
|
|
|
|
treetopsranch
Posts: 1155
From: Cottage Grove, OR, USA
Status: offline
|
RE: School Website - 8/21/2008 19:14:06
Looks pretty good. Did you use a template or start from scratch?
_____________________________
Don from TreeTops Ranch, Oregon
"I've got a taste for quality and luxury"
| |
|
|
|
Mane
Posts: 105
Joined: 7/7/2005
Status: offline
|
RE: School Website - 8/21/2008 20:53:17
It was all from scratch, except for a couple of things (blog, photo gallery).
| |
|
|
|
ou812
Posts: 1602
Joined: 1/5/2002
From: San Diego
Status: offline
|
RE: School Website - 8/21/2008 20:57:02
Overall, I like the look. I popped around just a bit and found some things:
The text under the Heading text is positioned poorly in FireFox, as well as the right side logo is positioned differently than in IE
"Principals Blog" is black in FF and Blue in IE
Trying to look at "staff" and entering a vowel brings up an error page on http://www.bellhs.net/scripts/captcha.php . But going back to the staff page I can now see emails.
The calendar on school events page doesn't stay within the page in IE, it breaks out the right side. In FF it seems to work.
_____________________________
-brian
EnterpriseDB: Enterprise-class relational database management system
PostgreSQL: The world's most advanced open source database
| |
|
|
|
d a v e
Posts: 4178
Joined: 7/24/2002
From: England (but live in Finland now)
Status: offline
|
RE: School Website - 8/21/2008 23:03:20
very nice but...
- the logo is blurry, looks like you resized it without using unsharp mask after - what graphics app did you use?
- school photo (building) is too heavy with dark grey clouds! bit depressing - find a sunny picture :)
good job otherwise
_____________________________
David Prescott
Gekko web design
| |
|
|
|
Tailslide
Posts: 6294
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: School Website - 8/22/2008 2:59:39
I think that it's very good.
The only thing that consistently causes an issue is that you've got no focus (or active) effect for links which means that if you're not using a mouse you have no idea where you are on the page.
That'll take about 30 seconds to fix though!
Personally not keen on the "|"s separating the bottom menu - I tend to use a background image in the css instead just to reduce any confusion for screenreaders - same end effect though. That menu should also be a list rather than just bare links - if you see what I mean.
Being pathetically picky, you could write the pagination for the Latest news (or display it where it's normally hidden)via Javascript so that if JS is off you don't see the unusable pagination - but that's pretty picky!
Oops - just seen the contact form. Don't particularly like using a table for this but the major issue is the captcha which I can't actually read myself! The best form by far is Mike Cherim's Secure Accessible Contact Form which does what it says it does!
Very good though!
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
|
|
Mane
Posts: 105
Joined: 7/7/2005
Status: offline
|
RE: School Website - 8/22/2008 15:20:50
Thank you all for your input. I'll try to fix those problems.
The photo is rather unfortunate - I took that one myself and just as I was making my way to the site the sky filled with clouds.
Tailslide: I removed the pipe characters and replaced them with borders. Changing the bare links to a list however added an extra space between the <li> elements. Taking out all of the whitespace and line breaks from the markup fixed this, but is there a better way?
By 'not using a mouse' do you mean just using the tab key? Just noticed that only IE uses the active effect for links selected like this, while FF does nothing (unless its somewhere in the settings). Also, I realized that the drop-down nav menus are inaccessible just using the tab key. It goes through the links, but the menu is invisible. Is there any way to fix this?
| |
|
|
|
Tailslide
Posts: 6294
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: School Website - 8/22/2008 15:42:12
Haven't got a lot of time at the moment so I've copied and pasted below the CSS I use for a list menu with pipes in between - straight list with id of navlist:
#navlist { font-size:99%;padding-bottom:10px; margin:0 5px 0 5px;line-height:normal;height:3em;font-weight:bold;background: #fff url(../images/line.gif) no-repeat center bottom;}
#navlist ul { margin:0 ;padding:0 0 0 0;list-style:none;width:20em;}
#navlist li {list-style-type:none;float:left; margin:0 15px 0 0 ; padding:0;}
#navlist li {border-right: 1px solid #ccc;float: left;line-height: 1.1em;margin: 0 .5em 0 -.5em;padding: 0 .5em 0 .5em;}
#navlist li.last {border-right:none;}
#navlist a:link, #navlist a:visited {border-bottom:none;color:black;}
#navlist a:focus, #navlist a:hover, #navlist a:active {color:#c20c0c; }
Yes I mean tabbing around the page. All you need do is add a focus and active rule (active because IE incorrectly does focus like this) just as in the pipe menu last line above.
The dropdown menus aren't in themselves accessible and this would normally be an issue BUT you've got secondary menus on each page so you're ok.
There aren't many really good accessible dropdown menus - there's the Accessible Suckerfish or the Freestyle dropdown and flyout menus I've actually used that last more than the first because it's pretty much got all the work already done for you - i.e. sorting out IE! I'd still ideally have a backup plan for navigation even if it's just a sitemap just in case JS is off (the freestyle menu reverts to top level only in IE6 and under).
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
 New Messages |
 No New Messages |
 Hot Topic w/ New Messages |
 Hot Topic w/o New Messages |
 Locked w/ New Messages |
 Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|
Printable Version 
