SlideShare a Scribd company logo
Introduction to Web
Designing
- Guest Lecture by Kailaash Balachandran
2
Chapters
●
Introduction
●
Domains and Hosting
●
The Working
●
Programming Languages
●
Tools
●
Running Example
3
Interesting Facts about WWW
§
There’s an estimated 937 million websites on the WWW.
§
1 in every 9 people on Earth is on Facebook (2012).
§
There are approximately 4,200 new domain names
registered every hour.
§
17 Million users use Google every hour.
§
Web design industry is the 2nd fastest growing area in
software sector.
§
At any given second, 5 new websites are being developed
and published.
4
Sample Web Page (1)
5
Domains and Hosting (1)
Domains
§
They are used to locate a website.
§
Example: google.com, yahoo.com, facebook.com
§
Domain name and extensions are provided by ICANN.
Internet Corporation for Assigned Names and Numbers
§
Extensions includes .org , .net , .gov , .mil , .in , .us
.
6
Sample Web Page (2)
7
Domains and Hosting (1)
Hosting Server
§
Where the website content is stored.
§
Compare this to hard disk in a computer.
§
Storage space and bandwidth matters.
§
We require FTP host name, username and password to transfer our
files to the server.
§
Use FTP Client to transfer.
8
The Working (1)
HTTP : Hyper Text Transfer Protocol
● Client is the browser.
● Hosting Server
URL can be written as
http://onlinemacha.com (or)
http://www.onlinemacha.com (or)
onlinemacha.com
9
Languages
Basic web programming languages
§
HTML – Hyper Text Markup Language
●
CSS – Cascading Style Sheets
§
Java Script
§
PHP – Hypertext PreProcessor
Client Side
Server Side
10
Tools
Design Tools
§
Photoshop , Illustrator , Corel Draw.
§
Dreamweaver
FTP Client Tool
§
Filezilla
11
Design Process
1. Know the requirements of the website.
2. Design the entire website on Photoshop.
3. Once the design is finalized, reconstruct the design on HTML /
CSS.
4. Photoshop to Code. Test run on your computer.
5. Upload the files to the hosting server using any FTP Client tool.
12
Running Example
Now, let's design a simple web page from scratch
and make it work....
13
Designer's Kit
§
HTML5, CSS3
§
JavaScript
§
PHP5
§
SEO – Search Engine Optimization
§
Responsive Design
14
Future for Web ?
§
Semantic Web
§
Peer to Peer (P2P)
15
Thank You, Questions ?

More Related Content

What's hot

MongoDB + Pylons FTW: Scalable Web apps with Python & NoSQL
MongoDB + Pylons FTW: Scalable Web apps with Python & NoSQLMongoDB + Pylons FTW: Scalable Web apps with Python & NoSQL
MongoDB + Pylons FTW: Scalable Web apps with Python & NoSQL
niallo
 
NYT Web Archive
NYT Web ArchiveNYT Web Archive
NYT Web Archive
Justin Heideman
 
Availing Windows Dedicated Servers of HTS Hosting
Availing Windows Dedicated Servers of HTS HostingAvailing Windows Dedicated Servers of HTS Hosting
Availing Windows Dedicated Servers of HTS Hosting
HTS Hosting
 
PHP and PDFLib
PHP and PDFLibPHP and PDFLib
PHP and PDFLib
Adam Culp
 
Linux Hosting Training Course Level 1-2
Linux Hosting Training Course Level 1-2Linux Hosting Training Course Level 1-2
Linux Hosting Training Course Level 1-2
Ramy Allam
 
DRUPAL CACHE SYSTEMS AND VARNISH
DRUPAL CACHE SYSTEMS AND VARNISHDRUPAL CACHE SYSTEMS AND VARNISH
DRUPAL CACHE SYSTEMS AND VARNISH
Drupal Portugal
 
Linux Hosting Training Course [Level 1] - Lec 7
Linux Hosting Training Course [Level 1] - Lec 7Linux Hosting Training Course [Level 1] - Lec 7
Linux Hosting Training Course [Level 1] - Lec 7
Ramy Allam
 
RESTful with Drupal - in-s and out-s
RESTful with Drupal - in-s and out-sRESTful with Drupal - in-s and out-s
RESTful with Drupal - in-s and out-s
Kalin Chernev
 
