SlideShare a Scribd company logo
1 of 10
WEB DESIGNING
Design is the process of collecting ideas, and
aesthetically arranging and implementing them,
guided by certain principles for a specific purpose.
Web design is a similar process of creation, with
the intention of presenting the content on
electronic web pages, which the end-users can
access through the internet with the help of a web
browser.
ELEMENTS OF WEB DESIGN
Web design uses many of the same key visual elements as all types of design such as: -
Layout: This is the way the graphics, ads and text are arranged. In the web
world, a key goal is to help the view find the information they seek at a
glance. This includes maintaining the balance, consistency, and
integrity of the design.
Colour: The choice of colours depends on the purpose and clientele; it
could be simple black-and-white to multi-coloured design, conveying
the personality of a person or the brand of an organization, using web-
safe colours.
Graphics: Graphics can include logos, photos, clipart or icons, all of which
enhance the web design. For user friendliness, these need to be placed
appropriately, working with the colour and content of the web page,
while not making it too congested or slow to load.
Fonts: The use of various fonts can enhance a website design. Most web
browsers can only read a select number of fonts, known as "web-safe
fonts", so your designer will generally work within this widely accepted
group.
CREATING USER FRIENDLY WEB DESIGN
Besides the basic elements of web design that make a site beautiful and
visually compelling, a website must also always consider the end user.
User-friendliness can be achieved by paying attention to the following
factors.
Navigation: Site architecture, menus and other navigation tools in the web
design must be created with consideration of how users browse and
search. The goal is to help the user to move around the site with ease,
efficiently finding the information they require.
Multimedia: Relevant video and audio stimuli in the design can help users
to grasp the information, developing understanding in an easy and
quick manner. This can encourage visitors to spend more time on the
webpage.
Compatibility: Design the webpage, to perform equally well on different
browsers and operating systems, to increase its viewing.
Technology: Advancements in technology give designers the freedom to
add movement and innovation, allowing for web design that is always
fresh, dynamic and professional.
CONSISTENCY IN DESIGN
 Use the same font throughout!
 Use consistent graphics in website – do not use ultra
modern on one page and calligraphy on another
 Use color scheme that is consistent
WEBSITE DESIGN
 From your existing web pages, build a website.
 Add more pages to site – whatever you want
 Some suggestions: Resume, friends page, hobbies page
 Minimum 6 pages (splash page + 5)
 Use common design theme
 Make custom graphics in PhotoShop
 Prepare graphical site map in PowerPoint to turn
in when finished
FUNDAMENTALS OF WEBDESIGN
Purpose of Web Design
 Inform/Educate
 Persuade
Influences on Web Design
 Technology Used by Both Target Audience and Designer
 Nature of the Content
 Economy (Budget, Time, and Scale of the Project)
 Amount and Type of Visuals Included
 Meeting Usability Objectives
THE MAKING OF GOOD DESIGN
Content is important, but content alone will not
make your site work.
THE MAKING OF DESIGN
Good Design is:
 Understandable
 Interesting
 Easy to use
 Uniform in look and feel
 Done from a visitor’s point of view:
WYSIWYW (What You See Is What You WANT)
Resources -books
 HTML & XHTML: The Complete Reference
Author: Thomas Powell
ISBN: 0-07-222942-X
 Web Design: The Complete Reference
Author: Thomas Powell
ISBN: 0-07-222442-8
 Designing With Web Standards
Author: Jeffrey Zeldman
ISBN: 0-73-571201-8
 HTML for the World Wide Web
Author: Elizabeth Castro
ISBN: 0-32-113007-3
 Integrated Web Design
Author: Molly Holzschlag
ISBN: 0-73-571233-6
THANK YOU

More Related Content

What's hot

Website Development Process
Website Development ProcessWebsite Development Process
Website Development Process
Hend Al-Khalifa
 
Ppt of web development
Ppt of web developmentPpt of web development
Ppt of web development
bethanygfair
 

What's hot (20)

Elements Of Web Design
Elements Of Web DesignElements Of Web Design
Elements Of Web Design
 
Web development
Web developmentWeb development
Web development
 
ppt of web designing and development
ppt of web designing and developmentppt of web designing and development
ppt of web designing and development
 
Introduction to Web Development
Introduction to Web DevelopmentIntroduction to Web Development
Introduction to Web Development
 
Lecture 1 intro to web designing
Lecture 1  intro to web designingLecture 1  intro to web designing
Lecture 1 intro to web designing
 
Front End Development | Introduction
Front End Development | IntroductionFront End Development | Introduction
Front End Development | Introduction
 
Responsive web designing ppt(1)
Responsive web designing ppt(1)Responsive web designing ppt(1)
Responsive web designing ppt(1)
 
Wordpress ppt
Wordpress pptWordpress ppt
Wordpress ppt
 
