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.

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 2: Building a Building a Web Page Web Page By Bill Bennett Associate Professor MSJC CIS MVC.

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.

Microsoft FrontPage Monday January 28, The Basic FrontPage Setup.

Learning the Basics – Lesson 1

CHAPTER 7 STYLING CONTENT WITH CASCADING STYLE SHEETS.

Project 8 Creating Style Sheets.

Creating and Editing a Web Page Using Inline Styles

FrontPage Express By John G. Summerville Ph.D.©, RN.

Chapter 8 Creating Style Sheets.

Web Design with Cascading Style Sheet Lan Vu. Overview Introduction to CSS Designing CSS Using Visual Studio to create CSS Using template for web design.

Dreamweaver Cheat Sheet CSCI 100 – JW Ryder. CSCI 1002JW Ryder - Dreamweaver Notes Initial Site Set Up Goto W:\ drive – This is your web root directory.

 Share assignments and files  Student and parent home access  Announcements  Classroom information.

Chapter 3 Working with Text and Cascading Style Sheets.

XP Information Technology Center - KFUPM1 Microsoft Office FrontPage 2003 Creating a Web Site.

Web Content Management System Website Maintenance Demonstration Introduction to Macromedia Contribute Jamie Uprichard.

ETT 229 Fall 2004 Web Design Basics II. Agenda 11:00-11:05 – Quiz 14 11:05-11:50 – Web Design Lecture 11:50-12:15 – Web Design Practice 2.

Web Page Design Tips & Tricks Layering Choose Insert – Layout Objects – Layer Click anywhere along the outline of the layer box to select it Click &

ETT 429 Spring 2007 Web Design I.

INSTRUCTIONAL SUPPORT SERVICES (ISS) SHORT COURSE, FALL 2012 UMSL Introduction to Web Page Design.

Microsoft Office © Copyright William Rowan Objective By the end of this you will have being given a brief introduction to: Microsoft Word Microsoft.

With Alex Conger – President of Webmajik.com FrontPage 2002 Level I (Intro & Training) FrontPage 2002 Level I (Intro & Training)

Review of last session The Weebly Dashboard The Weebly Dashboard Controls your account and your sites Controls your account and your sites From here you.

Working with Text and Cascading Style Sheets Adobe Dreamweaver Chapter 3.

Understanding HTML Style Sheets. What is a style?  A style is a rule that defines the appearance and position of text and graphics. It may define the.

Designing a Classroom Web Site Using NVU Beginning Level.

Introduction to Nvu Jing Fu. What is nVu? Free web design and development tool WYSIWYG (/wiziwig/) software Other similar tools: Dreamweaver, Googlepages.

 Using Microsoft Expression Web you can: › Create Web pages and Web sites › Set what you site will look like as you design it › Add text, images, multimedia.

HTML Concepts and Techniques Fourth Edition Project 3 Creating Web Pages with Links, Images, and Formatted Text.

Web Design Dreamweaver Semester 2 ATBs. ATB #1 What is a web site?

Macromedia Dreamweaver CS4 Tutorial. Example of the website1 folder & images folder inside Create a folder on your computer called website1 to hold all.

Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.

Using Dreamweaver. Slide 1 Dreamweaver has 2 screens that do different things The Document window where you create your WebPages The Site window where.

Creating an Expression Web Site

Web Technologies Website Development Trade & Industrial Education

XP New Perspectives on Microsoft Office FrontPage 2003 Tutorial 4 1 Microsoft Office FrontPage 2003 Tutorial 4 – Using Shared Borders and Themes.

How To Use Google Docs. 1. Go to the Google Docs website a) Go to b) Sign in using your username and password.

Wikispaces Tutorial Adapted from a slideshow by: Jennifer Carrier Dorman

Website Development with Dreamweaver

Targeted Training, LLC. APPLYING STYLES DOWNLOAD FREE TRIAL OF ADOBE CONTRIBUTE ADOBE CONTRIBUTE CONNECTION WIZARD ENTERING EDIT MODE WEB PUBLISHING PROCESS.

HTML presentation Embedding Graphics in Web Pages n HTML uses an empty tag called the (image tag) n n n or n n n Note: all web production tools do insert.

XP Dreamweaver 8.0 Tutorial 3 1 Adding Text and Formatting Text with CSS Styles.

Just A Few More Fun Objectives 1 Having Some Fun With Java Script 2 Using Style Sheets.

JAOIT 8.  Dreamweaver is a program for creating web pages and managing websites without having to type HTML code.  WYSIWYG – What you see is what you.

Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady1 Using FrontPage to Enhance Blackboard 1.Introduction 2.Starting FrontPage 3.Creating Documents.

How to use Microsoft Word. Where can I find Microsoft Word? How to select, copy and paste information Go to the document from which you wish to copy the.

Wikispaces in Education Tutorial Fatema Kashoob Nawal ALKathiri

© 2011 Delmar, Cengage Learning Chapter 3 Working with Text and Cascading Style Sheets.

HTML GUIDE Press F5 and then Click on the links on the left to get to the section you want Section 1: Getting Started Section 2: Moving Banner Section.

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

Tutorial 3 Adding and Formatting Text with CSS Styles.

