CSS Grid

If you’re starting a website design I want you to take a look at cssgrid.net. It is not only a good css framework for a start but it is also a perfect sample for an idea to treat your websites readable across all devices and platforms.

It shows you how to:

  • make use of a grid on page – so you can easily match content margins in multiple rows
  • make the website accessible for phones, tablets and other different resolution devices
  • allows to upload hi-res images to look great on hi resolution apple retina or google nexus 10 display
  • it also claims to work on all browsers

You could also use it over a CDN like cdnjs to increase your page load speed!

Enjoy!

CDN Hosted Javascript

This is totally not new, but a really nice feature I’ve discovered – using “CDN Hosted” javascript libraries, e.g. jQuery.

All you need to do is add an external reference the resource in your HTML, e.g.:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>

This gives you multiple advantages, as:

  • you don’t have to store files on your hosting
  • you don’t have to worry about caching
  • you can decrease the bandwidth usage of your server
  • most likely you site’s overall performance will increase
  • you’re able to write a “single html” page e.g. for testing reasons using heavy JS / CSS frameworks, and send a single file over e-mail & etc.

I would like to see Blueprint CSS framework to be hosted on CDN too, but for testing reasons I can just use their test CSS directly when I need it.

See example:

Or usage in my CC validator trial page: http://blog.cikas.info/try/luhn.html

I like Microsoft’s explanation why CDN should be used:

Content delivery networks (CDNs) are composed of “edge cache” servers that are strategically placed around the world at key Internet network points. These “edge cache” servers can be used to cache and deliver all types of content – including images, videos, CSS and JavaScript files.

Using a CDN can significantly improve a website’s end-user performance, since it enables browsers to more quickly retrieve and download content. For example, instead of having a browser request for an image traverse all the way across the Internet to your web server to download, a CDN can instead serve the request directly from a nearby “edge cache” server that might only be a single network hop away from your customer (making it return much faster – which makes your pages load quicker).