INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 LAST WEEK ON IO LAB Write your first Greasemonkey script. Complete the CSS self-test. You can find links.

Slides:

Advertisements

Similar presentations

HTML and CSS. HTML Hyper Text Markup Language Tells browser how to display text and images.

Advertisements

CSS Styling CSS Box Model & CS110: Computer Science and the Internet.

CSS The basics { }. CSS Cascading Style Sheets - language used to – describe html appearance & formatting Style Sheet - file that describes – how html.

End User Computing An Introduction to CSS Sujana Jyothi Research Lab1, Callan Building, Department of Computer Science

Web Pages and Style Sheets Bert Wachsmuth. HTML versus XHTML XHTML is a stricter version of HTML: HTML + stricter rules = XHTML. XHTML Rule violations:

Class four: the box model and positioning. is an HTML tag which allows you to create an element out of inline text. It doesn’t mean anything! try it:

Unit 20 - Client Side Customisation of Web Pages

INFORMATION ORGANIZATION LAB SEPTEMBER 8, 2009 LAST WEEK ON IO LAB Install Firebug and Greasemonkey. Complete the online skills assessment. Join the

Lecture Cascading Style Sheets (CSS) Internal Style Sheets Classes.

Made by: Dan Ye. Introduction Basic Last Page ☆ HTML stands for Hyper Text Markup Language; ☆ HTML is not a programming language, it is a markup language;

Web Workshop: CSS Objectives: - “What is CSS?” - Structure of CSS - How to use CSS in your webpage.

Week 12: JQuery Write less, do more.. JQuery Basics Lightweight JavaScript Library – Emphasizes interaction between JavaScript and HTML – Reduces technical.

Cascading Style Sheet (CSS) Instructor: Dr. Fang (Daisy) Tang

Creating your website Using Plain HTML. What is HTML? ► Web pages are authored in HyperText Markup Language (HTML) ► Plain text is marked up with tags,

INTRO TO MAKING A WEBSITE Mark Zhang.  HTML  CSS  Javascript  PHP  MySQL  …That’s a lot of stuff!

JMD2144 – Lesson 5 Web Design & New Media. ‘Div’ide and conquer One of the most versatile structure tags available is the.. tag Short for ision, it allows.

Docs, Spreadsheets, & Presentations. What Do YOU Know???

Slide 1 of 83 Table Borders To specify table borders in CSS, use the border property. The example below specifies a black border for table, th, and td.

HTML - Quiz #2 Attendance CODE:

Key question  What are the three standardized core languages used to implement web pages? Write the full name not the abbreviation and describe the “layer”

Eat Your Words! Creating webpage Layout. CONTENT The Layout of a Webpage HEADER FOOTER Each of these sections represents a ‘div’ (or divider). By linking.

18 People Surveyed HTML (HyperText Markup Language) HTML “tags” Describes structure Building blocks Headings, paragraphs, lists, links, images, quotes,

Cascading Style Sheets Class 1, Lecture 1 Rachel A Ober

>> Introduction to HTML: Tags. Hyper - is the opposite of linear Text – words / sentences / paragraphs Mark-up – Marking the text Language – It is a language.

CIS67 Foundations for Creating Web Pages Professor Al Fichera Rev. September 14, 2010—All HTML code brought to XHTML standards. Reference for CIS127 and.

Just A Few More Fun Objectives 1 Having Some Fun With Java Script 2 Using Style Sheets.

INFORMATION ORGANIZATION LAB SEPTEMBER 14, 2010 Overview of HTML, CSS, JavaScript, and jQuery. Introduction to browser extensions. Details about Project.

By: Jennifer Huff & Courtney Stenzhorn. What Do YOU Know???

 Use the think diagram … ISP Server.

INFORMATION ORGANIZATION LAB SEPTEMBER 7, 2010 Install Chrome or Firebug. Complete the online skills assessment and lab Doodle. Join the

WRA HTML & CSS – BUILDING WEBPAGES. TODAY’S AGENDA Review: external stylesheets Review: transforming a list Intro: the object Intro: the.

Interface Programming 1 Week 3. Interface Programming 1 CALENDAR.

WRA 210: MODULE 3 &PORTFOLIO SESSION 2: STUFF TO REMEMBER Do the readings. It helps, seriously. Ask questions. It’s OK to interrupt me (not others).

JQuery Introduction © Copyright 2014, Fred McClurg All Rights Reserved.

Colors & Fonts Building a Website Lesson 7. Font Font The tag specifies the font face, font size, and color of text. The tag can have any or all of these.

Kapi’olani Community College Art 128 Interface Programming 1 In-class Presentation Week 3A.

Advanced Topics Lecture 8 Rachel A Ober

Miguel Lara, PhD. 1:10 – 1:15 Pre-test 1:15 – 1:30 Course overview 1:30 – 2:00 Setting up DW Site 2:00 – 2:05 > 2:05 – 2:55 Hands-on Lecture 2:55 – 3:00.

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.

