The Bottom Part on Webpage Again

Parts Of A Website: A Cheat Sheet For Non-Techies
Confused past website terminology?

If so, here's a handy glossary (all in obviously English) that'll quickly go you up to speed and demystify the linguistic communication of web technology.

Once you lot sympathise basic website jargon, y'all'll never get intimidated or addled the side by side time a spider web designer or programmer spews techno-babble.

Bones Anatomy Of A Website

Permit'due south outset by defining the various parts of a website:

Header

This is the top part of a website containing the logo and usually (but not always) the site'southward navigation carte du jour. The header is the zone at the top of the page that stays constant and visible equally visitors click around your site.

Once upon a time the header was a place to display a banner or graphic promoting your brand — kind of similar the cover photo on a Facebook page. Merely today's websites are more streamlined and the trend is to simply include your logo and navigation in the header.

Website Header Example

Navigation (aka Navigation Bar or Main Menu)

These are the links at the peak of the page to help you find what yous're looking for. The navigation links are commonly in the header or but below it.

Website Navigation Example

When a site is viewed on a mobile device, the navigation usually morphs into an icon with 3 stacked lines (aka a "hamburger" because it looks similar the side view of a hamburger) since space is limited on a mobile device. Tapping the mobile navigation icon usually triggers a vertical or horizontal toggle menu.

Mobile Menu Example

On complex sites with tons of pages, y'all'll sometimes see a "mega menu" which is a drop-down menu triggered by hovering over a link in the main navigation. The drop-downward mega menu then shows you many links organized into categories and sub-categories, kind of like a sitemap.

Mega Menu Example

Feature Image (aka Hero Prototype)

This is the large image yous encounter at the top of a spider web page that grabs your attention and sets the tone for the rest of the page. Feature images typically bridge the full width of the folio and oftentimes contain headlines or calls to activeness.

I'1000 non exactly sure where the term "hero image" originated, but it's used frequently. Maybe because they want y'all to feel their website is going to solve all your problems and save the mean solar day. 🙂

Hero Image Example

Slider

A slider is used to display pictures … like a slideshow … where the images slide from right to left or vice-versa. Sliders can appear anywhere on a website, but they're commonly used on homepages in place of (or in addition to) a feature epitome.

As websites evolve and more than emphasis is placed on page load speed as well as optimizing user experiences on mobile devices, slider use is diminishing because they're resource hogs and are often little more than eye-candy.

Website Slider Example

Website Content

Website content is the information your visitors consume. Web copy or body re-create refers to written text. Website content refers to all the elements used to communicate your message — text, images, video, audio, the whole shebang.

Website Content Example

Sidebar

A sidebar is the narrow vertical column right next to your website content. The sidebar frequently contains advertisements, links to other content, calls to activeness or a search box. Think of the sidebar equally secondary to your principal website content.

In the past few years, there'southward been a trend in website blueprint to eliminate the sidebar altogether and just go with a single, total-width column to display your content. For some sites, eliminating the sidebar makes sense, for others it does not. It really comes down to personal preference and/or which layout (sidebar vs. no sidebar) provides a meliorate user experience or college conversion rate.

Website Sidebar Example

Footer

A footer performs the aforementioned part as the header — information technology'due south a region on a website that's constant from page to page — except a footer is at the lesser of a page instead of the peak.

You tin can put whatsoever you want in a footer. But what'due south oft in the footer is contact info, privacy policy, terms of employ, sitemap, social media icons and links to other important pages on your site.

Website Footer Example

Landing Page

When you lot run ads on Google or Facebook (or anywhere) you take to provide a destination page for the person toland on when they click the advertisement — hence, the name landing page.

Landing pages are a niggling different than other pages on a website in that whatsoever distractions, such as a header or footer or sidebar, are removed or minimized.

The primary goal of a landing folio is getting the visitor to take an action (i.eastward. download a report, sign upwards for an e-mail listing, make a purchase, etc) and maximize conversions. You desire the content on a landing page to be as laser-focused as possible.

Dwelling house Page (or Homepage)

Also known as the front page or master page. This is the starting point on most websites. A website pattern all-time practice is to link your logo to your dwelling folio, giving your visitors an "escape" or "reset" if they always get lost on your site.

