ELATED New Stuff to Love

eBook Giveaway: Win a Copy of The Best 365 Websites Around the World

Mon, 07 May 2012 05:00:00 GMT

Published in Web Design and Style

It's giveaway time again here on Elated! This week, you can win a digital copy of "The Best 365 Websites Around the World (2011)" from the lovely folks over at Awwwards. We have five digital copies of this beautiful eBook to give away.

Enter now for your chance to win a copy!

Easy HTML Templates with Mustache

Fri, 27 Apr 2012 05:00:00 GMT

Published in Web Development

Templates are a great way to separate your website's code from its design. In this tutorial you'll explore Mustache, a relatively new and very simple template system that you can easily use to create HTML templates.

Along the way, you'll see plenty of code examples that show you how Mustache works. At the end of the tutorial, there's a complete example that uses Mustache, along with jQuery, to create a simple Ajax-based product list page.

jQuery Mobile 1.1: Smoother, Faster, Nicer

Mon, 16 Apr 2012 05:00:00 GMT

Published in jQuery

The latest version of jQuery Mobile, 1.1, has just hit the streets, and it has some great new features and improvements over 1.0. In this article you'll get a quick run-down of jQuery Mobile 1.1, and all that it has to offer you as a mobile web developer.

You'll look at improved fixed header and footer toolbars; enhancements to page transitions; new transition effects; loading spinner improvements; cute mini form elements; and lots more!

Ajax with jQuery: A Beginner's Guide

Tue, 06 Mar 2012 06:00:00 GMT

Published in jQuery

Many modern websites - and practically all web apps - use a technique called Ajax to provide a smooth, fast experience for the user. From apps like Gmail and Google Maps through to JavaScript frameworks like jQuery Mobile, Ajax is a popular way to fetch data from a server in the background and update the page dynamically.

Writing Ajax JavaScript code from the ground up can be fiddly. However, many JavaScript libraries, including jQuery, have excellent high-level support for Ajax, making it easy for you to build Ajax-driven websites and apps with minimal hassle.

In this tutorial, you'll learn the basics of making Ajax requests using jQuery.

Enjoy!

Responsive Web Design: 5 Handy Tips

Fri, 17 Feb 2012 06:00:00 GMT

Published in Website Authoring

In Matt Doyle's previous article Responsive Web Design Demystified, he explained the concepts behind responsive web design, and showed how to build a simple responsive layout from the ground up.

In this new article, you learn five additional techniques that will help you build great responsive layouts. You'll put each technique into practice as you build on the responsive layout created in the previous article.

Enjoy!

How to Add Article Categories to Your CMS

Wed, 25 Jan 2012 06:00:00 GMT

Published in PHP

Since Matt published his tutorial Build a CMS in an Afternoon with PHP and MySQL, many readers have asked how to add more features to the CMS, such as article categories and a visitor comments system.

In this tutorial, you learn how to add article categories to the CMS. Categories give your site more flexibility: you can create separate section pages of your site, with each section page listing the articles belonging to a particular category.

The tutorial includes the full CMS code - including category support - as a downloadable zip file.

Our jQuery Mobile eBook: Second Edition Out Now!

Fri, 16 Dec 2011 06:00:00 GMT

Published in jQuery

We're very pleased to announce that the second edition of our eBook, "Master Mobile Web Apps with jQuery Mobile", is now out!

The second edition:

- Is fully updated for jQuery Mobile 1.0, including all the data attribute changes, API changes and other improvements to the framework since Beta 2.

- Includes a whole new chapter that shows how to build a native iOS app using jQuery Mobile, PhoneGap and the Google Maps API. You can use these techniques to build native apps for iOS, Android and other platforms that you can then sell through stores like Apple's App Store and Google's Android Market.

- Contains a new section on the excellent jQuery Mobile ThemeRoller, which lets you easily create a unique look for your apps.

- Now has a Table of Contents embedded in the PDF, making it easy to navigate around the book.

The second edition has over 100 new pages, yet it is still the same price as the first edition, making it even better value.

Find out more and grab your copy today!

Business Card Giveaway: Win 250 Free Cards from UPrinting!

Tue, 22 Nov 2011 06:00:00 GMT

Published in Web Graphics and Multimedia

