ideas for website designers
Designing is like riding a bike – you never forget how, but it does get rusty if you don’t do it often. So you landed a user interface design job! Well done. The various ideas for website design hide under lots of names – UI or UX designer, interaction designer, front-end designer or developer, and web designer, to name a few.
The things you learn and the connections you make at this first (and all future) job will be valuable to you for the rest of your career. And learn from other members of your team. Do you know about project management or business financing? No? Well, they do and are probably happy to share some unique ideas for website designers or beginners out there. Salaries are pretty good in the web industry. Depending on where you are (yes, in a city with a decent tech community), you can make around $20,000 a year starting out.
From what I’ve seen, positions that involve design and writing front-end code seem to have higher salaries than those with only design, so keep that in mind. And you can always freelance! If your job isn’t in an area that interests you, find clients who are. Most people nowadays don’t work for the same company for their entire lives (it’s ok if you do!), so don’t feel pressured to stay somewhere you aren’t happy. Chances are, you’ll have many professional design jobs. Use these changes as a way to work your way up the ladder. Many small agencies don’t have room to expand because there may only be two or so designers, to begin with.
I use WordPress, but there’s also Drupal and Joomla. We also used Concrete5 at my last job – it’s less robust and well-known than the others, but it’s streamlined, really easy to customize, and has a great community around it. There’s also Cargo Collective, which is a free platform. They host your site, and you can pick a base theme and then customize it.
All their websites are artist and designer portfolio sites, and you can talk with other designers in their community. It’s pretty cool. Some tools I use every day: Pocket, which lets you save articles and web pages for later.
I don’t have much time to read things while at work, but it’s great to be able to save a link and then read it during some free time. Evernote and One Note are great cloud-based note-taking applications. I use Dropbox constantly to share ideas for website designing between my work and personal computers, or with coworkers and clients.
A font manager is really important if you’re a designer who likes typography. When I was starting out, I was just adding tons of fonts to my system fonts folder, which eventually pretty much crashed my computer because it was always trying to load them all. A font manager lets you turn individual fonts on and off, sort them, and gives you a nice interface to preview and compare them. I use Suitcase Fusion, but there are other options.
I also use GitHub, which is an online code repository that lets you track changes to your code and backs it up in case you ever mess everything up and need to revert to a previous version (which happens).
There are also lots of web design sites, like site inspires, the best design that has written tons of reviews on the different ideas for website designing. Subscribing to email newsletters is a great way to find interesting articles and get free resources, like fonts and icons. Webdesign, DesignModo, and CreativeMarket are a few I subscribe to. There are also countless great design blogs out there. A-List Apart is fantastic. Smashing Magazine is a little bloated, but they put out good information. Teehan + Lax is a design agency that has a really good blog you can follow.
Another good thing to do is find designers you like and subscribe to their blog, or follow their work on social media. In Photoshop, there are tons of plugins and actions that are really helpful. They can do things like export assets automatically, divide the page into a grid, etc. Just search for “Photoshop plugins for web design”.
Instead of changing every text layer individually if you change fonts or sizes, use a style so you only have to make the change in one place. Layer comps let you save multiple layouts in the same file. Rather than having a homepage file and an about page file, use one file with a homepage comp and an about page comp. They let you use the same layers but saves the positioning, visibility, and other attributes of that layer for each comp.
And the organization is so important. Organize the files on your computer, but also organize your design layers. This is especially important if you’re going to be sharing the file with other designers. There are tons of coding resources, too. For your IDE (which stands for the integrated development environment, and is just the editor where you write your code), there are tons of options. I use Sublime Text, which has free and paid versions.
There are also Coda, Notepad++, Brackets, TextWrangler,etc. When building a website locally, it’s really helpful to set up a local host environment. This way you can access your site from other computers or your mobile device because it essentially turns your computer into a little webserver. I use MAMP, but there are others. Frameworks are super helpful. Bootstrap and Foundation (which we use here at Infinity) are the big kids on the block, but there are also ones like Skeleton, which give you the bare necessities for a responsive grid.
And speaking of best ideas for website design practitioners, When writing CSS, I really recommend using Sass (which Foundation uses) or Less (which Bootstrap uses) once you’ve got a good grasp on normal CSS. These are CSS processors, which means you can write things that the browser wouldn’t understand, but they compile your code into basic CSS which the browser does understand. You can nest styles, which really cuts down on repetition.
You can use variables for things like colors and fonts. You can write a chunk of code once, then call that code each time it’s used, which decreases repetition and the chance of errors. You can also use math and write basic logic functions. It’s awesome. There are some life-saving browser plugins and add-ons I recommend. Firebug (for Firefox) and Web Developer Tools(for Chrome), let you edit code in-browser and see what it looks like live.
You still have to actually edit your files separately, but these are the two browser tools I use the most. They also help with debugging. Color Picker lets you grab colors straight off the screen and copies the HEX value to your clipboard automatically. No more taking a screenshot and opening it in Photoshop to get a color. Rulers let you measure things on the screen. Window Resizer lets you see your design at common screen sizes with the click of a button.
There are other great training sites (some free and some not), such as Code School, code.com, and Lynda. YouTube.com is a platform where you can find everything you need about ideas for website designing, meet and network with web industry professionals and other designers and developers. I believe it offers valuable learning resources, so that would be a great opportunity if you’re interested. There are also quite a few web design and development Meetup groups online, including some focused on women in tech. Those would be a great way to meet people in the industry, as well as attend training and gain skills.
So that’s all for this article. If you have any questions, feel free to check our knowledgebase section or drop us a comment. Thanks!
