Web Design Part I. Click Menu Site to create a new site root.

Slides:



Advertisements
Similar presentations
1 FrontPage 2000 Online Tutorial The following tutorial aims to help you get started with FrontPage 2000 for the creation of basic web pages. The different.
Advertisements

Chapter 1: Introduction. Contents Whats New in Dreamweaver CS4? The Dreamweaver CS4 Interface Setting Up a Site Creating a Web Page Adding Text to Your.
Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Dr. Dawn Sherry Dr. Barry J. Monk Assistant Professor of.
Create your site in the folder Rosary in your My Documents Folder.
Project 8 Creating Style Sheets.
UNIT 12 LO4 BE ABLE TO CREATE WEBSITES Cambridge Technicals.
HTML Concepts and Techniques Fourth Edition Project 6 Using Frames in a Web Site.
Advance CSS (Menu and Layout) Miftahul Huda. CSS Navigation MENU It's truly remarkable what can be achieved through CSS, especially with navigation menus.
Ch. 5 Web Page Design – Templates and Style Sheets Mr. Ursone.
Lecture Cascading Style Sheets (CSS) Internal Style Sheets Classes.
Putting Your PowerPoint into WebCT. To put your PowerPoint online Create an appropriate folder Upload the PowerPoint file to that folder Create a link.
A02 Creating my website NAME ______________. UNIT 2 – A02 – Creating my Website The purpose of this assessment objective is to create 5 web pages containing.
Introduction to Nvu Jing Fu. What is nVu? Free web design and development tool WYSIWYG (/wiziwig/) software Other similar tools: Dreamweaver, Googlepages.
Using Dreamweaver getting started 1)Start in your “My Documents” folder 2)Create a new folder called “website” 3)Create a sub folder called “images” 4)Start.
Organizing Content by Using Dreamweaver CS5 Domain 5.
Web Design HTML, Frontpage, DreamWeaver μέρος β ΠΡΥ019 - Πληροφορική Δρ.Βάσος Βασιλείου.
CIT 256 Organizing Large Websites: Divs, DW Templates Dr. Beryl Hoffman.
Dreamweaver Learning to be a web design master! By: Mr. Brunton.
Tutorial 6 Creating Tables and CSS Layouts. Objectives Session 6.1 – Create a data table to display and organize data – Modify table properties and layout.
Creating A Simple Web Page. Step 1- Open Dreamweaver & Create A New Page (File New) and blank.
Creating a Website. Unit Objectives Plan a website Create a folder for website management Set up a website Add a folder to a website Save a web page Copy.
Microsoft Expression Web - Illustrated Unit B: Creating a Web Site.
Web Design Dreamweaver Semester 2 ATBs. ATB #1 What is a web site?
Advanced CSS - Page Layout. Advanced CSS  Compound Selectors:  Is a Dreamweaver term, not a CSS term.  Describes more advanced types of selectors such.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
Dreamweaver – Setting up a Site and Page Layouts Web Design Section 7-2 Part or all of this lesson was adapted from the University of Washington’s “Web.
Macromedia Studio 8 Step-by-Step MACROMEDIA DREAMWEAVER 8 Project 2: Banking Site.
MIS 201 Web Design. Website Planning Before even considering the practical aspects of creating a website, there are some important fundamental questions.
Eat Your Words! Creating webpage Layout. CONTENT The Layout of a Webpage HEADER FOOTER Each of these sections represents a ‘div’ (or divider). By linking.
Web Technologies Website Development Trade & Industrial Education
Website Development with Dreamweaver
HTML Concepts and Techniques Fourth Edition Project 6 Using Frames in a Web Site.
Dreamweaver MX. 2 Overview of Templates n Templates represent a web page design or _______ that will be common to multiple pages. n There are two situations.
Moodle with Style Integrating new technologies to empower learning and transform leadership.
Learning How to Make a PowerPoint Presentation A tutorial for novice users.
Course ILT Forms and queries Unit objectives Create forms by using AutoForm and the Form Wizard, and add or modify form headers and footers Open and enter.
Creating a rotating image banner Activity 7 Procedure Creating AP Elements 1.Start Dreamweaver and select the ‘Hong Kong Scenery’ web site. 2. Create a.
MIS 201 Web Design 1. Website Planning Before even considering the practical aspects of creating a website, there are some important fundamental questions.
Web Design I Spring 2009 Kevin Cole Gallaudet University
INTRODUCTION TO DREAMWEAVER CS SOFT. OVERVIEW  DreamWeaverCS5.5  Defining a site  Site files  Authoring views  Property Inspector  AP Divs.
Web Foundations WEDNESDAY, NOVEMBER 20, 2013 LECTURE 32: DREAMWEAVER SLIDE SHOW AND GOOGLE MAP.
Creating a Dynamic Web Page Template Module 5: Beyond the Basics with Expression Web LESSON 10.
Using Frames in a Web Site Project 6. Project Objectives Project 6: Using Frames in a Web Site 2 Define terms related to frames Describe the steps used.
Introducing Dreamweaver. Dreamweaver The web development application used to create web pages Part of the Adobe creative suite.
CIT 256 CSS Intro & Dreamweaver Built-in Layouts Dr. Beryl Hoffman.
1 Creating Links Lesson 2. 2 In the center column type : Home | Order Now | Contact Us This is the navigation button which will link to the other pages.
Document Control Template Editors Brad Adamczyk Template Editor Bands Bands create document layout Header, data, footer Order not critical.
Web Site Development - Process of planning and creating a website.
HTML and CSS HTML is used for the content of web pages CSS is used for the style of the web pages You are going to learn how they can be combined to create.
Positioning Objects with CSS and Tables
1 Preparation for site Create a folder in MyDocuments: beavercheese. Create a subfolder, images Classes, career, DW beginner Download.
Practice for Chapter 3: Assume that you are a freelance web designer and need to create a website to promote your freelance company.
Web and Multimedia Development Copyright © Genetic Computer School 2007WM LESSON OVERVIEW  Use of Tables  Creating Tables  Try It – 1  Creating.
Creating Web Pages with Links, Images, and Embedded Style Sheets
Creating a Google Site For a Digital Portfolio Purpose.
Before We Begin Please download the files from as we will be using them in our walkthroughs.
Dreamweaver – Setting up a Site and Page Layouts Web Design Section 7-2 Part or all of this lesson was adapted from the University of Washington’s “Web.
INTRODUCTION ABOUT DIV Most websites have put their content in multiple columns. Multiple columns are created by using or elements. The div element is.
CASCADING STYLE SHEET CSS. CSS stands for Cascading Style Sheets Styles define how to display HTML elements Styles were added to HTML 4.0 to solve a problem.
Cascading Style Sheets (CSS) Internal Style Sheets Classes
Dreamweaver – Setting up a Site and Page Layouts
CSS Layouts: Positioning and Navbars
Dreamweaver – Setting up a Site and Page Layouts
>> CSS Layouts.
Unit I: Collecting Data with Forms
How to Embed Videos into Powerpoint
Pages.
Making a website.
A02 Creating my website NAME ______________.
Step 1:. Open Microsoft FrontPage application.
Presentation transcript:

Web Design Part I

Click Menu Site to create a new site root

Set a folder in your computer Name the site and create the folder –click select to finish. Create one images folder inside and select. Select

File –Create HTML and Save as index

Create CSS new rule Always specify Compound (based on your selection)

Insert Div Tag and create CSS

Layout CSS and a Div Tag is now visible The first web page is created and must name as index

CSS Rule Definition – specify width

Box Property Setting the margin for the wrapper - put zero to the Box Property

New DIV and Rule for the header The header DIV goes inside the wrapper DIV – insertion before end of the tag

Click the CSS panel button to add Rules

Repeat the process for additional DIV’s The navigation DIV – insertion after tag of the header

CSS Rule setting from the CSS panel next

Adding Left column DIV and Right column DIV The column DIV’s – specify to float left or right inside the BOX property

Click the CSS Rules to edit the specific DIV’s

your queries All course materials are available in BbVista for download Specifically download and review creating web templates presentation.