Bentobox exercise
Bentobox exerciseBentobox exercise
Bentobox exercise
Rails Girls Zurich
 
Doing E-commerce Right – Magento on DigitalOcean
Doing E-commerce Right – Magento on DigitalOceanDoing E-commerce Right – Magento on DigitalOcean
Doing E-commerce Right – Magento on DigitalOcean
DigitalOcean
 
Html
HtmlHtml
E commerce
E commerceE commerce
E commerce
ashvin tembhare
 
Building Multilingual Websites in Drupal 7
Building Multilingual Websites in Drupal 7Building Multilingual Websites in Drupal 7
Building Multilingual Websites in Drupal 7
robinpuga
 
Dynamic websites lec5
Dynamic websites lec5Dynamic websites lec5
Dynamic websites lec5Belal Arfa
 
Redis Overview
Redis OverviewRedis Overview
Redis Overview
Hoang Long
 

What's hot (19)

MongoDB + Pylons FTW: Scalable Web apps with Python & NoSQL
MongoDB + Pylons FTW: Scalable Web apps with Python & NoSQLMongoDB + Pylons FTW: Scalable Web apps with Python & NoSQL
MongoDB + Pylons FTW: Scalable Web apps with Python & NoSQL
 
NYT Web Archive
NYT Web ArchiveNYT Web Archive
NYT Web Archive
 
Availing Windows Dedicated Servers of HTS Hosting
Availing Windows Dedicated Servers of HTS HostingAvailing Windows Dedicated Servers of HTS Hosting
Availing Windows Dedicated Servers of HTS Hosting
 
PHP and PDFLib
PHP and PDFLibPHP and PDFLib
PHP and PDFLib
 
Linux Hosting Training Course Level 1-2
Linux Hosting Training Course Level 1-2Linux Hosting Training Course Level 1-2
Linux Hosting Training Course Level 1-2
 
DRUPAL CACHE SYSTEMS AND VARNISH
DRUPAL CACHE SYSTEMS AND VARNISHDRUPAL CACHE SYSTEMS AND VARNISH
DRUPAL CACHE SYSTEMS AND VARNISH
 
04 web optimization
04 web optimization04 web optimization
04 web optimization
 
Linux Hosting Training Course [Level 1] - Lec 7
Linux Hosting Training Course [Level 1] - Lec 7Linux Hosting Training Course [Level 1] - Lec 7
Linux Hosting Training Course [Level 1] - Lec 7
 
RESTful with Drupal - in-s and out-s
RESTful with Drupal - in-s and out-sRESTful with Drupal - in-s and out-s
RESTful with Drupal - in-s and out-s
 
Bentobox exercise
Bentobox exerciseBentobox exercise
Bentobox exercise
 
Redis
RedisRedis
Redis
 
Doing E-commerce Right – Magento on DigitalOcean
Doing E-commerce Right – Magento on DigitalOceanDoing E-commerce Right – Magento on DigitalOcean
Doing E-commerce Right – Magento on DigitalOcean
 
Html
HtmlHtml
Html
 
E commerce
E commerceE commerce
E commerce
 
Building Multilingual Websites in Drupal 7
Building Multilingual Websites in Drupal 7Building Multilingual Websites in Drupal 7
Building Multilingual Websites in Drupal 7
 
Php Bascis
Php BascisPhp Bascis
Php Bascis
 
Dynamic websites lec5
Dynamic websites lec5Dynamic websites lec5
Dynamic websites lec5
 
Web Information Systems Html and css
Web Information Systems Html and cssWeb Information Systems Html and css
Web Information Systems Html and css
 
Redis Overview
Redis OverviewRedis Overview
Redis Overview
 

Viewers also liked

Schemaless Change detection in XML Documents using Semantic Identifiers
Schemaless Change detection in XML Documents using Semantic IdentifiersSchemaless Change detection in XML Documents using Semantic Identifiers
Schemaless Change detection in XML Documents using Semantic Identifiers
Kailaash Balachandran
 
Implementation of a Web-Based Card Sorting Application with Responsive Design
Implementation of  a Web-Based Card Sorting Application with  Responsive DesignImplementation of  a Web-Based Card Sorting Application with  Responsive Design
Implementation of a Web-Based Card Sorting Application with Responsive Design
Kailaash Balachandran
 
