Wednesday, 29 April 2009

Introduction to creating a Website

An Introduction using Photoshop and Dreamweaver
The World Wide Web is a system of interlinked hypertext documents accessed via the internet. With a Web browser, one can view Web pages that may contain text, images,videos, and other multimedia and navigate between them using hyperlinks. The World Wide Web was started in 1989 by the English physicist Sir Tim Bernes-Lee, now the Director of the World Wide Web Consortium. A web page or a blog are used by designers these days to showcase their portfolios.
How Websites Work
Data is stored on a main server, the host. when you dial up and connect to the internet you are using your ip-address. You are in effect pulling data across.
"URL" Is the domain name.
.com- communication a global larger company.
.co.uk- hosted in the UK
.org- no profit possibly government or charity.

Saving
Make sure work is saved every few minutes, save in a hierarchy format. Name the file so it can easily be found, and inside separate each part of the task into separate folders. Everything done must stay in this file otherwise if anything is removed you have to re-link the whole website! Date all work(easy to find).
When saving; a vectored flat colour graphic use gif/png, or for a compression format or photograph use jpeg.

Sizing
Most websites work to the size 800 pixels x750 pixels
72 dpi-web
11pt is optium size for text on the net

Creating a Basic Website
*Always draw ideas down on paper first.
*Open Photoshop and file-new-document and customise to 800x600 pixels, and make sure the resoultion is set to 150dpi.
*To bring down the rules for drawing( apple R) or view-rules.
*Make a new layer for everything you do.
*Draw a set of buttons using the shape tool
*To turn headings to buttons, use the rule to make sure everything is aligned and then use the scalpol tool to each individual shape.(slices from guides)
*Highlight and delete the pieces you don't need (file-save for web)
*Select the parts you want as PNG-8, save to webfile format HTML and images.
*Open up Dreamweaver file-open,find website folder and open index file(first web site page)
*File-preview in browser apple12 shows you it live on the internet.
*Modify-page properties background colour and click colour pallete or move pipette over your background colour to match colours. Click ok for it to fill any side gaps with your background colour.
*Hypo link- activate buttons
*Open all windows, Window-properties, click on link and another window will open. Select file and click the page you want to link to it, that then makes it an active button.