Techode

Category: HTML-JS-CSS

  • Dynamic Form Templates with CFInclude

    Dynamic Form Templates with CFInclude

    ColdFusion is a pretty powerful language when it comes to managing all your server / enterprise resources, but it is also useful to manipulate user interfaces.

    In this post, we speak about using the CFInclude tag to build intuitive user experiences.

    To start with, here is our problem. We had multiple pages in a website, and all of them were used to capture data. The issue was, none of the fields captured were finite. We had to capture (into a database) fields that were different across forms. Creating a table for each form was impractical – so it had to be into a single table. To reframe in a more technical wording, the problem is to insert key value pairs from multiple web forms, into a common database. A fairly simple problem, but the expectation was also to ensure a good user-experience. Here’s an illustration of how we went about solving it.

    (more…)

  • New found love for the Foundation Framework

    Foundation is a beautiful framework for authoring HTML JS websites. I believe that this framework stikes a perfect balance between being just right ‘heavy’ while accomplishing what a designer-developer would want it to. What more, it also comes with a customization package to help you keep it simple. But that said, it is the framework that helps me get over all the repetitive’s, hard to get aligned kind of coding. I am a fan of the grid system it offers.

    Now, Foundation isn’t a school kids tazo. It is a mature framework, and there are other of the same kind. I reached foundation after a long ride across the internet searching for the lightest CSS framework. All I wanted was a base to write my HTML code on. Something that would help me confine my effort to a single good browser, and having to worry less about browser incompatibilities. I came across Skeleton. Read a little about it on its website. And it seemed to be the very thing I was looking for. I loved the minimalist, simple, light-weight css framework that Skeleton is. Adapted well on mobile, but fell short on one aspect – Fluidity. So, there started the search again!

    Yeti

    I’m also amazed at the activity it attracts on Github. The project has 15K+ stargazers, 3K+ forks, and sees issues being fixed every other day. This fact alone convinces me to a large extent on adopting this framework. No one wants to be left in the lurch, right?

    Here are a handful of things that makes me go back to Foundation for my next web app.

    1. Fluid CSS Framework
    2. Mobile First Approach
    3. Bundled Components
    4. LESS and SASS/SCSS support

    I think Foundation has all the goodness of, clean, easy to use, fluid CSS framework. Templates for the newbies. Mobile first approach, and yeah, also has a mascot!
    Sure it isn’t light, but if you know what exactly you want, you have an option to ignore some of the bundled goodness during download.
    All components come bundled along with SASS/SCSS support.

    Explore Foundation…
    http://foundation.zurb.com/

  • Coping with incompatible browsers

    bwsrCompt

    You hear of new software’s to browse the internet before you know it, be it new browsers or new versions. But how many of these really run the code on your website as expected? In spite of the W3C’s (World Wide Web Consortium) attempts to establish common standards, not many browsers comply, not to mention the oldest browser around, Internet Explorer. At the same time, you cannot expect users to use a W3C compliant web browser. Ask a newbie if s/he knows what Firefox is. “Fire… What?” would be an expected answer. If you are building a website, make sure its runs on atleast the popular browsers around, IE, Firefox, Chrome, Opera and Safari.

    Here I list a few browser compatibility problems I’ve faced, and how I managed to solve them.
    (more…)

  • Maps : Zoom into appropriate location

    Visitors end up seeing the entire world on the map when GeoCoordinates are not available.

    There are two ways to combat this,

    Either position map (calculate longitude) based on the timezone from system date,
    The entire map is still seen, but the map is positioned with the visitors location at the center.

    Below is the map show to a visitor from northern South America, instead of all continents.
    mapsCentered

    Here is how to do it,
    (more…)