WEB

PROGRAMMING
GROUP 8
 EXECUTIVE SUMMARY

02 04

Things to Importance of
consider in web website
Designing
01 03
Principles of Support tools for
Effective Design web creation and
programming
WHAT ARE WEB DESIGN PRINCIPLES?

Web design principles are guidelines that help create

visually appealing, user-friendly, and effective websites.
These principles ensure that a website is functional,
responsive, and useful while providing a seamless
experience for users.
9 PRINCIPLES OF EFFECTIVE DESIGN
1. WEBSITE
PURPOSE
A website should meet user needs with a clear
and simple intention on every page for easy
interaction.

These are the core purposes common to all

websites.
• Describing Expertise
• Building Your Reputation
• Generating Leads
• Sales and After Care
 2. SIMPLICITY
Ways to achieve
simplicity through design.
Simplicity is the best way to go • Colors - Influence emotions and
when considering the user customer behavior.
experience and the usability of • Type - Typography Fonts shape
your website. your brand’s voice.

• Imagery - Visual elements like

photos, videos, and graphics
shape a brand’s identity.
3. NAVIGATION
Website navigation helps visitors interact and find what
they need. It uses menus, links, and buttons to make
moving between pages easy, keeping users engaged.

4. GRID BASED
LAYOUT
Grids structure your design and organize content. They align
elements on the page, keeping it clean and balanced. A grid-
based layout arranges content into columns and sections,
creating an orderly and aesthetically pleasing website.
 5. F-SHAPED PATTERN
1
READING 2
Eye-tracking studies have found
The F-based pattern is the most
that most of what people see is
common way visitors scan text
in the top and left areas of the
on a website.
screen.

3
The F shaped layout mimics our 4
An effectively designed website
natural pattern of reading in the
will work with a reader’s natural
West.
pattern of scanning the page.
(left to right and top to bottom)
F-SHAPED PATTERN READING

1
 6. VISUAL
HIERARCHY
Visual hierarchy arranges elements by importance using size, color,
contrast, and other design features. It creates a focal point to guide
users to the most important information. This helps ensure a clear,
organized, and user-friendly layout.

7. CONTENT

An effective website has both great design and great content. Using
compelling language, great content can attract and influence visitors
by converting them into customers.
8. LOAD TIME
the amount of time it takes for a webpage or an
application to become fully operational and
accessible to the user after a request has been
made.

9. MOBILE
FRIENDLY
a website is optimized for viewing and
interacting on smaller screens like smartphones
and tablets, More people browse the web on
phones. Make sure your website has a responsive
layout that adapts to different screens.
10 THINGS TO CONSIDER IN
WEB DESIGNING
 WHAT IS WEB DESIGNING?

Web design is the planning and creation of

websites. This includes the information, user
interface, site structure, navigation, layout,
colors, fonts and imagery.
 10 Things to consider in Web
Design
1. Site Purpose – Clearly define why your site exists
education, advocacy and services to guide design and content.

2. Target Audience – Focus on your top two audiences instead

of trying to reach everyone for better impact.

3.Site Objectives – Identify what visitors want to do and what

actions you want them to take. Align design and content
accordingly.
 10 Things to consider in Web
Design
4. Mobile-Friendly Design – Ensure your site adapts to all screen
sizes; avoid separate mobile versions.

5.Fresh Content – Regular updates keep visitors coming back, like

new exhibits in a museum.

6. Engaging Content – Use short text, images, and videos to

capture attention since people skim web pages.
 10 Things to consider in Web
Design

7. Features – Plan essential elements like donation

buttons, forms, and social media integration early.

8. SEO (Search Engine Optimization) – Optimize your

site so it ranks higher in search results.
 10 Things to consider in Web
Design

9. Site Maintenance – Plan for ongoing updates. Decide

who will manage content and how it will be done.

10.Accessibility – Ensure your site is usable for all,

including people with disabilities, following ADA guidelines.
THE SUPPORTING TOOLS
FOR WEB DEVELOPMENT
AND PROGRAMMING
1. VISUAL STUDIO CODE (VS CODE):
• Popular text editor and IDE for web
development.
• Available on Windows, macOS, and Linux.
• Features:
• Inbuilt intelligence for code completion.
• Integrated debugger.
• Extensive marketplace for extensions.
• Inbuilt Git connection for version control.

2. REACT:
• JavaScript framework developed by
Facebook.
• Gaining popularity due to its efficient
handling of the virtual DOM.
• Allows building applications for Android, iOS,
and web (using React Native)
 3. DJANGO

• Python-based web framework.

• Offers rapid development of APIs and
web applications.
• Known for its strong security,
scalability, and minimal coding
requirements.

4. BOOTSTRAP
Explore new technologies, market

• A CSS framework created by Twitter.

trends, or disruptive forces that
could shape the future competitive

• Comprises HTML, CSS, JavaScript, and

landscape. Understanding these
trends helps you anticipate
potential threats and opportunities.
jQuery to create responsive websites
easily.
• Provides pre-built components for
quick website development.
 5. YARN

• Package manager created by Facebook.

• Known for speed and reliability.
• Features include workspaces and
compatibility with npm.

6. GITHUB
Explore new technologies, market
trends, or disruptive forces that
• Version control platform that implements Git
could shape the future competitive
landscape. Understanding these
workflow.trends helps you anticipate
potential threats and opportunities.
• Used for collaboration in coding projects and
open-source contributions.
• Offers features like GitHub Actions for CI/CD
and webpage hosting capabilities.
7. ADOBE DREAMWEAVER

• A web design tool offering visual and HTML

editing.
• Allows users to build websites without
extensive programming knowledge.
• Includes Git integration for source code
management.
Explore new technologies, market
trends, or disruptive forces that
could shape the future competitive
landscape. Understanding these
trends helps you anticipate
potential threats and opportunities.
THE IMPORTANCE OF A
WEBSITE
01 Online Presence & Accessibility

A website acts as a 24/7 online presence, providing information and

increasing accessibility beyond physical locations.

02 Credibility & Professionalism

Having a well-designed website makes a company or individual appear more

credible and professional. Many consumers trust businesses with a strong online
presence over those without one.

03 Marketing & Branding

A website is a powerful marketing tool that helps establish a brand identity. It

provides a platform to showcase products, services, achievements, and
customer testimonials, creating a strong brand image.
04 Cost-Effective & Wider Reac

Compared to traditional advertising methods, websites offer a cost-effective

way to reach a global audience. Businesses can connect with potential
customers beyond local markets, increasing their reach.

05 Better Customer Engagement

Websites allow businesses to interact with customers through blogs, FAQs, live
chat, and contact forms. This enhances communication and helps in building strong
customer relationships.

06 Sales & Business Growth

E-commerce websites enable businesses to sell products and services online,

increasing revenue opportunities. Even service-based businesses benefit from
online booking systems and lead generation.
07 Competitive Advantage

In today’s digital world, most competitors already have websites. Without

one, a business or organization risks falling behind. A website ensures that
you stay competitive in your industry.

08 Information & Updates

Websites serve as an information hub, providing updates, announcements, and

essential details to visitors. This is especially useful for businesses, schools,
government agencies, and non-profits.

09 SEO & Discoverability

A well-optimized website can rank on search engines like Google, making it

easier for potential customers or users to discover your brand when searching
for related topic
 10 Adaptability to Future Trends

As technology evolves, websites can be updated and improved to

incorporate new features like AI chatbots, automation, and mobile-
friendly designs, ensuring long-term relevance.

09
THANK YOU FOR
LISTENING !