First Website Revision

[Adam.garcia]

Thank you, I have just informed our website developer, and he is going to make those changes. Once finished, I will repost to say that the newest updates have been made.

Thanks for your feedback!

[shawn.schwartz]

Hello,

I am the current web developer for Team 4 ELEMENT. Thank you rachelholladay for your critiques.

Since we have the same about the team on the Home page, should I just do away with the whole about the team page?

Otherwise, what do you guys think of just having a quick glace on the Home page about our team and FIRST, then have separate pages with more information? And, are the shadows on the images too distracting? Would it be better to have a glowing effect instead?

Thanks again for the helpful critiques. Please share any other design tips you have that I can implement to make the website appealing to all of the eyes that view it.

[rachelholladay]

Shawn,
I would say that an "About Our Team" page/section is almost mandatory. Maybe you could name the tab "About Our Team" instead of just "About"? (which is a little unclear). And then replace the "About Our Team" page with one on your teams history (as detailed or basic) as you like. However, I think its important to tell the story of your team because it gives people a sense or who you are and where you have come from.

In case you haven't seen this (although you probably have) the website judging criteria can be found at http://www.usfirst.org/sites/default...20 manual.pdf (pages 2 and 3) While you should never work only to win an award (because that rarely works) the criteria can give a sense of what is important to stress in your website. Plus, its always nice to have some guidelines.

There might be an easy way to reduce the amount of scrolling (and therefore add more content in each screenshot). Your main content container is centered and seems to fill about 60-75% of the screen. Perhaps trying playing around with percentages to make it take up more space? Even if its just a little bit you will retain the bright blue feeling while showing more information in a quick glance.

(oh, and I like the bright blue shadows..)

[shawn.schwartz]

Rachel,

Thanks again for your very helpful critiques. And yes, I have looked at the website award criteria before and tried to use it when designing the multiple versions of our website.

I was messing around with the percentages, and let me thank you so much for that idea, (instead of using pixel widths), because it allows me to have more content on the screen.

Does your website happen to use CSS3 Media Queries for compatibility, because I was thinking that I may have to format our website for that? The reason why is because, with the new percentage widths that I have been testing for the content boxes, I noticed that on a 13-inch MacBook, the content is pushed down and the elements of the webpage are out of place. But, on other displays, everything fits. You can see what I am talking about by going on our Team's website right now and playing around with it by changing the browser's zoom in and out.

Thanks again!

[rachelholladay]

So I'll admit..I was a little intrusive, I looked at your HTML, CSS and a little of the Javascript (i too use dynamic drive and have previously used the Accordion one).

I believe the issue you are having is that the majority of your objects are resizing expect for the ones in the main content container. It seems to me that while the outside box changes with the broswer the about our team and blog posts does not. For example, below is your CSS for the blog posts:

.recentBlogPosts {
padding: 10px;
border: 3px solid #000000;
width: 290px;
}

