SlideShare a Scribd company logo
1 of 19
Group 3
11-McLaren
Runel Canoy
Karl Angelo Cometa
Jose Vincent Cabusao
Al Gerald Carreon
Web Design and ICT
 A web page (also written as webpage) is a
document that is suitable for the World Wide
Web and web browsers. A web browser displays a
web page on a monitor or mobile device. The web
page usually means what is visible, but the term may
also refer to a computer file, usually written
in HTML or a comparable markup language. Web
browsers coordinate various web resource elements
for the written web page, such as style
sheets, scripts, and images, to present the web page.
Typical web pages provide hypertext that includes
a navigation bar or a sidebar menu linking
to other web pages via hyperlinks, often referred to
as links.
 There are many available software that
you can useto design a webpage. Example
of website builders are Adobe
Dreamweaver, MS Publisher, Squarespace,
Weebly, Wix, Xprs, Strikingly, Wordpress
and Zohosties.
Basic Web Design Principles and
Elements
 Web design is concept of planning,
creating, updating, and maintaining
websites. A good web design allows the
user to understand the message,
contents, and ideas in the most
convenient way.
Web Design Elements
 Text- font family and type be chosen well,
clear, and readable size.
 Graphic/lllustrations- must be good
quality and well aranged with the text
other elements. Infographics may be
used.
 Shapes- can be used denote and enclosed
boundary in the overall design.
Web Design Principles
 Portable Design – website design must be
portable and accessible by users who have
different browsers, operating systems, and
computer platforms.
 Design and Low Bandwidth- website design
must be accesible at a variety of speeds.
 Direction- identify the order of importance of
the various elements and place them in a
sequence where the eyes moves and
perceives the thing it sees.
Web Design
Web Page Design Using Templates
and Online WYSIWYG Platforms
 Wix- is a pure WYSIWYG, free cloud-
based web development platform it allows
users to create HTML5 websites and
mobile sites.
 Weebly- is a free website builder, blog,
and web-hosting service.
Creating a Web Page
 Website allows you to market and sell
your products online. There are free and
paid subscription online website tools that
are easy to use and accesible on the
Internet
How to Create Website Using WIX
 Sign Up for an Account - just like signing
up for basically any other online service,
getting started with WIX requires you to
sign up for an account. To do this, you
just enter your email address and a
password or you can sign in with a Google
or Facebook social account.
Choose a Type of Website
 Then you’ll need to choose the kind of
website you want to start. Begin by clicking
“I Need a Site For …” and then browse your
options. Some of the selections most useful
to small businesses might include a business
website, online store or blog. But depending
on the type of business you operate, you
might also select “Photography,”
“Restaurants,” “Accommodation” (for hotels
or other similar businesses) or “Beauty &
Wellness.”
Select a Template
 Once you’ve picked what type of website you
want to create, you’ll be directed to a
selection of different templates to choose
from. You can browse from the popular
templates or search for something specific.
You can also search within specific categories
like websites made specifically for
consultants, service providers or marketers.
Or you can choose from a selection of mostly
blank themes and then build up from there.
Change Your Details
 When you’ve selected a template you like,
WIX will take you to a preview of the design
that you can edit by clicking, dragging and
dropping the different elements on the page.
But one of the first things you should do is
update your business name, tagline and any
other text elements on the page that aren’t
specific to your business. To do this, just click
on the text that you want to change and then
you’ll see a text editor that lets you type in
new text and change the size, font and other
elements.
Update Media
 You’ll also have the ability to change some of
the more visual elements of the site. If there
are any photos included on the template, you
can click on them to change them to a photo
that’s more specific to your business. And
you also have the ability to change the
background of your page. Just click on the
background option on the sidebar, and then
you can choose a color or upload a photo or
video to serve as the background of your
website.
Add Different Elements
 Your template is really just a starting point for your
new website. You can also add other elements to the
page to really make the site look complete. On the
sidebar, click the “add” button to bring up a list of
potential page elements you can add to your site. You
might choose to add things like text boxes, images,
slideshows, buttons, menus, videos or shapes. When
you click on one of those elements from the menu,
you can see a few different options for the type of
style you want to add to your site. Then you can add
and move around different elements to make
everything look exactly the way you want it.
Repeat for Each Page
 And once you add whatever elements you
