Web Design

Setting up arrow keys on your home row

For Mac, I find this to be AWESOME (seriously): Go into System Preferences > Keyboard > Modifier Keys, then change Caps Lock to Control, which is helpful because Control is hard to hit, then install KeyRemap4MackBook, then enable the Diamond Cursor, which makes it so:

  • Control+J is your left arrow
  • Control+L is your right arrow
  • Control+I is your up arrow
  • Control+K is your down arrow

Basically, you hold caps lock, and then your right hand's default position on the home row is now sitting on your arrow keys. This way, you can use arrow keys without leaving the home row, which greatly increases speed. I'm now to a point where I cannot use another Mac without this installed.

10 Fundamentals of being a Front End Web Developer

  1. Know how to use a computer - very well. Seriously, not just turning it on and launching a browser, then going to Facebook. Learn the tricks, tweak it, break it, fix it. Know your tools well.
  2. Keyboard Shortcuts - Every chance you get to use a keyboard shortcut over a mouse click a kitten somewhere has it's life spared. Tell yourself that. What I do is use my mouse to go into the menu for what I want to do and look at the keyboard shortcut for that menu item, then I don't click on it, close the menu, then pull the command out of my short term memory and use it. This works wonders for memorizing these. It's almost impossible to read a big list and then have them stick. Work on learning 3 or so at a time then add more when you can use them without thinking.
  3. Understand the file system - both on your machine and the server. Google 'absolute path' & 'relative path'. Better yet, just read the Wikipedia article on Paths. Also read up on FTP - It's how you'll move files from your computer to a server.
  4. Learn how to learn - get good at researching what you're stuck on. Google obviously, but also go to physical bookstores and flip through books. Buy new ones that call to you often.

Learning Front End Web Development

I am a self-taught Front End Web Developer who writes a lot of CSS, HTML, & jQuery Javascript and pushes pixels in Photoshop from my laptop with flexible location and time restraints. I love my job. I want to share how to get started in this field. I feel that if you're reasonably tech-savvy and persistently driven, you can learn this. If you're not tech-savvy, then just double up on the persistence. First I'll cover the tools needed, next I'll go over the fundamentals, and then share my favorite resources.

Tools

  • Mac - Not saying you can't do this on a Windows or Linux machine, just that if you want to, you're learning from the wrong guy. That being said 95% of the people I know that do design, development, or production, do it on a Mac. You don't need a fast one as web work is pretty nimble (most files are really small). I'd suggest getting the low-end MacBook for the basics, or the low-end MacBook Pro if you've got a little extra. Portability is nice. If you know you'll only be working at home, then go for the iMac. That thing kicks ass and you get a huge screen (super helpful to have lots of screen space). If you go laptop, eventually get a second monitor.
  • Coda - Skip Dreamweaver. You need to learn the code.

Awesome Auto-Versioning System using Dropbox and Coda

I just came across an awesome, better way to work with web files doing what I do, which is usually spending a lot of time working with CSS, jQuery Javascript files, and images to create themes for Content Management Systems, my favorite being Drupal. Setting up a proper versioning system, like Git or Subversion, can be a little time-consuming and overkill for one person working, but everybody knows that backup and versioning is essential.

Dr. Dicther

Dr Dichter Staff Page
Dr Dicther Services Page

Missio

Missio Home Page
Missio Store Page

NewWest.net's Missoula page

NewWest.net's Missoula page
NewWest.net's Missoula page

Phoebe Knapp's Portfolio

Phoebe Knapp's Portfolio
Phoebe Knapp's Portfolio

Darkroom

Darkroom
Darkroom

Luke George Photography

Luke George Photography
Luke George Photography
Syndicate content