Designing A Home Page Using Dreamweaver CS4
Adobe Dreamweaver Creative Suite 4 (CS4) is a commercial web editor used popularly for the designing of a website that enables us to design a more complex website systematically and in the easier way. The editor WYSIWYG (what-you-see-is-what-you-get) lets you create your page visually. While designing your home page what you see on the screen is what you will get when your site is loaded on a web browser. As far as the designers make use of WYSIWYG editor, the site created is with standards- compliant code for web pages.
Well, we know that the designing process is started with ‘Home Page’, which is the most important page of a website. So let us throw some light on how to design a home page with Dreamweaver CS4, step by step -
Step 1 – Dreamweaver by default generates two column web page and a horizontal bar lies at the top of the page called “Header”, where you will have the name of your website written. Below the header, you will have two columns, narrow-left column called ‘Sidebar’ and wide-right column for ‘Main Content’.
Step 2 – Right above the header on the left side is a section labeled “Title” with a box containing “Untitled Document”. The text entered in “Untitled Document” box will appear as the title of your web page on search engines as search results. It is the same text that is shown by a web browser in its title bar of the window when your page is displayed on it. Though the text is not shown elsewhere on the body of the web page.
Step 3 – Now comes the designing of the visible part of web page. This can simply be done by clicking somewhere in the word “Header” after which a blinking cursor appears. This cursor behaves exactly like the cursor on MS Word or MS Office. Or else, you can make use of arrow keys, DEL or backspace keys also to delete characters.
Step 4 – Once you are done with the above, replacing the “Main Content” section of web page with the real content does not remain a big thing. It’s simple. Delete the existing content and enter the content you want it to present on the site.
Step 5 – Now, when you will scroll down to the bottom of the page, you will locate a horizontal bar labeled “Footer”. You can replace the word Footer with any thing you would want to include like Copyright notice, legal disclaimer, sitemap or things alike. For example, You can insert the copywrite symbol easily, just by clicking “Insert | HTML | Special Characters | Copyright” in the menu.
Step 6 – Once you have done everything on the page with Dreamweaver CS4, click “File | Save As…” to save the work done by you. Then a dialogue box will appear where you will have to type “index.html” into the File name. Now, click the “Save” button.
In these six easy steps, you will have your home page of the website designed nicely using Dreamweaver CS4.