Now that doesn't mean to say I'm totally against this style of design. But what I am against is people who just mimic the style and call it their own original design. I might be wrong here, but I feel that this design trend has caused laziness amongst the design community, causing many designers to just add some gloss and get rid of an element or two. What I don't like are sites that are incredibly upfront about their web 2.0 style, the ones with a huge amount of glossy buttons and no really design originality.

An upcoming trend is that of simplicity and I for one hope that it aids the destruction of web 2.0 style sites. I just feel like saying to all of these people who copy a million and one tutorials on glossy sites to go and get some design sense!

@ElliotJayStocks has talked about this subject quite a lot and he too believes that Web 2.0 must die!

What I am saying is that in a way this style of design is making the design community stupider, think about it, so many clients will ask for a web 2.0 style site without really understanding what it means.

This isn't really much of a post, more of a rant, but I just wanted to make clear that I hate web 2.0 - and you should too! That is all.

I can understand why, as the founder of a certain group, you might get excited about getting 10,000 members, but I doubt that if your group was for a worthy cause you might make a checklist of what membership number you want to achieve. When creators aim for such high numbers is it just because they want to see that people care? Possible. But as I said I am far more cynical than all of that. Groups that expressly ask you to invite all your friends by copying and pasting some JavaScript code into the URL bar surely have some ulterior motive. What I can see emerging is a sort of voluntary spamming network.

Think about it. If you were to take a handful of groups and add together their memberships to say 1,000,000 people, you would have a good amount of people to spam. If you wanted to spam a certain set of people, you could take student groups and collectively spam them. I can see large shady businesses buying "admin-ships" from the creators of these groups, as to utilize the "Message all members" feature of the groups system. And think about it, this wouldn't just impact your Facebook account, no, because Facebook is automatically configured to email users whenever they are sent a message, and so it would filter down.

Now you might be thinking, yes but all these people could just leave the group. Sure they could. But if the attacks were well coordinated, you could send maybe 10 messages to every account you had access to in a minute? And that's the sort of thing that wouldn't even require a bot network. You could just copy and paste in the spam over and over. You would segment the attacks into a group by group basis and make sure you were targeting the right people.

I would advise you take this idea with a pinch of salt, because I can't see it happening in the near future, but I think it is important for us to be aware that such a network could easily be used to spam people. So what can you do to stop it? Don't join these stupid groups that say "If 250,000 people join I'll run round town naked", only join the ones that mean something to you and that you trust.

I designed the theme with those who travel in mind, so if you are taking a gap year to go traveling and you want to share the experience with all of your friends it is ideal. On the other hand you could use it for whatever, I like the light colour scheme and typography of the site, because it's really simple.

Any who I hope you enjoy it!

As you can see above there is a row of images which have been grabbed from the posts themselves and displayed in a nice little row. So just how did I do it? Well I used the old custom field functionality of Wordpress to make the image accessible to any part of my site. So instead of placing the image in the post itself I just stored it alongside it. The best thing is, it's really simple to do. So lets go ahead and do it!

First off you're going to need to create a custom field, doing so is really rather easy - all you need to do is go to either add, or edit a post and scroll down to "Custom Fields", as you can see below.

Go ahead and click on "Enter New" and name it "thumbnail". Then in the value field you will need to enter the URL of an image. So go ahead and upload an image and get the image URL for the field. Once you update the post the image will now be associated with your post. But to use the image we're going to need to use some code. To create the desired effect we are going to create a custom loop for the homepage. So copy and paste the code below into page where you want the images to be displayed.

Now for the above code to work you are going to need a folder entitled "js", with the image resizing script Thim Thumb as mentioned in this article, inside of it. So what does the code do? Well it grabs the 8 most recent posts and creates some links for them. We use the script to re-size the images so that they won't take ages to load and we then link to the posts they are assigned to. So up to now you should have a list of these images displayed - but on;y if the post includes the correct data! But we're not done yet.

We do have a list, but I can't say it'll look nice, so lets use some CSS to style this bad boy.

And that should make it look a bit better. Using this method we are able to give the user a choice as to how they navigate your website. They will now be able to make decisions based on the graphical content of the thumbnail and therefore, hopefully, be better informed.

Well say for instance you have two e-commerce sites that are essentially the same shop - one for your American audience, and one for the UK. Differences might include currency conversions and product listings, and it would be nice to be directed to the right site should you accidentally visit the wrong one. For example Crucial's website alerts the user with a nice little pop-up, asking them if they would like to visit their international site, as it were, as you can see below.

This sort of interaction is really beneficial to the user because it stops them making mistakes later on, and more importantly, it's easy to accomplish!

Now instead of presenting you with all the code, I'm going to tell you how I accomplished the desired effect - hopefully I'll make you actually think about how it works

So first off I visited this code snippet page to get my code for finding out where the user is. I then took the array filled with information and used an "if" statement to evaluate it. So something like...

