Web hosting business templ. (deadline: 2003-01-28)

[Eirik]

(Admin Code added by Palmer - 9244358)


Hi guys,

After having run a design contest for our logo (http://www.designoutpost.com/forums/?showtopic=2383&st=0), I’m back in need of a template design for our web site. Here are the specs.


PRIZE: $ 200
DEADLINE: 2003-01-28

Translations of Norwegian names and terms are provided in parantheses.


SPECIAL REQUESTS

I’ve received several contributions for past contests which haven’t followed the guidelines that I’ve described in my original post. So I ask that you please read this post carefully and encapsulate all the guidelines in your contributions. Thanks in advance !


PROJECT DESCRIPTION

The company for which you will be providing the web site template, is called “Nethosting”, and will be providing web hosting solutions to the Norwegian market. The company slogan is “webhotell for den kresne” (webhotel for the picky) to state that our support, stability and security lives up to the client’s high expectations.


TARGET AUDIENCE

The target audience will be Norwegian companies in need of web hosting solutions. It’s also likely that this isn’t their first encounter with a web host. Furthermore, we will provide an affiliate program for partners and advanced users.

To get across to the “picky” customer, we are looking for a professional and exclusive look.


PRODUCTS

Our products will consist of four different hosting packages (labeled Small, Medium, Large and X-Large), with different specs.


ELEMENTS

The basic layout og the template elements are illustrated at http://www.nethosting.no/.

<img src='http://www.netmaking.no/nethosting/screenshot.jpg' border='0' alt='user posted image' />

1. Logo (JPEG (http://www.netmaking.no/nethosting/logo.jpg) | EPS (http://www.netmaking.no/nethosting/nethosting_logo.eps))

2. Navigation menu including search box

3. 5 most recent news

4. Promotion of affiliate program

5. Search box to check domain availability

6. Client log in

7. Path information

8. Main content area

8.1. Text about Nethosting

8.2. Main Nethosting advantages (consider an image as background for this area)

8.3. – 8.6 Available hosting packages (consider different images as backgrounds for these areas)


Please note that placement of the elements are not final, but all elements need to be included in all contributions.


COLORS

Blue (as in the logo), orange, grey and black are prefered.


COMPETITORS

BK Media (http://www.bkmedia.no/)
Itpays (http://www.itpays.no/)
Uniweb (http://www.uniweb.no/)
Fastname (http://www.fastname.no/)


SCREEN RESOLUTION

The templates should be designed at a fixed width to suit screen resolutions of 800x600 and above.


FINISHED TEMPLATE

The winning designer will be asked to provide an HTML version of the template, with an accompanying, external CSS file. All formatting should be done with CSS, except for the placing of elements which should be done using tables.

In addition to the design of the main page, the winning designer will be asked to provide a design of the http://www.nethosting.no/index.php/produkter page. This will simply be the colors used for the table, as well as a “feature included” (V) and “feature not included” (X) icon.


Please don’t hesitate to ask if you have any further questions, and the best of luck !

[Eirik]

EPS version of logo added. Good luck !

[Eirik]

Hi guys,

Just wondering if anyone is working on a contribution for this contest. :D

Thanks in advance !

[Luc]

I wanted to but you require it in xhtml so I have to pass. Good luck!

[Eirik]

Hi Luc,

If that's what's holding you back, then don't worry about it. Since I'm a programmer myself, I'll be happy to code a quality design myself rather then receiving a poor design which validates. Ordinary HTML will be fine. I've also changed my initial post to reflect this.

If there's anything else in my initial post that might be putting you off from contributing, please don't hesitate to let me know!

[martincrumlish]

Hi Eirik,

Its been quite a while since I have entered a contest here (have been too busy at work!) but I will try to do some work for yours today.

Martin

[Eirik]

Hi Martin,

That's great! I really appreciate it.

[Luc]

Ok then expect an entry from me.

[Palmer]

Yes, if you require xhtml, only 2 of our designers can do that as far as I know.

[geofharries]

I honestly don't even know how to code with basic HTML and tables anymore...it's kind of sad if I consider that in the big picture. I have become a slave to the XHTML :look:

Sniff, goodbye <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">....it was good while it lasted :crying:

geof

[Anne]

I have a question. Isn't HTML and XHTML almost the same? If so it shouldn't be so difficult to code in XHTML

Differences (http://www.w3schools.com/xhtml/xhtml_html.asp)

[geofharries]

Basic XHTML is fairly similar to HTML 4+. But just like as folks learned to code pages that worked in both IE and Netscape, with all those empty spacer.gif's, nested tables, and font tags, learning XHTML takes a lot of patience and dedication to get it right. As with everything code-related, it is important to keep progressing, and keeping ahead of the curve.

The most important thing you can do is test in a multitude of browsers, including Mozilla, Opera 7 and if you can get your hands on Mac OS X, Safari. If you don't understand why a page element isn't lining up, or you think there's a bug with the browser, it's most likely your code, not the program. Valid XHTML demands good structure and forethought; the seperation of content from code which keeps the design flexible and easy to update. Validate with http://validator.w3.org/. If you get stuck, post a question at Sitepoint.com.

Evolt has a good article on Transitioning to XHTML:

http://evolt.org/article/The_XHTML_Transit...9953/index.html (http://evolt.org/article/The_XHTML_Transition_It_s_not_that_difficult/17/9953/index.html)

A List Apart has a couple of classic articles as well, laced with Zeldman's sarcasm:

http://www.alistapart.com/articles/betterliving/
http://www.alistapart.com/articles/netscape/
http://www.alistapart.com/articles/tohell/

-- end rant -- :)

geof

[Eirik]

Hi guys,

Seems like this thread soon will be more suitable for the Programming Outpost site. :D

Regarding XHTML/HTML: It's not a big deal for me whether I receive the finished design as a HTML file or a PSD if that makes any difference for those of you who are planning to enter. What I'm looking for is the design. The coding I'm able to do myself. I was just thinking I'd save myself some time, but it's not that important.

[JeremeDavid]

I guess I'll throw my hat in first.

I went for something very simple and flexible.

Nethosting.no (http://www.photoshoptutorials.org/samples/netHosting/)

The width is set at 750 pixels now but it will stretch to whatever you like.

[Eirik]

Hi Jereme,

Thanks for taking the time to contribute. Here are my thoughts on your first design:

The featured products should be visibly differentiated by more than just a colored strip (higher packages -> more appealing). Different images might be in order. I’m also open to images of people rather than server racks to represent the different packages. Also, each featured product needs a “More info” link.

In general, I would like to see some more white space as I feel that several of the sections are hard to separate visually (the use of colors might also help here). This escpecially applies between the client login and the top bar, as well as between the path and the client login and the main content area.

The “Why Choose Nethosting.no?” (BTW: use Nethosting instead of Nethosting.no throughout the design) box doesn’t seem to go with the rest of the design. The box is too rounded compared to the otherwise squared design.

Finally, I would like to see some more colors and/or graphics to make the design feel less clinical. I also think pictures of people would help reduce the clinical feel.

Thanks again, Jereme, and looking forward to your revision !

[Mark]

Hi Eirik,

I guess I came close designing your logo, so hopefully I'm closer with your webpage! :D

I look forward to your remarks.

Mark

[JeremeDavid]

<!--QuoteBegin-Eirik+Jan 19 2004, 03:15 AM--></div><table border='0' align='center' width='95%' cellpadding='3' cellspacing='1'><tr><td>QUOTE (Eirik @ Jan 19 2004, 03:15 AM)</td></tr><tr><td id='QUOTE'><!--QuoteEBegin--> Hi Jereme,

Thanks for taking the time to contribute. Here are my thoughts on your first design:

The featured products should be visibly differentiated by more than just a colored strip (higher packages -> more appealing). Different images might be in order. I’m also open to images of people rather than server racks to represent the different packages. Also, each featured product needs a “More info” link.

In general, I would like to see some more white space as I feel that several of the sections are hard to separate visually (the use of colors might also help here). This escpecially applies between the client login and the top bar, as well as between the path and the client login and the main content area.

The “Why Choose Nethosting.no?” (BTW: use Nethosting instead of Nethosting.no throughout the design) box doesn’t seem to go with the rest of the design. The box is too rounded compared to the otherwise squared design.

Finally, I would like to see some more colors and/or graphics to make the design feel less clinical. I also think pictures of people would help reduce the clinical feel.

Thanks again, Jereme, and looking forward to your revision ! [/b][/quote]
Your points are well taken Eirik. I will work on some changes.

[Anne]

Hei

Here is my entry.

[Eirik]

Hi guys,

Thanks for you latest contributions. Here are my thoughts on improvements:


Mark,

I’m not a fan of the featured package graphics you’ve created as I feel they don’t communcate anything besides the fact that one package is bigger than the other. It would probably be better with either images of people, or different computer images in the same style/color shade (as apposed to what I said earlier about different colors).

Also, the guys seems a little smug (not sure if that’s the right expression, though). Not a big deal, but if you have a similar picture, I’d like to see that. Also, will this image be available in high-res?


Anne,

I find the left column to be too wide, taking too much space from the content area.

Regarding the pictures you’ve chosen for the packages, they don’t all seem to be from the same photo-series. Furthermore, the persons don’t seem to go with the correct package. The more corporate-like the picture is (or perhaps more people, even), the further to the right it should be.

Also, the woman looking like she’s done something wrong, doesn’t exactly create positive associations to the products.

Furtermore, I don’t like the look of the top bar for each featured product, nor the look of the heading “Webhotell for den kresne”. Both are too blocky (as apposed to exclusive).

Finally, the path bar needs to stretch to the very right.


Both Mark and Anne,

You’ve both chosen a design seamingly put together by big blocks with differently colored backgrounds. First of all, I feel that you both hav chosen too many colors for your designs (or shades thereof), and that this causes clutter and the lack of a natural focus point.

Also, the colors you have chosen are too dark/strong. I would prefer something lighter/paler (towards an XP feel).

Finally, the coloring of the different background sections seem to mark off the sections rather than serve a design purpose. In general I would like to see more more graphics/pictures/symbols/icons and less colored blocks.


Looking forward to your revisions !

[Anne]

Thank you for the feedback. I will be working on the revision later today.

/Anne

[martincrumlish]

Just to let you know Eirik - I am busy at work but I will have a submission for this soon

[Eirik]

That's great, Martin. Looking forward to it!

[Anne]

<!--QuoteBegin-Eirik+Jan 21 2004, 10:07 AM--></div><table border='0' align='center' width='95%' cellpadding='3' cellspacing='1'><tr><td>QUOTE (Eirik @ Jan 21 2004, 10:07 AM)</td></tr><tr><td id='QUOTE'><!--QuoteEBegin-->
Anne,

I find the left column to be too wide, taking too much space from the content area.

Regarding the pictures you?ve chosen for the packages, they don?t all seem to be from the same photo-series. Furthermore, the persons don?t seem to go with the correct package. The more corporate-like the picture is (or perhaps more people, even), the further to the right it should be.

Also, the woman looking like she?s done something wrong, doesn?t exactly create positive associations to the products.

Furtermore, I don?t like the look of the top bar for each featured product, nor the look of the heading ?Webhotell for den kresne?. Both are too blocky (as apposed to exclusive).

Finally, the path bar needs to stretch to the very right.


Both Mark and Anne,

You?ve both chosen a design seamingly put together by big blocks with differently colored backgrounds. First of all, I feel that you both hav chosen too many colors for your designs (or shades thereof), and that this causes clutter and the lack of a natural focus point.

Also, the colors you have chosen are too dark/strong. I would prefer something lighter/paler (towards an XP feel).

Finally, the coloring of the different background sections seem to mark off the sections rather than serve a design purpose. In general I would like to see more more graphics/pictures/symbols/icons and less colored blocks.


Looking forward to your revisions ![/b][/quote]

Hi Eirik.

I've made some (many) changes to the layout.
I am not sure about the sections for the packages. I tried to find better images of people but couldn't find any, so I used an image of a computer instead.

Hope this is more in the line of what you are looking for.

NB! The images I've used (except the computer image) are copyrighted. If you like them I will try to find simular pictures to use instead.

-Anne

Ahh, forgot the link

Layout 2 (http://www.newfacedesign.net/designoutpost/nethosting/)

[Mark]

Very nice Anne! :tup:

[Anne]

Thank you Mark :D

[martincrumlish]

Here's my entry Eirik....let me know what you think.

I made a few small changes to the layout spec you gave to make it fit in better with the design.

Regards,
Martin

[Eirik]

Hi guys,


Anne,

Your revision is a definite improvement on your first contribution. Here are my thoughts on making it even better.

Placing the logo in a white, squared box makes it look like it was cut and pasted into the design. Place make some changes here to integrate the logo better into the overall design.

The left column is still a little bit too wide, and the logo is getting very small because you are trying to align these to elements. I don’t think that will work as the logo needs to be wider and the left column needs to be narrower.

Please use another color besides black for the background of the log in box.

The color you’ve chosen for the left column and top bare is a little too purple. I’d like it to be more blue.

I would like the background color for the body text of the Nethosting Medium featured package to be a pale blue, and the background for the Nethosting Large package to be a pale orange (to go with the colors of their top bars). Currently, the Medium package looks green and the Large package pink.

I’m not a big fan of the people pictures you’ve chosen. The picture associated with the partnerprogram is too standard (seems like something one would find on a Microsoft pictures CD) and the other one is too small, and not a very good one either. Try to find some pictures that would appeal to a Norwegian audience (seems like you would have an edge, here :) ).


Martin,

Thanks for your first contribution. Here are my thoughts.

I feel that you have used too many shades of blue. Perhaps some could be replaced with oranges shades, or shades of another color.

The color used for the left column is too purple. I would like it to be more blue.

The text promoting the “affiliate program” is so integrated into the design of the top bar that it doesn’t seem clickable.

Please move the following elements:
The domain availability search box to the upper, right corner.
The search box to the right and the log in box to the left. Also, please make both sections the same height so that there won’t be any of the color from one section under the other (like the log in section color is currently under the search section, creating uneccessary white space).

Please include the path information in your design.

The top bar is currently too high.

Please use Verdana, anti-alias for the menu elements and the text associated with the affiliate program, search and domain availability sections.

What are those steel pipes in front of the building in the upper, right corner? It could seem like the building is under construction.

The featured packages need to be differentiated (at least slightly).

The design draws attention to the center of the page (the body text) rather than the packages which should be the primary focus point. I think it’s the blue background color that causes this.


Looking forward to both your revisions !

[Anne]

<!--QuoteBegin-Eirik+Jan 23 2004, 01:37 PM--></div><table border='0' align='center' width='95%' cellpadding='3' cellspacing='1'><tr><td>QUOTE (Eirik @ Jan 23 2004, 01:37 PM)</td></tr><tr><td id='QUOTE'><!--QuoteEBegin-->Currently, the Medium package looks green and the Large package pink.
[/b][/quote]
hmm. it doesn't look green or purple on my screen. but I will change it.

<!--QuoteBegin-Eirik+Jan 23 2004, 01:37 PM--></div><table border='0' align='center' width='95%' cellpadding='3' cellspacing='1'><tr><td>QUOTE (Eirik @ Jan 23 2004, 01:37 PM)</td></tr><tr><td id='QUOTE'><!--QuoteEBegin-->Try to find some pictures that would appeal to a Norwegian audience (seems like you would have an edge, here :) ).[/b][/quote]
Someone drinking beer :)


No seriosly, I am not sure what kind of picture you want to use on the site (even as a norwegian) but I will try to find some to use, until you are happy :D

Here is the revision (http://www.newfacedesign.net/designoutpost/nethosting/) (whitout pictures of people on it)

[martincrumlish]

Hi Eirik,

Here's my latest revision....let me know if you need more changes

Thanks,
Martin

[IDarwish]

Alright My turn to post my entry :P .. Ill be happy for comments :)..
Here it goes:

[Palmer]

Nice one Carlos :tup:

[IDarwish]

Thank You Palmer for the kind words :D

[LalitB]

Here's my entry

[Luc]

Eirik, I just want to let you know that I'm working on this.

[Luc]

--image removed--

[Eirik]

Hi guys,

Thanks for all your latest contributions. I’ve tried to keep my comments short and sweet this time.


Anne,

The logo should be centered vertically.

The background color for the left row should be a little paler, similar to the shade of blue in the sky in the top bar.

The box for “Når du flytter til Nethosting” still looks pink on my screen.

Please put the design into browser context.

The log in bar shouldn’t go to the very left, though there probably should be something separating the top bar and the left row. Also the background color for the log in bar should be gradient or graphical to give it more life.


Martin,

Put the log in section and search section on the same row and remove the search row. Suggestion:

<img src='http://www.netmaking.no/nethosting/top_bar.png' border='0' alt='user posted image' />

The design is still missing the path information.

The menu should consist of anti-aliased Arial or Verdana.

Please use the correct text for the two main area sections (as fetched from the web site).


Carlos,

I’m sorry to say that your design is not what I’m looking for. Essentially, I feel it lacks the professional look that I’m after.


Prelude785,

The text for the path information should be less obvious (smaller, no formatting, black/grey) and perhaps also the blue bar below it can be dropped.

The “Når du flytter til Nethosting” section is too boxy. It needs more formatting, a picture, rounded edges, or something similar.

The log in box should be rounded around the bottom edges as well.

Right-align the picture.


Luc,

I’m sorry to say that your design is not what I’m looking for. Essentially, I feel it lacks the professional look that I’m after.


This is still a very open contest, so I’m looking forward to your revisions and/or new contributions !

Thanks in advance !

[Anne]

Hi Eirik

I am leaving town in about three hours and won't be able to make the changes before friday (after the contest is over).

- Anne

[Luc]

I’m sorry to say that your design is not what I’m looking for. Essentially, I feel it lacks the professional look that I’m after

That's fine! Thanks for the sincerity. I don't really have any idea for the style you're after.

Goodluck!

[Eirik]

Hi Anne,

That's too bad. Though your design is very good, it still has a way to go to make it a winning one. So I guess all I can do is wish you a pleasant trip and thank you for the effort.

[Eirik]

That's fine! Thanks for the sincerity. I don't really have any idea for the style you're after.

And thank you for being such a good sport !

[Anne]

Some last minute changes :D

[Mark]

Eirik, here's a revamp of my original entry.

[LalitB]

Updated entry

[martincrumlish]

Hi Eirik,

I will have my revision ready either tonight or early tomorrow morning - is this ok?

Martin

[IDarwish]

I will soon hopefully be posting another entry :)... Hopefully by end of today :)

[martincrumlish]

Hi Eirik,

Here is the latest version with the changes you required.

Martin

[IDarwish]

Heres the other entry I promised :).. Tell me what you think.

To view it click Here (http://www.templatecoder.com/designcontest/)

[Eirik]

Hi guys,

The time has come to select a winner. First of all, thanks to all of you who have contributed to this contest. There has been some great designs, though not all where the kind I was looking for.

However, there was one, last minute contribution that caught my attention and therebye wins the contest, and that's the latest contribution by Carlos. Congrats!


Carlos,

Since your winning contribution is the first revision of this design, I will need you to make some placement changes before you hand over the template. I've outlined the changes in the attached JPEG. Please ask if you have any questions (eirik at netmaking dot no).

<img src='http://www.netmaking.no/nethosting/placementalterations.jpg' border='0' alt='user posted image' />

Also, please note the following which my sketch doesn’t illustrate:

1. The size of the top bar boxes for “Partner program” and “Er ditt domene ledig?” should be somewhat decreased to increase the spacing between them.

2. As you’ll notice, I’ve moved the pictures in the featured hosting package from the left to the right (the duplicated box illustrates how all of them should be). So the pictures need to be faded on the left instead of the right. Furthermore, it’s OK if the text containing the package features is covering some of the pictures (needed to increase the width of the boxes). Also, you’ll need to do something clever to decrease the width of the boxes further so that all four will fit into one row. You might be able to decrease the width of the left column slightly as well.

Finally, I’ll need the included and not included icons as mentioned in my introductory post. And, as said, if you have any questions, please don’t hesitate to email me.

Thanks again, you guys !

[IDarwish]

Whoa!! :D .. Thank you very much !! I will get RIGHT to the changes ASAP :D

Thank You,
Carlos.

[Ian]

well done carlos! A great start to DO.

[LalitB]

Congrats Carlos !! :tup:

[martincrumlish]

well done Carlos...slick design :)

[Mark]

Way to go Carlos! :tup:

[IDarwish]

Thank You all for the kind words :)

[JeremeDavid]

Good show Carlos. :-)

[IDarwish]

thanks :D