PHPBeginner.net - First Draft

It doesn't matter if you do all the error checking in the world, or if you have the most beautiful graphics, if your site or application design isn't usable, it's not going to do well. Get input and advice on usability and user interface issues here.

Moderator: General Moderators

djot
Forum Contributor
Posts: 313
Joined: Wed Jan 14, 2004 10:21 am
Location: planet earth
Contact:

Post by djot »

-
I like the (non-three-columns) light design, without pictures and mainly black/white text/background.


Also the locator (below the logo) might become usefull. But it is too small or too reluctant (reserverd?). Perhaps place an icon in front or do something with the font.


The navigation/menu needs some work. I myself don't like the underlines, also the (search?) icons are misplaced in there.


The form is the only intended block (and the font size inside the font as well as the spaces between lines are too big - overall the form takes far too much space). I would put it to the left like the other blocks.

CHECKBOX yes
CHECKBOX no
would have no intention problems


The notes font (yes, it shoud be small) might not be readable for people with not so good eyes.



Ahhhh, tabs! Did nearly miss them! So would not find this information perhaps (top right is not so common to start reading).
Should the tabs be ajaxified? ;)

The red font color on the tabs hearts my eyes (well, it should represent the "logo", I know). Perhaps red lines around the tabs, blue font color and the acitve one with red color would be a solution for less red eye hurts.


djot
-
User avatar
RobertGonzalez
Site Administrator
Posts: 14293
Joined: Tue Sep 09, 2003 6:04 pm
Location: Fremont, CA, USA

Post by RobertGonzalez »

Oren wrote:
Everah wrote:What browser are you viewing with?
Take a look at my avatar :wink:
(Firefox of course)
I only asked because I developed this with a basis in Firefox and I can see a 10px pad on the right.
User avatar
superdezign
DevNet Master
Posts: 4135
Joined: Sat Jan 20, 2007 11:06 pm

Post by superdezign »

I use Firefox as well. And yes, there is 10px. However, 10px is not much.

Here at DevNetwork, there's about 10px padding on every element up to the deepest ones. The text doesn't run to the outermost elements, and there should always be a good amount of room between the text and the edge... Website, or essay.
User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post by Chris Corbyn »

Don't shrink your font sizes. When I view this on a mac it looks really good, but the font size of the source code is actually unreadable (small):

http://www.w3style.co.uk/~d11wtq/screen-full.png [280Kb]
User avatar
RobertGonzalez
Site Administrator
Posts: 14293
Joined: Tue Sep 09, 2003 6:04 pm
Location: Fremont, CA, USA

Post by RobertGonzalez »

That is really wierd. I think I need to stick to a regular system of measurements. I bounce a little with it, from ems to smaller/medium/large. I think I will unify that in the final release.
nickvd
DevNet Resident
Posts: 1027
Joined: Thu Mar 10, 2005 5:27 pm
Location: Southern Ontario
Contact:

Post by nickvd »

The only thing that I can say about the design other than it looks fantastic!

Is...

Use conditional comments to hide the IE compatibility rant box for browsers other than ie..


<!--[if IE]>
box
<![endif]-->

Those who visit in firefox are unlikely to care about your position about IE (though I love it! :)) You could have that info on an "About this site" type of page...

That way there is more real estate available for those of us using good browsers :)
User avatar
RobertGonzalez
Site Administrator
Posts: 14293
Joined: Tue Sep 09, 2003 6:04 pm
Location: Fremont, CA, USA

Post by RobertGonzalez »

That's a given. It will actually be conditionaled on the server, but it is not something that will show to everyone. Only to IE users. The box itself was the design element as there may be a need to use that type of element for other notices/etc.

PS Thanks for the compliment.
nickvd
DevNet Resident
Posts: 1027
Joined: Thu Mar 10, 2005 5:27 pm
Location: Southern Ontario
Contact:

Post by nickvd »

Ah, makes sense..

:bow:

Can't find it... :tup:

