Utilizing Public CDN for common scripts like JQuery

Are you in a dilemma to use public CDN or go with self-hosting for common scripts?

Take a quick and bold decision to go with public CDN. Using Public CDN is the best way to provide optimal experience to web users.

Some people think Google like enterprises don’t maintain servers as we do! Some time they are proven to be rite!!

Best practice to use Public CDN for common scripts

1. Always use minified version on production
2. First pull your script from the CDN
3. Check for the script availability
4. If script download fail, load script from your host

Example implementation:

Google CDN

<script
src=" http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" >  < /script>

<script >  

!window.jQuery && document.write(' < script src="js/jquery-1.7.1.min.js" > < \/script > ')

</script>

Other Popular Public CDN

MICROSOFT

http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js

JQUERY

http://code.jquery.com/jquery-1.7.1.min.js

Do you want know why? Want to know what's under the hood? Never settle, go ahead and dig deeper, I am of your kind..

Why? What is the benefit of using a public CDN?

To understand this you need to know the basics of Internet and Browsers.

Let’s start with internet connection standards defined on HTTP 1.1 specification by W3C.

Browsers limit the number connections to the same domain irrespective of no. of tabs opened. Following are some findings from the internet for maximum number of connection limits.

Firefox 2.x       : 2
Firefox 3.x       : 6
IE 6/7               : 2
IE 8                  : 2 on dialup,
IE 8                  : 6 on broadband
Chrome            : 2
Safari               : 2
Opera 9.x         : 4

This is as per the HTTP 1.1 specification (which is currently live on 20^th March, 2012) in the RFC 2616 Section 8 (Connections) under 8.1.4 (Practical Considerations) in the last paragraph.

“Clients that use persistent connections SHOULD limit the number of simultaneous connections that they maintain to a given server. A single-user client SHOULD NOT maintain more than 2 connections with any server or proxy. A proxy SHOULD use up to 2*N connections to another server or proxy, where N is the number of simultaneously active users. These guidelines are intended to improve HTTP response times and avoid congestion.”

Link to RFC Document: http://www.w3.org/Protocols/rfc2616/rfc2616-sec8.html

So when you load a page, browsers make only specified no. of concurrent connections to the server to pull resources. So serving static content from different domain origin will save your domain quota on same domain origin. I’ll explain more on improving performance in a separate post.

The next big advantage of using public CDN is from the Browser behaviour / feature. Most browsers support strong cache mechanism to optimize network usage and improve user experience.

Caching is a mechanism to capture and store the recent or most commonly accessed static content in a small storage space. The storage space mentioned here is a browser cache in the client machine. It could probably be a temporary internet folder.

For example if an image or script file is downloaded from the internet it is preserved in a temporary internet folder with its origin for a span of time. The span could be determined by the headers. Defining headers go beyond the scope of this topic so we’ll discuss it in a different post. So when next time the same file is requested, it is available to the browser from the local machine cache instead of downloading from the server.

Assume, the user visited a site, say SiteA which use public CDN for JQuery script file. Now the user visits your site and we assume you use the same CDN for JQuery script file as the SiteA used. This time the JQuery will be available to the user from his local machine cache and it is instant. This makes your site work faster.

Let’s go back to Advantage of Internet. It is on CDN technology. CDN is an abbreviation for Content Delivery Network. You can treat this like a server backed by many number of servers from geographically diverse locations. When you seek a resource the server helps to serve it from the geographically closest server. For the any file copied to the host server will be replicated to servers inside the provider CDN all over the world. Basically if time of travel reduces speed of delivery increases.

Leading Through Good Times

It is all about being  responsible and understanding simple objectives

Career is almost a half part of an individual's life. For many it is the most part of life. Keeping work and life balanced is a thought at the age of 35 and above at the time where you missed all your valuable ages of life.

I use to have monthly feedback meeting where I allow my sub-ordinates to complain on me! or I can say a feedback meeting. Initially it started with most complaints and over a period they stopped complaining. They appreciate very rarely! But do it from their heart which is the best compensation I enjoy for my hardwork.

I always believe, the sign boards and branding are not the company but the people and stake holders are. As a manager, I trust my responsibility is to keep my stake holders happy and satisfy their requirements. I understand I am a representative of the organization. My stake holders are people who I work for and with who I work. Essentially, my customers, my sub-ordinates and finally my managers.