Bittorrent in a P2P social network
Bittorrent in a P2P social networkBittorrent in a P2P social network
Bittorrent in a P2P social network
Kailaash Balachandran
 
Change detection in xml documents using Semantic Identifiers
Change detection in xml documents using Semantic IdentifiersChange detection in xml documents using Semantic Identifiers
Change detection in xml documents using Semantic IdentifiersKailaash Balachandran
 
Testing Taxonomies: Beyond Card Sorting
Testing Taxonomies: Beyond Card SortingTesting Taxonomies: Beyond Card Sorting
Testing Taxonomies: Beyond Card Sorting
Alberta Soranzo
 
Eltra Opulent Associates Ltd Powerpoint Presentation Web Company Profile
Eltra  Opulent Associates Ltd   Powerpoint Presentation Web  Company ProfileEltra  Opulent Associates Ltd   Powerpoint Presentation Web  Company Profile
Eltra Opulent Associates Ltd Powerpoint Presentation Web Company Profile
Eltra Consultants
 
Introduction to web designing
Introduction to web designingIntroduction to web designing
Introduction to web designingRajat Shah
 
Information Architecture. Card Sorting
Information Architecture. Card SortingInformation Architecture. Card Sorting
Information Architecture. Card Sorting
DCU_MPIUA
 
Life at Siegel+Gale
Life at Siegel+Gale Life at Siegel+Gale
Life at Siegel+Gale
Siegel+Gale
 
THANATOS Digital Agency | Company Profile ENG
THANATOS Digital Agency | Company Profile ENGTHANATOS Digital Agency | Company Profile ENG
THANATOS Digital Agency | Company Profile ENG
THANATOS Digital Agency
 
Company Profile Design: Best Practices 2016
Company Profile Design: Best Practices 2016Company Profile Design: Best Practices 2016
Company Profile Design: Best Practices 2016
Company Profile Design
 
eXo Digital Agency - Company Profile
eXo Digital Agency - Company ProfileeXo Digital Agency - Company Profile
eXo Digital Agency - Company Profile
eXo Digital Agency
 
TEN Creative Design Agency Creds
TEN Creative Design Agency CredsTEN Creative Design Agency Creds
TEN Creative Design Agency Creds
TEN Creative
 
LEAP Agency Company Profile
LEAP Agency Company ProfileLEAP Agency Company Profile
LEAP Agency Company Profile
Precision Group
 
Mix Digital Marketing Agency Credentials
Mix Digital Marketing Agency CredentialsMix Digital Marketing Agency Credentials
Mix Digital Marketing Agency Credentials
Mix Digital Marketing Agency
 
Ppt of company profile in project
Ppt of company profile in projectPpt of company profile in project
Ppt of company profile in projectshivakumaranupama
 
Tcs company profile presentation -sample
Tcs company profile presentation  -sampleTcs company profile presentation  -sample
Tcs company profile presentation -sampleSivaraj Ganapathy
 
Company Profile Sample
Company Profile SampleCompany Profile Sample
Company Profile Sample
Yagika Madan
 

Viewers also liked (18)

Schemaless Change detection in XML Documents using Semantic Identifiers
Schemaless Change detection in XML Documents using Semantic IdentifiersSchemaless Change detection in XML Documents using Semantic Identifiers
Schemaless Change detection in XML Documents using Semantic Identifiers
 
Implementation of a Web-Based Card Sorting Application with Responsive Design
Implementation of  a Web-Based Card Sorting Application with  Responsive DesignImplementation of  a Web-Based Card Sorting Application with  Responsive Design
Implementation of a Web-Based Card Sorting Application with Responsive Design
 
Bittorrent in a P2P social network
Bittorrent in a P2P social networkBittorrent in a P2P social network
Bittorrent in a P2P social network
 
Change detection in xml documents using Semantic Identifiers
Change detection in xml documents using Semantic IdentifiersChange detection in xml documents using Semantic Identifiers
Change detection in xml documents using Semantic Identifiers
 
Testing Taxonomies: Beyond Card Sorting
Testing Taxonomies: Beyond Card SortingTesting Taxonomies: Beyond Card Sorting
Testing Taxonomies: Beyond Card Sorting
 
