Ajax, javascript and XML

What is AJAX?  According to wikipedia “Ajax (shorthand for asynchronous JavaScript and XML) is a group of interrelated web development techniques used on the client-side to create interactive web applications. With Ajax, web applications can retrieve data from the server asynchronously in the background without interfering with the display and behavior of the existing page. The use of Ajax techniques has led to an increase in interactive or dynamic interfaces on web pages. Data is usually retrieved using the XMLHttpRequest object. Despite the name, the use of XML is not actually required, nor do the requests need to be asynchronous. Like DHTML and LAMP, Ajax is not a technology in itself, but a group of technologies. Ajax uses a combination of HTML and CSS to mark up and style information. The DOM is accessed with JavaScript to dynamically display, and to allow the user to interact with the information presented. JavaScript and the XMLHttpRequest object provide a method for exchanging data asynchronously between browser and server to avoid full page reloads.” So basically AJAX is a technology which can be accessed by javascript using the DOM. It will load information and update information dynamically without having to reload the whole page.

What is javascript? In my definition of javascript, its a script based language, which is performed on the client side to create dynamic and interactive data on the web. According to wiki, the definition of javascript is “an implementation of the ECMAScript language standard and is typically used to enable programmatic access to computational objects within a host environment. It can be characterized as a prototype-based object-oriented^[4] scripting language that is dynamic, weakly typed and has first-class functions. It is also considered a functional programming language^[1] like Scheme and OCaml because it has closures and supports higher-order functions.” Javascript can be used to create pop-ups window, to either alert users of certain aspect of your website, or to just simply show an ad. Javascript can also be used to create hacks to override and fix css styling to help cross browser compatibility  issues. Javascript can also be used to store cookies in users computer. Javascript is very powerful and with the addition of libraries such as JQuery and Mootools and others, it even makes life that much easier for web developers to design and create their website with ease, and to know they have the entire communities help doing so.

What is XML? According to wiki “XML (Extensible Markup Language) is a set of rules for encoding documents electronically. It is defined in the XML 1.0 Specification produced by the W3C, and several other related specifications, all gratis open standards.” I use XML to add data to my website using PHP. XML is an universal language and can be understood by almost all languages, wether its php, .net, ruby, javascript etc.

Open Source

Understanding the power of open source.  It is the next big thing. In this day and age, everyone is all about working together  to make things better. Open source is the  ideas and developement of a program, or software by an entire community of people. So how does this apply to code you ask? Source code is a work a lot like book, written by one or many people. The source code is copyrighted by the authors, whether they copyright or not, its automatically done. The author can then decide to distribute the the source code as they like. The distribution will only give rights to the recipients of using the code. This is how they defined open source in wikipedia “Open source describes practices in production and development that promote access to the end product’s source materials. Some consider open source a philosophy, others consider it a pragmatic methodology. Before the term open source became widely adopted, developers and producers used a variety of phrases to describe the concept; open source gained hold with the rise of the Internet, and the attendant need for massive retooling of the computing source code. Opening the source code enabled a self-enhancing diversity of production models, communication paths, and interactive communities. Subsequently, a new, three-word phrase “open source software” was born to describe the environment that the new copyright, licensing, domain, and consumer issues created.” My personal description of open source is that its a free sharing of informaion, and everything should be open source as this only promotes better developement of technologies, programs , softwares., and more usage of such products. Out of the many open source, I enjoy using wordpress, firefox, codeignitor framework, cakephp framework, symfony framework, php itself is a great open source language. For database, I love using MySQL. Its a great open source for anyone who like to create databases for their website, or blog in particular.

Web 2.0 is all about Interactive technologies.

Not too distant past we were dealing with the early stage of web, the timeline I am talking about is 1991-2003. Before we can get any more frustrated with downloading a site, page by page, with not much happening other than what the webmaster intended for us to see, hear, or download, Web 2.0 emerged. The era of interactivity begins. The timeline is 2004 to present. Its all about interactivity on website, user based, data driven, dynamic driven websites. Using of javascript, and jquery library is a great way to create interactive websites. Javascripts is a client side scripting language which can be used to store cookies in users website, create poll, calender, store and save data, send data. Flash and actionscript is also on the best technology to create interactive websites, where web developers can create games, interactive documents, where users can input to get certain outputs. Flash is also good for developing mobile based web applications. The best technology driven language I love is php and its integration with My SQL. Most website that is driven with some kind of data, is usualy created with php and mysql. PHp is one my best web language, which let’s to create dynamic websites and also helps me write less code to produce dynamic websites in less.

SEO and Analytics

SEO and analytic are two very important topics for a public website.