I am valued because my customers are happy for which my sub-ordinates help me to keep them happy. So I need to give first priority for my customers followed my team. My managers wish the same order so the ecosystem is balanced and focused towards the common business objective of keeping customers happy.


Stop blame game and work as a team

I strongly believe mistakes made by team member is mine.

Absolutely, there is nothing to blame, nothing to harm. After all it is a team work. Mistakes can be taken for discussion to identify the root cause and solutions could be discussed to avoid such mistakes in future.

I found some leads point out mistakes in a way it harm the developers. It leads to depression for the developer and frustration for both. It also makes the developer feel inferior.

If the developer don't write the code well, it is the mistake of the person who hired the developer or the one who trained him or even it could be because of the SDLC practice. Don't you agree?

Most leads and managers forget their role in a team. Being a good team player he should identify the strength and weakness of every resource and make the resource a valuable asset to the organization. It is also every manager's responsibility to mentor the sub-ordinates. Their career/life is trusted on organization which in turn handed over to a responsible manager or lead.

Reminding how many mistakes we did and never took efforts to correct them. Jumping companies and being promoted as managers! Ha, after all is it not true? Even if not for you, you accept this truth with your known circle. But I'll say it is nothing wrong. Everybody does mistakes. It is about accepting them and correcting it with the right spirit. In fact man who does many mistakes could be a better manager.

A senior programmer's single page of code could have dozens of bugs. It lies on the perspective and application. Sometime, following best practices doesn't work all the times for all the applications. It isn't just my statement but the best practices itself. It says best practice for most applications but not all.

Treat mistakes as learning milestones and not as crime. Document mistakes and prepare a best practice manual for your organization.

I agree, mistakes costs. It has to be budgeted. Even if it is unacceptable, it is practical. Sometime, it is called as buffer time!

Never do it

I have noticed leads and project managers writing code sitting next to developers and keep in sync with development process. While it is appreciable for a manager to contribute code, it is offense to ignore the responsibilities of a lead or manager.

It will speed up development but extends time of the project. Contradicting? Yes, most of your time should be spent on code reviewing and to comply with objectives and milestones. Find places to improve, identify re-usable code, help developers to be more efficient and organized, define metrics, tabulate resource utilization and identify ways to maximize of productivity, arrange for performance meetings, arrange for technical training, work closely with testing teams and development teams, work closely with business team and customers. I promise you, you won't be finding time to sit on a developer desk.

If you deny doing the above, basically you have problem with your team. Be bold to rebuild your team. A good craft man requires good tools. Here tools include resources/brains too. It is a business call. Try to help people get on-board with required skills, if it is not affordable let the team understands it. Have a open meeting. Investing on good brains are important than investing on infrastructure and assets when your business is majorly run on brains.


Managerial roles are commonly circled as Projects, Business, Human Resource, Marketing. Finance and Operations. Understanding the circle is very important and being effective inside the circle helps the organization more than trying to penetrate in to next. The top level management helps coordinating inter-circles.

These points are out of my experiences. I would be happy to discuss it with your comments.

You could be a Leader - Years are not counted!

A Leader is not defined by years. Great leaders who ruled the nation where much younger than my grandpa!

It is about leadership qualities. Be wise, be gentle, be truthful. These are the first step to become a leader.

The second step is tendency to help and grow along, acquiring knowledge on the field of expertise and gradually learning more on the eco-system.

Third step is to be proactive, being grounded and focus on what you do.

Finally, you never have to promote yourself as a leader, your qualities will do.

Warning! Big Mistakes Goes Unknown

Most managers in small and medium size projects trust Developers for Testing. Please don't! I am stating  this because, I am a Developer toO! Trust me nothing offensive here.

Naturally, at least as far as I experienced, developers are blind to some mistakes which are identifiable only by a non-technical Genius. Allow developers continue to innovate. Have a weekly review meeting with developers, testers and managers to  discuss where things went wrong.

I am not totally against developers testing their module. Performing a unit test is an essential part of any developer's role. He could have understood the functional part but not as effectively as a functional expert do. Sometime, due to stress and late night builds, big mistakes on some usage scenarios goes unknown if not tested by testers other than the developer who developed it.


If your project budget don't allow you to add testers, try peer reviewing. However, you should try to accommodate at least one testing resource for functional black-box testing in every project irrespective of its size.

In my experience, I've realized many mistakes been unnoticed until a stage where it runs successfully for months or in some cases years. Yes, such missed mistakes are very rare to find and rarely affect the systems, otherwise could have been identified in the unit test or at least over a short term alpha or beta period.

