SlideShare une entreprise Scribd logo
1  sur  4
Basic Principles for a good web designing
Web designing may look simple with all those
popular CMS tools available in the market. But
it is not that easy as it being promoted widely.
Achieving a visual coherent, brand promoting
website development can prove to be deceptively
difficult.
Web designing should take care many human factor
that is, it should be usable, pleasing, should
have relevant content (Information) , should
promote brand voice, and last but not the least
should be visual coherent
Below given are the main principles to be
followed while designing a web
1.Precedence
The basic principle of a good web designing
should start from the concept precedence that
means to decide on upper hand, on how much
visual weigh should be given to different parts
of your web page or the tab,
For example the first thing you see for any web
page is the logo of the company; and that we
call it as precedence; while designing the web.
In other words the user should be led through
the web page according to the precedence,
decided by the web designer giving weight to the
different visual elements according to the
priority of the brand.
A good web design can influence user eyes to
follow a sequence of steps while browsing the
web.
For example, you may want your user to see your
company logo then to the primary navigation bar
then to the headline of the main body text with
side navigation bar indicating a subpage or call
to action (CTA) to keep your user engaged with
your brand.
Though theoretically it is the user who decides
what he should look into the webpage but
practically it should be guided by the web
designer.
So how do you achieve precedence in good web
designing?
The many tools at disposal for a web designer to
achieve the precedence are element positioning,
color, size and character weight and style.
2. Navigation
To achieve high conversion on a web site, for
both human and search engine, the main element
to be optimized is the navigation.
While on the design stage of a web site, greater
important has to be given to the navigation
element. The most important question you should
as a good web designer is “where to go?”
And “where am I”, that meant the two aspects of
Navigation element are Navigate and Orientation.
3. Typography
Digital world is influenced by the content, a
content rich web page is preferred by both
user’s and search engine.
When we talk of content, text is the most common
element of the web designing. Text speaks both
about your design and the brand (product /
service)
The different aspects of Text element to be
considered during the designing are
Font
Font size
Color
Spacing
Line length
And leading
4. Spacing
Most of the designer tends to fill the space
with lot of information and navigation, but
doing so, you will be discouraging your user to
convert in your web page.
Space in a web page will make the things
clearer. The important aspects of Spacing to
be considered by a good web designer
Line spacing- Too little space will make the
eye to spill over to nearby text and too
much space will make you to lose your focus
on the previous statement.
Padding:- Giving enough space between the
text and the other element that is clearly
distinguishing the neighboring elements for
example text and image, text and table
border
White space- White space doesn’t need to be
white. The term white space means clear
space or empty space on a page. White space
is used to guide you user eye to different
elements of webpage. It will make your
webpage clutter free.

Contenu connexe

Tendances

10 Principles Of Effective Web Design
10 Principles Of Effective Web Design10 Principles Of Effective Web Design
10 Principles Of Effective Web Design
sirferds
 
Web design for business.ppt
Web design for business.pptWeb design for business.ppt
Web design for business.ppt
webhostingguy
 

Tendances (20)

Website designing company in delhi
Website designing company in delhiWebsite designing company in delhi
Website designing company in delhi
 
10 Principles Of Effective Web Design
10 Principles Of Effective Web Design10 Principles Of Effective Web Design
10 Principles Of Effective Web Design
 
Web Usability
Web UsabilityWeb Usability
Web Usability
 
10 principles of effective web design
10 principles of effective web design10 principles of effective web design
10 principles of effective web design
 
What Do When Plan A Site-Website Developer Jackson
What Do When Plan A Site-Website Developer JacksonWhat Do When Plan A Site-Website Developer Jackson
What Do When Plan A Site-Website Developer Jackson
 
Web Site Design
Web Site DesignWeb Site Design
Web Site Design
 
Notes8
Notes8Notes8
Notes8
 
Web design-principles-and-elements-by-renalyn-paica
Web design-principles-and-elements-by-renalyn-paicaWeb design-principles-and-elements-by-renalyn-paica
Web design-principles-and-elements-by-renalyn-paica
 
A guide to writing a great website brief
A guide to writing a great website briefA guide to writing a great website brief
A guide to writing a great website brief
 
Principles of good website design
Principles of good website designPrinciples of good website design
Principles of good website design
 
Practical exam-gegremosa-st.john-pptx (2)
Practical exam-gegremosa-st.john-pptx (2)Practical exam-gegremosa-st.john-pptx (2)
Practical exam-gegremosa-st.john-pptx (2)
 
SEO for Your WEBSITE
SEO for Your WEBSITESEO for Your WEBSITE
SEO for Your WEBSITE
 
Elements Of Web Design
Elements Of Web DesignElements Of Web Design
Elements Of Web Design
 
Web proposal
Web proposalWeb proposal
Web proposal
 
Web design for business.ppt
Web design for business.pptWeb design for business.ppt
Web design for business.ppt
 
Guide to Designing a User Friendly Website
Guide to Designing a User Friendly Website Guide to Designing a User Friendly Website
Guide to Designing a User Friendly Website
 
Psychologyofwebdesign
PsychologyofwebdesignPsychologyofwebdesign
Psychologyofwebdesign
 