Blog

A blog is really a type of website.

Then what'due south the difference betwixt a blog and a website? Not much. It basically boils downwards to how the content is structured and presented.

  • When yous publish something on a weblog it's called apost and blog posts are published in chronological social club like periodical entries in a diary. The origin of the word "blog" is a wrinkle of blog.
  • When you publish something on a website it's chosen apage and web pages are not presented sequentially. They're just a collection pages (i.e. homepage, about us page, contact page, etc) that are linked together.
  • Web log posts let for interactivity with readers via comments. Standard spider web pages don't accept a commenting section.
  • Web pages are commonly informational in nature about a company'south products or services. They tend to apply a flake more formal and official sounding language. Web log posts have a more casual and conversational tone.

A blog tin be a standalone website or it can exist a section of a larger website.

What you are reading right now is a weblog post on a blog which is function of a larger website.

Call To Action (aka CTA)

Buttons, popups, ribbons, slide-ins, email optin boxes … even a uncomplicated text link … are all examples of calls to action. A call to activity is a specific and direct asking asking your visitor to do something.

A phone call to action doesn't need to exist ambitious or obnoxious. A simple "click here" oft works just fine.

If you want readers to take activeness, yous need to gently nudge them along.

Card Pattern (aka Tile Design or Grid-Based Pattern)

Inspired by sites like Pinterest, carte pattern helps y'all organize (and sort) content visually by chunking your information into a grid. Card design is visually appealing, easy to read and mobile-friendly.

Yous tin utilise card design for lots of things such as epitome galleries, blog pages or showcasing features/benefits on a sales page. The sky's the limit. All you need is a little inventiveness.

Website Card Design Example

Boosted Terminology Of Modern Websites

WordPress

WordPress powers millions of websites worldwide.

Call back of WordPress as the operating arrangement of your website … kind of like the operating organization of a laptop is Windows, for a MacBook Pro it's macOS and for an iPhone it'due south iOS.

WordPress is a content management system (CMS) which allows you lot to add together, remove or update content on your website without high level technical preparation.

A WordPress theme makes WordPress await like a website. At that place are thousands of themes available — some gratuitous, some paid. Most WordPress themes require some customization to get them to match your company'due south make. Simply using a theme is Style ameliorate than starting from scratch like we had to do in the olden days (early on to mid 2000s). WordPress themes are one of the principal reasons yous can build a custom, high-quality website for a fraction of what websites used to toll.

A WordPressplugin gives your site functionality. Plugins are like apps on your telephone and there are tens of thousands of WordPress plugins to choose from. There are plugins for contact forms, prototype galleries, site security, online shopping carts — pretty much anything y'all can think of.

WordPress Folio vs. WordPress Postal service

This takes a bit of explaining, so I wrote a whole article on this topic which you can discover here.

Hosting

To have a website the net, it needs to be hosted on a web server. Kind of similar if yous want to build a house, y'all demand a slice of state to build your firm on. Examples of website hosting providers are HostGator and WP Engine.

Domain Name (aka URL)

Amazon.com, CNN.com and markbrinker.com are all examples of domain names. Behind the scenes, every website is identified past an IP address which is a long string of numbers like 143.398.884.342. But who can remember all those digits? Therefore, a domain name is linked to each IP address because it's easier to use words instead of numbers to identify a website.

Fun fact: URL is an acronym for Uniform Resource Locator.

Domain Registrar

Just like you get the license plate for your car from the Department of Motor Vehicles, you lot go your domain proper noun from a domain registrar. There are numerous domain registrars online. We use NameCheap.com.

DNS

DNS is an acronym for domain name server. They're the phone book of the internet.

Equally mentioned above, human being beings use domain names to draw websites rather than using IP addresses. When you type a domain proper name into a web browser, your isp accesses one of many domain name servers located around the world to quickly lookup the respective IP address associated with the domain name, then routes you to the website you requested.

HTML

HTML is an acronym for hypertext markup linguistic communication, and information technology's the standard language for creating websites and spider web pages. It was invented by Tim Berners-Lee (known equally the inventor of the www) in 1991.