But these rare mistakes could have taken away many orders in an e-commerce environment or missed many figures in a financial application or given a wrong guidance in statistical application. Trust me sometime spelling errors could take away the clients from you.

My sincere request to all managers: Despite the project size, please take testing as an serious part of SDLC. Don't wait till the last minute until the development is completed to test. Include testing as an integrated process and do frequent testing and implement an effective feedback system, where it could be efficient if the interaction happens directly with tester and developers on daily basis. Frequent mistakes could be bulleted  for a weekly review with a power point.

Database Programming with ASP.NET C# & MySql

Today I find some time to discuss Database Programming with ASP.NET C# & MySql

A BRIEF INTRODUCTION ON ASP.NET C#, MYSQL AND WINDOWS STACK

Software Requirements

1. MySQL DB with Work Bench
   DOWNLOAD LINK: http://www.mysql.com/downloads/
2. MySql Connector for .NET
   DOWNLOAD LINK: http://www.mysql.com/downloads/connector/net/
   Download the binary and install to your machine where you need to run your application.
3. .NET Platform / Visual Studio
   DOWNLOAD LINK: http://msdn.microsoft.com/hi-in/netframework/default.aspx
   You may download and install the .NET framework of your required version 1.1/2/3.5 or 4.
   This article supports all the above mentioned versions.

MySql Database Creation and Table Creation
I assume that you can create MySql Database and Tables I proceed to the C# Programming part

Web.config File
The following is a simple connection string statement I use in my development practice. You may also ignore Web.config and write the connection string inline on the code page. But it is not recommended as it is vulnerable to disclose your database credentials (Database Username and Password) in the code page. Say you may have more than one developers working on the project and you many not want to share the database credentials with them, this practice will help you the most. Apart from this the content in the web.config file is more secured than content in other pages by the ASP.NET architecture.

Syntax:

<add  name="<give some name to call this connection string>"
              connectionstring="server=<server ip address or name>
              initial catalog=<database name>
              uid=<database username="">;
              pwd=<database password>"
              providerName="MySql.Data.MySqlClient"/>

Example:

<add  name="MyConnection1"
              connectionstring="server=localhost;
              initial catalog=mysampledb; 
              uid=root;
              pwd=mypassword" 
              providerName="MySql.Data.MySqlClient"/>

ASP.NET C#
Here I use ASP.NET and C# to explain the database programming with MySql. I assume that you have basic knowledge of ASP.NET and C# programming.

Go to the code behind and proceed with the following code.

1. Incluse the usings.
   
   using MySql.Data.MySqlClient;
   
   
2. Declare the private variables inside the main class (pls not the class not the main function)
   
   //CREATING CONNECTION INSTANCE / NOTE: CONNECTION WILL NOT OPEN HERE
   MySqlConnection con = new MySqlConnection(ConfigurationManager.ConnectionStrings[
                         "myconnstr"].ConnectionString);
   //CREATING INSTANCE OF COMMAND AND DATA READER / REQUIRED FOR ACCESSING DATA MANUALLY
   MySqlCommand cmd;
   MySqlDataReader dr;//CREATING INSTANCE OF DATA SET / REQUIRED FOR BINDING DATA WITH DATAGRID/DATALIST
   DataSet ds = new DataSet();
   
3. Opening Database Connection
   
   if (con.State == ConnectionState.Closed)
   {
     con.Open();
   }
   
4. Adding Data to the Database
   
   string qry = "INSERT INTO sample_table(first_name, last_name)";
   cmd = new MySqlCommand(qry, con);
               cmd.ExecuteNonQuery();

Introduction to C# / ASP.NET with C#

ASP.NET is a Microsoft technology for web applications. ASP stands for Active Server Pages. As the name specifies the pages are programs that are stored and executed on the server. When a call is made to the page the page gets compiled (if not already compiled) and returned to the client browser as a file in HTML and JavaScript combination. The .NET platform is a proven Microsoft technology for applications. ASP.NET is limited to Windows platform. We will discuss more about the ASP.NET and C# in a separate article soon.

Introduction to MySql Database
MySql is an opensource database backed by Oracle Corporation. It is a powerful and efficient database that you can rely on it for your enterprise needs. Most companies prefer MySql for their data storage needs and high transaction processing. MySql is reliable and programmer friendly too. It has a large user base and strong community to support. However, the PHP & MySql combination is the best pair on internet! It is not that C# doesn't go well with MySql but the opensource PHP beat the C# or any other language on Internet. Let us not worry about that! We have enough articles and resources for C# integration and programming with MySql and abundant help content for MySql. We will discuss more about the MySql in a separate article soon.

