Web Page Elements Writing For the Web

Slides:



Advertisements
Similar presentations
HTML Basics Customizing your site using the basics of HTML.
Advertisements

Getting Your Web Site Found. Meta Tags Description Tag This allows you to influence the description of your page with the web crawlers.
WEB DESIGN TABLES, PAGE LAYOUT AND FORMS. Page Layout Page Layout is an important part of web design Why do you think your page layout is important?
Cascading Style Sheets
Section 6.1 Write Web text Use a mission statement Generate and organize content ideas Section 6.2 Use page dimension guidelines Determine content placement.
New Semantic Elements (Part 1). Semantics Explained The textbook definition of "semantics" is the study of the relationship between words and their meanings.
HTML5 new elements. The tag specifies independent, self- contained content. An article should make sense on its own and it should be possible to distribute.
CM143 - Web Week 2 Basic HTML. Links and Image Tags.
How to Create Top Ranking Searchable and Accessible Documents Chris Pollett and Elizabeth Tu April, 2010.
Search Engine Optimization March 23, 2011 Google Search Engine Optimization Starter Guide.
Chapter 2 Introduction to HTML5 Internet & World Wide Web How to Program, 5/e Copyright © Pearson, Inc All Rights Reserved.
Meta Tags What are Meta Tags And How Are They Best Used?
Search Engine Optimization Miss Ellis Mrs. Harvey.
Dawn Pedersen Art Institute. Introduction All your hard design work will suffer in anonymity if people can't find your site. The most common way people.
IPUB 100 Lesson 2 Instructor Mark Lamontagne Homework Review.
Web Technologies Website Development Trade & Industrial Education
XP New Perspectives on Browser and Basics Tutorial 1 1 Browser and Basics Tutorial 1.
Chapter 2 Developing a Web Page. A web page is composed of two distinct sections: –The head content –The body Creating Head Content and Setting Page Properties.
آموزش طراحی وب سایت جلسه پانزدهم – بهینه سازی برای موتور جستجو تدریس طراحی وب برای اطلاعات بیشتر تماس بگیرید تاو شماره تماس: پست.
Developing Content and Layout Lesson 6. Creating Web Site Content Online users scan a page, read key words of text, and check out graphics Reading from.
Learning Web Design: Chapter 4. HTML  Hypertext Markup Language (HTML)  Uses tags to tell the browser the start and end of a certain kind of formatting.
Chapter 2 HTML Basics Key Concepts Copyright © 2013 Terry Ann Morris, Ed.D 1.
Title, meta, link, script.  The title looks like:  The tag defines the title of the document in the browser toolbar.  It also: ◦ Provides a title for.
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.
 2008 Pearson Education, Inc. All rights reserved Introduction to XHTML.
