RSS
 

Archive for the ‘CSS’ Category

Which Technology To Choose?

03 Jan

Since this seems to be interesting for a lot of developers, I thought I’d share my thoughts:

Introduction

Which technologies to choose is getting increasingly more difficult for developers, web and embedded alike. Questions like “Why Java?”, “Why HTML 5 (HTML + JavaScript + CSS Modern Extensions)?’, “Why C++?”, “Why PHP?”, “Why Python?” or “Why not something else?” are not easy to answer. There are many advantages and disadvantages in using any of these programming languages and environments. Within these languages there are even more possibilities of choosing development tools called frameworks. When talking of frameworks, I mean jQuery (JavaScript), OpenLayers (JavaScript), (Geo)Ext (JavaScript), Twitter Bootstrap (HTML5), Drupal (PHP), Symfony (PHP), Java EE, Wicket (Java), Hibernate (Java), GWT (Java -> JavaScript), just to name a few I’ve had the pleasure (and pain) to work with. More and more I’m coming to the following conclusions:

Choosing The Path Of Least Resistance

Maximum Gain With Minimum Pain

This has always been my main goal with the development tools I choose. After all, computers are there to make our lives easier and not harder. You might be surprised of some of the choices I’ve made with OS and tools. While choosing the Windows or MacOS platforms seems like the easier path, Linux and yes, the command line, actually have proven easier or at least more powerful by now. So, what seems the easiest at first might be harder in the long run and vice versa. Also, Linux tooling for web or any kind of development is far better documented, supported and a lot cheaper (free). So, if you are like me (and most other people) and have more time than money, it is probably worth your while to learn and invest (time, at least) into Open Source. It has had a great return in terms of moral and now even monetary rewards. There are companies out there that invest their staff’s’ time and resources into Open Source. Among those not least Google and Facebook, the biggest Internet companies in the world!

Frameworks

