Est. 2020

How to Build a Digital Portfolio!

*This post may contain affiliate links. Affiliate links are links to external websites that provide monetary value to me if you decide to purchase a product on their website. This is at no extra cost to you. For more information, please see the Affiliate Disclosure and the Privacy Policy

Whenever you decide to build a website, there are a lot of things you need to know about like website hosting, content management software, and search engine optimization (SEO). 

Also, you need to have an eye for detail. 

People who visit your site are looking for an experience, not just a blog. So, you need to use a clean template, good photographs, and an easy-to-use interface. 

With all of these things to remember, launching your first website can be challenging and intimidating (and I haven’t even begun to talk about post-launch). So, what do you need to know?

My Early Website Experience 

My experience with web design has an interesting story. 

Originally, I started this blog with the free version of WordPress.com.

I had no idea what I was doing when it came to anything about the blogging industry, and WordPress provided a free platform while I learned about website ownership. 

At first, the hosting on WordPress.com was really good. I lacked basic skills, knew little about design, and didn’t feel comfortable with the idea of self-hosting. 

WordPress made it easy to start the website, and I launched the first edition within a few hours. 

As I continued along with WordPress.com, I began to realize the limitations their platform offered. 

The first limitation was storage, as they severely limited me to about 5GB of media. This wouldn’t be a problem, as you shouldn’t be loading pictures onto your website that are greater than 500 KB anyway. 

However, with WordPress.com, you had to optimize your content before you uploaded it. 

This brings me to issue #2 with WordPress.com: the hosting on WordPress never “felt” like my site. 

WordPress.com has some really good features, and their website servers are fast and secure. They even provide daily back-ups through their Jetpack plug-in. 

But in the effort of security, WordPress.com restricts the ability for full-site editing. 

I like to have control over most things in my life (serious character flaw), but hosting on WordPress wouldn’t let me do that. 

The inability to choose my theme was the first issue, AND they did not let me install any plug-ins. 

Pro-Tip: What is a Plug-in?

A plug-in is a service or software created that enhances your website. WordPress.org (which is open-source and what this website uses) has thousands of plug-ins ranging from simple things like contact forms to high-performance security. 

The goal of a plug-in is to minimize the time YOU spend writing code. They can be free, paid, or freemium (free and paid). However, the best plug-ins typically cost a bit of money. Cost can be a deterrent, but paid software typically has less bloat (extra code) on your website.

Personally, I use both free and paid plug-ins. 

But like I said, this inability to add plug-ins was *the reason I decided to switch to self-hosted services. 

My Plugins

If you only do a little bit of research about web design and blogging, you will quickly realize there are integral parts. Simple things like website speed (for which I use WP Rocket & ShortPixel) and proper SEO format (Rankmath) are important for any new websites. 

Because of this, I spent a lot of time researching and studying various other website reviews and performance tips. (I also watched A LOT of YouTube.)

A couple of months before the re-launch of this site, I also had the opportunity to take control of another website for a while. During this time, I tested plug-ins and efficiency. 

From these two experiences, I decided to use the following software and plug-ins on my site. 

  • Elementor Pro

I cannot code. I’ve tried many times, and I have many friends that can. 

Because I knew this, I was limited to a few options for a drag-and-drop website editor.

I had three options: Beaver Builder, Divi, and Elementor. 

I never had the opportunity to test Beaver Builder, as the software lacked some core features and widgets which I wanted for this site. 

But I did use Divi on the other website I mentioned earlier. 

Divi, in opinion, is very powerful, but it was also a little complex. 

Divi (by Elegant Themes) provides an awesome theme, great software, and is a good price if you decide to purchase a life-time membership to all of its offerings. 

But I knew after testing the free version of Elementor, however, that this software was my favorite.

The layout is simple.

Here is what this looks like from my side. 

Elementor Display

Elementor Display

As you can see, this software is drag and drop. To add a widget, you drag and drop your chosen widget to the + . 

That’s how you use Elementor, yes, seriously. 

(Please note: I use the Hello theme. It is a blank-canvas theme that is free to download.)

