Featured post

New Book, What’s HTML? Learn it in 4 hours

My first book, “What’s HTML” is now available on Kindle and Amazon in paperback form. This book is designed to be a quick way to learn HTML and HTML5.  It should also serve as a reference for you to look back on for refreshers and information on tags that are commonly used. This is a great resource for students and professionals that need a quick reference or wish to learn the basics of HTML quickly.

As a computer science professor, I’ve taught thousands of students HTML over the past ten years.  I wrote this book to help teach others HTML in a simple easy to read format.

Paperback edition

Kindle edition

What's HTML

“What’s HTML”

Technical Leadership Survey

I need your help.

I hope you’ve enjoyed my podcasts and talks over the past few years.  I’m trying to focus my content a little more and come up with topics that are more in tune with the needs of my audience.  Please spend 2-3 minutes filling out a survey that will help me create great content for you in the future.

To help me out, please fill out the survey at https://www.ageekleader.com/survey/

Thank you so much!

John Rouda

Create Purpose to Motivate and Spark Creativity – My TEDx Talk

I’m super excited to share my TEDx Talk.  I gave this talk at TEDxHickory in March, 2015.  Please share with your friends and give me some feedback.

What’s HTML? – Now on Audible – Free Book

Get your FREE Copy of What’s HTML? when you signup for a 30 day trial of Audible.  Use the link below to get a copy of this fantastic HTML book by John Rouda


How HTML Functions


The Hypertext Markup Language is generally saved in the text format and is specifically invented to be viewed and edited on any computers’ operating system that is capable of linking to the internet. The XHTML is the newer version of the HTML, designed to apply the use of extensible markup language syntax and rules to allow web developers to persist in their development of advanced web pages. The documents contain tags comprise of an opening or closing tag, to complement it as a well-formed document. The opening and closing tags will have similar names although they will be preceded by the “/” symbol.

Speaking of how HTML works, you should be aware that any related documents should be completed with a HTML and BODY tag. They are needed to be displayed in the web page. Other tags that you will commonly observe in the HTML pages include those called TITLE, HEAD and P or paragraph tags. The tag of HTML in the code will declare the document to type the term “HTML” in the web browser. The tag having the sub-tag of will display the Title in the web page as well as storing the Meta data and Javascript information for the web browser.

Subsequently, the tag contains other displayable data in the Hypertext Markup Language document besides including the header tag of declaration. It also defines a new paragraph tag. Albeit the availability of the page to be displayed without the tags being correspondent to their closing tags, they are somehow not considered to be a well-formatted document. In fact, these documents may encounter errors in displaying the necessary data if the tags are not properly closed.

Some people may want to know how does HTML work to embed pictures. Mostly or virtually all internet browsers are created to embed images either in the JPEG, PNG, or GIF format as well as newer ones supporting the SVG format of display. The HTML code will play the role of providing references to any images stored on the web server, along with the details of the size or Meta information. These data are required in order for the images to be displayed properly. If the pictures cannot be retrieved from the server, an alternative platform of information is always included to provide backup details for people who face difficulties viewing the images. Among the common tags used to display pictures in the HTML documents is the tag. The image code will try to rediscover the image as well as displaying the message of “my test image” to the end user if it happens that the image cannot be viewed.


Source link

Web Application Development – Basic Knowledge


The internet has undergone a sea of change ever since it came into existence. The evolution of the internet has not stopped but it is still developing while this article is being written. Somewhere someone is developing a new technology or trying to improve upon the current technology available for web application development. The positive changes are taking place on all the fronts of the internet. The best example for this is increase in the accessibility of the internet through not only the desktop computers but also the mobile phone devices.

The application development is about developing applications that can be presented forth the internet user in the form of a software package. The best and the most common example of application is the website.

The first thing to be known and understood before starting any development project is to assess its need. There could be different needs of the web application such as promotion of products or services or it could be sharing information or even just socializing. This is from the perspective of the web application owner. This is not enough. The web application developer needs to also consider the interest of the targeted audience or the market segment.

