Royalton Hartland High School Web Design WEBSITE DRAGSTER IMAGES.

Slides:

Advertisements

Similar presentations

DREAMWEAVER Welcome to our website!

Advertisements

Web Page Design Using Tables Here you see three examples of how tables can be used to organize your content. We call this page layout or design. You can.

Creating a eportfolio Mrs Bhayat. Setting up a website When you open Dreamweaver you have to set up a site and you do this as you are shown above. You.

Microsoft FrontPage Monday January 28, The Basic FrontPage Setup.

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.

LDTC Workshop 3 Web Design II: Beyond the Basics.

Tutorial … Creating a Website 1.Create Website folder and image folder 2. Put all images in your image folder 3.Open Notepad (Windows) or Open TextEdit.

How to Post Blogs in WordPress Note: these steps and screen shots were taken while using a Mac. While Macs are still different from PCs, the steps and.

$1 Million $500,000 $250,000 $125,000 $64,000 $32,000 $16,000 $8,000 $4,000 $2,000 $1,000 $500 $300 $200 $100 Welcome.

Start -> All Programs -> Classes -> Web Expressions -> Dreamweaver.

Navigation Design. From the Brookfield Zoo, IL  (from Zoo)

Introduction to Education E-Portfolio. Word Document Example Link to Colleen McCabeColleen McCabe Word Document Instructions –Open a new word document.

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

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

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

Chapter 3 Dreamweaver: Part I The Web Warrior Guide to Web Design Technologies.

INTRODUCTION TO DREAMWEAVER 8. What we already know…  Design basics  Contrast  Repetition  Alignment  Repetition  HTML.

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.

Create Your Own Webpage. Fun with images Today we’ll cover –Working with images Including an image on your page Making the image a link Editing images.

Chapter 4 Adding Images. Chapter 4 Lessons Introduction 1.Insert and align images 2.Enhance an image and use alternate text 3.Insert a background image.

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

Defining a Website. Review…. Page Title −The text that will be displayed in the title bar of the browser window on a web page File Name −What you “call”

DREAMWEAVER Adding photos and other tips!. Making photo gallery  Gather ALL the photos you need into your images folder. (remember to copy the URL so.

Website Development with Dreamweaver

ADOBE WEAVER WEB DESIGN. START THE DW 2 WORKSPACE LAYOUT Application Bar Document Toolbar Document Window Workspace Switcher Property Inspector GroupPanel.

Year 7 Web page project Learn to make web pages using Dreamweaver.

Dreamweaver Edulaunch Project 1 EQ: What are the key concepts when building the first page of a web site?

Adding Graphics to Web Pages. CSS does not have any properties specifically aimed at formatting images Use properties you have already learned, i.e.,

 Remember that HTML is just text  Need to point to pictures  Use the img tag  alt: › screen reader › REQUIRED for this class and to validate.

Using Lycos TRIPOD Create Your Own Website. Go to the Lycos Tripod website located at address:

Language Club KompoZer Design View. Files you will need  Images  pages  Templates  Text.

Resizing Images CS 268. Where to start? Pictures (of course)  Need to down size them for the web.  Pictures taken with a 10 mega pixel camera are usually.

Moodle with Style Integrating new technologies to empower learning and transform leadership.

Sports Website Creation. In this project you will design and produce your own website.

Creating a navigation bar in Fireworks. Setting up the canvas Open Fireworks and choose a canvas size big enough to fit the buttons on you are going to.

Colors and backgrounds The following CSS properties will be explained: 1.color 2.background-color 3.background-image 4.background-repeat 5.background-attachment.

Chapter 2 Working with Images and Links. Chapter Objectives Insert and align an image Change the workspace Add borders and margins to an image Copy page.

7/8/04 1 Web Project Phase 3 - Sketches Use pencil and paper to sketch the layout of the pages in your web site Considerations – Placement of text? – Placement.

Making Websites with Dreamweaver BTT. What is Dreamweaver?  “What You See Is What You Get” (WYSIWYG) web design software  Rather than writing code and.

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.

Project Two Adding Web Pages, Links, and Images Define and set a home page Add pages to a Web site Describe Dreamweaver's image accessibility features.

Web Design (8) Images (2). My Holiday Photos An exercise in adding and linking images. Create a new website folder calling it ‘My Holiday Photos’. In.

Writing a Web Page. Using Frontpage FrontPage is a user-friendly WYSIWYG html editor. To begin, open the program and a new page. FrontPage is a user-friendly.

Adding a background image with CSS- The absolute basics CIT WINTER SEMESTER 2014 PRESENTED BY COLBY GRIFFITHS.

Colors and backgrounds The following CSS properties will be explained: 1.color 2.background-color 3.background-image 4.background-repeat 5.background-position.

Dawn Pedersen Art Institute. What Are CSS Sprites? Back in the day, sprites were the images in games that swapped one little image for another in a specific.

Adding Images to Your Web Page Web Design Section 5-7 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development.

Microsoft Expression Web-Illustrated Unit F: Enhancing a Design with CSS.

1 After completing this lesson, you will be able to: Understand the basics of HTML coding. Use HTML tags. Plan an HTML site. Create a table with HTML.

Web Authoring with Dreamweaver. Unit Objectives  Be able to define keywords: HTML, HTTP (protocol), browser, web server, client/server, tag, attribute,

Marquees and Tables. Tags Fun Stuff Here! Creates text that scrolls from right to left! Animated text. This is a great tag but does not work on every.

Home page Web page link 1 Web page link 2Web page link 3Web page link 4.

1 Place Your Photo AND Logo on Your Home Page Website Manager Tutorials.

 Pictures  Page backgrounds  Element backgrounds (list items!)  Link displays (arrows)  List markers.

HTML Comprehensive Concepts and Techniques Second Edition Creating Frames on a Web Page.

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

Tutorial: How to Creat a Website.

Your GIMP Portfolio Final Site.

Eform Generator.

Dreamweaver – Project #1

How to make a website in dreamweaver a website

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”

Page plans A01 Design.

Presenter Mindy Pistol Ext

Lesson Objectives Lesson Outcomes

Cheat Sheet CSCI 100 JW Ryder

Cheat Sheet CSCI 100 JW Ryder

ICT – Y11GCSE Unit 4 – Web Site Design – Practical Task (3 lessons)

Wheelers clubs Your site will consist of 3 pages:

Presentation transcript:

Royalton Hartland High School Web Design WEBSITE DRAGSTER IMAGES

CO2 Dragster Procedure New - Index page (Home Page) 10 Thumbnail Sketches 3 Rough Drawings 1 Final Drawing Measurement Limitations Prototype Production Pre-race Test Race Evaluation New - Links

1 large image per web page: 640 pixels x 480 pixels Thumbnails for any other 160 pixels x 120 pixels – link to larger 640x480 Use tables to organize text and photos. Border=1px This is an instructional website, not a picture gallery! Must fit on one screen (no scroll bars)

1. Your website in a folder: “Last Name Dragster”. 2. Html files in the main folder. 3. Main page MUST be titled “Index.html” 4. Images in a separate folder named “Images” 5. Buttons in a folder named “Buttons” 6. Keep all other images (.psd, unused images) in a folder elsewhere.

1. Window, Properties 2. Page Properties button 3. Background Image, Browse Background Image, No Repeat, 100% Window Size

4. Code or Split 5. Look for background-image

6. Put the following code after your image. 7. background-image: url(Images/Race%20Background.jpg); background-repeat: no-repeat; background-size: 100%, 100%