As a small business owner you’re busy and probably don’t really have the time to build your own website. Luckily when it comes to website builders you have options, lots of options to design, develop and maintain your small business website.

Squarespace has a variety of beautifully designed templates to really wow your customers, Wix offers hundreds of free design templates, over 30% of all websites are built on WordPress and of course, PageCloud. PageCloud is a fantastic choice for small business owners because the learning curve is short and almost no technical capabilities are required.

PageCloud's powerful drag and drop website builder gives you everything you need to succeed online. The ability to create a professional website you control starting with one of 40+ beautiful website templates and the ability to visually edit everything from colours to fonts, and layouts.

By Nicolson Aitken. May 22nd, 2020

Full disclosure: Hi, my name is Nic. Aitken and I am the the owner and operator of Mad Geek Love but prior to that, I was the Creative Director/Product Designer at PageCloud for almost three years.

As a website designer who spends most days within the PageCloud editor and my previous life at PageCloud designing a large number of those 40+ beautiful website templates, I’ve learned a trick or two and decided it was time to share.

1. Open Graph Meta Tags
You’ve just created a new PageCloud page and now you’re ready to share it on Facebook, Google+, LinkedIn and Twitter but your thumbnail is something other than you expected or even worse, there’s no thumbnail at all.

Adding an Open Graph Image to your PageCloud page is as easy as it gets but is overlooked on most PageCloud pages and sites. Want to add an Open Graph Image to your page? It’s as easy as:

1. Open the SETTINGS tab within the ADD MENU SIDEBAR.
2. Within Page settings > General select UPLOAD IMAGE under Link preview image (Open graph).
3. Upload your image.

Facebook recommends 1200 x 630 pixels for the og:image dimension, which is an approximate aspect ratio of 1.91:1. This gives your shared post a full-size image above the post text.

And that’s it!
Okay to be fair, that’s not really it. After all Open Graph tags include:

• og:title – the title of your page as it will appear when displayed on Facebook.
• og:site_name – the name of your site.
• og:description – a brief description of the page that appears when sharing.
• og:type – the type of content such as article or blog.
• og:url – the URL (or link) that will be associated with your content.

Social media is a major driver to most websites and although Open Graph tags won’t actually affect your SEO, getting it right can have a huge impact on click-throughs and conversions. PageCloud only gives you easy access to add the image tag and auto populates the title, description and URL based on your page title, meta description and page URL but, if you want to customize any of these tags that’ll require a little more work, a little more time and yes, a little code.

2. Custom 404 page
The HTTP 404, Page Not Found, or Server Not Found error message is a Hypertext Transfer Protocol that indicates the browser was able to communicate with the server, but the server could not find the page. That’s right, you’re a small business owner not a website developer. So, let me put it this way, a 404 page is a mistake and like my Mother used to say, ‘it’s not the mistake, it’s how you handle it that matters.’It happens all the time, a user is looking for a page on your website madgeeklove.com/color or is it madgeeklove.com/colors. Then again, we’re a Canadian company with a mostly American clientele so maybe it’s madgeeklove.com/colour.

No big deal, right?
Not having a custom 404 page can be detrimental to the user experience of your website, and can reflect poorly on your search rankings.

A 404 page gives users the opportunity to remain on your website as opposed to closing the window or navigating away from your site and a good 404 page is informative and a great 404 page well, we can talk more about that later but in the meantime check out madgeeklove.com/color, madgeeklove.com/colour, madgeeklove.com/colors or madgeeklove.com/colours.

3. FAVICON
I know what you’re thinking. Well, some of you are thinking what in the world is a favicon while some of you are thinking favicons, really? So, for those of you who don’t know, a favicon is short for “favorites icon.” You know those little images on your Bookmarks bar that make it easy to identify which one is Google, Facebook or your favorite web design and development shop?

So, now you know what they are and yes, we’re really talking about favicons.

Okay now we understand that favicons are important because they make it easy for users to distinguish between websites but your logo, your colors, your content and yes, even a 16 x 16 favicon is your brand. All you have to do is take a look.

If you currently have a PageCloud site then the good news is that you already have favicon. The bad news is that if you haven’t changed it, it’s a white and purple P. Wait, there’s more good news though, changing it is relatively easy.

1. From your Sites Dashboard select the site to update.
2. Click the "Site Settings" tab along the top of the page.
3. Under "General Settings" scroll down to "Favicon".
4. Click "Upload Image".
5. Select your favicon image and click "Open".
6. Your site favicon has now been set.

4. Keyboard shortcuts
When I first started at PageCloud one of my first tasks was to build a number of websites on the PageCloud platform; a couple of them are even still around.

Thing is, when I built these first PageCloud websites there was no editor to speak of. No add menu sidebar, no palette, no anything; only keyboard shortcuts (and the DOM, but that’s for another day). Today everything you need is right there within the editor but, as you become more familiar with PageCloud the more you’ll want to use these keyboard shortcuts to perform common tasks without having to navigate to them. Here’s a list of my five favorite keyboard shortcuts:

1. [M, M] Switch to mobile mode and [D, M] switch back to desktop mode.
2. [A, T] Align top, [A, B] align bottom, [A, L] align left and [A, R] align right.
3. [D, H] Distribute horizontally and [D, V] distribute vertically.
4. [A, F] Add a new Google font.
5. [M, F] Move forward and [M, B] move back

 
An Honourable mention goes out to [F, A, V] The ability to add a favicon which has been deprecated by PageCloud and I miss it.

5. Mobile Mode
Well, here’s where things may get a little awkward.

Prior to joining PageCloud, Mad Geek Love primarily built custom WordPress sites. When my old friend, former band mate and ex-boss reached out to pitch PageCloud to us I was blown away with the functionality, the ease with which creators could create and just how cool it was. I’m not going to lie, there was a lot of profanity in that first meeting. “F, A, V adds a favicon? Holy shit that’s cool.” I told you I missed it and yes, that really happened.

“It’s responsive, right?” And that’s where the coolness ended.

From the beginning PageCloud has been adaptive as opposed to responsive. Put simply, responsive is fluid and adapts to the size of the screen no matter what the device. Whereas adaptive design, uses static layouts based on breakpoints which don't respond once they're initially loaded. Long story short, I wasn’t very happy about it and neither were most clients.

All that being said, the debate between adaptive versus responsive is about to become mute as PageCloud has started rolling out responsive sections. Kudos, thank you and to be honest, it’s about time.

Despite the good news, things are not perfect when it comes to designing mobile pages within PageCloud. There are some bugs, some issues, things don’t always appear exactly as they should be.

Okay, so where's the Pro Tip? The title is Five tips for a Better PageCloud site not Four tips for a Better PageCloud site and one complaint about mobile mode. After all that's a terrible name so here it goes; tip number five. Whenever you make a change on your website, any change, remember to check the mobile version and then check the actual site on your mobile device. I know, it's not rocket science but checking and re-checking can make a world of difference.

It's Not a Blog.