HTML Lesson 7. Your assignment:

Save this PDF as:
 WORD  PNG  TXT  JPG

Size: px
Start display at page:

Download "HTML Lesson 7. Your assignment:"

Transcription

1 HTML Lesson 7 Tables are one of the biggest tools Web developers use to present data wherever they want data to go on the page. Like spreadsheets, rows go across (left to right) and columns go up and down. Each box is called a. You can put all kinds of data inside a (text images, movies, etc.) Your assignment: Part 1: Use the attached tutorial to make a NEW Web page that has eight different tables. But don t freak out: the source code for each table is given to you! The important thing for you to do is to figure out what each html tag does and how that tag changes the table. That will become obvious to you as you go along. Separate each table by using the tag. Part 2: On the bottom of your page, make one table that: 1. has three columns and four rows. Inside each table just put a name of a friend, pet, teacher or family member. 2. make one table with one row and two columns. Inside each column put a small picture inside. The source code for inserting an image inside a table would include: <td><img src= monster.jpg </td>

2 Table The table tag looks like this: <table>. All of your table information goes between these two tags to make up a table. All tables start with the <table> tag and end with the tag. Table row An individual row that contains at least one data. On this page I've used two data s. The tag looks like this:. Table data An individual in a table row. The tag looks like this: <td></td>. The table, table row, and table data tags always nest like this: <table><td></td> Here is an example of a table with rows and s: <--This is a row Border Adding this to your table tag lets you specify whether or not your table has borders. The table I've used for my page has no borders. Bgcolor You can add this tag to change the background color of your table, row, or table s. You can make each row a different color, even the different s can be different colors. Align This tag helps you align your text in the table, row or. If you don't add it, your image or text will be aligned to the left (it's the default). You can specify center or left to change the alignment. Valign This tag aligns your table vertically. If you don't change it to "top" or "bottom" your information in your table will be aligned vertically in the center. Cellpadding This sets the margins inside of your table s on all four sides of your. Cellspacing This sets the spacing between your table s. Rowspan Adding this creates a column that spans your rows vertically, it can span all or some of your rows. row 1 row 1 row 1 rows row rows row 2 row row 3 Colspan The colspan tag makes the data stretch over two or more columns. Lissa Explains it All Put These Tables in a New Web Page: How do I make a basic table? Here are some examples of simple tables. Different browsers don't show tables the same way, even if you use the same codes. <table border="1">

3 <td>cell 1</td> <table border="1"> <td>cell 1</td> <td>cell 3</td> <td>cell 4</td> How do I add a border to my tables? <table border="8"> <td>cell 1</td> <td>cell 3</td> <td>cell 4</td> How do I add color to my tables? <table border="8"> <td bgcolor="#00ccff">cell 1</td> <td bgcolor="#cc00ff">cell 2</td> <td bgcolor="#00ff00">cell 3</td> <td bgcolor="#ffff00">cell 4</td> How do I get rid of my border? Just add the tag border="0" to your table tag: <table border="0" spacing="0"> <td bgcolor="#00ccff">cell 1</td> <td bgcolor="#cc00ff">cell 2</td>

4 <td bgcolor="#00ff00">cell 3</td> <td bgcolor="#ffff00">cell 4</td> row 1 row 1 row 1 rows row 2 row rows row row 3 <table border="0" spacing="0"> <td bgcolor="#00ccff">row 1</td> <td bgcolor="#ffff00" rowspan=3>rows 1-3</td> <td bgcolor="#cc00ff">row 1</td> <td bgcolor="#00ff00">row 1</td> <td bgcolor="#00ff00">row 2</TD><td bgcolor="#00ff00" rowspan=2>rows 2-3</td> <td bgcolor="#00ccff">row 2</td> <td bgcolor="#ff33cc">row 3</td> <td bgcolor="#ff33cc">row 3</td> Lissa Explains it All <table border="0" spacing="0" padding="5"> <td bgcolor="#ffff00" colspan=4>lissa Explains it All</td> <td bgcolor="#00ccff"> 1</td> <td bgcolor="#cc00ff"> 2</td> <td bgcolor="#ff33cc"> 3</td> <td bgcolor="#00ff00"> 4</td> <td bgcolor="#ff33cc"> 5</td> <td bgcolor="#00ff00"> 6</td> <td bgcolor="#00ccff"> 7</td> <td bgcolor="#cc00ff"> 8</td> How do I set widths for my table? Just add the width tag with specific widths to your table tag. You can also specify percentages in the tag, for instance <width=30%>. Just make sure the widths and percentages add up to 100%.

