Website First Attempt

ShoulderChip · 19-12-2007 12:32am #1

Hi,
i have been asked to design a website for a friend, for his mother's catering company,
i have uploaded it to my webspace hoping that someone here may be able to offer some ideas to make it better.
At the moment it is just about passable maybee, but I need it looking professional, I made it using the new version of dreamweaver but it is literaly the first time i looked at dreamweaver or making a website so i could do with some help or ideas,
thanks for any comments

the site is denfitz.com

Basq · 19-12-2007 12:39am

Am not a master in Web Design but from a glance around:

(a) Title your pages (using the <title></title> tags) as there's quite a few 'Untitled Documents' as you navigate around the site.
(b) The 'Really Fresh And Local' link doesn't seem to be working now.. was a minute ago. Anyways, when it was, the picture on it was a 650KB image with quite a large resolution scaled down. Use IrfanView to compress it and resize it down, as oppose to scaling a large image. This will frustrate anyone on less than a DSL connection.
(c) These links don't look right (file:///C|/Users/richenda1/specialrequests.html). You should ideally have these HTML pages in the same folder as your index page (richenda.htm) and should just be referring to them as their filename (specialrequests.html) without any need for leading or trailing slashes.

All i can see as the other pages seem to be broken.. probably due to the issue i mentioned in (c).

Hope this helps.

ShoulderChip · 19-12-2007 12:48am

basquille wrote: »

Am not a master in Web Design but from a glance around:

(a) Title your pages (using the <title></title> tags) as there's quite a few 'Untitled Documents' as you navigate around the site.
(b) The 'Really Fresh And Local' link doesn't seem to be working now.. was a minute ago. Anyways, when it was, the picture on it was a 650KB image with quite a large resolution scaled down. Use IrfanView to compress it and resize it down, as oppose to scaling a large image. This will frustrate anyone on less than a DSL connection.
(c) These links don't look right (file:///C|/Users/richenda1/specialrequests.html). You should ideally have these HTML pages in the same folder as your index page (richenda.htm) and should just be referring to them as their filename (specialrequests.html) without any need for leading or trailing slashes.

All i can see as the other pages seem to be broken.. probably due to the issue i mentioned in (c).

Hope this helps.

Excellent Basquille thank you so much for that,
I have sorted out the problems with the links now, thanks, (although the very local service link doesnt work yet as I have not been provided with any content for it)
I will sort out the images using irfanvew soon as well, am on dialup at the moment and no what you mena about the slow loading times.
I will also wait and adress the title issue when I am uplaoding it onto the real web address.

Overall though it looks a bit boring though doesn't it?
any suggestions for injecting a bit of life into it?

Feelgood · 19-12-2007 12:55am

Forget about designing it yourself unless you are genuinely interesting in learning web development?.

Basically you can go out and buy a cheap template that looks professional and simply edit the .jpegs to be the company name and edit the content of the site, text etc using dreamweaver or even frontpage...

It will save you an awful lot of time and effort and you will have a very professional looking website for about €45...

Check out this site and do a search under catering....
www.templatemonster.com

Basq · 19-12-2007 1:00am

Yeah, i'm with Feelgood really. Fresh web designs are hard came by nowadays.

Either get a template, or use a CMS if you plan on updating it regularly.

Feelgood · 19-12-2007 1:02am

Feelgood wrote: »

Check out this site and do a search under catering....
www.templatemonster.com

Sorry...do a search under food and drink and then use the keyword bakery.....

Some decent enough ones there!.

ShoulderChip · 19-12-2007 1:19am

Feelgood wrote: »

Sorry...do a search under food and drink and then use the keyword bakery.....

Some decent enough ones there!.

Thanks for that feelgood but I really wnat to give it my best to make one on my own,
although I must admit I may download a few frewware ones (cough) via torrents.

Creamy Goodness · 19-12-2007 1:25am

contact details should be at the bottom of the web-page on every page.

on first impressions i see the contact details on the home page, then i go browsing for a bit and lose them and have to rethink where they are.

Gauge · 19-12-2007 1:42am

