View Full Version : Web and Graphic Design Company

06-27-2004, 04:42 AM
Hello to all,

I've been reluctant to come and put up my site "proto-type" for review out of blatant and knuckle clenching fear. But, I guess some feedback would be nice from those who know what they're talking about. So, if you feel inclined to do so, bash it - then again I'm not encouraging it. None the less let me know your thoughts - I'm sure we all know how to be polite anyways. In other words if you're going to slit my throat - use a clean blade - no rusty ones please. ;)

I'll listen to anything you wanna say - code, design, etc.

Note: This is a prototype (to mention once more). It's a single page test to make sure things are trimmed and nicely polished before I go gung-ho adding content and features.

Have at it!

Northern Hybrid Studios (http://www.northernhybrid.com)

*immediately flees from the computer to cover thine self from the ensuing barrage of flaming data wads being catapulted by the angry mob of coders and designers carrying their modem-forks and USB torches*

06-27-2004, 05:52 AM
What are you running for? It looks great! :)
Only thing I noticed right away was the missing alt tags on your images - you have to make stuff like that a habit.

run your stuff through the w3c validators HTML (http://validator.w3.org/), CSS (http://jigsaw.w3.org/css-validator/) to see some basic coding issues.

I would say its a good site - just need to upgrade to xhtml :D

06-27-2004, 06:13 AM
Oh yes - many thanks for the reminder on the alt tags. It's definitely a habit more then anything else. And XHTML is what I plan on going to shortly - just gotta read up some more on it to make sure I don't mess things up. (There's my fear again - even though I know quite well on what I need to do *chuckles*)

As for the validators... I shall go and read what they bring up right now. I know the IE box model hack I put in will bring up some errors with the doctype I'm using for now but hopefully I can work that out soon in addition.

And... thanks! BTW - Running is natural to me it seems. I never like to be around when someone else views my personal work... or it could be my lack of self esteem... ah well... either one works! :rolleyes: :p

A side note - I plan on putting the footer into a PHP include (as well as whatever other parts seem neccessary)... but I have to learn PHP first (boy don't I sound prepared ;)). And the first step I have to take is setting up a local web-server (which is what I'm doing as I type this) :thumbsup:

06-27-2004, 06:43 AM
Wow :thumbsup: Good job on the design it looks nice but it could use a couple tweaks under the hood. The links for the services, portfolio, etc. should be in a list, the same goes for the links at the bottom. A good article on doing that sort of stuff is on A List Apart: http://www.alistapart.com/articles/taminglists/ You might want to also add titles to the menu links as well.

Okay now with the way you did your main body text area.... it isn't well semantical and you can trim down the code. You didn't actually use paragraph tags around the different paragraphs, and you used a span for the title. Use a div and wrap your content area up instead of the paragraph tag.

So it would look a little more like:

<div class="content"> <h1>Artistically Envisioned. Boundlessly
Designed.</h1> <img src="/graphics/nhstextbackmid.gif" width="437" height="5" align="left">

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Call it a harsh reality - but it's a fact
that getting exactly what you want is a rare occurrence. That's why we here
at Northern Hybrid Studios are focused on delivering professional web and
graphic design products which exceed all your expectations and give you the
joy of receiving precisely what you want. We guarantee complete satisfaction.
So that by the end of the process you'll have enjoyed your experience with
us as much as we always enjoy seeing our clients' projects come to life successfully.
Be it as they leave our studios and make their way to the front-lines of the
internet, grace the pages of brochures or render their presence in many other
business and personal mediums.
&nbsp;&nbsp;&nbsp; But why stop there? Why settle for just design? Northern
Hybrid Studios provides not only top quality original work but unique identity
and presence development sure to make your company stand out in the crowd
as a reflection of your efforts and dedication to be the best and offer the
best in service - just as we do.
&nbsp;&nbsp;&nbsp; Want to know more about what we can do for you? Visit our
'Services' page to see full coverage on what we have to offer. We also encourage
you to call or email us with any questions you may have. If you are wondering
if we can handle your next project don't hesitate to ask. Chances are - we
can do it. Visit the 'Contact' page for more information on getting in touch
with us.

Now onto the footer, perhaps you should make that div with the class of "footer" just a <p> and then tweak your css. So the HTML would look like:

<div id="footer"><img src="/graphics/nhsfootertop.gif" width="472" height="1" align="right">
<a href="#">Home</a> | <a href="#">Contact</a> | <a href="#">About Us</a>
| <a href="#">Services</a> | <a href="#">Portfolio</a> | <a href="#">Forums</a>
| <a href="#">Downloads</a> | <a href="#">Store</a><br>

All Images and Site Content 2004 - Northern Hybrid Studios<br>
<a href="http://www.northernhybrid.com">http://www.northernhybrid.com</a>
| <a href="mailto:info@northernhybrid.com">info@northernhybrid.com</a> </p>

Of course this is still without changing those links into an unordered list, but you can do that easily enough. ;)

And then your altered CSS:

#footer {
width: 779px;
height: 95px;
background-image: url(graphics/nhsfooterback.gif);
position: relative;
margin: 0 auto;
padding: 0;
margin-top: -20px;
#footer p {
font-size: 0.75em;
padding-left: 315px;
padding-top: 10px;
padding-bottom: 10px;
padding-right: 10px;
text-align: center;
color: #666666; }

There might be a couple other things I missed but those should get you going in the right direction. And like cg9com said, move it to XHTML :) and you have nothing to run from. ;)

