Archive

Posts Tagged ‘wordpress’

Running your domain on HTTPS for free

August 23rd, 2015 1 comment

This blog runs on HTTP for a long time as there is no transaction taking place so no security is needed (I use SFTP for file transfer). However, since Google’s latest search algorithm change, I’ve noticed a sharp decrease in the number of monthly visits, from more than 20k to around 13k.

While my goal has never been to have the highest number of visits, it’s still good feedback to me (as well as a nice warm feeling). As it seems turning on HTTPS didn’t seem like a big deal, I thought “Why not?” and asked my hosting provider about that. The answer was that I had to both purchase a fixed IP and the Rapid SSL certificate acquired through them. As the former is a limitation of their infrastructure and the later simply a Domain Validated certificate sold with a comfortable margin, I thought that I could do without. But first, I wanted to try on a simpler site. The good thing is I have such a site already available, morevaadin.com.

morevaadin.com is a static site generated offline with Jekyll and themed with Jekyll Bootstrap. The advantages of such an offline process is that the site is provided very fast to users and that the security risks are very low (no SQL injection, etc.).

After a quick poll among my colleagues, I found out that Github was the most suitable to my use-case. Github provides Github Pages: basically, you push Markdown documents on Github and not only it generates the corresponding HTML for you but it also makes it available online. My previous publishing process was to generate the pages on my laptop with Jekyll and upload them through SFTP but Github pages do that for me, I just have to push the Jekyll-flavored Markdown pages. Plus, Github is available on HTTPS out-of-the-box.

Github Pages provides two kinds of sites: user/organization sites and project sites. There are a couple of differences, but I chose to create the morevaadin Github organization to neatly organize my repository. That means that everything I push on the master branch of a repository named morevaadin.github.io will end up exposed on the https://morevaadin.github.io domain, with HTTPS as icing on the cake (and the reason I started the whole stuff).

Yet, I was not finished as the remaining issue was to set my own domain on top of that. The first move was to choose a provider that would direct the traffic to Github while providing a SSL certificate at low cost: I found Cloudflare that does just that achieves that for… $0. Since I didn’t know about that business, I was a little wary at first but it seems I’m not the first non-paying customer and I’m happy so far. Once registered, you have to point your domain to their name servers: art.ns.cloudflare.com and val.ns.cloudflare.com.

The second step takes care of the routing by adding a DNS record and depends on your custom domain. If you’re using an apex domain (i.e. morevaadin.com), then you have to add two A records named as your domain that point to Github IP for Github pages, 192.30.252.153 and 192.30.252.154. If you’re using a subdomain (i.e. www.morevaadin.com), then you have to add a single CNAME record named as your subdomain that point to your Github pages (i.e. morevaadin.github.io).

The next step is to enable HTTPS: in front of your DNS record, click on the cloud so that he becomes orange. This means Cloudflare will handle the request. On the opposite, a grey cloud will mean Cloudflare will just do the routing. On the Crypto tab, enable SSL (with Speedy) by choosing Flexible. That’s it for Cloudflare.

Now you have to tell Github pages that it will serve its content for another domain. At the root of your project, create a file named CNAME that contains your custom domain (but no protocol). Check this example. You also have to tell Jekyll what domain will be used in order for absolute link generations to work. This is achieved by setting the BASE_PATH to your URL (this time with the protocol) in your _config.yml. Check what I did.

As an added bonus, I added the following:

  • Force HTTPS traffic (redirect everything to HTTPS)
  • Minify JavaScript, CSS and HTML

This should end your journey to free HTTPS. Basically, it just boils down to let Cloudflare acts as a proxy between users and your site to add his magic SSL . Note that if you’re interested about security, it doesn’t solve everything as the path between Cloudflare and your content is not secured within this architecture.

Now that I know the ropes, I have several options available:

  • Just keep my current hosting provider and put Cloudflare in front
  • Choose another provider and put Cloudflare in front. Any of you know about a decent and cheap WordPress provider besides wordpress.com?
  • Take on my current provider’s offer
  • Migrate from WordPress to Jekyll and put Cloudflare in front

I will think about these this week…

Send to Kindle

Show you blog some love

February 8th, 2015 No comments

Blogging is very interesting, but just as for cars, it’s (unfortunately) not only about driving the car, it’s also about its maintenance. As I believe there’s some worthy content inside, and I’ve reached +20k visits per month, I thought it would be time to add or complete some features.

Cookie authorization

Though “normal” blogging sites such as mine are probably below the radar of governments agencies, European laws mandate for sites to ask about users consent before storing cookies – even though no modern site cannot do without. As I use Google Analytics to keep track of visits, I prefer to try to be compliant… just in case. Google provides an out-of-the-box script for web masters with the relevant documentation. Two flavors are available, one pop-up and one bar. You can choose it by calling the relevant method.

