Cyberula Blog Review

cyber_ula submitted their blog cyberula.com for review on a Twitter post I made.

Great posts layout and thumbnail images

My first impression was that the posts list was very good looking, there’s also the fact that all of them use thumbnail images that contribute to the aesthetics. Very well chosen.

big

Fully Responsive 📱

big

Weird nav behaviour on mobile

The only weird thing that happens is that the top navbar centers the programming tag and it’s not really aligned with the Twitter icon.

Comment section

It has a per post comment section. I believe it’s a really good addition to the blog. It’s made with wordpress to it’s fast to deploy and really adds a lot of value.

Search

The search functionality works as expected. It’s responsive and gives the correct results.

Meta tags

This blog has a really good of meta tags. It has the Open Graph meta tags and the twitter:card meta tags. Very complete in that matter

big

Great content

The post that was the reason I noticed this blog was about how #100DaysOfCode change their life. And I happened to binge watch all the other related content. It’s actually really valuable and I would love to keep seeing more of it.

PageSpeed results

Desktop

PageSpeed was actually pretty good for this blog on desktop sites

big

Mobile

However, PageSpeed was not as forgiving on mobile. I really wouldn’t know the reason but it might be something to check out.

big

Oportunities for improvement

Syntax highlight

If there’s the opportunity of addign syntax highlighting to the blog it would really make code blocks stand out and make it easier to read. It’s easier to identify the functions and variables so that can get a better idea of what’s going on at first glance.

From this

To something like this

function linearSearch(arr, t) {
  for (let i = 0; i <= arr.length; i++) {
    if (arr[i] === t) {
      return i;
    }
  }
  return -1;
}

Some pages use screenshots as code examples

As I mentioned before, syntax highlighting adds a lot of value. However, I believe that adding images as code blocks might not be that beneficial for performance and usability issues. Still appreciate the addition of them.

small

Some contrast issues

It’s somewhat hard to see what going on in the menu. It’s an easy fix that would improve a lot the user experience.

big

Repeated functionalities

big big

big

Conclusion

It’s really good, I tried to be as descriptive as possible but I’m not sure if I can do it all. In reality, much of these things have little effect on the user experience but if considered it could definitely be widely improved.

8/10

Edit this page on Github