On what websites can I learn web design?

I want to take my web design skills and turn them into actual websites. What should I learn to code first?

• Answer:

  As a self-taught web developer, getting started was not the easiest thing. I had to learn everything the hard way. Along the way I came to learn about stuff that, in my opinion, would have been a great help back when I was starting. Websites fall into two main categories, static websites and dynamic websites. Both have things in common which is the utilization of HTML, CSS, JavaScript (in pure form or in a simpler library form like JQuery). Think of these as your starting point. Both  HTML and CSS are not programming languages. Basically, there's no  "x+y=?" sort of programming that you might be familiar with. They deal  with layout and look of a page. A nerd might argue that they have some  sort of basic arithmetic functions, but generally speaking they are not  programming languages by definition. You  can build a website using HTML and CSS alone. Adding JS is optional but  a great asset that you can't manage professionally without. HTMLHyperText Markup Language, HTML, (now in version 5, HTML5) is used for the markup of the page (a wire-frame for the page). Generally, it lays out the hierarchy of the page. You can think of the markup as boxes inside of boxes where all the text, links and images are located. All of this is saved in a .html file. CSSCascading Style Sheets, CSS, (now in version 3, CSS3) is used for the graphical side of things. It controls how everything looks. Think of colors, font sizes, backgrounds, borders, margins, padding...etc. All the styles go in one or more .css files and are referenced in the HTML in order to be used. JavaScriptJavaScript, JS, is a programming language and a bit trickier to explain. Think of it as a manipulator for elements on a page, although it can be used to add or remove elements to a page. Again the scripts are saved in .js files and referenced in the HTML files in order to be used. I like to think of JS as a language that deals with "time" and "conditions". Some examples to reflect what i mean can be When a page loads, do that. When a mouse hover over something do that. When a certain time passed, do that. If this..then that. There are JS libraries that facilitates the usage of JS. A famous one is JQuery. Think of it as an easier form of JavaScript. JQuery is extensive enough that there are developers who learned and work with JQuery without learning JS itself. By covering these three languages, you can be an expert in static website development. Dynamic Website Development Dynamic websites (debatebly aka as web applications) is where all the magic happens. They utilize web programming languages and databases. Generally speaking think of Quora, Facebook, Twitter, and almost every website you use as a dynamic website. The basic idea behind dynamic development is having a database where everything resides. A simple introduction to dynamic development would be the "Latest Articles" box you find in a lot of websites nowadays. Let's say we have a website with the following pages Home About Us Article 1 Article 2 Contact Us In each of these page we have box on the side listing the latest articles in the following format, Latest Articles Article 1, posted on Monday Article 2, posted on Tuesday This means that, up til now, we have a total of five "Latest Articles" boxes on five different pages. Now, imagine we wanted to add a third article. In this case, we'll have to Create a new page called "Article 3", Create a new "Latest Articles" box on "Article 3" page, Update the other not 1 or 2, but 5 pages with the new article, and date of publishing. I'm pretty sure you get how hectic this would be with thousands of pages, or maybe even ten pages. In dynamic development, this is much easier. The database, which is a basically a set of tables, contains all the articles and pages. The tables contain columns and rows to reflect the article's name, creation date, publishing date, author...etc. The "Latest Articles" boxes are then "dynamically" generated by connecting to the database and getting the latest articles based of the publishing date. The same concept can be used to get, for example, the articles written by a certain author. Also, we can have an authors' table which contains the usernames, passwords, emails and biographies of authors which are used for logging in and verification (Again, think Quora, Facebook, Twitter). Now that you get the basic concept behind dynamic web development, let's move to the technologies you need to learn. Please keep in mind that we're still going to use HTML, CSS and JS, and that the end result will still be HTML, CSS, and JS. We're not cancelling those, we're just finding a more efficient way to work with them. As you might have noticed, we need a database and a way to connect to it. Remember, I said a more "efficient" way, I never said it was easier. DatabasesThe concept of storing/retrieving data in/from a database is much broader and has a lot of uses other than web development. Meaning that when you learn to work with databases, you're actually adding a very valuable asset to your list of skills. Structured Query Language, SQL, is by far the most common language to deal with relational databases (relational databases are, basically, your common knowledge of tables containing columns and rows). SQL is more of general concepts rather than a language that you will learn. What you get to learn is relational database management systems (RDBMS). There are a lot of RDBMS out there, the most common ones are (in no particular order) MySQL PostgreSQL Oracle Microsoft's SQL Server IBM's DB2 Server-side Programming LanguageThe database will reside on a server, and as you know by now, the database is just a bunch of tables with data in them. The way to get, manipulate, use and eventually display the data in HTML, CSS, and JS is by using a server-side programming language. Again, there are a lot of server-side programming languages. Some of the popular ones are, PHP ASP.NET JAVA ColdFusion Perl Ruby Python I wouldn't tell you go ahead and learn that RDBMS along with that server-side language. You'll find a lot of people telling you use this or learn that or don't ever use that...etc. It's like religion, more of a personal choice. As I remember, PHP and MySQL form the most common couple. Some people argue that regarding usability, Ruby wins. When it comes to ease of learning, some will say Python. The arguments never end. You should dig in, get your hands dirty with code, and decide what suits you. I'd recommend that you start learning, hop from one language to another, and eventually find what you feel comfortable with. I know I didn't go into much details, but you should form your own personality when it comes to web development. Please don't hesitate to ask me if you have any questions or need any more information.