want to your homepage, don’t forget to do
the same for the other pages on your site.
You don’t have to add the exact same
elements. You can customize each page to
look exactly the way you want using the
same method. Just click on the page you
want to edit in the navigation bar and then
add whatever elements you want on that
page. Save your work and move on to edit
the next page.
Add a Blog
 You can also choose which pages you
want included on your website. One page
that you might want to consider adding, if
you didn’t choose it as your main web
page, is a blog. You can add a blog to
your website by adding that page element
using the tools on your sidebar. Then you
can manage your posts and add new
content from the sidebar as well.
Include Your Products
 Also included on the sidebar is a store
manager. If you have an eCommerce site
or want to include any products for sale
on your site, you can use this section to
add the products you have to offer, along
with supplementary elements like photos
and prices. You can also edit things like
payments, shipping and store settings
from this section.
Publish Your Site
 When you’re happy with every part of your
website, it’s time to publish. You can preview
your site by clicking the button in the top right
corner, just to make sure everything looks and
works like it’s supposed to. Then just click
“publish” in the top right corner and your site will
go live. You can see your domain in the popup
that appears. Or you can choose to connect your
WIX site to your own branded domain. When
you’re done, the result should be a website that
effectively represents your business and that
you’ll be proud to promote through social media
and other channels.

More Related Content

What's hot

Introduction to Wordpress
Introduction to WordpressIntroduction to Wordpress
Introduction to WordpressSMforbeginners
 
Introduction to wordpress
Introduction to wordpressIntroduction to wordpress
Introduction to wordpressSMforbeginners
 
Unit 3: Lesson 3
Unit 3: Lesson 3Unit 3: Lesson 3
Unit 3: Lesson 3Neil James
 
Google sites creating editing and sharing a site
Google sites creating editing and sharing a siteGoogle sites creating editing and sharing a site
Google sites creating editing and sharing a siteEHWLC
 
Unit f adobe dreamweaver cs6
Unit f adobe dreamweaver cs6Unit f adobe dreamweaver cs6
Unit f adobe dreamweaver cs6Krista Lawrence
 
Webme Slide Tutorial
Webme Slide TutorialWebme Slide Tutorial
Webme Slide Tutorialmariamcgarry
 
IE9 for developers
IE9 for developersIE9 for developers
IE9 for developersShaymaa
 
Cms Train The Trainer Guide
Cms Train The Trainer GuideCms Train The Trainer Guide
Cms Train The Trainer GuideFrances O'Neill
 
Easy Tips and Tricks for Google Sites
Easy Tips and Tricks for Google SitesEasy Tips and Tricks for Google Sites
Easy Tips and Tricks for Google SitesMarlena Hebern
 
WordPress for Blogging: Benefits of Self-Hosting
WordPress for Blogging: Benefits of Self-HostingWordPress for Blogging: Benefits of Self-Hosting
WordPress for Blogging: Benefits of Self-HostingMichelle Ames
 
Unit c adobe dreamweaver cs6
Unit c adobe dreamweaver cs6Unit c adobe dreamweaver cs6
Unit c adobe dreamweaver cs6Krista Lawrence
 
Easy Google Sites Tips and Tricks
Easy Google Sites Tips and Tricks Easy Google Sites Tips and Tricks
Easy Google Sites Tips and Tricks Marlena Hebern
 
Why you should create a Behance account
Why you should create a Behance accountWhy you should create a Behance account
Why you should create a Behance accountDora Chua
 
Unit j adobe dreamweaver cs6
Unit j adobe dreamweaver cs6Unit j adobe dreamweaver cs6
Unit j adobe dreamweaver cs6Krista Lawrence
 
Setting Wordpress website guide for starters
Setting Wordpress website guide for startersSetting Wordpress website guide for starters
Setting Wordpress website guide for startersjatindsim
 
Unit e adobe dreamweaver cs6
Unit e adobe dreamweaver cs6Unit e adobe dreamweaver cs6
Unit e adobe dreamweaver cs6Krista Lawrence
 