Lecture 3
Lecture 3Lecture 3
Lecture 3
 
Web Design 101
Web Design 101Web Design 101
Web Design 101
 
Few skills every successful web designer needs
Few skills every successful web designer needsFew skills every successful web designer needs
Few skills every successful web designer needs
 

En vedette

Assignment 2 - Second Submission
Assignment 2 - Second SubmissionAssignment 2 - Second Submission
Assignment 2 - Second Submission
Alex Christoudias
 
120715 - LMAJdS paper - HydroVision 2012 presentation - 14 pages
120715 - LMAJdS paper - HydroVision 2012 presentation - 14 pages120715 - LMAJdS paper - HydroVision 2012 presentation - 14 pages
120715 - LMAJdS paper - HydroVision 2012 presentation - 14 pages
Luc-Marie Jeudy de Sauceray
 

En vedette (15)

AM Dwiari - CV
AM Dwiari - CVAM Dwiari - CV
AM Dwiari - CV
 
Recycle for London "app" at NMA event
Recycle for London "app" at NMA eventRecycle for London "app" at NMA event
Recycle for London "app" at NMA event
 
Conditionals
ConditionalsConditionals
Conditionals
 
Assignment 2 - Second Submission
Assignment 2 - Second SubmissionAssignment 2 - Second Submission
Assignment 2 - Second Submission
 
Pascack Valley Hospital
Pascack Valley Hospital Pascack Valley Hospital
Pascack Valley Hospital
 
体重ウォッチにおけるRealmとSwiftTaskの活用
体重ウォッチにおけるRealmとSwiftTaskの活用体重ウォッチにおけるRealmとSwiftTaskの活用
体重ウォッチにおけるRealmとSwiftTaskの活用
 
Inc pres (dma bristol messaging) 24 jun11 v1.0
Inc pres (dma bristol messaging) 24 jun11 v1.0Inc pres (dma bristol messaging) 24 jun11 v1.0
Inc pres (dma bristol messaging) 24 jun11 v1.0
 
Inc pres (dma bristol apps) 24 jun11 v1.1
Inc pres (dma bristol apps) 24 jun11 v1.1Inc pres (dma bristol apps) 24 jun11 v1.1
Inc pres (dma bristol apps) 24 jun11 v1.1
 
La Informatica
La InformaticaLa Informatica
La Informatica
 
Montgròs families juliol 2016
Montgròs families juliol 2016Montgròs families juliol 2016
Montgròs families juliol 2016
 
Tema 01 ciencia metodo investigacion fin
Tema 01  ciencia metodo investigacion fin Tema 01  ciencia metodo investigacion fin
Tema 01 ciencia metodo investigacion fin
 
Jogos Olímpicos Barreto Coelho
Jogos Olímpicos Barreto CoelhoJogos Olímpicos Barreto Coelho
Jogos Olímpicos Barreto Coelho
 
120715 - LMAJdS paper - HydroVision 2012 presentation - 14 pages
120715 - LMAJdS paper - HydroVision 2012 presentation - 14 pages120715 - LMAJdS paper - HydroVision 2012 presentation - 14 pages
120715 - LMAJdS paper - HydroVision 2012 presentation - 14 pages
 
Telecommunications industry guide uk
Telecommunications industry guide ukTelecommunications industry guide uk
Telecommunications industry guide uk
 
Projeto Qualidade de Vida
Projeto Qualidade de VidaProjeto Qualidade de Vida
Projeto Qualidade de Vida
 

Similaire à Principle of a good web 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...
Drupal Camp Delhi
 

Similaire à Principle of a good web design (20)

Digital Marketing By krishna.pdf
Digital Marketing By krishna.pdfDigital Marketing By krishna.pdf
Digital Marketing By krishna.pdf
 
Web Design by Client Perspective
 Web Design by Client Perspective Web Design by Client Perspective
Web Design by Client Perspective
 
Web designing chapter 01
Web designing chapter 01Web designing chapter 01
Web designing chapter 01
 
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
 
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...
 
Java Unit 5(part 1)
Java Unit 5(part 1)Java Unit 5(part 1)
Java Unit 5(part 1)
 
10 must have web design elements
10 must have web design elements10 must have web design elements
10 must have web design elements
 
Seo.jpg
Seo.jpgSeo.jpg
Seo.jpg
 
Front end developer responsibilities what does a front-end developer do?
Front end developer responsibilities  what does a front-end developer do?Front end developer responsibilities  what does a front-end developer do?
Front end developer responsibilities what does a front-end developer do?
 
17 Essential Elements of Web Design | FODUU
17 Essential Elements of Web Design | FODUU17 Essential Elements of Web Design | FODUU
17 Essential Elements of Web Design | FODUU
 
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.
 
Why digital marketing_ebook
Why digital marketing_ebookWhy digital marketing_ebook
Why digital marketing_ebook
 
Digital marketing Essential
 Digital marketing Essential Digital marketing Essential
Digital marketing Essential
 
Why Digital Marketing?
Why Digital Marketing?Why Digital Marketing?
Why Digital Marketing?
 
