It has been a while since the last time I change the design of this blog, it is almost three years ago. The web landscape has been changed rapidly since then, with HTML5 becoming more standard and CSS3 is more supported, that made my old design outdated. So the thought came to me, it is the time for a new design.
Also with this opportunity, I also introduced a new domain for this blog, jeffri.me. Starting today, jeffri.me is the default domain for this blog, while my old domain – jeffri.net – will redirect to this new domain. In case you are wondering, why did I change a dot net to dot me, well, no specific reason. I just feel like it, it’s shorter by one letter and it’s more personal. 🙂 Besides, it’s not like my old domain ranked high, although it’s 5 years old now. I will keep jeffri.net for as long as I live though.
While working on a responsive website, testing it could be tricky. The usual way (and effective) is to resize the browser window and there’s many plugins on the browser that do just that. Another way is to use an available tools on the web, many of these are awesome, like The Responsinator and Screenqueri.es. Another one that is also my favorite is RWD Bookmarklet by Victor Coulon.
These were all cool and I frequently used it. However, these tools were made for testing on mobile and tablet display resolution, what if, you want to test a laptop or desktop resolution as well? In my case, I have 1280×800 laptop, so I never knew how the website will look on higher resolution screen. There’s also many display resolution on mobile now to consider, not just iOS resolution.
And so I created a simple tool to test responsive website, with a wide range of resolution to select, from mobile to tablet to desktop. Also HDPI display is common now, so I added a device pixel ratio selection that calculate the effective resolution. For example, Motorola RAZR have QHD display with pixel ratio of 1.5, so the effective resolution is actually 640×360, that is the resolution the phone display on it’s browser.
Feel free to use the tool here: responsive.jeffri.net
A little bit of disclaimer, I don’t store any data from your usage. There’s no trip to the server when you use it, at all. 🙂
Hope you find it useful! Cheers!
The solution I tried to made right now is a very simple and basic one. It make use of simple jQuery to catch the click event and switching tabs, as well as the slideshow, the CSS to style it as much as we wanted and a simple HTML markup in one unordered list.
Recently I try my luck on offering service for PSD to XHTML and CSS conversion on Kaskus, the biggest local forum in Indonesia. I have done many PSD to XHTML and CSS conversion before, often, I also do conversion to WordPress and Magento. While I want to list my previous work here, unfortunately, due to the contract, I’m not permitted to list them. So basically, you can see how well my blog markup is for an example of my work. 🙂
Details for my service can be found here. For international user, you can just contact me for a quote.
For this service, I will offer a promotion every month. For July, you will get a limited offer for a free PSD to XHTML and CSS conversion, only for 1 person. The following condition is apply for this promotion:
- You must agree and give me permission to list the work on my portfolio page and Kaskus (with a clear position of me as the PSD to XHTML and CSS converter, the design is still yours of course, no worries :))
- Turn around is in a week (I’ll work on it when I have time, but I’ll make sure it completed in a week)
- Only for 1 page (additional page will be charged with normal price)
- I will choose the design that sent to me
- Only for client that haven’t working with me before (sorry for returning client :))
Deadline is August 1. Your design will be converted to XHTML and CSS in a week after the deadline.
Welcome to my new redesigned blog! It’s been a year and a half since the last time I changed the design. I have always wanted to change it, but I just always don’t have enough time. 🙂 I know I’m not that good enough in designing, but at least, this is the best design I ever made until now!
The idea behind this design is, to make a simple, usable layout and still looks beautiful. There is a lot of tutorial on the web that helped me when making this. I try to make the website small in size, so you’ll able to load it fast enough. There is also a cool trick on the background, which still make the markup small without much wrapping div over div to accomplish the effect. I also realize the importance on social networking nowadays, so I add links to some of my account. 🙂