The technology is improving day after day and the application needs to be developed with the optimum use of the latest technology available. When the application is developed with the help of the latest technology the results are supposed to be better than that with the earlier old technology.

The security of the application is nowadays a prime concern of the web application developers. Nowadays the online buyers want to not only place the orders through the application but also want to pay the bills through the web application. This implies that the tools used for transfer have to be totally secured especially with reference to the username and password used for transferring the money.

When any web application is to be development, the developer needs to first decide about the type of service to be offered through the application. The three types of services that are offered through application are business services, user service and data service. Before commencing the work on any application project the developer should assess the resources available and the technical skills of the team entrusted with development. The budget allocation should be one of the prime considerations before starting the web application development.

Web application development can be completed in four stages. The first stage is about preparing the project layout the direction, focus and features of the project are included in this stage. The plan of the whole project is created in the second stage. Third stage includes project development as per the needs identified earlier. The project cannot be said to be competed unless the stability of project is tested. This checking is done in the fourth stage of application development. The development project has to be divided into the above mentioned four stages to ensure that the application serves the purpose for which it has been created.

Copyright © 2012


Source link

Do Alt and Title Attributes Help With SEO?


A highly talked about topic is the SEO world is, “Do Alt and Title Attributes Help with SEO?” Well to help shed a little light on this topic, I did some research and came up with a few good conclusions. I’m not suggesting these are 100% accurate but from my initial research they seem to be right on target. I welcome all other SEO experts to share their opinions on this topic by posting their comments – because as we all know, every little bit of information can help us all.

Well to start, I want to provide a brief introduction of each attribute to help you understand their “intended” purpose.

The alt attribute is, popularly and incorrectly referred to as an alt tag and is commonly misunderstood to provide a tool-tip for an image. Both of these are incorrect. First of all, the alt attribute is an attribute and not a tag. The alt attribute was always intended to provide alternative information about an element and is generally required for image and image maps and is not meant to be used to display a tool-tip. The alt attribute, can be used for the img, area, and input elements to help provide alternative information to users who cannot display that element in their browser. As an example, here is how you would define an alt attribute for an image: <img src=”imagepath.gif” alt=”this is our company logo”>. If the image is not displayed the text, “this is our company logo” will be displayed in the place of the image.

The title attribute, on the other hand, is meant to provide additional information about an element, which is displayed as a tool-tip by most graphical browsers. The title attribute can be used to describe any HTML element except for base, basefont, head, html, meta, param, script, and title.

An excellent use for the title attribute is to provide descriptive text within an anchor tag to let the users know where the link will direct them if they click on it. When the user places their mouse over the link, it will display a small tool-tip displaying the title text that you’ve provided. An example would be

So as you can see the alt and title attributes have different purposes but how do they affect SEO? This is the true question we all want to know and understand. Do they help with SEO or are they simply ignored by the search engines? I tested several different scenarios, all in Google, and after my research I’ve come to the following conclusions.

Alt attributes seem to be picked up by Google, whether or not there was a link within that element. Some SEO experts have mentioned that if there is no link, then the alt attribute would not be indexed… from my research I’ve found this to be false.

Going further, I noticed in one testing scenario, if there was an image with an alt attribute and a link to a completely other site, that other site was also indexed by Google when searching for the text within the alt attribute. It was difficult for me to verify this multiple times but I definitely verified it in one testing scenario.

I also took this one step further and analyzed my results with what Google Images was displaying. I immediately noticed that Google sometimes takes the alt attribute text and provides this text as the description for the image in Google Images, something that is very valuable to know and understand when doing SEO for your website.

In all of my testing scenarios, the title attribute do not seem to be picked up by Google and adding a link to that element did not seem to affect this result at all. If you really think about it, this makes complete sense. Since you can place title attributes in almost every element of a website, it would be very easy for a user to affect the search engines by keyword stuffing throughout their web pages, something that Google and the other major players do not want, hence why title attributes do not help with SEO.

In my opinion, you should use the title attribute to help with your user’s experience and not with SEO. Since tool-tips provide more useful information to the user about images, links, fields and much more, you will help your users to understand what is happening around the web page.