06-27-2004, 06:57 AM
Excellent, excellent. *feels fear slowly fading* I'm glad I posted this for review. I can learn better design techniques and improve my site at the same time.

Oracleguy - your changes have been noted (literally) and I'm going to take a look at them as soon. Thanks for the compliment as well. They're both appreciated. :)

I think I was especially scared to show this because I spent a good amount of time, effort and frustration on it and was afraid someone may lead me on to think I needed to redo the whole site. Thankfully, from the ways things are going, that more then likely won't happen...

Update: Just finished downloading Apache. Time to install and grab PHP and MySQL.

06-27-2004, 07:05 AM
Update: Just finished downloading Apache. Time to install and grab PHP and MySQL.

If you are doing that, have you seen this (http://www.codingforums.com/showthread.php?t=3992)? It may make things easier for you.

06-27-2004, 08:07 AM
Wow :). Thanks for that link. I'm downloading the bundle right now. Thanks so much. I did not realize it would be a pain to setup properly. This will surely save a good slice of my sanity. :thumbsup:

06-27-2004, 09:34 AM
The only thing I didn't like in the look of it, was that the menus were kinda hidden... It took me a while to find them. But otherwise thats one hell of a nice site :)

06-27-2004, 05:44 PM
Hmmm... so you're saying that I should make the buttons look more like buttons then? I know the rollovers load last and without the rollovers I can see how they may not seem like much. I'll look into that. :thumbsup:

06-28-2004, 12:53 AM
I dig the site -- and this is from a deisgner, not a coder so to speak:) -- my only 'visual' gripe is the left column -- though it is an interesting design, it visually takes the viewers attention to it -- not only it's structure, but it's placement. I find I look at this first, and your content second -- which would cause a user problem. suggestions:
Maybe flip that column to the right, giving it a second presense to the main content. At the moment, it feels it gets the head attention.
Maybe remove the 'hard' stroke you have in the cutout (flower+organic/cross structure) and lighten the darkened gray gradient? Though white usually grabs attention first, it's strenght in gray pulls your attention from right to left -- try flipping the gradient.