Understanding ID and Class in CSS Web Design – Sec 4-9 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development.

Open the index.html Open this PowerPoint from the S Drive IDT folder Chapman Images.ppt.

October 7 th, 2010 SDU Webship. What did we learn last week? jQuery makes it really easy to select elements and do stuff with them. jQuery can process.

IN THIS LESSON, WE WILL BECOME FAMILIAR WITH HTML AND BEGIN CREATING A WEB PAGE IN YOUR COMPUTER HTML – the foundation.

PHP and AJAX. Servers and Clients For many years we tried to move as much as possible to the server. Weak clients, poor bandwidth, browser compatibility..

Tutorial 5: Tables Session OBJECTIVES Create a table Insert a table summary Insert a table caption Add rows and cells Merge Cells inside a Table.

Introduction to AJAX MIS 3502, Spring 2016 Jeremy Shafer Department of MIS Fox School of Business Temple University 2/4/2016.

Stylizing a Navigational Menu Web Design Section 6-3 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development.

IN THIS LESSON, WE WILL BECOME FAMILIAR WITH HTML AND BEGIN CREATING A WEB PAGE IN YOUR COMPUTER HTML – the foundation.

Cheryl Wolfe Web Services Administrator Tampa-Hillsborough County Public Library James Day Electronic Services Librarian Embry-Riddle Aeronautical University.

JavaScript and Ajax (JavaScript Dynamic HTML (DHTML)) Week 7 Web site:

LT: I can use CSS to decorate a web page. Do Now: Get your storyboard, and log in to winhome. Write our a list of colors you want in your website. (Minimum.

Ch. 2. HTML 1. HTML? 2  Tim Berner-Lee first proposed (1981) and coded (1991)  HTML: HyperText Markup Language  Web browser 용  W3C (World Wide Web.

1 Cascading Style Sheet (CSS). 2 Cascading Style Sheets (CSS)  a style defines the appearance of a document element. o E.g., font size, font color etc…

DECISION STRUCTURE IN JAVA TEACHER: MR. HO. AGENDA Review: Software Development Life Cycle Decision Structure in Java Work Period: In-Class Exercise Bonus.

Miguel Lara, PhD. Design and development instructional websites using a variety of web technologies such as HTML5, CSS, JavaScript, and jQuery.

CSS (Cascading Style Sheets). CSS CSS – Cascading Style Sheets – Cascade because of the way CSS rules can stack on top of each other. Allows you to add.

The Box Model in CSS Web Design – Sec 4-8

The Box Model in CSS Web Design – Sec 4-8

CSS Layouts: Grouping Elements

CSS Box Model <span> & <div>

Introduction to Web programming

The Box Model in CSS Web Design – Sec 4-8

WEB 240 Education for Service-- snaptutorial.com.

HTML5 Level I CyberAdvantage

Cascading Style Sheets

HTML5 Level I CyberAdvantage

Web Programming and Design

Presentation transcript:

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 LAST WEEK ON IO LAB Write your first Greasemonkey script. Complete the CSS self-test. You can find links to help with all of these on the course website at We’ll start by going over any questions you had about these.

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 AJAX and Cross-site Scripting Web 2.0 FTW

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 The History of AJAX Web 2.0 FTW HTMLDHTML AJA X

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 AJAX What? Asynchronous Javascript and XmlHttpRequest

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 XSS (Cross-site scripting)

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 Evil.com Normal WebpageAJAX

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 XSS (Cross-site scripting)

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 Let’s try it!

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 Project 1 Due September 22

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 Project 1 Due September 22

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 Project 1 Due September 22

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 Project 1 Due September 22

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 Project 1 Due September 22 ?

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 Project requirements 1. Location to view your project 2. A description of your project, including implementation and challenges. 3. Due Tuesday, 9/22 by 12:00pm (noon).

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 In-Class Exercise Make something work in 45 minutes

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 In-Class Exercise Brainstorm what you want your interface to do and make a drawing. (10 minutes) Download the template for your project from the IO Lab Resources page. Implement the interface that you drew. (30-40 minutes)

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 CSS Tips My Webpage To center text inside a container, use text-align: center; My Webpage h1 h1 { text-align: center; }

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 CSS Tips My Webpage To center a container on the page use margin: 0 auto; My Webpage h1 h1 { text-align: 165px; margin: 0 auto; }

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 CSS Tips To add a border to an element use border: 1px solid blue; My Webpage h1 h1 { border: 3px solid red; } SizeTypeColor

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 Lessons for project 1 Make a drawing or sketch of what you want to do. When you are writing the JavaScript code, first write comments in plain English describing what you want to do. If it doesn’t work, ask questions.

INFORMATION ORGANIZATION LAB SEPTEMBER 15, 2009 For Next Week Project 1 is due. us with the location of your completed work and a 1 paragraph write-up Due by 12:00pm (noon) Tuesday, Sept. 22 Be ready to demo and discuss in class. Install RapidSVN. You can find links to help with all of these on the course website at