So from my testing I’ve determined that a title attribute is meant to provide tool-tips to the user for user experience, whereas the alt attribute is helpful in terms of providing alternative information to the user when their browser cannot display an image or input element and helping to increase the SEO of a website. My recommendation is to pay close attention to when, where and how you are using your alt attributes. If they help with SEO, then you should pay close attention to what you are adding.

When adding images always be sure to add an alt attribute to the code of each image. If you do not have one, then just specify a blank one, such as alt=””. Also, be sure to add alternative text that is relevant to that image, the content on that page and be sure not to specify an alt attribute greater than 100 characters in length, as this may be perceived as spamming.

I hope you find my brief overview on the topic of, “Do Alt and Title Attributes Help with SEO?” to be beneficial for you and your business. I’m sure one could dive deep into this topic, spending weeks determining the differences between how Google, Yahoo! and the other major search engines handle title and alt attributes with regards to SEO for a website.

I welcome all comments and/or feedback.


Source link

YouTube Buffering – How I Fixed YouTube Buffering Problem


I must confess that I am in love with YouTube. Ever since its launch, I spent a lot of time watching videos on YouTube. YouTube has been a source of information, education & entertainment. Something seems missing in my life if I stay away from it for a few days.

The most frustrating problem with YouTube occurs when there is buffering in videos causing them to lag. It mars the enjoyment of watching any video. It is a persistent and widespread problem. First I thought that it has no solution and I have to live with it. After some searching, I have found a handsome solution to avoid YouTube buffering problem. It worked for me and I am sure it would be useful for you.

Let me share my findings with you so that you can watch YouTube videos without slow buffering.

1. First of all you have to make sure that your are not downloading anything else at the time of watching YouTube video. If you are doing this, chances for buffering will increase many times.

2. It is recommended that you download and use some Video Accelerator tool. Fortunately, it is free and it will help you.

3. It is important that you test the speed of your internet connection. Multimedia and video streaming need high speed internet. You may need to talk to your ISP. In case your internet connection is fine consider optimizing internet settings through a system utilities software.

4. Most important of all optimize your entire PC. Clean Windows Registry, defrag Registry, optimize internet connection, clean system junk and optimize computer services. Performing these maintenance tasks on your PC will boost up browser and PC’s performance and you will experience less or no lagging in YouTube.

5. Install YouTube Auto-Buffer plug-in for Google Chrome or Mozilla Firefox. An Auto-Buffer plug-in is a script that buffers YouTube videos without automatically playing. It also removes in-video advertisements, puts the video in High Definition (HD) mode as the case maybe. Google it for more information.

6. Make sure Windows Update is not carried out simultaneously. As default, Windows updates are enabled. Your computer searches new updates online, downloads and installs them automatically. This process uses higher bandwidth and the internet speed is dramatically reduced till update process is finished. Click the upward arrow located on the Notification Area of your Taskbar, and make sure there is no Windows Update icon with message “Downloading and installing updates… “


Source link

Mobile Application Development Platforms (MADP) Classification


With the phenomenal growth of mobile app adoption, enterprises are faced with challenges to develop and maintain the apps that work on all these diverse platforms and devices to reach wider audience. Developers also face the challenge of maintaining consistent look-and-feel across device/OS.

Mobile Application Development Platform (MADP), as the name suggests, provides development tools and frameworks for building Business-to-Employee (B2E) and Business-to-Consumer (B2C) mobile applications. In addition to providing the tools, these platforms also provide middleware servers to connect and synchronize the data with the back end systems, eliminates the duplicate work by allowing business logic to be written and maintained in one place. You can build tighter integration with device features by using these MADP tools.

Following are the primary characteristics that any MADP tools should possess:

  • Integrated Development Environment (IDE): providing Visual Editors/Plugins, Form Builders, Property Builders, Debuggers and Source Control Integration.
  • Mobile App Development and Debugging: Explicit support for platform devices/emulators, platform specific code generations etc.
  • Multi-Device O/S support and integration: Multi-device platform support with Device Specific Code Optimization, Device Specific Runtime, Device Specific Feature integration and Tighter integration with device.
  • Packaging and Provisioning Mobile Apps: Supporting Native and Hybrid deployments, Single Build Process for all platforms, Inbuilt Application signing, Provisioning Flexibility of Single App – Single Platform, Single App – Multiple Platforms.
  • Middleware Server: Application server that hosts the back end service integration components managing the device registrations, security and transaction management. Also takes care of Mobile Resource Management based on User, Device & Network context.
  • Enterprise Application Integration: Adapters for integration with ERP/CRM and other Backend systems. Support for Data Mappers, Prebuilt Data Transformers, Data Chunking and Server Side Cache.
  • Security and Remote Management: Support for Device data encryption, disabling auto complete features, OTA based Application Management &Updates Device Capability Management (power consumption, networking).

On a broad level these MADP tools based on their development framework & packaging style can be classified into two categories

  • Native build tools and
  • Hybrid build tools

Native Build tools: This is a standard and traditional approach being following by the tool vendors who are in mobile market for long time. Products built on this approach provide sophisticated IDE tools to build application using their propriety frameworks. In this approach it is the responsibility of the tool to make the mobile application device agnostic.

Once the developer builds the mobile project in the tool and specifies the targeted platforms, it automatically creates the optimized native package for the respective platform. Platform/Device specific runtime not only takes care of UI screen optimization but also handles the memory, power &bandwidth management. These IDEs also come with platform specific property sheets for configuring features that are unique to specific platform.

Provides strong middleware features such as offline data synchronization, on device security, back end system integration, transaction management, serving the data based on user context etc.

This approach has its own share of Pros and Cons.


  • Provides sophisticated WYSIWYG editors, using drag and drop editor, script & expression builders and property sheet features
  • Guarantees platform and device diversity
  • Good Performance, generates optimized native based on the target platform and device
  • Time to market is very less, using write once and deploy on multiple platforms


  • Architecture is built using proprietary framework
  • Vendor lock-in
  • Requires learning a new skillset such as a new scripting language, a new IDE, etc.
  • Cost of ownership is high, license is Device/Session based and in very few cases it is CPU based

Top MDAP products that fall under this category are KonyOne, Antenna AMPchroma, Syclo etc.,

Hybrid Build tools: As the name suggests mobile apps built using these tools depend on HTML5 hybrid frameworks for building device agnostic applications. Products in this category, primarily concentrate more on providing the middleware server features that act as a gateway between the mobiles apps and backend enterprise systems. Most of these tools use REST Web services for integration with backend systems.

For building device agonistic UI, these tools depend on frameworks such as JQuery Mobile, Sencha Touch, Dojo Mobile etc. Using these UI frameworks, developer has to fine tune the HTML5 & CSS in the app to render the UI specific to the platform/device. For accessing the device features such as gallery, contacts, accelerometer, camera, GPS etc. these tools depend on hybrid frameworks such as PhoneGap/Cordova.

This approach has its own share of Pros and Cons.


  • Follows Open Standards, Architecture is built on top of open standards
  • Framework flexibility, allows developers to choose the type of UI framework tool they want to use
  • Skillset reuse, leverages existing investment done in web development skills
  • Vendor Lock-in is limited to security and synchronization features
  • Cost of Ownership is less, Licensing is liberal with the availability of open source tools


  • Does not guarantee device diversity, developer have to depend on UI frameworks to build cross platform UI and fine tune it to specific platform/device
  • User Experience Performance lags behind the native approach, hybrid code are not generally optimized to the specific platform on which app is running
  • Time to market is more, developers need to write/tweak the code for each platform and screen resolutions

Top MDAP products that fall under this category are IBM Worklight, Convertigo, SUP, OpenMEAP etc.,

Existing middleware vendors have slowly started looking into this approach. With their current power of providing robust middleware, security and EAI features they can easily build & add Hybrid Build MADP tool into their portfolio.


No doubt, Native Build tools with their strong feature set have always stood on top during any MADP evaluations, but they are unable to make fast inroads into organizations due to their inflexible licensing models and high license cost. Vendor lock-in is another bottle neck that is influencing CIOs to have second thought before going ahead with Native Build MADP tools. Due to lack of standards specification (eg., JEE, JDO) in MADP space, vendors have no choice but to build tools using propriety standards. This is a high time for tool vendors to come together to define standards in this space.

On the other hand Hybrid Build tools though having inferior features than its counterpart are making inroads into the organizations due their open standard implementation that revolves around HTML5, CSS3 and JavaScript standards. Due to their flexible licensing models and open standards, CIOs are unable to resist themselves from looking forward to buy these tools. The other main advantage of using Hybrid Build tool for CIOs is, now they can reuse their existing web development teams (with JavaScript, HTML, CSS skillset) to build mobile apps.


Source link

How to Create a Google Form


If you need a form on your web site, or to use internally at your business, Google Forms may be just the answer. A Google Form is easy to create and the results feed into a spreadsheet so you can do pretty much anything you want with them.

Here is how to create a Google Form. You will need a Google account to do this, so if you don’t already have one, go to docs.Google.com and sign up.

Step 1: Log in to docs.google.com.

Step 2: Go to New, then Form (the left-most button on the top navigation bar).

Step 3:Type in a title for your form where it says “Untitled form”.

Step 4:Type in any text to describe your form in the next box.

Step 5:The next box you see is titled Name. This is a pre-created form box for typing in a person’s name. You can leave it alone or edit it by putting your mouse cursor over it and then clicking on the picture of the pencil. You can also delete it by clicking on the picture of the trash can. The other icon, the two boxes, allows you to create a copy of it. This is the same for any question you create.

Step 6:Create your first question. Type in a question title. This can be an actual question or just a word such as Name or Address.

Step 7: If you would like, you can include Help Text. This will give further instruction on what kind of information should be filled in. This is not usually necessary.

Step 8: With the drop down box called Type, you can choose which type of question to use. Your choices are:

  • Text: A one line text box that anything can be typed in to.
  • Paragraph Text: A multiple line text box that anything can be typed in to.
  • Multiple Choice: You set up different choices that can be chosen by clicking on a circle next to the choice. This allows only one selection.
  • Checkboxes: You set up different choices that can be selected by checking a box. This allows multiple selections.
  • Choose From a List: You set this up with different choices that will be presented in the form of a drop down box, and one of those choices can be selected (the Type drop down box is an example of this).
  • Scale: Set up a scale to choose from. Works good when are looking for people to rate something.

Step 9: Decide whether to make this a required question. If so, check the box to enable this. If you do, the form cannot be submitted unless this question is answered.

Step 10: Click done.

Simply repeat these steps until you have all of your questions filled out. If you would like to rearrange your questions, simply click and drag a question to its new position.

On the top right of the page, you will have several options of what to do with the form right away. You can send it via e-mail if you would like. Under the More Actions button you can get a code to embed the form in a web site. You can also edit the Summary, which is the note that shows up after the form is submitted. It is a good idea to edit this.

Once you have finished, go back to the main Google Docs page. Your new form will show up under All Items. When you open it, you will see a spreadsheet instead of a form. This is where the information from your form will be saved.

To view or edit your form, click on Form in the top navigation menu. You can also e-mail the form from here and get the embed code, or publish the form as its own web page.


Source link

Alternatives to AJAX


The short answer is, “Yes, there are a number of alternatives to Ajax for building Rich Internet Applications (RIAs).” These include Flash, Flex, Java, SVG and Ruby on Rails, as well as a few other niche players.

Now for the details, which make up a somewhat longer answer.

Flash and Flex, fellows

Adobe’s Flash, originally created by Macromedia, has quickly become an RIA tool of choice. Initially installed as a plug-in, its Player application started shipping with Windows XP some ten years ago now. Flash delivers some of the best RIA experiences, as well as multimedia.

On the downside, there is a longer learning curve with Flash. There is also a nagging, potentially problematic security issue. The Flash Player writes files to your computer in a rather secretive way, and there is no way to change the settings without using a “Settings Manager” located at Adobe’s Web site. Finally, Flash takes over your camera and microphone.