I think the site looks fantastic, and you're showing off your designer skills excellent! I'd just would want you to work the form+function into it better, if you were a designer on my team -- and I think you'd excell more as a company by focusing your viewers to your content first, and making sure they get that attention. It's a common problem in ads -- as you have the gradient dark to light (right to left) and that strong element on the left side, it pulls your readers eyes to the left -- away from your content! Flip that gradient or encase that content -- just like you would do for a movie poster or advertisement (where all the people's faces would eventually force you into the realm of the content, or the color and flow of text/imagery would force the eyes of the reader into the meat of the sandwich). That's all I would recommend, and I think it would be useful to play with it only on that area.

If you change anything else, I would be pissed:) :thumbsup:

06-28-2004, 01:40 AM
What great advice. Thanks so much bradyj. I never looked at it that way particularily. And since yes, I'm going to start my company soon, your post was extra useful. I swear - once this thread lives its life I'm going to print it and keep it for reference.

(BTW - bradyj - its good to hear of a designer who isn't caught up in themselves so much that they write off all others' work to the junk pile. My experiences with other designers have always been very aggressive and usually ended in being insulted. What a refreshing change. :thumbsup: )

06-28-2004, 02:16 AM
What great advice. Thanks so much bradyj. I never looked at it that way particularily. And since yes, I'm going to start my company soon, your post was extra useful. I swear - once this thread lives its life I'm going to print it and keep it for reference.

(BTW - bradyj - its good to hear of a designer who isn't caught up in themselves so much that they write off all others' work to the junk pile. My experiences with other designers have always been very aggressive and usually ended in being insulted. What a refreshing change. :thumbsup: )

Glad I could help:) I find most of that is from certian colleges and workplaces -- I've met many designers from Industrial Light and Magic out here, and many of them are major @@@#&$les to the point that I'd never work for that company -- and many schools teach you to bash (cough, Berkeley). But I oversee a design department now, and I've seen both ends of the spectrum -- many of my designs were crap, and not perfect by far (goes with the business)... but I've had people there who did not attack me, they gave me constructive criticism and pointers. I view it as the same -- be a coach not a tyrant, and you not only make good friends, but also good mentors and good people who you can help, and be helped along the way. It's the only way my career has advanced as fast as it did:)... so I'm glad you didn't take it as negative, but as help, as it was meant :thumbsup:

06-28-2004, 06:22 PM
Very nice, Ember~Daze. I like the way the eye in the lefthand image is looking towards the main content of the page.

The only things that I find slightly wanting:

The large blank area on the left as one scrolls down the page. Do you plan to have text there? If so, then never mind....

I wonder also if it might be a good idea to make the width of the "latest projects" and "Artistically Envisioned. Boundlessly Designed." boxes the same.

If you didn't plan to have anything below that very nice image in the left column, perhaps you could somehow resize the "latest projects" box and then clear everything to make the "Artistically Envisioned. Boundlessly Designed." box the full width of the page. This might not work at all, of course... it's just a thought.

The white hover links on the footer are very difficult to see against the grey.

06-28-2004, 07:18 PM
Thank-you llizard. It seems the space on the left is a growing concern from others I spoken to as well. I'm currently giving it some thought and will probably end up putting some content underneath it :) As for the Latest Projects box and the content box it wouldn't be much trouble to resize them to the same... I'm going to give it a try and see how it looks.

Thanks for the input. Noted and appreciated as always :)

Side Note: I've gotten my home testing server setup finally and all working (Apache, PHP, Perl, MySQL). I decided to do it manually and it ended up taking a while but I did learn a lot. I tested each component and then installed PHPBB2 to test the MySQL and everything seems to be tip top. Now I can learn some PHP and try to incorporate some includes into my code for a template feel.