5 Cell 1 Cell 2 <table border="0" padding="5" spacing="10" width="200"> <td bgcolor="#00ff00" width="50" >Cell 1</td> <td bgcolor="#ffff00" width="150" >Cell 2</td>

In this chapter, you will learn how to...

In this chapter, you will learn how to... LEARNING OUTCOMES In this chapter, you will learn how to... Create a table on a web page Apply attributes to format tables, table rows, and table cells Increase the accessibility of a table Style an HTML

More information

New Perspectives on Creating Web Pages with HTML. Considerations for Text and Graphical Tables. A Graphical Table. Using Fixed-Width Fonts

New Perspectives on Creating Web Pages with HTML. Considerations for Text and Graphical Tables. A Graphical Table. Using Fixed-Width Fonts A Text Table New Perspectives on Creating Web Pages with HTML This figure shows a text table. Tutorial 4: Designing a Web Page with Tables 1 2 A Graphical Table Considerations for Text and Graphical Tables

More information

Lecture 9 HTML Lists & Tables (Web Development Lecture 3)

Lecture 9 HTML Lists & Tables (Web Development Lecture 3) Lecture 9 HTML Lists & Tables (Web Development Lecture 3) Today is our 3 rd Web Dev lecture During our 2 nd lecture on Web dev 1. We learnt to develop our own Web pages in HTML 2. We learnt about some

More information

Web page design in 7 days!

Web page design in 7 days! Learnem Group presents: Web page design in 7 days! Lessons 1-7 By: Siamak Sarmady Start Here Copyright Notice : 2000,2001 Siamak Sarmady and Learnem Group. All rights reserved. This text is written to

More information

Learnem.com. Web Development Course Series. Learn em. HTML Web Design in 7 days! By: Siamak Sarmady

Learnem.com. Web Development Course Series. Learn em. HTML Web Design in 7 days! By: Siamak Sarmady Learnem.com Web Development Course Series Learn em HTML Web Design in 7 days! By: Siamak Sarmady L E A R N E M W E B D E V E L O P M E N T C O U R S E S E R I E S HTML Web Design in 7 Days! Ver. 2.08.02

More information

HTML5 and CSS3 Tables and Columns Page 1

HTML5 and CSS3 Tables and Columns Page 1 HTML5 and CSS3 Tables and Columns Page 2 2 3 4 5 6 HTML5 and CSS3 TABLES AND COLUMNS HTML Tables Tables are a systematic arrangement of data in and columns similar to a spreadsheet (e.g. Microsoft Excel):

More information

Father Agnel School, Noida Class X Ch6 HTML Part 2

Father Agnel School, Noida Class X Ch6 HTML Part 2 HTML Images - The Tag and the Src Attribute In HTML, images are defined with the tag. The tag is empty, which means that it contains attributes only, and has no closing tag. To display

More information

Coding HTML Email: Tips, Tricks and Best Practices

Coding HTML Email: Tips, Tricks and Best Practices Before you begin reading PRINT the report out on paper. I assure you that you ll receive much more benefit from studying over the information, rather than simply browsing through it on your computer screen.

More information

Joomla Article Advanced Topics: Table Layouts

Joomla Article Advanced Topics: Table Layouts Joomla Article Advanced Topics: Table Layouts An HTML Table allows you to arrange data text, images, links, etc., into rows and columns of cells. If you are familiar with spreadsheets, you will understand

More information

The Essential Guide to HTML Email Design

The Essential Guide to HTML Email Design The Essential Guide to HTML Email Design Index Introduction... 3 Layout... 4 Best Practice HTML Email Example... 5 Images... 6 CSS (Cascading Style Sheets)... 7 Animation and Scripting... 8 How Spam Filters

More information

HTML Tables. IT 3203 Introduction to Web Development

HTML Tables. IT 3203 Introduction to Web Development IT 3203 Introduction to Web Development Tables and Forms September 3 HTML Tables Tables are your friend: Data in rows and columns Positioning of information (But you should use style sheets for this) Slicing

More information

LaGuardia Community College 31-10 Thomson Ave, Long Island City, New York 11101 Created by ISMD s Dept. Training Team. Overview

LaGuardia Community College 31-10 Thomson Ave, Long Island City, New York 11101 Created by ISMD s Dept. Training Team. Overview Overview Dreamweaver gives you many options when it comes to setting the properties for your webpages. Within the "Page Properties" dialog box, you can set the appearance of your page, name your page and

More information

Web Editing Basics 2: Reference

Web Editing Basics 2: Reference Web Editing Basics 2: Reference We will be using the sample pages as a reference point for this training. They can be found on the Web Policy site: http://www.umkc.edu/web-policy/downloads.asp TOPICS 1.

More information

Basic HTML elements: Quick Reference

