diwe - introduction to web technologies
TRANSCRIPT
![Page 1: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/1.jpg)
Diploma in Web Engineering
Module I: Introduction to Web Technologies
Rasan SamarasingheESOFT Computer Studies (pvt) Ltd.No 68/1, Main Street, Pallegama, Embilipitiya.
![Page 2: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/2.jpg)
Content
1. What is “Web” ?2. HTML (HyperText Markup Language)3. Web Developers Knowledge Areas4. Nature of the Web5. Current Trends in Web Development6. Tools and Technologies7. Web Design Concepts8. Color usage on the Web
![Page 3: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/3.jpg)
What is “Web” ?
Web
A way of organizing informatio
n on the internet
Consist of servers, clients, a protocol and html
documents
An interconne
ction between
millions of computers
![Page 4: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/4.jpg)
HTML (HyperText Markup Language)
HTML is the main markup language for creating web pages and other information that can be
displayed in a web browser.
![Page 5: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/5.jpg)
HTML Versions
Version Year
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 6: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/6.jpg)
Web Developers Knowledge Areas
You gotta learn…
HTMLCSSClient Side ScriptingServer Side Scripting
![Page 7: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/7.jpg)
Nature of the Web…
The internet is transactional, that means user requests and server responds.
![Page 8: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/8.jpg)
Nature of the Web…
Websites are either static or dynamic in content.
![Page 9: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/9.jpg)
Nature of the Web…
It’s not a broadcast medium. Thus concepts of mass media is not valid for the internet.
Vs
![Page 10: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/10.jpg)
Current Trends in Web DevelopmentSome popular websites then…
![Page 11: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/11.jpg)
Current Trends in Web Development
Data driven content has become more popular
![Page 12: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/12.jpg)
Current Trends in Web Development
Rich content on web pages
![Page 13: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/13.jpg)
Current Trends in Web Development
E-Commerce Development
Intranet Development
![Page 14: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/14.jpg)
Tools and Technologies
WYSIWYG Editors for Web Designing
Microsoft FrontPage Adobe Dreamweaver
![Page 15: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/15.jpg)
Web Design Concepts
Remember…
• The primary objective of good design is giving user a satisfying experience.
• But dazzling user is not our main goal.
• It’s all about giving users what they want.
• Well planned design, quality content and proper use of media can achieve this goal.
![Page 16: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/16.jpg)
Web Design Concepts
![Page 17: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/17.jpg)
Color usage on the Web
Colors are displayed combining RED, GREEN, and BLUE light.
![Page 18: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/18.jpg)
Color usage on the Web
There are two main color numbering formats…
• RGB Color Format• Hexadecimal Color Format
![Page 19: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/19.jpg)
Color Names Supported by All Browsers
![Page 20: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/20.jpg)
Tips for Color Usage on the Web
Make sure website text is readable. Limit the color choices. Make to consider brand guidelines. Use richer colors for prominent items. Keep cultural color meanings in mind. Does it fit with the theme?
![Page 21: DIWE - Introduction to Web Technologies](https://reader037.vdocuments.net/reader037/viewer/2022102323/5483b7d3b4af9f38278b47a1/html5/thumbnails/21.jpg)
The End
http://twitter.com/rasansmn