Coffeemonk

Designing For Expandable Content Boxes

Designing for Expanding GradientsThere are many issues to deal with when designing for the web, and one of the most fundamental—and seemingly hard to understand or remember—is the simple fact that the end user ultimately has control over font size, not the designer. I’ve seen many gorgeous designs that are completely untenable if the fonts are enlarged by even a single point size.

In this post, I’m going to look at a singular expression of this problem, but it should be remembered that this is just one possible example. The possibility of font resizing should be considered when designing any and every piece of a website.

Read the rest of this entry »

Tags: , , , , ,

Convert PDFs to JPGs from the Commandline

ImageMagick's convert commandWhen I first switched to Linux, I also attempted to switch to Gimp—which is generally considered to be Linux’s Photoshop. My experience with Gimp, especially versions before 2.5, was not great, and I switched back to Photoshop pretty quickly.

One of my freelance clients publishes a newsletter every month, and I convert the PDF into JPG images to use on the site as a sort of low-fi online version. I discovered pretty quickly that Gimp’s conversion routines did a terrible job. Eventually, I found a solution using ImageMagick, which I had used previously in my bipolar gallery scripts.

Converting images is super easy with ImageMagick’s convert command, and as it turns out, convert can also handle PDF files.

Here’s the commandline I use:

convert -density 300 -size 4100 sourcefile.pdf -quality 100 outputfiles.jpg

Basically, this converts each page of the pdf into a 300ppi JPG with a maximum dimension of 4100 pixels and a JPG quality setting of 100% (or no compression). Each page is saved as an individual JPG named outputfilesXX.jpg (where XX represents the page number, starting at 00).

This gives me much higher-quality starting images than Gimp provided, which I can then resize as needed.

convert has a huge array of features beyond this simple example, and is worth a look if you need to do image manipulation from a script, or batch operations on images from the commandline.

Tags: , , , , ,

Photoshop Guides and Pixel-Precise Alignment

Getting Guides RightBack when I was strictly a front-end guy (meaning HTML/CSS/JavaScript, ya potty-minded sleezebags!) I had to muck around in Photoshop every day. A big part of my job was taking files—usually from people who had little to no idea how I did my job—and cutting them up into building blocks for a webpage. Over the years, I’ve seen a lot of sloppy Photoshop files, and have figured out a few things that a lot of designers apparently never seem to notice.

When I started, table-based layouts were the gold-standard, as they were really the only way of exerting any form of control over a layout, HTML-wise. Because of the way tables worked, elements in web layouts had to be sized and aligned to pixel-perfection, otherwise, things just ended up looking all screwy. Unfortunately, back then, getting pixel-perfect layouts was like winning the dollar lottery with a fifty cent ticket. (It didn’t happen, see.*) Today things are a bit better, and the rise of CSS allows for both more and easier layout control, and for a somewhat reduced requirement for pixel-perfection.

This is definitely not to say that designers should be let off the hook—if you’re executing a gridded layout, or a series of thumbnails and the edges don’t line up or the thumbnails aren’t all the same dimensions, then you’re being lazy, or sloppy, or both. The fact that Photoshop gives you fairly elegant tools to avoid these problems means that there’s really no excuse for it.

That being said, there are some things that can make a designer’s job harder. I’m planning to post a few of the Photoshop tips, tricks, and guidelines I’ve picked up as a web developer, starting with this one, dealing with a particularly annoying and quirky behavior of Photoshop’s guides.

Read the rest of this entry »

Tags: , , , , , , ,

Keyboard Shortcuts: The First Words in Productive Computing

Keyboard ShortcutsIf there’s one thing I’ve learned about becoming a more productive computer user, it’s this: keyboard shortcuts are the holy grail. In my average workday, I would guess that I could shave over an hour off my time on a lengthy project, just by learning and judiciously applying keyboard shortcuts.

Obviously, this will be most effective for people who already spend most of their time with their fingers on the home row (writers & coders), but many of the best mouse-centric programs often have single-letter or one-handed shortcuts that are very beneficial.

Though I’m planning to write a few posts dealing with specific applications that I use every day, and my favorite or most frequently used shortcuts in those applications, there is also quite a bit that is available by default in most modern operating systems. In this post, I’m going to try to give you a few common shortcuts that will work on Windows, Mac OS X, and Linux.

Read the rest of this entry »

Tags: , , , , , , ,

Hooked On Linux

KeyboardI don’t remember when I first heard about Linux, or even Unix, but I do know it was a long time ago. My first impression was that Unix was an OS for mainframes and comp. sci majors. When I learned that it was capable of multitasking and running a GUI, my brain nearly fell out. Years later, when I learned of Linux, I got basically the same impression—it seemed like trying to run a mainframe OS on a little desktop box.

At a time when I was spending countless hours of my life endlessly tweaking my Amiga and whatever crap PC I had on hand, or trying to devise the perfect partition/directory structure, spending 3 hours compiling something just to get the machine to boot up seemed like a colossal waste of time. As time went on, the idea of Linux as desktop OS was becoming less ridiculous, but there still seemed to be a giant learning curve. It was hard enough keeping Amiga and DOS cli commands and syntaxes straight, much less learning an entirely new one!

A few years ago, I finally got a Macbook at work, running OS X, which is Unix based. As I learned more about the Mac—and kept running into brick walls of broken or missing functionality—I started to dig into the command-line. I got a little more comfortable with it as time went on, to the point where I was seriously considering a personal switch to OS X, and finally ridding myself of an unfortunate dependence on Windows.

Read the rest of this entry »

Tags: , , , , ,

© 2009 Coffeemonk. All Rights Reserved.

This blog is powered by Wordpress and Magatheme by Bryan Helmig.