Adjusting the Focus: Updating a Web Portal Using CSS, JavaScript, and AJAX Stephan Spitzer Lead Developer/DBA, Applied Medical Informatics James A. Zimble.

Slides:



Advertisements
Similar presentations
PHP and CSS to control web apps styles. CSS is used to style today’s web applications.
Advertisements

CHAPTER 15 WEBPAGE OPTIMIZATION. LEARNING OBJECTIVES How to test your web-page performance How browser and server interactions impact performance What.
CNIT 133 Interactive Web Pags – JavaScript and AJAX Review CSS.
Desert Code Camp Ajax Enabling a Web site using AjaxPro.NET Joseph Guadagno
Client side performance in Web based Banking applications Divakar Prabhu Infosys Limited (NASDAQ: INFY)
AJAX – The Future of Web Development? Anders Moberg David Mörtsell David Södermark.
IS 360 Course Introduction. Slide 2 What you will Learn (1) The role of Web servers and clients How to create HTML, XHTML, and HTML 5 pages suitable for.
INTRODUCTION The Group WEB BROWSER FOR RELATION Goals.
Ajax Dr Jim Briggs WEBP Ajax1. 2 Ajax Asynchronous JavaScript And XML Method of creating more interactive web applications Moves more of the application.
Web 2.0 with AJAX Students : LASC Ioana KELEMEN Csilla POP Dan Adrian CIOBANU Dumitru Daniel Project leader : Ahmed RHIAT.
Mark Phillip markphillip.com 200s, 304s, Expires Headers, HTTP Compression, And You.
Microsoft Share Point 2007 Lela Castaneda. Microsoft Office SharePoint Designer 2007 top 10 benefits 1)Be more productive with next-generation Microsoft.
Prof. James A. Landay University of Washington Spring 2008 Web Interface Design, Prototyping, and Implementation Rich Internet Applications: AJAX, Server.
Making AJAX Easy with jQuery Chris Renner Health Systems Analyst Programmer & Informatics Manager VUMC Office of Grants & Contracts Management October.
1 Ajax. 2 What’s Ajax? AJAX is a combination of a few technologies that has come together in the past few years AJAX used to be an acronym for Asynchronous.
1 HTML and CGI Scripting CSC8304 – Computing Environments for Bioinformatics - Lecture 10.
May 16 – 18, 2007 Copyright 2007, Data Access Worldwide May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Build Great Web Application 'Fast and Easy'
ASP.NET AJAX 1. Ordinary web applications vs. AJAX Ordinary web application The full page is updated at each request The page is not available while being.
CSS 404 Internet Concepts. XP Objectives Developing a Web page and a Website Working with CSS (Cascading Style Sheets) Web Tables Web Forms Multimedia.
Weekend MS CS Program Internet and Web Technologies COT 5930 Web Project Development - Ajax Dr. Roy Levow, Associate Chair & Professor
Dreamweaver 8 Introduction What you can do with Dreamweaver 8 What's new in Dreamweaver 8.
Planning your site/organization on the Web Please use speaker notes for additional information!
Session I Chapter 1 - Introduction to Web Development
Building Rich Web Applications with Ajax Linda Dailey Paulson IEEE – Computer, October 05 (Vol.38, No.10) Presented by Jingming Zhang.
Web Design (1) Terminology. Coding ‘languages’ (1) HTML - Hypertext Markup Language - describes the content of a web page CSS - Cascading Style Sheets.
Fall 2006 Florida Atlantic University Department of Computer Science & Engineering COP 4814 – Web Services Dr. Roy Levow Part 2 – Ajax Fundamentals.
Louisa Lambregts, Louisa Lambregts
Web Architecture Introduction
MAC-MLA 2008 Do You Really Know Who is Using Your Systems? Stephan Spitzer Lead Developer/DBA, Applied Medical Informatics James A. Zimble Learning Resource.
 Computer use language to communicate  A web browser will read these tags and translate it into what you actually see  Viewing Code of ESPN WebsiteESPN.