Eltra Opulent Associates Ltd Powerpoint Presentation Web Company Profile
Eltra  Opulent Associates Ltd   Powerpoint Presentation Web  Company ProfileEltra  Opulent Associates Ltd   Powerpoint Presentation Web  Company Profile
Eltra Opulent Associates Ltd Powerpoint Presentation Web Company Profile
 
Introduction to web designing
Introduction to web designingIntroduction to web designing
Introduction to web designing
 
Information Architecture. Card Sorting
Information Architecture. Card SortingInformation Architecture. Card Sorting
Information Architecture. Card Sorting
 
Life at Siegel+Gale
Life at Siegel+Gale Life at Siegel+Gale
Life at Siegel+Gale
 
THANATOS Digital Agency | Company Profile ENG
THANATOS Digital Agency | Company Profile ENGTHANATOS Digital Agency | Company Profile ENG
THANATOS Digital Agency | Company Profile ENG
 
Company Profile Design: Best Practices 2016
Company Profile Design: Best Practices 2016Company Profile Design: Best Practices 2016
Company Profile Design: Best Practices 2016
 
eXo Digital Agency - Company Profile
eXo Digital Agency - Company ProfileeXo Digital Agency - Company Profile
eXo Digital Agency - Company Profile
 
TEN Creative Design Agency Creds
TEN Creative Design Agency CredsTEN Creative Design Agency Creds
TEN Creative Design Agency Creds
 
LEAP Agency Company Profile
LEAP Agency Company ProfileLEAP Agency Company Profile
LEAP Agency Company Profile
 
Mix Digital Marketing Agency Credentials
Mix Digital Marketing Agency CredentialsMix Digital Marketing Agency Credentials
Mix Digital Marketing Agency Credentials
 
Ppt of company profile in project
Ppt of company profile in projectPpt of company profile in project
Ppt of company profile in project
 
Tcs company profile presentation -sample
Tcs company profile presentation  -sampleTcs company profile presentation  -sample
Tcs company profile presentation -sample
 
Company Profile Sample
Company Profile SampleCompany Profile Sample
Company Profile Sample
 

Similar to Introduction to Web Designing

Tech 802: Web Design Part 2
Tech 802: Web Design Part 2Tech 802: Web Design Part 2
Tech 802: Web Design Part 2
somisguided
 
Introduction to Server-Side Development with PHP.ppt
Introduction to Server-Side Development with PHP.pptIntroduction to Server-Side Development with PHP.ppt
Introduction to Server-Side Development with PHP.ppt
DestaBelayneh1
 
AD109 Navigating the Jungle of Modern Web Development
AD109 Navigating the Jungle of Modern Web DevelopmentAD109 Navigating the Jungle of Modern Web Development
AD109 Navigating the Jungle of Modern Web Development
Shean McManus
 
Web development revolution
Web development revolutionWeb development revolution
Web development revolution
Ahmed El-Zekred
 
02 intro
02   intro02   intro
02 intro
babak mehrabi
 
Web Browsers.pptx
Web Browsers.pptxWeb Browsers.pptx
Web Browsers.pptx
HariomMangal1
 
Web tech
Web techWeb tech
Web tech
AnonOne
 
Website design & developemet
Website design & developemetWebsite design & developemet
Website design & developemet
Apurva Tripathi
 
Tech talk php_cms
Tech talk php_cmsTech talk php_cms
Tech talk php_cms
Shehrevar Davierwala
 
Introduction to web application development
Introduction to web application developmentIntroduction to web application development
Introduction to web application development
Ayyappadhas K B
 
Integrating PHP With System-i using Web Services
Integrating PHP With System-i using Web ServicesIntegrating PHP With System-i using Web Services
Integrating PHP With System-i using Web Services
Ivo Jansch
 
Web Fundamentals Crash Course
Web Fundamentals Crash CourseWeb Fundamentals Crash Course
Web Fundamentals Crash CourseMrAbbas
 
Web Fundamentals Crash Course
Web Fundamentals Crash CourseWeb Fundamentals Crash Course
Web Fundamentals Crash CourseMrAbas
 
WordPress Jump Start
WordPress Jump StartWordPress Jump Start
WordPress Jump Start
Haim Michael
 
Web-Development-ppt (1).pptx
Web-Development-ppt (1).pptxWeb-Development-ppt (1).pptx
Web-Development-ppt (1).pptx
RaihanUddin57
 