Simplicity aside, my absolute favorite feature about Elementor is the ability to see how my website looks on mobile devices. 

Elementor Mobile Display

Mobile users are important when it comes to website design, and even Google agrees. Since 2019, Google has prioritized mobile-first indexing. This means in order to rank on Google, you need to stay focused on the interface for mobile (cell phone) users. 

Despite my love for Elementor, there are a few small complaints. 

The first is a lack of analytics.

Look, I’m not expecting analytics on every page. Elementor is a design plug-in, not an analytical one. 

I just think novice website designers and bloggers would appreciate A/B testing for pop-ups. 

This way we could just see the efficiency of our marketing campaigns. 

The only other downfall to building a website using a page builder is the bloat. 

Page Builders can create highly inefficient code, especially when it comes to JavaScript actions. 

This extra code can hurt the performance of any website, which in turn affects the number of users that visit the site. 

That being said, if the code is optimized (more on this in the WP Rocket section), the extra code won’t be too bad. 

One other thing about my use of Elementor: I have purchase the Pro version of Elementor.

For some people who are designing simple sites, the free version *might be enough, but probably not. 

There are so many widgets like the Call to Action and Recent Posts that are integral to any website. The creators of Elementor are also continuously adding new features to the pro-only section like the landing page builder and my personal favorite, the pop-up builder.

For only $49 per year, I think Elementor Pro is worth it for any new website designer. 

  • WP Rocket

 

In case you didn’t know, your website speed matters (a lot). 

What would happen if this website took six seconds to load? If that happened to me, I would leave and find a new source of information. 

Website speed is integral because it involves an experience. My goal for your experience on this site is a quick, organized, and efficient site that helps you, the reader, prepare for your next trip through gear reviews and travel tips. (Hmm… maybe that should be my mission statement?)

Creating a better experience translates to more readers and higher indexing. 

To make this website faster, I used the plug-in WP Rocket. 

WP Rocket is a performance (speed) based plug-in. It accomplishes its mission in different ways like optimizing code, turning on lazy-load for your images, and caching.

So, what does that mean.

The way WP Rocket optimizes your code is by minimizing CSS and JavaScript. Do you remember what I said about page builders and bloat? This helps with that problem 

Lazy load waits to load the scripts for your videos and photos before the reader arrives to that spot. Lazy loading your images and videos creates a great first impression, as it reduces your initial load time. 

Caching is the ability to save certain features on the site within your web browser. This way, the code is not re-loaded every time. For my site, this includes things like the header you see on top. You can set the cache from minutes to days, and I have mine set for 10 hours. 

Alright, all of this information is great, but I would want proof of this information too. 

So, here is my site score using Google Page Insights with WP Rocket disabled. 

Without WP Rocket

Website without WP Rocket

With WP Rocket

World Embark with WP Rocket 1

As you can see by the metrics above, WP Rocket cut my mobile website speed by roughly 75%. 

As for desktop, the entire page loaded under three seconds with WP Rocket enabled. 

Without WP Rocket on, my website loaded in about six seconds on my desktop. 

Now, my welcome page contains a lot of pictures, which means a lot slower web page. But my other individual blog pages typically load within 2 seconds. I focus on these especially as they matter to Search Engine Optimization. 

WP Rocket retails for $49, and it does not have a free option. But for website owners, it’s worth it. 10/10

  • Rankmath

 

Since I mentioned SEO above, I’m going to mention RankMath here. 

SEO is the ability to rank for keywords on search engines AND the process of creating a site that is easy for the Google spiders to crawl your site. (It does so using the XML sitemaps.)

If you are even thinking about building a website, you need to know the basics about SEO. But what SEO comes down to is proper format and writing for your audience. 

But again, why does SEO matter in website creation?

The internet is a saturated place, and it isn’t stopping. There are over 1.8 BILLION websites with over 200 million of them active. 

Because of this, you need to be competitive and SEO is a way to do that. 

The disappointing thing about SEO is there is no magical formula to rank higher.

Search Engines use secret algorithms, that if I had to guess, utilize artificial intelligence that constantly changes.

Even though we (as in website owners) may not know the algorithim, we do know a few things.   