Basic HTML elements: Quick Reference Basic HTML elements: Quick Reference University of Bristol Information Services document web-r4 Document Information Format Conventions The following format conventions are used in this document: Computer

More information

Tutorial 5 Working with Web Tables

Tutorial 5 Working with Web Tables Tutorial 5 Working with Web Tables Objectives Explore the structure of a Web table Create headings and cells in a table Create cells that span multiple rows and columns Create row and column groups Add

More information

Sample Table. Columns. Column 1 Column 2 Column 3 Row 1 Cell 1 Cell 2 Cell 3 Row 2 Cell 4 Cell 5 Cell 6 Row 3 Cell 7 Cell 8 Cell 9.

Sample Table. Columns. Column 1 Column 2 Column 3 Row 1 Cell 1 Cell 2 Cell 3 Row 2 Cell 4 Cell 5 Cell 6 Row 3 Cell 7 Cell 8 Cell 9. Working with Tables in Microsoft Word The purpose of this document is to lead you through the steps of creating, editing and deleting tables and parts of tables. This document follows a tutorial format

More information

Caldes CM12: Content Management Software Introduction v1.9

Caldes CM12: Content Management Software Introduction v1.9 Caldes CM12: Content Management Software Introduction v1.9 Enterprise Version: If you are using Express, please contact us. Background Information This manual assumes that you have some basic knowledge

More information

Web Page Design Final Exam Review Page 1 of 7

Web Page Design Final Exam Review Page 1 of 7 Web Page Design Final Exam Review Page 1 of 7 Multiple Choice--Instructions: Circle the correct response. 1. Computers and networks allow people to. a. gather data and information b. analyze data and information

More information

Table of Contents Find out more about NewZapp

Table of Contents Find out more about NewZapp Table of Contents Why is email display an issue in email marketing?... 2 Expert Email Design... 3 Desktop PC and Apple Mac email applications... 4 Web and mobile device email readers... 5 Creating your

More information

Chapter 1: Outlook Isn t Going Anywhere... 2. Chapter 2: 17 Must-Know Tricks for Outlook 2007, 2010 & 2013... 3

Chapter 1: Outlook Isn t Going Anywhere... 2. Chapter 2: 17 Must-Know Tricks for Outlook 2007, 2010 & 2013... 3 Table of Contents Chapter 1: Outlook Isn t Going Anywhere... 2 Chapter 2: 17 Must-Know Tricks for Outlook 2007, 2010 & 2013... 3 Chapter 3: 3 Way to Remove Unwanted Gaps Between Tables... 12 Chapter 4:

More information

Web Developer Jr - Newbie Course

Web Developer Jr - Newbie Course Web Developer Jr - Newbie Course Session Course Outline Remarks 1 Introduction to web concepts & view samples of good websites. Understand the characteristics of good website Understand the importance

More information

This document will describe how you can create your own, fully responsive. drag and drop email template to use in the email creator.

This document will describe how you can create your own, fully responsive. drag and drop email template to use in the email creator. 1 Introduction This document will describe how you can create your own, fully responsive drag and drop email template to use in the email creator. It includes ready-made HTML code that will allow you to

More information

Introduction... 3. Designing your Common Template... 4. Designing your Shop Top Page... 6. Product Page Design... 8. Featured Products...

Introduction... 3. Designing your Common Template... 4. Designing your Shop Top Page... 6. Product Page Design... 8. Featured Products... Introduction... 3 Designing your Common Template... 4 Common Template Dimensions... 5 Designing your Shop Top Page... 6 Shop Top Page Dimensions... 7 Product Page Design... 8 Editing the Product Page layout...

More information

CHAPTER 10. When you complete this chapter, you will be able to:

CHAPTER 10. When you complete this chapter, you will be able to: Data Tables CHAPTER 10 When you complete this chapter, you will be able to: Use table elements Use table headers and footers Group columns Style table borders Apply padding, margins, and fl oats to tables

More information

NURSING 3225 NURSING INQUIRY WEB SITE DEVELOPMENT GUIDE BOOK

NURSING 3225 NURSING INQUIRY WEB SITE DEVELOPMENT GUIDE BOOK Nursing 3225 Web Dev Manual Page 1 NURSING 3225 NURSING INQUIRY WEB SITE DEVELOPMENT GUIDE BOOK Nursing 3225 Web Dev Manual Page 2 N3225: Nursing Inquiry Student Created Group Website Addresses (1 of 2)

More information

Create a Web Page with Dreamweaver

Create a Web Page with Dreamweaver Create a Web Page with Dreamweaver Dreamweaver is an HTML editing program that allows the beginner and the advanced coder to create Web pages. 1. Launch Dreamweaver. Several windows appear that will assist