What's hot (20)

Introduction to Wordpress
Introduction to WordpressIntroduction to Wordpress
Introduction to Wordpress
 
Introduction to wordpress
Introduction to wordpressIntroduction to wordpress
Introduction to wordpress
 
Unit 3: Lesson 3
Unit 3: Lesson 3Unit 3: Lesson 3
Unit 3: Lesson 3
 
Google sites creating editing and sharing a site
Google sites creating editing and sharing a siteGoogle sites creating editing and sharing a site
Google sites creating editing and sharing a site
 
Unit f adobe dreamweaver cs6
Unit f adobe dreamweaver cs6Unit f adobe dreamweaver cs6
Unit f adobe dreamweaver cs6
 
Webme Slide Tutorial
Webme Slide TutorialWebme Slide Tutorial
Webme Slide Tutorial
 
IE9 for developers
IE9 for developersIE9 for developers
IE9 for developers
 
Dreamweaver
DreamweaverDreamweaver
Dreamweaver
 
Canvas 101
Canvas 101Canvas 101
Canvas 101
 
Cms Train The Trainer Guide
Cms Train The Trainer GuideCms Train The Trainer Guide
Cms Train The Trainer Guide
 
Easy Tips and Tricks for Google Sites
Easy Tips and Tricks for Google SitesEasy Tips and Tricks for Google Sites
Easy Tips and Tricks for Google Sites
 
WordPress for Blogging: Benefits of Self-Hosting
WordPress for Blogging: Benefits of Self-HostingWordPress for Blogging: Benefits of Self-Hosting
WordPress for Blogging: Benefits of Self-Hosting
 
Unit c adobe dreamweaver cs6
Unit c adobe dreamweaver cs6Unit c adobe dreamweaver cs6
Unit c adobe dreamweaver cs6
 
Easy Google Sites Tips and Tricks
Easy Google Sites Tips and Tricks Easy Google Sites Tips and Tricks
Easy Google Sites Tips and Tricks
 
Why you should create a Behance account
Why you should create a Behance accountWhy you should create a Behance account
Why you should create a Behance account
 
Your user profile
Your user profileYour user profile
Your user profile
 
Unit j adobe dreamweaver cs6
Unit j adobe dreamweaver cs6Unit j adobe dreamweaver cs6
Unit j adobe dreamweaver cs6
 
How to build a weebly website ppt
How to build a weebly website pptHow to build a weebly website ppt
How to build a weebly website ppt
 
Setting Wordpress website guide for starters
Setting Wordpress website guide for startersSetting Wordpress website guide for starters
Setting Wordpress website guide for starters
 
Unit e adobe dreamweaver cs6
Unit e adobe dreamweaver cs6Unit e adobe dreamweaver cs6
Unit e adobe dreamweaver cs6
 

Similar to Group 3

Group 3 basic web page creation
Group 3  basic web page creationGroup 3  basic web page creation
Group 3 basic web page creationFe Lanny Tejano
 
group3-basicwebpagecreation-180605143111.pptx
group3-basicwebpagecreation-180605143111.pptxgroup3-basicwebpagecreation-180605143111.pptx
group3-basicwebpagecreation-180605143111.pptxBenjieBarlaan
 
L8-Basic-Webpage-Creation.pptx
L8-Basic-Webpage-Creation.pptxL8-Basic-Webpage-Creation.pptx
L8-Basic-Webpage-Creation.pptxJUDITHFRONDA2
 
TID Chapter 8 Web Page Development
TID Chapter 8 Web Page DevelopmentTID Chapter 8 Web Page Development
TID Chapter 8 Web Page DevelopmentWanBK Leo
 
Web2.0 drummonds
Web2.0 drummondsWeb2.0 drummonds
Web2.0 drummondsHDRUMMONDS
 
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 & NavigationArti Parab Academics
 
5 Factors That Make a Good Website
5 Factors That Make a Good Website5 Factors That Make a Good Website
5 Factors That Make a Good Websitegiddyflat6312
 
7 steps to make a word press website
7 steps to make a word press website7 steps to make a word press website
7 steps to make a word press websiteYiliaQin
 
