Tag Archives: software

The One Webdesign Practice Most of Us Forget

Don’t you hate it when you’re trying to see a picture, watch a video, or listen to a song, only to see a warning that reads “You need [this random browser plugin] to view this content”? It’s an unpleasant shock to any user, even (and maybe especially) for us webdesigners and developers who know the inner workings of such programming.

What compounds the frustration, however, is when a website that needs a special plugin does not tell you anything about how to get the plugin–it just tells you that you need it and leaves you to fend for yourself. At that point, most users simply exit the site and find another one that isn’t so picky about how they view content. And who can blame them? Most Internet users (and that includes us, too) don’t want to have to work that hard for information or entertainment!

It’s easy to point the finger at other websites for inconveniencing their users like this…but we who create websites often forget to provide that exact same service for our own users. We often forget to make our sites as easy and convenient as possible for our users to view.

The Solution: Plugin Links

Whenever we include media content on our websites, such as a photo gallery that requires a script to run, a video, or an audio track, we should always take the following steps:

  1. Check your media content in as many common browsers as possible, to make sure it will appear and run correctly with the right plugins installed. Today, most people use Mozilla Firefox, Internet Explorer, and Google Chrome, but also include Opera and Safari.
  2. Be aware which browser plugins process which content. For instance, Adobe Flash Player is most often used to run Youtube videos, and Quicktime still runs most audio tracks; most photo galleries use jQuery or something Javascript-related.
  3. Include plugin links for these common browsers–for example, if you’re running a Flash video, make sure you have Adobe Flash Player plugin links for Firefox, IE, Chrome, Opera, and Safari located somewhere just below the video in plain view.

This may seem like a lot of work, but it’s important that we do this backend work so that our users don’t have to. It’s all part of providing a more convenient, informative website.

Do You Make Music? These Five Free Programs Could Help You!

As a musician, singer, and composer, I’ve long wished for desktop applications to help me record and even notate the music that I write. (Most of my pieces of music are still in my head, not notated anywhere because I hate hand-notating so much. LOL)

On a whim this week, I began a new search for music-creation and music-notation programs…and I came up with the following five programs, which can help musicians and composers of all types and experience levels. Not only are these programs helpful, but they’re all free!

For Generating Electronic Music on Your Computer

Psycle is music creation software, with less emphasis on recording and more emphasis on making music within the program itself. The open-sourced nature of the program also leaves users free to build plugins for it themselves, so it’s great for the music tinkerer who also loves to code. And, if you need help at any time, it’s got a lively, deeply-established online community built around it…which is also great for showing off your newest creations!

For Recording, Editing, and Converting All Sorts of Sounds

As one of the premier open-source audio recording/editing programs on the Internet these days, Audacity can help you record any kind of audio track, edit all manner of audio file formats, convert old tapes and records into digital form, and even change the pitch or speed of a recording! (Ooh, I might use this to see how certain songs sound in my favorite keys. “Titanium” by David Guetta in C-sharp minor, here I come!)

For Recording/Editing MIDI Sounds

If you can connect your MIDI musical keyboard to your computer, MidiSwing can help you record the music made through that keyboard. It can also help you edit MIDI files, as well as compose music from within the program itself. Best of all: it’s compatible with just about any system that can run Java 2. (I might look into this to record my music on my computer, since I <3 my digital keyboard. 😀 )

For Automatically Notating/Playing Back Music, and Making Sheet Music

A must for anyone who hates hand-notating music as much as I do. MuseScore can not only automatically notate the music that’s played into the program through a MIDI connection, but can play it back, and print out real sheet music, too! (DEFINITELY getting this–I’ve been wanting to get my music on paper for years!)

For Recording/Generating Music and Mixing It Yourself

A complete Java music workstation in one program, Frinika supports MIDI, sequencers, recording, and editing, among many other audio tasks. Pretty much, if you want to record/edit/mix it, Frinika can handle it! (This looks pretty technical, so this is probably for the more advanced music mixers among us, but it’s a great all-in-one program nonetheless.)

More Music Creation Resources

For a much more comprehensive list of free music-creation programs, visit Free Music Creation Software on Squidoo–options for Windows, Mac, and Linux systems are available, as well as more specific kinds of software for various musical and audio purposes.

Web Design on a Budget: The Three Best Free Software Tools

If you’re just beginning web design/development, or if you simply don’t want to spend money on expensive software tools, it may seem impossible to achieve your dream of coding and designing your own site. You might even think you can’t create anything worth looking at or browsing if you don’t have high-end software.

I am happy to tell you that there are wonderful free software options for all of us who can’t yet afford some of the loftier programs. Not only are these programs free, but they are often the best utilities out there for the price. Here are the three webdesign software tools I use for my own designs:

Best Free Code Editor: Notepad++