Frameworks might in fact make life harder rather than easier. Sure, I use many framework in my work, but sometimes it seems like learning and choosing a framework sometimes takes longer than writing your own and using it. At least attempting to write your own framework(s) has proven as a good exercise for learning how to use them and vice versa, choosing a framework and using it might give you ideas on what to do and more importantly on what not to do. Now, I haven’t written my own complete framework as yet, but I have started doing so. I guess once you start your own framework, you are never finished. The main framework I am working on since about 2 years has been a client side spatial portal application framework called the LcrToolkit (Landcare Research Toolkit, used on http://ourenvironment.scinfo.org.nz, http://smap.landcareresearch.co.nz and others to come out soon). Thinking back now, I could have come up with a more original name for it, but that is just a side note. It is a very specialised framework for putting up spatial portal applications. Learning to use a framework is a big time commitment, whether this is Microsoft .NET, PHP (Symfony, Drupal, …) or Java’s many frameworks. So, if it were for saving time, some people say, use .NET, because some people believe the ads that the time investment will be minimal. This (in my opinion) is wrong! Learning PHP and JavaScript frameworks can be achieved much faster, because these languages (at least the basics) are very simple AND they are openly developed with tons of documentation and since they are free, there is a lot more support from developers and advocates. Not only do these developers innovate and support free products because they are super nice people and want to make the world a better place, they develop Open Source products, because these products live longer and if they are good, attract a lot of developers. This is not only because Open Source is better, but also because developers get credit for what they have achieved. Furthermore, Open Source is very competitive and therefore secure. To get your name out there as an Open Source developer, you have to be (one of) the best. That means you have to compete, BUT always in a friendly and respective manner. To be the best, you have to be prepared to fail to succeed. You have to be open to being corrected and that is not always easy to handle. To get back to Frameworks: There are a lot of them out there and I have named a few already. It seems like there are simply too many. The more I research frameworks, the more time I could spend trying them all out. The possibilities are endless. So, one must put a vigorous filter into ones research. Lately, I’ve been wanting to implement a testing framework inside the LcrToolkit and eventually went with qUnit (JavaScript), not because I think it is the best, but simply because I do not have time to try them all. qUnit is simple, well documented and works just fine. Surely, there must be more advanced testing frameworks for JavaScript, but qUnit is easy to pick up and that is the main criteria these days for me. Things like Hibernate and JPA don’t really appeal to me. They are bloated, take a lot of time to learn and don’t really gain you anything. The only benefit you get from ORMs is that you are “independent” of a particular database management system. Just use PostgreSQL for Christ’s sake. It is the most advanced database out there, and yes I mean the most advanced DBMS. It is superior to even Oracle and far better than MySQL or Oracle’s DBMS. Not that Oracle is a bad company… anyway, I’m missing the point. Frameworks: There are so many that one cannot grasp all of them. I’ve been a bit of a grasshopper on frameworks. I’ve worked with Drupal, Joomla, CiviCRM, GWT, Wicket and all of the above and have taken away that frameworks are great, BUT cannot replace good developers. You need to be thinking all the time about security, look and functionality of your app, whether it is a web app, website or even “just”  an embedded program.

To be continued… ??

 
No Comments

Posted in CSS, HTML5, Java, JavaScript, jQuery, Linux, OpenLayers, PHP, Plugins, Programming, Web Design

 

HTML5 Mastery – Anselm Bradford & Paul Haine

19 Feb

In HTML5 Mastery Anselm Bradford and Paul Haine present the complete set of new elements that HTML5 has to offer.

This is for the beginner as well as the advanced level web developer/designer to learn the new techniques for developing standard compliant web sites/pages.

If you are a web developer and know the basics of HTML and want to take that leap forward into a new era of web standards, this book is for you. Anselm and Paul describe all of the elements that have been added by the time of writing in a very efficient and concise way. Examples of use and use cases make the context in which these elements should be used very clear and explanations are kept simple in order to maximise the readers understanding. If you are looking for a book that gives a complete overview of HTML5 you have come to the right place. If you are looking for a book going into detail on the new JavaScript APIs, this book gives you an idea of what you can do but is by no means the focus of this book. The focus is more on HTML5 as in its markup elements. So, in essence, it serves the title well.

Chapter 1

Here the authors describe how HTML5 came about and what the history behind it is. The reader gets a general introduction to an HTML5 documents basic structure and its ease of implementation compared to previous standards.

Chapter 2

In Chapter 2 "Using the right tag for the right job" the old and new elements are described in detail. It is filled with a lot of information on how to effectively use the correct element in the right situation. If you need a refresher on old elements and need to know new elements, this chapter is for you.

Chapter 3

This is all about semantics. The aim of the standard is to provide for a semantic web that is better searchable and discoverable. The main thing I got out of this chapter is that HTML should be used to optimize content and not for styling. The good part here are a lot of diagrams that visually explain the concepts and outline the tags and their usage.

This is not a complete summary by all means. I merely try to give an overview and make you aware of this book’s use. This book is useful for designers and web developers alike. What I got out of it is a lot of information that I wouldn’t have even looked up because I wouldn’t have thought of it. It is definitely a must read for web oriented people who want to embrace the advances of HTML in the 21st century’s second decade. If you would like a complete reference and understanding of markup, this book is for you. If you are a pure programmer and want to know more about HTML5′s canvas and video element’s API, this book only scratches the surface. However, all you need to know is what is possible and this book is good at telling you that.

 
No Comments

Posted in CSS, HTML5, JavaScript, Review, Web Design

 

CSS Quirks And Tricks

24 Aug

This is to document some CSS tricks and quirks that can be used to optimize a site’s look. This post aims at documenting all the little tricks that I found out through the Internet or by myself for easy reference.

Avoid overflow effect

The best way to fix this seems to be to force the scrollbar to be on in Firefox (and other browsers). You simply add the following to your CSS:

html {
  /* needed for it not to jump pixels */
  height: 100%; 
  margin-bottom: 1px;
}
body {
  /* needed for it not to jump pixels */
  height: 100%; 
  margin-bottom: 1px;
}

Avoiding overflow in the body to move the content to the left when a scrollbar is shown is done by giving the body a slightly smaller width. This is not a beautiful solution but should work in most scenarios. E.g.

body {
  width: 95%;
}

Internet Explorer clear fix

It took me a while to figure out how to fix this in IE. The problem is that IE does not render a div on the next line if you do a clear: right on the last div in a line.
To fix this issue, you need to create another element after the last element in a row:

.col1 {
  float: left;
}
.col2 {
  float: left;
}
br {
  clear: both;
  display: inline;
}
<div class="col1">some content</div>
<div class="col2">other content</div>
<div class="col1">some more content</div>
<div class="col2">more other content</div>
<div class="col1">even more content</div>
<div class="col2">even more other content</div>
<div class="col1">some content</div>
<div class="col2">other content</div>
<div class="col1&gt;some more content&lt;/div&gt;
&lt;div class=">more other content</div>
<div class="col1">even more content</div>
<div class="col2">even more other content</div>
 
No Comments

Posted in CSS