Basics of Web Designing Languages
-
Upload
ajay-jakhar -
Category
Internet
-
view
103 -
download
2
Transcript of Basics of Web Designing Languages
![Page 1: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/1.jpg)
![Page 2: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/2.jpg)
ServerClient
![Page 3: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/3.jpg)
WWW
(Hyper-text markup language)
(Cascading Style Sheets)
(Javascript)
(Hypertext Preprocessor )
(eXtensive Markup Language)
(Asynchronous Javascript and XML)
AJAX
(World Wide Web)
![Page 4: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/4.jpg)
(Hyper text markup language)
• A markup language is a set of markup tags
• HTML is a markup language
• The tags describe document content
• Html tags are stored in .html or .htm files
HTML 1991
HTML+ 1993
HTML 2.0 1995
HTML 3.2 1997
HTML 4.01 1999
XHTML 1.0 2000
HTML5 2012
XHTML5 2013
![Page 5: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/5.jpg)
(Hyper text markup language)
<html><body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body></html>
![Page 6: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/6.jpg)
(Cascading Style Sheets)
• CSS stands for Cascading Style Sheets• Styles define how to display HTML elements• Styles were added to HTML 4.0 to solve a problem• External Style Sheets can save a lot of work• External Style Sheets are stored in CSS files
table{ border :1px solid #C00; }
selector property value
![Page 7: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/7.jpg)
body{background-color:#d0e4fe;
}h1 {
color: orange;text-align: center;
}p {
font-family: "Times New Roman";font-size:20px;
}
(Cascading Style Sheets)
![Page 8: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/8.jpg)
• The purpose of Jquery is to make it much easier to use JavaScript on your website.
• Jquery takes a lot of common tasks that require many lines of JavaScript code to accomplish, and wraps them into methods that you can call with a single line of code.
• Jquery is a lightweight, "write less, do more", JavaScript library.• Jquery also simplifies a lot of the complicated things from JavaScript,
like AJAX calls and DOM manipulation.
HTML/DOM manipulation CSS manipulation HTML event method
Effects and animations AJAX Utilities
Features:
![Page 9: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/9.jpg)
$(document).ready(function(){
$("p").click(function(){
$(this).hide();});
});
![Page 10: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/10.jpg)
Many of the biggest
companies are using
Jquery
![Page 11: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/11.jpg)
• JavaScript was invented by Brendan Eich.
• JavaScript is the world's most popular programming language. It is the language for HTML and the web, for servers, PCs, laptops, tablets, smart phones, and more.
• JavaScript is programming code that can be
inserted into HTML pages.
• JavaScript inserted into HTML pages, can be
executed by all modern web browsers.
![Page 12: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/12.jpg)
<!DOCTYPE html><html><body>
.
.<script>
document.write("<h1>This is a heading</h1>");document.write("<p>This is a paragraph</p>");
</script>..
</body></html>
![Page 13: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/13.jpg)
(Asynchronous JavaScript and XML)
• AJAX is the art of exchanging data with a server, and updating parts of a web page -without reloading the whole page.
![Page 14: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/14.jpg)
An event occurs…
• Create an XMLHttpRequest object
• Send HttpRequest
• Process the returned data using Javascript
• Update page content
• Process HTTPRequest
• Create a response and send data back to the browser
BROWSER
SERVER
![Page 15: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/15.jpg)
(eXtensive Markup Language)
• XML is designed to transport and store data.• XML is designed to carry data, not to display data• XML tags are not predefined. You must define your own
tags• XML is designed to be self-descriptive
![Page 16: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/16.jpg)
<?xml version="1.0"?><note>
<to>PRIYA</to><from>PRINCE</from><heading>Reminder</heading><body>
Don't forget me this weekend!</body>
</note>
(eXtensive Markup Language)
![Page 17: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/17.jpg)
(Hypertext Preprocessor)
• PHP is a server-side scripting language, and is a powerful tool for making dynamic and interactive Web pages quickly.
• PHP is a widely-used, open source scripting language
• PHP scripts are executed on the server
![Page 18: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/18.jpg)
<html><body>
<?phpecho "My first PHP script!";
?>
</body></html>
(Hypertext Preprocessor)
![Page 19: Basics of Web Designing Languages](https://reader030.fdocuments.us/reader030/viewer/2022032714/55aac2e31a28abee758b4804/html5/thumbnails/19.jpg)
THANK Y U