Flash brings a totally different perspective to building rich clients, but Adobe didn’t put all its eggs in that basket. The company also introduced a set of tools known collectively as Flex that provides data integration within a framework using integrated development tools. Taking care of the “XMLHttpRequest,” Flex offers easy integration with REST, SOAP or classic HTTP services. Flash is more of a straight-up alternative to Ajax, while some would characterize Flex as something like an “Ajax toolkit.”

Java’s still smokin’

Sun Microsystems’ Java is an Ajax alternative that has been around the block a few times, and its “applets” constituted among the first rich client tools for browsers. Java applets allow developers to use an honest-to-goodness, object-oriented programming language, while Java code runs in the JVM virtual machine with a “sandbox” for memory. Because of JVM, Java code runs on all platforms, living up to its slogan, “Write once, run anywhere.”

Applets can access only the memory allotted for its sandbox, which is an important security feature. Still, there are some problems with Java, the first of which is that it does require a plug-in that has to be manually installed for some browsers. JVM must be running for Applets to start up, and JVM may be slow to load at times. The applet has to be downloaded if it is not cached, which takes even more time, and this may be the most serious problem of all, since Web users typically expect ever higher, faster, better performance.

A mobile acronym?

SVG stands for Scalable Vector Graphics, a W3C language that uses XML to define 2D graphics and graphical applications. Its current version is 1.1, supported natively in the Opera browser (8+). Some Gecko-based browsers such as Firefox offer limited support, and although Konquerer, Internet Explorer and Safari browsers have plug-ins available for SVG, Microsoft’s IE has no commitment to it. The others do.

For PDAs (including PocketPC) and cellular phones there are, respectively, SVG Basic and Lite editions. The fact is that SVG will probably experience some adoption in the mobile category before it earns universal support among browsers. The lack of a commitment from Internet Explorer appears to be limiting the adoption of SVG.

Ruby, won’t you be mine?

Ruby on Rails is a somewhat more youthful technology, a free object-oriented language that has gotten a lot of press in the last few years. It is a “full stack framework” for developing database-driven Web apps following the Model View Controller (MVC) design method.

Ruby emphasizes development simplicity, reinforced with two near-famous and oft-repeated slogans. The first -“Don’t Repeat Yourself,” or DRY – is meant to eliminate wasteful duplication, of data or code. “Convention Over Configuration” instructs users to eschew configuration unless you have an “unconventional” situation.

Ajax support is innately, intrinsically available and simple to use in Ruby. You get instant functionality as soon as you install it. There are drawbacks, of course, especially if your firm has a well-entrenched system, stable development environment, solid platform and a ton of legacy code. It may not be practical to switch to Ruby – and she is still a youngster, after all.

Other candidates

XUL (XML User Interface Language, pronounced “zool”) was developed by Mozilla to build feature-rich apps that even run when they’re disconnected from the Web. As it offers a common set of customizable user interface components, and uses JavaScript, XML and DTD, it should be a fairly simple task for developers working with DHTML to learn it. One major drawback is that it needs a XUL-enabled Web browser, and that means Mozilla-based ones for now.

XAML (“zammel”) is eXtensible Application Markup Language, and coupled with Windows Presentation Foundation makes up the heart of Microsoft’s application development strategy. Microsoft is aiming for XAML and WPF to replace HTML, Flash and PDF, a tall order, indeed. XAML will deliver 2D and 3D imaging, video, animation, audio and so on, and is supposed to erase the line between Web and desktop applications. As an MS technology, it will certainly be used broadly, but it is not likely to make many waves in non-Windows environments.

Bottom line

If you are hoping to add Ajax functions to an existing site, that is a good place to start, but if you are planning the construction of a new site, and want to use Ajax from the gate, take another look at Ruby on Rails. However, your ultimate decision on the tools to use will depend entirely on what you’ve been doing, what you’ve been doing it with and how willing you are to add another tool to the toolkit. If Ajax is the tool you need, then use it. If an alternative works, use that. If you aren’t sure what’s best, use both until you find out.


Source link