Creating Web Pages Overview. Design – Start with a Purpose Before you start any web page, you need to design the website. The first question that should.

Slides:



Advertisements
Similar presentations
Creating Web Pages By: Dr. Matt Dean. Common Terminology Webpage Webpage Website Website Web Browser Internet Explorer Firefox HTMLHypertext Markup Language.
Advertisements

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.
AN INTRODUCTION TO WEBSITE DEVELOPMENT MADE BY: SIR NASEEM AHMED KHAN DOW VOCATIONAL& TECHNICAL TRAINING CENTRE.
M2 – Explain the tools and techniques used in the creation of an interactive website. By Arturas Vitkovskij.
How To Create A Web Page By: Mikeon Briddy & Darrius Jacobs April 10,2006 Mr. Barnett.
Objective Understand web-based digital media production methods, software, and hardware. Course Weight : 10%
Project 1 Introduction to HTML.
Server-Side vs. Client-Side Scripting Languages
Building Web Pages With Microsoft Office. Introduction This tutorial is for the beginning web builder. It utilizes software that you already have, Microsoft.
1 Computing for Todays Lecture 22 Yumei Huo Fall 2006.
Introduction to HTML 2006 INT197B. What is the Internet? Global network of computers that are connected and communicate via a series of Protocols Protocols.
Introduction to HTML 2004 CIS101. What is the Internet? Global network of computers that are connected and communicate via a series of Protocols Protocols.
Creating and Publishing Your own website
Glencoe Digital Communication Tools Create a Web Page with HTML Chapter Contents Lesson 4.1Lesson 4.1 Get Started with HTML (85) Lesson 4.2Lesson 4.2 Format.
What Is A Web Page? An Introduction to the Internet.
COMPUTER TERMS PART 1. COOKIE A cookie is a small amount of data generated by a website and saved by your web browser. Its purpose is to remember information.
HTML 1 Introduction to HTML. 2 Objectives Describe the Internet and its associated key terms Describe the World Wide Web and its associated key terms.
Chapter ONE Introduction to HTML.
Web Design Basic Concepts.
Creating a Web Page HTML, FrontPage, Word, Composer.
CPSC 203 Introduction to Computers Lab 39, 40 By Jie (Jeff) Gao.
HTML Comprehensive Concepts and Techniques Intro Project Introduction to HTML.
 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.
Create a Website Session I Key Components Hands-on HTML.
What is Web Authoring? Web Authoring Tools Use Text Editors HTML Editors Web-based Authoring Tools Integrated Web Authoring Tools 8Basic Understanding.
Exploring Microsoft Office XP - Microsoft Word 2002 Chapter 61 Exploring Microsoft Word Chapter 6 Creating a Home Page and Web Site By Robert T. Grauer.
Computer Science : Information Systems Design and Development Unit Web Sites - National 4 / 5 St Andrew’s High School-Revised January 2013 Slide 1 St Andrew’s.
Web Design Using HTML Codes. WHAT DO I NEED TO BEGIN DESIGNING A HOME PAGE? 1.YOU NEED A FOLDER (also called a DIRECTORY) You should set up a folder or.
Pre-Coding Web Design – Sec 3-1 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development I” Course materials.
Creating Web Documents Wk 2: HTML & PSP basics Discuss sites HTML, PSP lesson Assignment: first Web page due Day class: 1/23; Night class 1/28.
Web Design Fundamentals Demystifying Basic HTML. 2 After completing this lesson, you will be able to: Understand the basics of HTML coding. Use HTML tags.
Programming in HTML.  Programming Language  Used to design/create web pages  Hyper Text Markup Language  Markup Language  Series of Markup tags 
Introduction to HTML. What is a HTML File?  HTML stands for Hyper Text Markup Language  An HTML file is a text file containing small markup tags  The.
Computing Theory: HTML Year 11. Lesson Objective You will: o Be able to define what HTML is - ALL o Be able to write HTML code to create your own web.
CPSC 203 Introduction to Computers Lab 23 By Jie Gao.
An Introduction To Websites With a little of help from “WebPages That Suck.
HTML I An Introduction to the Language of the Web Terry Bake
Basic HTML PowerPoint How Hyper Text Markup Language Works
Creating and Publishing Your own web site PC Version SEAS 001 Professor Ahmadi.
Unit 2, cont. September 12 More HTML. Attributes Some tags are modifiable with attributes This changes the way a tag behaves Modifying a tag requires.
Tools of the Trade: Construction CECS 5030: Introduction to the Internet Dr. Cathleen Norris & Jennifer Smolka.
Web Page Fundamentals HTML: The Language of the Web.
YEAR 8 – WEB DESIGN IN HTML Lesson 2. STARTER Use the internet to find out what JavaScript is? Use ‘Microsoft Word’ to write down your list.
15.1 Fundamentals of HTML DeKalb County School System.
Notes Chapter 10—Adding Graphics. There are two kinds of graphics on the Internet: those you can use on your own Web pages, and those you cannot.  Many.
HTML BTEC National in Computing Section5. Create Information “HTML: defining HTML, discussing HTML uses and demonstrating HTML basics, HTML structure…..
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.
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.
HTML Concepts and Techniques Fifth Edition Chapter 1 Introduction to HTML.
Web Authoring with Dreamweaver. Unit Objectives  Be able to define keywords: HTML, HTTP (protocol), browser, web server, client/server, tag, attribute,
The Internet. Important Terms Network Network Internet Internet WWW (World Wide Web) WWW (World Wide Web) Web page Web page Web site Web site Browser.
Introduction to HTML Simple facts yet crucial to beginning of study in fundamentals of web page design!
HTML HyperText Markup Language Victoria E. Kozlek.
Using HTML. Glogger Glogger is like you own personal web page, you can add… Pictures Text Videos Music, etc… Modify and adjust anything you want Glogger.
Understanding Web-Based Digital Media Production Methods, Software, and Hardware Objective
Introduction. Internet Worldwide collection of computers and computer networks that link people to businesses, governmental agencies, educational institutions,
XP New Perspectives on Creating Web Pages With Word Tutorial 1 1 Creating Web Pages With Word Tutorial 1.
Creating Web Pages in Word. Sharing Office Files Online Many Web pages are created using the HTML programming language. Web page editors are software.
XP Creating Web Pages with Microsoft Office
Pre-Production Meet with the client to create a project plan:
Imaging and Design for Online Environment
Exploring Microsoft Word 2000
Chapter 1 Introduction to HTML.
Active Server Pages Computer Science 40S.
Pre-Coding Web Design – Sec 3-1
Project 1 Introduction to HTML.
Creating a Successful Web Presence
Objective Understand web-based digital media production methods, software, and hardware. Course Weight : 10%
Introduction to HTML Simple facts yet crucial to beginning of study in fundamentals of web page design!
Presentation transcript:

