3.9.15 How are tables used in web design?. A table (FIVE THINGS TO KNOW) 1. Is made up of columns and rows 2. Has cells where columns and rows intersect.

Slides:



Advertisements
Similar presentations
DREAMWEAVER Welcome to our website!
Advertisements

Chapter 3 – Web Design Tables & Page Layout
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.
Designing Websites Using HTML and FrontPage A Typical Webpage View Source A webpage is a text file containing instructions to tell a computer how the.
KompoZer. This is what KompoZer will look like with a blank document open. As you can see, there are a lot of icons for beginning users. But don't be.
CREATE A WEBPAGE WEB DESIGN. EXAMPLE LAYOUT 2 WEB COMPONENTS Header Banner and logo Footer Copyright information or Address Horizontal Navigation For.
 Steps how to design a web page using Microsoft Frontage Steps how to design a web page using Microsoft Frontage  Video related to the topic Video related.
CIS101 Introduction to Computing Week 07. Agenda Your questions JavaScript text Resume project HTML Project Three This week online Next class.
CIS101 Introduction to Computing Week 07. Agenda Your questions Resume project Review Project Two HTML Project Three This week online Next class.
Basic Web Publishing BA209 Arturo Perez-Reyes. Web is a communication protocol The Internet is A net of nets That use the TCP/IP protocol To publish on.
© 2005 Lawrenceville Press Slide 1 Chapter 3 The Dreamweaver Workspace.
Start -> All Programs -> Classes -> Web Expressions -> Dreamweaver.
Creating Tables in a Web Site Using an External Style Sheet HTML5 & CSS 7 th Edition.
A02 Creating my website NAME ______________. UNIT 2 – A02 – Creating my Website The purpose of this assessment objective is to create 5 web pages containing.
 Helps you create individual pages according to your thumbnail plan  Helps you organize your web pages and links according to your organizational chart.
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.
Creating Tables in a Web Site.  Define table elements  Describe the steps used to plan, design, and code a table  Create a borderless table to organize.
Dreamweaver Tables Mrs. Wilson. Prior Knowledge –What HTML tags were used to create a table? –Why are tables an important web development tool? –Predict:
Dreamweaver Learning to be a web design master! By: Mr. Brunton.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
Creating Tables in a Web Site
Using Dreamweaver. Slide 1 Dreamweaver has 2 screens that do different things The Document window where you create your WebPages The Site window where.
CITY UNIVERSITY / Vysoká Škola Manažmentu.:MG Information Systems :. © Martina Cesalova, 2005 MS FRONTPAGE 1 1.Open FrontPage – View -> Page 2.Open.
Chapter 3 Dreamweaver: Part I The Web Warrior Guide to Web Design Technologies.
Creating your Webpage with tables. This is a 2 column by 1 row table!
Web Technologies Website Development Trade & Industrial Education
Using FrontPage Express. Slide 1 Standard toolbars and menus Time indicator: gives an approximation of download time of the page.
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.
Adobe Dreamweaver CS3 Revealed CHAPTER FIVE: USING HTML TABLES TO LAY OUT A PAGE.
Open Dreamweaver Start All programs Adobe design and web premium Adobe Dreamweaver.
G053 Lecture 12 Introduction To HTML Mr C Johnston ICT Teacher
Web Page Development: Part II Heather Rasmussen (801) Heather Rasmussen (801)
Creating Tables in a Web Site
Domain 3 Understanding the Adobe Dreamweaver CS5 Interface.
Dreamweaver MX BTA3Open. Dreamweaver MX Application used for creating web sites Homepage must always be saved as index.htm All files names must be in.
1 Creating a Second Web Page This section shows you how to create the Huntington Beach Web site.
Language Club KompoZer Design View. Files you will need  Images  pages  Templates  Text.
Moodle with Style Integrating new technologies to empower learning and transform leadership.
Bike and Hike Skills: Graphics, Image Maps, Photo Galleries, Layers.
CITY UNIVERSITY / Vysoká Škola Manažmentu.:MG Information Systems :. © Martina Cesalova, 2005 MS FRONTPAGE 2 1.Create a new document 2.Save as L/bsba/IS330/yourfolder,
Dreamweaver I Stanford Workshop Your Presenter: Dr. Laura Silberstein
We Are Learning To (WALT): To create a working homepage for our websites What I am Looking For (WILF): A completed homepage containing a working navigation.
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.
Updated on: September 4, 2010 CIS67 Foundations for Creating Web Pages Professor Al Fichera.
HTML Concepts and Techniques Fifth Edition Chapter 4 Creating Tables in a Web Site.
By: Ms. Abeer Helwa 1. WORD WEB APP 2 Word Web App is a limited version of Word, enabling you to edit, format, and share documents online. Word Web App.
A New Page to Add-On Your Multimedia Page. Creating a New Page Open up a new Windows Notepad Click File > Save As > My Computer > “your flash drive” Name.
Introducing Dreamweaver. Dreamweaver The web development application used to create web pages Part of the Adobe creative suite.
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.
Web Site Development - Process of planning and creating a website.
This shows CIS17 and the first day introduction..
Open the index.html Open this PowerPoint from the S Drive IDT folder Chapman Images.ppt.
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.
Announcements Academic Writing Workshops For International Students in Information Technology Wednesdays (starting April 25) 12:30 - 3:30 PM Werner University.
Web and Multimedia Development Copyright © Genetic Computer School 2007WM LESSON OVERVIEW  Use of Tables  Creating Tables  Try It – 1  Creating.
HTML Comprehensive Concepts and Techniques Second Edition Creating Frames on a Web Page.
G053 Lecture 12 Introduction To HTML Mr C Johnston ICT Teacher
Making the website. Get your folders sorted first Create a new folder in “N” called “My hockey website” Create folders inside called “Documents”, “images”
Chapter A - Getting Started with Dreamweaver MX 2004
How to make a website in dreamweaver a website
Enhancing a Document Part 1
Enhancing a Document Part 1
Assignment #15 “My Timetable”
Creating Tables in a Web Site
Dreamweaver Basics.
A02 Creating my website NAME ______________.
Step 1:. Open Microsoft FrontPage application.
Presentation transcript:

