Feedback needed

Technical Website Design/Showcase
1

So I am the only web designer / programmer for my team, I an still getting content for the robot pages and a few more pages and I am working on a video gallery page and photo gallery page now. The website is completely built using HTML and PHP.

I would like feedback on the website so far, as may of you may know, team feedback can only go so far.

so tell me what you think and give me suggestions and what you find is wrong or just plain horrible.

Thanks!

http://www.frc1094.org/

2

Overall this is a nice, simple layout. I am sure that minor tweaks will enhance this site as it progresses.

You may want to correct the spelling of Chairman’s.

I like that you added a slide show on the home page.

You may want to look at your text fields and add white space between paragraphs, as well as use left-align or justify.

I would also remove the team logo on the side bar since it is redundant with the header logo. Adding a section for “team graphics” with high resolution images would be a useful place for this.

Non-sequitor: it works in IE7 (forced to use this ancient brower at work :() Websense is telling me something about “Competitions” page being a game and thus a threat to the security posture of my network. So is YouTube, but I digress :rolleyes:

3

From your home page: “The Chairmens Awards Team is ready to give their speach”

  1. Chairmans not Chairmens
  2. speech not speach

Spelling Check is your friend.

4

thanks also which text fields are you referring to? and I noticed that the extra logo was redundant I will be swapping it out with a swapping images of our main sponsors. I am working on that code for that as well that way it is a different images on each load

and I am surprised I did not catch that spelling error lol thanks for catching it

*Spelling error fixed now

5

It would be a good idea to add a media tab to the navigation bar it gives a great idea of how you guys are doing overall.

It may also be cool if you added a picture of your old robots (if you have them) to each of the robot names you have in the robot menu at the bottom of the homepage.

Another cool idea would to try adding drop down menus to each tab to add an extra level of convenience.

6

I want to add a splash page for users using IE as well telling them to get a real browser lol, do you think that will be a problem? (Ill have links to every other browser there is though lol)

7

The text blocks I am referring to is the white area on pages such as Awards and other pages reached via the “About Us”.

8

We have a robot page but as explained I am still gather info about some of the robots, and I refuse to use drop down menus they are just too annoying and used on to many websites, plus another thing that was explained, I am working on a media page, video gallery and photo gallery.

I am also working on a way to clean up my links page. I realize it does look a little dis organized right now and I even don’t like that

9

Overall it looks great. One thing that I noticed is that the Oxford comma should be before “and”.

We sponsor many Jr. FLL, FLL and, FRC Teams.

Should be "We sponsor many Jr. FLL, FLL, and FRC Teams.

Also the formatting of the links on the resources page seems a bit odd. Not that bad though.

10

I have found a way to fix that the valiang was set to default" instead of “top” by a stupid mistake when switching to php

i am in the process of switching all those

11

the formatting on the resource page got messed up and i dont know why, i am fixing that as well

12

Looks good. I’m not an expert on site design (if such thing exists), but here a few things I noticed, feel free to ignore my input.

I’m not sure if you want the “About Us”, “FIRST”, and “Sponsors” buttons all going to a single link page, that could be a little confusing, you could have a separate link page for each of those buttons and have some sort of supporting material on the link page (like pictures or an anecdote/paragraph on the subject) and have the links(buttons) at the top or along the side of the page.

The site navigation links at the very bottom of the page seemed to take up a lot of space (compared to the rest of the page), I like the logo at the bottom filling the background space but I’m not sure if you need all of the navigation links down there a sitemap page would suffice.

On my screen the logo on the right touches the search box, you might want to move the logo down a little bit.

The navigation buttons at the very top don’t really follow the squared off theme of the rest of the site, and don’t take up a lot of room. My suggestion would be to make the buttons square and simple (solid color) and make the navigation buttons take up most of the width of the center area of the website (where the main content is) and the full height of the navigation bar. Similar to this (#2).

Overall looks very clean, good work.

13

I personally would make individual pages for First, About Us, and Sponsers

14

You have a good fundamental layout. At this point, you need to start focusing on the details to elevate your website from “just good” to professional level. Several good suggestions have been made above; following are a few of my own. Please note that some of these are very nit-picky:

  • “Feedback” is one word. You spelled it “feed back”.
  • The suggestion above to use flush left or justify for your content is a good one. Centered text just doesn’t look quite right.
  • Using white boxes for your content on top of a dark grey background makes your white look very bright and thus is uncomfortable on the eyes. I’d consider using a subtle grey underneath the text (like here on Chief Delphi).
  • The above applies also to your header.
  • While we’re on paragraphs, I think the decision above to add some spacing between paragraphs is a very good idea. Doing so will change your content from one big block to a bunch of smaller, more digestible ones.
  • Make sure to italicize every reference to FIRST
    . The About Us page forgets to, and so does your footer.
  • As mentioned above, About Us, FIRST
    , and Sponsors link to the same page. This will likely confuse your visitors. Your navigation will be more intuitive if each links to a separate page.

I have a few more, but these reach real nit-pick level.

  • You use long blocks of text with a sans-serif font (Arial). Apparently, serif fonts (like the ubiquitous Times New Roman) make long blocks of text more readable – this is why many news sites employ Times New Roman, Georgia, or something along those lines. (This doesn’t seem to concern Chief Delphi, or any forum site, really.)
  • The line spacing in your paragraphs is a bit larger than I’d like. It think it’s approximately 1.5 spaced, whereas on Chief Delphi (and on many other websites) the spacing is closer to (but often slightly larger than) 1.
  • You have occasional grammar errors throughout the website. (e.g., “The award-winning Channel Cats is a FIRST Robotics team. Supported only by sponsors and devoted mentors.” [The second sentence is a fragment.])
  • Your About Us page underlines some text. This is not recommended for the the Web because most websites underline hyperlinks, making non-linking but still underlined content confusing for the reader.
15

Just a few glancing thoughts -

Home: I like the homepage. Its fairly cleanly set-up and the color scheme with the emblem gives an immediate sense of team identity. The slideshow is a nice touch and it is very easy to to find the search tool, the navbar and your social media links. The small sitemap at the bottom is also neat.

Menu: So by design the website has a small, compact menu bar, which often works very well. For the ‘About Us’, ‘FIRST’ and ‘Sponsor’ the main menu links you back the a page of link which provides the three sets of submenus. I find this a little confusing and (personally) would prefer that either they were separate page (so they dont three link to effectively the same thing) or that drop-down submenus were used so that an extra link page would not be necessary.

Who We Are: Lots of sections. The ‘Team’ section is solid but the use of bold and underline makes a little hard to read. Some spacing and paragraph use might accomplish the same goal in an easier-to-read format. Showing the picture of the trophy for the awards section is a cool touch. I’ll assume / hope the blog will grow, an near empty blog is saddening. I too use Google Calendar with much joy, but I don’t seem to see any events on your calendar…? Also (I know I suggest this more than once later on) but I would add a space before and after the embed. Its nice that you list your demonstrations. I must say that is a unique way (with the picture) to show your location, although I might have expected that in the ‘Contact Us’ section, this works too. A Robots page is always cool, but I would have hoped for a picture of the bots if possible. I really like that you so openly display your scouting data, but that section might benefit from either an introductory page or explanatory paragraph accompanying it.

FIRST: Your ‘What is FIRST’ and ‘FIRST History’ pages are solid, although I would suggest adding some <br />s in between the sections and particularly the grids. It might make it look a little less cramped and a little cleaner. I like that you list the competitions with links, but I would consider not using bright yellow for some of the FLL ones as its hard to read. Also, maybe I’m biased as an JrFLL state coordinator, but why not add JrFLL to the list?

Sponsors: I appreciate the variety of links given, depending on what the user wants to help with. You show your sponsors well and I really like the ‘Sponsor Benefits’ page ( I might have to borrow the idea for my team’s site if you don’t mind!) A quick note, on the bottom of ‘Sponsor Benefits’ you note ‘National Exposure’ at the ‘National Championship’. In accordance with Gregor Browning’s signature, we are international. I liked the how to donate page and the volunteer page is also a great idea.

Links: A very useful collection. Perhaps a personal opinion (that you are free to discard), but I would add an extra <br /> at the very end after the ‘Useful Software’ section only so it doesn’t as abruptly end the box. Again, a very personal opinion.

Contact Us: Nice form. These always give a very professional feel.

Other: A minor point, but I might suggest customizing the title for each page so that the tabs have a more specific label. For example, right now they all have <title>Channel Cats</title> and you might consider something like <title>Contact Us - Channel Cats</title>. Also its often helpful to fill in the meta tags for keywords and description as they assist with search engines. Right now they are blank (<meta name=“keywords” content="" /> <meta name=“description” content="" />)

16

Thank you all for your feedback I will be taking everyone’s suggestions into account and have already made some changes, I have already changed the menu bar and am still working on it, it was made using CSS3 so the aligning of it is being fixed, its not being centered correctly. I am doing big changes first and small changes last (I know I’m stupid like that lol)

But, most of the suggestions will be implemented into the site there may be like 1 or 2 that wont be but very few will not be Thank you again for the suggestions!

If you have any more just keep posting!