HTML Concepts and Techniques Fifth Edition Chapter 3 Creating Web Pages with Links, Images, and Formatted Text.

Creating and Editing a Web Page

1 Preparation for site Create a folder in MyDocuments: beavercheese. Create a subfolder, images Classes, career, DW beginner Download.

Creating and Editing a Web Page Using Inline Styles

Building a Website: Layout Fall Overall Structure: Home Page Title Section Title Frame Picture UNCP Math Menu Content Footer Contact Information.

Creating Web Pages with Links, Images, and Embedded Style Sheets

Creating Web Pages in Word. Sharing Office Files Online Many Web pages are created using the HTML programming language. Web page editors are software.

Connecting From Home Editing at Home(You don’t have to.)

Learning the Basics – Lesson 1

USING DREAMWEAVER Contents: Assigning a Root Folder

Your First & Last Name (Make sure you capitalize your first and last name!) Follow these instructions: 1. Center your name on the slide (use the “Centered”

Module 6: Creating Web Pages and Working with Channels

Cheat Sheet CSCI 100 JW Ryder

Working with Text and Cascading Style Sheets

USING DREAMWEAVER MX 2004 Contents: Assigning a Root Folder

Cheat Sheet CSCI 100 JW Ryder

Basic Web Page Creation

Exercise 9 Skills You create and use styles to create formatting rules that can easily by applied to other pages in the Web site. You can create internal.

Presentation transcript:

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 Biology Assistant Professor of Mathematics Assistant Professor of Biology Assistant Professor of Mathematics MACON STATE COLLEGE MACON STATE COLLEGE MACON STATE COLLEGE MACON STATE COLLEGE

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk What is Nvu? Nvu is an Open Source Web editing application that allows WYSIWYG (What You See Is What You Get) editing and creation of web pages. Nvu can be downloaded for free at

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk The Anatomy of a Website At the most basic level, a website is nothing more than a collection of files and folders. It is a good practice to put some thought into the organization of your website before beginning. the index.html file is the default "starting page" folders help keep the site organized

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Setting up Webspace You can manage your sites and edit your publish settings through the Site Manager The Publishing address can be a folder on your hard drive or an FTP folder that publishes directly to the web

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Adding Text

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Adding Images Before adding an image, it is necessary to place the image file in the site directory. To add an image, click the "Image" button to bring up the Image Properties dialog box. Click "Choose File" to select the file from the hard drive Enter alternate text for pictures for ADA compliance

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Creating Links Links tie together content from different sources. A link can be to another file in your site, a general webpage from the Internet, an image, an address, or just about anything else. Link Another File in Site General Webpage Address ImageOthers

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Creating Links To create a link, highlight the text that contains the link and click the "Link" button. Either choose a file in your site to link to or type an Internet address.

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Creating a Table To create a table click "Insert" on the menu toolbar and then select "Table" You can then highlight the number of cells you want.

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Organization Content Style Style Fonts, Spacing, Alignment, Colors Content Text, Images, Links, Tables Organization How many pages are needed, Types of pages, Navigation from page to page

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Built-in Style Elements in Nvu: Page Color & Backgrounds You can change the page color and background by clicking "Format" on the menu toolbar and selecting "Page Colors and Background..."

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Built-in Style Elements in Nvu: Text Toolbar The text toolbar allows you to select text and assign certain properties to it. Text Color Text Highlight Smaller Text Bigger Text Bold, Italicize Underline Numbered or Bulleted List Alignment In/Out- dent

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Built-in Style Elements in Nvu: Paragraph Format The paragraph pull-down menu allows you to change to different heading styles.

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Style of Website CSS Driven HTML Driven Two Different Style Philosophies Each formatted element must be given an appropriate tag. Whole parts of each page are labeled and styles are applied to those labels.

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk CSS – Cascading Style Sheets A cascading style sheet is a way of centralizing all style information for a website. It allows you to define a particular style so that different styles can be assigned to different parts of the website.

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Creating a Style Sheet and a New Style The next few slides will take you through the procedure for creating a style sheet and defining a new style called important_text. This style will make text...

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Creating a Style Sheet To start using a style sheet, click on Tools and select CSS Editor. A dialog box should appear:

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Creating a Style Sheet Click on Style elt. and on the right you should see: Title is the name of the style sheet. You can have as many style sheets as you want – each corresponding to a different look for your website.

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Creating a New Style Type a name for your style sheet and click on Create Stylesheet. You are now ready to define a style that goes in your style sheet. You do this by clicking on Rule

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Creating a New Style Click "named style" and then enter the name "Important Text". Once you're done, click "Create Style rule". Your style should then appear under "internal stylesheet" in the left panel.

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Creating a New Style The only thing left to do to create the important_text style is to set the options. Click on important_text in the left panel and then the "Text" tab to set the text options.

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Creating a New Style For our style, let's select the predefined Ariel, Helvetica, sans-serif Font Family, red as the Color, Bold as the font weight, and Overline and Underline as the Text decorations. When you are done, click "Close"

Nvu - How to Create Your Own Website From Start to Finish!Dr. Dawn Sherry & Dr. Barry J. Monk Using Your Defined Styles To use a predefined style, select the text: and click on the pull-down menu that has "(no class)" in it, and select "important_text".