Common Page Design Elements

Slides:



Advertisements
Similar presentations
Anatomy of a Web Page. Parts of a Web Page Title Bar Navigation Tool Bar Location Bar Header Graphic/Image Text Horizontal Rule Links.
Advertisements

Chapter 3 – Web Design Tables & Page Layout
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?
HTML popo.
HTML.
Unit 20 - Client Side Customisation of Web Pages
Who Wants to be a Millionaire? Web Page Development Dreamweaver Chapter 2.
 CSS ids  Pages  Sites  HTML: class=“name”  Names may define format OR content › Either works  CAN apply multiple classes to the same tag  Multiple.
CM143 - Web Week 2 Basic HTML. Links and Image Tags.
HTML syntax By Ana Drinceanu. Definition: Syntax refers to the spelling and grammar of a programming language. Computers are inflexible machines that.
IWebFolio Using a Template Tutorial Images in this tutorial:
TUTORIAL 8: Enhancing a Web Site with Advanced CSS
© 2011 Delmar, Cengage Learning Chapter 2 Developing a Web Page.
Creating A Simple Web Page. Step 1- Open Dreamweaver & Create A New Page (File New) and blank.
Define html document byusing Example : Title of the document The content of the document......
Cascading Style Sheet Basics Pepper. Looking at the HTML See the surrounding tags See head, body, paragraph, header See the ending tags See the list.
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
Slide 1 Consider the page layouts for: Layout design – does it look balanced and even Size of box relative to its importance – the Heading (or title) of.
Web Technologies Website Development Trade & Industrial Education
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.
Website Development with Dreamweaver
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.
Microsoft FrontPage 2003 Illustrated Complete Using a Dynamic Web Template.
HTML INTRODUCTION. What is HTML?  HTML stands for Hypertext Markup Language  Developed in 1990  Hidden code that helps us communicate with others on.
 Word doc for you to download › Link at the beginning of class › 10 Questions › Answers to be added inline  Post to Sakai when completed › No resubmits.
INTRODUCTION. What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML is not a programming language,
 Remember that HTML is just text  Need to point to pictures  Use the img tag  alt: › screen reader › REQUIRED for this class and to validate.
Copyright 2007, Information Builders. Slide 1 Understanding Basic HTML Amanda Regan Technical Director June, 2008.
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.
>> HTML: Structure Elements. Elements in HTML are either Inline or Block. Block-level Elements – Begins on a new line – Occupy the whole width – Stacks.
Designing Web Pages Layout and Composition. Defining Good Design Users are pleased by the design but drawn to the content Design should not be a hindrance.
Louisa Lambregts, Louisa Lambregts
CS-3432 Electronic Commerce Lecture – 7 Sikandar Shujah Toor
L. Anne Spencer (c) 2001 Basic Web Design Document, text, & layout formatting tags & attributes.
By Lauren Mayer WEBSITE RESEARCH. NYLON MAGAZINE WEBSITE Header, this is the title of the website and should be the main attraction. This example had.
Ch 13 HTML and CSS Web Standards Solutions A Web Standardistas’ Approach.
Content Administration 08/19/13 & 08/20/13.
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.
1 Creating Links Lesson 2. 2 In the center column type : Home | Order Now | Contact Us This is the navigation button which will link to the other pages.
Web Site Development - Process of planning and creating a website.
Web Technology (NCS-504) Prepared By Mr. Abhishek Kesharwani Assistant Professor,UCER Naini,Allahabad.
ET-710 WEB-DESIGN By Bart Chuchro Queensborough Community College.
WHY DO YOU NEED IT? What is a wireframe?. A wireframe is… A wireframe is a simple visual guide to show you what a Web page would look like. Wireframes.
Learning Aim C.  Creating web pages involves many considerations.  In this section we will look at the different software tools you can use and how.
Intro to HTML.  Hypertext markup language (HTML) is a way of telling web browsers how to display a page  You can type them by hand in a word processing.
HTML Tutorial. What is HTML HTML is a markup language for describing web documents (web pages) HTML documents are described by HTML tags Each HTML tag.
COMP 143 Web Development with Adobe Dreamweaver CC.
Basic HTML Page 1. First Open Windows Notepad to type your HTML code 2.
Source of website: “Text/css rel=“styles heet” This is an external style sheet link. This means that the.
CASCADING STYLE SHEET CSS. CSS stands for Cascading Style Sheets Styles define how to display HTML elements Styles were added to HTML 4.0 to solve a problem.
Week 1: Introduction to HTML and Web Design
Getting Started With HTML
Web Basics: HTML/CSS/JavaScript What are they?
Web Page Elements Writing For the Web
8/18/2016 Web Development and Interactive Media
Chapter 2 Developing a Web Page.
Chapter A - Getting Started with Dreamweaver MX 2004
Cascading Style Sheets (Layout)
Unit 2, Lesson 5 Website Development Tools
Unit 2, Lesson 5 Website Development Tools
Layout - you need to understand that a simple navigation bar:
CSS.
How to Create Tables & Charts/Graphs in Excel
Fixed Positioning.
Session I Chapter 18 - How to Design a Web Site
What is HTML anyway? HTML stands for HyperText Markup Language. Developed by scientist Tim Berners-Lee in 1990, HTML is the "hidden" code that helps us.
Unit 2 Test Building a Web Page Test.
WEBSITE CREATION DOING IT MANUALLY 2/21/2019.
BRAND POWERPOINT TEMPLATE
Web Programming and Design
Presentation transcript:

Common Page Design Elements Logo In Upper Left. Second Choice is Centered. Consistent Branding, Look, and Feel Title-Bar Title Head Section On-Page Title Subheadings Left hand Navigation Upper Navigation Bar Footer Navigation Copyright Legal and Privacy Notices Content Button to Home “Back to Top” Link

Common design and HTML elements. Creating a Template Common design and HTML elements.

Common HTML Elements Title Description Meta-Tag Keywords Meta-Tag Author Meta-Tag Margin Setting in Body Tag Color Settings in Body Tag Style Sheet Section and/or Link Script Section Organization Via Tables Server-side includes for common page elements. Use of Web-safe colors Common JavaScripts and functionality

Feedback: Privacy Policy Feedback
Do Not Sell My Personal Information
About project: SlidePlayer Terms of Service

© 2025 SlidePlayer.com. Inc. All rights reserved.