Page 1 of 2
Prettier Forms
Posted: Sat May 07, 2011 4:13 pm
by EcazS
If you're using forms in your design you might find them a little boring so I found this tutorial on creating "prettier forms".
http://net.tutsplus.com/tutorials/html- ... ith-css-3/
I don't own that site or is in no way affiliated to it so it shouldn't count as advertising, besides, it's helpful
Preview image,
Re: Prettier Forms
Posted: Sat May 07, 2011 4:21 pm
by jacek
Well they do look pretty
Styling forms is a bit of pain most of the time so this may be useful.
This should not really be in this section, but i'm not entirely sure where it should be
Perhaps we need a new one for this type of thing.
Re: Prettier Forms
Posted: Sat May 07, 2011 4:23 pm
by Carbine
Create a new section called "Other tutorials"?
Re: Prettier Forms
Posted: Sat May 07, 2011 4:23 pm
by jacek
Problem solved I remove "Help" form the section name
Re: Prettier Forms
Posted: Sat May 07, 2011 4:23 pm
by EcazS
jacek wrote:
Styling forms is a bit of pain most of the time so this may be useful.
I hear you
Maybe we should have just a Code section and not only restricted to PHP?
Edit, oh ok
Re: Prettier Forms
Posted: Sat May 07, 2011 4:32 pm
by jacek
Added a tutorial and code section.
Re: Prettier Forms
Posted: Sat May 07, 2011 5:13 pm
by Dylan
Generally speaking, I just resort to using an image to style my forms. Is this practice becoming deprecated with the release and larger support of CSS3?
I'm not hugely into web design, much prefer the programming side of things so just curious.
Re: Prettier Forms
Posted: Sat May 07, 2011 5:31 pm
by EcazS
Dylan wrote:Generally speaking, I just resort to using an image to style my forms. Is this practice becoming deprecated with the release and larger support of CSS3?
It seems like it is. I'm with you though. Generally I just create image backgrounds for my form fields (like he does for IE in this tutorial). This is actually the first time I've used CSS3 mainly because I want people to see my site as I've designed it (except for IE6- people).
But I think I might just start using some CSS3 considering the large support of it ATM.
Re: Prettier Forms
Posted: Sat May 07, 2011 5:33 pm
by Dylan
EcazS wrote:Dylan wrote:Generally speaking, I just resort to using an image to style my forms. Is this practice becoming deprecated with the release and larger support of CSS3?
It seems like it is. I'm with you though. Generally I just create image backgrounds for my form fields (like he does for IE in this tutorial). This is actually the first time I've used CSS3 mainly because I want people to see my site as I've designed it (except for IE6- people).
But I think I might just start using some CSS3 considering the large support of it ATM.
My only problem for this is that generally the sites I build are not based for tech-savy people. Often times my audience would not even know what browser they are using.
Re: Prettier Forms
Posted: Sat May 07, 2011 5:35 pm
by Carbine
Dylan wrote:Often times my audience would not even know what browser they are using.
Yup, that person is normally my mum...She doesn't even know how to check the history.
Re: Prettier Forms
Posted: Sat May 07, 2011 5:42 pm
by Dylan
Carbine wrote:Dylan wrote:Often times my audience would not even know what browser they are using.
Yup, that person is normally my mum...She doesn't even know how to check the history.
Oh older people and technology, where did we go wrong.
My mom called me asking me what was wrong with her computer, because it was:
Doing this thing where the little thing is outlined by that other thing
... That was helpful.
So yah, long story short, I think it really matters what your webpage is done for to state how you have to make it; for instance the nettuts site would make sense to use CSS3, as it is a site based around computing.
But my question still stands; is there any reason not to use images still? Should they only be applied as backup? I mean, they are also much more versatile than CSS styling still.
Re: Prettier Forms
Posted: Sat May 07, 2011 5:46 pm
by EcazS
Dylan wrote:
But my question still stands; is there any reason not to use images still?
No. Except the fact that it might take 0.01 seconds longer to load the site. But I can live with that.
Re: Prettier Forms
Posted: Sat May 07, 2011 6:36 pm
by jacek
CSS3 makes possible some things you used to only be able to do with images, rounded corners are a good example.
So using images is not bad, but its becoming easier to get the same effects with just CSS.
It depends on your audience which method you go for really.
Re: Prettier Forms
Posted: Sat May 07, 2011 6:53 pm
by Tino
I really like CSS3. However, it does add more complexity if you want the same effect to appear on all browsers. For example, IE users won't notice many CSS3 effects, so you'll have to use images and CSS3 if you want everyone to be able to see the same thing.
Personally I prefer just to give browsers that don't support a certain CSS3 property yet a slightly different look to save me a lot of work.
Re: Prettier Forms
Posted: Sat May 07, 2011 6:57 pm
by jacek
Yeah I tend to just let people with IE see the slightly broken version. Its fine to do that, as long as it still looks okay.
Re: Prettier Forms
Posted: Tue May 10, 2011 2:36 pm
by sven
Cool forms, I might add them to my website. Good job sir
Re: Prettier Forms
Posted: Tue May 10, 2011 4:49 pm
by jacek
It's relevant so no, this is fine
Re: Prettier Forms
Posted: Tue May 10, 2011 4:50 pm
by Tino
I actually deleted it because it's a direct link to a sign up form :/
Re: Prettier Forms
Posted: Tue May 10, 2011 4:54 pm
by jacek
Tino wrote:I actually deleted it because it's a direct link to a sign up form :/
good job I quoted it then
Re: Prettier Forms
Posted: Tue May 10, 2011 5:04 pm
by EcazS
Lose the roundness, inset them and reduce the outer shadow then maybe
Re: Prettier Forms
Posted: Wed May 11, 2011 11:23 am
by Kamal
I was going to post a screenshot, but then read this. oh well..
EcazS wrote:
Lose the roundness, inset them and reduce the outer shadow then maybe
I'll try