My new portfolio

Simply fantastic.

Excellent work! I like it ... Green polka dots! Fun.

First class ... really clean, a "simple living" look. The only thing I don't like is the alternating logo when you mouse over the top of the page. But again, as a beginner, don't know how useful my comments will be to you.

I was a bit worried when I read about "green polka dots" but this is a really fantastic portfolio. I love the design, the minimalism, the colour scheme.

really really like it.

good job.

larmyia

Great looking site

Just a quick one i noticed

their restaurant site as soon as they complied the necessary content.

should be compiled

That's it ...wonderful!

Freddy

Thank you for the nice feedback guys.

@fatfreddy: Excellent find. Thank you so much for pointing that out. All fixed.

@buzcutt: All comments are useful and appreciated. Your opinion counts just as much as the most gurutastic developer on earth.

Mike

Excellent.

I agree with Buzzcut about the top image mouseover. I think its the change in colour of the top green semi-circle that's distracting and also that it changes when the mouse is so far from the image - almost like something has happened in the periphery of your vision.

Very impressive. clean, professional, easy to navigate. Looks good in Safari.

- R

In IE when hovering on the header image, there is quite a long delay on the image swap, causing a flicker. Could be the slow computer ime on, but i have a 3meg a sec connection

Thanks for the feedback guys.

I think I'm going to do away with the hover effect on the banner and leave it as a plain image replacement with no effects. It just doesn't seem to work out well this way what with that flicker at all, at least for IE and Opera. It seems fine in Firefox and Netscape.

That way I can go back to plan A on the non-imaged CSS page: make the banner background green and the h1 white which will look great with CSS-on, images off. If I do that with the hover active it makes a HUGE flicker because of the darker underlying color (I tried it before). If I don't do the hover thing, though, I can go back to that which is cool. Probably a more solid way to make it.

I'll wait until site traffic slows some then get to it one night soon. I don't know how to stop the flicker so I'll surrender it. The swap image is *even* preloaded onto the page (see footer with styles off), and I tried the empty script element thing -- the anti-fouc (flash of un-styled content) measure. Nothing seems to work. Grr.

@ragamuffin: Thanks for the Safari thing. I don't have a Mac so it's good to get info like that. (And a relief in this case

Oh, well. Again, everyone, thanks for the feedback.

Mike

Just a quick Q about the 'hidden' navigation, is it just set to one side of the page?

I asume so because i'm sure you wouldn't hide links by colour (IYSWIM)

Freddy

I asume so because i'm sure you wouldn't hide links by colour (IYSWIM)

Freddy

Yes. They are offset. Like this:

/* To hide them... */

div.offset a {
position : absolute;
top : -1000px;
left : -1000px;
padding : 5px;
font-weight : bold;
}

/* And to make them visible on focus... */

div.offset a:focus, div.offset a:active {
position : absolute;
background : #99cc66;
border : 1px solid #000;
color : #fff;
top : 25px;
left : 2%;
z-index : 5;
}

Well, I got rid of the hover on the banner. I put the active image in its place. Still gives a flash of un-styled content on page reload in IE (so I can't change the background unfortunately as it'd still be worse. At least it doesn't happen on hover now.

Mike

Good move, it looks great now.

Very nice, clean and no-nonsense design.

Mike, the site it very nice. The design is simple and clean and looks great. However, you can cut down on the amount of background images that you are using to create your green dots in places on the page. for example, you can change your headings to read: <h3><span>&bull;&nbsp;</span>Heading Text</h3> and that can be styled so the bullet is the green and large as it is in the image. The one problem with that method is that if you make the bullet too large, it will bump the heading text down to the bottom of the bullet instead of reading in the center of the bullet. You can mess around with that one a little bit and see if it is useful.

Another way that you could cut down on the background images is eliminating the div you have with a horizontal rule in it. You could replace all of those with this: <div class="hr">&bull;&nbsp;&bull;&nbsp;&bull;&nbsp;</div> that div could then be styled with the green color, center aligned text, and a font size of about 30 pixels. You can remove and put in   as you wish to create space between the bullets and even style them with a margin to get a more exact spacing.

- otto

I'm not sure I like the idea of styled bullets and non-breaking spaces (didn't even know entities could be styled to tell the truth).

As far as the hr: the hr is still an hr as it is, so it provides more separation than what's shown of the surface. If I changed that to bullets I'd lose the meaning of the html I did use. The div was only necessary to allow the image.

I thank you for the suggestions and feedback, though.

Mike

soryy to butt in but how do you style bullets?

Freddy

You set a style on your <ul> and then change it for an element contained within your <li>, e.g.

ul { font-size: 400%;  color: #000; }
ul li p { font-size: 25%; color: blue; }

That'll give you big black dots and smaller blue text in FF. In IE, everthing is the same size although the bullet is a different colour.

Nice!

Thanks AGAIN Tyssen

I learn soooo much here ... have to buy you all a beer one day, let me know when you're in Western Australia!

Freddy

Actually, this is silly, but &bull; is treated as text so the classed div alone would work... or h3 span in the heading. No special tricks required.

 
hs.biggreenbullet, div.biggreenbullets { 
font-size : 200%; 
color : green; 
} 

BUT...

As it is, the hr is an hr as it's supposed to be, versus bullets. If this were a print document it'd be a different story as three bullets equate to a horizontal separator, but it's visual. Whereas on the web, everything has meaning. I meant those to be hrs, but I wanted them to look like three bullets for the visual side of the interface.

Regarding the number of images, it's only two and they are tiny (the 3 dots are only 0.37kb and the single h3 dot is only 0.12kb.). They are the same two images repeated over and over, downloaded and cached once so the demand on resources is virtually nothing. The added bullet and space mark-up might even exceed that as it would be physically repeated. I'm not sure, though.

Mike

EDIT: I would like to add that Tyssen is right on about styling it as a bullet should be normally be on the web and that's list associated. But that isn't the bullet otto brought up in this case. Though I'd probably use an image on my list li too.

Well, I'm originally from there and my family's still there so visits in the future are definitely on the cards.
(Sorry for participating in a thread hijack. :oops: )

Just imagine what would happen if everyone Tyssen helped bought him a beer. . . .

If only 3-4 bought me a beer I'd be under table. I'm a real lightweight.
(Interesting side note: did you know that if you accidentally close down a forum window you're typing in, when you use the Snapback tab FF extension, it comes back up with the message you'd just typed but not yet submitted? =D>)

well bang me off an email when it happens and I'll laugh at you falling all over the place and being completely un- '3 star Leader like'

SORRY Mike - this WILL be the last post off topic on here - i know it's not a chat room!!!!!!

Freddy

I don't mind guys. Good to see new freinds being made. If it happens on my thread, well that's cool

Mike

Hey guys, visit my portfolio again please... this time check out my blog. I just finished styling it to match the site. I got it pretty close, but it was a challenge doing so.

"Chat Beast" will be next I guess.

Mike

very nice!

That really is very nice. Simplistic, clean and efficient.

Not often I like green sites but this is a good green

One thing, Your contact form - the text on non-focused boxes, the dark grey on light grey could use a touch more contrast with the backgrounf maybe.