Basic Web Page Creation: Web Design Web Design Platforms

● Is the process of creation, with 1. Content Management Systems

the intention of presenting a (CMS) – WordPress, Joomla, Drupal.
content on electronic web pages, 2. Social Media Platforms – Facebook,
which Instagram, Twitter, LinkedIn.
end-users can access through 3. Ecommerce Platforms – Shopify,
the internet with the help of a web WooCommerce, Magento.
browser. 4. Multimedia Platforms – YouTube,
● Web design is about design, Vimeo, Canva, TikTok.
not about coding 5. Educational Platforms – Google
and front-end development. Classroom, Moodle, Coursera.
● Refers to the user experience
aspects of website Popular Website Design Tools
development rather than software ● Website Builders: Wix, Squarespace,
development. Weebly. -“WYSIWYG”
● A web designer works on the ● Content Management Systems
appearance, layout, (CMS): WordPress, Joomla, Drupal.
and, in some cases, content of a - Web Templates
website. ● Design Software: Adobe XD, Figma,
● A good web design is easy to Canva.
use, aesthetically
pleasing, and suits the user Web Design Platforms
group and brand of ● “WYSIWYG” - Means “What You See
the website. Is What You Get”
- In this kind of platform, no coding skills
What Are Online Creation Tools and are required. Instead, you manipulate
Platforms? with design components using an
● Online creation tools and editor window and get the chance to
platforms allow users to create, choose what elements are on your
edit, and share digital content page.
efficiently. - No-code editing
● Examples include website - Speedy publishing
builders, content management - Streamlined workflow
systems (CMS), social media, ● WEB TEMPLATES
e-commerce platforms, and - These are unique full-page layout that
multimedia tools. contains generic information which can
● These platforms enable be replaced by the users with their own
businesses, educators, and personal information.
individuals to establish an online
presence.
 Things to consider when creating a - A well thought-out color palette can go
Website: a long way in enhancing user
1. Purpose experience
2. Communication - Complimentary Colors will create
3. Typefaces balance
4. Colors - Color Harmony: Make reading easier
5. Navigation 5.​ Navigation
6. Images - It is how easy it is for people to take
7. “F” Pattern action and move around the website
8. Grid Base Layouts - Effective Navigation Rules:
9. Load Time 1. Logical Page Hierarchy
10. Mobile Friendly 2. Designing Clickable Buttons
11. Good Visual Design 3. Follow the “3 Click Rule”
12. Call to Action 6.​ Images
13. Credibility - Choosing the right image can help you
with brand positioning and connecting
1.​ Purpose with your target audience.
- Each page of your website needs to - Consider using photo, video,
have a clear purpose infographics, graph, charts etc.
- Each page of should fulfill a specific 7.​ F “Pattern”
need for your website user in the most - Left to Right
effective way possible - Top to Bottom
2.​ Communication 8.​ Grid Base Layouts
- It is important to get your message - Sections, text, and photos lare all lined
across up
- Make your message concise, clear and - Structured and balance that results in
easy to understand. an aesthetically pleasing website
How: 9.​ Load Time
- Organize your information - Everybody hate a website that takes
- Use headlines and ages to load
sub-headlines - Optimize image sizes
- Use bullet points, etc. 10.​ Mobile Friendly
3.​ Typefaces - It is important to consider building your
- The ideal font size for easy reading website with a responsive layout
online is 16px 11.​ Good Visual Design
- Stick to a maximum of 3 typeface - Use a design that relates to your
design and 3 point size when designing website “Topic”
a website to keep it clean and 12.​Call to Action
streamlined - Banner, button, etc on a website meant
4.​ Colors to prompt a user to click it
- Actively strives to convert a user into a Elements of User Experience by
lead and later into a customer Jesse James Garrett
- Examples: Shop now!, Buy Now!, Start Jesse James Garrett is a User
Now!, etc. Experience Designer based in San
13.​Credibility Francisco, California and co-founder
- Utilized verified links, clearly stating of Adaptive Path strategy and design
your identity, contact information, and consulting firm. His diagram titled The
good grammar Elements of User Experience launched
his popularity in the web design
User Experience (UX) community in early 2000, which was
later published as a book.
● UX design is the design of the
elements that determine the interaction STRATEGY
a user has with a product or service. UX Why you created it and why are
design molds the products and services people willing to use it.
we use on a daily basis to make them It's important for teams to be
easy to use, efficient, and enjoyable for aware of the business's goals
the end-users. It can make or break the and objectives because if the
success of a business or brand. product does not return a profit,
● While it is still important for a product the business will not be
to function, experience has also become sustainable. The strategy helps
extremely relevant: the better the you identify *who you are
experience you’re offering, the more designing for and why*.
likely customers will choose you over
your competitors: UX can be a SCOPE
differentiator in a crowded marketplace. - defines “what you will be designing”
- “who you are designing for and
The Difference between UX and UI why”
Design - Designers work collaboratively
While UX is the internal experience of with all stakeholders to identify
customers as they interact with any what features and functionality will
aspect of a product/service, UI is the help address user needs.
sum of all the visual elements of a
product/service. UI is all about screens,
pages, icons; it of course contributes to
making an experience better (or worse)
but it is just a part of the whole.