Articles > HTML5

CSS

Creating a simple to-do application – Part 2

Continuing on from last weeks tutorial (Creating a simple to-do application – Part 1) and the short snippet (Turning a form element into JSON and submiting it via jQuery ), this week we'll be writing a PHP page to accept and process the form submit and return a JSON response. Installing PHP on your web server ... There are several ways to install PHP to your web server, but each is dependent on what web server you are running. The two main ones I will deal with are Microsoft's Internet Information Services...
CSS

Creating a simple to-do application – Part 1

This is the first part of a series of tutorials that aim at to cover all aspects of web development. Each part in this series will build on the previous one, covering topics such as: HTML5 CSS3 jQuery We'll also be covering slightly more advanced topics such as: AJAX PHP MySQL Email Security/Authentication Where required I will go into the basics of getting a development environment installed and configured. I will also cover basic design methodologies and best practice. The Application ... To start...
CSS

The humble table

Introduction ... I’m going to tell you a story, its about love, death and re-birth... Or something In the beginning there was a young html element called <table>. He had one purpose in life, to display data and life was good. But before long though he had been corrupted, his masters used him to define layout and structure. Things he was not originally designed to do, and so began the dark ages of web design. Then one day, there came a young knight called CSS, and with him he brought light to designers...
CSS

Recreating the Developer Drive logo with just CSS, no Javascript or Images

I quite like the developer drive logo animation. I remember seeing it a when I first found the site and thought it was simple, yet effective. I also wondered if it would be possible to replicate it using just CSS. In this snippet we'll cover CSS3 transitions and using @font-face to import some custom fonts. The first thing we need to do is import out fonts, I wasn't sure what the current 'd' font is so I have a similar font. The best place to go is www.fontsquirrel.com, you can pick from a wide selection of fonts...
CSS

A quick and simple CSS3 accordion menu!

Introduction ... Building on my previous tutorial, I thought it would an idea to show how to apply what we learned to the most basic of website features, the menu! I would strongly suggest reading my previous tutorial as we'll be jumping in at the deep end here. Once again, no JavaScript was used in the making of this tutorial! Every website has a menu, and there are lots of different styles that you can use. One style that is quiet popular in web applications and mini-sites is the accordion menu. The accordion...

HTML5 and the introduction of <nav> versus <menu> elements

HTML5 introduced two new elements with seemingly identical roles ... <nav> ( http://www.w3.org/TR/html-markup/nav.html ) <menu> (http://www.w3.org/TR/html5/interactive-elements.html#the-menu-element ) Their use is actually quite different and you're unlikely to see both used at the same time. The <nav> element is actually for grouping <a> elements for navigating a website, and the <menu> element is for grouping both <a>, <input>, <button>...
CSS

An introduction to HTML5, CSS3 and responsive design

In this tutorial we'll be dealing with some basic HTML5 additions and their uses. We'll also be creating a simple animated gallery using just CSS3 and HTML5 In making the gallery, we'll also try and deal with responsiveness and scaling the gallery for different resolutions and devices. Throughout this tutorial JavaScript will not be used! Step 1: Understanding the HTML5 additions ... http://www.w3.org/TR/html51/ There are lots of new tags in HTML5; today we'll be dealing with the some of the most...
CSS

15 Online resources for learning web design

There is no doubt that Web design can sometimes be a little intimidating, not only is there so much to learn but the environment is ever changing and it seems as if every day there is something new that you need to learn if you want to stay up-to-date. Don't know where to start? Don't worry we have compiled some of the best resources on the web for learning web design. Some of the suggestions offered here are free while some come at a small cost. Some focus only on HTML while others will teach you anything from HTML,...
Load more
Home CSS Deals HTML HTML5 Java JavaScript jQuery Miscellaneous Mobile MySQL News PHP Resources Security Snippet Tools Tutorial Web Development Web Services WordPress