1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Graphic Artist becomes Web Designing?

Discussion in 'White Hat SEO' started by groundzero15, Feb 28, 2013.

  1. groundzero15

    groundzero15 Registered Member

    Joined:
    Feb 14, 2013
    Messages:
    60
    Likes Received:
    10
    Hello BHW. im a graphic Artists for almost 6years in printing press and made a lot of jobs like Posters, flyers, brochures, business cards, etc.. Ive heard a lot about Web Designing and im curious about that.

    Is it possible or is it easy for me to learn Web Designing and do you have a basic and advance tutorials for that?

    I want to learn but first i want some advice from BHW..

    Thanks. every comments and suggestions counts..

    Once again thanks in advance BHW
     
  2. darekmoore

    darekmoore Newbie

    Joined:
    Nov 26, 2012
    Messages:
    16
    Likes Received:
    2
    hello ground zero, i think you have the edge as a web designer if your a good graphic artist, you have the skills and the taste of what graphic is all about. just make sure you leave space for your on-page seo for search ranking ;)
     
  3. tomsko

    tomsko Regular Member

    Joined:
    Nov 2, 2012
    Messages:
    460
    Likes Received:
    269
    Occupation:
    IM
    Sure man, if you know how to use photoshop, you can design website templates even not knowing a sh*t about coding or slicing
     
  4. groundzero15

    groundzero15 Registered Member

    Joined:
    Feb 14, 2013
    Messages:
    60
    Likes Received:
    10
    Thanks for some informations guyz.. i think it can help to boost my confident to learn web designing as soon as i get some basic and advance video tutorials for that..
     
  5. groundzero15

    groundzero15 Registered Member

    Joined:
    Feb 14, 2013
    Messages:
    60
    Likes Received:
    10
    thanks buddy.. any other suggestions..
     
  6. tomsko

    tomsko Regular Member

    Joined:
    Nov 2, 2012
    Messages:
    460
    Likes Received:
    269
    Occupation:
    IM
    I'd recommend you to start with some landing pages/squeeze pages. They are very simple to code and can basically consist of 2 images and one .html file
     
  7. darekmoore

    darekmoore Newbie

    Joined:
    Nov 26, 2012
    Messages:
    16
    Likes Received:
    2
    put meta datas on your header it will help... and unique contents.. "a good design is an eye catcher" ;)
     
  8. bertbaby

    bertbaby Elite Member

    Joined:
    Apr 15, 2009
    Messages:
    2,019
    Likes Received:
    1,496
    Occupation:
    Product marketing
    Location:
    USA
    Home Page:
    Learn Photoshop and Illustrator and you'll go a long way towards web design but then add some web design. You can start with Dreamweaver and then graduate to doing your own code.
     
  9. groundzero15

    groundzero15 Registered Member

    Joined:
    Feb 14, 2013
    Messages:
    60
    Likes Received:
    10
    As of now i can consider myself average type in adobe photoshop and illustrator but want to learn soon in dreamweaver... and hope soon nin coding
     
  10. evilclown

    evilclown Senior Member

    Joined:
    Jul 31, 2012
    Messages:
    805
    Likes Received:
    575
    Occupation:
    Party Clown
    Location:
    Clownville
    Well if you are a graphic designer you can push in, but pair yourself with a UI designer/coder forget about backend stuff.
     
  11. LakeForest

    LakeForest Supreme Member

    Joined:
    Nov 11, 2009
    Messages:
    1,269
    Likes Received:
    1,802
    Location:
    Location Location
    Are you looking for how to slice PSDs into HTML? Or something more comprehensive?

    Go youtube, search google, try good-tutorials.com (classic)

    You shouldn't be asking for the learning material. Look how much time from your initial post to now has elapsed; think about how many searches and discoveries you could have made instead of waiting for help/salvation. This is the problem with modern education, it's too comfortable and soft. Even with the internet, you still cannot be bothered to seek...How do you estimate possible success with this attitude?
     
  12. evilclown

    evilclown Senior Member

    Joined:
    Jul 31, 2012
    Messages:
    805
    Likes Received:
    575
    Occupation:
    Party Clown
    Location:
    Clownville
    Lynda.com is kinda expensive but to be honest it's the best.
     
  13. lykathe

    lykathe Regular Member

    Joined:
    Oct 23, 2009
    Messages:
    419
    Likes Received:
    107
    Gender:
    Male
    Occupation:
    full time PHP/JS/Python freelance
    Location:
    Detroit
    Basically learn Html/CSS. Draw things in PS/whatever, and then use them as a model to make a webpage. You can slice with photoshop but that's just NOT the way to do things 99% of the time. Think of HTMl and CSS as legos.

    Do it the right way. Trust me. It's not hard. Use the element inspector in Firefox/Chrome (Right click, hit inspect element). See why things are positioned the way they are. Use http://jsfiddle.net as a sandbox to test your skills. Sources to learn, try http://tizag.com or w3schools. Don't be afraid of getting things wrong. Understand that everthing you see on a webpage is an "element"(or object, or lego keeping in kind with the aforementioned metaphor), and it can be manipulated as such by style "rules" invoked by CSS.

    So if I have a link "lego"(element), it looks like this. <a href="http://url.com">. You know this code probably. Href is simply an attribute of the lego, it says this lego points to http://url.com. I could change this to <a id="randomname" href="http://url.com"></a>, and now it's unique identifier is "randomname", and it can be specifically controlled by CSS and Javascript thusly.

    You can name elements anything you like, but of course it's advisable to make your Login button have the id "login" or "login_button" rather than "abc123". IDs can only be used once on a page. Classes are very similar, but you can apply them to as many elements(legos) as you like. So thusly I can make code like this, <a class="redlego" href="http://google.com"></a> <p class="redlego"> This is a 2nd lego with the class 'redlego'</p>

    Now notice that I made a 'redlego' out of an "a" element, which is a link, and a "p" element which is a paragraph. A good way to think about it is that there's a predestined set of "legos" which are tags like <img>, <div>, <p>, <span>, etc. From there, you can customize the legos however you want!

    http://jsfiddle.net/LSWAb/

    Here's an example that illustrates the "redlego" example from above. The top left box is the html we're using, top right is the CSS rules (classes are defined by a period and then your class name, such as '.redlego', whereas IDs are defined with # symbols, such as "#speciallego"). The bottom right is the result of our code. As you can see, the text is red! This is because of the code in the top right box, which is

    .redlego{
    color:red;
    }

    So the class redlego, has one rule, which is that the text color is red. In CSS, text color is defined by the identifier "color". Try replacing the code in the top right box with this, and click run at the top of the boxes, see what happens! Play with it, you can't mess anything up.


    .redlego{
    text-align:center;
    font-size:140%;
    background-color:#000;
    color:red;
    }
     
    • Thanks Thanks x 1
    Last edited: Mar 1, 2013
  14. darekmoore

    darekmoore Newbie

    Joined:
    Nov 26, 2012
    Messages:
    16
    Likes Received:
    2
    well said.. thanks for sharing this great info :D