Website Development Process
Website Development ProcessWebsite Development Process
Website Development Process
 
Front end web development
Front end web developmentFront end web development
Front end web development
 
WEB I - 01 - Introduction to Web Development
WEB I - 01 - Introduction to Web DevelopmentWEB I - 01 - Introduction to Web Development
WEB I - 01 - Introduction to Web Development
 
Difference between-web-designing-and-web-development
Difference between-web-designing-and-web-developmentDifference between-web-designing-and-web-development
Difference between-web-designing-and-web-development
 
Responsive web design
Responsive web designResponsive web design
Responsive web design
 
ppt of web development for diploma student
ppt of web development for diploma student ppt of web development for diploma student
ppt of web development for diploma student
 
Web development ppt
Web development pptWeb development ppt
Web development ppt
 
Web development | Derin Dolen
Web development | Derin Dolen Web development | Derin Dolen
Web development | Derin Dolen
 
Ppt of web development
Ppt of web developmentPpt of web development
Ppt of web development
 
Html Ppt
Html PptHtml Ppt
Html Ppt
 
Static and Dynamic webpage
Static and Dynamic webpageStatic and Dynamic webpage
Static and Dynamic webpage
 
Presentation on web browser
Presentation on web browserPresentation on web browser
Presentation on web browser
 

Similar to Presentation of web designing