More information

Introduction to XHTML. 2010, Robert K. Moniot 1

Introduction to XHTML. 2010, Robert K. Moniot 1 Chapter 4 Introduction to XHTML 2010, Robert K. Moniot 1 OBJECTIVES In this chapter, you will learn: Characteristics of XHTML vs. older HTML. How to write XHTML to create web pages: Controlling document

More information

Garfield Public Schools Fine & Practical Arts Curriculum Web Design

Garfield Public Schools Fine & Practical Arts Curriculum Web Design Garfield Public Schools Fine & Practical Arts Curriculum Web Design (Half-Year) 2.5 Credits Course Description This course provides students with basic knowledge of HTML and CSS to create websites and

More information

FOUNDATION OF INFORMATION TECHNOLOGY Class-X (TERM II)

FOUNDATION OF INFORMATION TECHNOLOGY Class-X (TERM II) Sample Question Paper FOUNDATION OF INFORMATION TECHNOLOGY Class-X (TERM II) TIME : 3 Hrs MM : 80. SECTION A 1. Fill in the blanks: [10] 1.1 is the extension of an XML file. 1.2 attribute is used with

More information

Merged Cell. End of Row Marker Cell

Merged Cell. End of Row Marker Cell Tables in Microsoft Word A table consists of rows and columns of cells that you can fill with text or graphics. When you insert a table, it is displayed as a grid, each section of which is referred to

More information

ADOBE DREAMWEAVER CS3 TUTORIAL

ADOBE DREAMWEAVER CS3 TUTORIAL ADOBE DREAMWEAVER CS3 TUTORIAL 1 TABLE OF CONTENTS I. GETTING S TARTED... 2 II. CREATING A WEBPAGE... 2 III. DESIGN AND LAYOUT... 3 IV. INSERTING AND USING TABLES... 4 A. WHY USE TABLES... 4 B. HOW TO

More information

Advanced HTML Authoring Using Tables

Advanced HTML Authoring Using Tables INFORMATION SYSTEMS SERVICES Advanced HTML Authoring Using Tables This tutorial workbook contains a series of exercises on creating tables in HTML documents using Macromedia Dreamweaver MX. AUTHOR: Information

More information

Web Page Layout. www3. www3 1

Web Page Layout. www3. www3 1 Web Page Layout www3 www3 1 1 Advanced Tables Tables are usually required if you want to apply a complex layout to a webpage You have to be confident with colspan and rowspan to make it work Proper planning

More information

Solutions. Ans. Ans. The NAME attribute is used to name the different sections of a Web page.

Solutions. Ans. Ans. The NAME attribute is used to name the different sections of a Web page. Chapter 6: Information Representation Method HTML-II Solutions Summative Assessment Multiple-Choice Questions (MCQs) 1. Web browsers display images in the following format: a. GIF b. XBM c. JPEG d. All

More information

Using econtentmanager s ewebeditpro Editor

Using econtentmanager s ewebeditpro Editor Using econtentmanager s ewebeditpro Editor econtentmanager comes with its own content editor, called ewebeditpro. With ewebeditpro, you can add and modify your page content with WYSIWYG ease-of-use. The

More information

Introduction to Web Design Curriculum Sample

Introduction to Web Design Curriculum Sample Introduction to Web Design Curriculum Sample Thank you for evaluating our curriculum pack for your school! We have assembled what we believe to be the finest collection of materials anywhere to teach basic

More information

Creating Web Pages with HTML Simplified. 3rd Edition

Creating Web Pages with HTML Simplified. 3rd Edition Brochure More information from http://www.researchandmarkets.com/reports/2248215/ Creating Web Pages with HTML Simplified. 3rd Edition Description: Are you new to computers? Does new technology make you

More information

HTML TEST. Multiple Choice Identify the choice that best completes the statement or answers the question.

HTML TEST. Multiple Choice Identify the choice that best completes the statement or answers the question. HTML TEST Multiple Choice Identify the choice that best completes the statement or answers the question. 1. What does HTML stand for? a. Hyper Link Markup Language b. Hyper Text Markup Logics c. Hyper

More information

SharePoint Basic Editing. Text. Creating List

SharePoint Basic Editing. Text. Creating List Text Putting Text on the Page 1. Entering text on the web page is just like typing in a word processing document. Lines will wrap within a paragraph. 2. Enter = Paragraph Break (leaves a blank line) 3.

More information

Tutorial 5. Working with Web Tables

Tutorial 5. Working with Web Tables Tutorial 5 Working with Web Tables Objectives Explore the structure of a Web table Create headings and cells in a table Create cells that span multiple rows and columns Create row and column groups Add

More information

