1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

How to learn EFFECTIVE web design?

Discussion in 'HTML & Website Design' started by SimplPrimate, Jul 8, 2019.

  1. #1
    Good afternoon!

    So I am a guy who has wanted to learn how to build GOOD websites most of his life. I just never seem to get very far with it, either I get lost in all the different books, websites and opinions that are out there, I get bored with the read 100 pages and then do 10 minutes of actual design work or life happens and I have to focus on other things.

    I recently got a couple e-books from Amazon, HTML5 and CCS for Dummies and Unraveling HTML5, CSS3 and JavaScript and have been going through both of them some. Both of them are older books and seem to be out dated with what I see on the web today and both of them have completely different ideas on almost everything.

    I am looking for an inexpensive (or free) source to learn web design, and learn it the right way the first time, that is less a text book and more of maybe a project? I am not sure how best to describe that.
    SEMrush
    I do best with hands on, of course explaining how the hands on works is also important.

    Any advice would be greatly appreciated!

    Sam
     
    SimplPrimate, Jul 8, 2019 IP
    SEMrush
  2. SimplPrimate

    SimplPrimate Peon

    Messages:
    6
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    3
    #2
    I am considering going to the book store and picking this one up:

    https://www.barnesandnoble.com/w/murachs-html5-and-css3-anne-boehm/1127921339?ean=9781943872268

    It is the newest one I can find with good ratings and being in book format it might be easier to go through, text books in e-reader format are not quite as friendly.....
     
    SimplPrimate, Jul 8, 2019 IP
  3. deathshadow

    deathshadow Acclaimed Member

    Messages:
    8,864
    Likes Received:
    1,612
    Best Answers:
    230
    Trophy Points:
    515
    #3
    This question actually depends on your definition of "design"; because MOST of what the web development industry calls design? Isn't. NOT EVEN CLOSE!

    I'm going to give you some advice that you won't find in any of those books, or in any tutorials. It's lessons based on 40 years of programming, 20 years of building websites, 10 years of working as an accessibility consultant, and a general knowledge of the site-building process from top to bottom... much less the advice I've gotten over the years that worked, whilst omitting or rejecting the things that were utter tripe.

    A dearly departed friend summed up good design in a rather brilliant way. "A good design is one the user never notices."

    It's a very strange thing to hear, much less wrap your head around... but once you get it? You look at all these artists under the DELUSION they are designers, and suddenly realize just how full of nonsense they are.

    It comes down to another concept, a very simple one that another friend who's no longer with us noted: "People don't visit websites for the goofy graphics and animation you hang around the content, they visit for the content!"

    ...and that's where most people cock-up doing ACTUAL design. It's all about the content. About what the user came to your page to do. It's not about stroking some artists ego, it's not about fancy bling bling nonsense that adds nothing to the user experience, it's about CONTENT and meeting the needs of the USER!

    This is why speed matters. It's why visual accessibility norms matter. It's why things like the underlying semantics for non-visual accessibility matters. It's why letting users do what they came to your site to do matters more than almost anything else... and it's why "Content is king".

    You can actually screw up a hell of a lot -- just look at all the framework-using ignorant frauds out there and the incompetent trash they vomit up scamming client after client -- if the content is good enough to put up with the excess arsty-fartsy BS... But honestly, content that good is rare. That's why a lot of graphical artsy-fartsy nonsense is thrown at covering up for a lack of content.

    Design -- ACTUAL DESIGN -- is NOT art unto and of itself. It is engineering that meets user needs, content creator needs, accessibility norms, obeys specifications and guidelines, and THEN incorporates just enough art it is not hideous. This is why even THINKING about appearance before you have proper semantic markup of your content -- or at minimum a reasonable facsimile of future content -- is utterly and completely back-assward.

    It's why using classes to say what things look like -- like every framework out there -- is wrong. It's why screwing around in some WYSIWYG editor is wrong. It's why dicking around editing layers in Photoshop and calling it "design" is so wrong it may never be right again!

    Hence why sites like Google and eBay are good design... you want examples of horrifyingly BAD designs? Go to a site claiming to be about the "best in design" such as "awwwards". Yes, many of the sites are pretty, even clean... but they're horrifically badly coded, horrifically worse at accessibility and usability, and are more often than not riddled with garbage that makes the visitor to the page have to work harder to get anything done -- even just reading the content or finding what they came to the site for.

    It's this artsy-fartsy form-over-function that can cause most real businesses that pull these stunts to either treat their websites as a "necessary expense" (aka money pit), or if they have no physical product to fall back on end up going under in a year. No joke, stuff like that are a major contributor to why most web startups fail.

    Let me give you a stunning example of one of the worst sections of a website I've ever seen from a design perspective:
    https://www.blackmagicdesign.com/products/davinciresolve/

    Their main site isn't horrifically bad (it has problems, but I can get done what I need done), but when you try to get actual information about DaVinci Resolve, or even *SHOCK* to download / buy a copy, you come to the train-wreck of incompetence and ineptitude I just linked to. Most of the "artists" under the DELUSION they are designers would not -- or likely understand -- what's so wrong about that page.

    Where are the download/buy links? This is the page Google takes you straight to.

    The page navigation is hidden below the fold by a stupid massive stock image that has dick-all to do with the product. At 1080p and entire screen is wasted when the only huffing thing on the screen is the product name! (for a version that's still in BETA, aka "not for production use"). The single "menu" just shleps you around the single page that wastes in excess of 30+ full height scrolls on a mere 18k of content text (aka omitting menus and disclaimers). The majority of that text being redundant, repetitive, and irrelevant to the task of actually getting the product. Worse, nowhere does the menu imply where to ACTUALLY get it... no, that's buried so far down the page you'd think it was part of the footer.

    There is a product, you have a free and a pay version. PUT THAT AT THE TOP. People know what stock images are, you're not impressing anyone by filling the page with them, get rid of them! There is a complete lack of focus on what the user came to do, and more of a focus on bling bling nonsense. That does NOT help move the item in question. Hell, three of the major sections -- at least five screen-heights at 1080p -- of the page aren't even for Resolve itself! They're advertisements for other products that work with it! Utter and complete /FAIL/ at content development as it relates to design; BUT entirely what I've come to expect when a marketing turd who knows dick about the web teams up with an artists deluded about their own skillset. Websites that look pretty, go over well with the suits, and in the end utterly and totally piss off users.

    ... and that's before we talk about the accessibility failings of how they used REM across the design, but then told REM to sod off by declaring 10px on body. (one of the dumbest things I've ever seen). Hence why the page is not "elastic" failing to scale to user preference without diving for the zoom, a horrible idea when so much space is wasted on massive images visitors really aren't going to give a flying purple fish about, much less the over-use of whitespace to try and hide the poor content quality. That any attempt at responsiveness ranges from little to none -- at least for me as a USER -- only further exacerbates and already painful to use site.

    Naturally, that's before we talk the minute and a half page-load thanks to the 136 separate file requests needed to load the site. Spends more time handshaking than it does on transfer, another indication of EPIC /FAIL/ in terms of ACTUAL design.

    But because people seem to think that design means "oooh, pretty" you'll see steaming piles like this held up as the pinnacle of good design. It isn't. You know what good design looks like? Craigslist. Google. E-Bay. You say "Craigslist is good design" to most of the typical artists calling themselves "designers" they're peeper will shrink in so far it shoots out their pooper. That simply shows how utterly full of manure they are.

    A decade ago when Apple set the trend of "flat design" in motion I'd have included them, but ever since Jobs passed they've been wetting their own bed, undoing everything they were once praised for. The current steaming pile they have being as likely a contributor to their declining online sales as their lacklustre new products and horde of scandals that call their ALLEGED quality into question.

    Flat, Flat+, Fat Flat, etc are good design. They're clean, simple, and put the content and usability ahead of goofy animations, goofy stock photos, goofy background trickery, and all the other games people play that do nothing but stroke the artists... ego. I mean something else, but let's say ego.

    This focus on form over function in "design" has always been a problem in every field, it's why things like the "engineering code of ethics" exist and why certain "architects" like Rafael Vinoly are as big a bunch of frauds as the "designers" making these fancy websites. The end result are things like the so-called "death ray" buildings because an artsy design was put ahead of public safety. You look up "architectural disasters" and a good two-thirds of them are not shoddy materials, or fault of the contractors, or someone up top cutting corners. NO! It's some art f** who put pretty ahead of basic physics.

    Just like in web design. Putting pretty, or expedience, or "I don't have the time and money" ahead of usability, accessibility, or why websites exist. That's why so many of these artsy fartsy pages fail. That's why it pisses off so many users. That's why these things matter... and I guarantee you cut those corners for "ooh shiny" now it WILL cost you more time and money in the long run.

    But we live in the "credit mentality" society. Pay more later for something you cant afford now. Snake oil peddlers. carny barkers, and two-bit hucksters everywhere rejoice over this now being the societal norm.

    Just like how online scammers exploit people who will take one look at this post, scream "AAAH, WALL OF TEXT", and instead look for the "easy" answers, even when they are bald-faced lies. The typical twitter generation mouth-breather who thinks their cup runneth over when the 144 character limit was lifted are prime targets for those peddling bunko.
     
    deathshadow, Jul 10, 2019 IP
  4. SimplPrimate

    SimplPrimate Peon

    Messages:
    6
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    3
    #4
    Thank you very much for your awesome reply to my post. I actually worded the topic improperly, I should have said web development not web design.

    I am attempting to learn full stack web development. I bought the book I listed above and also some courses on Udemy (I got the courses at 95% off so a great deal) and am going to work through them all and learn as much as I can. Then probably buy more books and courses.
     
    SimplPrimate, Jul 10, 2019 IP
  5. pxgfx

    pxgfx Active Member

    Messages:
    73
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    50
    #5
    @SimplPrimate

    My advice is that you pay close attention to what @deathshadow just laid out. This is the current state of the web. It's sad but you will come to realize how this industry is actually mostly driven by scam artists who call themselves designers/developers/professionals/UI specialists/UX specialists/bootstrap experts (let's add "with XX years of experience") but are actually "full of nonsense" you'd think if most of them still have something inside them that kind of resembles the human kardía!!

    I'd say beginner books are still better than most free/paid online tuts and videos. I find them to be more organized and they also usually don't skip the basic concepts, terms, theories, even history among other things that may not seem very important at first glance -- that's why you don't usually see them covered in most online tuts, BUT are actually golden ... at least for me I find them these little bits of information as important. I don't take shortcuts. I don't like to, even in video games. I don't find any enjoyment in using cheat codes. It's all fake and not rewarding. I like to grind instead. But unlike playing video games where you still have to rely on RNG, learning to code doesn't have that ... so technically it should be easier lol

    You should have a solid foundation by the time you're done with those materials you purchased and I think that's more than enough to get you started with 2 of the most important things that actually matter: building websites and not becoming a scam artist along the way.
     
    Last edited: Jul 11, 2019
    pxgfx, Jul 11, 2019 IP
  6. SimplPrimate

    SimplPrimate Peon

    Messages:
    6
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    3
    #6
    I appreciate this insight very much. Unfortunately the whole world is full of scammers and cheaters that will do anything and everything to get ahead, and maybe that is why I am still working at Home Depot for peanuts.... I refuse to be one of those people that takes shortcuts and cuts corners and stomps on everyone else to make sure I am the one in front.

    I want to learn all of this correctly and I want to be able to plan and build a full website, taking care of every aspect of it myself. This way I can work on any project, any part of the project, and know I will do it right. Also being able to make sure that those doing any other parts of the project are doing their part the right way.
     
    SimplPrimate, Jul 11, 2019 IP
    pxgfx likes this.
  7. SimplPrimate

    SimplPrimate Peon

    Messages:
    6
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    3
    #7
    I also will add, I am an avid gamer. I also do not cheat or steal or cut corners in games. I take my time in games and do everything the right way.
     
    SimplPrimate, Jul 11, 2019 IP
    pxgfx likes this.
  8. pxgfx

    pxgfx Active Member

    Messages:
    73
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    50
    #8
    Do this right and you'll have more time playing video games than fixing bugs LOL

    BTW, you don't learn bootstrap. Learn HTML and CSS properly instead cos it is A LOT easier! Only look at bootstrap after doing so ... and that's only to confirm how useless and flawed it is.
     
    pxgfx, Jul 11, 2019 IP