Instapage Review — Is This the Best Landing Page Builder?
Instapage Review — Is This the Best Landing Page Builder?Instapage Review — Is This the Best Landing Page Builder?
Instapage Review — Is This the Best Landing Page Builder?SandeepSawant42
 
Instapage Review — Is This the Best Landing Page Builder?
Instapage Review — Is This the Best Landing Page Builder?Instapage Review — Is This the Best Landing Page Builder?
Instapage Review — Is This the Best Landing Page Builder?SandeepSawant42
 
Internet marketing steps
Internet marketing stepsInternet marketing steps
Internet marketing stepsJoyjitRoy
 
Net4’s EasySite Builder Step by Step Guide
Net4’s EasySite Builder Step by Step GuideNet4’s EasySite Builder Step by Step Guide
Net4’s EasySite Builder Step by Step GuidePallavi Vyas
 
Net4’s EasySite Builder Step By Step Guide to Create Business Website
Net4’s EasySite Builder Step By Step Guide to Create Business WebsiteNet4’s EasySite Builder Step By Step Guide to Create Business Website
Net4’s EasySite Builder Step By Step Guide to Create Business WebsiteNet4 India Ltd.
 
Empowerment Technology- PowerPoint Presentation copy.pdf
Empowerment Technology- PowerPoint Presentation copy.pdfEmpowerment Technology- PowerPoint Presentation copy.pdf
Empowerment Technology- PowerPoint Presentation copy.pdfArcee Mondragon
 
Empowerment Technology- PowerPoint Presentation copy.pptx
Empowerment Technology- PowerPoint Presentation copy.pptxEmpowerment Technology- PowerPoint Presentation copy.pptx
Empowerment Technology- PowerPoint Presentation copy.pptxArcee Mondragon
 
Introduction to Web Page Design OT and Network
Introduction to Web Page Design OT and NetworkIntroduction to Web Page Design OT and Network
Introduction to Web Page Design OT and NetworkNosajTriumps
 
Wikispaces Help
Wikispaces HelpWikispaces Help
Wikispaces Helphapy
 

Similar to Group 3 (20)

Group 3 basic web page creation
Group 3  basic web page creationGroup 3  basic web page creation
Group 3 basic web page creation
 
group3-basicwebpagecreation-180605143111.pptx
group3-basicwebpagecreation-180605143111.pptxgroup3-basicwebpagecreation-180605143111.pptx
group3-basicwebpagecreation-180605143111.pptx
 
Wix
WixWix
Wix
 
L8-Basic-Webpage-Creation.pptx
L8-Basic-Webpage-Creation.pptxL8-Basic-Webpage-Creation.pptx
L8-Basic-Webpage-Creation.pptx
 
TID Chapter 8 Web Page Development
TID Chapter 8 Web Page DevelopmentTID Chapter 8 Web Page Development
TID Chapter 8 Web Page Development
 
Web2.0 drummonds
Web2.0 drummondsWeb2.0 drummonds
Web2.0 drummonds
 
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
 
5 Factors That Make a Good Website
5 Factors That Make a Good Website5 Factors That Make a Good Website
5 Factors That Make a Good Website
 
7 steps to make a word press website
7 steps to make a word press website7 steps to make a word press website
7 steps to make a word press website
 
Instapage Review — Is This the Best Landing Page Builder?
Instapage Review — Is This the Best Landing Page Builder?Instapage Review — Is This the Best Landing Page Builder?
Instapage Review — Is This the Best Landing Page Builder?
 
Instapage Review — Is This the Best Landing Page Builder?
Instapage Review — Is This the Best Landing Page Builder?Instapage Review — Is This the Best Landing Page Builder?
Instapage Review — Is This the Best Landing Page Builder?
 
Internet marketing steps
Internet marketing stepsInternet marketing steps
Internet marketing steps
 
Net4’s EasySite Builder Step by Step Guide
Net4’s EasySite Builder Step by Step GuideNet4’s EasySite Builder Step by Step Guide
Net4’s EasySite Builder Step by Step Guide
 
