Wanted: Website Review made my first site...

[boxerdog]

just thought i would share my first site with you.
go easy on me, im still learning (very slowley)
still got a couple of things to add/change, but its a start....right?

www.brittanyguide.co.uk

 

[Tricky1]

Looking good Boxerdog, clean and tidy, one thing I will say, have you built it for people with poor eyesight, man, those fonts are BIG !!

I changed the nav links to 14px, they are currently 24px, which looks a bit easier on the eye.

The main content looks good at 12px, just means you will have to sort out your paragraphs, change the height of the div that the text is in, currently 380px, which should move up your boxes at the bottom..

Just what stood out to me, good start though, hope it goes well,

Richard

 

[boxerdog]

many thanks tricky1.
thats just the sort of info i need to help improve things.

cheers

 

[Systreg]

I can't see your Welcome To Brittany Guide logo header at all in Opera or FireFox, the top menu is covering it up, it looks like this:

 

[boxerdog]

thats bizzare.....how would one fix that problem??

 

[accelerator]

thats bizzare.....how would one fix that problem??

I still use tables for layout. Every time I say this, I get shot down in flames by the CSS purist, black turtle neck designer brigade, but ultimately it means my sites always display fine across browsers. You have some kind of problem with your DIV rendering. Using DIVs for layouts is harder to get rendering properly over all browsers.

What app did you use to build the site?

Rgds

 

[boxerdog]

webplus x2

 

[accelerator]

OK, it's not bad for a first go and I'm certainly knocking your effort, but the code that WebPlus is generating isn't particularly clean, which is not going to help for SEO.

If you take a look at the source of my Mens Shirts site, you'll see the difference in that my site has a lot less page layout code. That's because I use an extremely simple table layout to control the page elements (just a few tables and columns). This was done in Dreamweaver. It just means there's less unnecessary code in the page which is better for SEO. Some people could achieve the same effect with a simple CSS layout, but that's not for me.

Also, when you create a sub page, use an SEO friendly name, e.g.

http://www.brittanyguide.co.uk/saint-malo-accommodation.html

Rgds

 

[doodlebug]

I can't see your Welcome To Brittany Guide logo header at all in Opera or FireFox, the top menu is covering it up, it looks like this:

Same here on IE, yes i use IE on my laptop

Thanks for the blackeyes after your seriously big fonts smacked me in my eyes :lol:

Site is ok mate, it's a bit daunting making your first site, i've only made 7 upto now.

 

[alex]

I have had a little play (hope you don't mind) and have come up with a slightly modified header. I haven't spent long on it so it still needs changing to look the way I believe you wanted it to, but it should fit correctly in all browsers. I didn't have your images etc so I have improvised, but if you want me to go over it in more detail I will be free over the weekend to talk you through it or modify it for you. You can see the header at Untitled Document or the code is below.

<div style="border:#CCCCCC 0px solid; width:900px;position:relative; left:50%;margin-left:-450px; margin-bottom:3px;">
<div style="width:900px; height:20px; background-color:#110268;"></div>
<div style="width:900px; height:10px; background-color:#FF0000;"></div>
<div style="width:900px; height:20px; background-color:#110268;"></div>
<div style="width:880px; background-color:#99DBEE; padding:10px;">
<p align="center">
<span style="font-family:Verdana;font-size:40px;line-height:1.20em;">Welcome To</span><br/><span style="font-family:Firenze SF; font-style:italic; font-weight:700;font-size:64.0px; line-height:1.13em; color:#ff0000; ">Brittany</span><span style="font-family:Firenze SF;font-style:italic; font-weight:700; font-size:64.0px; line-height:1.13em; color:#0000ff;">Guide</span><span class="Normal-C2"></span>
</p>
</div>
<div style="width:900px; height:40px; background-color:#030D81;">
<span style="font-family:Verdana; font-weight:700; font-size:24.0px;line-height:1.21em; color:#ffffff;"><a href="http://scripts.affiliatefuture.com/AFClick.asp?affiliateID=125093&merchantID=2922&programmeID=7750&mediaID=0&tracking=brittanyguide&url=" target="_blank" style="color:#ffffff;" title="ACCOMMODATION">ACCOMMODATION</a></span>
</div>
</div>

At this stage you should just explore a bit then it should start to make sense. As a first site not a bad one. Where possible use divs as they load quicker than tables, and setting HTML,BODY,TD,TABLE,DIV,P,FORM {margin:0px;padding:0px;} will remove all the default setting sizes of the browsers which will make it easier to make it look the same in different browsers.

Feel free to email me if you need any more help and as I said I will gladly go through it in detail over the weekend if you need it. I have my last exam tomorrow (1st year at uni) so after the celebrations of Friday night I'll be free.

 

[boxerdog]

changed it around abit...hope that works better?

 

[Systreg]

Yes, I can now see the logo header in Opera and FireFox

 

[boxerdog]

there is a god!!!

i cant tell you all how greatful i am for the help!!

rep on its way

 

[denchomsky]

I still use tables for layout. Every time I say this, I get shot down in flames by the CSS purist, black turtle neck designer brigade, but ultimately it means my sites always display fine across browsers. You have some kind of problem with your DIV rendering. Using DIVs for layouts is harder to get rendering properly over all browsers.

Disgraceful!

Ps : No black turtle neck in my wardrobe, they went out of fashion the same time as tables.

 

[denchomsky]

setting HTML,BODY,TD,TABLE,DIV,P,FORM {margin:0px;padding:0px;} will remove all the default setting sizes of the browsers which will make it easier to make it look the same in different browsers.

or just do this * {padding:0; margin:0;} * targets everything in CSS and you dont need to put px if the value is 0.

 

[alex]

It looks much better now. All the best with it and thanks for the rep.

or just do this * {padding:0; margin:0;} * targets everything in CSS and you dont need to put px if the value is 0.

I used to do that, but I was told by someone on Experts-Exchange that it wouldn't be read in older browsers. I've never had a problem myself though.

 

[denchomsky]

I used to do that, but I was told by someone on Experts-Exchange that it wouldn't be read in older browsers. I've never had a problem myself though.

It's valid CSS, it's not a hack, so there is no reason why older browsers wouldn't understand it as far as I know.

 

[joned]

or just do this * {padding:0; margin:0;} * targets everything in CSS and you dont need to put px if the value is 0.

Dumb question, but where do you put that? Is it the first line of your style sheet?

Cheers, Jon

 

[alex]

Dumb question, but where do you put that?
Cheers, Jon

Yeah, the first line of the style sheet will be fine.

 

[mat]

Looking good!

I would suggest adding relevant keyword alt tags to all your images

<img src="wpimages/wp0afa3866_0f.jpg" width="218" height="217" border="0" id="pic_1" name="pic_1" alt=""></div>

Also at the top of your pages above the text its allways good to add a H1 heading. For example on the front page <h1>Brittany Guide</h1> You want these to be keyworded so the next page could be <h1>Brittany Attractions</h1>

If you feel like going a bit more advanced then it would also be good to split your keywords down so they are different for each page and more targeted instead of having the same general keywords on each page.