I have completed a layout (in photoshop) for a website. I'm just wondering what my next step is...?

Question

I know it has something to do with coding and uploading it to a server. But I'm not too sure how exactly what steps/programs/etc. I have bought and registered a domain name.

The layout is very basic and includes just the frontpage (not any other pages) and buttons that I plan to use for navigation.

Answer 1

First, you need the right tools:

Any text editor (the code view of Dreamwever is reasonable, with some good autocompletion and syntax highlighting, but it is expensive, I tend to use JEdit instead (its free)), and some browsers for testing.

FireBug is an excellent debugging tool for CSS and JavaScript while the Markup Validator is useful for finding syntax errors in the HTML.

http://jedit.org/
http://www.getfirebug.com/
http://validator.w3.org/

Good learning and reference resources can be found at:
http://www.htmldog.com/
http://www.w3.org/TR/html4/
http://www.w3.org/TR/CSS2/
http://developer.mozilla.org/en/docs/Main_Page
http://nefariousdesigns.co.uk/archive/2007/01/learning-javascript/
http://developer.yahoo.com/javascript/

Beware of W3Schools as, despite their name, they are not affiliated with the W3C and their content has MANY errors.

Software which attempts to bring a WYSIWYG approach to web design is fundementally flawed. The HTML language is about structure and semantics and trying to represent that graphically is very very difficult. CSS is the presentation language for the WWW, but it doesn't lend itself to a point and click approach either.

If you click a given point, are you talking about a point relative to the viewport? The top of the document? The paragraph you are in? Something else? What units are you talking about? Pixels? Points? Percentages? The current font size?

CSS lets you describe all these things, and your choice will effect how the page adapts to different browsers (with different window sizes and font sizes).

If you really want to go down the not-really-WYSIWYG route, then Dreamweaver is one of the least worst choices available. Another almost reasonable choice is Nvu, which is somewhat more affordable.

http://www.nvu.com/index.php

Answer 2

Upload all the graphics and HTM pages to the website. Make the main page named Index.htm and you should be fine.

Answer 3

Have you added your slices?

If so, jump to imageready and save optimized.