Creating Web Pages: Week 4, continued Is a picture worth 1000 words? HTML: body tag, text tags, lists Typography & Editorial Style Homework: Look at schedule.

Slides:



Advertisements
Similar presentations
Typography Typography exists to honor content. — Robert Bringhurst,
Advertisements

HTML Basics Customizing your site using the basics of HTML.
Computers: Tools for an Information Age Writing Your Own Web Page: Using HTML and Web Authoring Tools.
HTML popo.
Cascading Style Sheets
Presenter: James Huang Date: Sept. 26,  Introduction  Basics  Lists  Links  Forms  CSS 2.
INTRODUCTION TO HYPERTEXT MARKUP LANGUAGE 1. Outline  Introduction  Markup Languages  Editing HTML  Common Tags  Headers  Text Styling  Linking.
Week 7 Web Typography. 2 Understanding Type Design Principles.
HTML Hypertext Markup Language –First proposed by CERN in 1989 –It is non-linear so it allows you to jump from place to place –Markup refers to the structure.
Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Fluency with Information Technology Third Edition by Lawrence Snyder Chapter.
HTML and Web Page Design Presented by Frank H. Osborne, Ph. D. © 2005 ID 2950 Technology and the Young Child.
Cascading Style Sheets Controlling the Display Of Web Content.
Basic HTML UCR Webmasters Support Group Derk Adams.
Copyright © 2011 Pearson Education, Inc. Publishing as Pearson Addison-Wesley A Case Study in Database Organization The iDiary Database lawrence snyder.
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.
Typography Web Design Professor Frank. Characteristics of Type on the Web Magazine/book typography – 1200 dpi Computer screens – 85 ppi (maximum)
Using Visual Studio as an HTML Editor. Go to File/New/File.
Section 7.1 Identify presentation design principles Use a custom template Add pages to a navigation structure Section 7.2 Identify color scheme guidelines.
Chapter 3 Adding Images in HTML. Agenda Understanding Web Page Images Prepare Your Images for the Web Insert an Image Specify an Image Size Add Alternative.
Chapter 11 Cascading Style Sheets: Part I The Web Warrior Guide to Web Design Technologies.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
HTML basics exercises.
HTML HTML stands for "Hyper Text Mark-up Language“. Technically, HTML is not a programming language, but rather a markup language. Used to create web pages.
Web Technologies Website Development Trade & Industrial Education
4 HTML Basics Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and.
HTML (HyperText Markup Language)
WEB DESIGN USING DREAMWEAVER. The World Wide Web –A Web site is a group of related files organized around a common topic –A Web page is a single file.
Week 1 Understanding the Web Design Environment. 1-2 HTML: Then and Now HTML is an application of the Standard Generalized Markup Language Intended to.
HTML H yper T ext M arkup L anguage. HTML HTML is NOT case sensitive However, proper coding etiquette if for all to be in ALL CAPS and for text to be.
Understanding HTML Code
McGraw-Hill/Irwin Copyright © 2013 by The McGraw-Hill Companies, Inc. All rights reserved. Extended Learning Module F Building a Web Page with HTML.
1 Basic HTML. 2 Part 1: Basic Web Page Production.
Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and attributes Create.
HTML 4 Foundation Level Course HyperText Markup Language Most common language used in creating Web documents. You can use HTML to create cross-platform.
Unit 1 Changing the Appearance of Text. TITLE CORNELL NOTES TOPIC: NOTES: Summary: HTML Hypertext Markup Language 1 st and last tag on a page Tags Tags.
 A style sheet is a single page of formatting instructions that can control the appearance of many HTML pages at once.  If style sheets accomplished.
Welcome to CMPE003 Personal Computer Concepts: Hardware and Software Winter 2003 UC Santa Cruz Instructor: Guy Cox.
Introduction to Programming the WWW I CMSC Winter 2003 Lecture 3.
All you ever needed to know…and more!. H.T.M.L. HyperText Mark-up Language Web’s programming language All web browsers Set of instructions Written with.
Introduction to Programming the WWW I CMSC Winter 2003 Lecture 7.
HTML: Hyptertext Markup Language Doman’s Sections.
ECA 228 Internet/Intranet Design I Intro to Markup.
Professor Waterman Cascading Style Sheets (CSS) is a language that works with HTML documents to define the way content is presented. The presentation.
 HTML is hypertext markup language. It is a way for people to display their information with more complex pictures and text displays. Before HTML, messages.
