HTML Article Archive | Design Shack

How to Build a Website With Adobe Project Rome

November 24th, 2010 25 Comments

Adobe recently launched a project called Rome that is meant to be a sort of all-in-one content publishing platform. You can use this innovative application to build websites, print projects, interactive PDFs and more.

Today I’ll give you a super basic beginner’s introduction to Rome so you can see what it is, how to use it and whether or not it’s right for you.

How to Build a Website With Flux 3: A Coder’s WYSIWYG

October 22nd, 2010 38 Comments

Flux is a WYSIWYG website editor for Macs. Now, before you curse under your breath about how much you hate WYSIWYGs, you should know that Flux is different and is both powerful and flexible enough to be used by professional web developers.

Today I’ll introduce you to Flux by creating a super simple web page from scratch (no annoyingly rigid templates). Along the way we’ll see what a typical workflow looks like and why it just might be the best visual web editor I’ve ever used.

27 Utilities for Saving and Sharing Code Snippets

July 30th, 2010 40 Comments

You’ve got countless bits of HTML5, CSS3, JavaScript, and PHP rolling around in your head and on your hard drive that you are forced to try to recall each time you start a project. It’s time to get organized.

This post will briefly point you to 27 great utilities that not only help you store your favorite snippets both locally and in the cloud, but also make sharing with others a breeze. Enjoy!

Rapid Blueprint CSS Layout With Boks

July 13th, 2010 11 Comments

Today we’ll take a look at Boks, an awesome little tool that will help you spec out a basic site layout in no time flat.

We’ll go through what it is and how you can use it to speed up your development as well as what the limitations and downsides are that you’ll want to be aware of before you download the app.

52 Framework: The First Ever HTML5 and CSS3 Framework

July 1st, 2010 42 Comments

Today we’re going to look at a new project from the Enavu Network called 52 Framework.

It claims to be the first framework built specifically for HTML5 and CSS3. Below we’ll look at some of the basic features and dig into the code to see what we can find.

10 Tips for Designing HTML Emails

June 24th, 2010 50 Comments

Love ‘em or hate ‘em, HTML emails are a wildly popular marketing tool and you will almost definitely come across clients that want you to build them.

If you don’t know anything about HTML emails, they’re annoying to develop and break all the rules you’ve ever learned as a web designer, but being able to code them is a valuable skill to possess. Today we’ll look at ten quick and easy tips to get beginners started on the road to creating beautiful and functional emails.

Analyzing and Comparing Popular Blog Designs

June 12th, 2010 16 Comments

If you’re thinking about starting a blog, there are a lot of technical details to consider when attempting the initial layout of your page. How large should your text be? What font should you use? Should your images have borders?

We’ll help you answer these questions and more by tearing apart the post designs of popular design blogs. Examining the work of others will give you insight into popular trends and what you think works best. Let’s get started!
Read More

HTML and CSS Debugging Tools

June 10th, 2010 28 Comments

Whether you’re a beginner or a pro, troubleshooting your HTML and CSS can be a real pain if you’re not equipped properly. Today we’ll look at a few tools to help you force that pesky web page into submission.

Create an Awesome 3D Slideshow With Cu3er: Part 2

May 28th, 2010 12 Comments

Today we’re going to finish up our two-part cu3er tutorial.

For those who don’t know, Cu3er is an awesome 3D image slider that’s free to use and easy to setup.

This section will examine how to tweak your slideshow using some of Cu3er’s many customization options. We’ll mostly be editing an XML page but don’t worry about it getting too techie. Even if you don’t know what XML is, it’s all pretty straightforward and easy to understand.

Create an Awesome 3D Slideshow With Cu3er: Part 1

May 27th, 2010 30 Comments

Today we’re going to build a simple web page with an amazing and free tool: Cu3er.

Cu3er is a really neat 3D image slider with crazy visual transitions and lots of customization options. Though it’s built with Flash and JavaScript, you don’t really need to know either of these to use it.

In this article, we’ll get the page built and the slideshow up and running. Next time we’ll return and see how to customize some of Cu3er’s many features and variables.