While you made most of the things percentage based (or rather, comments out the pixel based size and added on the percentage. Which, by the way is exactly what I would have done) you might have forgotten this one. Also, while it is a little easier to figure out pixels (because you can "hard code" them in to get the exact look you want, percentages take a little more, shall we say, experimentation to get just right. For example right now your sidebar is fairly wide. (The CSS is below)

.sidebar {
width: 17%;

Therefore the navbar seems fairly stretched out. Within percentage based, everything plays off one another, so you have to consider elements in relation. I am unfamiliar with CSS3 Media Queries

[Adam.garcia]

Originally Posted by rachelholladay

So I'll admit..I was a little intrusive, I looked at your HTML, CSS and a little of the Javascript (i too use dynamic drive and have previously used the Accordion one).

Although your proposed solution makes no sense to me (since I have a fairly limited exposure to HTML), we at Team 4 encourage criticism as it's the very action that promotes excellence. Thank you for your "digging", and I know Shawn is going to take this criticism graciously.

[gixxy]

Rachel got to nearly everything already.

I do want to add that the Dynamic Drive Accordion effect does not fully function in Chrome.If you click the buttons a few times, like when looking through the links, you will notice the + and - start to move off the tabs. Just a little technical detail, not sure if it is really bad enough to worry about.

I also found the white on the light blue (for the navigation bar and blog posts) somewhat straining to the eye, or at least my eye.

As far as the images: whatever effect is currently on this is great. It gives them a feeling of being floating a bit, but it isn't distracting, just gives it some emphasis.

And also as a nit-picky programmer. The bit of Java code in the blog post has an error:

if (team4.department == "Programming") {

should be

if (team4.department.equals("Programming")) {

But overall it is a great site. Well Designed, flashy, but not overly done. Good Job!

[Bryce Paputa]

Originally Posted by gixxy

And also as a nit-picky programmer. The bit of Java code in the blog post has an error:

if (team4.department == "Programming") {

should be

if (team4.department.equals("Programming")) {

It's not necessary to do that in Javascript, in fact, I don't even know if String.equals is valid. Also, you could change the body background from

background:url(/assets/images/bg.png) no-repeat #212121

to

background:url(/assets/images/bg.png) no-repeat #212121 fixed

it makes it so the background doesn't scroll, and IMO, it looks better.
EDIT: forgot to tell you that the rest of the CSS is awesome
EDIT 2: never mind about the java stuff, I thought you had mistaken the Javascript for Java, i didn't see the actual Java code.

[shawn.schwartz]

I would like to thank everyone for all of the wonderful help. Over the past few weeks, we have made a lot of progress with the website. If anyone would be willing to, can someone please judge our website using the FIRST Website Award Guidelines? I want to see how we do, to make sure our website has all the correct content, and to see what other people think about it.

Thank you very much.

[Gigakaiser]

Y/N – can a new user easily locate and identify No Yes
Team name 0 2
Team number 0 2
Physical location of the team 0 2 -Just state your location after your highschool is listed on your home page
A link to the FIRST website 0 2
The FIRST logo 0 2
How well does the website explain FIRST and promote its vision
to people not familiar with the organization?
0 1 2 3 4 - You may want to add something about students + professionals teamwork
How current is the website content? ( i.e. Does the website include
information on this year’s game? Is information on team activity up to date?
Does the website appear to have been updated recently?)
0 1 2 3 4
How well does the website convey the team story? (i.e. What makes
this team unique? ) 0 1 2 3 4 - Looks updated reason for "3" is old blog posts
How well does the website recognize the team sponsors, mentors
and volunteers?
0 1 2 3 4 - Recognize your mentors specialties. (only two mentors?) There is a small typo on the sponsors page - "thankyou mentors"
To what extent does the website support other FIRST teams? (i.e.
Are there links to other resources? Does the team share resources they
developed themselves?)
0 1 2 3 4 - Find something your team would be willing to share possibly? Website creation tips?
How well is the website content written? (i.e. Is information presented
in a clear, readable manner? Does it contain very few (preferably zero)
grammar, punctuation or spelling errors? )
0 1 2 3 4
FUNCTIONALITY
How well does the site function? (i.e. Do pages load quickly and
completely? Do all links work?) 0 1 2 3 4 - Assuming all of your features will be running by your regional
How extensive is the website’s use of multimedia? ( i.e. Does the
website contain music, sound, animation, or video relevant to FIRST? Does
the website use newer web technologies in a beneficial way?)
0 1 2 3 4 - google calendar, team portal
How cross-browser compatible is the website? (i.e. Do all the
features work in all the major browsers (Internet Explorer, Firefox, Safari)? Is
the site useable with a mobile device? Can the website be viewed with a
1024x768 screen?)
0 1 2 3 4 - Tested IE, Chrome, Safari, Ipad - old IE doesnt work, current IE flawless
How much of the website design is original to the team? (i.e. Did
the team do any custom coding?) 0 1 2 3 4 - There is even a video!
How much care was taken when designing the website with
regards to web standards such as valid HTML and CSS? ( i.e. Does
the site pass the W3Cmarkup validation service http://validator.w3.org/ )
0 1 2 3 4 - passed

DESIGN
How does the website look overall? Does it give a positive first
impression?
0 1 2 3 4 - very clean
How inviting is the site to potential visitors? (i.e. Does the site speak
to all of its audiences -students, parents, mentors, sponsors, volunteers, plus
people who have never heard of FIRST?)
0 1 2 3 4
How easily can a new user navigate the website? (i.e. Is there a
clear method of navigation? Are menu items clear? Are there too many menu
items? )
0 1 2 3 4 tabs + sitemap good
How reader friendly is the website? ( i.e.  Does the font size and format
make the site easy to read? Is consistent formatting used throughout the
site?)
0 1 2 3 4
How engaging is the website? (i.e. Does it encourage exploration?
Does it make you want to return or recommend it to a friend?) 0 1 2 3 4
How well does the website give a sense of team identity? 0 1 2 3 4
How does the website handle distribution of information to team
members? (i.e. Are meeting times and locations visible to all visitors or is
there a private section? Does the public section of the website include
personal posts to or from team members?)
0 1 2 3 4 - just get your team portal working!
EXTRA CREDIT No Yes Emphatic
ally Yes
Did the team include anything in their website that would merit
extra credit?
0 2 4 - Team blog + upcoming team portal
Is the website handicap accessible? (i.e. Can a blind user with a
screen reader get information from the website? Will a deaf user miss
important information? http://www.cynthiasays.com)
0 2 4  - Not sure
PENALTIES - (No Penalties)

This website is one of the best I've seen from a FIRST team. Once more content is uploaded and your team portal is implemented your site will be even more amazing. The only problem - the google calendar doesnt seem to scale properly on mobile devices, but it doesnt end up covering any content.

[Dustin Shadbolt]

Overall a great website! Awesome layout and design. I enjoyed the videos on the website creation and all of that .

[shawn.schwartz]

Thank you everyone for all of the feedback! You guys are really helping to make our website the best that it can be. We are still continuing to make the final touches to it, so our final website layout should be online soon. The final layout will include a media query for mobile devices. I will make a post when our final design is online, so you guys can critique it if you like.

Thank you very much, Gigakaiser, for the useful graded website criteria. I would greatly appreciate it if anyone else wants to judge our website, because we can use as much feedback as we can get.

Also, has anyone made any adjustments to the DD Accordion menu script, so that it can fully function in Chrome? Please post if you guys have.

Thank you guys again for everything!

[Alex2614]

I did a quick glance-around at the site, and I was thoroughly impressed. While not a programmer or coder or anything like that, I do a lot with team image and branding. Let me just say that you have done a fantastic job and that this is one of the best FIRST team sites I have seen recently.

It was very clean, well-organized, and easy to navigate. Your brand and image was very clear and themed throughout the site.

That being said, I think the homepage is a little bland. Maybe start with the "about the team" section instead of "about FIRST." While FIRST is a very important and prominant section in all FIRST team websites (or, at least, it should be), I think that if you want to grap people's attention to your TEAM and your program, you need to catch them at the top of the site. Then, you explain about FIRST and everything else. Explain who YOU are, then who you are a part of. Just to clarify, if you were building a website about yourself and your life, you wouldn't put Team4Element at the very top.


That's just my $0.02. I hope I was at least somewhat helpful