I know you're not a designer which is fine, but here's a few tips I think could help the site look a little better:

-Center the top menu if you can, it's kind of floating to the left now and it's a bit jarring. Try to keep stuff symmetrical.
-On the Special Requests page the text is strange, there's a few random gaps and spaces and a lack of capital letters and punctuation, and it's all squashed up against the picture. Just needs tidying up a little bit. The 'Fresh and Local' page looks decent in terms of text and image- you could apply the same style to the other pages.
- If you have the time, check out a tutorial on CSS divs/layers like this good one. It's not necessary but it'd be a very simple way of adding a style to your page and an alternative to frames. Just if you have some time on your hands and want to have a go at it. If you know HTML CSS is quite easy and fun to experiment with.
- Maybe adjust the size of your frames a bit. I'm getting a horizontal scroll bar which is a bit irritating, especially as the page itself isn't actually wider than my browser.

Aside from that, just what others said, fill in your title tags and replace the huge images with smaller ones, add contact details as a footer for every page.

ShoulderChip · 19-12-2007 3:15am

Thanks dude some great advice there,
I think I have fixed it up a bit now, i fixed the scroll bars and the font I hope, i also added the contact bar at the bottom,
thank you all for your help, and I am still open to any suggestions?

yeraulone · 19-12-2007 11:54am

Nice job on your first site. I would consider putting the logo into every page, instead of just the home page. Maybe you could include it in the top frame.

louie · 19-12-2007 12:04pm

very good for your first attempt.

The site uses frames, which is a big NO, NO, NO so try to make use of tables if divs are too complicated.

ron_darrell · 19-12-2007 1:41pm

I'm going to get shot down for this but how and ever you did ask. If it was a personal site then it would indeed be a very good first effort. It would still need work but as a personal site not bad. However, this isn't a personal site but a web presence for a catering business in which case it fails pretty miserably. Sorry for being harsh but there it is.

In catering (and most businesses to be honest) how you are perceived can be as important as how you actually are. The site looks amateurish which is unlikely to help your client (and they are a client whether you are doing this pro bono as a favour or receiving euro for it) to increase market share, pull in new business or keep existing business.

Now, all that said, it is your first attempt. What you need to do now is go and learn a little and come back to it again. Look into CSS (as already mentioned by earlier posters), SSI (server side includes), design concepts (like color schemes, the color wheel, contrast, emphasis etc.) and maybe even scripting.

I don't know what the situation is with the webspace you have but I would suggest looking into PHP or ASP at the very least.

Now the bit where I put my money where my mouth is. If you are interested in improving the design and are truly interested in making it as good as it can be then feel free to contact me and I will give you pointers in the direction to go. Find below code for a revised 'Fresh & Local' page.

-RD

<html>
<head>
	<title>.: Richenda Catering - Really Fresh & Local page :.</title>
	<style>
		body {
			background-color:	rgb(140,58,241);;
			font-size:		12pt;
			font-family:		trebuchet ms, arial;
			text-align:		center;

			padding:		0px;
			margin:			0px;
		}

		#container {
			width:			900px;
			text-align:		left;
			font-family:		trebuchet ms, arial;
		}

		#header {
			position:		relative;
			top:			0px;
			left:			0px;

			width:			900px;
			height:			75px;

			color:			rgb(140,58,241);;
			background-color:	white;
			font-family:		trebuchet ms, arial;
			text-align:		center;
		}

		#footer {
			color:			white;
			text-align:		center;
			font-family:		trebuchet ms, arial;
			padding-top:		30px;
		}

		.href2 {
			color:			white;
		}

		.href_spacer {
			padding:		15px;
		}

		.logo {
			font-size:		36pt;
			color:			white;
			vertical-align:		middle;
			text-align:		right;
			padding-left:		40px;
			position:		relative;
			top:			-115px;
			left:			25px;
		}

		#header span a {
			font-size:		14pt;
		}
	</style>