Web Page Design. Some Terms Cascading Style Sheet, (CSS) –a style sheet language used to describe the look and formatting of a document written in html;
Microsoft FrontPage 2003 Illustrated Complete Using a Dynamic Web Template.
Web Searching Basics Dr. Dania Bilal IS 530 Fall 2009.
Searching the Web by Lorrie Brazier Revised by Paula Walton.
Validating, Promoting, & Publishing Your Web Site Writing For the Web The Internet Writer’s Handbook 2/e.
MS FrontPage 1: Developing a web site for the Sunny Morning Products Yong Choi CSU Bakersfield.
© 2005 Pearson Education Inc. Publishing as Longman Student Resource Guide: Reading and Evaluating Internet Sources Active Reading Skills, 1/e Kathleen.
SEO techniques & Mastering Google Adwords By Ganesh.S
INTRODUCTION TO HTML5 Semantic Layout in HTML5.  The new semantic layout in HTML5 refers to a new class of elements that is designed to help you understand.
© 2012 The McGraw-Hill Companies, Inc. All rights reserved. word 2010 Chapter 3 Formatting Documents.
Lecture 6 Title: Web Planning, Designing, Developing for E-Marketing By: Mr Hashem Alaidaros MKT 445.
Interface Design Web Design Professor Frank. Design Graphic design and visual graphics are equally important Both work together to create look, feel and.
CS-3432 Electronic Commerce Lecture – 7 Sikandar Shujah Toor
Digital Literacy Concepts and basic vocabulary. Digital Literacy Knowledge, skills, and behaviors used in digital devices (computers, tablets, smartphones)
Build Your Own Website Review of week 6 You should now have your website pretty complete You should now have your website pretty complete Are there any.
Ch 13 HTML and CSS Web Standards Solutions A Web Standardistas’ Approach.
Web Site Development - Process of planning and creating a website.
CHAPTER TWO HTML TAGS. 1.Basic HTML Tags 1.1 HTML: Hypertext Markup Language  HTML stands for Hypertext Markup Language.  It is the markup language.
© ExplorNet’s Centers for Quality Teaching and Learning 1 Objective % Understand advanced production methods for web-based digital media.
HTML Overview.  Students will learn: How HTML tagging works How browsers display tagged documents How an HTML document is structured.
Online Copywriting eMarketing: The Essential Guide to Online Marketing
COMP 143 Web Development with Adobe Dreamweaver CC.
HTML And the Internet. HTML and the Internet ► HTML: HyperText Markup Language  Language in which all pages on the web are written  Not Really a Programming.
© Ms. Masihi.  A Web page contains text and images that convey specific information to viewers.  To create a new web page, open Dreamweaver and select.
Finally getting to html and CSS… Tim Berners-Lee, the writer of the software program that makes him the inventor of the WWW, defines the Internet as a.
Section 6.1 Section 6.2 Write Web text Use a mission statement
Introduction to HTML.
Web Basics: HTML/CSS/JavaScript What are they?
Introduction to HTML.
Chapter A - Getting Started with Dreamweaver MX 2004
Creating Pages that search engines love
Dreamweaver – Project #1
Introduction to XHTML.
WEBSITE DESIGN Chp 1
Objective % Explain concepts used to create websites.
Creating a Successful Web Presence
Digital Design – Copyright Law
Search Search Engines Search Engine Optimization Search Interfaces
Web Development & Design Foundations with H T M L 5
Understand basic HTML and CSS terminology, concepts, and basic operations. Objective 3.01.
Common Page Design Elements
HTML 5 SEMANTIC ELEMENTS.
Objective Explain concepts used to create websites.
INFS 230 L Internet Technology
WEB PAGES AND WEB SITES.
Presentation transcript:

Web Page Elements Writing For the Web The Internet Writer’s Handbook 2/e

Contents HEAD tags META and keyword information Title Header and Footer information

<HEAD> BLOCK Author’s name E-mail address Background color Comments Content description Date modified Date of creation Document title E-mail address Filename META information Purpose of page Software used Style sheet link

Author Person who created document. Helpful to those who find your page using a search engine.

META Information <META> tags. Appear after the title. Contain description and keywords that describe your site. Help search engines find your site.

META Tags: Example

Keywords Words or phrases that describe your Web page. Attract Web spiders that search Web pages and create indexes based on keywords used on the pages.

Example

Keywords: Tips Focus on two or three keywords that describe your site. Put those words In your title In META tags Early on page Think of typical phrases people would use to search. Ask yourself, “What's this page about?” Be specific.

Title Text written between the <HEAD> tags. Displays at the top of the browser's window.

Title: Importance Saved in bookmarks/hotlists. Indexed by search engines. Will most likely be used as links from other pages to your site Contains information about the document.

Title: Importance If your page doesn't have a title, the browser will display "Untitled," "No Title, " or the URL.

Examples: No Title

Example Vague title

A Title Should Be short (to avoid wrapping) (<64 char.). Use words that have a single meaning. Be descriptive. Begin with a keyword. Convey the correct tone. Emphasize benefits. Be relevant out of context. Make sense in a list of bookmarks and be easy to find.

Example: Bookmarks

Sample Poor Titles (untitled) Home About us Our products !!!Awesome site!!! Save $$$s! Free samples!!! documents documents

Components at Top of Page Banner Identifier of who is responsible for site Navigation Introduction

Banner Contains text and logo Establishes identity

Footer Date of last revision (date stamp) Copyright information and restrictions Disclaimer Web site owner's name URL of page for users who print it out Navigation E-mail link

Code For E-Mail Link <A HREF=“MAILTO:person@internet.mail.address”> send e-mail </A>

Date Stamp Lets readers know when you last updated the information. Usually appears as the sentence "Last modified. . . ."

Copyright Include a copyright © or trademark™ symbol on your Web page to protect your work.

URL Put the URL on the document (e.g. after <ADDRESS> tag) for users who print out the page.