Corporate Website Development - A Practical Guide to IT Managers

I found many corporate going online with their entire corporate information put up in their website. Some may tried to protect it with a username and password but failed for even simple direct URL access including some law firms.

Apart from appealing web design there are a lot more factors reside in a corporate website like information architecture, content management, data integrity, information security (eg: role based content access), copyrights, search engine optimization, online reputation management, branding, socializing, identity theft protection, competition analysis, online marketing strategies and other legal compliance.

Warning! Information on a corporate website is highly sensitive as a press release. Any information communicated on the website is deemed to be authentic. 

Setting up a simple website with minimal information would be the safest way to start. You can always add content to the website over a period of time gradually.

What is an ideal start point?

A simple HTML website with minimal information like about the company vision and mission statements, a short story on history and timeline, other public information like corporate social responsibilities, list of services offered with short description for each, products and details as is available on the printed brochure, a contact page with location map and address with a contact form, a blog to communicate news and happenings. In addition, you may have a career section where you can display the current openings and an email address where people can send their profiles and apply for the openings.

This would typically require 2 weeks to go live. Now you may plan the larger website with the points we discussed in the first paragraph of this article.

The challenges in developing such a corporate website would involve the following but are not limited to this:

1. Identifying the information and architecture to be published online
2. Finding the right / updated information on-time; especially when the old information are not documented electronically
3. Coordinating with different teams/department to collect information
4. Getting legal clearance from law firm / legal consultant for legal terms online
5. Getting content organized and getting approvals from PR Office
6. Identifying creative partner / consultant on digital space for branding solution
7. Identifying right technical partners/vendors to offer the development solution
8. Identifying audit partner to audit process and results throughout
9. Finding right hosting partner who can provide consulting and solution
10. Implementing procedural maintenance models

Answering the below questions will help you build the basic blocks of the information architecture

• Why do you need a website?
• To ensure the digital presense and sync with the growing markets
• To spread awareness about the company and brand
• To offer information about products and service offerings
• To offer information for job seekers
• To generate leads / sales online and focus on e-Business
• To increase communication frequency with stake holders and customers
• To lower cost on communication by adopting digital methodologies
• List of details required to be published on the website
• About the company
• History of the organization
• Founder & Chairman with information
• Board of Directors with their information
• CEO Message
• CEO’s vision for the company
• Corporate Social Responsibilities
• Initiatives
• Awards & Recognition 
• Achievements
• Gallery
• Career
• Life @ Organization
• Employee Benefits
• Awards & Recognition
• Current Openings
• Application Form
• List of details to be collected from the candidate
• Who should receive the applications?
• Add multiple recipients to avoid unattended queries when a resource in on vacation
• How to track the status of applied entries?
• It is essential to track the communication as it adds value to the corporate reputation and user trust.
• It may go negative if not responded promptly. If the user could comment it on a blog or elsewhere, it could affect the corporate reputation.
• HR Contact Information
• Recruitment Procedure
• Contact Information
• Registered Head Quarters
• Provide Registered Corporate Name
• Provide Registered address
• Provide a permanent phone number of PR Office
• Provide a permanent email id of PR Office
• Legal Communications
• Provide a contact person name and designation
• Provide a address either corporate Office address or appointed Legal Firm address with Email, Phone Number and Fax Number
• Media Contact
• Provide a contact person name and designation
• Provide a permanent phone number of PR Office
• Provide a permanent email id of PR Office
• Sales Offices
• Attach a location map
• Provide contact person name and designation
• Provide address of the sales office
• Mention Toll Free for Sales, if any
• Provide phone number, fax number and a common email id for sales
• Mention if there are any limitations applicable for the sales office
• For example: Sales Office - Only for Petro Products, Sales Office – Federal Govt. Only
• Support Centers
• Attach a location map
• Give link to FAQ section
• Give an option to contact online through a contact form
• Provide address of the support center
• Provide phone number, fax number and a common email id for support
• Mention Toll Free for Support, if any
• Mention if there are any limitations applicable for the sales office
• Regional Offices
• Attach a location map
• Provide address, phone number, fax number and email id
• Branch Offices
• Attach a location map
• Provide address, phone number, fax number and email id
• Partner Offices
• Provide Partner Name and Partner Status / Badge
• Attach a location map
• Provide address, phone number, fax number and email id
• Contact Form
• What are the information to collect on a contact form?
• Who should receive the contact messages?
• Does it require escalation mechanism if a query is not responded or if it is opened for a long-period?
• Products & Services
• Product Category
• Product
• Image Gallery
• Description
• Features
• Video Presentation
• Story on the product
• Data Sheet
• Brochure (PDF)
• Case Studies
• Awards & Recognitions
• License Terms
• Purchase Information
• Sales Contact Details
• Locate Dealer / Partner
• Dealer Name
• Dealer Address
• Dealer Phone
• Dealer Fax
• Dealer Email
• Sales Contact Number
• Toll Free Number
• Sales Desk Phone Number
• Quick Enquiry Form
• Who should receive the enquiry?
• Services
• Service Category
• Service
• Creative Image
• Service Descriptions
• Quality Statements / QoS
• SLA Highlights
• Contract Models
• Case Studies
• Brochure (PDF)
• Awards & Recognitions
• Sales Contact Details
• Locate Dealer / Partner
• Dealer Name
• Dealer Address
• Dealer Phone
• Dealer Fax
• Dealer Email
• Sales Contact Number
• Toll Free Number
• Sales Desk Phone Number
• Quick Enquiry Form
• Who should receive the enquiry?
• Solutions
• List of solutions offered in diversified verticals
• Case Studies
• Fact Sheets
• Brochures
• Technologies
• Research & Innovation

