mindSKETCH

[smileisland]

i've just started my site called mindSKETCH cos of my passion and love for web designing

started self-learning web designing couple of years ago and finally started my own site to help others who want to master the art of building your own site in your own style.

hope to get feedback, so i can make it better. shout out all your comments, they'll be much appreciated!!

here's the URL: www.mind-sketch.com

THANKS in advance! = >

[EternalSorrow]

The loading time on the pages is great and the link buttons are very unique.  The tips and help sections are very thorough and well-written, but the graphics could use a little work.  For starters, I was unable to find a preview button, and the one on the bottom lacks originality.  The postcards are of a single design, so a little variation would help there with some new designs.

Finally, the layout as a whole is well-organized with the links and location of the content, but the black and white doesn't catch the eye.  Maybe the inclusion of a colorful image, or even some colored text, would help improve the bland design?

Overall it's a great site with well-organized content and a good, though plain, design.

[smileisland]

thanks for the feedback! much much appreciated (: yea still working on the site layout, agree it's in need of more colours. just would like to know which button is it that you're referring to that lacks originality?

thanks again for the comments =D

[EternalSorrow]

Sorry for the typo, I meant to write "bottom" instead of "button."

[smileisland]

AHH okay i see, got it thanks ;)
my sketches collection is still very little right now cos i just started, spending more of my time building up on my tutorials. but will keep your feedback in mind thx!

[smileisland]

Revamped the site! :D
Comments anyone? Thanks!!

[EternalSorrow]

The layout looks great in IE7, but horrible in Firefox.  The background is missing, the content is pushed down, and the background images for the advertisements are gone.

[smileisland]

whoops! didnt check it on firefox, cos i ususally use IE. thanks for the notification! apparently i left out a curly bracket in the CSS codes -.-

everything looks right on firefox now, but i got one problem with the footer. it doesnt seem to clear the content area (where all the main text go) properly on firefox. on IE6, it's okay. think its a bug, searched for some answers online but they dont seem to correct the problem.

took some screenshots, so here's what i mean:

EXAMPLE 1:
index page>>
on Firefox, it looks like:
http://www.freewebs.com/smileislanduploads/screenshots%5Fbugs/index%5Ffirefox.JPG

whereas it should look like this (on IE6):
http://www.freewebs.com/smileislanduploads/screenshots%5Fbugs/index%5Fie6.JPG
(the footer's not clearing properly, it shouldnt overlap the 'profile' borderbox)


EXAMPLE2:
htmlhelp-css tutorial page>>
on Firefox, it looks like:
http://www.freewebs.com/smileislanduploads/screenshots%5Fbugs/htmlhelp%5Fcss%5Ffirefox.JPG

whereas it should look like this (on IE6):
http://www.freewebs.com/smileislanduploads/screenshots%5Fbugs/htmlhelp%5Fcss%5Fie6.JPG
(the footer should clear after the 'back to top' arrow)

RAH. this bug thing is really irritating, anyone knows how to cure it?
thanks lots!

[EternalSorrow]

I'm groping in the dark for this answer, since I don't have any code to work from, but have you put a specific height on your footer?  Firefox is very picky when it comes to heights and widths.

[smileisland]

hmmm. this is the footer part, i did set the height to 100px. is that the problem?

Code:

#footer
{ background: #ffffff;
color: gray;
text-align: center;
height: 100px;
clear: both;
padding-left: 0px;
padding-right: 0px;
padding-top: 10px;
padding-bottom: 10px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
margin-bottom: 0px;  }

[EternalSorrow]

To tell the truth, I would need to see the entire code for both the html and CSS pages to be able to give a straight, affirmative answer.  Right now, I'd have to suggest that you use adjust the height to see what difference is made, and play around with the padding and margin.  IE and Firefox treat them differently, so your problem could be there.  Also, you could shorten the padding code to this (the order is starting from top and going clockwise):

Code:

padding: 10px 0px 10px 0px;

The same can be done with the margin settings.

[smileisland]

yup im aware of that short-cut (: just that i write it out in full for each component cos its a habit already, haha.

anyway i got the problem fixed already, so it looks alright on both IE7 and firefox2 ;D

thanks for your help though!

[Vangs]

Also, you could shorten the padding code to this (the order is starting from top and going clockwise):

Code:

padding: 10px 0px 10px 0px;

If you're going to shorten the coding like this, you may as well use the full short-hand ;) :

Code:

padding: 10px 0;

10px defines the width for both the top and bottom, the 0 defines the width for the size. Note that on a 0 value no measurement is required, 0 is 0 across all measurements.

[EternalSorrow]

Thanks for the heads up on the extreme shortening of the padding.