br3n.co.uk

br3n

Senior Member
Spent today giving it a little overhaul, its still what i'd call a temporary design but at least this time I've avoided tables! I realise this is still far from perfect but its an improvement. Gained a little more knowledge of css as well so always a bonus.

Brendan 'br3n' Patterson - Designer of furniture & graphics

Any tips on the code side of life would be well recieved - I know the html needs tidying up but at least it validates. Used some additional h1/h2 tags I hope in the correct manner?

Thanks!
 
Just a few quick things. I'm sure Harry can give you some more extensive feedback. :)

Your menu should be a list.

Like this..

<ul id="menu">
<li><a href="#furniture">furniture</a></li>
</ul>

You could make your subtitles <h3> instead so you don't have to put <strong></strong tags. You don't really need all the <p> tags around the images either. Just control the images in the CSS instead (img {margin:; padding:; etc..})

Love the design and user experience. Simple and straight to the point. :up:
 
Made a few changes (before reading this), added an h3 and moved a few bits around, also forgot a copyright :eek:

I really.. really dont know anything about code (im learning as I go along) - could you eleborate on the list? as for the images its dreamweaver putting it all in there :S will have a look at some other css' and see what info I can steal!
 
I'm not keen on the background either, 1 its wood and 2 it just looks out of place. I'd try a darker background maybe even a dark (almost black) brushed metal
 
Levi said:
I'm not keen on the background either, 1 its wood and 2 it just looks out of place. I'd try a darker background maybe even a dark (almost black) brushed metal

I think the background works fine, but without something behind the work, it doesnt stand out enough for me.
 
Hi!

I've just completed my first couple of sites without using tables! It took a while to get my head round CSS and I'm still picking up ideas and little bits of code all the time.

None of the work I've done would have been at all possible without this amazing list of links

77 Resources to Simplify Your Life as a Web Designer | Vandelay Design Blog

Maybe you've seen it before, but there are some brilliant menus, layout ideas, code helpers and solutions in general and it seems to have helped me enourmously in understanding code. I think it's just seeing it in a nice clear concise layout.

Anyway, I think your site looks great. You've got some excellent work which helps!

Have a look at some of the links to minimalist websites on Vandelay aswell. I'm usually inspired by some of the stuff I see there.
 
Thx muzmoz will take a look. I dont want to get too into code as its not something I ever want to do, But its strangly intreaguing. (sp?)

Can anyone help me - if I wanted to centre it all but remain left aligned (same as the old site) how would I go about doing this? ta.

_

Also, tried making the headings for each project an h4, but I couldnt get it to be on the same line as the rest of the p. Spoke to a friend who said make it display:inline; but then it went next to the image and not under it - got all confused and changed it back. WIP :)
 
I have a couple of straightforward solutions which may or may not work!

Put <center> directly under the <body> tag. Then, put </center> directly above the </body> tag.

or

Somewhere between the <head></head> tags, put:

<style type="text/css">
body
{
align:center;
text:centre; [ you'll have to try this bit out!]

}
</style>

I think you can also use another piece of code in the CSS above, I'm guessing here, it's hard not sitting in front of dreaweaver atm, but try body text align or something like that and see if you get a prompt from DW.

Hope that helps!
 
in the css sheet
or on the page in the css
or if you dont have either of those set up using
<style type="text/css">

put

#blockname { width:definedwidth; margin-left:auto; margin-right:auto }

where there is a block with a defined width (I assume your central piece will have a defined width, I cant be bothered to check the code :D
 
Illl have a look through all the links, I dont have a 'wrapper' at the mo? assume thats like a div?

Also - can anyone tell me why my <hr> is yellow in FF as intended but white in IE8 ?
 
br3n said:
Illl have a look through all the links, I dont have a 'wrapper' at the mo? assume thats like a div?

Also - can anyone tell me why my <hr> is yellow in FF as intended but white in IE8 ?

Yeah a wrapper is just a DIV containing the rest of your elements.

A very basic 3 column site could be set up like this for example. (Where the "container" is the wrapper).

<div id="container">

<div id="header"></div>
<ul id="menu"><li></li></ul>
<div id="content">
<div id="col1"></div>
<div id="col2"></div>
<div id="col3"></div>
<div class="clear"></div>

</div>

</div>

Then you can float the 3 columns left for example. But this was just to show what the wrapper is.

<hr> was deprecated in HTML 4.01. You should use the CSS border properties instead.

IE:

border-bottom:2px solid #whatevercolor;

CSS Border Properties - CSS Basics - Chapter 13
 
<hr> is not deprecated and is a perfectly legitimate way of putting lines in places. Creating divs of certain sizes to have borders for that sake alone is a much worse practise. The deprecated part of hr were it's style properties, and these should be fixed by controlling the <hr> in css styles only. (align, shade etc.)
 
OK made some changes as suggested, <strong> tags removed and replaced with a span class.
Also removed the <p> from images and css'ed with display block.

Had some issues getting my head around not "stacking" the w3c images - was getting lost trying to do it like img.w3c and took a knowledgable friend explaining that

<p class="w3c"><img aklsdf></p> has: .w3c img
<img class="w3c" asdlfjk> has img.w3c
Progress! centre aligned next! [ DONE! ]
 
Well done on the progress with all the coding. I imagine it makes you happy to progress with this as you have the product you want to make it better, rather than learning code for codes sake.

I find it odd that someone in web design isn't knowledgable on this stuff but after being here for a while now, lots and lots of designers aren't and dont care as there is so very much to learn in design.
 
renniks said:
<hr> is not deprecated and is a perfectly legitimate way of putting lines in places. Creating divs of certain sizes to have borders for that sake alone is a much worse practise. The deprecated part of hr were it's style properties, and these should be fixed by controlling the <hr> in css styles only. (align, shade etc.)

Sorry, I meant all "presentation attributes" of the hr element were deprecated in HTML 4.01, and are not supported in XHTML 1.0 Strict DTD.

I've always been taught that presentational markup is never good practice, and that it's better to use borders than <hr>?

Furthermore according to this article on Sitepoint (scroll down to "horizontal rulez ok"), it looks like you'll have to wrap them in DIV's to get them to act similar cross browser. SitePoint Design View

Would you have to create any extra DIVS? Could he not just put a class on the P of his intro text and then a border-bottom on that?

Maybe the resident code gurus Harry and Sunburn can clear this up? :)

(This was supposed to come after your post, but due to the DF database issues today it showed up in the beginning of the thread so I reposted it here.:))
 
Back
Top