Working with the new enudge responsive email styles

Working with the new enudge responsive email styles Working with the new enudge responsive email styles This tutorial assumes that you have added one of the mobile responsive colour styles to your email campaign contents. To add an enudge email style to

More information

Microsoft FrontPage 2003

Microsoft FrontPage 2003 Information Technology Services Kennesaw State University Microsoft FrontPage 2003 Information Technology Services Microsoft FrontPage Table of Contents Information Technology Services...1 Kennesaw State

More information

Intro to Web Design. ACM Webmonkeys @ UIUC

Intro to Web Design. ACM Webmonkeys @ UIUC Intro to Web Design ACM Webmonkeys @ UIUC How do websites work? Note that a similar procedure is used to load images, etc. What is HTML? An HTML file is just a plain text file. You can write all your HTML

More information

Microsoft Office 2010

Microsoft Office 2010 Word Tutorial 3 Creating a Multiple-Page Report Microsoft Office 2010 Objectives Work with a document s headings in the Navigation pane Create and edit a table Sort rows in a table Modify a table s structure

More information

Web Design Basics. Cindy Royal, Ph.D. Associate Professor Texas State University

Web Design Basics. Cindy Royal, Ph.D. Associate Professor Texas State University Web Design Basics Cindy Royal, Ph.D. Associate Professor Texas State University HTML and CSS HTML stands for Hypertext Markup Language. It is the main language of the Web. While there are other languages

More information

Contents. Downloading the Data Files... 2. Centering Page Elements... 6

Contents. Downloading the Data Files... 2. Centering Page Elements... 6 Creating a Web Page Using HTML Part 1: Creating the Basic Structure of the Web Site INFORMATION TECHNOLOGY SERVICES California State University, Los Angeles Version 2.0 Winter 2010 Contents Introduction...

More information

IE Class Web Design Curriculum

IE Class Web Design Curriculum Course Outline Web Technologies 130.279 IE Class Web Design Curriculum Unit 1: Foundations s The Foundation lessons will provide students with a general understanding of computers, how the internet works,

More information

HTML Fails: What No One Tells You About Email HTML

HTML Fails: What No One Tells You About Email HTML HTML Fails: What No One Tells You About Email HTML 2 Today s Webinar Presenter Kate McDonough Campaign Manager at PostUp Worked with various ESPs: Constant Contact, Campaign Monitor, ExactTarget, Distribion

More information

To change title of module, click on settings

To change title of module, click on settings HTML Module: The most widely used module on the websites. This module is very flexible and is used for inserting text, images, tables, hyperlinks, document downloads, and HTML code. Hover the cursor over

More information

Atable is an orderly arrangement of data distributed across a grid of rows and

Atable is an orderly arrangement of data distributed across a grid of rows and 7 Tables and Layout Atable is an orderly arrangement of data distributed across a grid of rows and columns similar to a spreadsheet. In printed documents, tables commonly serve a subordinate function,

More information

CS412 Interactive Lab Creating a Simple Web Form

CS412 Interactive Lab Creating a Simple Web Form CS412 Interactive Lab Creating a Simple Web Form Introduction In this laboratory, we will create a simple web form using HTML. You have seen several examples of HTML pages and forms as you have worked

More information

core HyperText Markup Language (HTML) Designing Documents for the World Wide Web

core HyperText Markup Language (HTML) Designing Documents for the World Wide Web core Web programming HyperText Markup Language (HTML) Designing Documents for the World Wide Web 1 2001-2003 Marty Hall, Larry Brown http:// Agenda Introduction to HTML Creating and publishing a Web page

More information

Creative Guidelines for Emails

Creative Guidelines for Emails Version 2.1 Contents 1 Introduction... 3 1.1 Document Aim and Target Audience... 3 1.2 WYSIWYG editors... 3 1.3 Outlook Overview... 3 2 Quick Reference... 4 3 CSS and Styling... 5 3.1 Positioning... 5

More information

ANDROID TRAINING COURSE MODULES. Module-I: Introduction to Android. Introducing Android. Installing Development Tools. Using the Emulator.

ANDROID TRAINING COURSE MODULES. Module-I: Introduction to Android. Introducing Android. Installing Development Tools. Using the Emulator. ANDROID TRAINING COURSE MODULES Module-I: Introduction to Android Introducing Android. Installing Development Tools. Using the Emulator. Android developer tools. Eclipse, IDEs and Tools. Module-II: Introduction

More information

QUESTION BANK COMPUTER SCIENCE. Class VIII LESSON-1 INTRODUCTION TO MS ACCESS