Net4’s EasySite Builder Step By Step Guide to Create Business Website
Net4’s EasySite Builder Step By Step Guide to Create Business WebsiteNet4’s EasySite Builder Step By Step Guide to Create Business Website
Net4’s EasySite Builder Step By Step Guide to Create Business Website
 
Instapage review
Instapage reviewInstapage review
Instapage review
 
Empowerment Technology- PowerPoint Presentation copy.pdf
Empowerment Technology- PowerPoint Presentation copy.pdfEmpowerment Technology- PowerPoint Presentation copy.pdf
Empowerment Technology- PowerPoint Presentation copy.pdf
 
Empowerment Technology- PowerPoint Presentation copy.pptx
Empowerment Technology- PowerPoint Presentation copy.pptxEmpowerment Technology- PowerPoint Presentation copy.pptx
Empowerment Technology- PowerPoint Presentation copy.pptx
 
Introduction to Web Page Design OT and Network
Introduction to Web Page Design OT and NetworkIntroduction to Web Page Design OT and Network
Introduction to Web Page Design OT and Network
 
Wikispaces Help
Wikispaces HelpWikispaces Help
Wikispaces Help
 
Key Steps To Building A Great Small Business Website.pdf
Key Steps To Building A Great Small Business Website.pdfKey Steps To Building A Great Small Business Website.pdf
Key Steps To Building A Great Small Business Website.pdf
 

Recently uploaded

Pharmacognosy Flower 3. Compositae 2023.pdf
Pharmacognosy Flower 3. Compositae 2023.pdfPharmacognosy Flower 3. Compositae 2023.pdf
Pharmacognosy Flower 3. Compositae 2023.pdfMahmoud M. Sallam
 
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions  for the students and aspirants of Chemistry12th.pptxOrganic Name Reactions  for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptxVS Mahajan Coaching Centre
 
Capitol Tech U Doctoral Presentation - April 2024.pptx
Capitol Tech U Doctoral Presentation - April 2024.pptxCapitol Tech U Doctoral Presentation - April 2024.pptx
Capitol Tech U Doctoral Presentation - April 2024.pptxCapitolTechU
 
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17Celine George
 
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxEmployee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxNirmalaLoungPoorunde1
 
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...Marc Dusseiller Dusjagr
 
Final demo Grade 9 for demo Plan dessert.pptx
Final demo Grade 9 for demo Plan dessert.pptxFinal demo Grade 9 for demo Plan dessert.pptx
Final demo Grade 9 for demo Plan dessert.pptxAvyJaneVismanos
 
Interactive Powerpoint_How to Master effective communication
Interactive Powerpoint_How to Master effective communicationInteractive Powerpoint_How to Master effective communication
Interactive Powerpoint_How to Master effective communicationnomboosow
 
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxiammrhaywood
 
CARE OF CHILD IN INCUBATOR..........pptx
CARE OF CHILD IN INCUBATOR..........pptxCARE OF CHILD IN INCUBATOR..........pptx
CARE OF CHILD IN INCUBATOR..........pptxGaneshChakor2
 
Framing an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdf
Framing an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdfFraming an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdf
Framing an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdfUjwalaBharambe
 
internship ppt on smartinternz platform as salesforce developer
internship ppt on smartinternz platform as salesforce developerinternship ppt on smartinternz platform as salesforce developer
internship ppt on smartinternz platform as salesforce developerunnathinaik
 
Types of Journalistic Writing Grade 8.pptx
Types of Journalistic Writing Grade 8.pptxTypes of Journalistic Writing Grade 8.pptx
Types of Journalistic Writing Grade 8.pptxEyham Joco
 
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxSolving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxOH TEIK BIN
 
Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon ACrayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon AUnboundStockton
 
Painted Grey Ware.pptx, PGW Culture of India
Painted Grey Ware.pptx, PGW Culture of IndiaPainted Grey Ware.pptx, PGW Culture of India
Painted Grey Ware.pptx, PGW Culture of IndiaVirag Sontakke
 

Recently uploaded (20)

