Building a website with Web Premium CS4 – Introduction

This tutorial series teaches you how to plan, set up, create, and deploy a website using software that's included with the Web Premium edition of Adobe Creative Suite 4. You'll also learn how to use Adobe BrowserLab, a service that tests web pages hosted by your website in a variety of operating systems and web browsers, and InContext Editing, a service that allows you to add and update content from directly within a web browser. The website is for a fictional travel services company, Adventure Tours. It includes a home page and pages to market the company's products.

What you'll learn

The Adventure Tours tutorial series includes 14 tutorials:

• Part 1: Planning the website explains how to plan the site's functional and technical requirements.
• Part 2: Creating a local site shows you how to install the required server software and use Dreamweaver to define a local site.
• Part 3: Creating a remote site demonstrates how to set up a production site and link your local files to the site in Dreamweaver.
• Part 4: Creating a visual design examines the Photoshop comp to see how the design team used best practices to meet the requirements identified in Part 1.
• Part 5: Slicing and exporting site assets with Fireworks explains how to use Fireworks to translate a visual design built in Photoshop into modern HTML and CSS.
• Part 6: Adding styles to finalize the page design demonstrates how to create a modern page layout in Dreamweaver CS4.
• Part 7: Finalizing and reviewing the home page steps you through the process of using Photoshop Smart Objects to update the header banner, adding navigation links, and testing the design with Adobe BrowserLab.
• Part 8: Creating a database shows you how to design and create a database in MySQL.
• Part 9: Presenting dynamic data details how to query and present data from a database on a PHP page using Dreamweaver.
• Part 10: Adding Ajax functionality with Spry shows how to return data from PHP in XML format, and present layered web pages with the Ajax-based Spry framework
• Part 11: Creating an interactive web form demonstrates how to accept input from a website visitor and dynamically generate a view of their selected data.
• Part 12: Creating and presenting a Flash animation explains how to use Flash to create an interactive web presentation.
• Part 13: Adding video to the website steps you through converting video files for use on the web and incorporating the videos into a finished web page.
• Part 14: Creating a blog with InContext Editing details how to set up a page for browser-based updates with Dreamweaver and InContext Editing.

Note: You can work through all of the tutorials from start to finish or, in most cases, you can work through individual tutorials independently of the others.

What you'll need

This tutorial series is designed to demonstrate how Creative Suite 4 Web Premium and Adobe technologies and services can help you streamline the process of building a website from start to finish as well as maintaining the finished site. To complete the tasks demonstrated in this series, you will work with the following software:

• Adobe Dreamweaver CS4
• Adobe Photoshop Extended CS4
• Adobe Fireworks CS4
• Adobe Flash Professional CS4
• Adobe Acrobat Professional 9

You'll also install and configure local versions of the server software used to host the finished website. The easiest strategy is to use a software bundle that includes Apache (the web server), PHP (the application server), and MySQL (the database):

• (Windows) WampServer
• (Mac OS X) MAMP

You'll also use the following Adobe online services to test and update the site:

• Adobe BrowserLab
• Adobe InContext Editing

Finally, each part of this tutorial series includes a set of files you'll use to complete the tasks.

This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License

About the authors