It's giveaway time again here on Elated! This week, you can win 250 great-looking die-cut business cards to impress your clients. UPrinting's unique-looking cards are available in different sizes with various rounded corner styles. You can even print oval or circular cards!

As part of the giveaway, UPrinting is generously offering free shipping for the prize, no matter where you are in the world. So if you win, your 250 cards are 100% free.

Enter now for your chance to win!

jQuery Mobile Masterclass: Build a Simple, Attractive Twitter App for iPhone

Mon, 31 Oct 2011 05:00:00 GMT

Published in jQuery

jQuery Mobile is a great framework for building mobile web apps, and as the 1.0 release gets nearer it's really starting to mature into a stable platform.

In this tutorial you'll delve deep into jQuery Mobile. You'll build a simple, nice-looking, easy-to-use iPhone Twitter app called "CloseFriends" that displays your closest Twitter friends' latest tweets.

Along the way you'll explore a variety of topics, including jQuery Mobile's API, the Twitter API, HTML5 local storage, app theming, media queries, and lots more!

Responsive Web Design Demystified

Fri, 30 Sep 2011 05:00:00 GMT

Published in Website Authoring

Responsive web design is a hot topic these days, especially as websites need to adapt to the growing number of mobile devices with their relatively small screens.

However, the whole topic can be somewhat bewildering at first glance. Responsive design is a relatively new idea, and it is rapidly evolving. It's full of rather confusing terms, such as responsive layouts, adaptive layouts, media queries and viewports. Where to begin?

In this article, you get a gentle introduction to the world of responsive web design, and learn how to create a simple responsive website layout.

5 JavaScript Libraries You'll Love

Fri, 09 Sep 2011 05:00:00 GMT

Published in JavaScript

As you start to use JavaScript to build larger and larger web apps with complex data structures and rich user interfaces, it becomes clear that the JavaScript language alone is not really up to the task.

Fortunately, some great JavaScript libraries have sprung up in recent years to make your life as a web developer much easier.

In this article, Matt Doyle focuses on five fairly recent libraries and technologies that are starting to gain traction: Backbone, Underscore, Knockout, Sugar, and CoffeeScript.

MySQL for Absolute Beginners

Thu, 25 Aug 2011 05:00:00 GMT

Published in Web Development

A database is an essential part of most websites and blogs, but setting up and using a database can be a daunting task for the beginner web developer.

In this tutorial you learn - in simple terms - how to install, set up, and use a MySQL database on your computer. This will give you a good grounding in MySQL that you'll find useful when you start developing database-driven websites using PHP, Ruby, or your language of choice.

Make a Rotatable 3D Product Boxshot with Three.js

Fri, 12 Aug 2011 05:00:00 GMT

Published in JavaScript

Three.js is a fantastic JavaScript library that lets you create realistic, animated 3D scenes, right in the browser. However, while Three.js is relatively easy to use, it can still be daunting if you're not familiar with the concepts involved in computer-generated imagery.

In this tutorial, you get a gentle introduction to Three.js's features and concepts, and you then put your new-found knowledge to practical use by creating a rotating 3D boxshot scene.

Enjoy!

Now Out! Master Mobile Web Apps with jQuery Mobile

Fri, 05 Aug 2011 05:00:00 GMT

Published in jQuery

We're delighted to let you know that our new eBook, "Master Mobile Web Apps with jQuery Mobile", is now available!

Matt's new book teaches you how to quickly create great mobile web apps using jQuery Mobile. This comprehensive guide has been fully updated for the latest release of jQuery Mobile: Beta 2.

You'll learn how to:

* Get up and running quickly with jQuery Mobile

* Build pages, buttons, toolbars, dialogs, forms and interactive list views — using nothing but HTML

* Theme your apps to give them a unique look and feel

* Integrate your own JavaScript code with the jQuery Mobile API

* Create a fully-functioning, multi-user task manager app using jQuery Mobile, PHP and MySQL

Find out more and grab your copy today!

Markup-Service Giveaway: Win $300 Credit for Your Next PSD to HTML Job!

Wed, 20 Jul 2011 05:00:00 GMT

Published in Website Authoring

We have a great new giveaway for you this week! By entering, you have a chance to win this fantastic prize: $300 credit to spend on your next PSD-to-HTML conversion over at Markup-Service.com.