QUESTION BANK COMPUTER SCIENCE. Class VIII LESSON-1 INTRODUCTION TO MS ACCESS QUESTION BANK COMPUTER SCIENCE Class VIII LESSON-1 INTRODUCTION TO MS ACCESS 1. What is a database? 2. Explain various types of database? 3. What is Normalization? Why is it required? 4. Database 5. Table

More information

BlueHornet Whitepaper

BlueHornet Whitepaper BlueHornet Whitepaper Best Practices for HTML Email Rendering BlueHornet.com Page Page 1 1 2007 Inc. A wholly owned subsidiary of Digital River, Inc. (619) 295-1856 2150 W. Washington Street #110 San Diego,

More information

ANATOMY OF A WEB PAGE...

ANATOMY OF A WEB PAGE... Web Design Contents INTRODUCTION... 4 WHAT YOU WILL LEARN... 4 ABOUT THE HOME AND LEARN WEB DESIGN SOFTWARE... 5 INSTALLING THE SOFTWARE... 6 WEB COURSE FILES... 6 ANATOMY OF A WEB PAGE... 7 WHAT IS A

More information

Adobe Dreamweaver CC 14 Tutorial

Adobe Dreamweaver CC 14 Tutorial Adobe Dreamweaver CC 14 Tutorial GETTING STARTED This tutorial focuses on the basic steps involved in creating an attractive, functional website. In using this tutorial you will learn to design a site

More information

How to make a line graph using Excel 2007

How to make a line graph using Excel 2007 How to make a line graph using Excel 2007 Format your data sheet Make sure you have a title and each column of data has a title. If you are entering data by hand, use time or the independent variable in

More information

Web Development. Owen Sacco. ICS2205/ICS2230 Web Intelligence