The code above will initiate a JavaScript function if the user appears to be coming from the UK. This function would do anything you want really, I would suggest you use a nice pop-up box to alert the user, much like the one shown above, and then allow them to navigate to another site. I would argue against immediate redirection, because the reliability of a free database cannot be ensured, and you wouldn't want to be redirected to the wrong site without the option to navigate back, now would you?

As I said, this is a really easy way of determining where your users are, and making a decision based on that information. Users will thank you for helping them out, and admire the fact that you know where they live!*

*Users may not be impressed by this simple technique

Ways of avoiding this are simple, and one of the best ways to do so is by using one image for all of your navigational images within one image! Sound crazy? Well that's what we call a sprite. Using CSS sprites will reduce your web-page's loading time and greatly reduce the number of requests made by the browser, and that can only be a good thing. Many sites use this method to ensure their servers don't die altogether, for example Apple uses it for their primary navigation.

So lets go ahead and create a nice looking menu.

We will begin with the HTML.

So that will just create for us a simple unordered list that we can now manipulate using the CSS below (and don't forget to link to your CSS file).

So together that HTML and the CSS will create a rather lovely menu. To customize the menu you will need to create your own image and aligning it up with the values in the CSS. To view a live example of this visit the demo page.

So what are the real benefits of this method? Well first off it will speed up your site, and although you might not recognize the speed increase straight-away, on sites where daily visits are in the 100s of thousands, the fewer HTTP requests, the better. Also there are the obvious benefits of using images as opposed to text, for example post pictures, and nice roll-over effects.

To finish I'd like to mention one drawback - if you want to edit only one menu item, you will have to have access to the original file to edit it, and then upload it to your server. This can be annoying if you are working on somebody else's site.

Oh and by the way, you don't have to just restrict yourself to menus, many of the larger sites such as YouTube use huge sprites to hold nearly all of the images on their site. Such an approach can be annoying if you are constantly editing your site, but the pros received on a large site are huge and will usually outweigh the cons.

With CSS we can use a small bit of code to link our HTML pages to our style sheets - the meta tag. Well what if you're building a site and you want the same header on every page, without PHP you would just have to copy and paste the same code onto every page, and imagine if you had 100 pages when you decided you wanted to change a tiny detail. That would be a problem. But we can solve this problem with PHP using a simple require() function. For example...

The above code simply goes and grabs the file in between the quotations and replaces itself with it's contents. This can be really useful, and means that you only have to edit the one file to see your changes reflected across your site. But PHP is so much more than just something you can use to insert files, you can use it to do (nearly) anything!

PHP was originally created to produce dynamic content, the PHP code tells the server to do something and returns a HTML value. So say for instance, you may have once visited a site that was displaying the current time or/and date. There are many ways to do this, but one of the easiest, is with PHP. Let me show you.

Would output something like this: 31-01-10 / 19:23. The "echo" command basically produces text and sends it to the browser for rendering, while the gmdate() function gets the current GMT time. The code it encased with the two <?php ?> markers, which tell the server that it should look out for PHP to render. PHP is a powerful language which you can use for a plethora of solutions. My favorite part of PHP is the community. If you want to do something in PHP you will be able to find the solution easily. Furthermore it seems to me like the is a function for everything - want to know when a file was created? There's mktime() for that. Want to capitalize the first letter of a string? There's ucwords() for that! Want to make a cup of coffee? There's makeMeCoffee()! Well that last one may have been a bit of wishful thinking, but there really are a huge amount of functions that you can utilize off the shelf.

PHP is also really useful for security. If you've got a password that you want to encrypt, you can use the md5() function, which creates an incredibly secure hash which is nearly impossible to decrypt. Moreover, if you want to ensure only certain visitors can access certain pages, you can use $_SESSION[] variables to store bits of information accessible by any page of your site. Lastly, PHP can be used for databases, there is a detailed explanation of this over in my tutorial on building a CMS, and I believe it is one of the most useful features of PHP.

PHP is a really powerful programming language, and I recommend you learn it. A site I found very useful when I was starting off was Tizag, which will walk you through the basics. And when you're trying to solve a problem, sooner or later you'll end up over at PHP.net which is a fantastic resource, despite the slightly 90s look and feel to the site .

I use PHP all the time, as do solutions such as Wordpress and Facebook. It makes my life so much easier and opens up doors to things that I could never achieve without it. I urge you to learn it, and as always the best way to learn is through using the language, so go ahead and create something cool using PHP!

The first method works but is a little clumsy, take a look.

The code above would be placed in your CMS file and stops all images from getting bigger than a margin of 800px. Yes it works, but there are a number of problems with it. If I had a huge image, say 5000 x 5000px, then this method of resizing would mean my image would take a long time to load, this is because the browser still goes to get the huge image before resizing it - this is bad! I strongly recommend you don't use this method, but instead explore other options.

Well first off for images that are integral to your site, you should be able to re-size them using your original design, but for images that have yet to be uploaded and put on display on your site, I suggest the use of JavaScript. When I first began learning how to re-size images with JavaScript I believed that it was the only way, you see to do so you have to use a large amount of code and it requires you to have a good knowledge of JavaScript. However a very kind man who goes by the name of Tim McDaniels wrote a rather lovely script that we can use for resizing images. The script is called TimThumb and is really easy to use.

Head on over to Google Code and download it (or you could just use the URL provided by Google). Once you have uploaded it onto your own server you can start using it straight away. I find it really useful for use in blogs and as I mentioned above, in a CMS. So when you are ready you can implement it's functionality by replacing the URL of your image with the URL of the script and a bit of other info - see below.

The above code tells the script where your image is, the dimensions you would like it re-sized to, and that you would like crop the image while zooming - that's the little 'zc' parameter by the way. The way in which the script operates is this, it takes the image and all the information with it, and then creates a cache folder to store the image. It then creates the image and returns the URL of the resized image to be used in the 'src' attribute. The script offers some customization, for example you can change the directory the script saves the images to, so that they can be used again. Just see the documentation for details.

And that's it really! I just wanted to share that lovely script with you and ward you off resizing using CSS. Users will appreciate the shorted loading time of pages and I can assure you Google will too!

Note: I must apologist for the lateness and length of this article - I got caught up with other things, sorry and enjoy!

And so we've arrived at the last in this set of tutorials; if you've been following along, by now you should have a user system as well as a basic CMS. At the moment we have a very strong base for our CMS but there are still a few things that we need to talk about. Firstly style. I like to think of myself as a stylish kind of guy and I like to keep my work stylish to, so now were are going to implement some CSS to make our CMS at least moderately aesthetically pleasing. We are going to keep it simple and if you would like to change it feel free to do so, this is just a suggestion; in fact if you are intending on integrating this CMS into your own site, why not give it the same look?

Now before we get to the CSS you will need to copy the tiny bit of code below between your <head> and </head> tags of every page that you want styled.

That's the code for linking the CSS to the page. Right then let's just get this CSS out of the way. So go ahead and create a new file called style.css and paste in the following code.

Now that is quite a lot of code indeed. But really all it does is make our site more workable. Next I would like to talk about extending the functionality of this CMS. I am going to be using real world examples that I recently used on a client's site, so they should be relevant.

So let's take a step back and look at what we have done. We have created a CMS that allows users to signup and login. From the index page they can create new pages and edit existing pages. The changes that they make in a friendly noob-based environment as I like to call it, will be reflected on the live site. That's quite impressive. Visit any one of the site's pages and you are viewing dynamically generated content. This approach is excellent for us web designers, and the only people that love it more than we do, are the clients. Think about it, if you had a site that was supposed to display the latest technology news and you had to go through your web designer first, it would take some time, therefore making your site out of date quickly. Clients love the idea that they can easily edit and update the information on their site without needing to know anything technical. But wait! Before you go pitching to a client with the CMS above there are a few things you should know. If I bought a website with the CMS above I wouldn't be happy. Why not? Well because there are some things missing. Firstly think about the navigation in the backend. There is none! Moreover how do I add images and links? Remember I know nothing about code. To overcome such difficulties that you will inevitably face I recommend you work on their solutions.

When the client came to me and asked for a myriad of features I had a number of problems to sort out. Many of the problems I faced were solved using solutions listed in this series of tutorials. But instead of providing you with the exact solutions to some of them, I urge you to try to figure them out for yourself. Let's look at the image and link adding feature for example. Realistically it can be tackled head on very easily. What would we need? Well, we want the URL of the page to be linked to, and what the user wants to display as the link text. Then all we have to do is generate a bit of HTML with that information in it. Go ahead and try and combat the problem. You will need a form and a tip - I used some really simple Javascript to generate the HTML. Once the code is generated the user need only paste it into the editing field of the page.

Now let's discuss an advanced security feature. You could use this for a client who was particularly wary of being hacked. Look at the code below.

The code above gets the user's IP address and then uses a free service to retrieve some information. With that information you could compare the country the user is in to the country they usually login from, and if it differs ask them to provide some more information like an extra security code. Clients will be impressed by this sort of stuff, especially if you can make it work well and make it slick.

Lastly I want to talk about user details. This is a really simple subject area, but it is important. If your user signs up and accidentally spells their name wrong then they won't be able to change it, and that really isn't great. If you think about it to implement a profile editing page would be easy. I'll take you through the theory. You would create a new page and add a form not dissimilar to that of the form used to signup. You would then populate the form with $_SESSION variables, leaving the user free to edit them. When the submit button is clicked the database is updated and everything is great!

The things listed above may seem simple, but adding polish to a site's CMS is a good idea and a requirement if you are working on one for a client. In the end my client's CMS turned into a very powerful one, it looks lovely with a load of fancy icons and animations. I was able to work with the client and help them to achieve their goals because at the end of the day the CMS that I built - much like the one above - was extensible and flexible.

I hope you have enjoyed this series, I have worked hard to iron out any kinks in the code, but if you find one leave a comment below - I'll be most grateful. The same goes for any issues you have with the tutorial. If you have any questions at all, feel free to ask away below.

Now that's over, time for a coffee me thinks!