Desighn and develpment
Desighn and develpmentDesighn and develpment
Desighn and develpment
 
FYBSC IT Web Programming Unit II Html Page Layout & Navigation
FYBSC IT Web Programming Unit II Html Page Layout & NavigationFYBSC IT Web Programming Unit II Html Page Layout & Navigation
FYBSC IT Web Programming Unit II Html Page Layout & Navigation
 
Atlogys Tech Talk - Web 2.0 Design Guidelines
Atlogys Tech Talk - Web 2.0 Design GuidelinesAtlogys Tech Talk - Web 2.0 Design Guidelines
Atlogys Tech Talk - Web 2.0 Design Guidelines
 
Web Design.pdf
Web Design.pdfWeb Design.pdf
Web Design.pdf
 
Proposed solutions
Proposed solutionsProposed solutions
Proposed solutions
 
Sn web-whitepaper
Sn web-whitepaperSn web-whitepaper
Sn web-whitepaper
 

Plus de Santosh V

Plus de Santosh V (8)

Postnatal message
Postnatal  messagePostnatal  message
Postnatal message
 
"The man of the world"The Further Endeavours of Bill- Review
"The man of the world"The Further Endeavours of Bill- Review"The man of the world"The Further Endeavours of Bill- Review
"The man of the world"The Further Endeavours of Bill- Review
 
Tips for college case study writing
Tips for college case study writingTips for college case study writing
Tips for college case study writing
 
6 tips to grooming your beard
6 tips to grooming your beard6 tips to grooming your beard
6 tips to grooming your beard
 
How do i fix my broken zipper
How do i fix my broken zipperHow do i fix my broken zipper
How do i fix my broken zipper
 
Gopro hero silver review
Gopro hero silver reviewGopro hero silver review
Gopro hero silver review
 
5 weird and effective social media marketing tips
5 weird and effective social media marketing tips5 weird and effective social media marketing tips
5 weird and effective social media marketing tips
 
4 simple ways of dealing with dog fleas
4 simple ways of dealing with dog fleas4 simple ways of dealing with dog fleas
4 simple ways of dealing with dog fleas
 

Dernier

Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Victor Rentea
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Victor Rentea
 

Dernier (20)

Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontology
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Elevate Developer Efficiency & build GenAI Application with Amazon Q​
Elevate Developer Efficiency & build GenAI Application with Amazon Q​Elevate Developer Efficiency & build GenAI Application with Amazon Q​
Elevate Developer Efficiency & build GenAI Application with Amazon Q​
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
WSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering DevelopersWSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering Developers
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
Platformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityPlatformless Horizons for Digital Adaptability
Platformless Horizons for Digital Adaptability
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Vector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptxVector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptx
 

Principle of a good web design

  • 1. Basic Principles for a good web designing Web designing may look simple with all those popular CMS tools available in the market. But it is not that easy as it being promoted widely. Achieving a visual coherent, brand promoting website development can prove to be deceptively difficult. Web designing should take care many human factor that is, it should be usable, pleasing, should have relevant content (Information) , should promote brand voice, and last but not the least should be visual coherent Below given are the main principles to be followed while designing a web 1.Precedence The basic principle of a good web designing should start from the concept precedence that means to decide on upper hand, on how much visual weigh should be given to different parts of your web page or the tab, For example the first thing you see for any web page is the logo of the company; and that we call it as precedence; while designing the web. In other words the user should be led through the web page according to the precedence, decided by the web designer giving weight to the different visual elements according to the priority of the brand.
  • 2. A good web design can influence user eyes to follow a sequence of steps while browsing the web. For example, you may want your user to see your company logo then to the primary navigation bar then to the headline of the main body text with side navigation bar indicating a subpage or call to action (CTA) to keep your user engaged with your brand. Though theoretically it is the user who decides what he should look into the webpage but practically it should be guided by the web designer. So how do you achieve precedence in good web designing? The many tools at disposal for a web designer to achieve the precedence are element positioning, color, size and character weight and style. 2. Navigation To achieve high conversion on a web site, for both human and search engine, the main element to be optimized is the navigation. While on the design stage of a web site, greater important has to be given to the navigation element. The most important question you should as a good web designer is “where to go?” And “where am I”, that meant the two aspects of Navigation element are Navigate and Orientation.
  • 3. 3. Typography Digital world is influenced by the content, a content rich web page is preferred by both user’s and search engine. When we talk of content, text is the most common element of the web designing. Text speaks both about your design and the brand (product / service) The different aspects of Text element to be considered during the designing are Font Font size Color Spacing Line length And leading 4. Spacing Most of the designer tends to fill the space with lot of information and navigation, but doing so, you will be discouraging your user to convert in your web page. Space in a web page will make the things clearer. The important aspects of Spacing to be considered by a good web designer
  • 4. Line spacing- Too little space will make the eye to spill over to nearby text and too much space will make you to lose your focus on the previous statement. Padding:- Giving enough space between the text and the other element that is clearly distinguishing the neighboring elements for example text and image, text and table border White space- White space doesn’t need to be white. The term white space means clear space or empty space on a page. White space is used to guide you user eye to different elements of webpage. It will make your webpage clutter free.