INFO 3435- E-COMMERCE

Rachel Yen Chong

2-02-2013

EXPRESSION STUDIO INTRO

What is the Microsoft Expression Studio software suite?

tools for designing and building web and Windows client

applications and rich digital media contents.

The Microsoft Expression Studio suite consists of:

Microsoft Expression Web: Website designer and HTML
editor.
Microsoft Expression Blend + SketchFlow: Visual user
interface builder for XAML or HTML applications.
Microsoft Expression Design: Raster and vector
graphics editor.
Microsoft Expression Encoder: Digital video encoder for
authoring VC-1 and H.264/MPEG-4 AVC contents.

EXPRESSION WEB 4

Expression Web can design and develop web

pages using XML, CSS 2.1, ASP.NET or
ASP.NET AJAX, XHTML, XSLT, PHP and
JavaScript.

ACQUIRING MS EXPRESSION STUDIO 4

The complete Microsoft Expression Studio

software suite can be downloaded free of charge
from the Microsoft Dreamspark Premium
Go to UWI DCIT website> Facilities> Scroll down
to DreamSpark> Download Agreement Form
Print and sign 2 copies of the form
Drop off both forms at the department to be stamped.
Once signed give forms to Mr. Naresh Seegobin.

EXPRESSION WEB TUTORIAL

Creating a website

Creating web pages

Adding content to pages

Previewing web pages

CREATING A WEBSITE

A website is simply a group of related files and

folders under one main folder.

Creating a website:
1. Site> New Site
2. From tool bar Click New Site button

There are a number of options when creating a

new website including creating a website using a
premade template.
For now create an new empty website

CREATING A WEBSITE

This action creates an empty folder.

This folder represents our website

All our web pages, images and other resources

such as css files will be stored in this folder as
part of our website

CREATING WEB PAGES

Expression Web allows the creation of a number

of different types of pages

Html, aspx, asp, php, css, xml, javascipt, dynamic

web templates etc.

To create a new page:

File > New > Page
Select Page type: HTML
Press ok
Next we need to save the page and give it a name
File > save
Name the page index.html to represent our home
page

10

ADDING CONTENT TO WEB PAGES

Expression Web is a powerful WYSIWYG editor

This means there is no need to type html code
Works much like a word processor interface
Allows users to drag and drop elements directly onto
the web page.

Lets try it:

Add a heading
Paragraph
Subheading
Numbered list
Bulleted list

11

PREVIEWING THE WEBSITE

It is important when designing web pages to

continually test your pages in multiple web
browsers to ensure they work and appear as
intended
The same page does not necessarily display the
same way in different browsers.
Expression Web provides a preview feature that
allows you to preview your pages in all the
different browsers installed on your computer
and in multiple different window sizes.

12

PREVIEWING THE WEBSITE

To preview the web page:
File> Preview in Browser (or use toolbar icon)
> Choose the Browser version and screen size

Shortcut: F12 , previews in the last browser you

tested in.

13