All posts tagged ‘tutorial’

File Under: CSS

Update an Old Website With Stylesheets

The other day I ran a highly constrained Google search for one of my ancient pseudonyms (yes, thank you, moving to the country has left me with a glut of free time) and discovered my first Usenet post, circa July, 1994. And let me tell you, nothing, NOTHING makes you feel older than reading the ranting of your ten-years-younger self.

Chances are your first Usenet post either predates mine or you have no idea what I’m talking about (if you’re the latter, all you “need” to know is that Usenet was before Google bought it). While Google still indexes the really old posts, it doesn’t let you sequentially scroll through stuff that predates early 2000, so unless you know exactly what to search for — a person’s ancient cyberpunny handle, say — you’re probably not going to turn up anything. And thank god; I really don’t need that part of my past surviving in perpetuity (mark my words:<meta name=”robots” content=”noindex, nofollow”>).

If unearthing ancient Usenet posts makes you feel old, try re-entering the world of Web design after a five-year hiatus.

“I was up really late working on a … website,” I told my brother, pausing sheepishly in the silence on the other end of the phone. “I think I’m, uh, going back into Web design.”

“Wow. How retro,” was his only response. And I don’t think he meant that in the “retro cool” sense. No, not at all.

Not only was I was old and uncool, but I my tech skills were dated. My CSS knowledge was abysmal. I had no idea there was almost complete browser support for CSS Level 1. In fact, I didn’t even know about CSS Level 2. You can control the printer output of your pages? And speed at which pages are read out loud? Who am I, Rip Van Winkle?

And, oh!, what about the poor meta keyword tag?

Continue Reading “Update an Old Website With Stylesheets” »
File Under: UI/UX

Information Archetecture Tutorial – Lesson 1

Why’s Information Architecture So Important?

Information architecture (also known as IA) is the foundation for great Web design. It is the blueprint of the site upon which all other aspects are built – form, function, metaphor, navigation and interface, interaction, and visual design. Initiating the IA process is the first thing you should do when designing a site. This series of articles describes specific methods and processes for developing a site’s information architecture.

Clients sometimes view the development of an IA to be impractical, both in terms of the time it takes and the skill needed to do it effectively. But this mentality is slowly changing. A good IA is incredibly effective, and knowing the basics of the IA process can save both time and money in the long run. Also, you don’t need to be an expert to use it to your advantage.

This series will demonstrate how easy and powerful the IA process can be. We’ll present two ends of the design continuum, which can be thought of as either the difference between developing a small and a large site or the difference between having little time and having lots of time to design a site.

Each article presents a portion of a design document. Upon completing this series, you will have the template for a complete IA design document; the record of the decisions made in designing the site. It serves as a road map for the site’s construction. Additions and revisions are made easier by the presence of this document. Oh, yeah – and clients and management love this stuff.

Also, just about everyone these days is a proponent of ease-of-use. Well, ease-of-use starts here. It’s practically guaranteed if you have a solid information architecture at the outset.

Continue Reading “Information Archetecture Tutorial – Lesson 1″ »
File Under: Web Standards

Choose and Register a Domain Name

So the time has come for you to name your business. Your consultants and facilitators have assured 110-percent buzzword compliance, and you’re ready to leverage whatever it is that you leverage. All you need now is a name.

Now, the interesting thing about web-based business is that, for the most part, your address IS your name. (“It’s a fascinating problem in information theory,” I keep saying to philosopher friends at parties, but nobody will take the bait.) So the name you choose for your company has to correspond with an available domain. But as of fairly recently, there is no English dictionary word that remains un-registered. (DomainSurfer has a searchable index of domains, where you can spend hours demoralizing yourself by looking at the huge portion of the namespace that’s already colonized.) So where do you turn?

If there’s a particular name that you have your heart set on but that someone else has already registered, there are a few sly ways to sidestep the conflict.

Continue Reading “Choose and Register a Domain Name” »
File Under: JavaScript, Programming

Make Images Grow and Shrink With JavaScript

If you ask me, image galleries are boring.

They’ve been around since forever, and they all work the same way. You have a page full of thumbnails, and when you click one, you get a page with a larger version. What if thumbnails could grow into full images seamlessly right on the same page?

Impossible, you say? Not so, good sir or madam, if we use a little JavaScript. Check out the demo to see yourself.

Continue Reading “Make Images Grow and Shrink With JavaScript” »
File Under: Programming

VI Tutorial for Beginners

So you’ve graduated from webmonkey to mobile webmonkey. The good news is, you’ll be able to build Web sites for fun or profit nearly anywhere. The bad news is that no two computers are alike, so there’s no guarantee that your next location will have the HomeSite/CuteFTP or BBEdit/Fetch combo you’re used to.

Face it:You may not always be able to work in your usual comfortable environment. You may be someplace where your text editor won’t load, there’s no mouse, or you’re faced with a PC and you’re a diehard Mac user. How do you maintain your mobility without dragging your own computer with you everywhere? Learn a Unix text editor. You’ll be able to work with aplomb in a wide variety of situations – virtually anywhere, on any machine – and move on to a new level of Unix godliness.

There are three commonly used Unix text editors – pico, emacs, and vi. This week, I’ll walk you through the basics of vi.

Continue Reading “VI Tutorial for Beginners” »