Thursday 6 September 2012

how to Create a web page free


              How to Create a web page




CREATING A WEB PAGE ROLLOVER (IMAGE READY)

 



Use the following general workflow to create a set of rollover buttons.
You can make rollovers using layer-based slices or layer-based image maps.
1. Create the content for the Normal state. 
If you are creating a rollover button, start by creating the button as you want
it to look when the page is first loaded in a web browser. Make sure to put
each button in a set of rollover buttons in a separate layer so that you can create
a layer-based slice or image map.
If you plan to completely replace the contents of the Normal state (as opposed to modifying the layer’s style), create contents for other states in other layers.
2. If using image maps, make each button a layer-based image map.
Choose Layer > New Layer Based Image Map Area. You’ll need to add each state, including the first state. See To add a rollover state (ImageReady).
3.If using slices, make each button a layer-based rollover button.
Click the Create Layer-Based Rollover button on the Web Content palette. ImageReady creates an image-based slice and adds the Over state to the Web Content palette. See To create a layer-based slice for a rollover (ImageReady).
4.Add rollover states. 
Create additional rollover states as needed, or change the default Over state automatically created by the layer-based rollover button. See To add a rollover state (ImageReady) and To change a rollover state.
5.Edit the layer content for the state to create the rollover effect. 
Select the state you want to work with in the Web Content palette. You can apply and change layer styles for each state, change the position of content in each layer, or change the visibility of a layer. If you are replacing the contents of one layer with another, make the first layer invisible and the second visible for that state.
For more information on changes you can make to each state, see Editing layers in rollover states and animation frames (ImageReady).
You can use layer styles to create instant rollover effects. When working with layer-based slices, you can also save the series of states as a rollover style. 
If you are creating a remote rollover, target the remote slice to the selected state.
Use the Pickwhip icon in the Web Content palette to point to the slice that contains the image for the remote rollover. See To create a remote rollover 
6.Optimize the image.
Choose a file format for the image and set optimization options in the optimization palette. See To optimize an image for the web.
7.Preview the rollover. 
Preview the rollover in ImageReady as you create it. Then preview it in various web browsers used by your audience. See To preview rollovers (ImageReady).
8.Save the rollover.
Save a web version of your rollover using the File > Save Optimized command. Make sure that the output settings are set to save an HTML page along with the image files. ImageReady will write the JavaScript code for the rollover in the HTML page.

No comments:

Post a Comment