Having your site or your client site SEO (search engine optimization) ready, is a great way to bring traffic. The Wikipedia defines it as “Search engine optimization (SEO) is the process of improving the volume or quality of traffic to a web site from search engines via “natural” or un-paid (“organic” or “algorithmic”) search results as opposed to search engine marketing (SEM) which deals with paid inclusion.” The leading search engines for today are Google, Yahoo and Bing. Millions and millions of people are searching using keywords on these giant search engines everyday. The main goal of SEO is to rank your site as high as possible once someone initiates a search using keywords. The way it works is search engine has spider bots that crawls the web for information and stores it within the companies server. Then the “indexer” will use those information that has been stored by the spider, and determine various values, such as links to other pages, keywords, locations of words etc. Google allows webmasters to control which page should be crawled and which pages shouldn’t. By creating a xml site-map, we can guide the spiders to crawl pages according to links. Also having a robot txt file placed on the directory can specify and instruct spiders to not crawl certain pages and folders. We can also create meta tags to prevent a page from being crawled.

Discussing Final Project

For my final project, I have chosen BZOD art gallery. The goal of the project is to design a very simple and elegant website. I have worked on few wire-frames before deciding on the final concept. My wire-frames were all done in my sketchbook. I feel more comfortable working in pencil and paper before moving onto the computer. It makes things easier for me. So for the final design I have chosen a simple yet elegant site. The color and theme would be bright and clean looking. After finishing the wireframe and choosing the final concept, I moved onto my computer to create the mock-up. The basic idea behind it is to create a clean site which wouldn’t interfere with the actual art works that would be placed inside it. For instance, if the design of the site is visually strong and colorful, the art pieces that the site would hold won’t stand out, and that would be a negative result for an art gallery site.

My design starts off with the logo on the to left. For now , that feels like the safest place to put the logo, as when people would arrive at the site, first thing they should notice is the name of the gallery. I have also placed the search box on the top right side, across from the logo. The idea behind that is also the same, as I want people to notice the search box just as quickly ad easily as the logo. The search box is for easier usability of the site. It will help people who are in a rush to find what they looking for instead of navigating through the site. Underneath them is the main menu, and right underneath that is the header/slides and news of the top topics of the site. It will hold about 5 different topics that can be scrolled up and down, or manually chosen. When the audience likes a topic, they can simply click on it and will be taken directly to that article and gallery. I have also placed a “bread-crumbs” underneath, which would be in clear view of the audience, so they would know where they are and not feel lost. It would also be helpful for anyone who arrives at a page other than  the home-page and the bread-crumb would give them a sense of navigation to where they are in the site. This site will also have a member section, which has loin information on the left corner right below the top header. Right below that, there will be a scrolling box with news event, important topics, future event notices etc. The main contents of the site will be placed on the right portion which would have about 80 percent of real estate oppose to the left side. Finally, the footer, should consist of 3 or 4 column. Out of the columns, one would have few recent twitter feeds, one would have few recent heading of blogs, another column would hold important links, and last column would be optional. Below that there will be the menu once again for better usability.

Discussing Augmented Reality

I have been fascinated by Augmented Reality for a long time now. I have just never had the time in between school and job to sit down and actually learn the damn thing. But it is definitely on the top of my “to do list”, right after graduation off course. In the article “Top 5 Trends of 2009: Mobile Web and Augmented Reality“, the author Richard McManus talks about how it is the hottest thing this year as it has been implemented in almost anything from mobile applications to kids toys. I have a feeling AR will find its way into the whole social media and before we know it, we will be using Facebook with 3D technology. We will be tweeting in 3D and read blogs and watch the story unfold in dramatic 3D.

As I was searching along , checking out the latest gadgets and technologies, I came across a YouTube video of how book writers are implementing AR technology to create story books for little kids. The idea is brilliant, mom and dad won’t have to read bed time stories anymore. Kids can read or in this case visualize themselves. There are couple of ways to enjoy the book, one is to use a computer and camera to reveal the 3D story, or get an actual virtual goggle. Now I am not sure how much the goggle would cost, but I am perfectly happy with the web cam for now.

For a more practical use of AR, head on down to Rayban’s Virtual Mirror website and see for yourself in first hand, how this beautiful technology is being used for business purpose. Viewers will have to download and install a small executable program, intended only for PC users (sorry Mac people), and using their own web cam, they can try on any of the featured glasses on their collection. Unfortunately, I am on a mac, and my pc is not linked up with a web cam, so I couldn’t experience it on first hand, but here is a YouTube video of someone who did. Check it out by clicking here.

Now Imagine the possibilities, shopping for clothes and accessories. You won’t have to leave your house. Use something like the Rayban’s Virtual Mirror to try on the new shirt, or pant and see how it looks on you and then simply click and shop. The possibilities are endless.

Imagine Google with AR technology. They already have something called Google Goggles, which is still on the earliest stage of development. It is available for only android powered phones. The idea behind Google goggle is visual search technology, which uses pictures to start a search. So if you are out and about, and wanted to know about something or curious about it, just snap a picture and search, and Google will do the rest. The part that makes me more interested is where they implemented the AR technology for local business. You simply point your phone towards the business with the camera, and the GPS system will locate the business and send all its information right to your phone instantly. So Fasten your seat belt people, we have a lift off, next stop is… “The future”.

