IT Connect
Your connection to information technology at the UW

Web Design Phases

Web Design Phases

Like any large project, Web design can be thought of in terms of distinct phases. When engineers build a bridge, they pour concrete before they add road striping and street lights. The steps for making a good and easy-to-manage Web site are analogous, although they are not always so obvious or discrete.

The Construction Phase

Returning to our bridge analogy, this phase in Web design is like adding re-bar and concrete: it sets the foundation for your site.

The Construction Phase involves actually creating content and constructing a layout and initial user experience. This is when you plan and take the content from your planning and turn it into a functioning Web site.

  1. Web Site Planning
    This workshop will help you organize your thoughts and your content. This workshop is like going to construction management school for the web.
  2. HTML
    This workshop will familiarize you with the basic building blocks of the web publishing world: HTML. This workshop is like learning how to pour concrete on the web.
  3. Adobe Dreamweaver I
    If writing HTML code isn’t so great for you, Adobe’s Dreamweaver Web Design program might be able to help you in a more point-and-click fashion. You will probably want to learn HTML at some point, but when you’re first getting started, Dreamweaver offers a lot of beginners a light at the end of their Web-design tunnel. This workshop is like learning how to operate a cement truck on the web.
  4. CSS
    This workshop will show you how to take your HTML and make it look beautiful. This workshop is like learning how to paint for the web.
  5. Adobe Dreamweaver II
    The Advanced Dreamweaver (Dreamweaver II) class does for CSS what the first Dreamweaver class does for HTML. That is, if writing CSS code isn’t your idea of fun, then you can use Dreamweaver to help. You will probably need to know HTML and you’ll want to learn CSS eventually, but the topics from Advanced Dreamweaver are enough to get your Web site looking good fast. This workshop is like learning how to operate a paint-gun for the web.

Extra Features Phase

Once the concrete is poured, what comes next on a bridge? Street lights, traffic signs, and sidewalks, of course!

The Extra Features Phase is designed to give your site the features that maybe aren’t critical to delivering your content but that are nonetheless important in delivering an engaging and effective Web site. This is when you take your content from the Construction Phase and turn it into an interactive and dynamic body of content.

  1. Podcasting/Vodcasting I and Podcasting/Vodcasting II
    Podcasting and vodcasting is a way of syndicating audio and video, or other content to your users. If you give lectures or publish media content on a consistent basis, publishing a Podcast allows your users to receive new content without having to visit your site: it is delivered to them as soon as you post the content.
  2. JavaScript
    JavaScript is a method of interacting with your visitors’ web browser. It allows you to manipulate the content and the styling of content. JavaScript is the technology behind image rollovers, form validation, and visual interaction. When combined with a technology like PHP, JavaScript forms the basis for AJAX: loading dynamic content from the server without reloading the page.
  3. PHP I
    PHP is a method of interacting with data on your Web site’s server. It allows you to manipulate content based on data received or stored on the server. It allows you to receive data from your users and interact with that data in useful ways. When combined with a technology like MySQL, PHP can interact with databases to select and manipulate large amounts of information quickly and easily.

Advanced Features Phase

Once the street lights are working and the sidewalks are cured, the bridge is going to need a toll both, medians, and emergency phones. The bridge has to be easy to maintain and able to handle a lot of traffic easily.

The Advanced Features Phase is designed to make your life as a Web developer easier and to provide greater functionality with your ability to interact with user data.

  1. MySQL Installation
    Before you can use a database on your Web site, you’ll need a database server. PHP can interact with a number of different database servers. Among the most popular is MySQL, a free and open-source server that you can install on your UW Web site with a few easy steps. This workshop also covers some of the basics of good Database design and the basics of writing Database queries.
  2. PHP II with MySQL
    Once you have a database server, you need a scripting language to act as a proxy between the database server and your users. While not your only option, PHP is an industry-standard language used by many large Web sites (including Wikipedia, Digg, and many others) to interact with databases. This workshop covers connecting to your database Server and retrieving and using data based on input from your users.

Combining all these workshops forms the basis for a large, dynamic, and easy-to-maintain Web site. There are, of course, other technologies that can and often do go into a large Web site. Wherever applicable, the Web Publishing series makes an effort to provide alternatives or additional sources of information or other methods for accomplishing tasks. The point is not to overwhelm you but rather to point you in the right direction if our way of solving a task is not applicable to your situation.

Flowchart of the Series and Related Workshops >>