Automated SEO

I thought I achieved some degree of SEO via the SEO Smart Links Wordpress plugin ages ago. In essence, I just installed the plugin, the configuration itself being very crude: you just had to edit the different files.

I recently stumbled upon another plugin that is much easier to configure, the WordPress SEO by Yoast. It provides a friendly user interface with which you can design the pattern of the SEO metadata e.g. blog name plus post title, the type of metadata – Facebook OpenGraph, Twitter Card and Google+. This can of course be overridden on a case-by-case basis. Moreover, it offers a preview of the snippet as it would be displayed on Google search page. There are also plenty of configuration settings I’ve yet to use (and understand).

Google Webmasters Tools

The preview provided by Yoast’s SEO is nice but doesn’t replace the real thing. Fortunately, Google offers a neat near-real preview page to test in real-time the final result of your changes (no caching involved). The greatest advantage of this preview feature is that you may add set an URL but also raw HTML code instead. This lets you check how Google parses the metadata of your unpublished pages.

For sake of completeness, there’s a similar tool provided by Yandex (the Google from Russia) that gives slightly different results. From my microscopic experience, Yandex is slower, but seems to less lenient and more importantly, provides solutions. For example, it tells me that the date value is not in the correct format (ISO 8601) and that I forgot the itemscope attribute at some point, which corrected the error I had on both Google and Yandex.

Both were very effective in pointing out one problem: it seems the post’s author linked to a URL that displayed the home page. Since it didn’t give out a 404, I had no hint about that. (I fixed that by a simple 301 Redirect)

Manual SEO

All this automated stuff is nice but somethings cannot just be automated. For example, I’d like my book Integration Testing from the Trenches to be referenced on the page with the right kind of information and this, I have to do by hand. I’ve searched for metadata frameworks and it seems there are two W3C standards, RDFa and Microdata and OpenGraph by Facebook. The latter seems to be quite crude, so I chose to use RDFa and Microdata. For example, for the page about my book, I use the Book schema and for the page introducing me, I use the Person schema.

Interestingly enough, the book is quite straightforward: either add the relevant itemscope, itemtype and typeof or itemprop and property attributes  to an existing tag or to a new span and you’re done. However, this is getting harder on the Me page; challenges include:

  • Referencing entities in other entities. For example, how to set the author of my listed presentations. This requires usage of itemref
  • Setting data that shouldn’t be displayed. This requires usage of the meta tag in the header.

Conclusion

In the end, I noticed the whole SEO thing is still very in its infancy. There are a lot of contradictory norms, standards and proprietary stuff around. The good thing, is that I think I achieved some things:

  • Google Search results display regular posts in a more detailed way
  • Google Search results also display manually referenced pages in a nicer way. You can have a look at the pre-parsing in their tool.
  • Google+ automatically use the correct data to preview the pages I intend to share
  • (As I have no Facebook account, I couldn’t check there)

On the other hand, I’ve checked other sites, and it seems they do only the automated kind of SEO, and not manual. I can only infer why: it’s going to cost you a lot of time. All what I did is probably not necessary, I could have used the Yoast plugin to only override the title, the description and the image. But as always, it made me learn stuff.

Send to Kindle
Categories: Technical Tags: ,

frankel.ch goes mobile!

April 30th, 2010 No comments

If you do browse this site with your computer, chances are you didn’t notice anything. On the contrary, if you browse it with a mobile device (an iPhone for example), it’s kind like a new user experience!

In fact, in almost 1 minute, I made this site adapted to mobile browsing. How? Just used my friend Google who found WPTouch, a WordPress plugin which in fact behaves like a configurable theme, but only on mobiles.

WPTouch features are impressive (and free). Most notably, supported user-agents include: Android, BlackBerry9500, BlackBerry9530, CUPCAKE, dream, iPhone, iPod, incognito, webOS, webmate.

If you own a WordPress blog and want to offer to users the best user experience, I would recommend using this plugin.

Send to Kindle
Categories: Technical Tags: ,

WordPress 2.7.1 upgrade

March 8th, 2009 No comments

Noticed anything different on this blog? No? Yet, I upgraded WordPress from version 2.5 to version 2.7.1. Since you had no problems viewing this post, we can safely admit the upgrade process was entirely successful.

The upgrade process is very simple since WordPress is developed in PHP. Just copy (and sometimes overwrite) the contents of the wordpress folder to your webserver and presto, you got the new version. I must admit I was a little afraid something would go wrong… And what to do in this case? Prior to the upgrade, I did a backup of WordPress database using WordPress Database Backup plugin.

Now everything is fine. And Mango theme is upgraded too.

Send to Kindle
Categories: Technical Tags: ,