07-01-2004, 05:47 PM
Server-side includes are like that gift that keeps on giving. :) Make sure you post your website once it is completed in the examples of XHTML & CSS based websites (http://www.codingforums.com/showthread.php?t=23475) thread. :thumbsup:

07-01-2004, 07:13 PM
I shall not neglect to do so. Although it may be some time before I can. I've printed off this thread and marked down all the changes to be made. But unfortunately - due to time restraints - most of the changes have to be put on the future revisions list. BUT - as soon as I'm done the site and have it up so I can start my business I'm sure that's when I'll start making the minor changes. Right now I have to get the site up and so far I'm about 2/3 done the content. Hopefully I'll get some time soon to make the changes.

Small ones I did already...

- Switched the left column gradient to fade to white moving left to right.
- Changed the footer a:hover color to black instead of white.
- Added a bunch more content and formatting

(check the site in the near future if you'd like to join the forums as well - the more the merrier)

And now... my official thanks to everyone who has reviewed my site. This turned out to be a positive and encouraging experience. You all deserve recognition for your great replies. *bows courteously* It has meant a lot to me.

Being 17 years old I find it hard to get much support for what I pursue. And I always take negative comments hard. I'm fresh meat in the whole scheme of things. Thanks for not burning me. :thumbsup: :)

You're all awesome and stand in high respects in my mind.

07-01-2004, 07:50 PM
Hey, it's like software -- this is version 1.0 -- believe my, my website is somewhere at 5.19 something -- I'm glad to see we could help and your pursuing what you like... many people give up.

780 area code, canada? I'll keep a look on your website in the future:)

07-02-2004, 03:03 AM
Very nice, tasteful :cool:
1. The gradient to the left is still very overpowering - perhaps start it at a lighter grey?
2. The footer and bottom of content looks incomplete - I'd like to see the bottom of the content get the same bevel/rounded corners treatment as the top. Also, the footer would look good if it was in a similar box to the "latest projects". Of course, the box would have to be fluid to allow different height content (text re-sizing by the user), as would the content box.

If you want to go ahead with suggestion number two and get stuck on any part of it, PM me and I'll walk you through it.


07-15-2004, 07:09 AM
Well, not to ressurect a dead and gone thread - but I thought it may be worth it to let you all know I have "finished" the site (but not yet implemented all of your thoughts and ideas) and would be happy to hear some color/graphic feedback on the forums which were the last component to the site. You know I'll take it seriously (for I did HONESTLY print out a couple copies of this thread to keep for future revisions - most of which I'm going to do). :)

Anyways - please give it a look. I've also added seperate images near the header of each content page of the site you may be interested in seeing. Let me hear your thoughts - and if you wish too - join the forums - I could use some fuel to start the engine moving.

Thanks so much. :thumbsup:

07-15-2004, 03:57 PM
would be happy to hear some color/graphic feedback on the forums which were the last component to the site.

looked at site with 800x600 and 1024x768 resolutions

It really is a quite pleasing site, Ember~Daze, especially at 800x600 resolution. (It's too bad that all the divs have to have fixed pixel widths instead of relative ones - but I can see why you have done it - however, it means that there are very large areas to left and right of your content when the page is viewed at resolutions higher than 800x600)

There are only three things that niggle - and they are only very slight niggles:

The outer border areas beyond the divs:
It might be a good idea to put body {background:#fff;[...] in your stylesheet so that the rounded off white corner at the top right side continues with white. To see what I mean, set your resolution to 1024x768 and set your default background colour to something other than white to see what appears. I have the default set to grey, which works okay with your site. But I can well imagine that some people's default background colours might clash with the red/grey you have chosen.

The blank space at the bottom of the left banner:
I wonder if you could extend nhssilhouette2.jpg somehow - not by making the image longer but by taking an element (such as the cross or possibly a small curvy line) and placing single elements at gradated spots down the banner.

The two tone red and grey:
I must say I really do like the colour scheme. However, I'm wondering if a small touch of a contrasting colour might work (doesn't hurt to try) Here's an idea that may or may not be viable: On the home page, change the colour the "home" name in the menu. Let's say someone hits the link to "Services". On the services page only, change the colour the "services" name in the menu. The link to "Home" would revert to being the colour of the rest of the links. This will indicate to visitors that they are at that particular page.

I hope that all made sense!

07-15-2004, 07:11 PM
Indeed it did - thank-you! That was a couple things I would have never thought of. Good to hear new perspectives. :thumbsup: