...

View Full Version : Opinions of a Web site for Class/Business



JWGlenn
11-18-2002, 04:26 PM
I am currently taking a Web Page Design class, and as our final project, we must design a Web site that will be uploaded upon completion. Since I am going to be a Web Designer and eventually branch out into my own small business, I figured I would make the site my company site.

Anyway, I wanted to get some opinions from the masses here, and perhaps get some constructive criticism or critiques. :)

Here is the link: http://cwcafe.com/beta

It's nowhere near finished, but I thought I would show it "as is" for now, before I get too caught up in the design, and proceed to add content.

Catman
11-18-2002, 05:44 PM
Well, there's a slight problem with your background image when viewed in IE 6.0:

http://www1.iastate.edu/~wsthune/images/screenshot.jpg

A little tweaking with styles should fix that (e.g., background : no-repeat).

And I find it curious that you choose to use just an image rather than HTML text over the image -- seems like that latter would be far easier to maintain with changes.

JWGlenn
11-18-2002, 05:51 PM
Well, that's odd, because I haven't seen that image repeat and I use IE 6.0 I guess I will have to add in that script, however, since you saw it.

The other thing about the text ... I can't add text w/o the (br)'s effecting the height of the table. That's why I choose to make it an image.

bcarl314
11-18-2002, 06:25 PM
That may help for layout, but if you're going into business for web design, you'll need to consider bandwidth. Having image based text will increase the download time for the page.

JWGlenn
11-18-2002, 06:28 PM
I completely agree, which is why I try to keep it minimal, but I am running into problems. I just wish when I entered text, the table cell(s) wouldn't expand. :mad:

brothercake
11-18-2002, 06:32 PM
The key is to design a layout such that it doesn't matter if it does.

bcarl314
11-18-2002, 06:32 PM
You could use div's and css.

JWGlenn
11-18-2002, 08:30 PM
Would that work with this table layout? :confused:

Majik_Dance
11-18-2002, 08:44 PM
Nice, clean site.

Just my opinion here tho (and heck, you asked for opinions :) ):

My first impression upon entering the site is the dull colors.

I like the light blue font color but the grey/silver font color kind of detracts from the blue.

And the grey/silver links at the bottom of the page are 'lost' against the background grey.

Personal impression tho.

JWGlenn
11-19-2002, 05:41 AM
That is intentional (re: color scheme). I looked at a lot of Web Design Firms' Web sites, and most of them had blacks and grays as their "backdrop" colors, with one standout color (in this case, light blue).

As for the text links on the bottom, that's for those who cannot use or see the javascript button links on the left.

But thanks for the input/comments. :)

ionsurge
11-19-2002, 12:18 PM
Try to make the table resize to the users res. It would make it much better. But seeing as you did use an image, I guess that would make it a bit harder to do. By the way, I dont really think that you would need to have a background image on that anyhow.

Also, for a cafe style website, black/grey/blue would not be suitable for such a business. Try to make it lighter.



Ionsurge.

me'
11-19-2002, 09:15 PM
yeh...

The white image-text thingy looks odd against the background - I would change it. Oh, and use text, not an image. The roll-over graphics work well, I liked the animation at the start but consider changing your colour scheme. Try this program - www.colourschemer.com

whammy
11-20-2002, 12:55 AM
The rollover buttons occasionally don't load the onmouseout graphics (as you can see in the screenshot).

JWGlenn
11-20-2002, 01:47 AM
Originally posted by me'
yeh...

The white image-text thingy looks odd against the background - I would change it. Oh, and use text, not an image. The roll-over graphics work well, I liked the animation at the start but consider changing your colour scheme. Try this program - www.colourschemer.com

That site is for home decor. ;)

JWGlenn
11-20-2002, 01:47 AM
Originally posted by whammy
The rollover buttons occasionally don't load the onmouseout graphics (as you can see in the screenshot).

Yeah, I have noticed that. I don't know how to fix it, since it isn't 100% of the time. Any suggestions?

whammy
11-20-2002, 01:48 AM
ROFLMAO... you're right. I think he meant:

http://www.colorschemer.com/online

You know how those brits are with their misspelling of words... like "colour" instead of "color". ;)

whammy
11-20-2002, 01:50 AM
I'll have a look at it when I get a chance, but it seems weird since half the time it works and the other half it doesn't.

ionsurge
11-20-2002, 10:19 AM
Originally posted by whammy

You know how those brits are with their misspelling of words... like "colour" instead of "color". ;)

That is a surprise coming from a mod.. ;)



Ionsurge.

whammy
11-20-2002, 02:02 PM
And it was in jest, of course. I think I'm quite outnumbered here. hehe

beetle
11-20-2002, 06:04 PM
Ok, I'm going to be honest, and perhaps a bit harsh. I don't mean to be, this is ALL constructive criticism. In no particular order The beveling and embossing has GOT to go. It's very passé, and IMHO, ugly
I'm not crazy about the 'This is your IBM-AT' font.
Like others have said. Copy-text as images, NO. You are trying to treat the web like a printed page, and it's not. Text needs to flow and resize (for those that have vision impairments). There are many other things wrong with this approach, rather than list them all, take my word for it and don't do it.
The white-text on the gray buttons is harder to read than it should be.
The java applet on the front page is a bit tired, but could look better with a nicer pic of Chi-town (I used to live there, it is a MUCH nicer looking city than that...) and be acceptable
Your rollover images aren't being preloaded at all.
The javascript reeks of cut'n'paste, but I understand that if you don't know any JS. The problem with that is if you keep it up, you will invariably have conflicts (/showthread.php?s=&threadid=8858)
No document-type-declaration
No META data
Deprecated HTML (<center>, <font>, etc)
Sparse use of CSSThose last 4 are kinda nitpicky, but for an individual who wishes to do this as a profession needs to be aware of these things. You are starting 'late in the game' into the web arena, as things move fast here. You need to learn what is current, and not what was current over a year ago (or longer)

redhead
11-20-2002, 06:11 PM
my immediate impression of your site is positive, but perhaps consider altering the borders on your table.

where two cells are against each other the border doubles in thickness (because its two borders not one), so perhaps use <td style="border-left-width: 0px"> or right or bottom or top depending on which edge needs no border...

i would also prefer text instead of an image... but seeming as you are only using images: why not just change the source of that image instead of making many differant pages? eg... with your links:

<a href="#" onclick="document.mainimagename.src='otherimage.jpg'; return false">

as for "colour": who spelt it wrong? ;)

JWGlenn
11-21-2002, 02:38 AM
Originally posted by beetle
Ok, I'm going to be honest, and perhaps a bit harsh. I don't mean to be, this is ALL constructive criticism. In no particular order The beveling and embossing has GOT to go. It's very passé, and IMHO, ugly
I'm not crazy about the 'This is your IBM-AT' font.
Like others have said. Copy-text as images, NO. You are trying to treat the web like a printed page, and it's not. Text needs to flow and resize (for those that have vision impairments). There are many other things wrong with this approach, rather than list them all, take my word for it and don't do it.
The white-text on the gray buttons is harder to read than it should be.
The java applet on the front page is a bit tired, but could look better with a nicer pic of Chi-town (I used to live there, it is a MUCH nicer looking city than that...) and be acceptable
Your rollover images aren't being preloaded at all.
The javascript reeks of cut'n'paste, but I understand that if you don't know any JS. The problem with that is if you keep it up, you will invariably have conflicts (/showthread.php?s=&threadid=8858)
No document-type-declaration
No META data
Deprecated HTML (<center>, <font>, etc)
Sparse use of CSSThose last 4 are kinda nitpicky, but for an individual who wishes to do this as a profession needs to be aware of these things. You are starting 'late in the game' into the web arena, as things move fast here. You need to learn what is current, and not what was current over a year ago (or longer)

(a) I learned Beveling and Embossing in Photoshop/ImageReady in class, and I thought it looked cool.

(b) By "IBM-AT" font, I assume you're referring to the "Chicago Web Café" title logo?

(c) I am going to get rid of the text-image factor.

(d) I don't have a problem reading the buttons, but I guess I need to design for my audience. :)

(e) About the applet: The sky effect was another technique I learned in Photoshop. The original picture looks better. It is hard to obtain a quality photo of a Chicago Skyline w/o paying big bucks for it, esp. when I'm not a professional photographer. ;)

(f) The rollover images are problematic, I agree.

(g) Yes, I CnP all javascript, because I'm not a programmer.

(h-i-j) I will be implementing these changes soon.

(k) I am not familiar enough with CSS to use them properly.

Now, having said all that, I will probably look to either change my color scheme, or re-design entirely. However, I don't have a lot of time to do this in, because my site is due for class on Dec. 13th.

whammy
11-21-2002, 02:47 AM
I'm very impressed at how well you took the criticism.

Beetle definitely knows what he's talking about, for one. I'm usually hesitant to post my opinions as straightforward as he did (although I did it tonight a couple of times, in the same manner), because sometimes people that don't really want to learn anything misconstrue your intentions. ;)

I wouldn't bother making any changes that aren't required for your class, unless you wish to do so... because it's likely from my experience if you're dealing with basic HTML, etc. that you perhaps know more than the teacher... but I wouldn't bet on it unless you are sure. :)

JWGlenn
11-21-2002, 02:54 AM
It's a double-edged sword. This will be my final presentation for class, but at the same time, it'll be my Web site for my design company. I was hoping that by using it for class, I'd have a set deadline to finish by. But now... :eek:

I should probably trash this design altogether, and start anew... This page grew from a simple template, that I retooled over time. I guess if I want it to be my own site, it should feature my own design.

:confused:

whammy
11-21-2002, 03:04 AM
What you just said. ;) Do whatever it takes to pass the class, but you have to take pride in your work (which I'm sure you do!).

Right now I'm making pretty good money, but I am dealing with data on a very basic level pretty much. Just make yourself happy (especially if you are aware of what's going on in your business), and success may just follow.

JWGlenn
11-21-2002, 03:10 AM
Thanks for the tips and words of encouragement, Whammy. :) Once I have a updated site in place, I'll be sure to post it here.

beetle
11-21-2002, 03:40 AM
Allow to follow up on my post here.

First of all, thanks to Whammy for the vote of confidence in my knowledge and abilities ;)

JWGlenn. I'm glad you took the things I said in the appropriate context. I genuinely hope they help you on your journey. I never really received any direct advice when I started in this profession, and there are some things I wish I didn't have to learn the hard way (or the long way). During my time in this business I have made $300 sites to $50,000 sites. I've had a hand in no less than 150 individual projects. I've done design, animation, flash, (X)HTML, video editing, javascript programming, PHP programming, database work, and innumerable other tasks like copy-editing, managing client expectations, budget calculations, server admin, project management and the whole billing cycle. So, please trust in the fact that my comments come from my experience as much as they do from my opinion. At this point in my career, I'm my own boss :D

I too, think it's best to do what your class requires, then step it up for your own project. Oh, and best get crackin! I may be your competition in a couple years! (Yes, I'm thinking about moving back to the Windy City....I miss it up there :))

Cheers :D

ionsurge
11-21-2002, 11:06 AM
*bows down to beetles wisdom*

Wow, you have done a lot... and I must say, your site is pretty impressive.


Ionsurge.

Majik_Dance
11-21-2002, 06:48 PM
I would like to throw in something here as a personal observation.

I have been following this thread closely due to the fact that I can relate to JWGlenn in some ways. I have relatively limited programming knowledge and experience (especially in comparison with others in this forum) yet that has never stopped me from learning and trying to do things better.

I feel that if someone who has more knowledge and/or experience can offer a helping hand, a few words of encouragement (or constructive criticism) along the way, it would be unwise to ignore them. Is that not the point of this whole forum?

Everyone has to learn somehow and it is from our mistakes that we tend to learn the most.

I tip my hat to beetle for taking the time to post his reply and to JWGlenn for taking it as it was intended; the advice and help from someone who has been there and perhaps still has the scars to show for it.

Great group of people in this forum. You continue to impress me.

