I am a graphic designer, how do I become a web designer?
I need to expand my experience as a designer, but it am not sure what programs I should learn to become a web designer. How would I go about bridging my graphic design experience with web design?
Expert Answers
Sort by Date
Sort by Votes
Feb 23, 2016
If you already have a grip on HTML5 and CSS you're off to a good start. What I would do next is start learning Javascript, not JQuery or any of the other Javascript libraries... just plain regular ol javascript, THEEN get into JQuery and whatever other JS libraries. as you like. I say this because people will skip to one of those other libraries and learn how to use them, but won't have any understanding about how they work and WHY they work the way they do. Starting off with regular old Javascript will give you the foundation to be able to pick up all the others nearly on sight because all they do is simplify Javascript to make it easier to code..... which will make you learn them a lot quicker than if you didn't do JS first.
Once you're able to think in Javascript and JQuery, start learning Ruby on Rails or DoneJS. I know what you're thinking... which is "I just want to do HTML for now and will get into that stuff as I get more advanced".... but TRUST ME when I say DO IT ANYWAYS!!!!... of course it'll be good for you to do a few projects in HTML and CSS just for practice, but Ruby or DoneJS makes coding websites and apps WAAAAAAAAAAAAAY easier than doing them all in HTML.
First, they drastically cut back on the amount of coding you have to do, because lets say you're building a store and you code a div to display a main picture, price, sizes and colors. And lets say you have 50 products to start with, doing it strictly in HTML you're going to have to hand code each and every single detail about each product. Where in Ruby or DoneJS you can just code that div the way you want it just ONE TIME and save it as a template and include it one time on the page you want it on and just add the Ruby or DoneJS coding to it to tell load every product in the database into one of those frames..... which reminds me.... you're going to want to look into SQL and maybe MongoDB as well for database development, but those are pretty easy so don't worry. Actually all of them are easy, it just takes time to learn them.
Aside from that Ruby and DoneJS make things quicker because you do a lot of things from a command prompt to generate the different pages and relationships between them. Just off top when you type "rails new (type whatever you want to name your app without the parenthesis)" it generates the framework for the whole site.. which saves you HOURS of coding. In a nutshell, you can look at it as a type of "wordpress" or "wix" for people who code from scratch.... instead of clicking and dragging you do it with a coding language that makes it easier for you to code in HTML, CSS, JQuery,SQL,MongoDB,PHP and or whatever other languages you want to use in a project. Once you get good with it you can make a site in mere hours that normally took MONTHS with just HTML, CSS and Javascript having to code each and every element you want on the page.
Feb 21, 2016
If you like web design, you require picking the part you like. Do you like coding or do you prefer the UI part. I think it is good to be excellent at both, although some people are. I think it is better to specialize in both areas.
Good luck!!
Jul 24, 2015
Hi,
As you are a graphic designer, it means that you have a good command over Photoshop and other similar tools. But, as you want to initialize your expertise in web designing field, you need to learn following languages:
HTML5
CSS (Media Queries are also need to be learned)
JavaScript (Used to make scripts)
JQuery ( Used to make animations without using CSS)
Bootstrap ( For making the website responsive)
All the above mentioned platforms are in high demand. Once you learn them, you only need to do is Practice, Practice and Practice. It will sharpen your talent.
May 8, 2015
Cool idea for a transition!
You ideally want to become a front-end designer/developer. The skills you'll need are HTML, CSS, and Javascript.
Your design skills will be huge, though print and web are two very different mediums.
I'd strongly recommend Team Treehouse - best $25/mo I've ever spent. They have guided tracks to teach you everything, great exercises, and an active forum. Here's my referral code: http://referrals.trhou.se/jaredgold.
*You can try a self-taught curriculum, but in the end, it's worth your time to pay a tiny bit of money for getting to where you want to be faster - and be more skilled.
Good luck!
Jul 11, 2014
Liz, I would highly recommend you take some courses on UX design. Aside from making sites that code well and look nice, the user experience is key. Also, having the most rudimentary understanding of PHP and JavaScript will also help you to make smart design decisions. Also, it can help you explain your vision to developers.
Jun 17, 2014
It sounds like you’re ready to create a site and I’d start by building your own responsive WordPress site from scratch (without using a template, if possible, or if you do, deconstruct all the elements of the template). It’ll be hair-pulling but what you’ll learn in the process is how html, css, and php work together and all the elements needed for a functioning site. Most companies, large and small, are moving or have moved towards Content Management Systems, such as WordPress, and understanding the inner workings of these will be invaluable. Lynda.com has excellent online courses. Other resources are http://www.w3schools.com/ and Smashing Magazine (www.smashingmagazine.com). I made the leap to web design several years ago and I’m glad I did as it really enables us to provide fulfill both print and web communications needs for our clients. What’s more, it’s fun. Stay with it!
Jun 15, 2014
Ok so I am better off than I thought, I do not want to be a web "developer" I want be a web designer, I.e., to create the visual site and I guess the term is user experience. I've even directed the creation of websites, at least the design part, in the past. And I guess I've already done that many times when I designed site mock ups for the programmers to set up on the web. I of course understand the difference in mediums, web vs print, and I've done lots of learning HTML5 and I understand CSS style sheets. I've even done some simple animations for web too. So, I guess I should learn more about JavaScript. I get worried when I hear people discuss programs I don't know, but I am not a coder, I am an artist, so it's not like I missed something. But I agree that it is always good to expand my knowledge and will do that with learning mor about coding. I will look into some of those tutorials. It's hard to learn it if I'm not actually developing anything! But I will definitely try to learn as much as I can. It will help me in the future get hired.
So could I apply for web design positions now? Am I qualified? Do People usually understand the difference between a designer and a developer?
I really appreciate all the comments.
Jun 14, 2014
I'm going to be pretty frank with my answer here, as I think quite a few comments have come from individuals with a misunderstood perception of the industry in general. I run a successful web/software development agency in the Twin Cities, so I should be able to help quite a bit here (I'm also a full stack developer).
To Dave's comment: HTML5 is certainly not going to replace JavaScript at any point in the near future. In fact, JavaScript is getting progressively MORE popular. As David correctly pointed out, HTML is nothing more than the compiled results of your input markup. I believe Dave may be confused with CSS3 transition states (and perhaps web socket/local storage additions to HTML5?) but there's not going to be a demise of JavaScript at ANY point in the near future. JavaScript is actually the future in its entirely--it's the reason developers are leaving traditional development stacks for a "pure" JavaScript stack. Additionally, HTML5 actually doesn't do any backend work other than local storage (if you can consider that a backend quality....I definitely don't) and web socket transmissions (through the use of API's).
To Dana's comment: although a great stab, I'm fairly certain that web designers needn't know a lick of Java or MySQL these days, unless they're incorporating certain MVC frameworks in to their development quiver. She IS correct in saying that many agencies are starting to bridge the gap between designers and developers these days, but most of those responsibilities are lying solely in understanding responsive design and how fluid grids work.
In my opinion, Liz, do all you can to incorporate UX and UI design in to your skill set. You already have a head start as a graphic designer, and UI design is only going to become more popular. Your knowledge of programming languages needs to increase, but certainly not to the extent of some of the answers here. I'd suggest working through http://codecademy.com and its HTML/CSS/JQuery courses. That'll give you a really solid grasp on things =)
One last thing: for a pure beginner, I'd say to look at http://teamtreehouse.com before I'd look at Lynda. While certainly more diverse, Lynda doesn't have the crucial interactive aspects that Treehouse can offer you. http://codeschool.com is another option, too.
I really hope this helps. If you find yourself foaming at the mouth in confusion, don't hesitate to message me personally!
Best,
CG
Jun 14, 2014
Hi Liz, I do quite a bit of web site design without being a web developer. They are indeed different roles. I work hand in hand with the developers to understand their needs and ultimately, I provide them with layered .PS files from which they create each page. In working with my clients, I make it clear I am not a developer, that my role will be to create the overall look of the site, including all the graphical elements in it, and that they will need to hire a developer to build the functional web site. I have established relationships with a few reliable developers that I work with regularly, so I can usually offer clients a package deal.
I have, however, built some web sites for clients myself using templates available through web hosts like WordPress and BlueHost. With these, the underlying framework is provided and you import your graphic images and text with no requirement to do coding. They are fairly easy to work with, once you get used to the architecture of their WISYWIG page building tools. I know of many designers who use this route, but it really works best for clients who need just very simple web sites without a ton of functionality.
So, technically, you can offer some web site design services to your clients without being a coder. But in either case, if you are going to venture into this field, you really do need to have a good grasp on all aspects of web site creation. It is good that you have taken some coding classes. Understanding those things makes you much better at designing for web.
Also, as Davis Mans mentioned, your file requirements will be different than those for print, so hopefully you have or are prepared to obtain a comprehensive education on that as well. You will be working in pixels instead of picas, RGB color space instead of CMYK, 72 dpi resolution instead of 300, and you will be using a hexadecimal palette of web safe colors instead of a broad Pantone palette.
Back in the day I think there was a much greater expectation that website designers created both the graphic design as well as the coding design, but today the coding end has become so robust that it is become much more common for these to be separate roles. Best of luck to you!
Jun 14, 2014
Hello Liz!
I can definitely relate to this. One thing to remember is that while web and print are different "mediums", they still aim to solve visual problems and design challenges. In some cases the processes are similar, but of course with web design there's a bit more to the design process than just thumbnails alone. You'll need to think of the User Experience (UX) of the site just as much as the visual aspects.
With that said, I think you should definitely check out Lynda.com as other people have suggested. They seriously have the beat tutorials and they're taught by some of the best in the business. I'd hone in on your Photoshop skills as that will be the primary program you use for creating your web layouts and assets. Also, many people have used programs such as Dreamweaver, but there are also other programs that function in the same way, so I'd consider checking those out. Regarding code, you may learn coding languages at codeacademy.com for free, or you may even just want to create a working relationship with a developer on some projects. You don't need to have complete fluency in code to be able to design websites, however some understanding of what the languages can do in the context of your design can really help.
Hope this helps! Feel free to message me if you have any questions!
Jun 14, 2014
Liz, perhaps you can find a web designer (which I am not) and work with him or her on a collaborative basis? A co-working space may be a good way to find one in your area. Co-working spaces are popping up everywhere and the collaborative opportunities are one of their selling points over traditional office space.
Jun 14, 2014
I would agree with Kaylan, Lynda.com is a great place to learn fast. It is important to understand that there are two different going on in web design 1 is design (graphics) and 2 programming (development and programming) Your skills as a graphic designer can transfer into mocking up websites before they are built if you don't want to get into the programming side of things. Find your way into a team to collaborate in web projects and do some research as to how to build mock ups.
Jun 14, 2014
Have you though about expanding into other areas of Graphic Design instead? I see that you've done some great marketing work and that could certainly be an area for you to expand more into.
Graphic Design and Web Design are very different other than both being grouped under the "creative" umbrella. Web Design is more technical. It isn't just about how a website should look - you need to know about how to make it look that way and if that is the best way for it it look, - think site aesthetics and structure, load times, navigability, SEO, making it responsive, etc.
You need to be FLUENT in HTML and CSS and at least be a little familiar with Java, jQuery, MySQL, PHP, and UI Design, off the top of my head, and how they work together, in addition to your art and design experience. I don't feel a "Coding for Dummies" book is going to get you where you want to be.
Jun 14, 2014
Hi Dana, you bring up some great points. The coding part is for somebody aspiring to be a web developer. Generally, a web designer will pass off the design to a developer who then turns into a functional website/application.
Jun 14, 2014
Sorry to disagree, but today's designer needs to understand coding in order to design. You can't design a house without knowledge of building codes and you can't design a site without knowing code. You need to know how something works in order to create a competent design.
If you look at the job market, companies expect their Graphic Web Designers to be fluent in coding.
Jun 14, 2014
I hear what you are saying and you are correct that an artist needs to understand HTML and CSS. Hiring an artist that understands the capabilities and limitations of those technologies is paramount. Coding is a completely different skill set. Most people whom are not in the development industry usually mistake HMTL and CSS as programming aka coding, when it simply isn't. I was simply trying to avoid setting Liz up for failure in trying to push her into technologies that she will rarely, if ever, touch as Graphic/Web Designer.
Jun 14, 2014
Point taken - when I say "coding" I mean HTML and CSS - that is the coding a Graphic Web Designer needs to know in order to create a comprehensive site design and that is what skills the market is demanding nowadays.
Jun 13, 2014
You can look for an online course by Lynda.com
They provide good course on every subject. I personally recommend them to my students and followers.
Jun 13, 2014
Hi Liz,
Specifically, what you want to be learning is HTML5 & CSS4 (in combination with each other). HTML was a version 4 for many years and HTML5 is relatively new, so it will stay future-compliant for quite a while yet.
It looks good, feels good and gives you a lot of creative diversity.
Flash sites were used heavily by graphic designers of the past and while they did look great, technically they were bad sites. HTML5 has all of the capabilities that Flash once had but is a lot more technically robust.
Jun 13, 2014
Pick up a few cheap books from Amazon on HTML & CSS. There is a few books specifically on web design and creating websites. Don't get anything too new or too old and you can save money while still getting relevant information. My biggest suggestion is to just practice and make websites and other web related content.
Jun 13, 2014
Hi Liz,
Please allow me to preface this answer with the disclaimer that I am not an artist, quite the opposite actually.
I'm assuming you are looking to design web pages/layouts in Photoshop/Illustrator? If so be ready to work in a 960xY canvas. Stay away from CMYK and focus on RGB. Some might recommend working in 72dpi vice 300. I personally don't think it matters but an artist may be able to answer that more concisely.
I would research the artistic trends in web design to give you some inspiration. Most trends last a year or two before they are replaced with something new and fresh looking. Look at the iOS interface, for example, and see how often that has been reworked over the past 7 years.
Keep working on different web page ideas and build a solid portfolio. Once you have a solid portfolio, start looking at how responsive web designs work and how it impacts your portfolio. Figure out how those web pages should look on a mobile browser compared to a desktop browser. Then you can rework the design as responsive and include those in your portfolio.
I hope that gives you a starting point and welcome to the IT industry :)
Hi Liz! I think you're qualified. If you want to work for a web company, they'll definitely understand the difference between designer and developer and they'll be glad to have your design ability as well as your understanding of html and css to help them execute the design. As a part-owner of a small communications company, our clients do not understand the difference between a web designer and a developer; they just want a website, so we hire developers for that part of the job. Conversely, developers also hire us do to the web design and content.