The Nav Bar. Nav is short for Navigation. Having a Navigation Bar makes searching for information easier on those accessing your page. Here are some common.

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

MA foundation Creating webpages using XHTML (part 2) Simon Mahony CCH.
Section 16.1 Create a basic table using HTML Define borders Merge cells Align content in tables Section 16.2 Create a frames-based Web page using HTML.
Chapter 3 – Web Design Tables & Page Layout
Twitter Bootstrap Paul Frederickson. Tonight’s Objectives Learn how to set up a bootstrap based site Become familiar with bootstrap syntax Create a framework.
CREATE A WEBPAGE WEB DESIGN. EXAMPLE LAYOUT 2 WEB COMPONENTS Header Banner and logo Footer Copyright information or Address Horizontal Navigation For.
DIVISIONS FOR ALL WEB PAGES Web Page Elements.  All Web Pages should have the following 4 elements (Also called divisions).  header  navigation  content.
16 HTML Tables and Frames Section 16.1 Create a basic table using HTML Define borders Merge cells Align content in tables Section 16.2 Create a frames-based.
Chapter 4_2 Marking Up With Html: A Hypertext Markup Language Primer.
Tinonee Manning River (n.d.). Source: Midcoast Property Central.
Start -> All Programs -> Classes -> Web Expressions -> Dreamweaver.
Figure Figure 18-1 part 1 Figure 18-1 part 2.
A tour around the British Council’s LearnEnglish Portal Return to Home Page.
Website Development Presentation for Project 1 and 2 Pavel Florea.
Building Our Website Step by Step. Step 1: Open a new Microsoft Word document. Save it as “How To [Your topic] Website.”
1 FOR OFFICIAL USE ONLY Policy AO Access and Interface-Navigation Guide.
Website Design - Review Layout using tables. Table exmaple James 11/08.
Parent Academy Topic: Technology Services 1. Outcomes 2 Tech Services provides support for all of Palmdale’s technology systems and programs.
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.
INTRODUCTORY Tutorial 7 Creating Tables. XP New Perspectives on Blended HTML, XHTML, and CSS2 Objectives Discern the difference between data tables and.
Session Objectives Object Types – Query, HTML Table Purpose of the Query and Explanation How to add a Query to a PTF Test Case 2 Session 5 - Query.
Should have seen something like this last week What does do? stands for table row and starts a new row in the table.
Design Critique LIS Group 6 Amber Billey Rachel Crowe Andrew Martrich Carrie Shaurette.
Continued BrokersLink Redesign. General Changes All Headlines, Main Nav options and Sub Nav options will be in the Google font Roboto Slab (Normal 400.
CIS 205—Web Design & Development Dreamweaver Chapter 5 Using HTML Tables to Lay Out a Page.
Adobe Dreamweaver CS3 Revealed CHAPTER FIVE: USING HTML TABLES TO LAY OUT A PAGE.
Introducing: Dreamweaver!. Today We’ll Learn… Organizing Folders Organizing Folders Opening Dreamweaver Opening Dreamweaver Titles and Saving Titles and.
1 Web Developer Foundations: Using XHTML Chapter 3 XHTML Hyperlinks and Tables.
XP New Perspectives on Microsoft Word 2002 Tutorial 31 Microsoft Word 2002 Tutorial 3 – Creating a Multiple-Page Report.
 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.
Database Essentials. Key Terms Big Data Describes a dataset that cannot be stored or processed using traditional database software. Examples: Google search.
Language Club KompoZer Design View. Files you will need  Images  pages  Templates  Text.
How to Make Navigational Frames in an HTML Document By: Patrick Clahane.
WRA HTML & CSS – BUILDING WEBPAGES. TODAY’S AGENDA Review: external stylesheets Review: transforming a list Intro: the object Intro: the.
Basic Table Elements. 2 Objectives Define table elements Describe the steps used to plan, design, and code a table Create a borderless table with text.
Computer Science 101 Lists and Tables. Lists Unordered lists - use a bullet Ordered lists - use a number, Roman numeral, or letter.
CS-3432 Electronic Commerce Lecture – 7 Sikandar Shujah Toor
Excel Spreadsheet Notes. What is a Spreadsheet? Columns and rows of data.
Common user interface, yet new stuff Notice: similar menus and buttons new menus: Data new features: –name box –Formula bar –3 sheets=1 binder(more can.
Road Signs To know where you are and where you’re going.
APICS Website Tutorial. Searching is easy with the new search function, which appears on every page. Shop APICS is accessible from here and is linked.
Introduction to new MyLO for Students PRESENTATION.
Web Site Development - Process of planning and creating a website.
1 Preparation for site Create a folder in MyDocuments: beavercheese. Create a subfolder, images Classes, career, DW beginner Download.
Tables Microsoft Word Tables A is a grid of rows and columns that intersect to form cells. A is a grid of rows and columns that intersect to form cells.
LINKING WEBPAGES USING HTML HYPERLINKS. Hyperlinks are text strings or images on a webpage which when clicked on, links to another section in the same.
1 3/30/05CS120 The Information Era CS120 The Information Era Chapter 4 – More HTML Specifics TOPICS: Frames Problem Review, Nested Frames.
TABLES IN HTML No, not that kind of table!! THIS KIND!!
Tables: Basic Elements Header 1Header 2Header 3 Row 1, Column 1Row 1, Column 2Row 1, Column 3 Row 2, Column 1Row 2, Column 2Row 2, Column 3 Row 3, Column.
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 7 TH EDITION Chapter 2 Key Concepts 1 Copyright © Terry Felke-Morris.
Navigation grid – Wide desktop 1 Main navigation bar maximum width 890 px (= 4 content columns) 3 text columns, each 256 px wide 51 px margins in between.
Accessibility and Teaching Online Beth Case Program Manager for Digital, Emerging, and Assistive Technologies University of Louisville, Delphi Center.
Chapter A - Getting Started with Dreamweaver MX 2004
Google Drive.
How to customize your Microsoft SharePoint Online website
How to customize your Microsoft SharePoint Online website
Page plans A01 Design.
Click into your course. RedShelf.
Fixed Positioning.
ePAR - Job Attribute Change
Tutorial 3 – Creating a Multiple-Page Report
Basic Tables.
How to customize your Microsoft SharePoint Online website
Coming March 5 To: From:.
Basic Tables.
HTML Tables.
Basic Tables.
Find your house and make a map of your neighborhood.
QuickServe Online New Features
Presentation transcript:

The Nav Bar

Nav is short for Navigation. Having a Navigation Bar makes searching for information easier on those accessing your page. Here are some common links found on a Nav Bar: Home, Contacts, About Us, History

Design of a Nav Bar A traditional Nav Bar is centered across the top of your page, just below a Banner or Header. Nav bar^ One tool that is almost always used to create Nav Bars is called a Table…

Tables!!! Content And in English…? stuff you want inside the table cell or box

Examples… Content Content This code will show: Content There is one row and two columns with the word content in each cell..

Back to the Nav Bar.. Google

…and that’s the Nav Bar