NEWSFLASH!

Hi guys,

Hopefully you read some fun and helpful stuff here. This blog is mainly aimed at the novice, mediocre and pretending to be advanced css student. If you have comments, questions or anything don't hesitate to post them. If you are completely new to css, you might want to have a look at a free tutorial of a former student of mine, although it's not a book, it should teach you the basics to give you a head-start in building your very own website.

Any ways enjoy your stay guys,

If it's not here maybe on a new blog somewhere with a decent editor. or if you lads are really generous on a commercial website :)

Cheers!



Cssfreakie



Thursday, March 3, 2011

Setting up your local testing environment

I am by far an expert on setting up a server, but than again I do not dream of being a hosting provider. Though for some of you the following might be nice to consider doing.Setting up a local server is easy, efficient and cheap, in fact it's free.

Running a local test environment allows you to created and debug code at a faster pace than you would by uploading all the time. Besides that it's also much more secure since the test settings are aimed at reporting all errors, while on a live site you want to suppress those errors and store them in a separate file instead of outputting them in the browser.

You can perfectly use other stuff, but what I use works as a charm so why wouldn't you use it?

Download and install wamp
Wamp is a great if you have no idea how to set up a server but you really want one and you don't want to pay a penny. Wamp will automatically install Apache, mysql and php on your system. It comes with some extra stuff like phpmyadmin which is a great interface for a database development. It also has a great debugger  (nice for php)

Download and install Netbeans
Netbeans is also free, and it's by far the best text editor I have every worked with. I use the php version of it. The nice thing is that it will give tips and hints while typing, and it's pretty easy to set up the testing environment.

Ones you made a project all you need to do is go to project properties and make sure you have something similar as the following:
make sure you copy the files to your wamp folder and put short tags off. (short tags are bad!) Next: go to the tab Run Configuration and look if your settings look like below:
If it all looks good you are ready to go.
Just press <shift>+<F6> (short-cut for tab Run) when editing a file and your browser should start and show what you are doing.

Something to remember though this won't work if you didn't start up your server. And sometimes you might want to use 'Scan for external changes' (under tab Source) in case you added a new version of an image.
You could as well right click the folder and choose refresh.

Happy coding!

Cssfreakie

Tables: a persistent 20th century plague

Although it's the year 2011 some people are still using <tables> for purposes other than displaying data in an ordered way such as a spreadsheet with multiple columns. I have a feeling this is caused by some infected tutorials which seems to be still out there and maybe even by some ancient books ("what are books daddy?...Dead trees son").

Build a template with <div>'s
Not only is the mark-up much easier to read when using <div>'s but it also separates content (which tables are) from your template. But <div>'s are not always suitable to make a nice form or a multi column address box, without causing divitis (a practise to use more div's than needed). You might agree with that, but that doesn't mean we have to use the extra complexity and unreadability of a tabular design.

Use good styled lists for forms.
A good styled <dd> or <ul>- list is perfect and less chaotic than a form made with tables.
Although this might require you to do some floating, in the end the mark-up will be much easier to read and you need less code also. Check out for instance the nicely made forms from woofoo.

Use tables for data
Now this may sound stupid but if you are going to use tables, use them what they intended for. A nice article on nice tabular design can be found here.

Don't forget to leave a comment :)

cssfreakie

Edit: soon i'll post an article how to use something other than tables for something simple as a media-box (a rectangle with an image and some text) because it seems people also use tables for that.

CSSFREAKIE TO THE RESCUE

Hello everyone,

After quite a while I thought I make my own blog to help out people in there quest in writing better css. Although there are quite some blogs out there It can't harm to share experience in a more distilled way. This blog is aimed at beginners till mediocre experienced writers of strict (x)html and css.

If you have requests or questions feel free to leave them in the comments and i will have a look at them when i have some spare time.

happy coding!

cssfreakie

P.s. if you have tips or advice on my language or grammar let me know, English is not my mother language