Using a PSD to HTML service like Markup-Service is a great way to save time with your site builds, freeing you up to work on other areas of your business.

Enter now for your chance to win!

7 Lovely Things About HTML5 Markup

Tue, 12 Jul 2011 05:00:00 GMT

Published in HTML

HTML5 has been creating quite a stir over the last couple of years, as more and more browsers implement the latest and greatest HTML5 features.

HTML5 is quite a broad term, encompassing everything from the revised markup specification through to new API features such as audio, video, canvas and geolocation.

In this article, Matt Doyle focuses on the markup language itself, and looks at 7 ways that HTML5 markup is nicer than HTML4.

Object-Oriented PHP: Autoloading, Serializing, and Querying Objects

Wed, 29 Jun 2011 05:00:00 GMT

Published in PHP Objects

Welcome to our fourth object-oriented PHP tutorial!

In this tutorial, you're going to tie up some loose ends and look at some other useful OOP-related features of PHP. You'll find out how to load classes automatically on demand; convert objects to strings (and back again); and use special PHP functions for discovering useful information about classes and objects.

Redesigning a Site For Mobile: What's Involved?

Fri, 17 Jun 2011 05:00:00 GMT

Published in Web Design and Style

How do you take an existing website, and design a version that looks and works great on mobile devices?

In this article, Simon Meek shows how you might redesign an existing site for mobile, using (what else?) the Elated site for inspiration. You'll see how the process of paring down features can produce a clean and elegant mobile design.

Stock Photos Giveaway: Win a Cutcaster Account with Free Credits!

Wed, 08 Jun 2011 05:00:00 GMT

Published in Web Graphics and Multimedia

It's giveaway time again on Elated! This week, we have 2 stock photo accounts on Cutcaster to give away. Each account is loaded with 50 free credits (worth $45) that you can use to purchase and download any stock photos and vector art files from Cutcaster.

Enter now for your chance to win!

10 Ways the Mobile Web is Different

Fri, 03 Jun 2011 05:00:00 GMT

Published in Website Authoring

As mobile web browsing becomes more common, it's increasingly important to design websites for mobile use as well as for desktop browsing.

How do you make a website work well on a mobile browser? It helps to think about how the mobile browsing experience differs from desktop browsing. In this article you'll touch on 10 important factors that make the mobile web different, and find out how you can use those factors to influence your mobile site design decisions.

Coming Soon: Master Mobile Web Apps with jQuery Mobile

Wed, 01 Jun 2011 05:00:00 GMT

Published in jQuery

We're pleased to announce our first book! Master Mobile Web Apps with jQuery Mobile shows you how to build great-looking mobile web apps easily using the up-and-coming jQuery Mobile framework.

This 250-page book is packed with useful info, including a detailed markup and API reference, theming tips, and a "getting started" guide. There's also an in-depth tutorial showing you how to build a complete to-do list web app using jQuery Mobile, PHP and MySQL.

As well as the book, you get a zip file containing all the source code, so you can easily follow along with the examples in the book.

We're looking to publish the book in July. Enter your email address on the book page, and we'll send you an email the moment we publish it.

Have fun!

Object-Oriented PHP: Working with Inheritance

Thu, 26 May 2011 05:00:00 GMT

Published in PHP Objects

Welcome to our third object-oriented PHP tutorial. In this tutorial you'll explore the idea of inheritance in object-oriented programming, and how inheritance works in PHP. With inheritance, your objects and classes can become much more powerful and flexible, and you can save a lot of time and effort with your coding.

The tutorial covers the concept of parent and child classes; overriding methods; final classes; abstract classes, and interfaces. It includes lots of code examples to help explain the topics.

Happy coding!

LESS Is More: Make Your CSS Coding Easier with LESS

Wed, 18 May 2011 05:00:00 GMT

Published in CSS

CSS stylesheets are becoming longer, more complex, and harder to manage. It's not uncommon for a typical stylesheet to run into hundreds of lines of code, with a large number of interdependent rules.

For this reason, various dynamic stylesheet languages are starting to spring up. These allow you to write your CSS rules using a more flexible, powerful language that is then turned into regular CSS for the browser to interpret.

In this article you'll learn how to use LESS, an increasingly popular dynamic CSS language that you can use to streamline your CSS coding, saving you time and effort.

Stock Photos Giveaway: Win a 1-Year StockedPhotos Membership Worth $99.99!

Thu, 12 May 2011 05:00:00 GMT

Published in Web Graphics and Multimedia

Time for another great giveaway here on Elated! This week, we're giving away two 12-month stock photo accounts over at StockedPhotos.com. This account lets you download as many pro-quality, royalty-free stock photos as you like during the 12-month period. No daily limits, and no per-photo fees. Nice!

Cover Flow Remade with CSS and jQuery

Fri, 06 May 2011 05:00:00 GMT

Published in jQuery

If you've used a Mac or iTunes at all, you've probably come across the Cover Flow view. This shows you a series of album covers, photos, or other documents in 3D, allowing you to flip between them by clicking them, dragging a scrollbar, or using the arrow keys.

It's a nice effect, but it requires a fair bit of processing power to accomplish. I thought it'd be a fun challenge to recreate it as closely as possible in a browser using CSS and JavaScript. At the start I had no idea if this was even possible, but I'm pretty happy with the result!

Elated Joins the Smashing Network!

Mon, 02 May 2011 05:00:00 GMT

Published in Misc

We're delighted to announce that Elated is now part of the Smashing Network! This means that our best content will now appear on Smashing Magazine's curated network posts page.

This move will be a great way to introduce more readers to our content, and it will also ensure that we're motivated to keep creating very high quality articles and tutorials for you here at Elated.

Object-Oriented PHP: Delving Deeper into Properties and Methods

Fri, 29 Apr 2011 05:00:00 GMT

Published in PHP Objects

Welcome to the second article in our series on object-oriented PHP programming.

In this article, you're going to delve a bit deeper into properties and methods in PHP. You'll explore constructors and destructors; static properties and methods; class constants; type hinting; and the __get(), __set(), and __call() magic methods. We've included lots of code examples to help you learn the concepts.

This article will give you a solid grounding when it comes to using objects in PHP, before we move on to more advanced topics such as inheritance in later articles.

Ultimate Designer Toolkit Giveaway: Win a VIP Account Worth $99!

Wed, 20 Apr 2011 05:00:00 GMT

Published in Web Graphics and Multimedia

Time for another giveaway, dear readers! Today, we're offering 3 one-year VIP accounts for Ultimate Designer Toolkit, worth $99 each. Ultimate Designer Toolkit is a collection of resources to make your life easier as a web designer or coder.

A VIP account gives you access to over 60,000 premium resources, with more being added each day.

Enter now for your chance to win!

IE9 Is Here! 7 Cross-Browser CSS Tricks You Can Now Use

Fri, 15 Apr 2011 05:00:00 GMT

Published in CSS

Last month, the newest version of Microsoft's Internet Explorer browser, IE9, hit the streets. While its CSS3 support still has some major omissions, IE9 has much better CSS3 support than previous versions of IE.

In this article we'll explore some of these new CSS features that are, at last, supported by Internet Explorer, and show what these features can do for you as a web designer or coder.

Object-Oriented PHP for Absolute Beginners

Fri, 08 Apr 2011 05:00:00 GMT

Published in PHP Objects

Welcome to the first in a series of tutorials covering object-oriented programming in PHP. In this series you'll explore the various ideas and concepts involved in object-oriented programming, and learn how to build robust object-oriented PHP applications quickly and easily.

In this tutorial, we're going to kick things off nice and gently by looking at some really basic concepts of object-oriented programming. You'll also learn how to write simple object-oriented PHP scripts.

How to Make a Slick Ajax Contact Form with jQuery and PHP

Fri, 01 Apr 2011 05:00:00 GMT

Published in jQuery

Contact forms can be useful way for visitors to contact the owner of a site. However, they can also be cumbersome, especially as they're usually on a separate page.

Fortunately, Ajax gives us a way round this problem. By embedding the form in the page, and submitting the form data via Ajax, the user never has to leave the current page. It also provides a smoother experience for the user.

In this tutorial we'll build a nice-looking, embedded Ajax contact form that the user can summon up by clicking a link in the page.

JSON Basics: What You Need to Know

Thu, 24 Mar 2011 05:00:00 GMT

Published in Web Development

If you've developed websites or web apps at all, you've probably heard of JSON, at least in passing. But what exactly is JSON? What can it do, and how do you use it?