:thumbsup:

JWGlenn
11-21-2002, 11:52 PM
Here is something I toyed with today. I know I still need to add the appropriate META tags, but I was just focusing on design and layout today.

What does everyone think?

http://cwcafe.com/beta/index2.html

beetle
11-22-2002, 12:18 AM
Hey! Leaps and bounds better! The Chicago pic looks better now (I'll post some links to ones I found that I like at the bottom). The Text on the buttons are a big small, but overall much nicer looking. Perhaps a bit flat, but I trust that you can evolve this design. The balance feels a BIT funny when the page is real wide...maybe consider making this a static width.

Photos
http://www.cag.lcs.mit.edu/~diego/images/me/chicago.jpg (good perspective, bad picture)
http://images.webshots.com/ProThumbs/6/20606_wallpaper280.jpg (good photo, but small and and a nightshot)

Not a skyline per se, but a cool pic I found while I was looking...
http://www.eg.bucknell.edu/~hyde/dan/SanDiego/Jpegs/196ChicagoSkyline.5.JPG

Yessir, a hard photo to find indeed...:(

whammy
11-22-2002, 01:04 AM
That is at least 300% better (if not more). :)

I like the design. The layout is nice, the colors go together well, etc.

The ONLY thing I might do is stick a bit of whitespace around your text on the left so it doesn't butt up against the applet.

I think that might make it look better on wide displays as well... and perhaps may also fix what beetle described above.

Whitespace = easier to read text ;)

That can be accomplished with <blockquote></blockquote> tags rather easily. :D

JWGlenn
11-22-2002, 01:47 AM
Originally posted by beetle
Hey! Leaps and bounds better! The Chicago pic looks better now (I'll post some links to ones I found that I like at the bottom). The Text on the buttons are a big small, but overall much nicer looking. Perhaps a bit flat, but I trust that you can evolve this design. The balance feels a BIT funny when the page is real wide...maybe consider making this a static width.

Photos
http://www.cag.lcs.mit.edu/~diego/images/me/chicago.jpg (good perspective, bad picture)
http://images.webshots.com/ProThumbs/6/20606_wallpaper280.jpg (good photo, but small and and a nightshot)

Not a skyline per se, but a cool pic I found while I was looking...
http://www.eg.bucknell.edu/~hyde/dan/SanDiego/Jpegs/196ChicagoSkyline.5.JPG

Yessir, a hard photo to find indeed...:(

beetle,

Thanks for the comments. :)
Unfortunately, I'd have to get permission for those photos. I originally had used the one from Webshots, but it'd cost $$$ to use it. So, I took my own photos. :) Not great, but they're my own. :)

whammy
11-22-2002, 01:59 AM
You didn't read mine? :(

I think that would be a very slight, but noticeable improvement in the layout. :D

JWGlenn
11-22-2002, 02:33 AM
Originally posted by whammy
You didn't read mine? :(

I think that would be a very slight, but noticeable improvement in the layout. :D

whammy,

Don't feel bad, I was going to implement your change first, but I just got home and had dinner. ;) So... as soon as the heat kicks in and my fingers defrost, I'll start coding again. :cool:

whammy
11-22-2002, 02:36 AM
I don't feel bad, I just thought it might fix the only thing wrong with your layout that I saw...

Other than the words butting up against the applet, you'd have to get really nitpicky, IMHO. :) Let's see how it looks. ;)

JWGlenn
11-22-2002, 02:59 AM
Originally posted by whammy
Let's see how it looks. ;)

Okay ... you are right -- much better:

http://cwcafe.com/beta/index2.html

Any other suggestions?

:thumbsup:

whammy
11-22-2002, 03:02 AM
yeah, that's about what I thought it would do. cool.

beetle
11-22-2002, 03:20 AM
Yes, definitely less awkward than before.

ionsurge
11-22-2002, 10:29 AM
This thread has been a great read, it seems so Soap-Opera-Like, hehe.



Ionsurge.

JWGlenn
11-22-2002, 02:36 PM
Originally posted by ionsurge
This thread has been a great read, it seems so Soap-Opera-Like, hehe.



