Learning Web Design



  • Hello Everyone
    I am interested on how to do Web Designing ( Correct me if what is the Appropriate Term about it)
    Basically what are the first thing should i learn?
    Since i dont have any experience using any kind of tools in Designing I will do my best to read and try your suggestions.
    I am Excited to learn this new things.Thought that it would be lot of fun.
    Thanks Happy Weekend πŸ™‚



  • @Joyfano Do you want to just learn web design, or do you want to learn how to build a website start to finish?



  • @Aaron-Studer said:

    @Joyfano Do you want to just learn web design, or do you want to learn how to build a website start to finish?

    Can i have it both?



  • @Joyfano Why of course you can πŸ™‚



  • OK, so step 1 is to buy a domain name. Do you have one already? If not, buy one from www.namecheap.com - there pretty cheap at $10/Year.



  • @Aaron-Studer said:

    OK, so step 1 is to buy a domain name. Do you have one already? If not, buy one from www.namecheap.com - there pretty cheap at $10/Year.

    No need to buy anything to learn design. If you want to own your own domain and do public hosting, yes you would need to do that. But to be a designer you do not.



  • The web is powered by HTML and, specially today, HTML5. That's where you need to start. There are a lot of online resources for learning HTML, for obvious reasons. It's like learning to write books by reading about it - recursive information πŸ™‚



  • http://www.codecademy.com/learn

    Codecademy is a great place to start. It is completely free, you earn badges and it covers a lot of learning. They have a learning series on HTML & CSS to get you started. You can move on there to more advanced web programming with JavaScript too, but that would be down the road after you really know HTML & CSS. And many web designers will never venture into JavaScript as it is not really a part of the design, but knowing how it works and interacts with the HTML and CSS is good to understand, too.



  • http://www.w3schools.com/html/default.asp

    w3schools has been the place to learn HTML and CSS for over a decade. It is an awesome resource for learning the basics and a great reference for looking up HTML tags, CSS attributes, etc. Great utility to have under your belt.



  • http://www.w3schools.com/css/default.asp

    w3schools teaches CSS too.



  • This is one that I found but have no experience with:

    http://www.homeandlearn.co.uk/WD//WebDesign.html



  • I am sure that YouTube is full of great videos on web design stuff too. But be sure that they are doing HTML5, not something older, or you will learn bad habits that will make things harder, rather than easier, for you.



  • For web design, there are two key things that you need to learn:

    HTML This is the main web language and technically all that you need. It is a "markup" language that "tags" information in a document. It is a lot like writing a Word document by hand. It is not hard to learn at all, very simple and requires no programming (you are just tagging information, not making it "do" things.) But HTML on its own is pretty drab, all you get is a document without any "style."

    CSS This is the style language of the web. Unlike HTML, it contains no content or information about your content. All CSS does is provide information about style - colors, fonts, sizes, placement, etc. CSS on its own does nothing.

    The magic happens when HTML, with the content of your page, and CSS, with the style of your page, are put together. The CSS style is applied to the HTML content and voila, you have a beautiful website.



  • I always loved this web site for showing off the power of web design:

    http://www.csszengarden.com/



  • Learning to do web design will give you a great chance to learn new stuff on Linux too, you can do web site design without having a web server, but this isn't how anyone really does things beyond learning the very, very basics. So once you are ready to do much of anything, you will want a web server.

    Setting up Apache on Linux will be a great way to force you to learn Linux. Running a Linux web server is an extremely common and important Linux task and will teach you many things. Running one for yourself for your learning projects will work great. And as you grow into more advanced projects, Linux will be great for that too. And you can do all of your web design on Linux, giving you a good way to get more used to it. I've always done web design on Linux.



  • I have to go drive for a long time, but I have a lot more information (I used to teach web design for a community educational outreach program and before that I was a code compliance officer for a dotcom startup web news agency) to post so I'll do that later.



  • @scottalanmiller said:

    Learning to do web design will give you a great chance to learn new stuff on Linux too, you can do web site design without having a web server, but this isn't how anyone really does things beyond learning the very, very basics. So once you are ready to do much of anything, you will want a web server.

    Setting up Apache on Linux will be a great way to force you to learn Linux. Running a Linux web server is an extremely common and important Linux task and will teach you many things. Running one for yourself for your learning projects will work great. And as you grow into more advanced projects, Linux will be great for that too. And you can do all of your web design on Linux, giving you a good way to get more used to it. I've always done web design on Linux.

    Wow thank you for these information i am reading it now.



  • @joyfano
    @scottalanmiller nailed all the technical sides of web design, but here is also the aesthetic side of web design. Just because you can build a page, does not mean you are building a nice page.
    I can code a technically compliant page and use good CSS. But I make not claims to good aesthetics.
    Case in point: http://www.daerma.com



  • Another important aspect of web design that will come into play once you learn the basics is that nearly all modern web sites run on a content management system (CMS.) The most popular ones are WordPress, Drupal and Joomla, probably in that order. There are many of these but these are the common ones. All three are free.

    With a CMS, web design is still done with HTML and CSS, but unlike traditional web design you don't make raw pages but instead you make "templates" which give a general design and the content for the site is kept in a database. The CMS takes the content from the database and combines it with the template and produces the web pages. This makes content editing easier and the overall control much easier. It is important to learn how websites are made the old fashioned way but also to understand that when doing real web design work for a commercial website you will almost certainly work exclusively with templates for a CMS.



  • Since CMS systems work with templates, getting pre-made templates is very common. So a lot, a LOT, of web design ends up being selecting, managing and customizing pre-existing templates. There are a lot of sites providing templates, for example:

    http://wordpress.org/themes/

    http://themeforest.net/



  • @JaredBusch said:

    @joyfano
    @scottalanmiller nailed all the technical sides of web design, but here is also the aesthetic side of web design. Just because you can build a page, does not mean you are building a nice page.
    I can code a technically compliant page and use good CSS. But I make not claims to good aesthetics.
    Case in point: http://www.daerma.com

    Thank you for the link. Saw your Design.



  • @joyfano There is web design, and there is web development.

    Though job descriptions tend to muddle the two together, they are very distinct and separate as @jaredbusch notes. There can be marketing, copywriting, photography, and a bit of legal involved. (Legal bits are "CYA" for claims, trademarks, and such.) Within web design and there is web development, there are several sub-specialities such as illustration, logo design usability, accessibility, and mobile developer.

    @scottalanmiller is spot-on about the majority of "web stuff" these days is CMS based. Usually there is a long list of pleasing templates to choose (as he noted), as well as a selection of applets/modules for functionality. CMSes take much of "the pain" away from making and maintaining a website to allow one to focus on content creation (no small task!). Clever use of a CMS can create a site which is less obviously using a template/CMS (i.e., "a good thing").

    .
    @scottalanmiller said:

    ....most popular ones are WordPress, Drupal and Joomla, probably in that order....

    "The Google" agreesβ€”

    .
    @scottalanmiller said:

    http://www.csszengarden.com/

    Great site. Takes a long time to work through it to see you like & things you don't (i.e., personifies your design aesthetic). As the site mentions, all the designs use the same HTML. Difference is custom art and hand tweaked CSS.



  • Here is a free HTML5 Cheat Sheet. Just download the PDF and print out to work offline.



  • Here is a free HTML5 book: http://diveintohtml5.info/



  • LAMP software on a development system...

    http://www.apachefriends.org/index.html
    that is also helpful - basically have your test environment quickly loaded up where you need it.

    There are many of these packages and I'm sure others also have suggestions on which ones are better



  • Finally i did my very first HTML sample work. Yahooooo Looking forward to learn more.
    Thank you to all of you guys. Awesome.



  • Congrats.



  • @scottalanmiller said:

    Congrats.

    Haha Thanks.



  • All has been said really.

    If you have windows, use WAMP. Will aid in making things easier (if you want)

    If you have a mac, then MAMP.

    No real need to learn how to setup mysql and all of that, it is nice, but since hosting companies are implementing one click installs, time better spent learning other elements.

    Personally, I LOVE wordpress. It's superb, the communities are great and so many resources as outlined above.

    All in all, good luck πŸ™‚

    Let us know how you are getting on, will be good to see some examples, even if on screen grabs πŸ™‚

    Thanks,

    G.



  • @Gabi Thank you. I am always interested to learn new things. I am learning working now with Linux. Been working to set up Mediawiki in Centos. πŸ™‚


Log in to reply