How are tables used in web design?

A table (FIVE THINGS TO KNOW) 1. Is made up of columns and rows 2. Has cells where columns and rows intersect 3. Is used in basic HTML layouts to organize and arrange 4. Can have it’s own set of properties for each cell 5. Is customized by merging and dividing cells

How to create a table? Place the insertion point where you want the table to be Click Insert Menu>Table Input the width* of the table, number of cells and columns The width can be one of two things: 1.Specific amount of pixels 2.A percentage of the width of the area

Today’s Assignment 1. Copy your website folder to the Desktop or plug the flash drive with your folder into the computer 2. Import your site into Dreamweaver 3. Create a new blank HTML file 4. Save the page as: webwork.html 5. Modify the page background 6. Insert your banner head at the top of the page 7. Insert a new table with 700 pixels width, 2 columns and 8 rows 8. Modify the table so that it matches the example on the next slide

SAMPLE TABLE TO MATCH BELOW THIS IS MY FIRST MARKING PERIOD WEB WORK Click on the title for each project to see what I completed HTML Hand Coded Site I made this three page site using just Notepad and basic HTML commands. Place a photograph of yourself in this area…..should be a portrait photograph NOT A LANDSCAPE PHOTO My Web Banner Head I created this in Photoshop and am using it on every page of this site. My Rosario Dawson Background This page shows how a large image can be used as a background. Gabrielle Union Background This page is another example of my using Photoshop on a large image to create a background. My Own Background I took a photo of myself and turned it into a large no scrolling background. Hip Hop Image Map This page shows my Image Mapping Skills in Dreamweaver