</head>
<body>
<div id="container">
<div id="header">
<br />
<br />
	<span class="href_spacer"><a href="index.html">Home</a></span>
	<span class="href_spacer"><a href="index.html">Really Fresh & Local</a></span>
	<span class="href_spacer"><a href="index.html">Very Personal Service</a></span>
	<span class="href_spacer"><a href="index.html">Attention To Details</a></span>
	<span class="href_spacer"><a href="index.html">Special Requests</a></span>
</div>
<div id="main">
<div>
	<br />
	<img src="untitled.bmp" width="250" height="250" alt="Picture of appetisers" />
	<span class="logo">Richenda Catering Ltd.</span>
</div>
<div>
	Welcome to Richenda fresh in-season cooking. <br />
	I pride myself on fresh and organic in season food, combined with a very personal service to suit very individual needs.
	One of my options for casual entertaining is a Hog Roast on a spit.  This is most impressive and an easy way to entertain guests.
	If you would like to contact Richenda about the many food options for entertaining, please send an email to kitchen@richenda.ie 
	<br />
	<br />
	Would you prefer to click a button to email directly? Then click here to <a href="mailto:kitchen@richenda.ie" class="href2">email Richenda</a>
	<br />
	<br />
</div>
</div>	
<div id="footer">
||Richenda Talbot || Eden Hall | Ballyragget | Co. Kilkenny | Ireland ||<br />
|| Tel: + 353 (0) 56 883 0838 ||Mobile: + 353 (0) 87 285 8753 || <a href="mailto:kitchen@richenda.ie" class="href2">kitchen@richenda.ie</a>
</div>
</div>
</body>
</html>

PS - The code is a guideline only, based on the design you already have in place and is by no means a finished page. The CSS should be extracted to a .css file. The header and footer extracted and saved to a .asp or .php file for SSI (though I'm sure it's possible to save it to a .html file and get the same results - depends on how you're incorporating the SSI). The color I'm using was only a stab at the color you have and should be changed to that if the client requires it. The text 'Richenda Catering Ltd' should be replaced with the logo image. There are loads of things that you could do but it serves (I hope) as a good starting point for revising the work you have done.

yeraulone · 19-12-2007 3:39pm

good post ↑

Duckjob · 19-12-2007 4:07pm

Couple of spelling/grammar mistakes in the body copy:

Attention to Detail Page: "I you would like something"

Special Requests Page:
"Any special requests I can do, but please do giveme good notice!"

"...rest assured I will nake it all a special food occasion."

The food (along with the service) is the main selling point of the business.
The food looks good, but you can't see it very well from the pictures so it doesn't really have any impact.

If I were you I would make a lot more of the actual food options catered for with good quality close-up pics of appetising dishes and also a good pic of a hog roast. People should be made to feel hungry just by browsing a site like this.

Also, I don't think the purple does you any favours. I would suggest you need a warmer color scheme on a food orientated site such as this. Again, make the viewer feel warm and cosy.

Don't put an email address on a page without hyperlinking it. You're just putting an obstacle in the way of somebody who wants to contact you and give you their business.

Axwell · 20-12-2007 5:19am

Duckjob wrote: »

Don't put an email address on a page without hyperlinking it. You're just putting an obstacle in the way of somebody who wants to contact you and give you their business.

If you hyperlink it using mailto: you are just leaving yourself open to any amount of spam

aidan_walsh · 20-12-2007 8:55am

Axwell wrote: »

If you hyperlink it using mailto: you are just leaving yourself open to any amount of spam

You're leaving yourself open to it if you post an email link without linking to a mailto as well, so much of a muchness. Its better practice to make things as easy as possible for the customer, and in the case of email that means either a form or a mailto link.

xfahmix · 20-12-2007 8:27pm

louie wrote: »

very good for your first attempt.

The site uses frames, which is a big NO, NO, NO so try to make use of tables if divs are too complicated.

I'm not an expert, but imho, I really think it is best to steer away from frames because they can hurts your website position in search engine results (SEO thingy guidelines).

You might want to use PHP include function which works better than frames.

http://www.tizag.com/phpT/include.php

Website First Attempt

Comments