If you are thinking about pursuing web design as either a career or a hobby, you must be able to do more than simply design a pretty page. Professional web designers are experts in programming and coding as well. The most talented web designers are those that can adequately balance both their creative and artistic sides with their love of technical coding.

As a web designer, there are plenty of different web design standards one must master. The two most important in the industry today are HTML and CSS. What are these methods all about and how much time and money will you need to invest in order to learn them?

What is HTML?

Since the early days of web design, HTML has been the standard for professional websites. It stands for Hypertext Markup Language and can be quite confusing to someone who has no experience using it. HTML is the language, or code, used to edit and position the text, images, frames and other web page elements. If you go to your web browser and select View and then Source – the code used to design that website is available for anyone to see.

Those who have used HTML will tell you that it is not difficult to learn. There are a few basic tags (codes) a designer has to learn and a simple webpage is at their fingertips. The more complex the HTML, the more you can do with a site.

Efforts have been made to dumb down the process even further so that anyone, even those who have no knowledge of HTML, can create their own website. These are typically called WYSIWYG (What you see if what you get) editors. They allow you to create a webpage without using code and the editor assumes what HTML you need and does the work for you. Some software programs now include an option to convert your document to HTML. These are great tools for newbies. Unfortunately, the processes of guessing what code you need breed mistakes and errors in design that can lead to further frustration.

What is CSS

CSS is a newer animal and is not as familiar to beginning web designers as HTML. CSS was created to allow designers to have even more creativity and control over their designs. Today there is more than just one type of Internet browser to design for and this can be tricky and time consuming for HTML designers. These saves users time, effort and most likely money when they are creating sites. Also, CSS encourages less effort by allowing designers to create style sheets. This means when an edit is made to one page, all other affected changes are automatically made. This keeps designers from having to make multiple edits for large, detailed websites.

HTML vs CSS

CSS is not really taking the place of HTML. It is generally used as an enhancement, not a substitute. HTML is still the perfect type of coding for the main structure of a site.

CSS excels when it comes to how a webpage will look. The outward appearance including backgrounds, colors, content and image placement can all be handled by CSS. Anyone who is familiar with the Microsoft Office version of style sheets has a good handle on the purpose of CSS.

While a webpage can certainly be accomplished still only using HTML, CSS allows designers to do things like set different page margins for all sides of a page, overlap words, better position page elements, and set a font for a whole table instead of just pieces. These make all seem like minor adjustments but these CSS tricks free up time for designers to worry more about overall layout, design and navigation.

Training

There are plenty of places where new designers can go to learn both HTML and CSS. If you are a manual type of student, the library has an abundance of tutorial manuals for these techniques. Any establishment that teaches computers classes will more than likely include these basic web approaches as well for the visual learners.

Of course, many a web designer learned their craft by simply jumping in and messing around. If you have the discipline, this hands-on method of learning is not only effective, but free.

With the popularity of today’s world wide web, it seems like everyone is designing a webpage these days. From the free online editors to full blown ecommerce Internet giants, there is a market and need for web design that is not going away any time soon. Whether you decide to take it slow and target small businesses or get serious and starts designing for large corporations, design fundamentals are the place to start your journey.

  • Brian Jones

    Nice little article for the new and aspiring. One little note however on what you mentioned for HTMl as the code for positioning text, images frames etc. This is CSS, not HTML. A good way to describe HTML and CSS to new and aspiring designers is: Think of these 2 languages as building a house. The HTML is the groundwork and the walls of the house, CSS is the interior design :)

  • Pingback: xhtml css templates – The Role of HTML & CSS in Web Design | Design Reviver | XHTML CSS - Style sheet and html programming tutorial and guides

  • http://bfred.it bfred.it

    WAT?
    You’re confusing newbies. (x)HTML is the ONLY markup language used to “code” a website.
    CSS for styling, it’s not going to replace HTML, it’s the ONLY way to style a page, and that’s the only thing it does.

    Nowadays you you’re not going to design a real-world website that doesn’t make use of CSS.

  • Pingback: The Role of HTML & CSS in Web Design | Design Reviver | ShakyaNilam

  • Pingback: The Role of HTML & CSS in Web Design | Lively Design Tuts

  • http://superdit.com aditia

    when I first learning I keep in mind
    HTML define Standard Web Element
    CSS define the HTML style

  • http://www.57degreesnorth.co.uk/ 57 Degrees North

    HTML and CSS are just must learns for any designer. Designers who cant code just complicate the web design process as they have no understanding of what and how designs can be transferred over into code.

    Its just about at the stage where a good grounding in javascript is also required, as just about every competent site uses javascript in some form.

  • http://www.buzz-webdesign.co.uk Buzz

    Nice article to introduce newbies to the basics… I like how the first poster describes HTML and Css as building and decorating a house.

  • http://www.my-html-codes.com Matt Walker

    I don’t understand the idea of HTML v CSS?? This is not what these two languages are all about.
    They are not in competition, they work together to create your site.
    HTML tells the browser what each element on your site is i.e. H1 tag is the main heading P tag is a paragraph. This gives it an ordered hierarchy that can also be used by screen readers.
    Then you use the CSS to tell the browser what the H1 and P tag should look like.

  • http://www.mojowebdesign.com.au Zeth

    Uhhh, I’m so excited about HTML5.. I ordered a book yesterday about it and I can’t wait to read it. It’s not quite there, but almost at the same level as when Starcraft2 came out :).

  • http://www.yellowbrickcode.com MikeyS

    Yeah not sure why you’re trying to compare HTML to CSS like one will take over the other… they both need each other. CSS styles HTML, plain and simple.

  • http://www.webdesignmauritius.info Web Design Mauritius

    Thank you for sharing, can’t wait to try html5

  • http://freshinsite.com/ freshinsite

    Actually in order for your elements to be properly presented you will be needing CSS

  • http://www.ninevectors.com Michael

    CCS is the best thing that happened to HTML. If all existing browsers rendered CSS styled website in the same way webmasters live could be a way easier. Especially with CSS3 which is great.

  • http://www.adriancrellin.co.uk IOM Design

    I like how my web developer course leader at uni used to describe CSS and XHTML, as a means to separate style from content. Use XHTML to create clean, accessible, user friendly code and then add style using CSS!

    It works for me! :o)

  • http://www.my-html-codes.com HTML Codes Dude

    Nowadays these two languages go hand in hand. If you want to be a web designer you have to know both.

  • http://www.webdesignblog.org.uk AndyJ

    (x)html is what you want to display, CSS is how you display it :)

  • http://www.pixelsmedia.net/ Nancy Paul

    Great Info. Clear concept about HTML and CSS.

  • http://www.glendelmdesign.co.uk Web Design Cambridgeshire

    Thanks for this great article – I too am very excited and interested about HTML 5

  • http://www.russellgillman.co.uk Freelance Web Designer London

    I love turning a ‘boring’ page of HTML into a beautifully designed website with just a few lines of CSS. Code has replaced art. Kind of :-)

  • http://www.sure-impact.com Website Design Bradford

    Yeah HTML vs CSS, its amazing the tranformation and flexibility css brings thanks for this.

  • http://www.solveit.coop Chris

    Good article for beginners to get an insight and the best advice is jumping in and getting your hands dirty…Good old trial and error! Then you can begin to move into other areas like PHP with XHTML & CSS…Have fun!

  • http://www.ventzke-media.de Ventzke Media

    very interesting article. html 5 is a fresh and modern markup :_)

  • http://frontline-media.com Frontline Media

    This is a good article, for those who are just starting and looking to either make a go of web design or curious and maybe want to build their own site.
    My advice would be to start building in html first to get a good understanding of building a basic page, give you some experience with tables even tho you most likely wont use them once you have learnt Css but its good to see how your code can influence your pages look. Then progress your skills with Css good luck.

  • http://www.thewebshowroom.com.au Web Design

    I also agree with Brian. You can’t underestimate the importance of CSS and understanding its relationship with HTML.

  • http://www.lk-webdesigns.co.uk Lkenneth

    Nice blog reminds me of when I first started. Reading this would of really helped me back then :)

  • http://www.twago.com/ Robert Schmidt

    This is a great introduction to the two languages. I think that when HTML5 is finally released to the world we will see a lot of changes especially in how pages for optimized for SEO. Graphic Designers and Web Designers will have to start thinking in terms of HTML5 right now, in order to not get left behind when it is released.

    http://www.twago.com/expert/Web-Design/Web-Design

  • http://www.comnez.com Cedar Rapids Web Design

    The only thing that scares me about HTML 5 is the browser compatibility. It may take a while until the majority of internet users start using HTML 5 compatible browsers.

  • http://www.freshegg.com/ Katherine

    Wow! Lots to learn to even get a basic understanding of this very complex industry.

  • http://www.sonnydesign.com sawebdesigns

    Im actually learning css3 and html 5 and I think theyre a perfect fit

  • http://creativawebstudio.com barog

    html and css is a couple that can not be separated

  • http://studiotarget.pl TARGET Poznan

    This is the first time i visit Your blog. Very nice article. Thanks… And I’l be back :)

  • http://www.freshegg.com sarah

    Im just starting out learning web design – nice article, very helpful thanks.

  • http://www.deepetch.com Luke watts

    wonderful article highly recommended to newbies.thanks for sharing this stuff…

  • http://www.hellomould.com Injection Mould

    Pretty good article for web designer.web designer not only should know about HTML & CSS , but also should know about UI,UE…

  • smoke

    why have you stopped publishing? should we consider this site dead? :(

  • http://www.browsedesign.com Browse Design

    Wonderful Article!
    I’m delving more and more into html5 and css3 these days and articles like these are really helpful!!

  • http://muenchen-kueche.de maike

    css is really impossible to imagine

  • http://www.glossyicon.com/ rajveer

    HTML5 is the way to go . Thanks for the info!

  • http://www.somethingsublime.co.uk/ Something Sublime

    Nice article to introduce newbies to the basics…

  • http://www.somethingsublime.co.uk/ Something Sublime

    Thank you for the tip

  • http://www.topleftdesign.com Top Left Web Design

    HTML5 certainly the way forward, for some great looking examples of different techniques in use, check out our site, enjoy :-)

  • disqus_RKybkueuZQ

    i want to make my career into this,so this article seems helpful for me….kindly suggest me some other tips…

  • James

    I truly think this article should be reviewed for consistency, as I see it has not been reviewed in some time by an actual web designer. http://www.blackslatestudios.com

  • Jayanta Dey

    I am very
    pleased to find this blog. Since the
    early days of web design, HTML has been the standard for professional websites.
    Thanks for this amazing round-up! Hope you share more.