amanWeb.ppt.pptx
amanWeb.ppt.pptxamanWeb.ppt.pptx
amanWeb.ppt.pptx
vinitajain703
 
Web server hardware and software
Web server hardware and softwareWeb server hardware and software
Web server hardware and softwareVikram g b
 
Front end for back end developers
Front end for back end developersFront end for back end developers
Front end for back end developers
Wojciech Bednarski
 
Web technology today
Web technology todayWeb technology today
Web technology today
Dr. Ramkumar Lakshminarayanan
 

Similar to Introduction to Web Designing (20)

Tech 802: Web Design Part 2
Tech 802: Web Design Part 2Tech 802: Web Design Part 2
Tech 802: Web Design Part 2
 
introduction to web application development
introduction to web application developmentintroduction to web application development
introduction to web application development
 
Introduction to Server-Side Development with PHP.ppt
Introduction to Server-Side Development with PHP.pptIntroduction to Server-Side Development with PHP.ppt
Introduction to Server-Side Development with PHP.ppt
 
AD109 Navigating the Jungle of Modern Web Development
AD109 Navigating the Jungle of Modern Web DevelopmentAD109 Navigating the Jungle of Modern Web Development
AD109 Navigating the Jungle of Modern Web Development
 
Web development revolution
Web development revolutionWeb development revolution
Web development revolution
 
02 intro
02   intro02   intro
02 intro
 
Web Browsers.pptx
Web Browsers.pptxWeb Browsers.pptx
Web Browsers.pptx
 
Web tech
Web techWeb tech
Web tech
 
Website design & developemet
Website design & developemetWebsite design & developemet
Website design & developemet
 
Tech talk php_cms
Tech talk php_cmsTech talk php_cms
Tech talk php_cms
 
Introduction to web application development
Introduction to web application developmentIntroduction to web application development
Introduction to web application development
 
Integrating PHP With System-i using Web Services
Integrating PHP With System-i using Web ServicesIntegrating PHP With System-i using Web Services
Integrating PHP With System-i using Web Services
 
Web Fundamentals Crash Course
Web Fundamentals Crash CourseWeb Fundamentals Crash Course
Web Fundamentals Crash Course
 
Web Fundamentals Crash Course
Web Fundamentals Crash CourseWeb Fundamentals Crash Course
Web Fundamentals Crash Course
 
WordPress Jump Start
WordPress Jump StartWordPress Jump Start
WordPress Jump Start
 
Web-Development-ppt (1).pptx
Web-Development-ppt (1).pptxWeb-Development-ppt (1).pptx
Web-Development-ppt (1).pptx
 
amanWeb.ppt.pptx
amanWeb.ppt.pptxamanWeb.ppt.pptx
amanWeb.ppt.pptx
 
Web server hardware and software
Web server hardware and softwareWeb server hardware and software
Web server hardware and software
 
Front end for back end developers
Front end for back end developersFront end for back end developers
Front end for back end developers
 
Web technology today
Web technology todayWeb technology today
Web technology today
 

Recently uploaded

7 Alternatives to Bullet Points in PowerPoint
7 Alternatives to Bullet Points in PowerPoint7 Alternatives to Bullet Points in PowerPoint
7 Alternatives to Bullet Points in PowerPoint
Alvis Oh
 
Design Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinkingDesign Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinking
cy0krjxt
 
Borys Sutkowski portfolio interior design
Borys Sutkowski portfolio interior designBorys Sutkowski portfolio interior design
Borys Sutkowski portfolio interior design
boryssutkowski
 
Common Designing Mistakes and How to avoid them
Common Designing Mistakes and How to avoid themCommon Designing Mistakes and How to avoid them
Common Designing Mistakes and How to avoid them
madhavlakhanpal29
 
Exploring the Future of Smart Garages.pdf
Exploring the Future of Smart Garages.pdfExploring the Future of Smart Garages.pdf
Exploring the Future of Smart Garages.pdf
fastfixgaragedoor
 
一比一原版(UCB毕业证书)伯明翰大学学院毕业证成绩单如何办理
一比一原版(UCB毕业证书)伯明翰大学学院毕业证成绩单如何办理一比一原版(UCB毕业证书)伯明翰大学学院毕业证成绩单如何办理
一比一原版(UCB毕业证书)伯明翰大学学院毕业证成绩单如何办理
h7j5io0
 