so... TWO THUMBS UP!!!
User avatar
RobertGonzalez
Site Administrator
Posts: 14293
Joined: Tue Sep 09, 2003 6:04 pm
Location: Fremont, CA, USA

Post by RobertGonzalez »

Ok, I made a lot of the changes I have received as feedback from this thread:
  • Made the core font size a touch smaller (I really liked the big fonts but I can see how that might be weird)
  • Added an additonal 10px of padding to both sides (total of 20px now)
  • Made the source code a little larger
  • Made the tabs flat instead of beveled
  • Added a third tab layer to allow for hovers
  • Changed the width of the fieldset to full
  • Changed the margins on the fieldset
  • Made the font size in the breadcrumb trail larger
Any more suggestions? Thanks again for the feedback.

Edit | So you don't have to go to page one again --> http://www.phpbeginner.net/template.php
User avatar
superdezign
DevNet Master
Posts: 4135
Joined: Sat Jan 20, 2007 11:06 pm

Post by superdezign »

Much improvement. :-D Though, I'd like to see the side-menu navigation links do something on :hover. Maybe.. turn red like the sub-menu items?
And you should add padding to your paragraphs so that they don't extend as far as the boxes do.

I love the new tabs better. :-D Much cleaner looking.
User avatar
RobertGonzalez
Site Administrator
Posts: 14293
Joined: Tue Sep 09, 2003 6:04 pm
Location: Fremont, CA, USA

Post by RobertGonzalez »

The side nav menu items do change color (and so do their bullets). Their heading don't, but that is because I have them set to control the opening and closing of the lists.
User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post by Chris Corbyn »

Looking better for me too :) I'm looking forward to seeing this evolve actually.

One thing: http://www.w3style.co.uk/~d11wtq/screen-full2.png

For some reason the source code looks really washed out on my Mac. I think it's the font face that's been used (monospace?). Not really sure what you can do about that if that's the case, apart from mayb try courier (or vice vera if that's wht you're using). Maybe it's just at the borderline of being too small to look very bold.
User avatar
superdezign
DevNet Master
Posts: 4135
Joined: Sat Jan 20, 2007 11:06 pm

Post by superdezign »

Everah wrote:The side nav menu items do change color (and so do their bullets). Their heading don't, but that is because I have them set to control the opening and closing of the lists.
Well, you set a click event... why not a mouseover and mouseout event? :-p
sentback
Forum Newbie
Posts: 24
Joined: Fri May 04, 2007 9:46 am

Post by sentback »

Yes, the tabs are much better now. I was wondering when can we expect some content on this page?
User avatar
RobertGonzalez
Site Administrator
Posts: 14293
Joined: Tue Sep 09, 2003 6:04 pm
Location: Fremont, CA, USA

Post by RobertGonzalez »

d11wtq wrote:For some reason the source code looks really washed out on my Mac. I think it's the font face that's been used (monospace?). Not really sure what you can do about that if that's the case, apart from mayb try courier (or vice vera if that's wht you're using). Maybe it's just at the borderline of being too small to look very bold.
It was your intitial response that made me mess with the code tag. This is how it looks now, though I think I may change it to 600 font-weight to see if that does anything...

Code: Select all

code {
    margin: 5px 0;
    padding: 10px;
    text-align: left;
    display: block;
    overflow: auto;
    font: normal 0.9em/1.4em 'courier new', 'Lucida Console', monospace;
    background: #f2f6ff;
    border: 1px solid #cbddff;
    border-left: 3px solid #cbddff;
}
superdezign wrote:
Everah wrote:The side nav menu items do change color (and so do their bullets). Their heading don't, but that is because I have them set to control the opening and closing of the lists.
Well, you set a click event... why not a mouseover and mouseout event? :-p
I'm sure I can make that accomodation. ;)
sentback wrote:Yes, the tabs are much better now. I was wondering when can we expect some content on this page?
Well, I do have a framework to build for this thing yet. Like I said, I have a lot of the content done for this, I just need to interface with it and develop an admin tool for it. I would hope this wouldn't take more than a month, though I have been saying that for over a year now :oops:
Post Reply