Gathering data and identifying information

Website is competitive and challenging where we need to offer maximum information to the user at a very short time, because our competitor’s website is just a click away.

The best way to approach is to present with graphics and bullet point information.

Citing the proverb “A picture worth thousand words”, we must find innovative and creative way to present information to convince the customers. Present information graphically (Infographics).

Present crisp information rather than pages of data. We need to collate and process data to find useful information. For example, assuming your product runs efficiently and saves energy, don’t share the data sheet of the product on the first sight but a nice infographic of the rounded percentage of energy saved using your product instead. This will attract the user to read the data sheet and buy the product for its good reasons.

Gather information from various departments with a planned procedure. It is the most challenging and hardest part of the entire process. You need to educate various departments about the quality of content you require. You may not process all data on your own as it requires intensive functional / domain / field / product knowledge. The process could become easy when there is a print brochure. However, digital space is more demanding where your information should be more appealing and detailed (video presentation for an example).

Information Gathering – Plan & Execute

Take this to be a separate project. Plan the information structure and get it approved from the Marketing Team, Product / Category Manager, Brand Manager or the CIO / CTO / CEO. The authorization level differs to organization industry and organizational structure. However, the roles I listed here would give you an idea.

Consult with few of the department heads to identify time taken to prepare the information required. Plan a reasonable average mean time and add 10% to 15% buffer to it.

Circulate the request for information along with the structure/template, dead-line to submit information and an example to all the departments. Share a helpline number and email to contact you for clarifications.

Offer them contact details of photographer, video specialist, and any other resources required to prepare the contact.

Once the information is collected, send it to proof reading and copyrighting. Include marketing team for enrichment of content. Include business analyst to identify key points to prepare infographic and bullet points. Share the points with creative team to develop creative elements for the web pages.

Once the content is prepared, contact a consultant to help you co-ordinate with technical partners. Prepare a Request For Proposal (RFP) with the help of the consultant and approach couple of technical vendors. Have a meeting and discuss the project. Share the RFP and collect their proposals. Call them for a pitch and choose the one with innovation, strategy, standards and the one focus on long-term relationship.

Experience is another factor to consider while choosing a technical partner but not necessarily, your consultant could help you identify the reliability of the vendor. In case of going with a fresh vendor, try to get some demo work done as proof of work. 

Do not negotiate for the lower cost, it always ends in poor quality output, negotiate for guaranteed quality of work with specifications and negotiate for reasonable cost. The quality is invisible until it causes damage. Most companies try to find cheap providers to execute the task which is harmful to the entire corporate security in later stages. Also it increases maintenance cost over a period of time. Plan your investment and find the right provider. I’m writing an article on Corporate Security and Web. I’ll share the link here once I finish the article.

Document the project execution from beginning till the end of project. The document should include the contact person, their availability, contact information from both the ends. Specify the project timeline with milestones clearly defined and penalty for extensions. Sign a SLA and NDA with the provider.