Pharmacognosy Flower 3. Compositae 2023.pdf
Pharmacognosy Flower 3. Compositae 2023.pdfPharmacognosy Flower 3. Compositae 2023.pdf
Pharmacognosy Flower 3. Compositae 2023.pdf
 
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions  for the students and aspirants of Chemistry12th.pptxOrganic Name Reactions  for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
 
Capitol Tech U Doctoral Presentation - April 2024.pptx
Capitol Tech U Doctoral Presentation - April 2024.pptxCapitol Tech U Doctoral Presentation - April 2024.pptx
Capitol Tech U Doctoral Presentation - April 2024.pptx
 
ESSENTIAL of (CS/IT/IS) class 06 (database)
ESSENTIAL of (CS/IT/IS) class 06 (database)ESSENTIAL of (CS/IT/IS) class 06 (database)
ESSENTIAL of (CS/IT/IS) class 06 (database)
 
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
 
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxEmployee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptx
 
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
 
Final demo Grade 9 for demo Plan dessert.pptx
Final demo Grade 9 for demo Plan dessert.pptxFinal demo Grade 9 for demo Plan dessert.pptx
Final demo Grade 9 for demo Plan dessert.pptx
 
Interactive Powerpoint_How to Master effective communication
Interactive Powerpoint_How to Master effective communicationInteractive Powerpoint_How to Master effective communication
Interactive Powerpoint_How to Master effective communication
 
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
 
CARE OF CHILD IN INCUBATOR..........pptx
CARE OF CHILD IN INCUBATOR..........pptxCARE OF CHILD IN INCUBATOR..........pptx
CARE OF CHILD IN INCUBATOR..........pptx
 
Framing an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdf
Framing an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdfFraming an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdf
Framing an Appropriate Research Question 6b9b26d93da94caf993c038d9efcdedb.pdf
 
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdfTataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
 
internship ppt on smartinternz platform as salesforce developer
internship ppt on smartinternz platform as salesforce developerinternship ppt on smartinternz platform as salesforce developer
internship ppt on smartinternz platform as salesforce developer
 
Types of Journalistic Writing Grade 8.pptx
Types of Journalistic Writing Grade 8.pptxTypes of Journalistic Writing Grade 8.pptx
Types of Journalistic Writing Grade 8.pptx
 
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxSolving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptx
 
Model Call Girl in Bikash Puri Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Bikash Puri  Delhi reach out to us at 🔝9953056974🔝Model Call Girl in Bikash Puri  Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Bikash Puri Delhi reach out to us at 🔝9953056974🔝
 
OS-operating systems- ch04 (Threads) ...
OS-operating systems- ch04 (Threads) ...OS-operating systems- ch04 (Threads) ...
OS-operating systems- ch04 (Threads) ...
 
Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon ACrayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon A
 
Painted Grey Ware.pptx, PGW Culture of India
Painted Grey Ware.pptx, PGW Culture of IndiaPainted Grey Ware.pptx, PGW Culture of India
Painted Grey Ware.pptx, PGW Culture of India
 