CSS

CSS is an acronym for cascading fashion sheets. HTML is used to create web pages, CSS makes them wait pretty. CSS as well controls how a website looks on a desktop vs. a tablet vs. a phone.

Website Builder (aka Website Page Builder)

Upward until a few years ago, you had to know HTML and CSS to create a nice-looking website. But now, with a drag-and-drop website builder yous can build a website with minimal technical knowledge.

Website builders allow you lot to create web pages much quicker than via manual coding and the finished product usually looks better as well. Our favorite website builder is Thrive Architect.

NOTE: Although a good website architect is a great tool, information technology's not a panacea. You *are* going to need a basic understanding of HTML and CSS to fine tune things on your site. Sad to rain on the parade. 😮

Mobile Responsive

If a website is mobile responsive, it uses CSS torespond to the size of the viewing screen then readers have a pleasant user feel on their mobile device. That means font sizes are bigger plus the page layout and navigation are transformed so they're usable on a mobile device.

If y'all take to compression and zoom to brand annihilation readable, that is by definition not mobile friendly.

Google agrees with me.

SSL

SSL stands for secure socket layer. An SSL certificate encrypts information sent from a web server to your browser then hackers can't read it.

If you see a little padlock in the accost bar of your web browser, that means you're visiting a secure website.

A non-secure website has a URL that begins with "http" in the accost bar, whereas a secure website begins with "https" — with the "s" continuing for "secure".

http => hyper text transfer protocol

https => hyper text transfer protocolsecure

SEO

SEO stands for search engine optimization. SEO is a big and complex topic, but in a nutshell it's well-nigh configuring your website to get free traffic from search engine results pages (SERPs).

Based on my conversations with clients and prospective clients, there is massive confusion most what SEO is and how it works — non to mention wildly unrealistic expectations.

In order to go ranked in the organic search engine listings, y'all demand to produce content that:

  • Is super loftier quality.
  • People actually want.
  • People share or link to.
  • Is properly formatted on your website (aka On-Page SEO).

For more info on SEO and what information technology takes to get free traffic from search engines, I highly recommend you check out the work of Brian Dean.

Google Analytics

Google Analytics is a free service from Google that gives you statistics about your website — how many visitors your site is getting, which pages they're viewing, how long they're spending on each folio, etc.

To utilize Google Analytics, all you do is install a small tracking script on your website and you're adept to go.

Google Analytics removes the guesswork by giving you data on what's working on your website and what isn't.

Email Service Provider (ESP)

An email service provider (aka EMS: e-mail management service) helps you build, manage and communicate with your list of email subscribers.

A few examples of popular email service providers include MailChimp, Aweber (we use Aweber), Constant Contact, ConvertKit, GetResponse and ActiveCampaign.

There are several reasons for using an email service provider:

  • Automation. Users are able to add or remove themselves from your list automatically. You can also send emails automatically based on a user'southward actions.
  • Scalability. Yous can send a broadcast bulletin to hundreds or thousands of your subscribers with the click of a mouse. Information technology's next to impossible to do this manually.
  • Deliverability. Well-nigh e-mail service providers are whitelisted and then your emails don't become flagged as spam. If y'all tried to send more than than a few dozen emails in rapid burn succession using Outlook or Gmail, it would most likely trigger a spam filter with your ISP and your emails wouldn't get sent.
  • Compliance. Stay compliant with the CAN-SPAM Human action and avoid penalties.
  • Reporting & Tracking. Observe out what percent of people opened your email, how many people clicked on a link in your email, which email discipline line performed the best, etc.

Decision

Hopefully you found this mini crash class on website terminology helpful.

Yous don't need to understand the underlying technology to talk intelligently with a web designer or developer. Yous just need to have a basic grasp of the linguistic communication of spider web technology and you'll be fine.

I'll be calculation to this handy dandy website glossary over time. If there'southward a term I disregarded that needs to be added, please let me know in the comments below. Thanks. 😉

ortegainden1981.blogspot.com

Source: https://www.markbrinker.com/parts-of-a-website

0 Response to "The Bottom Part on Webpage Again"

Postar um comentário

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel