Learning Web Design
-
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:
-
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:
-
@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.comThank 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: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.
-
-
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.
-
I wrote our company website using Notepad entirely in classic ASP and CSS. There is no javascript. It is now looking pretty dated and I need to refresh it. The days of hand-coding websites seems to be over, and I think I need a decent content management system. The only options seem to be Drupal, Joomla and Wordpress. I'll probably use Wordpress for no particular good reason.
I bought a book on JQuery and Ajax, which I've yet to read, but as someone who doesn't really do web development the learning curve is pretty steep and I'm not sure it's worth my time trying to learn it.
Regarding classic ASP, I'm not bad at it, but it's too old now. I don't know whether to upgrade to dot ASP.Net or switch to PHP.
-
PHP is far more portable. No need to be tied to an expensive Windows license.