White wonder, Work developed by Eva Tschopp
White wonder, Work developed by Eva TschoppWhite wonder, Work developed by Eva Tschopp
White wonder, Work developed by Eva Tschopp
Mansi Shah
 
一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理
一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理
一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理
9a93xvy
 
20 slides of research movie and artists .pdf
20 slides of research movie and artists .pdf20 slides of research movie and artists .pdf
20 slides of research movie and artists .pdf
ameli25062005
 
一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理
一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理
一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理
9a93xvy
 
vernacular architecture in response to climate.pdf
vernacular architecture in response to climate.pdfvernacular architecture in response to climate.pdf
vernacular architecture in response to climate.pdf
PrabhjeetSingh219035
 
Top Israeli Products and Brands - Plan it israel.pdf
Top Israeli Products and Brands - Plan it israel.pdfTop Israeli Products and Brands - Plan it israel.pdf
Top Israeli Products and Brands - Plan it israel.pdf
PlanitIsrael
 
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
7sd8fier
 
projectreportnew-170307082323 nnnnnn(1).pdf
projectreportnew-170307082323 nnnnnn(1).pdfprojectreportnew-170307082323 nnnnnn(1).pdf
projectreportnew-170307082323 nnnnnn(1).pdf
farazahmadas6
 
一比一原版(Bolton毕业证书)博尔顿大学毕业证成绩单如何办理
一比一原版(Bolton毕业证书)博尔顿大学毕业证成绩单如何办理一比一原版(Bolton毕业证书)博尔顿大学毕业证成绩单如何办理
一比一原版(Bolton毕业证书)博尔顿大学毕业证成绩单如何办理
h7j5io0
 
Can AI do good? at 'offtheCanvas' India HCI prelude
Can AI do good? at 'offtheCanvas' India HCI preludeCan AI do good? at 'offtheCanvas' India HCI prelude
Can AI do good? at 'offtheCanvas' India HCI prelude
Alan Dix
 
一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理
一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理
一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理
asuzyq
 
一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理
一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理
一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理
smpc3nvg
 
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理
jyz59f4j
 
Book Formatting: Quality Control Checks for Designers
Book Formatting: Quality Control Checks for DesignersBook Formatting: Quality Control Checks for Designers
Book Formatting: Quality Control Checks for Designers
Confidence Ago
 

Recently uploaded (20)

7 Alternatives to Bullet Points in PowerPoint
7 Alternatives to Bullet Points in PowerPoint7 Alternatives to Bullet Points in PowerPoint
7 Alternatives to Bullet Points in PowerPoint
 
Design Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinkingDesign Thinking Design thinking Design thinking
Design Thinking Design thinking Design thinking
 
Borys Sutkowski portfolio interior design
Borys Sutkowski portfolio interior designBorys Sutkowski portfolio interior design
Borys Sutkowski portfolio interior design
 
Common Designing Mistakes and How to avoid them
Common Designing Mistakes and How to avoid themCommon Designing Mistakes and How to avoid them
Common Designing Mistakes and How to avoid them
 
Exploring the Future of Smart Garages.pdf
Exploring the Future of Smart Garages.pdfExploring the Future of Smart Garages.pdf
Exploring the Future of Smart Garages.pdf
 
一比一原版(UCB毕业证书)伯明翰大学学院毕业证成绩单如何办理
一比一原版(UCB毕业证书)伯明翰大学学院毕业证成绩单如何办理一比一原版(UCB毕业证书)伯明翰大学学院毕业证成绩单如何办理
一比一原版(UCB毕业证书)伯明翰大学学院毕业证成绩单如何办理
 
White wonder, Work developed by Eva Tschopp
White wonder, Work developed by Eva TschoppWhite wonder, Work developed by Eva Tschopp
White wonder, Work developed by Eva Tschopp
 
一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理
一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理
一比一原版(CITY毕业证书)谢菲尔德哈勒姆大学毕业证如何办理
 
20 slides of research movie and artists .pdf
20 slides of research movie and artists .pdf20 slides of research movie and artists .pdf
20 slides of research movie and artists .pdf
 
一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理
一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理
一比一原版(RHUL毕业证书)伦敦大学皇家霍洛威学院毕业证如何办理
 