You may enter the billing agreement on hourly basis or project basis. Your consultant could help you to negotiate in this area. Mostly it depends on the service provider engagement model. However, as a customer you have the right to demand the way you want to be billed.

In a typical business model you may share 20% upfront on SLA agreement as advance, 40% on demo release and 35% on final release. The 5% could be hold for the service extension period / warranty period (say, 3 months from the date of final launch).

Maintenance

Post launch you need the technical provider to offer maintenance. The maintenance should include backup / restore operations, minor changes to the static content, security protection (virus attacks, SQL Injection attacks), Any application error due to non-compliance of requirements document, database maintenance, work with hardware/hosting and networks provider to ensure quality of service and manage technical tickets posted on the website.

Maintenance cost are negotiable based on the size of the website and work involved. However, in a typical scenario 30% to 35% of development cost will go in to maintenance.

It is recommended to go with CMS based solutions to reduce maintenance cost for bigger projects. CMS solutions can be used by non-technical users to update website content. However, it could limit the flexibility in development of your requirements.

Security Audit & Testing

Appoint an external audit agency to evaluate the implementation and do security testing to ensure information security. The security of information is at risk if you ignore testing procedures. Any unauthorized intrusion could lead to change in the information at your corporate website without your knowledge. It is strongly recommended to work with a 3^rd party security testing company other than the vendor who developed the website.

Do proper documentation and sign an SLA and NDA with the security testing vendor. Your consultant could help identify key points to include.

Security testing should be done periodically as the internet evolves rapidly. Also perform testing for every major change in the website at application level or in the web server.

.. will be continued

Google to introduce Semantic Search with AI touch

AI is not new at Google but this is a major roll out of search mechanism and result presentation. Many sites may pushed down where Google to display content or in other words answers to user searched queries.

For instance, query "what is the time in Chennai now" will display the actual time followed by list of websites related to the keywords (time, Chennai, etc). But not just this AI but Semantics where it relates every important word to each other to identify relations and present results more meaningfully like a human.

Google revised its search logics with AI (Semantic Search)

Possibly, Google want to increase time-on-site and compete with its next level competitors like Facebook and Twitter which claims more time-on-site.

Prior search results were delivered based on keyword as primary aspect with many other aspects. Now, Semantics will be the primary aspect and others will continue to contribute.

But list of search results vary because of the major change in the primary aspect. Now uncivilized! (non-standardized) HTML codes should be re-coded to adhere semantic structure to get listed on Google Search Result Pages (SERP). HTML5 comes with out-of-the-box solution for Semantic document.

Few of the AI algorithms are rolled out already the above screen shot is an example of the same. However the full roll-out is expected to be a major revision in the search engine and Amit Singhal of Google said it is estimated as a year-long process.

Read more about Semantic Web:
http://www.w3.org/standards/semanticweb/
http://semanticweb.org/wiki/Main_Page
http://www.lrmi.net/

How to become an UI / UX Expert?

"#1: Focus on the user and all else will follow" - Google

Audience: Focused on web based UI / UX; HTML Developers; People who are interested in UI Component development like calendars, popups, screens; Web Designers who work with HTML, JS, CSS; Any fresh mind to enter UI / UX field of interest

What else is in this article?

In addition to the above question, I’ve answered the following questions in this post:

1. What does UI / UX means?
2. What is the role of an UI / UX expert or a front end developer?
3. What is the job description (JD) for a UI / UX developer or front end developer?
4. What should one learn and master to become a UI/UX expert?

UI/UX Designer / Developer

There are many ways to describe an UI Expert. But never to misunderstand with Web Designers and other Photoshop experts who are called artists or creative designers.

UI stands for User Interface and UX stands for User Experience. UI / UX designers are also called as Front End Developers.

UI / UX expertise is beyond creating PSD layouts with Adobe Photoshop or with any wireframe/mock design tool. It is about giving a meaningful and effective life to the application. UI/UX experts need to understand the usage patterns, align with end-user requirements and focus on usability and accessibility (We will learn about accessibility in a different article. I’ll link it here once I complete the article.). The UI/UX designer need to coordinate with layout designers, backend developers, and other stake holders (especially the customer) and has comply with industry standards  to bring long-life to the application which is of most useful. UI is an art, engineering, and area of specialization.