Group 3

  • 1. Group 3 11-McLaren Runel Canoy Karl Angelo Cometa Jose Vincent Cabusao Al Gerald Carreon
  • 2. Web Design and ICT  A web page (also written as webpage) is a document that is suitable for the World Wide Web and web browsers. A web browser displays a web page on a monitor or mobile device. The web page usually means what is visible, but the term may also refer to a computer file, usually written in HTML or a comparable markup language. Web browsers coordinate various web resource elements for the written web page, such as style sheets, scripts, and images, to present the web page. Typical web pages provide hypertext that includes a navigation bar or a sidebar menu linking to other web pages via hyperlinks, often referred to as links.
  • 3.  There are many available software that you can useto design a webpage. Example of website builders are Adobe Dreamweaver, MS Publisher, Squarespace, Weebly, Wix, Xprs, Strikingly, Wordpress and Zohosties.
  • 4. Basic Web Design Principles and Elements  Web design is concept of planning, creating, updating, and maintaining websites. A good web design allows the user to understand the message, contents, and ideas in the most convenient way.
  • 5. Web Design Elements  Text- font family and type be chosen well, clear, and readable size.  Graphic/lllustrations- must be good quality and well aranged with the text other elements. Infographics may be used.  Shapes- can be used denote and enclosed boundary in the overall design.
  • 6. Web Design Principles  Portable Design – website design must be portable and accessible by users who have different browsers, operating systems, and computer platforms.  Design and Low Bandwidth- website design must be accesible at a variety of speeds.  Direction- identify the order of importance of the various elements and place them in a sequence where the eyes moves and perceives the thing it sees.
  • 8. Web Page Design Using Templates and Online WYSIWYG Platforms  Wix- is a pure WYSIWYG, free cloud- based web development platform it allows users to create HTML5 websites and mobile sites.  Weebly- is a free website builder, blog, and web-hosting service.
  • 9. Creating a Web Page  Website allows you to market and sell your products online. There are free and paid subscription online website tools that are easy to use and accesible on the Internet
  • 10. How to Create Website Using WIX  Sign Up for an Account - just like signing up for basically any other online service, getting started with WIX requires you to sign up for an account. To do this, you just enter your email address and a password or you can sign in with a Google or Facebook social account.
  • 11. Choose a Type of Website  Then you’ll need to choose the kind of website you want to start. Begin by clicking “I Need a Site For …” and then browse your options. Some of the selections most useful to small businesses might include a business website, online store or blog. But depending on the type of business you operate, you might also select “Photography,” “Restaurants,” “Accommodation” (for hotels or other similar businesses) or “Beauty & Wellness.”
  • 12. Select a Template  Once you’ve picked what type of website you want to create, you’ll be directed to a selection of different templates to choose from. You can browse from the popular templates or search for something specific. You can also search within specific categories like websites made specifically for consultants, service providers or marketers. Or you can choose from a selection of mostly blank themes and then build up from there.
  • 13. Change Your Details  When you’ve selected a template you like, WIX will take you to a preview of the design that you can edit by clicking, dragging and dropping the different elements on the page. But one of the first things you should do is update your business name, tagline and any other text elements on the page that aren’t specific to your business. To do this, just click on the text that you want to change and then you’ll see a text editor that lets you type in new text and change the size, font and other elements.
  • 14. Update Media  You’ll also have the ability to change some of the more visual elements of the site. If there are any photos included on the template, you can click on them to change them to a photo that’s more specific to your business. And you also have the ability to change the background of your page. Just click on the background option on the sidebar, and then you can choose a color or upload a photo or video to serve as the background of your website.
  • 15. Add Different Elements  Your template is really just a starting point for your new website. You can also add other elements to the page to really make the site look complete. On the sidebar, click the “add” button to bring up a list of potential page elements you can add to your site. You might choose to add things like text boxes, images, slideshows, buttons, menus, videos or shapes. When you click on one of those elements from the menu, you can see a few different options for the type of style you want to add to your site. Then you can add and move around different elements to make everything look exactly the way you want it.
  • 16. Repeat for Each Page  And once you add whatever elements you want to your homepage, don’t forget to do the same for the other pages on your site. You don’t have to add the exact same elements. You can customize each page to look exactly the way you want using the same method. Just click on the page you want to edit in the navigation bar and then add whatever elements you want on that page. Save your work and move on to edit the next page.
  • 17. Add a Blog  You can also choose which pages you want included on your website. One page that you might want to consider adding, if you didn’t choose it as your main web page, is a blog. You can add a blog to your website by adding that page element using the tools on your sidebar. Then you can manage your posts and add new content from the sidebar as well.
  • 18. Include Your Products  Also included on the sidebar is a store manager. If you have an eCommerce site or want to include any products for sale on your site, you can use this section to add the products you have to offer, along with supplementary elements like photos and prices. You can also edit things like payments, shipping and store settings from this section.
  • 19. Publish Your Site  When you’re happy with every part of your website, it’s time to publish. You can preview your site by clicking the button in the top right corner, just to make sure everything looks and works like it’s supposed to. Then just click “publish” in the top right corner and your site will go live. You can see your domain in the popup that appears. Or you can choose to connect your WIX site to your own branded domain. When you’re done, the result should be a website that effectively represents your business and that you’ll be proud to promote through social media and other channels.