vernacular architecture in response to climate.pdf
vernacular architecture in response to climate.pdfvernacular architecture in response to climate.pdf
vernacular architecture in response to climate.pdf
 
Top Israeli Products and Brands - Plan it israel.pdf
Top Israeli Products and Brands - Plan it israel.pdfTop Israeli Products and Brands - Plan it israel.pdf
Top Israeli Products and Brands - Plan it israel.pdf
 
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
一比一原版(NCL毕业证书)纽卡斯尔大学毕业证成绩单如何办理
 
projectreportnew-170307082323 nnnnnn(1).pdf
projectreportnew-170307082323 nnnnnn(1).pdfprojectreportnew-170307082323 nnnnnn(1).pdf
projectreportnew-170307082323 nnnnnn(1).pdf
 
一比一原版(Bolton毕业证书)博尔顿大学毕业证成绩单如何办理
一比一原版(Bolton毕业证书)博尔顿大学毕业证成绩单如何办理一比一原版(Bolton毕业证书)博尔顿大学毕业证成绩单如何办理
一比一原版(Bolton毕业证书)博尔顿大学毕业证成绩单如何办理
 
Can AI do good? at 'offtheCanvas' India HCI prelude
Can AI do good? at 'offtheCanvas' India HCI preludeCan AI do good? at 'offtheCanvas' India HCI prelude
Can AI do good? at 'offtheCanvas' India HCI prelude
 
一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理
一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理
一比一原版(Columbia毕业证)哥伦比亚大学毕业证如何办理
 
一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理
一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理
一比一原版(Bristol毕业证书)布里斯托大学毕业证成绩单如何办理
 
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证成绩单如何办理
 
Book Formatting: Quality Control Checks for Designers
Book Formatting: Quality Control Checks for DesignersBook Formatting: Quality Control Checks for Designers
Book Formatting: Quality Control Checks for Designers
 

Introduction to Web Designing

  • 1. Introduction to Web Designing - Guest Lecture by Kailaash Balachandran
  • 2. 2 Chapters ● Introduction ● Domains and Hosting ● The Working ● Programming Languages ● Tools ● Running Example
  • 3. 3 Interesting Facts about WWW § There’s an estimated 937 million websites on the WWW. § 1 in every 9 people on Earth is on Facebook (2012). § There are approximately 4,200 new domain names registered every hour. § 17 Million users use Google every hour. § Web design industry is the 2nd fastest growing area in software sector. § At any given second, 5 new websites are being developed and published.
  • 5. 5 Domains and Hosting (1) Domains § They are used to locate a website. § Example: google.com, yahoo.com, facebook.com § Domain name and extensions are provided by ICANN. Internet Corporation for Assigned Names and Numbers § Extensions includes .org , .net , .gov , .mil , .in , .us .
  • 7. 7 Domains and Hosting (1) Hosting Server § Where the website content is stored. § Compare this to hard disk in a computer. § Storage space and bandwidth matters. § We require FTP host name, username and password to transfer our files to the server. § Use FTP Client to transfer.
  • 8. 8 The Working (1) HTTP : Hyper Text Transfer Protocol ● Client is the browser. ● Hosting Server URL can be written as http://onlinemacha.com (or) http://www.onlinemacha.com (or) onlinemacha.com
  • 9. 9 Languages Basic web programming languages § HTML – Hyper Text Markup Language ● CSS – Cascading Style Sheets § Java Script § PHP – Hypertext PreProcessor Client Side Server Side
  • 10. 10 Tools Design Tools § Photoshop , Illustrator , Corel Draw. § Dreamweaver FTP Client Tool § Filezilla
  • 11. 11 Design Process 1. Know the requirements of the website. 2. Design the entire website on Photoshop. 3. Once the design is finalized, reconstruct the design on HTML / CSS. 4. Photoshop to Code. Test run on your computer. 5. Upload the files to the hosting server using any FTP Client tool.
  • 12. 12 Running Example Now, let's design a simple web page from scratch and make it work....
  • 13. 13 Designer's Kit § HTML5, CSS3 § JavaScript § PHP5 § SEO – Search Engine Optimization § Responsive Design
  • 14. 14 Future for Web ? § Semantic Web § Peer to Peer (P2P)