21,99 €
Create an attractive website that draws in visitors - no coding required! There's more to building a website than just picking a theme and dropping in text and images. Creating a site that attracts visitors and turns those visitors into customers requires some professional insight and a few tips and tricks. Building DIY Websites For Dummies guides non-designers through the steps of creating an attractive and effective website using today's top web-based tools. This book helps you launch or improve your website designed to boost your entrepreneurial endeavors, small business, or personal passion. With this easy-to-follow Dummies guide, you can skip learning the complicated coding that runs a site and focus on the parts that attract visitors (and search engines). Grab this book and get expert insight on how to craft a usable design, create site content, improve site findability, and convert browsers into buyers. * Discover how to select hosting services, email providers, and beginner-friendly website creators * Build your own website without needing to learn any code * Learn how to create an attractive design, develop content, and present it all in a way that will appeal to your target audience * Improve your site's search engine findability and resonate with your target customer This Dummies guide is an excellent choice for non-designers who want to create a website without hiring someone to do it for them. Learn the ropes, follow the best practices, and launch your site!
Sie lesen das E-Book in den Legimi-Apps auf:
Seitenzahl: 591
Veröffentlichungsjahr: 2024
Cover
Title Page
Copyright
Introduction
About This Book
Conventions Used in This Book
Foolish Assumptions
How This Book Is Organized
Icons Used in This Book
Beyond the Book
Where to Go from Here
Part 1: Getting Started with DIY Websites
Chapter 1: From Groundbreaking to Grand Opening: Constructing Your Website Step by Step
Setting Up Your Site for Success: Foundation, Messaging, and Search Engines
A Place for Everything and Everything in Its Place
Developing a Look and Feel that Works
Getting and Analyzing Results
Chapter 2: Laying Your Website’s Foundation
Choosing a Domain Name Registrar
Registering Your Domain Name
Understanding How Authoritative Nameservers Work
Choosing a Platform and a Host
Deciding Where to Build Your Website
Going Live with Your Staging Site
Setting Up Your Business Email
Part 2: Creating a Site That People Will Visit
Chapter 3: Resonating with Visitors
Defining Buyer Personas
Triggering Emotional Responses
Incorporating Modern Design Techniques
Selling the Why
Chapter 4: Nailing SEO Basics: Search Engine Optimization 101
Grasping Search Engine Basics
Unraveling the Essentials of Search Engine Optimization
Eating the Acronym Soup: HCU, YMYL, and E-E-A-T
Wearing the Right Hat: Black Hat versus White Hat SEO
Realizing the Importance of Backlinks
Recognizing Structured Data Opportunities
Setting Up a Primary Google Account for SEO
Chapter 5: Killing It with Keywords
Understanding Keyword Types
Choosing Keywords Based on Metrics
Researching Keywords
Part 3: Architecting Plans for Your Website
Chapter 6: A Place for Everything and Everything in Its Place
Organizing Your Sitemap
Writing Your Sitemap
Chapter 7: Content Scaffold: Supporting Your Website’s Information
Setting Up Your Service Pages
Building Support Pages for Nonprofits
Creating Pages that Every Website Needs
Populating Your Showcase Pages
Adding Blog Posts
Building Your Homepage Last
Chapter 8: Preparing Your Site’s Content
Generating and Preparing Excellent Copy
Creating and Sourcing Your Images
Understanding Image Formats and Naming Conventions
Producing Video for Your Website
Part 4: Designing and Laying Out Your Website
Chapter 9: Deconstructing the Anatomy of Web Pages
Determining Your Website Theme
Using WordPress Page Builders
Organizing Your Web Page Structure: Rows, Columns, and Modules
Laying Out Your Header Row
Creating Hero Rows for Home and Interior Pages
Building a Helpful Footer
Chapter 10: Unfurling the Canvas of Design Options
Designing Your Logo
How I Approach Design
Determining the General Settings
Choosing Fonts for a Cohesive Feel
Choosing Colors Effectively
Styling Rows, Columns, and Modules
Using Whitespace
Chapter 11: Generating Leads from Your Website
Understanding and Using Forms
Combatting Submission Spam
Integrating Forms with Other Platforms
Setting Up Calls to Action (CTAs)
Writing Stellar Landing Pages
Putting It All Together: Sales and Marketing Funnels
Part 5: Going Live and Measuring Results
Chapter 12: Optimizing Each Page for Search (On-Page Optimization)
The Goal of SEO
Getting as Many Clicks as Possible
Conversions: The Grand Finale of a Visitor’s Journey and Your SEO Efforts
Chapter 13: Ribbon-Cutting in Cyberspace: Your Website's Grand Opening
Overview of the Process
Creating Redirects and Preserving Current URLs
Going Live from a Temporary URL
Going Live from a Staging Site
Going Live When You've Been Building Live
Setting Up Your SSL Certificate
Testing Your Design, Links, Forms, and More
Finally, Your Website Is Live!
Chapter 14: Securing Your Website
Protecting Your Site with Backups
Protecting Your Website from Hackers
Dealing with a Hacked Website
Chapter 15: Keeping Up with the Joneses: Measuring What You Built and Making It Better
Setting Up Google Analytics
Using Google Analytics
Setting Up Google Search Console
Using Google Search Console
Using Heatmaps to See How People Behave on Your Website
Getting Reviews
Part 6: The Part of Tens
Chapter 16: The Ten Commandments of Building a Successful Website
Plan for Success
Understand Your Audience
Crystalize Your Message (Show Don’t Tell)
Implement SEO Best Practices
Create Amazing and Unique Content
Optimize Your Assets
Simplify, Simplify, Simplify (or Write a Short Letter)
Follow the Big Guys
Energize Lead Generation
Iterate and Improve
Chapter 17: Ten Rookie Mistakes to Avoid
Choosing Cheap Hosting
Not Installing Protection
Not Including a Powerful Hero Message
Uploading Huge Images and Unoptimized Assets
Forgetting about Title and Meta Descriptions
Using Unhelpful Content
Hosting Videos from Your Own Website
Cramming Everything Together
Using Headings Improperly
Choosing Fonts Improperly
Index
About the Author
Connect with Dummies
End User License Agreement
Chapter 1
FIGURE 1-1: An example sitemap built for a health club.
FIGURE 1-2: An expertly designed website.
FIGURE 1-3: The design elements clearly indicate that this is a site for childr...
FIGURE 1-4: The NYSE site conveys a more serious and adult aesthetic.
FIGURE 1-5: The Google Search Console returns information about how visitors vi...
Chapter 2
FIGURE 2-1: GoDaddy’s nameservers.
FIGURE 2-2: A few of the platforms you can use to create your website.
FIGURE 2-3: The WordPress setting that tells search engines not to index your w...
FIGURE 2-4: How staging sites overwrite live sites.
FIGURE 2-5: The account admin can add, delete, and edit the DNS records.
FIGURE 2-6: You need to enter these MX records so that your email works.
FIGURE 2-7: Your email host provides these settings so that you can set up Outl...
FIGURE 2-8: When you are setting up your devices to receive mail, choose IMAP s...
FIGURE 2-9: When you choose POP, the emails will have different status and diff...
Chapter 3
FIGURE 3-1: You can use this buyer persona template to create your own buyer pe...
FIGURE 3-2: You can combine elements and place them on top of or behind other e...
FIGURE 3-3: This client hired an illustrator to draw their team members as avat...
FIGURE 3-4: This is Denny from
ReportCustomer.com
. He represents a typical cust...
FIGURE 3-5: This is Rhody from
442lowe.com
. Rhody makes dumpster rentals, junk ...
FIGURE 3-6: Oversized typography can deliver a strong message when used properl...
FIGURE 3-7: Oversized typography is also great for calls to action.
FIGURE 3-8: A typographic hero is an image that fills up the background of a ro...
FIGURE 3-9: Whitespace is simply blank padding added to the top, left, right, a...
FIGURE 3-10: You can use a lot of whitespace for a dramatic look. The visitor c...
FIGURE 3-11: Set up a spreadsheet with these items in the header row.
FIGURE 3-12: The Problem in Detail column describes the problem that people hav...
FIGURE 3-13: The Benefits of Our Solution column should be short and should dir...
FIGURE 3-14: If you do this right, you can simply copy and paste this text on t...
FIGURE 3-15: These are short headlines that you can use all over your marketing...
Chapter 4
FIGURE 4-1: Link-filled pages still exist today but you rarely see them in the ...
FIGURE 4-2: The authority score given to Forbes from Moz. This is a very high n...
FIGURE 4-3: The BBC’s website has a very high authority score. If you were able...
FIGURE 4-4: If you purchase backlinks, your website might be linked from a webs...
FIGURE 4-5: When you look up a recipe on Google, sometimes the results look dif...
FIGURE 4-6: Sometimes the results in a search look different.
FIGURE 4-7: Movie results are returned in the search differently than regular s...
FIGURE 4-8: The People Also Ask section also appears for some searches.
FIGURE 4-9: Some modules come with structured data markup built in.
FIGURE 4-10: Set up a Google account by associating your professional email add...
Chapter 5
FIGURE 5-1: Google Ads Keyword Planner is a free and good way to find keywords ...
FIGURE 5-2: When you use Google Ads Keyword Planner, you can research other key...
Chapter 6
FIGURE 6-1: A sitemap (a) outlines your pages, as shown in the end product (b) ...
FIGURE 6-2: The main menu is the most important menu on your website. You can p...
FIGURE 6-3: A top menu of some websites; note that the font is smaller than the...
FIGURE 6-4: You can place your footer menu horizontally or vertically on your f...
FIGURE 6-5: Amazon is a much larger website than you are most likely building, ...
FIGURE 6-6: Set up a spreadsheet with these headings.
FIGURE 6-7: The SERP includes the title and meta description you assign to each...
FIGURE 6-8: Meta descriptions appear in the SERP for each listing.
Chapter 7
FIGURE 7-1: Including specifics about your offering is a good idea, and lists c...
FIGURE 7-2: Numbers can be very powerful in communicating your authority.
FIGURE 7-3: Adding an FAQ section to your support pages encourages trust in you...
FIGURE 7-4: Be sure to place a Donate or Support button at the top of every pag...
FIGURE 7-5: Add rows to your website to drive traffic to your donation pages. Y...
FIGURE 7-6: Add your differentiators to the About page. Visitors want to be con...
FIGURE 7-7: Featuring your team members on your About Us page can create a more...
FIGURE 7-8: Show your E-E-A-T on your About pages by placing any certifications...
FIGURE 7-9: If you have been mentioned in the press or on other websites, add t...
FIGURE 7-10: Get creative with how you show your work. You can include a visual...
FIGURE 7-11: Include a short description for each of your products, as well as ...
FIGURE 7-12: Most product pages are laid out this way by default, with photos o...
FIGURE 7-13: Use a grid layout if you host events and have several events each ...
FIGURE 7-14: Use a list view for events when you do not have a lot of events ea...
FIGURE 7-15: This view is not used often, but if you have events in different l...
FIGURE 7-16: Your event listing page should contain all pertinent information t...
FIGURE 7-17: If you set up your events with structured data, they might be pull...
FIGURE 7-18: At the bottom of each blog post, include a section that offers mor...
FIGURE 7-19: A tag cloud shows all of the tags you are using on your blog posts...
Chapter 8
FIGURE 8-1: When I searched for these words found on these websites, I saw that...
FIGURE 8-2: This company warns potential customers that they will be pasting th...
FIGURE 8-3: Enter the original source of the content in this box in the Yoast p...
FIGURE 8-4: Photographing the subject to the left or right allows you to place ...
FIGURE 8-5: When using images such as logos, make sure the image is saved as a ...
FIGURE 8-6: When you know that you will be placing a photo next to some text, y...
FIGURE 8-7: On the left, you see the client’s full logo (a). This logo is too l...
FIGURE 8-8: See the differences in these player windows. Vimeo offers a clean p...
Chapter 9
FIGURE 9-1: In the Beaver Builder editing screen, you can drag modules onto you...
FIGURE 9-2: Full-width rows stretch all the way across the browser and the cont...
FIGURE 9-3: This is a very nice layout on Williams Sonoma’s website. They chang...
FIGURE 9-4: A very nice look is to create rows down the page with 50 percent co...
FIGURE 9-5: When you have three ideas in a section, consider dividing your cont...
FIGURE 9-6: Using list modules with a catchy icon can make staid content look i...
FIGURE 9-7: Using list modules with catchy icons helps break up large chunks of...
FIGURE 9-8: Pulling out one important phrase and placing it in a row all by its...
FIGURE 9-9: This is the header row from the dummies website. This is the first ...
FIGURE 9-10: A footer is a great place for logos, social links, and menu items.
Chapter 10
FIGURE 10-1: Design inspiration can come from anywhere. Years ago a client sent...
FIGURE 10-2: In 2017 I designed this website based on the magazine spread my cl...
FIGURE 10-3: There are four main font types.
FIGURE 10-4: The Distillery Row website uses oversized typography quite well.
FIGURE 10-5: Sometimes you can see the actual font when choosing it from the pr...
FIGURE 10-6: Sometimes you can't see the font in action. In that case, visit
fo
...
FIGURE 10-7: Adding a semi-transparent overlay to your rows allows you to softe...
FIGURE 10-8: When you are using RGBA, a slider might allow you to set the trans...
FIGURE 10-9: This site uses a light gray background on every other row. This de...
FIGURE 10-10: Alternating the number of columns each row displays on your pages...
FIGURE 10-11: Get creative with styling your modules including your form module...
FIGURE 10-12: Style all of your modules so that they look interesting and displ...
FIGURE 10-13: The content in both columns is identical, but the text on the rig...
Chapter 11
FIGURE 11-1: Forms have a tab order. If you have more than one form on a page, ...
FIGURE 11-2: CTAs encourage website visitors to take action. They follow a pret...
FIGURE 11-3: You want to design a beautiful CTA that gets the point across righ...
FIGURE 11-4: CTAs can be built so they are inline or stacked. If you create an ...
FIGURE 11-5: Buttons can be designed so they are flat or transparent. Match the...
FIGURE 11-6: Landing pages typically have very few links or no links at the top...
Chapter 12
FIGURE 12-1: When formatting your text, ensure you select a heading style for y...
FIGURE 12-2: Add your keyword phrase to your headings and body copy where it ma...
FIGURE 12-3: Most listings come back in the SERP containing a favicon (1), site...
Chapter 13
FIGURE 13-1: If you had a website prior to this book and you changed any URLs o...
FIGURE 13-2: This redirect table includes a redirect loop. No one will be able ...
FIGURE 13-3: The screen where you change your DNS records looks something like ...
FIGURE 13-4: When a page is set up properly with an SSL Certificate, you will s...
FIGURE 13-5: You might see words breaking improperly in the mobile version. In ...
Chapter 14
FIGURE 14-1: Your hosting account might include the ability to easily restore y...
FIGURE 14-2: The MalCare backup software shows the stats related to your backup...
FIGURE 14-3: When a plugin has an update, you might see a notice in the WordPre...
FIGURE 14-4: You can enable automatic updates in your WordPress installation fo...
Chapter 15
FIGURE 15-1: A standard Google Analytics report.
FIGURE 15-2: If you have access to your Google Analytics account, you will see ...
FIGURE 15-3: Click the headings of Google Search Console so that all of the box...
FIGURE 15-4: To achieve your website goals, use this table in conjunction with ...
FIGURE 15-5: Once you install heat-mapping software on your website, you can se...
FIGURE 15-6: One of my clients had this menu on their website years ago.
FIGURE 15-7: After using heat-mapping software on this website, we changed the ...
FIGURE 15-8: Google sometimes pulls in “Reviews from the Web” to a Google Busin...
FIGURE 15-9: Your personalized Google review link will look something like this...
FIGURE 15-10: Once someone clicks your Google Review link, the screen will open...
FIGURE 15-11: You need to view your Google Business Profile in order to get you...
FIGURE 15-12: Try to get as many Google Reviews as possible. Grab your review l...
Cover
Table of Contents
Title Page
Copyright
Begin Reading
Index
About the Author
i
ii
1
2
3
4
5
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
299
300
301
302
303
304
305
306
307
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
329
330
331
332
333
334
335
336
337
338
339
341
342
343
344
345
346
347
348
349
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
Building DIY Websites For Dummies®
Published by: John Wiley & Sons, Inc., 111 River Street, Hoboken, NJ 07030-5774, www.wiley.com
Copyright © 2024 by John Wiley & Sons, Inc., Hoboken, New Jersey
Published simultaneously in Canada
No part of this publication may be reproduced, stored in a retrieval system or transmitted in any form or by any means, electronic, mechanical, photocopying, recording, scanning or otherwise, except as permitted under Sections 107 or 108 of the 1976 United States Copyright Act, without the prior written permission of the Publisher. Requests to the Publisher for permission should be addressed to the Permissions Department, John Wiley & Sons, Inc., 111 River Street, Hoboken, NJ 07030, (201) 748-6011, fax (201) 748-6008, or online at http://www.wiley.com/go/permissions.
Trademarks: Wiley, For Dummies, the Dummies Man logo, Dummies.com, Making Everything Easier, and related trade dress are trademarks or registered trademarks of John Wiley & Sons, Inc., and may not be used without written permission. All other trademarks are the property of their respective owners. John Wiley & Sons, Inc., is not associated with any product or vendor mentioned in this book.
LIMIT OF LIABILITY/DISCLAIMER OF WARRANTY: WHILE THE PUBLISHER AND AUTHORS HAVE USED THEIR BEST EFFORTS IN PREPARING THIS WORK, THEY MAKE NO REPRESENTATIONS OR WARRANTIES WITH RESPECT TO THE ACCURACY OR COMPLETENESS OF THE CONTENTS OF THIS WORK AND SPECIFICALLY DISCLAIM ALL WARRANTIES, INCLUDING WITHOUT LIMITATION ANY IMPLIED WARRANTIES OF MERCHANTABILITY OR FITNESS FOR A PARTICULAR PURPOSE. NO WARRANTY MAY BE CREATED OR EXTENDED BY SALES REPRESENTATIVES, WRITTEN SALES MATERIALS OR PROMOTIONAL STATEMENTS FOR THIS WORK. THE FACT THAT AN ORGANIZATION, WEBSITE, OR PRODUCT IS REFERRED TO IN THIS WORK AS A CITATION AND/OR POTENTIAL SOURCE OF FURTHER INFORMATION DOES NOT MEAN THAT THE PUBLISHER AND AUTHORS ENDORSE THE INFORMATION OR SERVICES THE ORGANIZATION, WEBSITE, OR PRODUCT MAY PROVIDE OR RECOMMENDATIONS IT MAY MAKE. THIS WORK IS SOLD WITH THE UNDERSTANDING THAT THE PUBLISHER IS NOT ENGAGED IN RENDERING PROFESSIONAL SERVICES. THE ADVICE AND STRATEGIES CONTAINED HEREIN MAY NOT BE SUITABLE FOR YOUR SITUATION. YOU SHOULD CONSULT WITH A SPECIALIST WHERE APPROPRIATE. FURTHER, READERS SHOULD BE AWARE THAT WEBSITES LISTED IN THIS WORK MAY HAVE CHANGED OR DISAPPEARED BETWEEN WHEN THIS WORK WAS WRITTEN AND WHEN IT IS READ. NEITHER THE PUBLISHER NOR AUTHORS SHALL BE LIABLE FOR ANY LOSS OF PROFIT OR ANY OTHER COMMERCIAL DAMAGES, INCLUDING BUT NOT LIMITED TO SPECIAL, INCIDENTAL, CONSEQUENTIAL, OR OTHER DAMAGES.
For general information on our other products and services, please contact our Customer Care Department within the U.S. at 877-762-2974, outside the U.S. at 317-572-3993, or fax 317-572-4002. For technical support, please visit https://hub.wiley.com/community/support/dummies
Wiley publishes in a variety of print and electronic formats and by print-on-demand. Some material included with standard print versions of this book may not be included in e-books or in print-on-demand. If this book refers to media such as a CD or DVD that is not included in the version you purchased, you may download this material at http://booksupport.wiley.com. For more information about Wiley products, visit www.wiley.com.
Library of Congress Control Number: 2024932051
ISBN 978-1-394-23298-7 (pbk); ISBN 978-1-394-23300-7 (ebk); ISBN 978-1-394-23299-4 (ebk)
Welcome to Building DIY Websites For Dummies, a book that focuses on building your own website from start to finish. It includes many secrets and best practices that web developers know and implement when building any quality website.
Throughout this book, I walk you through the steps of building a website in a way that streamlines the process and gives you the best result.
Building a quality website is not about learning how to use software. Anyone can learn to use software. Building a quality website is not about choosing a theme and uploading text and images. Anyone can take or find photos and write some text.
Building a quality website is about getting people to a thank you page, getting a phone call, an email, or a walk-in because they found your amazing website online, and they think you can solve their problem and want to engage with you. Building a quality website is also about building a website that search engines understand and want to match with Internet searchers when the search intent matches the offer of a website.
There is a lot that goes into building a website. This book teaches you how to think about your new marketing tool and take the most effective building steps in the best order possible. You discover how you can supercharge the tools and the platforms available today to build a website for your endeavor using sound best practices.
This book does not explain how to use software; anyone can learn to use software. Each web building platform also has support and documentation to help you.
This book teaches you all of the other “stuff” that web developers know about building great websites. It teaches you concepts that permanently empower you. You learn about tasks that you need to perform and learn why you are performing them. These concepts will make your digital marketing efforts better.
This book covers the thought process that goes into each step of building a website with the end in mind: more customers/visitors. Whether you end up building the site yourself or handing over the assets to a professional web developer, the skills you learn in this book will help you create websites that work!
I’ve established the following conventions to make it easier for you to navigate this book:
New terms are in
italics,
and I define them for you.
Website URLs are shown in this special font:
https://wpengine.com/
.
Bold
text highlights key words in bulleted lists and action parts in numbered lists.
In writing this book, I’ve made some assumptions about you:
You want to enhance your organization's online presence.
You want to build a website that attracts visitors and converts leads.
You are not technical or might be semi-technical, but need guidance about how websites function.
You like being empowered.
I’ve used these assumptions to help explain how to build a tool that will work for you by preselling your products or services. My philosophy is that anyone can learn to use website-building tools to get their message out and resonate with visitors This book empowers you with the knowledge to help you market your business overall, not just teach you to click here or there.
This book begins by helping you get set up. It then moves into thinking about the end users of your website: visitors and search engines. After you are in the right mindset, you will be well prepared (and hopefully excited) to get your content ready and display it with amazing results.
To make the content more accessible, I divided it into six parts:
Part 1
, “Getting Started with DIY Websites,” includes lots of ideas about getting your domain name and web building space set up. One of the most frequent questions I see online and hear from soon-to-be DIY website builders is “Which platform is the best?” This part will help you determine the answer to that question.
Part 2
, “Creating a Site That People Will Visit,” will get you in the correct mindset to create a site that attracts and converts leads. When you understand
why
you should perform particular tasks in particular ways, the task changes from a box you need to check off to a marketing strategy. Thinking this way will empower you and excite you to create something that will bring real results.
Part 3
, “Architecting Plans for Your Website,” teaches you how to organize your content, what to include on your pages, why certain content will help you more effectively, and how to prepare these assets for the best result. You learn many of the professional tips and tricks that that “regular” people do not know. These concepts are not that difficult to understand, and I give you all of this info at once in an organized fashion.
Part 4
, “Designing and Laying Out Your Website,” is the part that most of us think is where we should start when building a website. Once you have everything organized and prepared, it is so much easier to design and lay out your website, which is why this information appears in
Part 4
. This section is where the rubber meets the road. If you take the time to prepare your content and work through the other parts of the book that come before this, you will be in a much better mindset to lay out and design an attractive website.
Part 5
, “Going Live and Measuring Results,” covers all things SEO (search engine optimization), including optimizing your pages for web search, measuring your results (visits, click-throughs, forms, and so on) using Google Analytics and other tools, and securing your website from fraud, malware, and hackers.
Part 6
, “The Part of Tens,” includes the “cliff notes” to building websites. If you want to read this section first, go ahead, as it might help you think about the big picture.
In the margins of almost every page of this book, you find icons, which are there to alert you to different types of information. Here’s what they mean:
This icon saves you time and energy by explaining you a helpful method or technique for doing something.
This icon points out important information you need to know as you develop your website.
This icon points out potential problems and pitfalls to avoid, as well as positive solutions.
Feel free to skip over (and come back to) the technical information marked by this icon. However, knowledge is power, so it's wise to read them too.
This icon points out sage advice I provide from my years of experience in web design. I have made some mistakes along the way, and I provide advice so you don't have to make those same mistakes!
This icon indicates the presence of concrete examples that illustrate the topic being discussed. I give you examples of situations that have happened to me over the years.
In addition to the book content, you can find valuable free material online. We provide you with a Cheat Sheet that serves as a quick checklist, including the basic supplies you need to draw, where to find inspiration, how to identify common drawing styles, and more. Check out this book’s online Cheat Sheet by searching www.dummies.com for Building DIY Websites for Dummies Cheat Sheet.
To download the Buyer Persona Template, which you learn about in Chapter 3, go to www.dummies.com/go/buildingdiywebsitesfd.
You don’t have to go through this book in sequence, but I suggest that you do to have the best result. It is tempting to just “get some tasks done,” which may be steps that come naturally later in the process. If you don't do the steps in order, and build a sitemap first, you could very well end frustrated, with a process that takes much longer. As Benjamin Franklin said, “if you fail to plan, you plan to fail.”
However, there are some sections that you can skip:
If you have a domain name, you can skip the section on registering a domain name in
Chapter 2
.
This goes also for a platform. If you have a website up and running and you will be using the same platform to build this new site, you do not need to read the section on choosing a platform in
Chapter 2
.
The information in this book is the fastest route to the best website for growing your business or endeavor. A route to more sales, faster traction, better user experiences, and trouble-free website functionality.
The practices you learn in this book also translate to social media marketing, email marketing, and more. This book teaches you how to build an online presence. It's more than about websites; it's about your reputation online. It's about that first impression — that long-lasting relationship!
So, are you ready to get started? I’m excited for you! If you read this book and build something great, I would love for you to email me with what you built.
Part 1
IN THIS PART …
Learning the basics about creating your website from the ground up
Registering your domain registrar and setting up your business email
Chapter 1
IN THIS CHAPTER
Setting up your site for success
Considering the best platform for your needs
Designing a look and feel that works
Getting and analyzing website results
You've embarked on an incredible journey with a remarkable goal: to build an website for your business or endeavor that attracts visitors and converts leads.
You may have tried to build a website in the past, but were left feeling frustrated, angry, or even worse, you lost time and money. Well, that is all over now. I am here to walk with you through every step of the process.
I've been working with people just like you for several decades and I know what questions you have. I know where you can get stuck. I know where a non-technical person needs some help. Most importantly, I know that you want to get the job done and don't want to repeat the process later! This chapter helps you set the stage for building an excellent website and outlines the sequence of steps you'll follow to build an effective, compelling, and modern site that best represents your organization online.
Many DIY website builders worry about choosing a platform and a theme. I see it all over the Internet: “What platform should I choose?” “Which platform is the best?” “How do I choose a theme?” These are all good questions, but in the grand scheme of things, as far as your website success is concerned, the platform you use doesn't matter that much.
If you had Picasso's paintbrush, paints, and canvases, would you be able to create a masterpiece? If you had a contractor’s hammers, saws, and heavy equipment, would you be able to build a house? If you had a scalpel, anesthesia, and some cotton balls, would you be able to perform surgery?
Most likely the answer to all three is a resounding no. Having the tools doesn't mean you know how to effectively use them. The same is true when building websites. Having a web host provider, easy-to-use software, and a couple of plugins doesn't mean you can build a website that will bring in thousands of click-throughs and hundreds of orders. It's more than the tools. Building a successful website includes:
Using the right messaging.
Organizing your website so that visitors can find things with the least amount of clicks possible.
Understanding what search engines are looking for.
Creating content that is easy to understand and digest.
Laying out your content in interesting and unique ways so that visitors understand your message.
Building trust so that visitors feel comfortable handing over their email addresses or their money or their time.
Having the tools is a means to an end. The tools can't teach you the skills; they just provide a way to use skills you already have. This book will teach you the skills.
Remember that, although the platform you choose is important, equally or more important is the messaging, as well as how you provide information to search engines. You should indeed choose a platform that you can use easily. However, be sure to also consider your messaging and content, how search engines work, and how to lay out your content. This is what I teach you in this book.
Having said that, you may still want some advice about which platform to pick, so consider the pros and cons of the following platforms before you decide on one:
Wix:
Wix is known for its drag-and-drop interface, making it super easy to design your website without any technical skills. If you are a beginner, this may be a good option for you. Wix offers a wide range of templates and customization options, and it comes with hosting, templates, and design tools all in one place. In addition, Wix frequently updates its platform with new features and designs. Its ease of use comes at the cost of less control over more technical aspects of your website. That means you can run into a wall when you want to do more with your website. Also, it can get expensive. While it starts off affordable, costs can add up with additional features and apps. Like any other closed platform, if you decide to move your site from Wix, you most likely will need to rebuild your website from scratch.
Shopify:
Shopify is ideal if you are setting up an online store, as it provides powerful tools specifically for e-commerce. Shopify also offers robust security features and reliability for handling transactions, which is important, and its platform integrates with many third-party apps and services. But there are some considerations: Shopify can be expensive, especially with transaction fees and add-ons, and it is not the best choice if your primary focus is blogging.
Squarespace:
Squarespace is known for stylish and professional templates that are great for portfolios and visual presentations. Like Wix, Squarespace includes hosting, templates, and e-commerce capabilities and is user-friendly with a drag-and-drop interface. Squarespace does not have as many third-party integrations as other platforms and customization is somewhat limited compared to platforms like WordPress. While it supports e-commerce, it’s not as powerful as Shopify for online stores.
WordPress:
WordPress is a popular software for building websites. It come in two flavors —
WordPress.org
, which you download and install on your own hosting platform, and
WordPress.com
, which is a platform you log in to, much like the others. WordPress is the choice for many who are semi-technical or need to create a custom website, as it is highly customizable. WordPress offers extensive customization options with themes and plugins, and there is a huge global community offering support, plugins, and themes. WordPress is great for all types of websites, from blogs to e-commerce sites, and you have full control over your website and its data. While this all sounds great, for novices, WordPress has a learning curve. It can be overwhelming for beginners due to its complexity. WordPress also requires regular updates and maintenance, especially for security. You are the manager of the software, not the platform, like in the other options presented here. For example, you need to arrange your own hosting, which can be a technical challenge for non-technical users.
There are many others out there — this is just a small sample. Chapter 2 goes into more detail about choosing the best platform based on your needs and goals.
Setting up the mechanics of your website involves registering your domain name, choosing a platform (a place to host your website), a basic understanding of how nameservers work, setting up your email, and making sure you have a few other items in place.
The good thing is that if you have already checked some of these boxes, you can skip some of the sections in this book. For example, you may have already registered a domain name. In that case, you don't need to read the section on choosing a domain name in Chapter 2. If you are starting a new business and you have not registered a domain name, then read that section. The same goes for the platform, hosting, and email sections.
Once you get set up with the mechanics, start thinking about connecting with your audience. Your website needs to do a lot of preselling on its own. Ask yourself, “… can my website presell my products or services?"
Building a successful website starts with understanding your customer. Understanding your customers’ pain points and how to offer the solution to their problems is very important. When you understand your customers, you empathize with their wants and needs. Your website should reflect your understanding of your customers and show that you have the solution to their problems.
You want to show visitors that you understand them right away, by placing a very strong message on the homepage that talks directly to their heart. Throughout your website, you want to place content that addresses the problems that the visitor is having right now.
You might have heard that one way to create good messaging on your website is to show transformation. How will your potential customer’s life be transformed after engaging with you? Chapter 3 walks you through some exercises that help you create a website that will resonate with your potential customers.
Understanding your customer helps you with other efforts as well, such as social media marketing, social media advertising, email marketing, print advertising, and more.
This is one of my favorite sayings. When it comes to websites, this principle rings true! An organized site allows visitors to easily find whatever they need, and a sitemap is the tool for organizing a website.
A sitemap is kind of like an outline you might create for a paper you're writing. The outline ensures that the paper covers all the important points and that there is a hierarchy to the important items. Figure 1-1 shows an example sitemap that I worked on with a health club client.
FIGURE 1-1: An example sitemap built for a health club.
For your website, you need to create an outline that includes two things:
The
functionality
that you want the website to have, such as a shopping cart, forms to gather leads and for people to reach out to you, a calendar system to show your events, galleries of photos, databases for displaying content, or videos.
The
information
that you want to provide, such as services you offer, product categories you offer, content that shows your credibility and authority such as degrees, licenses, or photos, and ways to reach out to you.
When considering functionality, your website can also work for you in other ways. Some examples:
You might have some forms that clients need to fill out before they come into your office. If you move those forms online, you can decrease the amount of time that patients or customers have to spend in your office.
You might have some videos that potential customers can watch prior to coming in to your place of business. You can place those videos on your website. Then you don’t have to spend your time repeatedly explaining the basics.
You can move many administrative and repetitive tasks to your website as well. A sitemap helps you think about these issues.
When it comes to thinking about the information you want to provide, building a sitemap also gets you thinking about how can you best use your website as a tool for your business. Think about what information would be most relevant to a potential lead that would turn them into a customer. To do this, you probably want to use your website as a pre-sales tool. This means that your website should provide great information to those looking for it, and also do some of the initial screening that your salespeople would normally do when meeting with a customer. Not all customers are good for our businesses. If you can use your website to weed out the customers you don’t want before they come in contact with you, that will save you time and energy. You can do this by adding specific fields to your forms, by showing photographs of the level of service you provide, and by being clear about the services you provide.
If you’ve already built a website or you’ve just started, you understand when I say that building a website can be a lot of work — there are a lot of tasks that you need to perform and a bunch of content you need to create, not to mention design! Having those tasks organized into a list can help you focus and get things done, so it's important to create a sitemap early in the process.
The great thing about creating a sitemap early in the process is that it becomes your to-do list. This will save you so much time. Sitemaps and lists go hand-in-hand!
Creating a sitemap helps you identify the tasks you need to complete and the information you want to provide:
You need to write the content for each page.
You need to find images for each page.
You need to think about the Call to Actions (CTAs) to include on each page.
You need to think about the other information that will drive people to other parts of your website and keep them engaged.
You need to think about the keyword phrases you want to assign to each page and some basic SEO for each page.
I like thinking this way, because it breaks up a really giant project into small tasks. You can keep checking items off the list!
There are lots of online tools that you can use to create a sitemap, or you can do this exercise in Word, Notes, Pages, Google Docs, or another word processing application. In any case, start off by brainstorming all the information you think should be on your website and the functionality it should have. Then, take all this great information and organize it so that it makes sense in terms a website flow.
Chapter 6 walks you through the process of creating an amazing sitemap for your website.
Once you have the mechanics, sitemap, and content gathered and ready, it's time to think about how your website will look. You want your content to look amazing and have a modem aesthetic.
A modern website feels good to a visitor.
A modern website shows that your business is up to date with current technologies.
A modern website shows that you are willing to invest time and money in your business, and that translates to the visitor.
Visitors will know that the owner of this website is willing to invest time and money in the business and its customers.
How you lay out your content is an art, but it's not rocket science. This book helps you here. There are plenty of websites that you can look at and “borrow” ideas from. For example, Figure 1-2 shows a site that's expertly designed. Some points to note on this website:
The fonts are modern, easy to read, and are used consistently.
The colors draw visitor attention to important items instead of being distracting.
Pleasing design elements are used, such as a slanted line dividing the rows, icons and images supporting the text, and rounded corners with a slight drop shadow to lift content off the page.
The rows and columns separate content into easy-to-read sections.
There is good use of whitespace so that visitors can read and digest one section at a time.
The look and feel of your website depends on large part on the audience you want to draw to it. For example, Figure 1-3 shows pbs.kids.org, a site for children. Notice the use of icons and images and the lack of words. Clearly a site for young children. Compare this to Figure 1-4, which shows the New York Stock Exchange site. It's a serious site for adults about trading stocks and bonds. Think about how these two sites appeal to their respective audiences.
If you provide therapy solutions, you might want to design a calming and compassionate website with muted colors, engaging and emotional photos, and rounded edges. If you provide services to hip youth, you might want to design a slick website with lots of animation, strong colors, large fonts, and more points for engagement such as videos to watch.
When you create a website that looks beautiful and modern, people want to stay on your website. And when people want to stay on your website, they begin to trust you more, and when they trust you more, they are moving down the buyer’s journey and becoming a warm lead, which in turn moves the lead closer to being a customer.
FIGURE 1-2: An expertly designed website.
FIGURE 1-3: The design elements clearly indicate that this is a site for children.
Search engines measure how long visitors stay on your website. The longer people stay on your website, the better search engines view your website. Therefore, you want to lay out your content so that visitors feel comfortable and happy when they are viewing your pages. It's kind of like creating a home or a business that is very welcoming. You want visitors to virtually come in the door and sit down, snuggle up, and feel really comfy with your website.
You might end up deciding that you want to have a professional web developer lay out your website, which is fine. You still need to know and understand your audience, have an understanding of your messaging, and get your content ready. A good web developer will be happy if you come to them with all of your content well-crafted, optimized, and ready.
FIGURE 1-4: The NYSE site conveys a more serious and adult aesthetic.
If you decide to lay out your own content, Chapter 10 includes concrete tips that help you with the layout process. With the tools available nowadays, as well as other examples of beautifully laid out content, anyone can make a website that looks beautiful, appealing, and modern!
Once you have built your website and brought it live, you'll feel a huge sense of relief and accomplishment. You have completed this giant project, and you should be proud of yourself! But the process is not over.
Your website is not a project that you check off and never revisit. Think of your website as a living, breathing tool that is constantly getting potential customers through the door.
To get the best results, you need to measure your website. Just like after almost any contest that you enter, you can measure how well you performed.
At the end of the year when you are tidying up your books, you likely measure how your business performed. Did you do better compared to last year? What are your goals for next year? What changes are you going to make? Where did you have waste? Where did you excel?
At this point, you want to put software in place so that you can measure the results. You can measure so many things, such as which devices people use when they browse your website, how long people stay on your website, how far they scroll down a page, which pages are visited most frequently, where people leave your website, and more.
You can use the Google Search Console to measure results such as which search terms Google returns your website for, what position your website is returned in, and how many times people click on your listing, as shown in Figure 1-5.
FIGURE 1-5: The Google Search Console returns information about how visitors visit and use your website.
Just like your accounting due diligence, you can and must measure the success of your website. Remember that the longer people stay on your website, the better search engines view your website. Chapter 15 explains a few tools you should put into place now so that you can measure success later.
Your basic steps to building a great website are getting set up the equipment you need, thinking strategically about messaging and design, and remembering who is judging you (the search engines). This is your pathway to success!
Chapter 2
IN THIS CHAPTER
Choosing a registrar with the right stuff
Registering your domain
Considering domain privacy
Choosing a domain name and extension
Understanding how authoritative nameservers work
Setting up your business email
In this chapter, I show you how to set up the basics you need for your website. There are several steps you can take now that will save you a ton of time and frustration later on, as well as impact the final website and your business. Building a great foundation will make things easier later. This chapter covers those first steps.
Start at the beginning: choose a domain name.
A domain name is like your business address, but specifically for your website. Just like you need an address to visit someone’s business, you need a domain name to visit someone’s website. Examples of domain names include godaddy.com, wordpress.org, and speedtest.net. Domain names chains of characters plus the extension, such as .com, .net, or .org.
An URL is the combination of your domain name, plus the https:// or http:// at the beginning, and sometimes more words in front of your domain name like https://mail.yahoo.com (that's called a subdomain). In this example, the domain name is yahoo.com and the URL is https://mail.yahoo.com.
A registrar is the place where you register your domain name and claim it as yours. All registrars are accredited by an organization called ICANN, which stands for Internet Corporation for Assigned Names and Numbers. This nonprofit organization manages all of the registrars — in order to be a registrar, you must be accredited by ICANN.
Domain registrars store information about your domain name in a central database, called the registry. All domain names need to be entered into the registry in order to be recognized.
You have many registrars to choose from, and you may have heard of some. GoDaddy is a popular registrar, and Domain.com, Network Solutions, Namecheap, and BuyDomains are examples. You can also register your domain name at a hosting company such as Bluehost or HostGator. When you are choosing a registrar, consider a few things to help make your decision easier. For example, you need to know:
Registration period: Domain names are usually registered in one-year periods. Some registrars offer a minimum of one-year registration, but some start at two years.
You cannot register a domain name permanently, but you can register one for up to ten years. Check out the great information at www.icann.org/resources/pages/domain-name-renewal-expiration-faqs-2018-12-07-en, which provides answers to frequently asked questions (FAQs) for domain registrants.
Pricing:
Many registrars offer a discount on the first registration period and then after that, renewals can have a different price. Most domain names cost around $10 per year on average.
Expiration policy:
If you forget to renew your domain, or if you have your domain set to auto-renew but your credit card changes, your domain might expire without any recourse. The registrar might auction off your domain name right away or you might have a grace period. For this reason, it is good to know the registrar’s expiration policy before diving in.
Available tools:
Find out what tools the registrar provides for you to manage your domain name and whether the process for making changes is manageable. Search for reviews of the registrar you are considering (enter something like “reviews of
registrar name
” into your favorite search engine). Check for reviews about the tools and whether they are difficult to access or use.
Speed for implementing changes: If you are going to use this registrar as your nameserver (which I cover in the section “Understanding How Authoritative Nameservers Work,” later in this chapter), find out how fast changes are propagated when you make them. Try looking for reviews from other customers that indicate how quickly the registrar makes changes on their platform.
Note: Speed is important only when you are going live or making big changes, which should not be that often, but knowing whether the changes you make are propagated to the rest of the Internet quickly is a good thing.
When you register your domain name, your account must contain contacts for administrative, billing, and technical issues. These contacts will match the information of the person who registered your domain. If this is not you, you won't have control over your domain name and you will at some point run into problems with this situation. I have seen this happen many, many times.
So be sure to register your domain name in your own name. Even if someone walked you through the process of registering, your domain name needs to be under your account. You — not your web developer, a cousin, or an intern — need to own your domain name and registration. This is your business. Register it yourself so that you have these points of access to the registrar account:
A valid email address:
Make sure your registration uses an email address that you can access.
A verified password: You must know the account password, save it to a password manager, and make sure it’s accurate and working.
If someone helps you open the account and they give you the password afterward, do not just assume that it's correct. Test the login by logging in with the password you were given. Make sure that you can see your domain name and that your information appears for all of the billing, administrative, and technical contact information. By the same token, if you already have a domain name, make sure that you can log in to the account on the registrar’s website.
If you’re going to use a website builder platform like Wordpress.com, Squarespace, or Wix, they may give you the option to reserve your domain name through them in one easy process. Should you? My recommendation is that you reserve your domain name separately at a dedicated registrar company, such as GoDaddy.
The reason being that platforms like WordPress.com, Wix, and Squarespace are primarily platforms for building