You need years of experience to acquire extensive knowledge in UI. Since UI is about learning user behaviours and usage patterns, of course standards and best practices are available to make it easier to learn and adopt. But the length depends on your interest and length of your day spent on technologies. 

What you need to learn?

• Wireframe Tools
• Pencil
• MockFlow
• Cacoo
• Mockingbird (Paid)
• Creately (Paid)
• Justinmind (Paid)
• OmniGraffle (Paid)
• Flow Diagram Tools
• yEd
• Markup Languages
• Understanding a Markup Language
• Understanding SGML Standard
• HTML
• XHTML
• HTML5
• XML (For XML Developers)
• DOM 
• Understanding DOM Structure
• Understanding Objects
• Understanding Parsers
• Understanding APIs
• DOM Elements
• Manupulating DOM using JavaScript DOM API
• JavaScript
• Scripting
• OOP Concepts
• Understanding Memory, Scope and Namespace
• Mastering OOP based JS Programming
• Understanding Script Engines
• Understanding ECMA Standard
• Understanding Cross-Browser Chanllenges
• StyleSheets
• XLST (For XML Developers)
• CSS2
• CSS3
• Framework (Good to master at least 1 of the below frameworks)
• JavaScript (Common for any language / web)
• Yahoo UI (YUI)
• JQuery
• Dojo
• Ext JS
• Prototype
• MooTools
• Sencha Touch
• Script.aculo.us
• Java
• GWT (Google Web Toolkit / Java)
• XUI (Java)
• Swing (Java)
• OpenXava (Java)
• Phython
• Django (Python)
• Cheetah (Python)
• PyQT (Python)
• PyJamas (Python)
• Framework (Commercial Licenses – Good to master at least 1)
• .NET
• Telerik
• ComponentArt
• Infragistics
• DevExpress
• JAVA
• Vaadin
• SmartClient
• AJAX (using PHP / .NET / Java)
• Essentials Knowledge
• Web Typography
• Browser Communication
• Page LifeCyce
• HTTP Protocol
• Client-Server Communication Basics
• Internet Protocol
• Networks
• Security Basics
• UI Best Practices & Design Patterns
• Cross Browser Compatibility Techniques
• RIA Concepts
• Web2.0 Concepts
• Accessibility Concepts (WCAG, Section 508, etc)
• Data API (Web Service, SQL, XML, etc)
• MVC Concepts
• Web Service Concepts
• WF/WCF Concepts (.NET)
• SOA Concepts
• REST Services
• SDLC (preferably Agile/Scrum)
• Testing Procedures (Unit, UAT)
• Documentation Procedures
• Nice to have knowledge but not mandatory for all companies
• Adobe Photoshop
• Adobe Flash
• Adobe Flash Action Script
• Adobe Flex is a plus
• Plus Points
• Certificate in Technologies
• A degree in Computer or related field

Tags: User Interface, UI Developer, UI Designer, Front End Developer

Cloud: HTML, JavaScript, CSS, XHTML, HTML5, AJAX, Flash, Flex, RIA, GWT, JQuery, Prototype, Django

Who require UI / UX developers?

Any product owner require UI / UX developer starting from any small applications till Google search engines are depend on UI for reaching mass audience and gain popularity. UI gives meaning of life to any application.

Difference between Struct and Class in c# (Struct Vs Class)

There is a FAQ I get from people: What is the difference between Struct and Class as we can design an object using both?

Class is a Reference type and struct is a Value type. This means Class instance refers the address of another instance assigned to it but a Struct instance copies the values of assigned object.

In other words if we create 2 class instances A and B, and assign B to A then any changes made to B will reflect in A also. But in Struct, A will hold a copy of values of B and any changes to B will be independent.

Example (ASP.NET/C#):

public class Class1
    {
        public string TestValue { get; set; }
        public Class1() { }
    }

protected void Page_Load(object sender, EventArgs e)
    {
        Class1 A = new Class1(); //Create an instance of a class Class1

        A.TestValue = "1";

        Response.Write("A.TestValue: " + A.TestValue);
        Response.Write("<br />");

        //Assign B to A

        Class1 B = A; //Create another instance of the same class Class1

        B.TestValue = "2";

        Response.Write("B.TestValue: " + B.TestValue);
        Response.Write("<br />");
        Response.Write("A.TestValue: " + A.TestValue);
    }

Ranked 4th on Google.com for "Top 10 Rows in SQL Server"

 

Also ranked 4th on first page for the key phrase "difference between int and int32" out of 479,000 results.