Monthly Archives: July 2013

How to Add Audio to Video

Digital media is everywhere you look. Music and video production have made it to the grass roots level thanks to the affordability and widespread use of powerful computers.

Inexpensive digital video cameras are widely available, and older analog video cameras can be connected to a computer through a video card to download movies to the computer for editing, storage, and distribution to friends and relatives over the internet.

It has become fairly easy to edit your own videos, and there are many software packages available aimed at the amateur. The Windows operating system has its own video editing package called Windows Movie Maker that allows you to produce professional-looking videos.

As you explore this exciting new world, you will inevitably come up with the need to edit the audio portion of your video file. The sound quality of most video cameras is not great, so you may want to process the sound or replace it all together with music or voice-overs.

It is very easy to separate the audio from the video. Free software packages that do this task include Windows Media Encoder from Microsoft (if you are working with WMV video files) and VirtualDub (if you are working with AVI files). Either of these programs (and many others) allow you to save the audio portion of video file quickly and easily.

Once you have your audio file, you can process it for noise reduction, bring up the volume, add music or do any digital magic to it that you desire.

With many video editing packages, however, it isn’t necessary to split the audio to a separate file. Even simple packages like Windows Movie Maker have basic audio editing functions, and you can add separate music or voice tracks and mix all of them together.

If you have a particular audio file that you would like to use in your video (maybe a special effect or a voice over that you have recorded separately) simply add that file to the list of media to be included in the video. Other media formats can be separate video files, picture files or graphics.

The audio file can be placed anywhere on the time-line, and you can use the same file many times without requiring any extra storage space on your computer. For precise placement, zoom all the way into your timeline and place the audio exactly in sync with the video. That’s it! You are well on your way to making professional-looking videos!


Source link

How to Display a PDF File in a HTML Web Page


Creating a PDF (portable document format) link on your website was once considered standard practice when considering your initial website design. PDF’s are recognized on a global level, and the software used to create, edit and manipulate them is easy to obtain. As you travel the super information highway and make your frequent stops by way of websites, you will encounter helpful information such as restaurant menus, company brochures, and mail order shipping fees which are created in this format. Most sites also contain the link to download the program which is needed.

As website design continues to evolve and consistently becomes more graphic intensive, setting your.PDF files as links on your web page is becoming less and less popular. The most pressing reason some developers are choosing to avoid linking all documents this way is that by clicking on the link and opening the document takes over the entire browser window. Sometimes the files are large and take some time to download, and at other times, you may have to sift through pages of material before you happen upon the particular portion of information you were originally in search of.

An alternative to this issue is to display the file as an embedded link using simple HTML code. Embedding the link allows you to view the PDF file and never leave the web page. Not everyone believes that this is as easy as it sounds. Having the confidence and the knowledge to view the source code takes some practice and patience. Creating a backup copy is always wise and may save you time and frustration down the road.

Let’s say you would like to add your professional portfolio to your blog. The first step would be to locate your HTML page and open it by way of notepad. As you view the source code, find the spot where you want to add the link to your portfolio. You may want to add before you enter the code for the link to your PDF file, to add a space. Enter the code for the file, and add any parameters that may help determine size and placement on the page. Adding additional parameters to the string of code can be helpful in suppressing toolbars, navigation panes and scrollbars, but on the other hand, it can become quite confusing very quickly if you have not had any previous experience in manipulating code on your web pages.

Of course not all of us have HTML experience or the confidence to go into the source code and add or remove any kind of links, including PDF documents. Even though there are a number of tutorials and free information on the web that will help anyone get started, it can be a confusing and frustrating experience. Learning all your options, including purchasing inexpensive software that will help you create, edit and maintain your web pages, may be a more viable solution.


Source link

HTML5 Mobile Website Development

Creating a website takes time and requires skills unless if you just intend to develop the simplest one. If your goal is to create a website for your business or promote your blogs, your website must be attractive enough to gain attention from possible viewers. Therefore, you have to activate your creativity once you begin your website development plan. Besides your skills, you also need an effective tool that supports website development. One of the most recommended is the HTML5. The HTML5 website development has satisfied millions of users already. You may take a look at some of the outputs or the portfolio, which you can refer to upon generating your own webpage.

Top HTML Web Design Showcases:

Joel Jenkins Portfolio

Slim Kiwi



Cat Cubed

Canary Graphics

Tim Benniks

For a Beautiful Web

Daniel Dengler



Idea Foundry

