1

My Latest Side-project: SEO Toolbelt | Sam Underwood

 1周前 阅读数 2
以下为 快照 页面,建议前往来源网站查看,会有更好的阅读体验。
原文链接: https://www.samunderwood.co.uk/blog/seo-toolbelt/
My Latest Side-project: SEO Toolbelt

I’ve just launched a new side-project that curates the latest and greatest SEO tools called SEO Toolbelt.

seotoolbelt mockup

The SEO industry is growing. More and more innovative tools come out each year that streamline the SEO process, discover new ways to approach common SEO problems, provide better data sources or generally save SEO’s time.

I wanted to create a place that curates all of these tools so SEOs can find the best tool for what they’re looking to do.

I’ve launched early to gather feedback to see if this is something marketers find valuable. I aim to take the concept further in the future in a few ways, mainly:

  • Curated lists of what I consider the ‘best SEO tools
  • Reviews of SEO tools
  • Expanded collections of tools for some more niche areas that are currently missing
  • Custom descriptions for tools. Descriptions are largely taken from meta descriptions from the tool’s site currently

So there’s a bit of background. If you want to check it out, here it is.

I've also published it on Product Hunt below.

Keep reading if you want to learn more about the site, how it was built, and some of its features.

The site

The site is built upon WordPress, mainly to take advantage of some of the amazing plugins that are always coming out. I’m also a fan of Gutenberg and love the editor, despite some of its current pitfalls (a bit of an unpopular opinion but 🤷‍♂️)

I’ve considered a few things when building the site to make it a nice experience. Here a few highlights.

Speed

First, I wanted it to be fast.

I spent some time improving load times, focusing on Core Web Vitals; I managed to get a 100 score on mobile for lab tests, which I’m quite pleased about.

seotoolbelt pagespeed insights

Here’s a quick run-through of how I’ve achieved that.

I used a page builder to speed up the dev process, I wanted one that doesn’t bloat the frontend with code unnecessarily so went with Oxygen Builder, it’s a nice mix between a user-friendly interface and coding, which was perfect for what I wanted.

Flying Press is helping with optimising the site's front end, made by the creator of the brilliant WP Speed Matters. This plugin is one of the only speed plugins I’ve used that really focuses on how to improve Core Web Vitals. It uses all the latest ways to optimise frontend site performance, and the admin area is nice and intuitive.

For server deployment, I’m using UpCloud (it seemed to offer the best performance for the cost), and then I’m using RunCloud to manage the server.

On top of that, I’m using Cloudflare and their Automatic Platform Optimization to cache HTML pages on the edge, making the site static rather than dynamic.

Some of the AJAX requests still hit my server backend, so I’ve also implemented Redis Object Caching to speed up database queries.

Design

While I like exploring design as a side-hobby, this has been a weekends only side-project due to a busy SEO consulting schedule! This meant I really wanted to ‘shortcut’ design as much as I could.

Not that the design wasn’t important, I wanted it to look great, but I didn’t want a prolonged design process.

First, I started with a logo. I made something pretty simple, but I’m quite happy with how it turned out.

seo toolbelt banner

I may revisit this in the future, but it'll do for now so I could get something launched.

Next, it was time to dive into designing the site.

I’m a big fan of TailwindCSS. While I enjoy writing CSS, Tailwind's approach to implementing a design system using utility classes makes CSS so much easier to manage. It just makes sense.

tailwind css screenshot

Making this compatible with Oxygen Builder would have been a bit painful.

Thankfully, I found OxyMonster, which implements a Tailwind-esque system for Oxygen and various design kits to implement popular layouts quickly.

oxymonster screenshot

While I’d say I relied more on the utility classes than the design kits, it helped immensely.

I wanted to highlight each tools branding and overall feel within the SEO Toolbelt site.

The obvious way to do this was via showing logos and screenshots, which I think worked quite nicely.

seomonitor card

Again though, I had minimum time to be collecting over 200 logos and screenshotting each site.

I made use of a couple of different APIs to speed that up -- The Clearbit Logo API and the GetScreenshot API. I then linked these up to my WordPress installation using Zapier so that whenever I added a site, screenshots and logos were automatically uploaded.

Filtering

One thing I wanted users to be able to do is easily filter to find the right tool. WP Grid Builder was my tool of choice for that.

I’ve used similar tools on other WordPress sites before, but WP Grid Builder is by far the best filtering plugin I’ve used for WordPress. It’s something I’ll definitely use again in the future.

seotoolbelt filtering

As far as the filters added, I’ve added a few options to start with. You can filter by the platform (Web, Mac, Windows etc.) the monthly cost of the tool. As well as the usage options (e.g. free, subscription, free trial, freemium).

Monetisation

At the moment, the site isn’t being monetised.

I plan to monetise it with affiliate links in the future to compensate me for any time spent managing the site and reviewing tools.

I’m not planning to promote tools because they’ve paid me to do so. If a tool wants to get some referral traffic from the site, make a great tool.

Final words

Hopefully, SEO Toolbelt is a resource you’ll all find useful; regardless, it was a fun side-project to work on over a few weekends!


猜你喜欢

关于极客头条


聚合每日国内外有价值,有趣的链接。