Every once in a while I stumble across an amazing tutorial, web resource or even a collection of inspirational web designs. Most of the time this would occur on Twitter and I would eventually lose the link to it after the “re-tweet” gets buried by my tweets. I could bookmark it but I don’t like keeping a heck load of bookmarks for things that I might not even visit in the future. Thus, I have decided to make a blog post dedicated to all the things I love or find interesting. Most of the time I won’t get around to using whatever is in the link but hey… I might need it in the future and you might find it useful too. Not everything below is for the “web,” but the majority is:

HTML / CSS / JS

• How to Create CSS3 Paper Curls Without Images
• Orman Clark’s Chunky 3D Web Buttons: The CSS3 Version
• Learn jQuery In 30 Days
• HTML5 Canvas Tutorials
• Flared Borders With CSS
• Video Re-Captcha
• How to Build a Stylish CSS3 Search Box
• CSS Reference
• Interactive Typography Effects With HTML5
• MotionCAPTCHA – Stop Spam, Draw Shapes
• Creative CSS3 Animation Menus
• CSS3 Ribbon Builder

Frameworks / Libraries

• Discover Facebook’s developer tools
• PHP Fat Free Framework (F3)
• Bootstrap – HTML/CSS Framework (by Twitter)
• Hojan.js – 2.5k  JS Templating Engine (by Twitter)
• Microjs: Fantastic Micro-Frameworks andMicro-Libraries for Fun and Profit!

Inspiration

• 16 Best Web Design Galleries for Inspiration
• 33 Kick-Ass Websites for Your Inspiration
• 20 Magazine Layout Designs for Inspiration
• 32 Inspiring Examples of Amazing Layout and Typography

Free Resources

• 50 Stunning Pixel Perfect PSD Freebies
• 50+ PSD UI Web design elements
• 35+ Icon Packs For Web Designers (That Don’t Suck!)
• 20 More Fresh & Free Fonts for Beautiful Headlines

Others

• Optimizely: A/B Testing
• Tips for Creating a Magazine Layout in InDesign
• Your Brain On CSS – CSS 3D Demo
• Give Your Site A Health Check (Infographic)
• Microcaching: Speed your app up 250x with no new code
• The Reality of HTML5 Game Development and making money from it

I hope you find something above useful! If you would like to contribute to my list, just leave a comment below or tweet me (@MrSaints). I will continue updating this list until the end of March… if there’s a lot I might just consider writing a separate blog post. Let me know what you think.

I am a huge fan of startups… web startups that is. Indeed, I am attempting to find my own “place” on the internet by looking for startup ideas, which hitherto had been rather unsuccessful – everything is taken! Anyways, I recently gained early access to Pinterest (a “Tumblr-like” service – personal opinion – to create virtual pinboards so to speak) and Connect.me (described as a “personal reputation network”). You can find out more about both of these services on Mashable or their respective about pages.

I am not going to review either of them at this point because, a. I am horrible at reviewing startups and b. I have not yet allocated enough time to fully tinker around with either of them. However, I must say, I am rather impressed by Pinterest so far and I have started to make use of it for educational and business needs – I made a “pinboard” containing all my work (basically a portfolio) and a “pinboard” for historical propaganda. Connect.me seems pretty interesting although my initial impression seems to be that you can not go far on their website without having vast amount of “connections” or rather, “influence” - although that seems like the whole point of it. Pretty cool ranking system though and fancy UI.

Free Invites

Both of these great and new services have also given me the opportunity to invite anyone to try it out as well… so, if you are interested, either leave a comment on this blog post or message me on Twitter (@MrSaints) and I will send you an invite right away. There is no catch to this. Seriously. I have a limited number of invites though so if I run out by the time you contact me, I am truly sorry.

Thanks for reading and Happy Valentine’s Day!  Peace.

Introduction

Inspired by HTML5 Boilerplate, I aim to provide some useful boilerplates for WordPress developers working on plugins and/or themes. When I was working on a WordPress-based project, I found it difficult to “move around” with the existing codex as most of the time it did not provide me with what I need to achieve my goals and I would often have to resort to reading numerous blog/forum posts to get a brief idea of “what to do.” Don’t get me wrong, the WordPress Codex is great and extremely useful but at times it can be a little redundant and difficult for newcomers such as myself. If you have never coded a WordPress theme before, I’m sure you are wondering, what the hell do I need to do? What do I need to include? Let’s find out.

Hopefully with this series I can steepen the learning curve for you! Without further ado, here is part one:

Boilerplate: http://pastebin.com/u1dndczc (explanation below)

API Reference: http://codex.wordpress.org/Class_Reference/wpdb

Explanation

Let’s say you are developing a WordPress plugin and you want this plugin to connect to another database to retrieve information about your clients or even your students. WordPress core comes with an amazing class called “wpdb” – you can find out more about it by clicking the API reference link above. On default, the class construct would connect to your WordPress database, however, with the right arguments, you can make it connect to another database without interfering with your WordPress database connection. Thus,

$this->db = new wpdb(DB_USER, DB_PASS, DB_NAME, DB_HOST);

The above line (#30) will initiate a database connection using the defined preferences (#18 – 21) and will then store the class object in the private variable $this->db – private means that it is only accessible by methods within the class. You can now take advantage of wpdb class methods to manipulate data in your database.

If for example you would like to count the number of students in your database, just include the class in your plugin and execute $Custom_DB->count_users() to get the number. You can find more class methods in the API reference link above – examples included.

Note: The try/catch statement is not necessary.

That’s it! If you have any questions, suggestions or if you have picked up on any mistakes in this article, feel free to leave a comment. Let me know what you think of the WordPress Codex and/or about my series

Source: http://www.labnol.org/internet/google-chrome-logo-design-inspiration/4414/

Background

Feel free to skip to the “tutorial” bit if you want a quick solution to your problem rather than a long statement about my encounter with this problem.

Recently, while I was working on a custom WordPress theme for my client, I stumbled upon an unusual problem that took a good 20 minutes off my time to resolve. I normally pay extra attention to cross-browser compatibility when coding any sort of websites. Indeed, I utilise stylesheet resets (my favourite being normalize.css and the famous Eric Meyer CSS reset) as well as services such as Browsershots to ensure to ensure all popular browsers are properly compensated for. In this particular issue, I had given my client a live preview of his website to be, however, “things” were not showing up as how they were intended to. Text that were meant to be small, appeared bigger and it subsequently triggered a chain of problems (much like Chaos Theory) such as misaligned buttons, images, containers, etc. The odd part of all this was that my client was using the exact same web browser as me (and the same version too) – Google Chrome.

Through the use of Teamviewer, I was able to examine the website in my client’s perspective properly. I took advantage of Chrome’s native developer tools (accessible through Tools >  Developer Tools or Ctrl-Shift-I for Window users) to inspect the text’s styles. To my surprise, its font-size was set at 12px even though it was defined as 11px in the stylesheet. Additionally, there were no overriding styles to have set it to 12px (evident from the fact there were no strikethrough/strikeout). Thus, the problem must ultimately be caused by the web browser. My client confirmed this by viewing the demo on Firefox and there were absolutely no issues.

So, What’s The Problem?

I did a quick Google search regarding this issue and it appears that I am not the only one to have discovered this dilemma. Refer to:

• http://code.google.com/p/chromium/issues/detail?id=36429
• http://www.google.com/support/forum/p/Chrome/thread?tid=6c5177414cbf8330
• http://stackoverflow.com/questions/2295095/font-size-12px-doesnt-have-effect-in-google-chrome

To quickly summarise what the above links have discussed… on default, Chrome would normally set its minimum font size to 1px for most UI locale (language) – anything less, will be forced to resize. It uses WebKit (an open source browser engine) that does indeed support font sizes of 12 and less.

However, the problem arises when Chrome users with a special UI locale (such as Traditional/Simplified Chinese, Japanese, Thai, Korean, etc – special characters) browse a website with a font size smaller than 12. For users on these special UI locale, the default minimum font size is set to 12px and consequently, anything smaller would be forced to resize to 12px, no less. As far as I am concerned, this is a bug that has been unresolved since 2010 (sorry if I have made a mistake and please do feel free to correct me) and there is currently no “good” way of addressing this issue especially since you can only manually alter the “minimum_font_size” property at this very moment.

Dealing With The Issue…

As I have mentioned earlier, there is currently no full-proof / good way of dealing with this problem (not that I know of). One way is to disable auto-adjustment of your text size via CSS. You can do this by adding the following property to your stylesheet:

-webkit-text-size-adjust:none

While using this style may seem like the ultimate solution, it simply adds another problem. Your text size will no longer resize itself when a user tries to zoom in on your website and thus, it becomes slightly less accessible – especially if you have a chunk of text with a small font size (who would do that anyways?).

You can read more about this problem here: http://www.456bereastreet.com/archive/201011/beware_of_-webkit-text-size-adjustnone/

Conclusion

It is pretty easy to apportion the blame to Google Chrome, however, as a web developer, you would often have to compromise to a lot of things (no doubt about that, Internet Explorer has given me nothing but hell ever since I started) and this issue is “not that big of a deal.” If you can find a way to address the problem without the use of the above “hack,” then do it. Besides, a font size of 12 is not necessarily a bad thing as many internet users (e.g. my mom) find it difficult to read text with a small font size (normally anything less than 10 and it becomes an issue in my mom’s case). However, the Chrome team should still work towards resolving this bug as insignificant as it may be. That is just my opinion.

What do you think?

Here’s a quick and extremely simple Google Chrome extension I made to hide the annoying Facebook real-time ticker on the right sidebar. It shouldn’t require any specific permissions to run it. To be perfectly honest, you don’t really need this extension if you already have the Adblock extension installed. You can use Adblock’s “Block an ad on this page” feature to remove the real-time ticker.

Feel free to run a virus scan even though I did not include anything malicious and it’s not an executable.

Update (21/09/11): My Facebook page has recently been updated to the new layout for the second time (after it was briefly reverted back to the old layout) and thus, I have updated “Derpbook” (due to lack of a better name) to version 1.2. You are not required to update it (although, there’s auto-update in place) as the old version still works fine besides the fact it leaves a huge gap/space where the real-time ticker is supposed to be. This problem should be eradicated in version 1.2. If there are any problems, feel free to report them via the comment section below.

Download Extension (Version 1.2)

Best of luck!
Ian

Why, hello there!

Just yesterday I was trying to create a new ‘rant-like’ blog post, however, my WordPress simply refused to display the What-You-See-Is-What-You-Get (WYSIWYG) / Visual / Rich-text / Whatever you want to call it, editor. Therefore, I was unable to create any blog post… and as crazy as it seems, perhaps this was the Universe telling me, “You have more important things to do that rant about something so silly.” As this was the first time I had ever experience such problem with WordPress (upon numerous others), I had to Google for answers which brought me to various irrelevant WordPress 2.8.x related posts. After a while, I was able to isolate and fix the issue. Now, I can successfully post!

Whilst I was searching for answers, I came across a post on the WordPress forum that recommended enabling WordPress in ‘debugging mode’ in order to look for errors (which was far more useful than all the other posts advising I cleared my cache before trying). So, if you are ever faced with this problem the first thing you should do is open up ‘wp-config.php’ (it should be in the base WordPress directory) and look for:

define('WP_DEBUG', false);

Set this to true to enable your WordPress in debugging mode. Then, the next thing you should do is to return to your “Add New” post page and look for errors. In my case, majority of the errors were coming from my theme – NattyWP’s Delicate – which suggests to me, that perhaps it is not compatible with the latest WordPress 3.1.1. The errors identified ‘custom-title.php‘ as the main source of the problem – you can find this file at ‘/wp-content/themes/delicate/functions/custom-title.php.’ Open this file up and look for:

add_action('admin_menu', 'seo_meta_box');
add_action('save_post', 'seo_metabox_insert');

Now, there’s 2 things you can do here at this point.

• (a) You may decide to fix the error which is due to $pID attempting to access a non-object $post or,
• (b) You may comment the 2 aforementioned lines out and resolve your problems immediately.

As I already have the “All-In-One SEO Pack” plugin installed, I found the need for another “SEO-related box” in my post creation page, unnecessary. Once you comment it out or fix the issue here, your visual editor should work once again.

Conclusion

Whilst I was attempting to fix this, my first few attempts at isolating the problem led to a few of the following conclusions:

• It was due to a faulty WordPress upgrade.
  Not Possible – I replaced all the WordPress 3.1.1 files.
• It was due to $ / jQuery not being defined.
  Not Possible – The script tag for the jQuery library is declared right above every other essential JavaScript files. Thus, jQuery should have been loaded before every other script.
• It was due to a plugin.
  Not Possible – I disabled all my plugins and it still did not work.
• It was due to stale cache / Gears.
  Not Possible – Yes, I have Gears enabled but even so, the visual editor did not appear when accessing the “Add New” post page on Google Chrome Incognito.

Therefore, the only thing left must be themes. If you are ever faced with a similar problem, ensure you have checked all of the above as well as your theme!

WordPress is clearly not something entirely familiar to me yet and even the discovery of the “debugging mode” in WordPress was something new to me. I do apologise if this article was a bit too simplistic for your level, however, I am writing this merely to assist anyone facing a similar issue as me. As I am satisfied with this theme, I’m not too keen on changing it so I can post again, but fortunately, I was able to resolve this issue and stick with this unique and contemporary theme. Don’t change it until you can’t fix it!

If you like this theme, click here to download it.

Have a nice day!

Ian Lai

It has been ages since I last made a blog post! Well, as you can see, I have imported all my previous blog posts – after much debate – to my personal website which I have finally setup WordPress on I will no longer update my previous homepage (maybe, maybe not). In the past, I was able to sustain most of my personal domains due to the ad revenues they generated, however, with the previous URL I was using, I was not able to put up any ads and hence, I was not generating any revenues to cover for my domain expenses.

So, what next? Over the next week or so (if I have the time), I might consider blogging more and perhaps even blog on areas such as Psychology and History as they are of great interest to me. I will leave my previous blog posts as they are despite the fact I am not very satisfied with the quality of some of them nor am I satisfied with the rubbish I was blogging about! I will continue my web development and web design blog posts where possible, however, this will not be the case for perhaps another few weeks or so as I have not been involved in any projects or work worth mentioning.

I have quite a lot to setup and configure before this blog is really ‘good to go’ and I might in fact just leave it as it is. I don’t think there is much else to say… I hope you like my new homepage and my selection of this WordPress theme. Till next time, have a nice day!

Ian Lai

EDIT (15/03/11): Apparently the message sent out by WrzHost was by an ‘ex-employee’ and WrzHost did not close down. Please take that into account when reading this blog post. Thanks.

Merry Christmas (belated) and Happy New Year to all of you! If you still follow my blog once in a while, thank you! As usual, I have been busy out of the internet and I just only got the time to blog. Well, I just received an e-mail from a certain hosting company I used to be with but I will go into that shortly. Over the past couple of months since I closed Aerosol Hosting, I have been consistently bugged by the same questions: “WHY?” “HOW MUCH?” “WHO?” So I thought it would be easier for me to put everything down on this blog article and push this interesting phase of my life aside.

Where do I start? Okay. Around the end of 2008 (or beginning of 2009), I was encouraged by my friend, who just so happens to share the same birthday as me, Homen Yu, to purchase a master reseller hosting service from a ‘runaway company’ called RDAHosting. I lost approximately USD$12 if I am not wrong? I used this hosting service to host my friends (both online and offline) for free and some for a price. The thought of expanding to a proper hosting company was never in my mind and it was in fact because of this, that I used a nulled WHMCS script as well! Anyways, since they decided to take off and leave their datacentre to pull the plug, myself and my friends were left host-less. As a result, I stumbled upon a forum known as ‘DigitalPoint’ – popular for internet related stuff… and hosting. The worst has yet to come.

If I am not mistaken, I was scammed a further 4 more times at ‘DigitalPoint’. 2 out of the 4 however, went smoothly until their owner decided to close shop. By now I believe I lost at least USD$40+ thanks to ‘DigitalPoint’ alone! Yes. Cheap resellers… take an advise from me and avoid cheap resellers or any cheap hosting for that matter! Around this time (it was 2009), I had a few clients through advertising on forums and through friends (so-call ‘word of mouth’). If there is one thing you need to know about Aerosol Hosting and myself, is that I had less than $15.00 of capital and each time I was scammed, my PayPal total would had been around $5.00. Just to skip ahead, I eventually moved onto a ‘Virtual Private Server’ service provided by WrzHost.

During my time with WrzHost, I experienced numerous hard disk failures (I count 2 as numerous), network outages, horrible support and stuff I can not even remember. It was during my time with WrzHost that I finally purchased a licensed WHMCS license through LicensePal – ONLY $12.50 / MONTH. The VPS was running on 1024MB of RAM despite what I normally advertised it to be and it went pretty smooth all the way through. Another thing you need to know about Aerosol Hosting and myself, most of the technical issues I encounter are ALWAYS and yes, ALWAYS due to my host provider. I can not stress this enough. It is not an attempt for my to cover my ass or whatever, but then again, I partly blame myself for not taking offsite backups which was something I had finally done towards the end of my time with Aerosol. Also, each time I encountered a major issue, I would lose 1 ~ 3 clients and it would take me another 1 or 2 months before I can gain another 1 ~ 3 clients. Just to throw it out now, my % revenue averaged around 20%, there is nothing to hide. I spent quite a lot on 3rd party scripts; outsource support and technicians to improve the services.

Going back to the e-mail I mentioned earlier, it was basically an e-mail from WrzHost about ‘Shutting Down’, have a look yourself.

Continuing on (Yes, it does not stop here), I moved to InfiniteTech VPS services as WrzHost experienced yet another hard disk failure! The first occurred 2 months after purchasing my VPS with them for the first time. I will be honest, InfiniteTech had the BEST SUPPORT throughout the course of my hosting life (if you do not count Blue Mile Networks & FiveBean). At the beginning, they were quick to respond, extremely friendly and very understanding, but this eventually died towards the end of my hosting career. During my time with InfiniteTech, I was (D)DoS attacked numerous times, at this point, I also had a server from RackVM (France) which lasted only 2 months before they closed down! Thinking about it, I am actually missing out a lot here…in summary: my server from RackVM was basically to house my clients on the Aurora (Germany) server whilst the server with InfiniteTech was for my clients previously on the WrzHost server – Neptune (Netherlands). I also had a USA reseller account, but that is not important. Going back to the story, with only one server left, I decided to move every single client from the Germany server to the Netherlands. The upgrade for more RAM was pretty expensive and I was also paying for LiteSpeed Web Server.

Jumping further ahead, around October and November of 2010, I was finally able to sell Aerosol Hosting to an extremely nice owner. The transaction was completed within 24 hours and Aerosol Hosting was out of my life just like that. There are so many reasons why I decided to quit… and I had been playing with this idea since 2009. Really my main reason was: Time. With AS Levels (school) in mind, I really could not continue running this time-consuming business which I had little to gain from besides experience and knowledge in such industry (once again, 20% revenue is not much for the amount of time put in). Additionally, the hosting business requires consistent marketing and advertising, something I was not so good at – also due to the fact I was financially tight! The dilemmas I kept stumbling into also seemed to indicate it was time for me to retire from all this. As cheesy as it may sound, a few weeks before, I closed my eyes thinking, “You know what. I’ll quit Aerosol once I get an indication. Perhaps another weird dilemma…” and it happened! I had random network connection errors that both my host and myself, could not explain! I was losing clients day by day… and based upon my revenue forecasts I would be making losses.

I finally came to a conclusion that I had gained sufficient experience in this field (for my level and capabilities) and it was time to close the shop after 2 years. The hosting industry in my opinion, is simply too saturated! If you were to combine both the underground and ground host companies, it would perhaps account for 25% of all internet users! This journey had taught me a lot of things and made me learn from a lot of mistakes – e.g. The lack of exposure Aerosol Hosting had, the bad back-end management, the stupid outsource services from Assistanz (avoid them).

So this is a message to all of you. If YOU ever decide to step in the hosting industry, PLEASE RECONSIDER. You should be financially capable in sustaining your services for at least 1 year without customers and you should have as little as possible, distractions (e.g. 2nd job, school, etc). If you are in school, DO NOT EVEN THINK ABOUT BECOMING A HOST. I admit I was being too overambitious and perhaps intrigued by the fact people were able to make money so easily online, BUT THIS IS NOT THE CASE. I learned my lesson… you should not go through the hard way I did. In fact, I still hold guilt inside me for not doing as well as I thought I could for my IGCSEs due to this HUGE DISTRACTION.

The e-mail from WrzHost made me consider sharing my experiences of all this. I am confident there are others out there, just like me, whether it is in the past, present or future. As you can see from WrzHost e-mail, his case is almost identical to mine (minus the part about being in debts). I am hoping to share a story for aspiring hosts… I started this when I was around 14. Yes, I did make a profit out of this at the end, but all the time I wasted and the energy spent on anger… I really do not know if this was all worth it in the end.

Feel free to leave your comments and whatever below.

Sorry for rushing through my whole 2 years of hosting experience, it is really a lot more than that!
I realised I skipped quite a lot about my dedicated servers, experience with nginx, first attempt to sell at 2009 (with the highest bidder bidding it for $750) and chargebacks…

If you had read this far, thanks
See you soon.

This post is password protected. To view it please enter your password below:

Password:

HELLO ALL!

A few hours ago, I cleaned the dust off my ‘old’ Genius Graphics tablet and began playing around with it. I must admit, since I purchased it from a famous IT mall in my country, Low Yat Plaza, I rarely played with it since, and it was as if the tablet’s existence was nothingness since then (even though it is directly next to my mouse!)

It is not a really big graphics tablet and it is quite ‘portable’ in a sense I can put it on my lap. I am not much of an artist, so I have no idea why I purchased it in the first place I quite like how it can act as a replacement for a mouse just by moving the stylus an inch above the tablet; I never really noticed that.

Without further ado, here’s MR. AWESOME! Which I will be using for my polo shirt’s back print (read my previous article if you have no idea what I am talking about).

As you can see, going back to my point about not being a very good artist, you can clearly see that from the above
Yeaaa…. it actually looks pretty good on the Ash coloured polo shirt itself – along with the text, MR. AWESOME.
Thankfully,  Photoshop was able to get rid of all my fails and hence, the smooth lines (pen tool).

Psychology Questionnaire

One last thing! DON’T GO YET! If you have time, please help me by filling up a small questionnaire I made, as part of my Psychology assignment. It is basically to investigate attitudes and opinions from different gamers with different perspectives. So pleaseee! Click this link: http://survey.fyianlai.com/ and follow the instructions.

It is 100% anonymous! And not even the date is logged! So please answer with complete honesty and in absolute detail (where possible). Thank You!

That is all for this post… for today… for 10/10/10 (in some countries, not mine).
Hope you liked it and feel free to leave any feed backs on the comment section!

Check my Twitter for the whole shirt design (back)!!
Sincere.ly/Yours/IanLai