If you are new to HTML5, get to know it first and familiarize how it works before you begin doing some downloading and installing. HTML5 is a language that can be used to present content on the Internet. it has features that make it easier for developers to incorporate audio, fonts, videos, graphics, animation and other things into a website. HTML5 has plenty of tools and resources useful for web designers.

Among these are the following:

Sprite Box Tool

3D Sketch Tool

Velocity Sketch Tool

Font Testing Tool

Pattern Generator

XRay Tool

Automatoon/Animation Tool

Audio Maker

SVG to HTML5 Canvas Tool

Ajax Animator Tool

All these tools are found on the internet. They are online tools that are rich in functions, which will help you build a better website. Explore each of them to see which tools are most useful to you. Each of the tools mentioned is easy to learn as long as you have the interest to make a good webpage. You have to be more than willing to be able to utilize as much of the tools as possible and get the most out of them. These are probably a lot of things to learn especially if you are a beginner, but once you earn knowledge and skills from the various tools, resources and other things involved in using the HTML5, you will find yourself becoming an expert at utilizing them. If you want to create more websites in the future, you just have to automatically use the HTML5 without reading or watching tutorials anymore. Your stock knowledge and abilities about this language allow you to proceed directly to the HTML5 website development process.

What you have learned from before will save you a lot of effort and time in the future. If you have an online business, this will help you a lot in developing websites featuring your products or services. Learning about the HTML5 is surely an opportunity that you must not miss for a successful and worthwhile website development project. Don’t forget to stay updated by recognizing the latest HTML5 websites featured on the Internet.

If you are building a mobile website, or in other words, a website for purposes of being viewed on a mobile device, you will benefit significantly in utilizing HTML5. These are called under various names, but they all refer to the same thing – a mobile web presence. These go under names such as HTML5 mobile web app, HTML5 mobile website, HTML5 mobile website app, HTML5 mobile application etc.

One could certainly undertake the efforts to learn the skill with HTML5 web programming for mobile rendering purposes, but you could also utilize readily available platforms that provide you with the ability to build a mobile website, fully HTML5 compliant, without needing to learn any programming and without writing a single line of code. Additionally, a few platforms exists that not only allows you to build without programming or writing code, but also provides you with anytime access to make real-time changes, and have those reflected in real-time


Source link

What is JavaScript?


Static v Dynamic

JavaScript can do more than HTML because HTML is static, but JavaScript is dynamic, which means that it can react to viewer actions, such as clicking or rolling the mouse over an object. JavaScripts are often called “behaviors.” A behavior is made up of a viewer “event” and a response or “action” by the programming. You can program a behavior to happen when a viewer clicks, or you can program it to happen when the viewer double clicks – that is the “event.” When the “event” happens, the programming responds by showing something, like a drop-down menu, or by doing something, like playing a sound. With JavaScript, you site is “dynamic” because it responds to your viewer beyond regular hyperlinks!

Client-side programming v Server-side programming

JavaScript is a “client-side” programming language. Client-side means that the program code is sent into your computer with the rest of the web page code (usually HTML); then, your browser reads the code and does what it says. That means that on many sites with JavaScript, you can look at the programming code right along with the HTML by going to Edit -> View Source in your browser. You can usually tell if the code has JavaScript in it because the head tag will have a like that says script language=”JavaScript”. That is a good way to look at some working scripts. (Some websites do hide their JavaScript coding.)

JavaScript and Browsers

JavaScript is frequently used to do simple programming tasks because web viewers can turn JavaScript off on their computer, which means that all your hard programming work doesn’t function when they view your site. JavaScript may be turned off for security, and there have been browsers that have JavaScript disabled as a default setting. Instead, we use JavaScript to enhance the functionality of a web page. For example, if you completely rely on JavaScript to validate your online forms, you have a security hole. If a viewer’s JavaScript is turned off, it will by-pass your validation. So, you may also use a “server-side” programming language to double check the input.

Newer browsers generally have newer versions of JavaScript, which means there are more programming options. Some old browsers can’t read JavaScript, or they can only read limited amounts of JavaScript. A browser that is JavaScript enabled can read some version of JavaScript.

Other Options

There are other types of scripting that look a lot like JavaScript. For example, the Flash program has its own scripting language called ActionScript, and many of the effects it produces in Flash are similar to what JavaScript can do on a page. For example, you can create a set of rotating images in JavaScript. The same thing can be done in Flash, except the Flash action is generally much smoother. If you learn JavaScript, you have the basics to start on many other scripting languages that are used for web pages.

Give it a try

You don’t have to be Super-Geek to learn a little JavaScript! Here is a link to a few simple JavaScript exercises. All you need to do these exercises is Notepad (or another text editor  – do not use a word processor as the files may not be readable by the browser) and a browser.


Source link

Mobile Applications Versus Mobile Web Sites In Education

The future of mobile development is a strong one. The question these days is…”Is it better to build a mobile website or a mobile app”? Will new and developing browser technologies like HTML5 make the mobile Web preferable to apps? In my opinion, there is no debate at all. The mobile Web is not going to die and app stores are not going anywhere.

As mobile usage increases worldwide, both sides of the equation will grow with it and become valuable aspects of product road maps. There is an expression that goes something like “a high tide raises all ships”.

Apps often fulfill a “quick action, I need something” role for students while browsers fulfill a “I need to look something up and read” role. It makes sense. When you consume content via a smartphone or a tablet, you are probably in an app that takes advantage of the deeper integrations of the device like accelerometers, ingrained video capabilities, cameras and location-based services. Themobile Web is used more often for research and looking things up on the fly while out and about. The distinction between the two are blurring.

Each has advantages and in my opinion apps have one clear advantage. In general, a well-made app can provide a far better user experience than even the best mobile websites are capable of right now. But that being said, you need to remember that making just a native app is usually harder than making an equivalent cross-platform web app. You often have to build each app for each platform to reach a wider audience. In North America, the most important smartphone platforms right now are iOS, Android, and BlackBerry. How many mobile users are on each? Here are the ratios in the U.S., as a percentage of all mobile phone users, for the last quarter of 2010:

iPhone: 6.75%

Android: 7.75%

BlackBerry: 8.53%

TOTAL: 23.0%

In other words, if you decide to only make an iPhone app, fewer than 7% of all mobile phone users will be able to use it. If the app’s primary purpose is marketing, you’ll need to decide whether this reach is big enough to be worth it.

As far as the advantage of Web apps over native mobile apps, it is cross-platform compatibility. They run in the standards-compliant browsers that are available on Android, Apple, BlackBerry, and Windows mobile devices, so (in theory at least) they have to be built only once. The disadvantages, as I stated earlier, are that they lack access to such features of a device, they can’t use some of user-interface elements that are native to each platform, and they can’t be downloaded from Apple’s App Store or the Android Market.

There are clear arguments for both applications and mobile sites. While some companies believe that mobile development priorities should be focused on either a mobile site or an application, the reality is that students are using both channels, so an integrated approach is the optimal solution…a hybrid solution.

You also need to consider time, budget and resources to develop each solution.


Source link

Overcoming Mobile Web Design Challenges by Integrating Responsive and Adaptive Principles

Today’s digital reality is that consumers are information hungry and device savvy. They want to get information easily and anytime they wish, and mobile web gives them this liberty. Smartphone penetration is spiralling across the globe and in the near future mobile web usage would surpass desktop web usage. In this scenario, having a mobile-friendly web design can greatly help in being available to your target audience all the time.

However, shaping user experience through a mobile website can be a challenging task, primarily because of the limited screen resolution, besides other constraints. The best approach is to get the best of both – responsive web design and adaptive web design techniques.

Responsive web design is all about having fluid grid concept, flexible images and media queries. You don’t need to change the content for a separate mobile website, because CSS, media queries and HTML5 ensure that the content can be adjusted to any screen size. The time and cost of developing a responsive website makes it a preferable way of getting a mobile-friendly website. However, there are some limitations of responsive web design. For instance, responsive websites don’t take into account the behavioural differences of the users using different devices. Moreover, responsive websites generally take greater time to load, thereby, hampering the user experience.

Adaptive web design basically concerns with designing a dedicated website suitable for mobile devices. A dedicated website can be optimised to make the links finger-friendly as well as improve the load speed of the web pages. However, a dedicated mobile website would double up your maintenance time and cost, forcing you to spend more time on this website, besides the desktop website.

By integrating the best features of responsive and adaptive techniques, you can get a hassle-free website that would shape up unique user experiences for mobile web users. This way you enjoy the cost and time efficiencies of RWD, yet offer a better user experience by adding adaptive design principles and prioritising the content area.

However, even this approach can pose challenges in some cases. The information architecture has to be worked out differently for the desktop website and the mobile website. You also have to put in extra efforts in the resizing, special distribution and animation of elements on different devices. Besides this, the developers also have to take into consideration the different screen resolutions and device capabilities when creating the website and optimising the end user experience, irrespective of the device they use to access your website.


Source link

What Can I Learn With Simple PHP?


If you have ever studied the Internet and how to design web-page’s, you have probably heard of the HTML code known as PHP. This method can be very difficult to learn and understand alone, especially if you do not have some form of understanding of basic coding. But there is a simple solution

But there is still hope for those of us who have no background in this coding. Robert Plank has designed a fool proof system for comprehensive learning that provides users with steps and instructions where you can learn PHP, as easily as possible.

Simple PHP will teach you the basics of PHP in a series of beginner steps. There are some great things you will learn too that you can use in future projects. They include:

1 Developing Auto responders

2 Learn the technique to combine PHP with Java-Script to create powerful HTML applications.

3 Create your own personal use htmlaccess program code.

4 Conceal your affiliate links by creating redirect scripts.

5 Design powerful person web-page’s 6 Design games, polls, quizzes and so much, quickly and easily.

Why pay a programmer more than $100 an hour to do something you can do in less time, and for considerably less money. Plus, with these tools you can master the basic process and turn what you have learned into an experience that you can use and profit from as well. The greater your knowledge, the more you can do.

When you review Simple PHP, you will find it to be exactly like a college based text book. There will be beneficial information, and that will be followed with a quick exam designed with key points you should have learned in the process. If there is anything you miss, you can go back and review the information. This is designed to help you succeed.

Best of all, because the author believes in the quality of the work, if you do not feel you have benefited from the tools in the book, you have a full 90 day refund. It is almost certain you will learn the basics, but if you do not you have nothing to lose. Not many companies let alone individuals typically extend a 90 day guarantee. This allows you to safely learn at your own pace without risk because of the money back guarantee.

Imagine all the groundbreaking things you can design to do on the web. Simple PHP starts you in the right direction to take your on-line coding in the right direction while opening doors you never imagined would be open.

The book really works, and certainly gives you a new career to go towards. While it might not be a complete work of PHP coding, what it does offer is the building blocks to continue your learning and education. There will always be a demand for programming, take this first step into your future with this easy to use and simple guide. Instead of trying to find reasons why you cannot learn this new skill, take a moment and think about expanding you knowledge and opening up new doors for yourself. You deserve it.


Source link

MOBILE Content Management Systems (CMS)



A flexible CMS is today’s answer to anyone who asks what they should look for when creating mobile content. Due to the high development speed of mobile technology and changes in user location-based browsing, it’s difficult to predict what the mobile future will bring and what kind of mobile CMS will best fit your needs.

The Three Primary Forms of Mobile Content to Consider

  1. One-site approach – One website for all visitors, rendered differently for mobile devices
  2. Two-site approach – One website for desktop visitors and one specifically for mobile devices
  3. Mobile app – Internet application transferred to a mobile device that performs specific tasks

Furthermore, some companies need a mobile CMS to address only a small set of devices (e.g. smart phones) while others need to render content any any mobile phone out there.

The Mobile apps way

One of the pre-requisites with the mobile apps approach is the extensive infrastructure that is required for basic distribution and maintenance updates. And beyond the distribution infrastructure, organizations need to create customized versions of the mobile app for each of the mobile platforms on which it will run (Android, Mac O/S, RIM, Windows Mobile, Symbian etc.), which in turn also requires individual updates for end-users to install and refresh. For commercial apps not a big hurdle to take, for informational apps and for businesses with a limited amount of resources to deploy, not an obvious choice.

Native used to have quite some advantages, but with the arrival of HTML5, CSS3 and all modern browsers, even the latest versions of Internet explorer, supporting Javascript code, those advantages are slowly shrinking and in the not so foreseeable future it will be possible to duplicate all unique mobile apps features within a standard cloud-based mobile CMS system.

What remains of course is the marketing angle a mobile apps can have on Apple, Android and Windows mobile apps stores. These apps stores have a wide spread visibility amongst viewers and potential customers and and mobile apps have through those app stores a natural window to the mobile marketplace. Whereas, household names fully benefit from the apps stores and its marketing potential, it is less the case for small and medium sized businesses where the brand is not necessarily the key differentiator, but rather the products and services these companies are offering. For those companies the visibility on the Internet can only increase with keywords, reflecting the nature of the products and services offered, and with keywords that are ranking at a bear minimum in the top 20 of the major search engines.

The One-site approach

This is the most efficient approach for all businesses and organizations where the content between the main web presence site and the mobile site is identical and can remain identical.

Management and update of the content, both main and mobile is done from the same and unique administration interface and all updates are immediately available for viewing on regular PC’s and all mobile devices.

Both the main and mobile are reachable through the same URL, and depending on the device used the viewer will be directed to the main website or the mobile website.

Mobile viewers will always have the possibility to revert to the main website on their mobile device if they have a need to access modules that are not yet optimized for mobile viewing.

Over time, and with the evolution of HTML5 and browser technology, it will be possible to nearly match all modules available on the main site for mobile viewing, including complex modules like video players and E-commerce modules.

The core of this approach is a uniquely designed Template for both the main website and the mobile web site. A mobile CMS system should be able to customize the elements you would like to display in your mobile site, and also arrange them in order by simple drag-and-drop.

The Two-site approach

For companies that want to have targeted content for their main website viewers and mobile viewers that is substantially different from one another, the two-site approach is the way to go. Two differently custom built and designed Templates will be another key differentiator of the two site approach.

The mobile site can have inquiry forms, lead forms and all sorts of interactive modules with viewers and customers, the main site could be arranged in a way to transact with customers through e-mail marketing, Newsletters and E-commerce modules.

Although being in reality two different web sites, some of the modules can be integrated and be connected as being one. The most important once’s being user registration, user name and passwords and user database that can be shared amongst the two sites. In such a way, and although the content is or can be quite different, the viewers/customers are uniquely connected on both web sites.


The debate on mobile apps versus mobile web apps, is not so much one of which is better, but rather one of which fits best the needs of your organization and your customers. Technology wise and feature wise both approaches have and surely will have the tendency to converge in the next year. Mobile apps are much more complex to develop and to maintain, but have distinct advantage when it comes to marketing and publicity. That advantage can be off-set with specific search engine optimization (SEO) programs that enable customers not only to be able to be viewed on mobile devices but also to be found through generic searches on the main search engines like Google, Bing and Yahoo.


Source link

The Proper Way To Build Websites For Mobile


The web development industry is nowadays experiencing significant changes in the requirements of clients because of the rising trend of mobile technology. Mobile based websites are becoming the center of all development projects. Businesses around the world are discovering the benefits of offering their online products/services through mobile platforms like iOS, Android, Windows Phone and BlackBerry.

But a true mobile website is not merely a scaled up version of desktop website. Mobile websites are supposed to be optimized for smaller screens, low capacity processors and touch-screen based navigations. Also, there are differences between mobile websites and mobile web applications. An answer on with the title “Differences between mobile websites and mobile web apps?” offers a clear difference between mobile websites and mobile web apps. Some important points are as follows:

• Web apps can be downloaded, whereas mobile websites can be accessed through the phone browser.

• An app is software designed for specific uses, whereas website is simply a page or set of pages.

• All web apps are technically websites but not all websites are web apps.

• The purpose of website is to present information, whereas web apps are used as a tool for specific tasks.

As mentioned above, mobile websites should not also be confused with desktop websites. However, they use similar technologies such as HTML, HTML5, JavaScript and CSS but run on different platforms. Here are five major differences between websites of mobile platform and desktop platform.

• Smaller screens create whole new designing and development related challenges, whereas it is rather easy to implement websites for desktop.

• Mobile devices use limited hardware capacity than desktop devices.

• Designing navigations for touch-screen is completely different than designing navigations for keyboard and mouse.

• Input methods need to be specially tailored for smartphones and tablets.

• Internet connectivity in mobile devices is not always reliable and thus data transfer can be slower.

These five are major issues and every mobile website development needs to be carefully considered for these issues before being designed, developed and deployed.

While addressing the above mentioned points, mobile website developers can improve their projects at following places:

File Sizes

Because mobile devices run with limited processing power and memory, both front-end and the back-end of a mobile website are also supposed to use limited file sizes. Smaller file sizes do not cause connectivity problem. With smaller files, pages can quickly be loaded and engaged on devices.

Image sizes

If possible, avoid using too many images. Images take too much space while smaller devices cannot allocate enough memory for every single instance. Adobe Fireworks and ImageAlpha are two great tools to compress images for mobile websites.


Mobile web browsers have evolved to a great extent and thus websites built using CSS3 are the standards. CSS3 is capable of handling HTML elements with ease, particularly for mobile devices.

Offline experience

Network connectivity differs from one to another area and sometimes, it can completely drop. So a website needs to be planned to offer offline user experience. You can offer users some sort of offline engagement that works even without internet. You can bring offline functionality in a website by HTML5.


Source link