INNOV-7: Building a Richer UI for the Browser Chris Skeldon Senior Solution Consultant.
the acronym for Asynchronous JavaScript and XML.
Session 1 Chapter 1 - Introduction to Web Development ITI 133: HTML5 Desktop and Mobile Level I
Ajax for Dynamic Web Development Gregory McChesney.
Web Design Vocab 7 Absolute, Cache, Codec, CSS, Gamma.
 AJAX – Asynchronous JavaScript and XML  Ajax is used to develop fast dynamic web applications  Allows web pages to be updated asynchronously by transferring.
Summer 2007 Florida Atlantic University Department of Computer Science & Engineering COP 4814 – Web Services Dr. Roy Levow Part 1 – Introducing Ajax.
JavaScript & Introduction to AJAX
AJAX – Asynchronous JavaScript And XML By Kranthi Kiran Nuthi CIS 764 Kansas State University.
John Foushee Andrew Hulbert Brian Louden. What is the Hawking Toolbar?  Short Description  Project Goal Allow Users to Access Web Content and Browser.
Intro Web Applications Andrew Benson – ScottyLabs – CrashCourse F14.
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..
Dreamweaver is an XHTML editor that allows you to: Create a site Create external Cascading Style Sheets (CSS) to store the styles used in your pages Create.
How I Learned to Stop Worrying and Love the KSS Part 1: Client/Server Actions Chris Calloway TriZPUG November 2007 Thanks to BubbleNet and Greenfinity.
Lesson 1: HTML and the Web Instructor: Mrs. KIM Lang.
MICROSOFT AJAX CDN (CONTENT DELIVERY NETWORK) Make Your ASP.NET site faster to retrieve.
Ajax & Client-side Dynamic Web Gunwoo Park (Undergraduate)
DLSLUG Presentation: Firefox extensions. DLSLUG Presentation: Firefox extensions, Roger Trussell ● My address is
INNOV-16: Rich User Interface for the Web???? AJAX to the Rescue Ken Wilner VP of Technology Progress Software.
Web Technologies Computing Science Thompson Rivers University
Project 1 Introduction to HTML.
JavaScript and Ajax (Ajax Tutorial)
Department of Computer Science
Introduction to Website Creation in sphb K200
Jerrell Jackson
By Gary Mandela December 26, 2006
AJAX.
Prepared for Md. Zakir Hossain Lecturer, CSE, DUET Prepared by Miton Chandra Datta
Ideas for Action: Data-Driven Culture
IS 360 Course Introduction
Overview of Dreamweaver
CMP Creating Your Personal and Small Business Web Sites
HTML5 Level I Session I Chapter 1 - Introduction to Web Development
MIS Professor Sandvig MIS 324 Professor Sandvig
ITI 163: Web, Mobile, and Social Media Design Introduction
Introduction to World Wide Web
HTML and CSS Basics.
Web Site Development Careers
Other options Note: Style switcher.
Presentation transcript:

Adjusting the Focus: Updating a Web Portal Using CSS, JavaScript, and AJAX Stephan Spitzer Lead Developer/DBA, Applied Medical Informatics James A. Zimble Learning Resource Center Uniformed Services University of the Health Sciences Stephan Spitzer Lead Developer/DBA, Applied Medical Informatics James A. Zimble Learning Resource Center Uniformed Services University of the Health Sciences 1MAC-MLA 2010

Project Description Goals ◦ Cleaner Design ◦ More Uniform User Experience ◦ Tighten Code ◦ Faster Access ◦ Try Cool Stuff Methods ◦ Adopt from Professional Web Sites ◦ CSS – Cascading Style Sheets ◦ Test with Multiple Browsers/Platforms ◦ JavaScript ◦ Minimize Server Access:  Delay Delivering Data Until Requested  AJAX – Asynchronous JavaScript and XML ◦ Firefox with Web Developer + Firebug + YSlow MAC-MLA 20102

Current Portal - ER (circa 2006) MAC-MLA 20103

New Portal Design – ER Version 3 MAC-MLA 20104

Quick Title Example MAC-MLA 20105

Action Pop-Ups MAC-MLA 20106

Menu Revealed MAC-MLA 20107

Results: 8 Current Configuration ER 3 Configuration