By Sara White
GiveCamp NWA’s mission is simple: provide the tools nonprofits need to tell their story and grow their organization. To that end, we typically build websites for nonprofits.
A website consists of coded pages on the World Wide Web and is viewable to anyone who comes across it. You usually find websites using a search engine, such as Google or Bing, or you can type in the website’s name directly (otherwise known as a URL, like www.example.com).
A website is different from a nonprofit’s Facebook or LinkedIn company page, as a website is fully customizable and can contain anything you want. We often encourage nonprofits to have both and to link them to each other.
A website contains content that a web host saves on a server, accessible to the public by way of its domain name, and managed using a content management system (CMS), like WordPress.
A web host is a company that owns large physical computers called servers, on which the website’s data lives. All the site content is on this server, like pictures, copy, and even the software that takes donations.
You pay a monthly fee for the hosting service, which helps the web host maintain the website’s technology and pays for the cost of holding the site. A web host is also in charge of other aspects of a website, such as customized email addresses and other technology such as donor databases.
A domain name is the basis for your URL (Uniform Resource Locator), also known as the web address. The domain name is the main portion of the URL, like example.com versus example.com/donate.
You’ll need to update your domain name registration once a year to retain your URLs. Sometimes, the web host is in charge of the domain name registration and rolls this fee into its service charges.
A content management system (CMS) is how you edit your website. A CMS is how you upload images, style the site, and add text. The CMS is the “backend” of the website, the man behind the curtain.
Content management systems, like WordPress or Weebly, make your life easier by removing the need to code the website. With a CMS, if you need to update an event or post on your blog, it’s as easy as just a few clicks of a button.
There are a lot of terms thrown about when GiveCamp volunteers create a website that are likely not familiar to nonprofits. These terms include:
Let’s go through these.
Hypertext markup language (HTML) consists of the meat and bones of the website. It is a markup language that comprises the “what” of a website: what is an image, what is a paragraph, what is a heading, etc.
You can see a lot of this information when you search for a site. You’ll see the website’s title (e.g., GiveCamp NWA – Serving Northwest Arkansas Non Profits) and its description (e.g., GiveCamp NWA is a 501c3 nonprofit organization that focuses solely on serving other nonprofits through providing various technology tools.).
You can view the HTML of any website by right-clicking on the text and going to “View Page Source.”
HTML snippet of GiveCamp NWA’s home page
In the example above, we see a heading, a paragraph, and a bulleted list. Don’t worry, though – WordPress made all of this code automatically when we built the website. You won’t have to learn a whole new language!
If HTML is the meat and bones of a website, cascading stylesheets (CSS) are the hair, skin, and makeup of a site. This scripting language is how we make the website “pretty.”
We use CSS to manipulate the way the text appears on a website. If, for example, we want a top heading to appear bolded and in pink, we use CSS to do that. We can round the corners of buttons and put borders around images.
Again, we create the CSS using a content management system like WordPress. When we pick a WordPress theme, we generate the CSS’s main components that we then alter to suit your needs, such as your colors and logo.
CSS snippet of GiveCamp NWA’s website
In the example above, we see how we would like to style an image that we’ve designated as an emoji. We’ve given it a width, a height, and a margin and determined how it should appear on the screen.
The information architecture (IA) of a website is how we structure the content. IA includes the navigation, categories, and even the headings.
For nonprofits, we’d break down how we want to display the “high level” information about the organization. So, for example, we’d have navigation showing:
In this example, we could then add sub-categories to the navigation, such as:
With a blog, you can also add as many categories and sub-categories as you wish. For example, you may want to have posts about your recent event or to spotlight a particularly active volunteer.
The user experience (UX) of a website is how your audience interacts with the site. UX is crucial as it affects the ways people go through your website.
UX considers such things as what colors go well together, which fonts are the most readable, where the calls-to-action (CTAs) will be the most visible, how many slides should go into a slideshow, and the location of the navigation.
While you may have an idea of where things should go on your website, it is the UX designer’s job to maximize engagement with your site. UX designers are also responsible for your site’s accessibility, which is how well every visitor, including those using screenreaders, can read your site.
Accessibility is vital for search engines as well, as they are just looking at the backend of your site and not the front-facing interface. In other words, they can’t “see” your images, so having code like alt tags on every image is vital. (Alt tags are the text placeholders for images.)
Search engine optimization (SEO) measures how you “rank” on the search engine results page, such as Google or Bing. Ranking means how high up in the results list you are.
SEO is essential for nonprofits as it helps potential donors, volunteers, and those in need of your services to find you easily and quickly. Google and other search engines rely heavily on the copy of your website to rank it.
Website crawlers are bits of software that scour the internet looking at websites and deciding what information about them is most relevant. They read your metadata, such as your description, keywords, and title, to determine how to rank your site for a word or phrase.
For example, GiveCamp NWA wants to rank for search terms like “websites for nonprofits” and “Northwest Arkansas GiveCamp.” GiveCamp NWA does not want to rank for “websites for restaurants” or “GiveCamp Seattle,” so we don’t put words relevant to those terms on our site.
A website is a lot of things all bundled together to create a story about a nonprofit. Web servers host the data of the website and use a domain name to display it. Content management systems allow you to edit your site with ease.
This all may seem like a lot, but don’t worry! GiveCamp takes care of most of it, and your project manager, designer, coder, and wordsmith will take care of the rest.
Sara White is the content coordinator for SupplyPike, a Fayetteville software startup. She has a degree in computer science and ten years’ experience as a web developer. Sara has been a writer in some capacity throughout her career, creating everything from help files to knowledge bases to a supply chain wiki. Sara has volunteered at GiveCamp since 2017.