a brief introduction to web building technologies
TRANSCRIPT
![Page 1: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/1.jpg)
A Brief Introduction toWeb-building Technologies
Finian
![Page 2: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/2.jpg)
Table of Contents
• A Introduction to the WEB• Front-end Development• Back-end Development• Future Web Trends
![Page 3: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/3.jpg)
A Introduction to the WEB
• Can you survive without the Internet?• In a sense, we are heavy users of the Internet.
Perhaps, we can’t live a single day without it.• It’s becoming more and more important in our
daily life.• And…it’s becoming more and more
convenient.
![Page 4: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/4.jpg)
WEB 2.0WEB 2.0
![Page 5: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/5.jpg)
Mechanism
![Page 6: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/6.jpg)
Front-end Development
• HTML/XHTML• CSS• JavaScript
Presentation
Structure
Behavior
![Page 7: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/7.jpg)
HTML/XHTML
• HyperText Markup Languageis the markup language for Web pages. It provides a means to describe the structure of text-based information in a document
• often have a .html filename extension• Extensible Hypertext Markup Language
has the same depth of expression as HTML, but also conforms to XML syntax.
![Page 8: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/8.jpg)
HTML/XHTML<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><meta http-equiv="Content-Language" content="gb2312" /><meta name="robots" content="all" /><meta name="author" content="finian" /><meta name="copyright" content="copyright" /><meta name="description" content="description" /><meta name="keywords" content="keywords" /><title>Title</title></head>
<body><h1>Hello XHTML</h1></body></html>
![Page 9: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/9.jpg)
CSS
• Cascading Style Sheetsused to describe the presentation of a documentrender
• 3 ways:<link rel=“stylesheet” href="http://www.dhtmlet.com/dhtmlet.css" type="text/css">
<style type=“text/css”>…</style>
<h1 style=“…”>Hello HTML</h1>
![Page 10: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/10.jpg)
JavaScript
• is a scripting language most often used for client-side web development
• Libraries:extjs (extjs.com)jquery (jquery.com)prototype, dojo…
![Page 11: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/11.jpg)
jQuery
![Page 12: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/12.jpg)
Back-end Development
• Server side• PHP, Java, Asp.net, Python, Ruby…
![Page 13: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/13.jpg)
PHP
• What’s PHP?PHP, which stands for "PHP: Hypertext Preprocessor" isa widely-used Open Source general-purpose scripting language that is especially suited for Web development and can be embedded into HTML. Its syntax draws upon C, Java, and Perl, and is easy to learn. The main goal ofthe language is to allow web developers to write dynamically generated web pages quickly, but you can do much more with PHP.
![Page 14: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/14.jpg)
PHP
Rasmus Lerdorf Zeev Suraski Andi Gutmans
Zend
![Page 15: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/15.jpg)
Who’s using PHP?
• Google, YouTube, Yahoo, Flickr, Facebook, Adobe, Digg, Baidu, Tencent, Sina, Sohu, Taobao…(many more)
![Page 16: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/16.jpg)
What can PHP do?
• Server-side scripting• Command line scripting• Writing desktop applications
![Page 17: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/17.jpg)
Why PHP?
• fast, flexible, opensource…• LAMP
excellent solution stack of software used to run dynamic Web sites or servers
![Page 18: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/18.jpg)
PHP Example
<?php$var = 'Hello PHP';echo $var;
?>
![Page 19: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/19.jpg)
Joomla (PHP CMS)
![Page 20: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/20.jpg)
Future Web Trends• Semantic Web• Artificial Intelligence• Virtual Worlds• Mobile• Attention Economy• Web Sites as Web Services• Online Video / Internet TV• Rich Internet Apps• International Web• Personalization
![Page 21: A Brief Introduction To Web Building Technologies](https://reader035.vdocument.in/reader035/viewer/2022062513/55574effd8b42a63448b4d45/html5/thumbnails/21.jpg)
Thank You