How to draw a template for the website

In network there is a huge number of templates for the websites, but they have one shortcoming – they are not unique. If the owner of the website does not want the design of its website to repeat somewhere else, it can order a template from the professional designer or try to create it independently. It is required to you • - Adobe Photoshop program. Instruction 1. Creation of own template is not such a difficult task as can seem at first sight. For work you will need the Adobe Photoshop program – certainly, it is necessary to have at least the main ideas of work with it. But before starting the program and to begin to create, it is necessary to think over future design in advance. It is the most convenient to do it so: at first get acquainted at least with one hundred ready templates, evaluate their merits and demerits. Pay attention to successful solutions of any given elements of design. It does not mean that you will copy them, but to take some beautiful and convenient solutions as a basis quite reasonably. 2. On the basis of the analysis of others templates and own creativity you should make idea of how your website will look. It is the best of all to do approximate sketches of future design by colored pencils on normal sheets A4. It is necessary to get to work with the Photoshop only after you represent clearly that you should draw. 3. Start the Photoshop, create the new project of 1200х1600 in size, install a transparent background. Turn on the Ruler tool if it is not switched on yet, for this purpose click Ctrl+R key shortcut. Include a binding: "Viewing" — "Binding". 4. Now it is necessary to separate a template by guides which will show borders of its elements – sides, columns, etc. For example, you want to separate so a template that at the left there was a narrow column, on the right – wide to the right edge of a template, and above there was a place for a cap. Means, you need three vertical lines (the left border of a template, right and the line between them) and the horizontal, showing the lower bound caps. To install the vertical line, bring the cursor to the left ruler on the left side, click V and, holding a key, draw the line to the right place. Also arrive with two other vertical lines. Horizontal are under construction similarly, the top ruler is only used. 5. Find a background for your template, it should be the small picture with the repeating drawing. Open it in the Photoshop, select, copy. After that insert into a template so many time how many it is required for its filling with a background. The insert is made so: "Editing" - "Insert" then you draw the section of a background to the right place. To insert the image the Ctrl+V command even quicker. In the same way add a background for a website cap. You can use for creation of a background and different graduated fills. 6. By means of the Pencil tool draw template lines, being guided by already drawn lines (that is over them). You received a basis of the simplest template, now it is necessary to add it with the necessary details – navigation buttons, menu lines, the different decorating elements, etc. How to create buttons and other elements, it is better to read in the relevant articles devoted to work with Adobe Photoshop. 7. The template is created, now it is necessary to cut it on pieces for their insert in a HTML page. For cutting use the Slice Tool tool. To find it, click the right mouse button the Frame tool and select "Cut" in the opened menu. Now you can cut out a template as necessary, then save: "File" - "Save for Web". In the opened window select type of files: HTML&images, enter a file name: index.htm also save it. You will have a index.htm file and the images folder with the cut images.