logo

Web Pages

Interactivity

You can include interactive elements in Web pages eg:

Rollover images

You can create rollover images in Dreamweaver by choosing Insert, then Image Objects, then Rollover Image and the following window will open:

It looks best if you use two images that are the same size. You don't have to put anything in the "When clicked, Go to URL:" box if you don't want to. Below is the rollover image obtained from these two images:

chinese_food1.jpg
chinese_food2.jpg
Chinese Food

Rollover image, with link to http://www.buffet-island.com/

Rollover buttons

You can create your own rollover buttons. Here I have created two simple buttons which I have named bitesize_up and bitesize_over.

bitesize_up
bitesize_over

 

Once you have created your buttons, go to Dreamweaver and choose Insert, then Image Objects, then Rollover Image and the following window will open. You can see how I created the rollover button on the right, which also links to the BBC Bitesize Web site for ICT:

Rollover button

 

Embedding a Google map into a website

You can embed a Google map into your website. Ensure that the map you'd like to embed appears in the current map display. Click on the Link icon in the top-left of the page.

In the box that appears, copy the HTML under 'Paste HTML to embed in website,' and paste it into the source code of your website or blog. If you'd like to adjust the size of the map before you embed it, just click Customize and preview embedded map, select your preferred size, and take a look at the preview map. Once you're happy with what you see, copy the HTML that appears in the box at the bottom of the window.

View Larger Map 

Embedding a YouTube video into a website

You can embed a YouTube video into your website. Click on Share and then Embed and then copy the HTML code and paste it into the source code of your website or blog.

 

BBC News video about Education in Finland. Children in Finland do the least number of class hours per week in the developed world, and get the best results. An Education Manager at Nokia says they want the education system in Finland to continue "to keep a very good level in mathematics, science and technology-related subjects".
They don't have that culture of comparing schools. If a school is not doing well, it is not closed down. It is given more resources. In contrast to the UK, Finland's school teachers are trusted... "their system's success is built on the idea of less can be more; when you have relaxed schools free from politicians where nobody gets left behind".

Embedding an FLV video file into a website

You can easily insert video into your web pages using Dreamweaver CS4. First of all you need your video as an flv file. You can use an encoder to convert the video to an flv file. Once you have your flv file go to Insert in Dreamweaver, then Media, and then chose FLV... This window will appear:

Where it says URL: click on Browse... to find your flv file.

Where it says Skin: you can choose what user controls you want. Here I have chosen a Clear Skin.

You will need to click on the Detect Size button. Here it detected that my video was 320 x 240.

You can choose whether or not to have the video Auto play and/or Auto rewind.

 

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player