Web developers are always trying to create attractive and functional websites. If you are using a content management system you need no special knowledge of web technologies to create basic pages. But sooner or later you need to modify layout or some part of the website for which there are no settings in the user interface. Modifying code means knowing basics of HTML, CSS, JavaScipt, PHP and other languages used for websites. If you are new to this world you will need some tutorials and introductory texts to learn basics of web technologies.

However, there is another way of learning with possibility to experiment and test various modifications of the code or layout. It is called reverse engineering and means examining code of an existing page. Every web browser has a function to display the source code of displayed page. By examining it you can see what elements are needed to construct the web page. This is a great way to learn HTML and CSS language. Of course, examining and understanding how it works is one thing, creating your own project is another. The easiest way to start writing code is to make small modifications on your website. For this purpose you need a development installation on your home server, because experimenting with a live website is not a good idea. Depending on the system used for your site you will have to find files which contain the code for the page under examination. There is no general rule, but the main core of the page layout is probably in some template file.

This approach of examining the source code is also useful when you find a page with some fancy design or cool menu. To understand how it is done you need to find appropriate part of the code. Firefox, for example, has a nice feature to display only the source code of a small part of the website. You simply select the page elements you are interested in, click the right mouse button to display a menu and select View Selection Source. Once you find source lines responsible for the wanted page element, you can study them and try to implement something similar on your website. This doesn't mean that you can copy the code directly, you will have to modify it to be compatible with your existing website. But the basic principle is that you examine existing code and experiment with small modifications. If you combine this approach with web resources explaining theoretical background of web technologies, you will be able to quickly understand and learn new languages and technologies.