Ever since I began web design, I longed for a “just-code” editor, one that would display the bare code like Notepad did…except that I wanted a little more Web-specific functionality, too. I wanted to surf through the code without getting so lost; I wanted to be able to speed up the long and tedious editing process. I needed a program that wasn’t so simplistic as a WYSIWYG editor, but one that was also helpful for those of us who were learning code.

Well, someone in the Notepad++ development team must have heard my prayers! Here, you can see how the different bits of code are color-coded (HTML tags are blue, selectors are in red, option choices are in purple, and so on).

See the gray minus sign and the line extending between the opening p tag and the closing p tag? This is another one of Notepad++’s great tricks: “folding up” a section of code if you need it up and out of the way.

When you click the minus sign, it closes the section of code encased by the opening and closing p tags, resulting in a display like this. Clicking the red plus sign will expand the hidden code out again.

Like the image above says, the “Replace” function is also known as “Hallelujah!!!” That’s what you’ll shout when you realize you can use the Find & Replace function to edit the same text in every file you have open within the program. SO awesome for expediting those previously long and tedious tasks, like editing a line of code on every page of your site.

Now, I haven’t even begun to expound upon all of Notepad++’s awesome features. The program supports a variety of different languages, from ASP all the way to XML, and even including some languages I’ve never even heard of (Haskell and KIXtart, among others). Plus, it has the ability to use macros, plugins, and converters for even faster programming. Check out the program with the link below:

Download Notepad++: Notepad-Plus-Plus.org

Best Free Graphics Program: GIMP

Ever wanted Photoshop but couldn’t hack the $600 price tag? Well, GIMP can do most things you’d use Photoshop for, even transparency and text addition, but for free.

Its interface is a little more free-form and spartan…

…but within it, you can still do all of the basic image-editing techniques, as well as some of the more sophisticated ones usually in higher-end products.

This is how an image looks when opened within GIMP–it appears in the central box of the program.

Most of the tools that usually appear under Enhance in Photoshop-esque programs are located under Colors in GIMP, such as Brightness/Contrast, Levels, Hue & Saturation. etc. These dialogs work just as well as the pricey ones, and these come with handy ToolTips to help you navigate the menus.

This is an example of the Levels dialog, in which you can change the shadows, midtones, and highlights to your heart’s content.

The Image menu remains largely unchanged from programs like Photoshop–it’s just that the “Resize Image” dialog is renamed “Scale Image.”

The dialog for resizing the image appears here. To resize your image proportionally, just type in your desired height or width, and then click the linked chains to the right of the boxes to get the corresponding number in the other measurement.

Besides changing sizes and tweaking shadows and highlights, GIMP can also do a lot of the artistic filters on pictures that Photoshop can, plus cropping, layering, and masking. It’s a great program, and even after six months of using it I’m still not done exploring all it can do. Check it out for yourself!

Download GIMP: GIMP.org

Best Free File Uploading Program: FileZilla

If you’ve got tons of files to upload, never fear that you’ll be stuck uploading through your browser again! FileZilla is a free FTP program that offers clean and simple uploading (and downloading!) functionality.

This is what the program looks like before you make a connection to an FTP server. On the left appears your computer’s folder hierarchy (top left pane), and the content you’re working with in the currently open folder (bottom left pane).

To connect to your FTP server, you’ll need to provide FileZilla with some information. This is the Site Manager dialog box, where you plug in the info for your site. The “Host” line is usually something like “ftp.yourdomain.com”; you’ll need to fill in your username and password for your hosting server. (My details are obscured for privacy reasons.) Once you’re done filling in your info, you can save and connect!

This button, at the top right underneath the word “File,” is the Quickconnect button. Use this to connect to any of the sites whose profiles you’ve saved already through the Site Manager dialog box.

Once you connect to a server, its folder hierarchy appears in the top right pane, and the contents of an individual folder appear in the bottom right pane. Uploading can be as simple as dragging and dropping the files from the bottom left to the bottom right pane!

Or, you can always right-click the file you want to upload and choose “Upload” from the right-click menu. (For Mac users, I am not sure of the keyboard shortcut to achieve this–please pardon my Windows-user ignorance.)

If you want to upload multiple files, the highlight-and-right-click-upload method works best, I’ve found.

FileZilla will even warn you if a file already exists, and through this dialog box you can choose whether you want to overwrite it or not–it even specifies very detailed actions depending on the age and size of the two files it’s comparing.

Not only can you upload files, but you can download them from your server as well! It’s great for making file backups…and, as I found out in 2011, great for emergency saves of all your hard work. When my hard drive crashed in 2011 and I lost ALL my data, FileZilla was able to download copies of all my files from my hosting provider very quickly and efficiently.

(And, just like uploading multiple files, you can highlight-and-right-click all the files you want to download from your server, and do it en masse. That’s what made getting all my Web work back a whole lot easier.)

FileZilla may not have a lot of frills, but it’s an excellent utility for bulk uploading and downloading, making file backups, and connecting to your site without having to have a browser window open. It’s well worth a download!

Download FileZilla: FileZilla-Project.org