The first thing we know is length matters. That’s why you won’t see any post on this website that is less than 1,000 words. (This post is 1,700 words right here…) 

The second thing we know about SEO is write for your audience, not for the bots. Look, keyword stuffing was great in 2006. It isn’t anymore. 

Finally, the third and arguably most important part of SEO is proper format. 

The way computers crawl your site is via XML sitemaps. But if you don’t tell the spider the proper format for your website, it may think your title is a secondary header.

Or if you don’t put alt text for your images, the images will never show up on the search engines. 

Because of this, you need something to hold you (the writer) accountable when you build a website. This is where RankMath comes in. 

RankMath is a checklist for some basic SEO format. It allows you to change your SEO title, check word count, fix broken URLs (404 Errors), and so much more. 

For most people, this will be a God-send to their writing and website structure. 

RankMath has both simple and advanced set-ups, and both paid and free platforms.

Really, there is no reason to not have Rankmath or some SEO plug-in on your website. 

Another reason I use RankMath? It integrates directly into my Elementor screen. This means I never have to leave the Elementor screen!

  • Elementor Essential Add-Ons

 

I utilize one specific feature of Elementor Essential Add-Ons on my website design, Instagram integration. You can see this plug-in at the bottom of the home page here

The Elementor Essential Add-Ons does have some cool features like hot-spots and slide-images, but I don’t find myself using these at all. They look interesting, but provide no functional value for my mobile users. 

That being said, this software does just show up on my Elementor tab, so there are no extra steps to find the extra widgets. 

One cool feature about this plug-in is the ability to turn-off widgets you need!

This further reduces your website’s loading speed. (Are you starting to notice a trend?)

  • ShortPixel

 

Alright, this is getting annoying. But site speed matters. 

I like taking good photographs for the travel section of World Embark, but my Fuji X-T4 takes really big pictures. 

When I mean really big, I mean 50 MB big. That is literally 5% of 1 GB. To put that in perspective, the average picture I have on World Embark is about .002 % of that 50 MB size. 

There is no need to place pictures that are even 1MB on your website, as this can severely slow-down your site. 

The ability to compress your images doesn’t just reduce load time, but it also helps with the storage on your website server. This actually *could reduce your cost if you pay for the storage you use. (Platforms like AWS and Google Cloud are prime examples of this.)

Alright, so seeing is believing. Here is what I am talking about. 

Click Here to Install ShortPixel!

As you can see from above, ShortPixel has saved me about 30 MB on my web server. AND the average image compression rate is about 80%. 

There are three different options for ShortPixel image optimization: Lossy,Glossy, and Lossless. 

I personally use lossy as it maintains the image quality of the photo and significantly reduces the file size. 

Now, my compression of file size does not just happen within WordPress itself, but also in external image software. (More on Lightroom and Capture One below.)

  • Other Plug-ins

 

For the sake of time and brevity, I won’t include many other descriptions of the plug-ins I use on my WordPress site. But there are a few things you should consider. 

The first thing is website security. Whether you like it or not, website security is extremely important.

No, the likelihood of somebody continuously attempting to log-in to your WordPress account (called a brute-force attack) is not very high. (Please don’t try.)

When it comes to website security, the biggest issue is spam bots. Spam bots create both a high bounce rate which hurts your rankings. 

Spam bots, if directed, can also perform a DDoS attack. This could actually crash your website. 

Despite everything I just said, the worst part of spam bots is when you think you are getting readers, but you actually aren’t. 

There are a lot of things about website security you might need to know. (Also, there are a lot of security issues if you collect any form of payment.)

But one of the worst parts about your website being hacked is the hard penalty to your indexing. Search Engines (Google, Bing) will highly penalize sites that have been hacked. 

Now, you might have the best website firewall, but I wan’t to tell you something. No site (private or personal) is un-hackable. 

This can really frustrate some users, but it’s the truth. 

Knowing that, there is only one thing you can do to prepare, back-up files. 

Pro-Tip: What is a back-up?

A back-up is a restoration point of your website. Another definition is a back-up is a copy of all your files, posts, and images that you either uploaded or saved to your website. 