Creating Web Pages Overview

Design – Start with a Purpose Before you start any web page, you need to design the website. The first question that should be asked is why are you creating a website? –To entertain or educate –To sell products –To create a useful reference –More…

Describe the website Determine: –Who is the audience? –What content and pictures are available to be used? –How should the site be organized? –What colors or graphics should be used? –What should the web site be able to do? Once you have answered these questions, the entire site should be sketched out, either on paper, or in a graphics program.

Create The Web Pages A web page is simply a text file, like you might write in Notepad, or simple text. Web pages contain tags that tell a web browser, like Internet Explorer (IE), how to display the page. You can view these tags before IE uses them by opening any web page in IE and selecting View on the drop down menu, then Source. Try this on the Creating Web Pages page, or the links page.

Creating Web Pages There are many ways to create web pages. –Hand Coding – Using Notepad or SimpleText, you type the tags yourself. –Template – You start with a basic design, already containing tags, and add content. –A What You See Is What You Get (WYSIWYG) Program – This program creates the tags for you.

The spectrum of web page creation Hand coded HTML Pay someone to make you a web page WYSIWYG program More work Less work More money Less money Using a template

Hand Coding Web Pages Hand coding web pages involves using a simple text editor to manually insert tags into a document. There are several free text editors that help with coding HTML by using different colors for tags, indicating which open and close tags are related, and spellchecking the document.

Using a Template There are many sites on the web which offer pre-made web template. You take their design, and add your content. Some very basic knowledge of HTML is required in order to determine where to place your content.

WYSIWYG Most WYSIWYGs require no knowledge of HTML. You simply drag and drop your content where you would like it, and the program creates the tags for you. Both Microsoft Word and Microsoft PowerPoint can be used as a basic WYSIWYG. Simply save as html when you finish the document.

Hand Coding vs. WYSIWYG Hand Coding allows greater control over the result. WYSIWYG created web pages are often loaded with extra and inefficient code which increases the download time and makes the page hard to modify later. Using a WYSIWYG is significantly faster.

Testing During the web page creation process, you should test the page frequently. Testing usually involves an outsider viewing the site and attempting to determine the purpose of the site (Get It Testing) and trying to complete tasks on the site (Key Task Testing) –What is the purpose of this site? (Get It) –Can I find the contact information quickly? (Key Task)

Accessibility Web sites for companies that receive government funds are required by law to make them handicapped accessible. All other sites should be accessible. This may include: –Alternate versions for the blind –For the deaf no key information should be in sound effects. Since the Internet is global, accessibility includes making your site friendly and usable for multiple cultures.

Compatibility Web sites will look different from computer to computer. How they look is affected by: –Operating System –Browser (Internet Explorer or Netscape) –Computer Hardware Your goal is to make them look good on ALL systems. (Good luck) out a simple webpage and drag the file in, or File, open…

Hosting A completed web site needs to be on a server in order to be on the Internet. A server is a computer that is always on, has a program to distribute web pages, and has been given an address that doesn’t change. You can purchase space on a server to put your web page, or find a free service.