Roadmap for my website and blog

The web is changing quickly. Having a website keeps you busy staying ahead of the pack. This is why I have created my personal roadmap for my website and my blog — I would like to share and you can share too.

Why a roadmap anyway?

The computer industry is the only industry that is more fashion-driven than women’s fashion.
Larry Ellison was right when he referred to the hyped term cloud computing and the same goes for the web industry too. There is always something people jump on and in general requirements/conditions are changing quickly, not only because of this fashion behaviour.

Competition is high if you want to rank high in Google and get people to your site. There are many ways you can try to improve your ranking and get your word out. I have a few ideas how to improve not only my ranking but also learn something new at the same time.

Cloudflare

Cloudflare is one of the most popular CDN services promising to reduce page loading time and increase security by blocking common attacks.

My website and blog have visitors from all over the world and page loading time currently differs greatly depending on their location. Since my server is located in Germany, loading time can be as much as 3 seconds or more in Asia.

In order to align page loading time world wide I will configure my site running on Cloudflare hoping for great results. I will write a separate article about it and let you know about results.

Semantic markup

I recently wrote an article about Google Data Highlighter and why schema.org use is a way better solution.

In fact search engines increasingly support semantic markup i.e. trying to understand structure and meaning of your website’s content. This can be beneficial for you sharing semantic with search engines using schema.org markup.

For my blog I already use HTML5 tags and schema.org Article markup but there is still space for improvement e.g. using semantic breadcrumbs. Also my website makes so far little use of this markup. As of now I only use Person schema.org markup on my wesite and Google Authorship, so I am looking at improving it.

Blog feed

Having a separate website and blog it is important to use synergy leading visitors from website to the blog and reverse.

Currently my website mentions my blog only under projects with a short description and an image. Also the blog appear in the menu bar which lead to a few visit on my blog already.

Nevertheless feeds or a teaser with latest articles should attract more visitors to read the blog if they see topics they are interested in rather than just mentioning “I have a blog too”. For that I am planning to either show the blog feed directly on top of the website attracting probably most visitors clicking to my blog or in a more modest way in the project section under the short description of the blog.

SCSS and Compass

The main CSS file for my website has 1600 lines. It is not minified and there are most likely a few lines I could save. In order to reduce loading time and save my server’s resources I will switch to SCSS with Compass.

I have never used SCSS before but it is certainly overdue to learn and use since many templates and frameworks are based on SCSS rather than CSS.

As long as I am working alone it might be fine to use just CSS but I am really looking at performance and SCSS will be give a small performance push though.

Reusability

A few people have asked me already if I could code them a similar website or if I can provide the template I use for my website.

The website runs on php but is still coded in a rather static way because it is only a one-pager with not many repeatable elements such as teasers etc. But still there are elements I want to reuse later on and would love to share a template with others for free.

The plan is to put all labels/text into php arrays first to create a German version of the website easily. As a next steps I would move repeatable elements into seperate php files passing the content to them and render accordingly. In this way I can move from a static page to a dynamic template step by step providing increased flexibility.

Usability

Usability is big. I did not think much of the user perspective as it is mostly common sense but there is always something that can be improved about usability.

Certainly I try to have all my sites mobile friendly which is key. Besides I am trying to keep things simple, reduce color variations and keep things aligned and not too fancy by small animation that do not distract the user to much. But there is one enhancement I would like to see — switching my blog to be fully ajaxified. That means I don’t want to bother the user waiting for endless page reloads but rather use ajax. There is a popular Github repository for HTML5 history.js and ajaxify providing a standard set of code to implement a fully ajax-based site. I am convinced adding small fade transitions will make the browsing experience in the blog much better.

User interaction

You can have as many ideas as you want there will always another idea you will not have but someone else. Working as team and engage users to share is king. I value feedback and want to hear your ideas.

Feel free to share your ideas in the comments, contact me directly or are you on Github? If you are on Github add your idea directly in my repository here.

Thank you and looking forward to your feedback.