In this tutorial you'll learn the basics of JSON, and how to use it to easily move data around the web. You also look at how to work with JSON using both JavaScript and PHP.

Let's get started!

How to Make an Elegant Sliding Image Gallery with jQuery

Wed, 16 Mar 2011 05:00:00 GMT

Published in jQuery

In this detailed step-by-step tutorial, Matt Doyle shows you how to use jQuery to build a really slick, full-window sliding image gallery. It's simple, elegant, and also shows off the photos really nicely!

You can follow through the tutorial, or simply grab the code and use it for slideshows on your own websites! The tutorial includes a link to download the full gallery code for your own use.

Enjoy!

Web Templates Giveaway: Win a 3-Month BoxedArt Membership!

Mon, 07 Mar 2011 06:00:00 GMT

Published in Web Graphics and Multimedia

It's giveaway time again on Elated! Today you can win a 3-month developer membership plan at BoxedArt worth $79.99.

This membership gives you instant access to a huge range of high-quality website templates, Flash templates, print-ready designs, logo templates, ebook covers, vector icons, stock photos, and much more.

It's free and easy to enter, so enter now for your chance to win!

The New Photoshop: What We Need in a Proper Next-Generation Digital Design Tool

Thu, 03 Mar 2011 06:00:00 GMT

Published in Photoshop

Photoshop has become an all-purpose, go-to tool for everyone. It's a massive application, weighed down by years of iterations both major and minor, and now it can do pretty much any imaging task you want to throw at it.

But this all-purpose approach is its biggest failing. It's simply too complex for a specialist web designer to use.

In this article I'm going to set out my stall as to how I see a different kind of tool - one which will take us forward into the brave new world of digital design in the 2010s.

20 Ways to Make Your Freelance Web Business More Productive

Fri, 25 Feb 2011 06:00:00 GMT

Published in Website Management

Running a freelance web business can be a challenge, and part of that challenge is keeping yourself productive! Inefficiencies, distractions and a lack of organization can all contribute to bogging down your business, killing productivity.

However, armed with some useful strategies and working practices, you can reduce these roadblocks to productivity and make your business run more smoothly and profitably.

In this article you'll discover 20 useful tips to help you improve productivity in your business. Enjoy!

Drag-and-Drop with jQuery: Your Essential Guide

Thu, 17 Feb 2011 06:00:00 GMT

Published in jQuery

Dragging and dropping can be a very intuitive way for users to interact with your site or web app. Drag-and-drop with JavaScript used to be very hard to do - in fact, getting a decent cross-browser version working was next to impossible. However, with modern browsers and a smattering of jQuery, drag-and-drop is now a piece of cake!

In this tutorial we take a look at how to create drag-and-drop interfaces with jQuery, and we finish with a complete drag-and-drop example: a simple number cards game for kids.

Camera to Browser: Making a Web Video Xmas Card in 5 Days

Thu, 10 Feb 2011 06:00:00 GMT

Published in Web Graphics and Multimedia

In December last year - with about ten days to go before Christmas - a client asked Simon how they could deliver some kind of online Christmas card. The end result was a short movie, with original soundtrack, shot, edited and published on the web in a mere 5 days!

In this article Simon describes how he did it.

This project definitely comes under the heading of "it shouldn't happen to a web designer", but it goes some way to illustrate the kind of thing we're supposed to be able to deliver these days, as the web becomes more varied as a delivery mechanism.

PHP Recursive Functions: How to Write Them, and Why They're Useful

Fri, 04 Feb 2011 06:00:00 GMT

Published in PHP Functions

Like most programming languages that support functions, PHP lets you write recursive functions. In this tutorial, we'll explore the concept of recursion in PHP, and discover how to create recursive functions for various tasks.

Recursion is one of those topics that can seem confusing at first, but once you start writing recursive functions you'll see how elegant recursion can be!

Hold That Website! 12 Things to Check Before Launch

Thu, 27 Jan 2011 06:00:00 GMT

Published in Website Management

After weeks of hard work, your new website's ready to launch! It's uploaded, you've set up the domain, and you're ready to take the wrapping off and reveal it to the general public.

Before you hit the proverbial switch, however, it's important to check that your site is functioning correctly - especially if you're launching it with an expensive marketing campaign.

Here's a list of some important things to look for when giving your site its pre-launch testing.