Design Techniques and Green Solution

The first article “You Got Design Right – Now ‘Write’ Design!” by Davethackeray, talks about how designers and writers think similarly when it comes to their line of work. As I read through his article, I found it very interesting as how he made connections to all the guidelines that both designers and writers follow to do their projects. I personally think its 100% true, that no matter what the profession is, whether it is a writer, photographer, singer, painter, designer… everyone should have one goal, which is to make their piece interesting and appealing to their particular audiences, if not everyone in general. And to achieve that their is a similar guideline that everyone can follow, similar to the five step plan Dave wrote on his blog, including the Five Ws and the H.

On other note, the article 20 Ways to Streamline Your Web Business by Mike Smith, talks about some real good ideas to stay sharp and ready in the field of Web-Developing. He talks about having templates of generic HTML and css codes that are almost always used on every projects instead of re-writing them over and over, which to me is an excellent time saver. The file cabinet idea is not my cup of tea. For some reason, it screams out Global Warming . We should be in the habit of saving things digitally in this day and age, off coarse, its possible to loose digital information, thats why having more than one back-up is ideal. So instead of file cabinet, which is sure bulky, takes up room, and sure increase of our carbon footprint, we can just buy couple of external hard-drives, and save all our paper-works digitally. And if thats not enough, there are many more ways to save your work digitaly as well. Just like practical storage companies popping out everywhere in the last few years, digital storage companies are also surfacing. Just do a search for “Storage and Backup Services” and shop around.

Talking about carbon foot print, using the Internet is not exactly the greenest way, oppose to print technology. Unless we use servers and hosting companies that are dedicated to use Eco technology to power their business. I have done my own research and found many hosting companies that are completely green, meaning they are not burning any fossil fuel, they are simply using wind and solar power to generate their electricity to run their servers and computers.  We should take some time off and look into and support companies with green technologies. Its is our job to protect the earth and secure the future. Below is a list of Hosting Companies (not in any particular order).

1. SuperGreen Hosting
2. GreenGeeks
3. HostPapa.com
4. GoGreen Hosting

My thoughts on Gerry McGoverns article “The Best Websites are Useful and Ugly”

It’s the year 2010, I am hoping to graduate from NYCCT with a Bachelor Degree in Advertising/ Graphic and Web design before the summer hits. Now if I look back to my early days and my limited skill on web and graphics,  I can’t help but to laugh. I have still a lot to learn in this graphic and web industry but at least now I believe I have the basic knowledge on the do’s and dont’s of web design and have some clue about good design vs bad design, what should work and what shouldn’t.

Now a days an ugly website would be a site that is so basic that it almost has no design, no style. Google’s home page for instance. Its simple and right to the business, few artist and designers would laugh at it. Craigslist is another example. However as the author of the article “The Best Websites are Useful and Ugly” Gerry McGovern states, the ugliest of the bunch such as Google, Craigslist, eBay etc are actually rolling at the top of the list in being successful.

His theory starts off by explaining how nice and elegant is not required to bring success, its functionality and usefulness which does.  He explained more with an example of  grand canyon, which  is a place of beauty, but to actually live their like a normal city would be tough, due to inaccessibility. “The things we think are the most beautiful are often the least useful in a practical and functional sense.” He backs that up by saying how gold and diamond rings are beautiful but they serve little to no purpose on practical functionality.

He believes more beautiful the design gets (particularly on websites), harder it becomes to keep it easy and functional. He uses Ryanair.com as an example to show how an ugly and simple website,  was useful enough to have many of its 42 million passengers  book their tickets directly on Ryanair.com, simply because it was a simple to understand and easy to use which led to a smooth transaction both for the company and the customers.

He uses a great logic on how most web designers focuses on making their design look cool, by having gray texts and smaller font size, instead of having black  and bigger font size. Reason being, smaller and grayer font looks “visually appealing” oppose to big and black font, which would “dominate the page” and “stand out” too much.

So in his conclusion he sums it up by saying “The fact is we don’t spend our time looking at websites. We spend our time reading and using them. There are three things a great web design must be: useful, useful and useful.”

So after reading and dissecting the article, I some what understand what he means. I believe, style and usefulness both should be considered to the fullest extents. I understand how a simple and easy to read website would be perfect for general audience, but sooner or later people will lose interest and in long run chances of loosing fellow visitors will be highly likely as they discover the same information on a much more cooler site which is visually more appealing.

We are humans and we get bored easily, so to keep our interest on things, it is necessary to keep us entertained, and in the web industry visual aspect is definitely something that should be prioritize. It’s all about competition now, leaving opportunities for your competitors to improve on things will lead to stealing your audiences as well.