Web Development. Owen Sacco. ICS2205/ICS2230 Web Intelligence Web Development Owen Sacco ICS2205/ICS2230 Web Intelligence Introduction Client-Side scripting involves using programming technologies to build web pages and applications that are run on the client (i.e.

More information

We automatically generate the HTML for this as seen below. Provide the above components for the teaser.txt file.

We automatically generate the HTML for this as seen below. Provide the above components for the teaser.txt file. Creative Specs Gmail Sponsored Promotions Overview The GSP creative asset will be a ZIP folder, containing four components: 1. Teaser text file 2. Teaser logo image 3. HTML file with the fully expanded

More information

Introduction to the Hyper Text markup language (HTML) SE 101 Spiros Mancoridis

Introduction to the Hyper Text markup language (HTML) SE 101 Spiros Mancoridis Introduction to the Hyper Text markup language (HTML) SE 101 Spiros Mancoridis What is HTML? HTML (Hyper Text Markup Language) is a language for specifying how text and graphics appear on a web page When

More information

SOCS Javascript Editor

SOCS Javascript Editor Javascript Editor Tool Bar and Buttons Insert Article Redirect Use the Article Redirect icon when you want a Section to redirect to another website, to a webpage or file within your site. The article containing

More information

GUIDE TO CODE KILLER RESPONSIVE EMAILS

GUIDE TO CODE KILLER RESPONSIVE EMAILS GUIDE TO CODE KILLER RESPONSIVE EMAILS THAT WILL MAKE YOUR EMAILS BEAUTIFUL 3 Create flawless emails with the proper use of HTML, CSS, and Media Queries. But this is only possible if you keep attention

More information

Creating HTML authored webpages using a text editor

Creating HTML authored webpages using a text editor GRC 175 Assignment 1 Creating HTML authored webpages using a text editor Tasks: 1. Acquire web host space with ad free provider 2. Create an index webpage (index.html) 3. Create a class management webpage

More information

Code View User s Guide

Code View User s Guide Code View User s Guide 1601 Trapelo Road Suite 329 Waltham, MA 02451 www.constantcontact.com Constant Contact, Inc. reserves the right to make any changes to the information contained in this publication

More information

Tutorial Microsoft Office Excel 2003

Tutorial Microsoft Office Excel 2003 Tutorial Microsoft Office Excel 2003 Introduction: Microsoft Excel is the most widespread program for creating spreadsheets on the market today. Spreadsheets allow you to organize information in rows and

More information

Talking: Web. Web design is the hardest thing you will ever do in life. At least when you do it for the first time. Home Page. Talking: Resources

Talking: Web. Web design is the hardest thing you will ever do in life. At least when you do it for the first time. Home Page. Talking: Resources 1 Talking: Web Web design is the hardest thing you will ever do in life. At least when you do it for the first time. Home Page Yale: http://info.med.yale.edu/caim/manual/ Design for designers: http://www.wpdfd.com/

More information

About webpage creation

About webpage creation About webpage creation Introduction HTML stands for HyperText Markup Language. It is the predominant markup language for Web=ages. > markup language is a modern system for annota?ng a text in a way that

More information

8 STEPS TO CODE KILLER RESPONSIVE EMAILS

8 STEPS TO CODE KILLER RESPONSIVE EMAILS 8 STEPS TO CODE KILLER RESPONSIVE EMAILS THAT WILL MAKE YOUR EMAILS BEAUTIFUL 3 BUILD RESPONSIVE EMAIL STEP BY STEP Steps to create a simple responsive email template. (fluid image, main content, two

More information

Base template development guide

Base template development guide Scandiweb Base template development guide General This document from Scandiweb.com contains Magento theme development guides and theme development case study. It will basically cover two topics Magento

More information

Introduction to Drupal

Introduction to Drupal Introduction to Drupal Login 2 Create a Page 2 Title 2 Body 2 Editor 2 Menu Settings 5 Attached Images 5 Authoring Information 6 Revision Information 6 Publishing Options 6 File Attachments 6 URL Path

More information

MS Excel. Handout: Level 2. elearning Department. Copyright 2016 CMS e-learning Department. All Rights Reserved. Page 1 of 11

MS Excel. Handout: Level 2. elearning Department. Copyright 2016 CMS e-learning Department. All Rights Reserved. Page 1 of 11 MS Excel Handout: Level 2 elearning Department 2016 Page 1 of 11 Contents Excel Environment:... 3 To create a new blank workbook:...3 To insert text:...4 Cell addresses:...4 To save the workbook:... 5

More information

Using Microsoft Word. Working With Objects

Using Microsoft Word. Working With Objects Using Microsoft Word Many Word documents will require elements that were created in programs other than Word, such as the picture to the right. Nontext elements in a document are referred to as Objects

More information

How to Properly Compose E-Mail HTML Code : 1

How to Properly Compose E-Mail HTML Code : 1 How to Properly Compose E-Mail HTML Code : 1 For any successful business, creating and sending great looking e-mail is essential to project a professional image. With the proliferation of numerous e-mail

More information

Language (HTML) Designing Documents for the World Wide Web

Language (HTML) Designing Documents for the World Wide Web 2009 Marty Hall HyperText Markup Language (HTML) Designing Documents for the World Wide Web 2 Customized Java EE Training: http://courses.coreservlets.com/ Servlets, JSP, JSF 1.x & JSF 2.0, Struts Classic

More information

Creating Web Pages With Dreamweaver MX 2004

Creating Web Pages With Dreamweaver MX 2004 Creating Web Pages With Dreamweaver MX 2004 1 Introduction Learning Goal: By the end of the session, participants will have an understanding of: What Dreamweaver is, and How it can be used to create basic

More information

As in the example above, a Budget created on the computer typically has:

As in the example above, a Budget created on the computer typically has: Activity Card Create a How will you ensure that your expenses do not exceed what you planned to invest or spend? You can create a budget to plan your expenditures and earnings. As a family, you can plan

More information

Microsoft Expression Web Quickstart Guide

Microsoft Expression Web Quickstart Guide Microsoft Expression Web Quickstart Guide Expression Web Quickstart Guide (20-Minute Training) Welcome to Expression Web. When you first launch the program, you ll find a number of task panes, toolbars,

More information

WYSIWYG Editor in Detail

WYSIWYG Editor in Detail WYSIWYG Editor in Detail 1. Print prints contents of the Content window 2. Find And Replace opens the Find and Replace dialogue box 3. Cut removes selected content to clipboard (requires a selection) 4.

More information

Item Editor Reference Guide

Item Editor Reference Guide Item Editor Reference Guide This reference guide is intended for all iwebfolio users. The item editor is the editing tool that appears when a user is editing an item within a portfolio or template. This

More information

Cut-to-the-Chase Series Web Foundations. HTML 101 - Assignment. By Eric Matthews 2001. Visit us at: www.anglesanddangles.com

Cut-to-the-Chase Series Web Foundations. HTML 101 - Assignment. By Eric Matthews 2001. Visit us at: www.anglesanddangles.com Cut-to-the-Chase Series Web Foundations HTML 101 - Assignment By Eric Matthews 2001 Visit us at: www.anglesanddangles.com General Requirements All of your work should conform to the general requirements.

More information

Designing HTML Emails for Use in the Advanced Editor

Designing HTML Emails for Use in the Advanced Editor Designing HTML Emails for Use in the Advanced Editor For years, we at Swiftpage have heard a recurring request from our customers: wouldn t it be great if you could create an HTML document, import it into

More information

<a href="document URL"... attributes-list>link Text</a>

<a href=document URL... attributes-list>link Text</a> HTML LINKS: A link is specified using HTML tag . This tag is called anchor tag and anything between the opening tag and the closing tag becomes part of the link and a user can click that part

More information

Email Campaign Guidelines and Best Practices

Email Campaign Guidelines and Best Practices epromo Guidelines HTML Maximum width 700px (length = N/A) Maximum total file size, including all images = 200KB Only use inline CSS, no stylesheets Use tables, rather than layout Use more TEXT instead

More information

24 WAYS to impress your friends

24 WAYS to impress your friends 24 WAYS to impress your friends At some stage in your career, it s likely you ll be asked by a client to design a HTML email. Before you rush to explain that all the cool kids are using social media, keep

More information

Understanding the Advanced Template Editor

Understanding the Advanced Template Editor Quick Start Guide to: Understanding the Advanced Template Editor The basic template editor in Swiftpage is used to create templates that began as imported templates or global advanced templates. (One function

More information

(E) FOUNDATION OF INFORMATION TECHNOLOGY

(E) FOUNDATION OF INFORMATION TECHNOLOGY (E) FOUNDATION OF INFORMATION TECHNOLOGY General Instructions (CODE No. 165) 1. The units specified for each term shall be assessed through Formative Assessments and Summative Assessments. 2. Each of the

More information

Lesson Review Answers

Lesson Review Answers Lesson Review Answers-1 Lesson Review Answers Lesson 1 Review 1. User-friendly Web page interfaces, such as a pleasing layout and easy navigation, are considered what type of issues? Front-end issues.

More information

Dreamweaver and Fireworks MX Integration Brian Hogan

Dreamweaver and Fireworks MX Integration Brian Hogan Dreamweaver and Fireworks MX Integration Brian Hogan This tutorial will take you through the necessary steps to create a template-based web site using Macromedia Dreamweaver and Macromedia Fireworks. The

More information

Web Design I. Spring 2009 Kevin Cole Gallaudet University 2009.03.05

Web Design I. Spring 2009 Kevin Cole Gallaudet University 2009.03.05 Web Design I Spring 2009 Kevin Cole Gallaudet University 2009.03.05 Layout Page banner, sidebar, main content, footer Old method: Use , , New method: and "float" CSS property Think

More information

The Essential Guide to HTML Email Design

The Essential Guide to HTML Email Design The Essential Guide to HTML Email Design Emailmovers Limited, Pindar House, Thornburgh Road Scarborough, North Yorkshire, YO11 3UY Tel: 0845 226 7181 Fax: 0845 226 7183 Email: enquiries@emailmovers.com

More information

FACULTY OF COMMERCE, OSMANIA UNIVERSITY

FACULTY OF COMMERCE, OSMANIA UNIVERSITY Commerce Lab - Practical Question Bank FACULTY OF COMMERCE, OSMANIA UNIVERSITY -------------------------------------------------------------------------------------- B.Com (Computers and Computer Applications)

More information

Site Maintenance. Table of Contents

Site Maintenance. Table of Contents Site Maintenance Table of Contents Adobe Contribute How to Install... 1 Publisher and Editor Roles... 1 Editing a Page in Contribute... 2 Designing a Page... 4 Publishing a Draft... 7 Common Problems...

More information

Website Editor User Guide

Website Editor User Guide CONTENTS Minimum System Requirements... 3 Design Your Website... 3 Choosing your Theme... 4 Choosing your Header Style... 4-5 Website Content Editor... 6 Text Editor Toolbar features... 6 Main Menu Items...

More information

Help on Icons and Drop-down Options in Document Editor

Help on Icons and Drop-down Options in Document Editor Page 1 of 5 Exact Synergy Enterprise Help on Icons and Drop-down Options in Document Editor Introduction The following table provides descriptions on the icons and drop-down options that are available

More information

ECDL / ICDL Web Editing Syllabus Version 2.0

ECDL / ICDL Web Editing Syllabus Version 2.0 ECDL / ICDL Web Editing Syllabus Version 2.0 Purpose This document details the syllabus for ECDL / ICDL Web Editing. The syllabus describes, through learning outcomes, the knowledge and skills that a candidate

More information

Merced SPCA Animal Shelter

Merced SPCA Animal Shelter Merced SPCA Animal Shelter Team Organization Team Leader: Communication Specialist: Information Technologist: Recorder/Tablet Holder: Sub-team #1 leader: Sub-team #2 leader: Team Member: pgonzales2@ucmerced.edu

More information

Basic tutorial for Dreamweaver CS5

Basic tutorial for Dreamweaver CS5 Basic tutorial for Dreamweaver CS5 Creating a New Website: When you first open up Dreamweaver, a welcome screen introduces the user to some basic options to start creating websites. If you re going to

More information