Graphics Designing (Character, Posters, Advertisements, Brochure, Interface B...
Graphics Designing (Character, Posters, Advertisements, Brochure, Interface B...Graphics Designing (Character, Posters, Advertisements, Brochure, Interface B...
Graphics Designing (Character, Posters, Advertisements, Brochure, Interface B...
Drupal Camp Delhi
 
Customer effective web design new
Customer effective web design newCustomer effective web design new
Customer effective web design new
Vikram g b
 
Web Page Designing- Empower Technology.pptx
Web Page Designing- Empower Technology.pptxWeb Page Designing- Empower Technology.pptx
Web Page Designing- Empower Technology.pptx
academicjfurio
 
The difference between web design and web development.pdf
The difference between web design and web development.pdfThe difference between web design and web development.pdf
The difference between web design and web development.pdf
BRANDIMAGETECHSOLUTI1
 

Similar to Presentation of web designing (20)

Best Search Engine Optimization Online Course
Best Search Engine Optimization Online CourseBest Search Engine Optimization Online Course
Best Search Engine Optimization Online Course
 
Web Design Training In Delhi
Web Design Training In Delhi Web Design Training In Delhi
Web Design Training In Delhi
 
Soodam
SoodamSoodam
Soodam
 
Top 11 web design trends followed in 2017
Top 11 web design trends followed in 2017Top 11 web design trends followed in 2017
Top 11 web design trends followed in 2017
 
WED DESIGN
WED DESIGNWED DESIGN
WED DESIGN
 
Graphics Designing (Character, Posters, Advertisements, Brochure, Interface B...
Graphics Designing (Character, Posters, Advertisements, Brochure, Interface B...Graphics Designing (Character, Posters, Advertisements, Brochure, Interface B...
Graphics Designing (Character, Posters, Advertisements, Brochure, Interface B...
 
Web design as creative work
Web design as creative workWeb design as creative work
Web design as creative work
 
10 Web Design Principles For An Outstanding User Experience
10 Web Design Principles For An Outstanding User Experience10 Web Design Principles For An Outstanding User Experience
10 Web Design Principles For An Outstanding User Experience
 
What is the difference between Web design and Web Development.pdf
What is the difference between Web design and Web Development.pdfWhat is the difference between Web design and Web Development.pdf
What is the difference between Web design and Web Development.pdf
 
Customer effective web design new
Customer effective web design newCustomer effective web design new
Customer effective web design new
 
Web design and development
Web design and developmentWeb design and development
Web design and development
 
Web design.pdf
Web design.pdfWeb design.pdf
Web design.pdf
 
Web Page Designing- Empower Technology.pptx
Web Page Designing- Empower Technology.pptxWeb Page Designing- Empower Technology.pptx
Web Page Designing- Empower Technology.pptx
 
web designing course in chandigarh
web designing course in       chandigarhweb designing course in       chandigarh
web designing course in chandigarh
 
Web Design
Web DesignWeb Design
Web Design
 
Crafting Digital Experiences with Innovative Web Designing”
Crafting Digital Experiences with Innovative Web Designing”Crafting Digital Experiences with Innovative Web Designing”
Crafting Digital Experiences with Innovative Web Designing”
 
Empowerment Technology - Basic Web Design Principles and Elements
Empowerment Technology - Basic Web Design Principles and ElementsEmpowerment Technology - Basic Web Design Principles and Elements
Empowerment Technology - Basic Web Design Principles and Elements
 
web designing course in Chandigarh, mohali
web designing course in Chandigarh, mohaliweb designing course in Chandigarh, mohali
web designing course in Chandigarh, mohali
 
The difference between web design and web development.pdf
The difference between web design and web development.pdfThe difference between web design and web development.pdf
The difference between web design and web development.pdf
 
What is Web Designing?
What is Web Designing?What is Web Designing?
What is Web Designing?
 

Recently uploaded

NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...
NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...
NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...
Amil baba
 
挂科办理天主教大学毕业证成绩单一模一样品质
挂科办理天主教大学毕业证成绩单一模一样品质挂科办理天主教大学毕业证成绩单一模一样品质
挂科办理天主教大学毕业证成绩单一模一样品质
yzeoq
 
NO1 Best Kala Jadu Expert Specialist In Qatar Kala Jadu Expert Specialist In ...
NO1 Best Kala Jadu Expert Specialist In Qatar Kala Jadu Expert Specialist In ...NO1 Best Kala Jadu Expert Specialist In Qatar Kala Jadu Expert Specialist In ...
NO1 Best Kala Jadu Expert Specialist In Qatar Kala Jadu Expert Specialist In ...
Amil baba
 
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
ugzga
 
Evaluating natural frequencies and mode shapes.pptx
Evaluating natural frequencies and mode shapes.pptxEvaluating natural frequencies and mode shapes.pptx
Evaluating natural frequencies and mode shapes.pptx
joshuaclack73
 
NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...
NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...
NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...
Amil baba
 
如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证
ugzga
 
Famous and Important UIUX Laws for your next Digital product
Famous and Important UIUX Laws for your next Digital productFamous and Important UIUX Laws for your next Digital product
Famous and Important UIUX Laws for your next Digital product
Think 360 Studio
 

Recently uploaded (20)

BIT Khushi gandhi project.pdf graphic design
BIT Khushi gandhi project.pdf graphic designBIT Khushi gandhi project.pdf graphic design
BIT Khushi gandhi project.pdf graphic design
 
Bit Dhrumi shah Graphic Designer portfolio
Bit Dhrumi shah Graphic Designer portfolioBit Dhrumi shah Graphic Designer portfolio
Bit Dhrumi shah Graphic Designer portfolio
 
NO1 Popular kala jadu karne wale ka contact number kala jadu karne wale baba ...
NO1 Popular kala jadu karne wale ka contact number kala jadu karne wale baba ...NO1 Popular kala jadu karne wale ka contact number kala jadu karne wale baba ...
NO1 Popular kala jadu karne wale ka contact number kala jadu karne wale baba ...
 
NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...
NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...
NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...
 
挂科办理天主教大学毕业证成绩单一模一样品质
挂科办理天主教大学毕业证成绩单一模一样品质挂科办理天主教大学毕业证成绩单一模一样品质
挂科办理天主教大学毕业证成绩单一模一样品质
 
NO1 Best Kala Jadu Expert Specialist In Qatar Kala Jadu Expert Specialist In ...
NO1 Best Kala Jadu Expert Specialist In Qatar Kala Jadu Expert Specialist In ...NO1 Best Kala Jadu Expert Specialist In Qatar Kala Jadu Expert Specialist In ...
NO1 Best Kala Jadu Expert Specialist In Qatar Kala Jadu Expert Specialist In ...
 
iF_Design_Trend_Report_twentytwenrythree
iF_Design_Trend_Report_twentytwenrythreeiF_Design_Trend_Report_twentytwenrythree
iF_Design_Trend_Report_twentytwenrythree
 
Design Portofolios - Licensed Architect / BIM Specialist
Design Portofolios - Licensed Architect / BIM SpecialistDesign Portofolios - Licensed Architect / BIM Specialist
Design Portofolios - Licensed Architect / BIM Specialist
 
Eric Parein CV. Parein in English is best pronounced as PARE-IN
Eric Parein CV. Parein in English is best pronounced as PARE-INEric Parein CV. Parein in English is best pronounced as PARE-IN
Eric Parein CV. Parein in English is best pronounced as PARE-IN
 
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
 
Evaluating natural frequencies and mode shapes.pptx
Evaluating natural frequencies and mode shapes.pptxEvaluating natural frequencies and mode shapes.pptx
Evaluating natural frequencies and mode shapes.pptx
 
Latest Trends in Home and Building Design
Latest Trends in Home and Building DesignLatest Trends in Home and Building Design
Latest Trends in Home and Building Design
 
NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...
NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...
NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...
 
如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UB毕业证书)纽约州立大学水牛城分校毕业证成绩单本科硕士学位证留信学历认证
 
Week of Action 2022_EIT Climate-KIC_Headers
Week of Action 2022_EIT Climate-KIC_HeadersWeek of Action 2022_EIT Climate-KIC_Headers
Week of Action 2022_EIT Climate-KIC_Headers
 
Real Smart Art Infographics by Slidesgo.pptx
Real Smart Art Infographics by Slidesgo.pptxReal Smart Art Infographics by Slidesgo.pptx
Real Smart Art Infographics by Slidesgo.pptx
 
Famous and Important UIUX Laws for your next Digital product
Famous and Important UIUX Laws for your next Digital productFamous and Important UIUX Laws for your next Digital product
Famous and Important UIUX Laws for your next Digital product
 
Levi's Advertisement and camapign design
Levi's Advertisement and camapign designLevi's Advertisement and camapign design
Levi's Advertisement and camapign design
 
Morgenbooster: Storytelling in Identity Design
Morgenbooster: Storytelling in Identity DesignMorgenbooster: Storytelling in Identity Design
Morgenbooster: Storytelling in Identity Design
 
Spring Summer 2026 Inspirations trend book Peclers Paris
Spring Summer 2026 Inspirations trend book Peclers ParisSpring Summer 2026 Inspirations trend book Peclers Paris
Spring Summer 2026 Inspirations trend book Peclers Paris
 

Presentation of web designing

  • 1.
  • 2. WEB DESIGNING Design is the process of collecting ideas, and aesthetically arranging and implementing them, guided by certain principles for a specific purpose. Web design is a similar process of creation, with the intention of presenting the content on electronic web pages, which the end-users can access through the internet with the help of a web browser.
  • 3. ELEMENTS OF WEB DESIGN Web design uses many of the same key visual elements as all types of design such as: - Layout: This is the way the graphics, ads and text are arranged. In the web world, a key goal is to help the view find the information they seek at a glance. This includes maintaining the balance, consistency, and integrity of the design. Colour: The choice of colours depends on the purpose and clientele; it could be simple black-and-white to multi-coloured design, conveying the personality of a person or the brand of an organization, using web- safe colours. Graphics: Graphics can include logos, photos, clipart or icons, all of which enhance the web design. For user friendliness, these need to be placed appropriately, working with the colour and content of the web page, while not making it too congested or slow to load. Fonts: The use of various fonts can enhance a website design. Most web browsers can only read a select number of fonts, known as "web-safe fonts", so your designer will generally work within this widely accepted group.
  • 4. CREATING USER FRIENDLY WEB DESIGN Besides the basic elements of web design that make a site beautiful and visually compelling, a website must also always consider the end user. User-friendliness can be achieved by paying attention to the following factors. Navigation: Site architecture, menus and other navigation tools in the web design must be created with consideration of how users browse and search. The goal is to help the user to move around the site with ease, efficiently finding the information they require. Multimedia: Relevant video and audio stimuli in the design can help users to grasp the information, developing understanding in an easy and quick manner. This can encourage visitors to spend more time on the webpage. Compatibility: Design the webpage, to perform equally well on different browsers and operating systems, to increase its viewing. Technology: Advancements in technology give designers the freedom to add movement and innovation, allowing for web design that is always fresh, dynamic and professional.
  • 5. CONSISTENCY IN DESIGN  Use the same font throughout!  Use consistent graphics in website – do not use ultra modern on one page and calligraphy on another  Use color scheme that is consistent
  • 6. WEBSITE DESIGN  From your existing web pages, build a website.  Add more pages to site – whatever you want  Some suggestions: Resume, friends page, hobbies page  Minimum 6 pages (splash page + 5)  Use common design theme  Make custom graphics in PhotoShop  Prepare graphical site map in PowerPoint to turn in when finished
  • 7. FUNDAMENTALS OF WEBDESIGN Purpose of Web Design  Inform/Educate  Persuade Influences on Web Design  Technology Used by Both Target Audience and Designer  Nature of the Content  Economy (Budget, Time, and Scale of the Project)  Amount and Type of Visuals Included  Meeting Usability Objectives
  • 8. THE MAKING OF GOOD DESIGN Content is important, but content alone will not make your site work.
  • 9. THE MAKING OF DESIGN Good Design is:  Understandable  Interesting  Easy to use  Uniform in look and feel  Done from a visitor’s point of view: WYSIWYW (What You See Is What You WANT)
  • 10. Resources -books  HTML & XHTML: The Complete Reference Author: Thomas Powell ISBN: 0-07-222942-X  Web Design: The Complete Reference Author: Thomas Powell ISBN: 0-07-222442-8  Designing With Web Standards Author: Jeffrey Zeldman ISBN: 0-73-571201-8  HTML for the World Wide Web Author: Elizabeth Castro ISBN: 0-32-113007-3  Integrated Web Design Author: Molly Holzschlag ISBN: 0-73-571233-6 THANK YOU