Results 1 to 21 of 21
  1. #1
    Join Date
    Jul 2004
    Posts
    1,983
    Thanks
    4,700
    Thanked 1,137 Times in 399 Posts

    Html and web design

    Hey.

    Just looking for some info on html and web design, anyone who does this kinda thing for a living, your input would be greatly appeciated.

    Ive been looking for html tutorials and ive found some here and there, but ive also found that there are programs that do all or most of the html for you and you just have to put in the pictures and text etc etc, I would think if people wanted a site built they could just use this rather than paying someone else to do it for them.

    If I were to get into this to make money as a professional web designer some day, would I need to know html/flash/whatever else, really well, or just piggy back on a program that does it for me? because tbh that feels like cheating.

    But Im a complete newb at this so clearly I have a huge lack of info on the subject, and I just want some info on where to start and what I need to do.

    also any good tutorial sites etc would be great, Ive found some, though alot of them seem to try and give me spyware -.-

    thanks



  2. Hide this ad by registering as a member
  3. #2
    Join Date
    Feb 2009
    Location
    Scotland
    Posts
    596
    Thanks
    415
    Thanked 530 Times in 246 Posts
    Programs create very ugly coding. They often create long code that could be shortened a lot. If the code can be shortened/made more efficient, then the websites loading times could be decreased.
    My Sketchbook

    frazmctag@gmail.com

  4. The Following 2 Users Say Thank You to FraserMcT For This Useful Post:


  5. #3
    Join Date
    Mar 2007
    Location
    Wellington, New Zealand
    Posts
    1,830
    Thanks
    1,110
    Thanked 1,312 Times in 544 Posts
    Hi Crane.

    I'm a part-time web designer / graphic designer and I'll tell you without hesitation that you do need to have a really good understanding of HTML, CSS, XML, XHTML, javascript (Don't worry, the similarities will between all of these will become apparent really quickly, not as daunting as you might think) and other lingo's in order to become successful at this line of work.

    There are times where you can make shortcuts to speed up the work... such as using bits of coding that you've made before on another project to put into this one.

    One of the best tutorial sites I've come across is http://www.w3schools.com/ (note that there are a bunch of different things to learn listed in the left margin, just keep learning what you can)

    Also, if you want to learn actionscript, pick up "Game Development with Actionscript", it's the bible of it's genre.

    You don't need to go to any schools or universities to get into this at all, I'm purely self-taught and have just had input from my two different bosses throughout the industry... another important note is that it pays off a hundred times over to have a creative spark in your work: it'll become dead easy to make generic sites here and there, but if you make one that looks really cool (and I mean really cool and unique)... then you'll notice the clients come flooding in.

    It might sound like there's a lot involved... and there is, but as long as you keep teaching yourself and start doing so by making projects that are personally fun to you (maybe start your own portfolio site, or your own blog or something.... just something for YOU)... then you'll not even notice how much you're learning.

    Also note: A good habit is to teach yourself how to touch-type if you haven't already, that way you can observe and read what you're typing as you do it; this is important as one small typo in your code can cause some pretty undesirable consequences... so it's best to track them down as soon as possible. - On that note, when debugging your code your best friend will be your "comments" that you can leave throughout your code, without altering anything on your website... but I think that w3schools website will introduce commenting at a more appropriate time if you follow their tutorials systematically.

    Hope this helps.

  6. The Following User Says Thank You to BlightedArt For This Useful Post:


  7. #4
    Join Date
    Apr 2008
    Location
    Australia
    Posts
    61
    Thanks
    29
    Thanked 35 Times in 14 Posts
    If you want to web design as part of your profession, you'll need to know html, css, php, MySQL, Javascript, and if you design websites, most probably flash as well. You can't get away with using a program like Dreamweaver because you still need html/css knowledge to build a decent site, and also the code these types of programs create tends to be messy (it IS important that your code looks good).

    These days, most people want websites they can update themselves, which generally requires a CMS like Wordpress, Expression Engine or Greymatter. Unless you want to sit down and learn all the stuff I mention above, I think your best bet is to get some basic CSS/HTML knowledge, and work on the more graphic side of things. Then team up with a web developer and work together

    http://www.subcide.com/tutorials/csslayout/ This tutorial got me started on CSS websites, it will explain all the basics of building a html/CSS site.

    You might also be interested in looking into Squarespace, to make a decent/unique site there you'll need to have knowledge again of html and css, but they can do a lot of the more tricky things for you with their editor.

    Hope that helps.

  8. The Following User Says Thank You to greenbears For This Useful Post:


  9. #5
    Join Date
    Mar 2007
    Location
    Wellington, New Zealand
    Posts
    1,830
    Thanks
    1,110
    Thanked 1,312 Times in 544 Posts
    Crane, don't be disheartened by how many different things you need to learn... After a short while you'll notice that HTML, CSS, PHP etc will have a LOT of similarities as they're usually created in the first place using their predecessors as a template to make for more efficient coding. It's like learning another language at first, then learning different dialects within that language: it gets easier when you learn that fundamental scheme (in this case, HTML / CSS).

  10. The Following User Says Thank You to BlightedArt For This Useful Post:


  11. #6
    Join Date
    Jul 2004
    Posts
    1,983
    Thanks
    4,700
    Thanked 1,137 Times in 399 Posts
    Brilliant posts!

    Yeah I can certainly see how all that daunting text can put a person off learning it, It'd be like going up to a newbie artist and saying 'you need to learn anatomy, line, form, color, perspective, atmospheric perspective, so on so forth' lol

    These sites look so much better than the ones ive found, thanks you very much, far more professional too. I'll check the sites when im less tired and able to focus more, Its really overwhelming when all I need to learn is packed together XD how much time did you spend on this a day? I do have a fair bit of free time, but obviously I wanna divide that with my art and maybe a few other things, so what would be a good amount of time per day to practice this? or is that really up to me generally?

    btw have you got any sites that you designed? id love to see one or two BlightedArt

    thanks again you guys!


  12. #7
    Join Date
    Mar 2007
    Location
    Wellington, New Zealand
    Posts
    1,830
    Thanks
    1,110
    Thanked 1,312 Times in 544 Posts
    Hi Crane,

    The amount of time you spend on it is really up to you, I didn't really have a set time per day to teach myself all that... I guess I'd spend a few hours on it one day then not do any the next. I kind of enjoyed it so it just didn't really become a scheduled chore for me until eventually getting work on a 9-5pm basis for it... now I do it part time with full-time illustration/animation study.

    Right now I'm working at http://graphicsolutions.co.nz/ which has a portfolio on it with our works. A lot of them I didn't work on but all the projects I've done work on have been in collaboration with my boss, there's not really any one site that's purely one persons work (it's great if you can find someone to work with).

    Other than that, for learning I just made very small scripts that really only practice one action at a time; type your name in a box, hit submit, see whatever action you assigned to that happen... that's all the page does. -- You'll eventually have to compile everything you learn into one site of course, but keeping your individual functions and experiments in their own little place like this is great for referring back to (note: good file organisation comes in here).

    I've got an art portfolio site for myself which's pretty much abandoned now but still online haha... but this was back when I was learning the really basic web-des stuff back with <tr> and <td> tags (important to be aware of, but they're pretty much outdated and messy now). Here it is.

    You're totally right about comparing it with telling a new artist about anatomy and such, but it's really not as daunting once you get into it.


    Oh! And make sure you have the main web browsers: Internet Explorer (most recent version and maybe also IE 6, just an older one)... Firefox, Safari, Google Chrome and maybe Opera.... the more of these you have access to the better, as there are times where your code will be written exactly the same in each of them, but the browsers themselves handle the code a little differently. Most of the time this just moves things around a couple pixels and might not cause much hassle, but once or twice you'll get something working fine in one browser and atrociously in another... It's good to download Firebug for Firefox too... this add-on will allow you to click any element on a webpage and a popup window will show where it is in the pages code, you can also edit some parts of the code right then and there to see what effects your adjustments will have (though you can't SAVE any edits you make, it's purely a preview thing, but damn it's handy).
    Last edited by BlightedArt; April 11th, 2010 at 07:41 PM.

  13. The Following User Says Thank You to BlightedArt For This Useful Post:


  14. #8
    Join Date
    Mar 2007
    Location
    Wellington, New Zealand
    Posts
    1,830
    Thanks
    1,110
    Thanked 1,312 Times in 544 Posts
    Crap, double post sorry.... lag central over here in NZ.
    Last edited by BlightedArt; April 11th, 2010 at 07:40 PM.

  15. The Following User Says Thank You to BlightedArt For This Useful Post:


  16. #9
    Join Date
    Jul 2004
    Posts
    1,983
    Thanks
    4,700
    Thanked 1,137 Times in 399 Posts
    Haha, I know all about lag, using network 3 mobile broadband -.-

    I only ask about routine learning because i have a MASSIVE lack of routine in everything i do, eating, sleep, drawing, etc, apart from work, which I cant change, I def need to at least fix my sleep because its screwing me up, and its been like this for years lol, never got how important it was really -.-

    I really want to avoid seeing it as a chore, otherwise it will just put me off before I even get anywhere with it. Im kinda putting that pressure on my art at the moment and its not helping much -.-

    Ive heard of the whole works in one browser, not so much in another and that confused me no end lol. Wouldn't changing the code to work in one screw up another? or is that a separate script for each? confused

    Edit: Also, the interface of a website is designed in photoshop right? well not just ps, but I see lots of tutorials for funky button designs and such and that just makes sense as you choose the images to upload as part of the site etc
    Last edited by Krane; April 11th, 2010 at 08:08 PM.


  17. #10
    Join Date
    Mar 2007
    Location
    Wellington, New Zealand
    Posts
    1,830
    Thanks
    1,110
    Thanked 1,312 Times in 544 Posts
    Yeah, changing one will change the appearance in another too, the debugging part can take a while but the idea is to try to find a way that works in as many browsers as possible, at least the ones used the most:

    w3schools' statistics on most used browsers... this kind of presents you with a hierarchy on which browser is "most important to have your site function in".... but it's best to get it working in all of them heh.

    The screwed up sleeping patterns is all too familiar. You should set deadlines for yourself; get some part of your website finished today, or by the end of tomorrow (and more importantly, stick to those deadlines)... if you didn't succeed then just think about what you DID learn in that timeframe, and try again. Also don't use the computer after a certain hour of the day... that's really what screws your sleeping up; if you use the computer then go straight to sleep you'll be awake til the sun comes up. Give yourself about an hour of no-monitors and read / do some light sketching / listen to music or whatever before sleeping, makes a world of difference.

    On another note: See if you can get your hands on Adobe Illustrator if you haven't already; when it comes to brainstorming and developing aesthetic concepts for your websites then this programs a badass for it; resizing and slapping general ideas together then duplicating those ideas to another page and making tweaks is sooooo much better than working in photoshop and freehand, which a lot of people seem to do. But making the actual buttons can be made in Photoshop or Illustrator, or a combination of the two... if you have a very simple button with simple, clean shapes and text then use Illustrator... if you want something with shading and fine details then maybe use photoshop (create the button at maybe 300% of its final size then shrink down, but remember to save a backup version of the full-sized, full-layers image before doing that).
    Last edited by BlightedArt; April 11th, 2010 at 08:14 PM.

  18. The Following User Says Thank You to BlightedArt For This Useful Post:


  19. #11
    Join Date
    Jul 2004
    Posts
    1,983
    Thanks
    4,700
    Thanked 1,137 Times in 399 Posts
    Well firefox is clearly the topdog here, It'd be easy to get it working in that and not worry about the others, but you don't get good by being a half asser lol.

    After using the comp for most of my life, you'd think id know a little something, or as you metioned, at least know how to touch type lol btw any good sites on that? would certainly make alot of things easier.

    As for the sleeping thing, ive looked up a few sites, seems really simple, don't eat big meals before bed, don't comp, tv blah blah, bad thing is, ive been breaking all thoughs rules, and with a sledgehammer too -.- no wonder I don't get anything done and feel like shit all the time.

    I may be able to get my hands on illu at some point, I do have PS cs4, would that work as well?
    euh its a horrible feeling starting from scratch lol.


  20. #12
    Join Date
    Mar 2007
    Location
    Wellington, New Zealand
    Posts
    1,830
    Thanks
    1,110
    Thanked 1,312 Times in 544 Posts
    There are no rules as to what programs you can use really. But I've found Illustrator to be incredibly helpful and fast, would definitely recommend it. Photoshop is okay, but you really can't get hung up on working on something for too long... the bad thing about it is if you make an element quite small and decide it needs to be a bit bigger, once you resize it it'll become pixelated, Illustrator doesn't have that problem as it works with vectors. You might be able to get away with making things large in photoshop and converting them to Smart Objects, but Illustrator will still end up being quicker and more convenient.

    Touch typing was taught to us through our high schools I.T. paper... but a quick google search brought this site up to the first result: http://www.sense-lang.org/typing/

    Took a quick look and it seems to be pretty sound. Once you can type your code while looking at the screen it'll really help with inputting code while getting rid of some typos on the fly. Work for Firefox and Internet Explorer too by the way: IE8, 7 and 6 might be different versions but they behave very similar being in the same family: it's kind of a safe judgement to get all the percentages of the IE browser versions of that site and lump them together as the "Internet Explorer Family", making it almost as common as Firefox.

    Working from scratch is kind of scary, but it's satisfying when you make your first functioning webpage, even if it's incredibly simple it's gratifying.

  21. The Following User Says Thank You to BlightedArt For This Useful Post:


  22. #13
    Join Date
    Apr 2010
    Location
    Michigan
    Posts
    37
    Thanks
    3
    Thanked 9 Times in 8 Posts
    I taught myself HTML when I was 12 and CSS shortly after, they're not hard languages to learn, so don't really get hung up on not knowing what to do starting from scratch. PHP is also pretty easy and the book I learned from also taught the basics of MySQL. I honestly don't know very much Javascript, just like, the bare bare basics, so I can't really speak much on that... I'd imagine it can't be much harder than Python though, and I know my way around Python pretty well.

    On the topic of browser compatibility, Internet Explorer doesn't do well with CSS3, so if you use anything that's new in CSS3, like rounded corners, be aware that IE will not render most of CSS3. Last I checked, w3 schools only has CSS2.1 tutorials, so if you decide to study from there, you'll be safe. Do be aware of the major HTML rendering engines though, KHTML, Webkit Gecko and Trident/MSHTML

    Illustrator or something else that uses vectors (Inkscape is probably the best free vector program) is best for creating web graphics.... I kinda feel like I'm just repeating what BlightedArt said, and I kinda don't feel quite so qualified to say much of anything because despite the fact that I've been playing around with web design for four years, I still feel like I kinda suck. I'm 100% sure that BlightedArt is a much better authority on web dev.
    I have also used Dreamweaver in the past, but only in code viewing mode, all the programming I did was by hand, just having my web page rendered below my typing was just so great. The integrated FTP client was also a big help. Of course, now that I've moved primatily to Linux, I do my coding in Geany, have both a Chrome and Firefox window open to test it, and I use the FTP client that's a part of Nautilus. I have friends that use Windows test out pages on IE that I think might render differently.
    was I left behind?
    Someone tell me, tell me I survived.
    Don't look so surprised that I'm home, but just for tonight.
    With rough hands and sore eyes
    so don't speak, I am tired.
    Let's just live through this lie.

  23. The Following 2 Users Say Thank You to RedHotHoshi For This Useful Post:


  24. #14
    Join Date
    Jul 2004
    Posts
    1,983
    Thanks
    4,700
    Thanked 1,137 Times in 399 Posts
    Im glad you mentioned Inkscape Redhothoshi since I will be low on funds, so it will be useful to be able to pick up a free vector program.
    Learning html at 12 certainly makes me feel better about taking it up lol. As you said, it shouldn't be to hard once I get into it.

    BlightedArt do you use flash at all? ive seen some brilliant sites done with that, but not sure how it fits in with html and whether its far more complex than just with illu (or inkscape). In any case I think it would be a good idea to leave that for when im a little bit more skilled in this area any, but it would be nice to know regardless.

    On the touch typing, I can do it a little bit, so it shouldnt be to hard to pick it up. thanks for the site too.


  25. #15
    Join Date
    Mar 2007
    Location
    Wellington, New Zealand
    Posts
    1,830
    Thanks
    1,110
    Thanked 1,312 Times in 544 Posts
    If you mean using Flash for conceptualising web pages then you might be alright: I used Flash pretty unconventionally for concepting ideas and simply drawing with vectors. Illustrator is still made to fit those things more than flash is but you can still use it. Generally vectors are better than pixels for this... but if you're not sure if a program will be suitable then try it out anyway, you never know what new little techniques you'll stumble across in the process.

    If you mean using flash/actionscript to build websites however, save that for later. By all means mess about with it here and there, but learning about using HTML and doing general website designs will give you an understanding of fundamental design principles (contrast, repitition, composition and all that jazz), which transfer directly over to flash websites... the only other things flash sites have going for them is that they're more interactive and include animations.

    Note about flash sites is that they're actually not always preferred.... You'll get some really nice flash sites here and there, but mostly they just seem overworked. You can't do too much in flash actionscript without your browser running slower. A site made entirely of flash rarely works as well as it could as just an HTML page with flash elements in it....

    Here's a couple good example of a bad flash sites haha:
    http://adisney.go.com/disneypictures/aliceinwonderland/
    http://www.shrek.com/

    The sites themselves actually look quite nice, but when you're navigating through menus in the Alice and Wonderland one, it's likely to run quite slow just because you're playing such a massive flash file with so many functions going on... Not to mention that both the flash sites take a while to simply load in the first place. A lot of the text boxes and images are unnecessarily used in flash when it would be easier to do in HTML, not to mention easier to edit and debug in the long run, and you can click and drag over text in HTML to copy and paste it or whatever, or directly link someone to a specific page in HTML, whereas a flash website doesn't really allow selection of text, and all of the pages fall under one URL.


    Here's a much better example of nicely used flash elements in an HTML page:
    http://www.xombified.com/

    The text boxes and such are done in HTML, with things like the navigation bar up top, the advert below it, and then the elements in the left margin done in individual flash files. The better thing about this is that should one of the flash files fail to load for some reason, the most important elements of the HTML file can still be displayed unaffected... allowing people to view your page reasonably fine while you fix the broken element. If the flash file stopped working in the Alice and Wonderland and Shrek sites however, the whole site would go down.

    All in all, learning flash is A-OK, but mainly something that will likely just accompany your HTML sites.

  26. The Following User Says Thank You to BlightedArt For This Useful Post:


  27. #16
    Join Date
    Jul 2004
    Posts
    1,983
    Thanks
    4,700
    Thanked 1,137 Times in 399 Posts
    That certainly clears alot of things up, thanks alot.

    I can see what you mean by the lag when loading, and when people are on a limit like me it takes up unnessasary usage. While it looks good, its far less pratical, I would be far more inclined to look at the xombies site, far far less busy.

    Thats a very good point on the If the flash goes down it won't take the site down with it unlike the full flash one. the whole 'falling under one url' just seems rather stupid, is that cause the info generally comes up on a kinda slideshow panel thingy, dunno the name lol I think i understand that though.

    I feel so far behind with other things, like photoshop even, its even more to learn, and for some reason im putting a time limit on this and its stressing me out.


  28. #17
    Join Date
    Sep 2005
    Posts
    3,430
    Thanks
    643
    Thanked 1,484 Times in 719 Posts
    RE Flash.

    Given the choice between a Flash and an HTML site, have you ever clicked the Flash option?

    I haven't..

  29. The Following 2 Users Say Thank You to Flake For This Useful Post:


  30. #18
    Join Date
    Mar 2007
    Location
    Wellington, New Zealand
    Posts
    1,830
    Thanks
    1,110
    Thanked 1,312 Times in 544 Posts
    Slideshow wouldn't be too far from the truth. But like a presentation that's oriented completely around one slideshow: if the projector goes down then so does the whole presentation.... whereas if you have a projector and a spokesperson with a few photos, even if the projector goes down the show can still go on... That's a really bad analogy sorry. Lol....

    Nah, don't stress about it. My boss didn't start using this stuff til he was about 28 years old and he's a guru at it now, just because he took his own pace with it and enjoyed it. It's easy to think too far ahead about anything you're interested in doing and being freaked out about it. Take the small steps first and learn bits at a time, after a couple weeks you can look back on what you've accomplished and it'll be more than you think. That'll definitely spur you on.

    I started doing this pretty loosely when I was 14 or 15, then started to get more heavily involved at 17-18. I'm 22 now. Since it's been part time most of that time it's really only about 4 years worth of practical experience, but about 8 years of observing how other people work, not to mention working with other web developers is invaluable.

    Everything you do in art and design feeds into each other; if you paint using photoshop while keeping things like colour theory and composition in mind, then you're also subconsciously gaining relevant experience to design website elements; making sure the composition of it is nice and the colours are just right. That's the great thing about the visual creative industry, it's so broad but everything ties in with each other.

  31. The Following User Says Thank You to BlightedArt For This Useful Post:


  32. #19
    Join Date
    Jul 2004
    Posts
    1,983
    Thanks
    4,700
    Thanked 1,137 Times in 399 Posts
    Nah man, its a good analogy lol, at least I can understand it.

    I think im stressing because alot of my time has been wasted for some reason or another, and more times than most a really bad reason, barely an excuse lol. and years have just gone past in leaps and bounds, its a horrible feeling lol.

    I want to jump in, like a cold swimming pool, but its not like that, because I go to jump in and its like 'whoa, cant do that, sharks are there, ok what about over here... eeerr, no, alligators... here?.. nope, jellyfish... ah a safe place..... aaAAHHHH I CANT SWIM!' XD I def need to do all this in my own pace, saying that, I need a pace 1st, so it really is starting right from the start lol. I know one reason is me working at B&Q (DIY store if you dont have it where you are) and its the same boring shit day after day, stack shelves, taking shit from the boss and working along side someone I really don't want to end up becoming, so in my head its like 'You need to get shit done NOW, get good at this NOW, do this do that pressure pressure pressure!!' aaaarrgghh!! hard habit to break


  33. #20
    Join Date
    Mar 2007
    Location
    Wellington, New Zealand
    Posts
    1,830
    Thanks
    1,110
    Thanked 1,312 Times in 544 Posts
    Lol. I know B&Q... are you in England? (Moved here from Newcastle) Thing is that everybody has the exact same initial "oh shit" panic moment you're having, which turns most people away from even starting, others take it up and once you get your first few steps in you almost completely forget you were panicking to begin with. Take it up and get started, try reading the HTML section of w3schools right now and try something out, all you need to begin with is Notepad and some sort of browser, both of which you have (by the way, download Notepad++ it's a better version of notepad, surprisingly handy).

    You can add me to MSN if you'd like, so you can send your little experiments my way for a looksee, not sure if it'll be ok to post them on here in the lounge unless other people start getting involved too. My MSN is blighted_art@hotmail.com but I'll not be on for another few hours.

  34. #21
    Join Date
    Jul 2004
    Posts
    1,983
    Thanks
    4,700
    Thanked 1,137 Times in 399 Posts
    yeah I am. haha newcastle to new zealand, bet thats a major change, I d love to live there, such a beautiful place. Ill download Notepad++ now, but Im going to bed now, gonna do some yoga stretches before, working that back into my routine, and hopefully get myself up at 11 tomorrow (its 4:25 am at the mo) since they say you should get up the same time regardless of lack of sleep.

    Ive added you on msn, Ill catch you on tomorrow maybe, and we can go from there, thanks for all the help, its greatly appeciated!


  35. The Following User Says Thank You to Krane For This Useful Post:


Similar Threads

  1. Use of HTML
    By Sadr in forum Support
    Replies: 3
    Last Post: July 1st, 2007, 06:40 PM
  2. html help ???
    By Forge in forum Art Critique Center
    Replies: 4
    Last Post: July 17th, 2003, 09:11 AM
  3. HTML trick?
    By ATOMICsizePENCIL in forum Artist Lounge
    Replies: 3
    Last Post: May 6th, 2003, 06:32 PM

Members who have read this thread: 0

There are no members to list at the moment.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Designed by The Coldest Water, we build the coldest best water bottles, ice packs and best pillows.