Deciphering Website Design – WebProgramming, Databases & AJAX
Unlike Javascript, web programming languages are full fledged programming languages. They are also known as server-side programming languages because a server translates the code and then returns the necessary information back to the browser in HTML format. So if you ever see webpages ending in .php or .cfm or .aspx in your address bar then that page was created using a web programming language.
How does a web programming language work though?
Well we first talked about HTML, which is just static data – meaning that the information on the webpage doesn’t change unless someone manually changes it. With a web programming though every time a web programming language loads it can bring back new information directly from say a database. Let’s say you’re a web programmer and you want to display dynamic information on the webpage by bringing something from the database, maybe the most recent member that joined your website. Let’s assume you have a small database, we’ll talk more about database in the next section, and it stores the name and email addresses of the members that have signed up to your newsletter.
A web programmer will start with a webpage similar to a normal html/xhtml webpage. They’ll then add code on the page using the programming language and change the name of file to something like NewMembersName.cfm instead of NewMembersName.html. They’ll then upload the file to their website host, just like you would upload a normal html file. But in this case it will work a bit differently. Normally when an HTML file is requested the server just sends all the information to your browser and your browser displays it for you, that’s why HTML is static. In the case of a web programming language, the process works a little differently.
If you request example.com/newmembersname.cfm then the server will first parse through the code on that page, and then once it’s found the newest member from the database it will display that information where the programmer originally wanted it placed on the webpage.
Then once it’s finished the webpage is sent back to your browser. And since the information that it sends to your browser is only the pure html you’re browser can easily display it correctly. This is why it’s called Server Side Programming because it doesn’t matter whether your browser supports Coldfusion MX, PHP or other languages because it’s the server’s job to decipher that programming language and turn it into HTML that you’re browser can easily understand.
If you tried to upload a newmembersname.php file to a server that didn’t support that programming language then the server wouldn’t know what to do with that file and it would just allow you to download the file normally, along with the code that the programmer used. But since the server, atleast in this scenario, does support Coldfusion MX it wouldn’t display any of that code to you, only the parsed HTML.
When I first saw a dynamic page I used to wonder what makes this page so special, the code looks just like HTML. Well that’s because it is HTML it’s just that the server had already translated the web programming language that was part of the .cfm page and turned it into HTML that you’re browser can easily understand.
Viola, and that is how a Web Programming / Server Side languages work. You’ll find commonly used web programming such as PHP, ColdFusion MX, and ASP.NET. Php is free and open source and you can usually see it in action for files ending with .php extensions. Coldfusion was originally developed by Allaire which was then acquired by Macromedia, which is now part of Adobe Systems. Yes the same company that created Adobe Photoshop and the PDF file format. ASP.Net is part of the Microsoft .NET framework. I’m a big fan of Coldfusion MX, so you’ll have to believe me when I say ColdFusion MX is the best in this galaxy, unless you think I might be a bit biased. Oh well.
Allright you’ve gotten this far, might as well read up on how databases fit into the whole schema of things. Actually the concept of database is fairly easy to understand. It’s used to store information. I mean just think about it, without a database how would Hotmail verify you’re password, how would MySpace remember the comments that you left on your friend’s myspace page which you wish you hadn’t when you were drunk.. Moving on. That’s because it was stored on a database. There are several different databases. You’ve proabably heard of Microsoft SQL Server, Oracle, MySQL which is opensource and free database, and also Microsoft Access.
To speed things along let’s just assume that you’ve created a database and also a few tables to store information in. One of the tables is to store email addresses for your visitor, maybe another one for your blog, and maybe another one for your members area account information.
How would you communicate with the database though? Good news, there is a standard language in place that is used to communicate with databases. It’s known as SQL Query Language, not to be confused with SQL Server. SQL, Structured Query Language, is not a programming language, it’s a computer language that’s used by almost all major databases which allows you to write queries that can be run to access and manage the data stored on your database. You can write a query that brings back the newest record for the newest member. The database will execute the query and bring back that information for you.
What if you have specific information that you want to search for, like a book on Amazon.com. Your web programming language will take the information which you entered into the search box on the webpage and then once you click go it will take what you entered and combine it with the SQL query and send it off to the database to let the database try and find that book. Once the database finds the book it brings that back and the web programming language will display it accordingly.
You can also use SQL for searching for information, adding new information, updating information, deleting information and other advanced queries. I say advanced because if you want to store tons and tons of data and manage it correctly then you’ll need to work with a RDBMS, a Relational Database Management System.
Why RDBMS? Well let’s say you went to Amazon.com and you bought a book. The Amazon database creates a record and then remembers that you bought this book. But what if you decided to buy 2 or 5 books, would it make 5 additional accounts with your names and address along for each of the 5 different books that you bought. NO.
Relational Databases are used in such cases to decrease redundancy ie: get rid of repetitive information. An RDBMS database is designed so that the tables are tied, related, to each other and they know how to manage information correctly.
In this case they’ll have a table for your account and another table which keeps a track of all Amazon products. Now in realtiy I’m sure Amazon has more then just two tables infact an RDBMS system can often take up dozens and dozens of tables to help increase efficiency, and help reduce redundant information.
There you have it. Now you know how the website development technologies work and how they all fit in together. For more about Website Development visit a resource that is number one of my list of bookmarks: w3schools.com. Here are some links that you might also like:
CSSZengarden.com,
SitePoint.com,
Wikipedia CSS – en.wikipedia.org/wiki/Cascading_Style_Sheets
So what’s next. If you’re interested in furthering your skills then I would suggest learning more about AJAX. Ajax is not a language. It’s actually a methodology which combines several technologies that are already available and combines them in such a way that it makes AJAX websites appear dynamic, almost like the software installed on your computer. In normal web page you would type in the name of a book. Once you press enter, the webpage forwards that information which is sent to server-side programming language which then adds it to an SQL query to search the database for that book. Once you’re on the next page that information is displayed on that page.
BUT with AJAX once you press enter the AJAX takes over. The DHTML detects your click, calls on the javascript, which uses DOM – Document object model to access the information you entered. The Javascript then sends that information to a web programming page. The webprogramming language, which ever one you decide to use, checks to see if that books is available in the database. If the book is there then that information is sent back to the browser. The Javascript, using XMLHttp, detects that the information has arrived and then uses DOM to show the information back onto the webpage without the webpage ever refreshing. The effect are pretty amazing.
I’m sure as the web evolves we’ll see more and more amazing technologies. If you’re interested in keeping up-to-date with these technologies then I would recommend subscribing to some of top newsletters in the industry – CNet, ZDNet, SitePoint, and Lockergnome.
Enjoy!
Sam runs http://www.WebsiteDesignHouston.net, a Houston based Website Design firm which helps entrepreneurs and businesses build their online presence. For more information visit the above link or if you’re interested in seeing Ajax In Action http://www.websitedesignhouston.net/Ajax-In-Action.cfm
Test Your Website for Multibrowser Compatibility
In the beginning, there was the mighty Netscape Web Browser. Remember that one? Ten years ago, the now ubiquitous Internet Explorer was fighting to take down the market-leading Netscape Browser. Well, we know who won that battle. While Microsoft’s Internet Explorer is undeniably the favorite of web surfers everywhere on the planet, there are other often-used browsers that you should be aware of.
While you don’t need to spend months adjusting the design of your website to fit all of the different browsers, you should test your layout on the most commonly used web browsers of your target audience. Usage statistics from w3schools.com for March of 2007 were as follows: MS Internet Explorer (58.7%), Google’s Firefox (31.8%), the Mozilla Suite, Opera, and Safari (4.6%). Netscape and other lesser used browsers make up the remaining 4.9%.
What should you take away from these statistics? Obviously you want to design your website primarily for Internet Explorer (IE) and Google’s Firefox which is rapidly growing in popularity. Since most of your visitors will likely be using one of these popular browsers, you want to ensure that your html tags, table types, and programming scripts are all supported by these browsers. Test table alignment, background colors, layer position and any seldom-used html tags. Remember to test at more than one screen resolution and more than one color depth.
If your site is designed for the general public, then you don’t need to pay too much attention to design testing on the other browsers previously mentioned. However, if you have a tech-oriented site that targets early adopters or tech-savy individuals, you should reconsider. There is a large group of internet users with a hatred for all things Microsoft. They use open-source operating systems (Linux or Unix) which often include Mozilla or Opera web browsers.
In this case, many of your visitors may be using these less common browsers. You would need to test your site on these types of web browsers. If your site targets users in the graphics or print industry you may also need to test for different browsers. Many people studying or working in these industries use Apple computers which come with the Safari web browser installed.
Testing your website on as many different browsers, screen resolutions, operating systems, and internet speeds will help you to avoid any design problems you may encounter later. When I started designing one of my earliest sites about ten years ago, I neglected to test my site on different browsers or different resolutions. Six months into the design process, I discovered that the tables on every page were out of alignment when viewed with the Netscape browser. It took more than two months to correct that and some other small design flaws. I learned to plan and test more comprehensively after this blunder.
My recommendation for any new web designer is to download and install Firefox, Netscape, and one of the Mozilla browsers onto your testing computer. They should not conflict with one another, and they will allow you to discover any bugs early on, before one of your site visitors has to tell you. I currently surf with IE, Firefox, and Netscape. Doing this allows me to take the perspective of different visitors to my websites. Testing your website thoroughly during the design process will save you from wasted time and lost visitors later on.
The author is the developer and operator of numerous sites on the web. Authors can gain free quality backlinks to their sites at http://www.articopia.com
To learn more about website design and testing visit http://www.articopia.com/computers-and-internet/
Using Reprinted Articles for Free Website Content
Updating your website is an all-important component in attracting repeat visitors. The more often you update your website with new content, the more frequently visitors will return to your site. Aside from updating all of the content yourself, or paying someone to do it for you, you can also include royalty-free articles in your website, blog, or ezine.
This is an easy alternative that does not require any registration or subscription in order to obtain reprintable content. If you have a website about landscaping, for example, you could update your site daily with one or two new articles about landscaping techniques or case studies. You can get these articles from a single article directory, or download them from several different directories. Almost all article directories allow their articles to be freely redistributed or reprinted, provided that the links and “About the Author” resource box are left intact.
You can search for a landscaping category within the article directory, and then copy the articles onto your computer. You can format the articles to fit your website layout and upload them periodically to your website. You get free content targeted to your website visitors that has been chosen by you.
When reprinting these articles, be sure to check the redistribution guidelines you must adhere to. After all, these are intellectual property and the wording should not be altered in any way. While you are usually free to alter the layout, font, and colors in the article, the text itself should not be edited in any way and should be shown in its entirety. The most important thing to include is the Author’s name, website link(s) and any other information listed in the author’s resource box.
Some of the bigger article directories have thousands of royalty-free articles on a wide range of topics. Many of these articles are less than two years old and have been written by professional article writers and authorities in their respective fields. Be sure to only select articles that have been written well with few or no grammar, spelling, or syntax mistakes. While there are many insightful, well-written articles; there are also a great number of thinly-disguised sales pitches and pure spam articles.
Reprinting articles relating to your other website content and theme is an effective and easy way to keep your website current. You can also include these articles in any other email or ezine marketing that you do, provided you follow the redistribution guidelines.
The author is the developer and operator of numerous sites on the web. To browse and download thousands of royalty-free articles on different topics, visit http://www.articopia.com
Unique Website Design – How To Increase Usability & Profitability With A Unique Website Design
It’s important to improve usability of your website with unique website design principles. You get about one second to get the attention of your visitor. This article will discuss how to grab their attention with unique website design and keep it.
No matter how brilliant your unique website design is, if it is hard to reach the content of your site then your site is as functional as an empty shell. Here are some tips to improve the usability of your website to guarantee it serves its functions optimally.
The primary method of unique, effective and profitable website design is to make sure the typeface of your content is fitting. If you have great blocks of text, make sure to use CSS to space out the lines accordingly. The longer a single line of text is, the bigger the line-height of each line must be. Also, make sure the font size of your text is large enough to read without problems.
Some websites have 10-pixel-tall text in Verdana font; while that may look neat and tidy, you have to really strain your eyes to read the actual text.
Another method of unique and profitable website design makes it trouble-free for visitors to locate content that they want on your site. If you have thousands of articles on your site and a certain visitor wants to stumble on one single article from that stack, you have to provide a practicable means to facilitate visitors to do that without hassle.
Be it an SQL-driven database search engine or just a glossary or index of articles that you have, providing such a element in your unique website design will make sure your visitors can use your site with ease.
This next method of unique and effective web design is absolutely critical and I can’t stress the importance of it enough. Ensure that your site loads fast if you do not want to lose visitors. Most internet users will leave a website if it doesn’t load entirely within 15 seconds, so make sure the creme de la creme of your website is delivered to the visitors as soon as possible to hold on to their attention.
Last of all in my discussion of unique, effective and profitable webdesign, test each and every link on your site before it goes online. There is nothing more successful in tarnishing your professional image than broken links, so be very careful about that.
Copyright 2007. Give your websites a complete makeover with my powerful website design software and morphing tool. Take a walkthrough video tour and witness first hand for yourself how easy it is to transform your website and maximize your online profits now at http://www.kaleidosite-pro.com
Small Business Web Design Development – Small Business Web Design Elements You Must Always Avoid
There are some critical web design development elements that small business owners must avoid when creating their website. This article will discuss what these elements are and how to correctly develop and design a website for small business.
As a web designer, you have to create your websites to give your visitors the utmost ease of use, the best feeling and most important of all a welcoming experience. It doesn’t matter if you had the greatest merchandise in the whole world, if your website is badly done you won’t be able to sell even one copy of it as visitors will be driven off your website by your lousy web design and development.
When I’m discussing a “good design”, I’m not just talking about a good graphical design. A professional small business web design will be able to point out that there are many mechanisms which are put in place in order to create a good and effective website design — accessibility web design, interface or layout web design, user experience design and of course the most clear-cut, which is graphic design.
Consequently, I have highlighted some characteristics of the worst web designs I’ve come across. with any luck, you will be able to compare that against your own site as a checklist and if anything on your site fits the criteria, you should know it’s high time to take severe action!
Small Business Web Design & Development Number 1 – Background music Unless you are running a site which promotes a band, a CD or anything associated with music, I would in actuality strongly advise you to stay away from putting looping background music onto your site. It might sound enjoyable to you at first, but envisage if you ran a big site with hundreds of pages and every time a visitor browses to another page on your site, the background music starts playing another time. If I were your visitor, I’d just turn off my speakers or leave your site. furthermore, they just add to the visitors burden when viewing your site — users on dial up connections will have to wait longer just to view your site as it is meant to be viewed.
Small Business Web Design & Development Number 2 – Extra large/small text size As I said, there is more to web design and development than purely graphics — user accessibility is one huge part of it too! You have to design the text on your site to be readable and reasonably sized to allow your visitors to read it without straining their eyes. No matter how first-rate the content of your website or your sales copy is, if it’s hard to decipher you won’t be selling anything!
Small Business Web Design & Development Number 3 – Popup windows Popup windows are so unashamedly used to flaunt advertisements that in my mind, 90% of popup windows are not worth my consideration so I just close them on instinct every time each one manages to pass through my popup blocker and, well, pops up on my screen. Imagine if you had an extremely vital message to put across and you put it in a popup window that gets killed most of the time it appears on a visitor’s pc screen. Your website loses its purpose straight away!
In concluding this article, let me remind you that as a webmaster your job is to make sure your website does what it’s meant to do effectively. Don’t let some inconsequential errors stop your site from functioning optimally!
Copyright 2007. Give your websites a complete makeover with my powerful website design software and morphing tool. Take a walkthrough video tour and witness first hand for yourself how easy it is to transform your website and maximize your online profits now at http://www.kaleidosite-pro.com