Back-ups are extremely important, as they provide a secondary return point in the case of catastrophic failure. 

An important feature to remember is to save your back-up off-site, where it is easily accessible to you and select people. This external space should also have a vastly different and difficult password to access, just in case. 

Other Software

  • Google Workspace

 

Formerly known as the G-Suite, Google Workspace is Google’s productivity and collaboration software. 

It is similar to Microsoft Office’s 365 applications, as the system is entirely based in the cloud. However, I would argue that the Google Workspace has a more powerful cloud-based software than Microsoft. Hands-down, Microsoft wins on the desktop, but Google actually has more features and is less clunky than Microsoft. 

I have a few primary uses for using Google, e-mail and Google Docs. 

Google Docs is integral to my work-flow as a writer. I write my articles in Google Docs, then I edit them as I move the article to this website. 

However, the true power of Google Docs is the real-time saving feature. By saving in the cloud, I essentially have a back-up of all my writing.

If Google Cloud was to fail, my personal back-ups would be the least of my concerns….

As I mentioned earlier, I also use Google Workspace for my personal work e-mail account. It is way easier to have an e-mail account that is external than one connected to my web host. 

  • MailerLite
 
E-mail marketing is one of the most important parts of creating an online business. 
 
E-mail shows you (the reader) received something valuable from the website you visited, and you would like to know more about that site. 

 

Why do you need an e-mail list? 

An e-mail list is another referral method for your website. (Almost like a personal search engine!)

Think about this: If people were not interested in your product, they wouldn’t sign up and follow via e-mail.

A marketing book I read suggested having at least 5 different marketing strategies for your website, and e-mail marketing can be one!

So, why did I choose MailerLite over competitors like MailChimp? 

It comes back to the features MailerLite offers. This includes A/B testing, automated e-mails, and the ability to clean-up e-mail accounts. 

Cleaning-up emails means I no longer send you an e-mail if the e-mail is not opened for six months. This way, I maintain a high deliverability rate into inboxes. 

Get a $20 credit when you sign-up for a free MailerLite account! 

Mailerlite is also less expensive than their direct competitors, especially as you move into the upper-level tiers. But if you have less than 1,000 e-mail followers, the platform is actually free! 

MailerLite has has a great blog that features tips and strategies for e-mail marketing. 

  • Google Analytics

 

Alright, everyone has heard of Google.

I use Google Analytics to measure what blog articles are the most popular and to make sure that my website is functioning properly. 

The other reason I use Google Analytics is to see if people are visiting on mobile or desktop devices. This helps me, as I want this site to be easy to use for YOU. 

  • Bluehost

 

Alright, so Bluehost is actually both a hardware and software company. I’m including it here for brevity. 

I don’t plan on staying on BlueHost servers for too long, but it is cheap, shared hosting. For some plans, it is even less than $3 per month, and it has a free URL in the first year!

In the future, I plan on comparing Bluehost, Kinsta, WordPress.com, and Siteground in a review. 

  • Photo Editing

 

This is actually one I am still experimenting with. I am down to two options, Capture One and Adobe Lightroom/Photoshop. 

Since I use a Fuji X-Series Camera, it has a different sensor than the “typical” Bayer sensor in most Canon cameras and Nikon cameras. 

Right now, I am leaning towards Lightroom and here is why: Capture One is really expensive and forces me to pick a platform for $9.99 per month. Meanwhile, Adobe Lightroom/Photoshop allows me to process other RAW files and X-Trans files for 9.99 per month 

There is also more adoption in the Adobe platform worldwide, as the software is considered to be a legacy product. 

In conclusion

Wow, that was a lot of writing. (Took me about 6 hours to write and optimize!)

But here is the deal, when it comes to website design, you have the freedom to choose what you use. 

You get to choose your CMS, theme, plug-ins, and other software which makes the website YOURS!

So, don’t be afraid to experiment. And if you are afraid to experiment on your live site (who isn’t), most web hosts have staging sites where you can see if something will “break” your site. 

Website design is going to take some time to optimize, and it very much is a labor of love, but you got this! 

Good Luck!!!