Design selection demo
-
Upload
allisonbliss -
Category
Technology
-
view
143 -
download
0
Transcript of Design selection demo
![Page 1: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/1.jpg)
Choosing Your Web “Theme” or Design
What This Demo Covers:
• How the design process works: What our package provides
• Elements of the design
• Your design options
• Making decisions
![Page 2: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/2.jpg)
Web Development Overview
•Elements of a Professional Website:
Great content (text)
Great images (photos or images you have permission to use)
SEO (search engine optimization) capabilities so you can be found by
Google or other search engines
Great graphic design
Strategic marketing
![Page 3: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/3.jpg)
What Our Web Package Provides
Elements of a Professional Website:
1. We build 5 pages of the content you supply (i.e.; home, about, services/products, blog, & contact pages).
(Next slide)
![Page 4: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/4.jpg)
What Our Web Package Provides
Elements of a Professional Website:
1. We build 5 pages of the content you supply (i.e.; home, about, services/products, blog, & contact pages).
2. Once you select your design ‘theme’ we’ll install and configure that onto your domain.
(Next slide)
![Page 5: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/5.jpg)
What Our Web Package Provides
Elements of a Professional Website:
1. We build 5 pages of the content you supply (i.e.; home, about, services/products, blog, & contact pages).
2. Once you select your design ‘theme’ we’ll install and configure that onto your domain.
3. Once you select your design ‘theme’ we’ll install and configure that onto your domain.
(Next slide)
![Page 6: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/6.jpg)
What Our Web Package Provides
(Next slide)
Elements of a Professional Website:
1. We build 5 pages of the content you supply (i.e.; home, about, services/products, blog, & contact pages).
2. Once you select your design ‘theme’ we’ll install and configure that onto your domain.
3. Once you select your design ‘theme’ we’ll install and configure that onto your domain.
4. Once you collect or purchase the images you want, we’ll add those along with your text to build each of your pages.
![Page 7: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/7.jpg)
What Our Web Package Provides
5. Once pages are built, we will add a spam filter, backup protection and SEO capabilities onto your ‘theme’ (design).
(Next slide)
Elements of a Professional Website:
1. We build 5 pages of the content you supply (i.e.; home, about, services/products, blog, & contact pages).
2. Once you select your design ‘theme’ we’ll install and configure that onto your domain.
3. Once you select your design ‘theme’ we’ll install and configure that onto your domain.
4. Once you collect or purchase the images you want, we’ll add those along with your text to build each of your pages.
![Page 8: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/8.jpg)
What Our Web Package Provides
5. Once pages are built, we will add a spam filter, backup protection and SEO capabilities onto your ‘theme’ (design).
Elements of a Professional Website:
1. We build 5 pages of the content you supply (i.e.; home, about, services/products, blog, & contact pages).
2. Once you select your design ‘theme’ we’ll install and configure that onto your domain.
3. Once you select your design ‘theme’ we’ll install and configure that onto your domain.
4. Once you collect or purchase the images you want, we’ll add those along with your text to build each of your pages.
6. Once all the above is built, we’ll schedule a 1.5 hour training session with you, by phone. You’ll learn how to change all of the text or image items we’ve created for you.
![Page 9: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/9.jpg)
DESIGN ELEMENTS
Choosing Your Web “Theme” or Design
![Page 10: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/10.jpg)
Design Elements: Intro
WORDPRESSThe technical Platform we use to build your website is called ‘wordpress’. It allows you a huge range of choices and variations for this low priced web package we offer.
THEMESWordpress uses design ‘templates’ called ‘themes’. You have over 1,000 themes to choose from so you can find the elements of the design theme that work for you.
WHAT DO THEMES LOOK LIKEThe next few slides illustrate the elements of a ‘theme’. By understanding these, we’ll be able to communicate with you about the many standard choices you have and options that may cost extra to customize.
![Page 11: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/11.jpg)
Design Elements: Themes
THEMES: a ‘theme’ is comprised of the header plus navigation, page layout, sidebars and widgets. There are 1,000+ themes in many styles, colors and layouts to choose from. A few examples:
The images and colors can be changed on almost all of them.
![Page 12: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/12.jpg)
Design Elements: Page Layout
The page layout consists of the header, body, sidebar, background (in some themes, not all) and navigation.
Navigation Menu
header
background
Body text
Body image
Sidebar
![Page 13: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/13.jpg)
Design Elements: Headers
A Header is the top banner or heading in a ‘theme’. In this example it shows the website’s name over a black and green shaded background.
This is the Header
![Page 14: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/14.jpg)
Header Image:
You can choose any image to use inside this header (note: you must have permission to use the photos). Or you can choose sections of this header to fill the entire background of the header space. If you prefer a customized design for the header, the cost is additional and estimated separately. (costs usually run $2000-$5000 for custom headers). Before you opt for custom, be sure to look through all the 1,0000 themes available to you!
This is the Header
Design Elements: Headers
![Page 15: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/15.jpg)
Header Image:
Here’s another example of a header for a different theme
This is a Header
Design Elements: Headers
![Page 16: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/16.jpg)
Design Elements: Headers
Header Image:
Here’s another example of a header image used on our blog from a custom design that was already built. If you already have custom design, it can be dropped in just like this custom header was.
Header Image:
![Page 17: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/17.jpg)
Design Elements: Navigation Menu
Navigation Menus can be drop down menus (a few themes allow this) or just links to pages. Here’s a sample without a drop down menu:
Navigation Menu
![Page 18: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/18.jpg)
Design Elements: Navigation Menu
Here’s a sample Navigation Menu showing a drop down menu:
Navigation Menu
![Page 19: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/19.jpg)
Design Elements: Sidebar
Here’s a sample Sidebar Menu, which can contain various pieces of information from categories to calendars or search bars. We’ll choose which items to place in your sidebar once your content is ready.
Sidebar Menu
![Page 20: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/20.jpg)
Design Elements: Widgets
Widgets are pieces of programming code that we can add to your site to make it function better or to add features. We’ll review those choices with you once the site is built and we have recommendations for you.
This Widget example shows a feature allowing readers to share this web page on ‘twitter’
![Page 21: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/21.jpg)
Design Elements: Widgets
Widgets are chosen to back up the files on your site, to protect you with spam filters, to promote your site on social media or other needs that will be determined once the site is built.
![Page 22: Design selection demo](https://reader033.fdocuments.in/reader033/viewer/2022042614/5554da22b4c9051b6e8b4f2a/html5/thumbnails/22.jpg)
Tutorial
After your site is built, we’ll provide
you a 1.5 hr. tutorial instructing you
to make updates, add images, make
text changes and other essential
management of your website.