Find solution
How to learn web design online?

How do I really learn the method/process of web design?

  • Most of the online courses / guides I've seen teach only the most basic things, like html, css and minimal php. That's great to know, but I want to understand the make up of professional websites. For instance, using inspect element with google chrome yields interesting insights into the composition of a site, things like headers and footers named "wrappers" are common, but this isn't the kind of thing that most online tutorials teach you about. Where can you learn more advanced techniques about the composition of websites and particular programming styles? Things such as when a particular language (Javascript, python, ruby) is more useful than another? I strongly want to advance my abilities as a web developer but I can't find any girthy content beyond the basic tutorials and don't know where to turn my attention next in order to grow. I study computer science at university so programming isn't exactly new to me, however there are no courses offered in web development. I don't mind teaching myself, I just have absolutely no idea where to go next and advance myself beyond the basics in order to make "real" working websites with aesthetic appeal.

  • Answer:

    A2A Instead of talking about the solution in general terms I will present a step by step plan which you will be able to easily evaluate and determine whether it suits your needs. Step 1. Learn web programming languages You said that you are not new to programming, but did not state which web languages you know. To learn and/or deepen your web languages knowledge I highly recommend http://www.codecademy.com/learnYou can learn  HTML, CSS, Javascript, Python, JQuery, PHP and Ruby through interactive courses for free. Learning by doing is the best way to learn programming imho. Step 2. Do web related projects You have to start somewhere to become an advanced web developer. Codeacademy is very helpful here as well. The http://www.codecademy.com/tracks/projects page gives you an opportunity to apply your knowledge of web programming. This page has basic and advanced projects like building css buttons, web forms, video games, and travel websites. The majority of projects are website components. Step 3. Build a website Ultimately, you want to build your own website using the experience you  obtained from completing the projects on the page I specified in the previous section. Again, Codeacademy gives you such an opportunity. At http://www.codecademy.com/skills/prototyping page you will be taken through the process of building a website. There is going to be support from the discussion forums and the course itself. Step 4. Showcase your work Make sure to upload your projects and code to http://github.com. If you do not have an account, get one ASAP and learn how to use http://git-scm.com/. Github lets you share your code with anybody you want. Among employers Github is a very credible source of and a good way to assess the candidate's skills in coding(web development in our case). Step 5. Above and beyond Upon completion of steps 1 through 4 you will know how to build a professional looking website with various components like video games, search engines, shiny css buttons and etc. From there you want to get even more experience in building websites and web applications. http://Coursera.com and http://Udacity.com are your go to online resources. You said most online courses focus only on basic principles. You have not searched thoroughly enough. https://www.coursera.org/course/webapplications is an extensive course offered by Coursera that teaches how to build a web application from scratch using Ruby on Rails. You have all the steps through which you will be able to become an advanced web developer. I think that steps 1 through 4 can be accomplished within six months. Codeacademy courses can be taken at any time and how quickly you finish them depends on you. Step 5 depends on the availability of the MOOCs (online courses offered by websites like Coursera). Some of them are offered a certain number of times per year. P.S. Interesting fact: Web development is a career where experience is more important than  education.

Koba Khitalishvili at Quora Visit the source

Was this solution helpful to you?

Other answers

Web design (front end)? Or web development (back end, based on your details)? Or both? There's a risk of being a jack of all trades when it comes to being a web developer, because there are so many angles you can tackle. You'll find that one day you'll have to choose sides. That being said -- Start with a project and learn from there. Follow up with more challenging projects as you go along. It's the best way to learn. It helps you focus on skills that the market demands. It also allows you to tackle several needs at one go. For example, ever use jQuery? Try that. Then step it up to data-driven JSON apps. Then go for node.js. On the UI/UX, learn bootstrap designs. Or responsive designs. SaSS and LESS would come in handy. On web development methodologies, you'll be learning on the fly depending on the scope of the projects you take on. On server-side coding, if your choice is PHP, learn beyond dynamic content and database connections, like file management and access controls. Or better yet, learn a framework. This learning can go hand-in-hand with development methodologies, such as agile. Follow topic experts via social networks or blogs. That should help you keep abreast of the latest trends in web development. -- You can do those two things right away, right now. Don't overthink what you need to learn. Do it. Now.

Lorna Timbah

There are many high quality tutorials available online, and many of them are even free. However, in my experience, nothing beats learning from a mentor. Ask someone who is a professional, and apprentice from him/her, maybe doing some real projects.

Lin Ti-Wen

Web design is heavily influenced by the functionality and intended audience and as such is largely related to design philosophy rather than the tools and techniques used. In order to learn good design techniques you can look at the websites featured in the Webby design awards. You should, however, develop your own methodology of designing websites instead of simply copying them from other websites. There are numerous libraries like jQuery, YUI (Yahoo user interface library) google sdks for websites etc which offer great components for rapid development and customization. But how they should be used is upto the designer. Generally speaking, there is emphasis on clean design nowadays. There is also a factor of information involved, for example, how much information is needed to be displayed on a particular page. Great websites follow clutter free designs but also give user all the relevant information related to the item currently displayed. In order to achieve highly responsive user interface, websites typically use asynchronous callbacks via jquery and nodejs. Good websites also incorporate a services layer in order to access and manipulate backend data. The same services layer can be used in a desktop or mobile application easily. These services are usually developed in the language supported by the web-application server, for example c#, java, python. I am intentionally avoiding php as it is not used preferentially in highly scalable websites. There should be some analytics framework incorporated by your website to track user activities. It could be as simple as a simple script tracking mouse clicks and movements to backend request analysis. You can use google's analytics framework or you can use any of the frameworks easily available. Tracking is important as it will give insight into user behavior. Finally you can develop a keen sense of design by looking into design element as used in arts and architecture.

Asher Syed

The main problem with learning the method/process of web design is that there are many, many method and processes. Some of them are better than others, some are just more useful for different applications. A few suggestions: 1) Avoid PHP if you're just now entering the web development domain. 2) Learn about http://Angularjs.org 3) Learn about http://nodejs.org/ 4) Check out http://mean.io These technologies are some of the most widely used in the industry for the most recent and efficient means of developing websites. Also, remember - emulate, do not create. When you become a very talented web designer  and can work with html and css at an expert level, create. Otherwise, just try to make web pages that feel like successful and highly visible websites.

Brock McKean

Related Q & A:

Just Added Q & A:

Find solution

For every problem there is a solution! Proved by Solucija.

  • Got an issue and looking for advice?

  • Ask Solucija to search every corner of the Web for help.

  • Get workable solutions and helpful tips in a moment.

Just ask Solucija about an issue you face and immediately get a list of ready solutions, answers and tips from other Internet users. We always provide the most suitable and complete answer to your question at the top, along with a few good alternatives below.