Web Blunders: The Top 5 Biggest Mistakes on the Web

Slides:



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

Source: ojects/tabber/ ojects/tabber/
Cascading Style Sheets
CHAPTER 7 STYLING CONTENT WITH CASCADING STYLE SHEETS.
Part 2 Introduction to CSS. CSS Syntax – class selector 1 With the class selector you can define different styles for the same type of HTML element. You.
1. Content – Collective term for all text, images, videos, etc. that you want to deliver to your audience. 2. Structure – How the content is placed on.
Creating and Editing a Web Page Using Inline Styles
Cascading Style Sheets Understanding styles. The term cascading describe the capability of a local style to override a general style. CSS applies style.
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.
And How To Avoid Them! Continuing Studies CS 22: Enhanced Web Site Design September 2013 Top Ten Web Design Misteaks (sic)
 CSS ids  Pages  Sites  HTML: class=“name”  Names may define format OR content › Either works  CAN apply multiple classes to the same tag  Multiple.
Tutorial 1 Developing a Basic Web Page
Tutorial 9 Working with XHTML. XP Objectives Describe the history and theory of XHTML Understand the rules for creating valid XHTML documents Apply a.
CIS101 Introduction to Computing HTML Project Two.
AdvWeb-1/20 DePaul University SNL 262 Web Page Design Design Information Instructor: David A. Lash.
Creating a Well-Formed Valid Document. 2 Objectives Introducing XHTML Creating a Well-Formed Document Creating a Valid Document Creating an XHTML Document.
Assignment 1 Pointers ● Be sure to use all tags properly – Don't use a tag for something it wasn't designed for – Ex. Do not use heading tags... for regular.
STANFORD UNIVERSITY INFORMATION TECHNOLOGY SERVICES Technology Training Services, January 2011 Web.
Creating Tables in a Web Site Using an External Style Sheet HTML5 & CSS 7 th Edition.
Basics of HTML. Example Code Hello World Hello World This is a web page.
Tutorial 1: Getting Started with HTML5
Creating Tables in a Web Site Using an External Style Sheet
 ult.htm ult.htm  This website illustrates the use of CCS (style sheets)
Working with XHTML Creating a Well-Formed Valid Document.
XP Tutorial 9New Perspectives on Creating Web Pages with HTML, XHTML, and XML 1 Working with XHTML Creating a Well-Formed Valid Document Tutorial 9.
INTERNAL CSS Casey Ames Different types of CSS There are three different types of CSS: ◦ External CSS ◦ Internal CSS ◦ Inline CSS In this presentation.
Chapter 2 HTML Basics Key Concepts Copyright © 2013 Terry Ann Morris, Ed.D 1.
Neal Stublen Course Road Map  Create web page layouts using CSS  Manage CSS  Test website validity  Create navigation menus using.
Cascading Style Sheets Class 2, Lecture 3 Rachel A Ober
Lesson 02 // Elements & Attributes. There are different types of elements, but the 2 most important ones are BLOCK and INLINE. Block elements flow from.
>> HTML: Structure Elements. Elements in HTML are either Inline or Block. Block-level Elements – Begins on a new line – Occupy the whole width – Stacks.
CIS 1300 – Web Design SoftwareMichael J. Losacco Web Site Sins Cool Is Overrated.
HTML.
Course created by Sarah Phillips BBCD Melbourne BAPDCOM Version 1 – April 2013.
Cascading Style Sheets CSS. Source W3Schools
DYNAMIC HTML What is Dynamic HTML: HTML code that allow you to change/ specify the style of your web pages. Example: specify style sheet, object model.
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.
Cascading Style Sheets (CSS) Part II IT210: Web-based IT.
XP Tutorial 9New Perspectives on HTML and XHTML, Comprehensive 1 Working with XHTML Creating a Well-Formed Valid Document Tutorial 9.
XP New Perspectives on HTML and XHTML, Comprehensive 1 Developing a Basic Web Page Week 2.
Tutorial 9 Working with XHTML. New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition 2 Objectives Describe the history and theory of XHTML.
Unit 5 The Web Book Test. Unit 5 Test The Web Book Test 1. On the bottom of page 46, why is writing web pages not like writing printed documents ?
Practice for Chapter 3: Assume that you are a freelance web designer and need to create a website to promote your freelance company.
Tutorial 9 Working with XHTML. XP Objectives Describe the history and theory of XHTML Understand the rules for creating valid XHTML documents Apply a.
Creating Web Pages with Links, Images, and Embedded Style Sheets
 Add one element at a time  If it doesn’t do what you want, › Delete it › DON’T just keep piling on more items.
CSS Layout Cascading Style Sheets. Lesson Overview  In this lesson, we’ll cover:  Brief CSS review  Creating sections with the tag  Creating inline.
Elements & Attributes. There are different types of elements, but the 2 most important ones are BLOCK and INLINE. Block elements flow from top to bottom.
HTML LAYOUTS. CONTENTS Layouts Example Layout Using Element Example Using Table Example Output Summary Exercise.
Cascading Style Sheets for layout
CCT260H - Christopher Evan Jones
Creating a Well-Formed Valid Document
Coding, Testing and Valdating a Web Page
Cascading Style Sheets
The Internet and HTML Code
Top Five Web Design Misteaks (sic)
HTML5 Level I Session II Chapter 3 - How to Use HTML to Structure a Web Page
Creating a Successful Web Presence
“Semantic” Tags Semantic markup describes what the content contains as opposed to what it looks like! Examples include: div, nav, article, header, footer.
Basic Steps: Set up account, log in Select theme (colors, tabs)
Web Accessibility Guidelines
Final Study Guide Arts & Communications.
Building ASP.NET Applications 2
Web Standards and Accessible Design.
Understand basic HTML and CSS terminology, concepts, and basic operations. Objective 3.01.
HTML / CSS Mai Moustafa Senior Web Designer eSpace eSpace.
Demystifying Web Content Accessibility Guidelines
HTML and CSS Basics.
Multipage Sites.
One Set of Styles Connected to As Many Pages as You Want!!!
Presentation transcript:

Web Blunders: The Top 5 Biggest Mistakes on the Web Pete LePage Microsoft Corp. Web Blunders: The Top 5 Biggest Mistakes on the Web

The Web: A Giant Collaborative Melting Pot The web is full of “experts” How do we know what is right? It’s easy to copy code from the web Lots of good code out there Lots of not so good code out there Lots of bad code out there

#5 Unprofessional Site Design Lack of contrast Clashing colors Difficult navigation Doesn’t flow when reading or finding info

#4 Lousy Content Poorly written copy Lack of editing on copy No privacy policy on visitor information

#3 Poorly Coded HTML/CSS/JavaScript Using inline styles Overlapping tags Apple’s QuickTime Detection Frames

#2 Inappropriate Use Of Rich Content Sites that contain no HTML Auto-playing music, videos, etc

#1 Not Being POSH* Using elements and attributes for purely presentational purposes Not validating mark up Extraneous use of DIVs for formatting *Plain Old Semantic HTML – see http://microformats.org/wiki/posh