Ionsurge.

What? You didn't feel like adding to the drama? :D

redhead
11-22-2002, 03:37 PM
that looks much better - well done... although your flash menu isnt quite right next to the edge of the window

Vladdy
11-22-2002, 03:37 PM
I figured I pitch in (at least for a new plot twist ;) )

First, your applet may not work with all the browsers, I can not see it on my laptop (win98, IE5.5). The rippling water effect is cheesy and does nothing but give the site an "amaturish" feeling (IMHO). Further more it is distracting from the page content. Go with a simple picture.

Navigation menu can be implemented just the same with plane css!!! Lose the flash - many do not have it and even more choose not to install it so they are not bothered by all the embedded ads. Then you can use the bottom for copyright notice and such.

640 resolution (narrow browser window) makes page look awkward. (see attached pic). At least have the picture aligned on top of the cell. Better yet, have it scale with the page. Even better to have it float to the right, so when the browser window is narrow the picture jumps below the content.

Go away with the "To see our entire list of services, just click the Services link." Put links to the related pages within the text instead.

Get your HTML code up to date: <font> is depreciated, align attribute should be moved in the style declaration, get the DOCTYPE and see if you can get through validation.

;) ... and you thought beetle was rough on you, huh? ... ;)

JWGlenn
11-22-2002, 07:55 PM
Originally posted by Vladdy
I figured I pitch in (at least for a new plot twist ;) )

First, your applet may not work with all the browsers, I can not see it on my laptop (win98, IE5.5). The rippling water effect is cheesy and does nothing but give the site an "amaturish" feeling (IMHO). Further more it is distracting from the page content. Go with a simple picture.

I agree. I just had used that applet since the very early stages of my Web site, and just thought there would always be a place for it. However, I agree that it does make it look slightly less professional.


Navigation menu can be implemented just the same with plane css!!! Lose the flash - many do not have it and even more choose not to install it so they are not bothered by all the embedded ads. Then you can use the bottom for copyright notice and such.

I'm not that familiar with CSS to get a similiar navigation menu, but if you're willing to give me some tips, I'd be glad to learn. :)


640 resolution (narrow browser window) makes page look awkward. (see attached pic). At least have the picture aligned on top of the cell. Better yet, have it scale with the page. Even better to have it float to the right, so when the browser window is narrow the picture jumps below the content.

Eh ... I hate 640x480 monitors. Yes, I know I should design for those who still view with them. I'm having difficulty remembering how to make the picture align at the top within a table cell, but as soon as I leave work, and look at my book, I should figure it out. ;) How would you "float" a picture?


Go away with the "To see our entire list of services, just click the Services link." Put links to the related pages within the text instead.

Wouldn't that be too many links within the text, let alone the page itself?


Get your HTML code up to date: <font> is depreciated, align attribute should be moved in the style declaration, get the DOCTYPE and see if you can get through validation.

Again, I'm not too familiar with the up-to-date CSS version for <font>, but again ... if you'd be willing to give a tip or two, I'd be willing to listen and learn. ;)


;) ... and you thought beetle was rough on you, huh? ... ;)

Rough, schmough... I need all the 'tough love' ... er... assistance I can get. :D I appreciate everyone's tips and suggestions! Thanks again.

beetle
11-22-2002, 08:25 PM
Any decent HTML book published in the last 3-4 years should cover basic CSS. In fact, my first HTML book did, and I'm not sure why but I had the (fortunate) foresight to skip all the chapters dealing with font tags and such, and skip straight to the CSS.

Ah yes, I remember, it was the older version of this book (http://www.amazon.com/exec/obidos/ASIN/0321130073/qid=1037992990/sr=2-1/ref=sr_2_1/103-0385507-6635022) which I'm sure is hard to find. Besides, you really wouldn't want it anyway. I first opened it's pages 2.5 years ago, and FONT and CENTER were deprecated then.

whammy
11-23-2002, 12:43 AM
If you truly want to get your HTML up to date, check out:

http://www.w3schools.com/xhtml

I'm coding all my new pages in XHTML, it's not too hard. :D



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum