Web Design Tutorials: Photoshop, HTML, Flash, PHP

HTML Tutorial – CSS3 Spinning Social Media Icons

The HTML First we start off with our social media icons. ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 <div class="spinning_icons">     <a href="http://www.twitter.com/paulund_" class="twitter" title="twitter">Twitter</a>     <a href="http://www.twitter.com/paulund_" class="delicious" title="delicious">Delicious</a>     <a href="http://www.twitter.com/paulund_" class="digg"...

HTML Tutorial – Quick tip coding beautiful form

What will be needed in this tutorial? PSD file from preview tutorial Museo Slab font Step 1. Folder and files structure First create Your folder structure. We will need index.html, style.css, images folder and js folder. In images folder we will have background image and icons from input fields In js folder we will have cufon files for our font For cufon go to Cufon page and download cufon-yui.js file. Also You...

HTML Tutorial – Build a Neat HTML5 Powered Contact Form

Tutorial Details Requirements: PHP 4.3+ Technologies Used: HTML5, Javascript, jQuery, AJAX & PHP Difficulty: Beginner – Intermediate Estimated Completion Time: 60 Minutes Step 1: Getting Started To begin, we need to setup our directory and files. To get started, I highly recommend the HTML5 boilerplate. This is a really good starting point for any HTML5 project and will save you a great deal of time....

HTML Tutorial – 28 HTML5 Features, Tips, and Techniques you Must Know

1. New Doctype Still using that pesky, impossible-to-memorize XHTML doctype? view plaincopy to clipboardprint? <!DOCTYPE html PUBLIC ”-//W3C//DTD XHTML 1.0 Transitional//EN”     ”http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> If so, why? Switch to the new HTML5 doctype. You’ll live longer — as Douglas Quaid might say. view plaincopy to...

HTML Tutorial – Build your First Game

Step 1 – Setting up your Project To begin developing your demo, download the Box2D engine for HTML5 here. Next, create a new HTML file with the following structure (copy js and lib directories from box2d-js project to your game folder). Now, you must insert the necessary files to run box2D into your HTML file: view plaincopy to...

HTML Tutorial – How to Create Presentation Slides with HTML and CSS

As I sifted through the various pieces of software that are designed for creating presentation slides, it occurred to me: why learn yet another program, when I can instead use the tools that I’m already familiar with? With a bit of fiddling, we can easily create beautiful presentations with HTML and CSS. I’ll show you how today! Prefer visual learning? Get the screencast course of this tutorial on the Tuts+...

HTML Tutorial – Getting started with HTML5

HTML5 is the latest revision of HTML, with the goal to make it easier to develop web applications. HTML5 has much simple syntax compared to HTML 4 and it offers lots of new features. This articles gives introduction to HTML5. What you can do with HTML5? - Offline Applications with Application Cache With the HTML5, it is possible to make your web applications run offline as well. HTML5 offers offline storage feature...

HTML Tutorial – Cross-Browser Support for HTML5 Placeholder Text in Forms

HTML5 offers a lot of exciting new features in the realm of forms. One of my favorite new additions to forms in HTML5 is the placeholder attribute. Placeholder text is the “hint” or “example” text that resides in a text input field before the user clicks in (or tabs to) that field — and goes away the moment the field is in use. And the code is amazingly simple, too. Take this example: <input...

HTML Tutorial – Adding a Favicon to Your Site

Nowadays, when one visits a website, they would see an icon next to the url or perhaps the web page title on a tab. This icon is at times referred to a favicon. In this tutorial, you will learn how to add a favicon to your site. Setup If you have not already done so, open Visual Studio and create a new web project. If you rather use your own developing environment or text editor such as notepad, you may set...

HTML Tutorial – How to Reference External CSS Files in HTML

Having CSS embedded in your HTML document is not exactly recommended any longer. With all the new features and demands of creativity on sites, having an external CSS file or two may come in handy. In this tutorial, you will learn how to properly reference an external CSS file. Setup This tutorial was written using Visual Studio 2010. Visual studio is available for free in its express edition to the public. Just...

HTML Tutorial – Learn How to Use HTML5 Video Tags

There is no longer a need to embed videos from an external source anymore with massive blocks of code. With HTML5, one new tag will control it all! Introducing the new HTML5 video tag, all you need is the file path and the video format (recommended: MP4 or OGG). In this tutorial you will learn how to use the new HTML5 video tag in your site. Setup This tutorial was written using Visual Studio 2010. Visual...

HTML Tutorial – How to Add a Google Plus One Button on Your Web Page

The Google +1 button is analogous to the Facebook “Like” button.  It is pronounced “plus one”, although usually spelled as “+1″ in the official Google documentation. Visitors can click on the button to recommend publicly a particular page or web item.  Other people can see how many times the page have been “+1′d” (meaning the number of times the +1 button had been clicked).  This aggregated...

« Previous Entries

Powered by WordPress | Designed by Elegant Themes