Chapter 2 Web Page Design Mr. Gironda. Elements of a Web Page These are things that most web pages use.
1 Web Application Programming Presented by: Mehwish Shafiq.
4 HTML Basics Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and.
HTML(Hyper Text Markup Language) ByNaveen. Introduction HTML or Hyper Text Markup Language is the standard markup language Its used to create the web.
Body and Heading Tags and their Attributes. Attribute Name DefinitionValues backgroundIndicates the background image of the Web page. Ex. Filename(path.
HTML (Hyper Text Markup Language) Lecture II. Review Writing HTML files for web pages – efficient compact – fundamental. Text files with htm extension.
©SoftMoore ConsultingSlide 1 Introduction to HTML: Basic Document Structure.
2.1 XHTML. Motto High thoughts must have high language. –Aristophanes.
Are You Smarter Than a 5 th Grader? 1,000,000 5th Grade HTML 5th Grade Syntax 4th Grade HTML 4th Grade Syntax 3rd Grade HTML 3rd Grade Syntax 2nd Grade.
HTML Basics. HTML Coding HTML Hypertext markup language The code used to create web pages.
NASRULLAH KHAN.  Lecturer : Nasrullah   Website :
WEEK -1 ACM 262 ACM 262 Course Notes. HTML What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML.
1 2/22/05CS120 The Information Era Chapter 4 Basic Web Page Construction TOPICS: Images and placing pages on the server.
1 2/21/05CS120 The Information Era Chapter 4 Basic Web Page Construction TOPICS: Lists, Fonts, Links, and Preformatted Text.
Basic HTML Programming Technology Education Ellsworth Community Middle School Communication Systems.
Writing Your Own Web Page: Using HTML and FrontPage Chapter 10.
HTML. INDEX Introduction to HTML Creating Web Pages Commands And Tags Web Page.
1 Foundation of HTML Web Page Design. 2 Safe Web Fonts: Used by most computers regardless of environment or platform  Times New Roman  Arial  Courier.
Revision Webpage design HTML.   FACE  Attributes  Marquee  Define the following terms.
HTML Basics.
Extended Learning Module F
Section 4.1 Section 4.2 Format HTML tags Identify HTML guidelines
Section 7.1 Section 7.2 Identify presentation design principles
HTML Formatting.
Cascading Style Sheets
Lesson 3: Cascading Style Sheets (CSS) and Graphical Elements
Presentation transcript:

Creating Web Pages: Week 4, continued Is a picture worth 1000 words? HTML: body tag, text tags, lists Typography & Editorial Style Homework: Look at schedule. Posting assignment on legal/ethical topic due next week. Begin planning second project.

Is a picture worth 1000 words? Really after a different question: –How much storage (how many bits) required for a typical image Decide on width and height (resolution) Decide on color depth Assume no compression –How much storage required for 1000 words (estimate size of a word. 1 letter = 8 bits)

Body tag You can add color (see textbook or Paint Shop Pro or PhotoShop) or Or an image, which will be tiled Can set the color for the text, link, vlink & alink. Consider –Legibility (against background) –Printability –People are accustomed to blue.

Tags for text Can be nested. emphasis … Allows you to retain any formatting, including spaces and line breaks. Good for poetry and code! for specifying fonts or size or color

Unordered lists and ordered lists Note: can have the type parameter for different bullets (aka wingdings).. Note: can have the type parameter Can nest lists. See also definition lists.

Typography What does the text mean by: Typography plays a dual role as both verbal and visual communication. HTML defines logical display. It does not guarantee a display. Style sheets, use of scripting language, can go farther to specifying the display. The goal of style sheets and XML and XSL, etc. is to separate content from display.

Text attributes What is the significance of Alignment White space Justified text. What does text say about problems with right- or centered text? Line length Antialiased type Serif versus sans serif font

Browser issues Differences between browsers and between Mac and PCs Note also: a user can choose (in preferences) to override what is specified in the HTML file. Fonts may be missing.

Editorial Style Issues Too much versus too little text Too much ‘mark-up’, links versus too little Guiding the site visitor through an experience or letting site visitors create their own experience. –Provide for visitors to come to any/all pages independently –Be careful of providing ways to leave page or even site Technical issue: page titles used in Bookmarks

Homework Look at schedule. Posting assignment next week. Begin to think about Project II. You choose topic. Important to be explicit on purpose and audience.