Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 15 of 15
  1. #1
    New Coder
    Join Date
    Nov 2005
    Location
    Toronto, Ontario (Canada)
    Posts
    21
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Who's responsible for the responsive part?

    Hi,

    So I need my site designed & coded & I plan to hire 2 different people of course.

    Here are my questions:

    1. Who is responsible for the responsive part? The graphic web designer, or the website coder? This graphic web designer I was thinking of hiring is now saying he has to make 4 pages instead of 2 just to make the index & sub responsive.[/LIST]

    2. I'm ALL about valid semantic code, but I'm a very tight budget. Someone mentioned using Beaver Builder & Elementor to cut down on the cost. I asked him if it's the same as DW which I grew to dislike YEARS ago & he said no, but he never gave me an explanation as to how it's different.

    Are these 2 page builders different than DW? Is the code they create valid/semantic?[/LIST]

    Thanks a ton

  2. #2
    Senior Coder deathshadow's Avatar
    Join Date
    Feb 2016
    Location
    Keene, NH
    Posts
    3,190
    Thanks
    4
    Thanked 463 Times in 451 Posts
    Honestly, that this is even a question PROBABLY means you've been scammed into thinking that this is a job for two people. But to be fair, I consider the artists under the DELUSION that they are designers to be either utterly and completely incompetent, willfully negligent, or nothing more than outright con-men.

    The majority of "graphic web designers" do not know enough HTML, CSS, Accessibility, usability, user-experience, or any other important factor of making a website to be qualified to design a blasted thing.
    “There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies and the other way is to make it so complicated that there are no obvious deficiencies.” – C.A.R. Hoare, The 1980 ACM Turing Award Lecture
    http://www.cutcodedown.com

  3. #3
    Administrator VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    11,180
    Thanks
    6
    Thanked 1,343 Times in 1,312 Posts
    Quote Originally Posted by deathshadow View Post
    The majority of "graphic web designers" do not know enough HTML, CSS, Accessibility, usability, user-experience, or any other important factor of making a website to be qualified to design a blasted thing.
    On the other hand, the majority of coders don’t know enough about graphic/UI design either, so there are occasions where two specialists need to work together. And I’m also often working with graphic designers, giving them suggestions/advice where they lack the experience, and they are usually grateful for any input.

    @ep2002, as to who is responsible, I’d say both of them. The graphics guy is responsible for the visual concept and the coder is responsible for the actual functionality. While a coder with some eye for graphic design might be able to make a responsive page from just one layout comp, it’s not uncommon for graphic designers to provide a comp for a large viewport layout and one for a small viewport layout as guideline for the coder. The coder often still has to do all the guesswork on how and when it should adapt to the intermediate size viewports. But that’s why both of them are ideally working closely together, to give mutual input.

  4. #4
    New Coder
    Join Date
    Nov 2005
    Location
    Toronto, Ontario (Canada)
    Posts
    21
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by deathshadow View Post
    Honestly, that this is even a question PROBABLY means you've been scammed into thinking that this is a job for two people. But to be fair, I consider the artists under the DELUSION that they are designers to be either utterly and completely incompetent, willfully negligent, or nothing more than outright con-men.

    The majority of "graphic web designers" do not know enough HTML, CSS, Accessibility, usability, user-experience, or any other important factor of making a website to be qualified to design a blasted thing.
    Oh I agree with you, but we have no choice.

    I would NEVER get a website coder to do design. They are terrible at it.

    Quote Originally Posted by VIPStephan View Post
    On the other hand, the majority of coders don’t know enough about graphic/UI design either, so there are occasions where two specialists need to work together. And I’m also often working with graphic designers, giving them suggestions/advice where they lack the experience, and they are usually grateful for any input.

    @ep2002, as to who is responsible, I’d say both of them. The graphics guy is responsible for the visual concept and the coder is responsible for the actual functionality. While a coder with some eye for graphic design might be able to make a responsive page from just one layout comp, it’s not uncommon for graphic designers to provide a comp for a large viewport layout and one for a small viewport layout as guideline for the coder. The coder often still has to do all the guesswork on how and when it should adapt to the intermediate size viewports. But that’s why both of them are ideally working closely together, to give mutual input.
    Well the problem is that I can't afford to have both working together.

    I normally get the designer to do the PSD & then the websiter coder to code it.

    So does the GWD have to do 4 pages? 2 for the computer & 2 for the mobile or does the website coder figure that out?

    Thanks

  5. #5
    Administrator VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    11,180
    Thanks
    6
    Thanked 1,343 Times in 1,312 Posts
    Quote Originally Posted by ep2002 View Post
    So does the GWD have to do 4 pages? 2 for the computer & 2 for the mobile or does the website coder figure that out?
    Depends on how good the coder is. I’ve seen people who didn’t even get a single layout right.

  6. #6
    New Coder
    Join Date
    Nov 2005
    Location
    Toronto, Ontario (Canada)
    Posts
    21
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by VIPStephan View Post
    Depends on how good the coder is. I’ve seen people who didn’t even get a single layout right.
    I still don't understand what you are saying.

    Thanks anyway

  7. #7
    Administrator VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    11,180
    Thanks
    6
    Thanked 1,343 Times in 1,312 Posts
    A good coder with an eye for graphics and UI/UX design will figure out the best approach to responsive layouts by him-/herself from a single comprehensive, a bad coder won’t and will need multiple comps as directions.

  8. #8
    Senior Coder deathshadow's Avatar
    Join Date
    Feb 2016
    Location
    Keene, NH
    Posts
    3,190
    Thanks
    4
    Thanked 463 Times in 451 Posts
    Quote Originally Posted by VIPStephan View Post
    On the other hand, the majority of coders don’t know enough about graphic/UI design either, so there are occasions where two specialists need to work together.
    That's why the way I look at it the front-end coder should work FIRST if you're going to have some artists under the DELUSION they're a designer involved. The front-end coder's job is to -- as you've heard me say many times -- take the content or a reasonable facsimile of future content, mark it up semantically, and use CSS to create the layoutS including the full responsiveness. You then hand that working layout to the artists to do a paint-over.

    It actually works better that way. You get your accessibility, usability, and so forth done BEFORE the artist has their way with it, and so long as you're able to get the artist to keep it in their pants in terms of not violating accessibility norms, you get a far higher quality result.

    But having the artist try to build layouts by pushing pixels around and dicking with layers? EPIC /FAIL/.

    Quote Originally Posted by VIPStephan View Post
    giving them suggestions/advice where they lack the experience, and they are usually grateful for any input.
    I have universally found them to be willfully ignorant, disobedient, and unwilling to embrace the simplest of accessibility norms or limitations of the medium because it "hampers their job" too much. But again with my engineering background I'm a world apart from those who think that art unto and of itself is design.

    But as Dan Schulz (RIP) told me over a decade ago and as I keep parroting incessantly, "People don't visit websites for the goofy art hung around the content, they visit FOR the content" -- which is why I often hold sites like Craigslist up as the pinnacle of good design. Aka a site that -- to paraphrase Larry the Cable Guy -- makes most "web designers" peeper shoot in so far it pokes out their pooper.

    Quote Originally Posted by ep2002 View Post
    I would NEVER get a website coder to do design. They are terrible at it.
    Then you're using the wrong coders, or have unrealistic expectations of your "design". Remember, flash and bling impresses ONCE, after that it just gets in the damned way. There's a reason NONE of the big success stories of the web are an artistic tour-de-force. Quite the opposite in fact... and when companies TRY to load up on the artsy crap it either buries them (jeeves/ask jeeves/ask, Bing, Dailymotion) or turns them into money pits nobody but other artists would hold up as being any good.

    See 99.99% of the crap at AWWWARDS being touted as great design. None of which I'd even CONSIDER letting a client of mine deploy since it's utter and complete useless garbage on the accessibility, usability, or UX front. If anything the sites they're saying are great are prime examples of what NOT to do when building a website.

    Unless your intent is to intentionally piss off visitors!

    Good design is often plain, boring even, because it puts the focus on what's REALLY important -- THE CONTENT! Good design is something that lets people get into the site, do what they came there to do, find the information they need, make any purchases they want to make, with as little muss, fuss, or interference as possible.

    ... and that's where the artists under the DELUSION they are designers, along with many marketing types who think of the home page as a poster sized advert instead of a marketplace -- screw up. They're so obsessed with art that strokes their own ego or being 'flashy to draw in the crowd' they can't see how useless, annoying, and ultimately wasteful their BS truly is.

    In many ways it's the epitome of the catchphrase that's been going around web development for two decades: The web is not print.

    Quote Originally Posted by ep2002 View Post
    Well the problem is that I can't afford to have both working together.
    Then IMHO the result is going to be garbage, and you might as well tell the artist to sod off and not even bother wasting the money on them.

    In case you couldn't tell, I don't have a lot of positive experiences with the fools who call themselves "web designers"... out of hundreds I've butted heads with I've met exactly TWO who were worth their salt; one is dead, the other is working full time for Google.
    Last edited by deathshadow; Oct 28th, 2018 at 03:06 PM.
    “There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies and the other way is to make it so complicated that there are no obvious deficiencies.” – C.A.R. Hoare, The 1980 ACM Turing Award Lecture
    http://www.cutcodedown.com

  9. #9
    New Coder
    Join Date
    Nov 2005
    Location
    Toronto, Ontario (Canada)
    Posts
    21
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by deathshadow View Post
    That's why the way I look at it the front-end coder should work FIRST if you're going to have some artists under the DELUSION they're a designer involved. The front-end coder's job is to -- as you've heard me say many times -- take the content or a reasonable facsimile of future content, mark it up semantically, and use CSS to create the layoutS including the full responsiveness. You then hand that working layout to the artists to do a paint-over.

    It actually works better that way. You get your accessibility, usability, and so forth done BEFORE the artist has their way with it, and so long as you're able to get the artist to keep it in their pants in terms of not violating accessibility norms, you get a far higher quality result.


    Then IMHO the result is going to be garbage, and you might as well tell the artist to sod off and not even bother wasting the money on them.
    .
    I'm still not clear. They create the PSD, then the website coder does the coding & then you send the PSD back to do what's called a 'paint-over?" I don't know what that even means.

    You can NOT tell a micro company on a limited budget that they should just GIVE UP & NOT get a website done just b/c they don't have tons of money. GEEZE!

    I'm NOT looking for fancy flash, but I don't like ugly sites.

    I do agree with you that the ugliest sites tend to do the best which I can NEVER understand, especially if they are terrible at UI.

    I like clean, creative (YES buttons matter b/c that's what people click on) easy to navigate sites.

    While I agree the content matters, MOST people prefer videos these days which throws the whole webcopy thing out the window.

    I feel there should be a bit of both to appease to both parties.

    Most people do NOT have the time to read lots of webcopy & they all skim anyway which is why headings is so important.

    And while you hate most graphic web designers & I agree with you, I hate most website coders. They can't code clean valid semantic code at all & I just learned that my current site design doesn't work on mobile when this entire time I thought it did.

  10. #10
    Senior Coder deathshadow's Avatar
    Join Date
    Feb 2016
    Location
    Keene, NH
    Posts
    3,190
    Thanks
    4
    Thanked 463 Times in 451 Posts
    Quote Originally Posted by ep2002 View Post
    I'm still not clear. They create the PSD, then the website coder does the coding & then you send the PSD back to do what's called a 'paint-over?" I don't know what that even means.
    The front-end developer makes the CODE FIRST. NO flipping PSD involved. He hands the CODED LAYOUT to the artist to create the graphics to be hung on the layout at all the different media query breakpoints as various images, which is then handed back to the front-end coder to be implemented.

    The front end coder having a yay or nay say on the visuals since most of the artists calling themselves designers don't know a damned thing other than "ooh pretty".

    YOU DO NOT START FROM A PSD! That's an utterly back-assward half-assed dumbass inept and incompetent way of building a website! But let me tell you what I REALLY think about it...

    Quote Originally Posted by ep2002 View Post
    You can NOT tell a micro company on a limited budget that they should just GIVE UP & NOT get a website done just b/c they don't have tons of money. GEEZE!
    NOT what I said, I said that if you can't have them work together, skip the one you don't actually need.

    Quote Originally Posted by ep2002 View Post
    I'm NOT looking for fancy flash, but I don't like ugly sites.
    That would probably hinge on your definition of 'ugly' then.

    Quote Originally Posted by ep2002 View Post
    I do agree with you that the ugliest sites tend to do the best which I can NEVER understand, especially if they are terrible at UI.
    To my eyes many of the sites people who like the artsy crap call ugly simply aren't. They're clean, simple, and EASY to navigate. All the fancy stuff that's "pretty" just gets in the way. The lack of it is WHY they're successful. Facepuke, halfTwitter, youTube, Google, DDG... again not a visual tour-de-force.

    Quote Originally Posted by ep2002 View Post
    While I agree the content matters, MOST people prefer videos these days which throws the whole webcopy thing out the window.
    A LOT of people hate videos, but that depends on the subject matter. Videos are an afterthought if you're selling a product. Videos are hard to search, hard to comprehend due to regional accent differences, hard to refer back to, and can even tell large swaths of potential visitors to sod off. Much less search giving a flying purple fish about them.

    Dunno where you got the idea, but text remains the first class citizen of the web; everything else may as well have leprosy.

    I feel there should be a bit of both to appease to both parties.

    Quote Originally Posted by ep2002 View Post
    Most people do NOT have the time to read lots of webcopy & they all skim anyway which is why headings is so important.
    Depends on the subject matter, but yes, headings are important for skimmers -- they're also important for on-site navigation for non-sighted users and other alternative accessibility methods, indexing in search, etc, etc.

    Quote Originally Posted by ep2002 View Post
    And while you hate most graphic web designers & I agree with you, I hate most website coders. They can't code clean valid semantic code at all & I just learned that my current site design doesn't work on mobile when this entire time I thought it did.
    Sounds like you're dealing with scam artists CALLING themselves 'coders'. Sounds like you need a better quality of coder. Here's some tips. If they're going to try and tell you to use wordpress? They're ignorant and/or incompetent. If they're going to use frameworks like W3.css, bootstrap, jQuery, etc? They're ignorant and/or incompetent. If they are telling you to hand them a PSD as a starting point? They're ignorant and/or incompetent.

    If they don't sit down with you to determine what the CONTENT of the website is going to be BEFORE they lay down a single line of HTML? BEFORE you even THINK about getting the graphic artist involved?

    Well, in that case they're so ignorant and incompetent they make the orange cheeto fingered commander in half-tweet look like Albert Einstein.

    You actually sound a LOT like the clients I do work for (where one job is half a years income) who have been screwed over by bad developers AND those artists I'm always taking to task.
    “There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies and the other way is to make it so complicated that there are no obvious deficiencies.” – C.A.R. Hoare, The 1980 ACM Turing Award Lecture
    http://www.cutcodedown.com

  11. #11
    New Coder
    Join Date
    Nov 2005
    Location
    Toronto, Ontario (Canada)
    Posts
    21
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by deathshadow View Post
    The front-end developer makes the CODE FIRST. NO flipping PSD involved. He hands the CODED LAYOUT to the artist to create the graphics to be hung on the layout at all the different media query breakpoints as various images, which is then handed back to the front-end coder to be implemented.

    The front end coder having a yay or nay say on the visuals since most of the artists calling themselves designers don't know a damned thing other than "ooh pretty".

    YOU DO NOT START FROM A PSD! That's an utterly back-assward half-assed dumbass inept and incompetent way of building a website! But let me tell you what I REALLY think about it...


    NOT what I said, I said that if you can't have them work together, skip the one you don't actually need.


    That would probably hinge on your definition of 'ugly' then.


    To my eyes many of the sites people who like the artsy crap call ugly simply aren't. They're clean, simple, and EASY to navigate. All the fancy stuff that's "pretty" just gets in the way. The lack of it is WHY they're successful. Facepuke, halfTwitter, youTube, Google, DDG... again not a visual tour-de-force.



    A LOT of people hate videos, but that depends on the subject matter. Videos are an afterthought if you're selling a product. Videos are hard to search, hard to comprehend due to regional accent differences, hard to refer back to, and can even tell large swaths of potential visitors to sod off. Much less search giving a flying purple fish about them.

    Dunno where you got the idea, but text remains the first class citizen of the web; everything else may as well have leprosy.

    I feel there should be a bit of both to appease to both parties.


    Depends on the subject matter, but yes, headings are important for skimmers -- they're also important for on-site navigation for non-sighted users and other alternative accessibility methods, indexing in search, etc, etc.


    Sounds like you're dealing with scam artists CALLING themselves 'coders'. Sounds like you need a better quality of coder. Here's some tips. If they're going to try and tell you to use wordpress? They're ignorant and/or incompetent. If they're going to use frameworks like W3.css, bootstrap, jQuery, etc? They're ignorant and/or incompetent. If they are telling you to hand them a PSD as a starting point? They're ignorant and/or incompetent.

    If they don't sit down with you to determine what the CONTENT of the website is going to be BEFORE they lay down a single line of HTML? BEFORE you even THINK about getting the graphic artist involved?

    Well, in that case they're so ignorant and incompetent they make the orange cheeto fingered commander in half-tweet look like Albert Einstein.

    You actually sound a LOT like the clients I do work for (where one job is half a years income) who have been screwed over by bad developers AND those artists I'm always taking to task.
    You are soooo funny.

    Anyway, yeh I can't afford even CLOSE to half a year's income.

    Just b/c I know a fair amount doesn't mean I'm rich.

    I just DON'T get how a website coder is supposed to start coding BEFORE there's even a layout to start with, let alone knowing the size of images, where buttons are going to go, etc.

  12. #12
    Administrator VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    11,180
    Thanks
    6
    Thanked 1,343 Times in 1,312 Posts
    Quote Originally Posted by ep2002 View Post
    I just DON'T get how a website coder is supposed to start coding BEFORE there's even a layout to start with, let alone knowing the size of images, where buttons are going to go, etc.
    Take deathshadow’s advice with a grain of salt, he’s an even bigger misanthrope than I am.

    Anyway, I’d say the order of tasks can’t always be followed as strictly as deathshadow imagines. But I get where he is coming from; what he means is that at first you think about the content, not about the size of images or the position of buttons. Imagine creating a text document with the content: you have your headings, your paragraphs, your lists, and perhaps your images if they are relevant for understanding the content. The developer will mark all that up with the respective HTML, and after that content is all conceptualized you start styling things the way you want.

    But as I said, it’s not always that easy to do it in that order. Often, people already think about the layout while conceptualizing the content. Or, after conceptualizing the basic content (without any actual hard copy yet), a UI designer will create wireframes where they outline the general layout of the site, without a front-end dev even having written a single line of code yet. And the dev then uses these wireframes to create the structure of the documents. The “wrong” approach would be if a designer creates a layout without knowing what content goes into the website – a problem many prefabricated templates that you can buy from stock template sites are exhibiting.
    Last edited by VIPStephan; Oct 30th, 2018 at 10:41 AM.

  13. Users who have thanked VIPStephan for this post:

    ep2002 (Oct 30th, 2018)

  14. #13
    New Coder
    Join Date
    Nov 2005
    Location
    Toronto, Ontario (Canada)
    Posts
    21
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by VIPStephan View Post
    Take deathshadow’s advice with a grain of salt, he’s an even bigger misanthrope than I am.

    Anyway, I’d say the order of tasks can’t always be followed as strictly as deathshadow imagines. But I get where he is coming from; what he means is that at first you think about the content, not about the size of images or the position of buttons. Imagine creating a text document with the content: you have your headings, your paragraphs, your lists, and perhaps your images if they are relevant for understanding the content. The developer will mark all that up with the respective HTML, and after that content is all conceptualized you start styling things the way you want.

    But as I said, it’s not always that easy to do it in that order. Often, people already think about the layout while conceptualizing the content. Or, after conceptualizing the basic content (without any actual hard copy yet), a UI designer will create wireframes where they outline the general layout of the site, without a front-end dev even having written a single line of code yet. And the dev then uses these wireframes to create the structure of the documents. The “wrong” approach would be if a designer creates a layout without knowing what content goes into the website – a problem many prefabricated templates that you can buy from stock template sites are exhibiting.
    Thanks for that

    Yeh I used to buy pre-made themes.

    I guess I'm very old school in that I just want the content down the middle & the navs on the left, although these days I'm FORCED to put the nav on the top b/c EVERYONE does them at the top.

    I also HATE the whole scrolling thing where they put HUGE images in the middle of the page & then text on the left or right, & this goes on & on as I scroll down which I HATE long pages, & I'm confused as to what image goes with which text & why the image is even there.

    Or what's even WORSE now, a lot of sites make you scroll & scroll & the NEXT thing you know, you are on a TOTALLY different blog post & the ONLY way to know that is if you figured it out by the heating OR the URL.

    NUTS!!!

    I personally can't STAND the direction websites have gone in. <sigh> I'd take the slider any day of the week over that ****, but sliders are terrible for SEO.

    Yeh, I won't be spending money on a wireframe, but I do know what they are

    Thanks for your help
    Last edited by VIPStephan; Oct 30th, 2018 at 04:18 PM. Reason: removed content irrelevant to the current thread and moved it to a new one

  15. #14
    Senior Coder deathshadow's Avatar
    Join Date
    Feb 2016
    Location
    Keene, NH
    Posts
    3,190
    Thanks
    4
    Thanked 463 Times in 451 Posts
    Quote Originally Posted by ep2002 View Post
    Anyway, yeh I can't afford even CLOSE to half a year's income.
    Didn't mean to imply you could, it's just that it sounds like you're butting heads with a lot of the same woes of developers who talk the talk but can't walk the walk. There are a LOT of people both on the coding and art side who aren't qualified to DESIGN.

    Much of that stemming from ACTUAL design not being art unto itself, but engineering that incorporates art, paying attention to specifications, accessibility, ux, etc.

    I often liken it to the difference between Ralph McQuarrie and Chip Foose.

    McQuarrie is responsible for some of the most iconic images and designs in Sci-fi, but not a single one of his paintings is viable in the real world. He has no knowledge of materials, load bearing, structure, or even euclidean physics meaning nothing he's drawn is viable to be built -- which is why the spacecraft and robots he drew for star wars only vaguely resemble the studio models. McQuarrie is an artist, not a designer.

    Chip Foose knows about suspensions, chassis, transmissions, engines, legal requirements, etc, etc which is why he can grab some alcohol markers, belt out a picture of the most awesome car you've ever seen in five to ten minutes, then walk into the garage and build it -- and it'll go down the road straight. He's is a designer.

    But even when he's designing, he's usually starting out with a base chassis, even if it's just a bare frame.

    That's where:

    Quote Originally Posted by ep2002 View Post
    I just DON'T get how a website coder is supposed to start coding BEFORE there's even a layout to start with, let alone knowing the size of images, where buttons are going to go, etc.
    ... comes into play. You have been duped into thinking that websites -- particularly their HTML -- is all about what it looks like. It isn't. NOT BY A LONG SHOT!

    Websites are for MORE than just the perfectly sighted user sitting in front of a screen, they're for EVERYBODY. (or at least supposed to be). That's kit and kaboodle what that semantic HTML is FOR!

    When Tim Berners-Lee created HTML he was trying to address the problem of multiple document formats for different computers of wildly different capabilities -- from teletype to dot matrix print, from the 20x22 VIC=20 screen Linus Torvalds was on at the time to the 1152x864 monochrome graphics screen of the NeXT workstation he was using -- in an environment (science/education/research) where everyone needed to share said documents. Nothing at all like today where everyone is on the exact same size display running the exact same resolution. oh...

    The core concept of HTML was to say what things WOULD BE in a professionally written document. This text is a paragraph, this text is a heading, these headings break up the page into sections and subsections which is why they have depth numbers, this 'rule' is a semantic heading-level break, this text WOULD BE bold (such as a entity/party in a legal document) or italic (book titles for example) for grammatical reasons when not being CITEd or receiving EMphasis, etc, etc.... and NOT "this text SHOULD BE" whatever presentation it is.

    We got away from that in the halfwitted idiotic DISASTER that was HTML 3.2 and the browser proprietary crap that wormed its way into HTML 4 tranny, but that's what CSS and HTML 4 Strict were trying to drag us back towards. Hence all those tags and attributes that were deprecated or rejected in HTML 4 Strict way back in '98. Sadly around 80% of the people crapping out websites out there have their heads wedged up 1997's backside in this regard.

    Thus actual design needs to start there, so that you have that grammatical logical document structure. It's why NOTHING in the HTML should be saying what things look like... and any good developer will extend that concept to their ID's and classes as well. Saying what things ARE. This is why all the HTML/CSS frameworks are ignorant incompetent bloated BS used by people who have NO business making websites!

    Since people on screen readers (software that reads the page aloud), braille readers, and other non-visual delivery methods could give a flying purple fish about your screen media layout. That's why anyone omitting the media="" attribute on their LINK tags or setting media="all" likely doesn't know enough HTML to be flapping their yap on the bloody topic!

    That's the point semantic markup, and that lack of semantics you mentioned with an existing site? Typically a DIRECT result of the derping around with a PSD as the starting point. It's an utterly back-assward approach to ACTUAL DESIGN.

    queue broken record:

    1) Start out with the content or a reasonable facsimile of future content, and organize it in a flat text editor so it makes sense as if HTML doesn't even EXIST. For CONTENT images (the ones that matter) simply refer to them by filename and alt text. Presentational images (style) have ZERO business in the markup.

    2) Mark up that text semantically saying what things are, using headings and rules to say what things ARE grammatically/syntactically to create your navigable document structure. Since this is the semantics stage neutral tags without meaning (DIV, SPAN) have ZERO business in the code at this point.

    3) Create the desktop layout using CSS, adding DIV and span as needed. Many say to start with mobile first, that's nonsense since we can target any mobile we care about with media queries to make it responsive. The one we can't target for customization is legacy desktop, which is why you start there then alter it down to fit! The layout should be semi-fluid, elastic, and responsive. Three things a static picture slopped together in Photoshop cannot be.

    Which is just PART of why Photoshop is NOT a design tool no matter how many ignorant twaddles have deluded themselves into thinking it is.

    4) Narrow the layout, figure out where it breaks, create a media query to adjust the layout so it fits. Such queries should be done in EM so that it too is elastic. Pixels are a broken/nonsensical measurement in most cases and really should only be used to handle the behavior of content raster images. Lather, rinse, repeat.

    5) THEN make it pretty with style, colours, and presentational images. SOMETIMES it's ok to reverse steps 4 and 5, depends on what you're doing with images, and what you shouldn't be doing with images which is why a competent developer will repeatedly tell the artist to keep it in their pants.

    Hence the term 'paint-over' which comes from graphic arts, and refers to artists who 'cheat' by taking an existing photograph and using it as their guide, sometimes even making a copy and "painting over it". In the case of ACTUAL design -- aka engineering -- that's not uncommon since things like the frame, engine placement, suspension, and so forth are designed by engineers LONG before some artist is allowed to spank it on canvas to make the body panels.

    ... and why when the artist starts out first resulting in "concept cars" not a blasted thing about them EVER reaches the production floor! Aka the difference between what's put under glass on a giant rotating platform at the Paris Auto Show and what rolls off Horacio Pagani's assembly lines.

    Starting out with the content and semantics gives you the sold foundation on which to build the website. Starting out with some goofy picture gives you NOTHING but some goofy picture with zero semantics, little if any logical document structure, and typically tons of pointless bandwidth wasting graphics that add NOTHING of value to the site and more often than not detract from the user experience.

    This is more true as CSS3 has resulted in being able to make very attractive websites without images. Linear gradients, shadows, corner-rounding, even some texturing if you get really creative can be done without even touching a paint program. Even MORE true as template images go from being raster based to vector based, particularly when you can stuff vector graphics into more efficient file formats such as webfonts. Hence font-awesome taking a LOT of the things people used to do with images and reducing it to single fully scaleable font characters.

    When it comes to templates the web is moving away from raster images on any serious website for most things, relegating the tool who's only job is to push pixels even more pointless and irrelevant.

    Without that solid foundation of semantic markup, the result is most always broken bloated inaccessible trash -- no matter how pretty it might be. That's why the sites that pull those types of graphical stunts typically end up stuck as "also ran" money-pits for companies who can soak the loss, falling into obscurity and out of business in under a year, or WORSE landing the company in question in court and with fines in certain industries. Like the ones I cater to. Medical, banking, public utilities, government agencies.

    Yes, there's such a thing as WORSE than going out of business.

    Content should dictate markup. Content + markup + device capabilites + user limitations should dictate layout... and that's why when people start with layout and graphics in some garbage PSD nonsense the result is most always a disaster of epic proportions.

    I'm not saying you can't make it pretty, but starting out with "hurr durrz eyes canz draw uh purty imuge" is utterly and totally back-assward, short-sighted, and the fast-track to failure.
    “There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies and the other way is to make it so complicated that there are no obvious deficiencies.” – C.A.R. Hoare, The 1980 ACM Turing Award Lecture
    http://www.cutcodedown.com

  16. #15
    Senior Coder deathshadow's Avatar
    Join Date
    Feb 2016
    Location
    Keene, NH
    Posts
    3,190
    Thanks
    4
    Thanked 463 Times in 451 Posts
    Quote Originally Posted by ep2002 View Post
    I guess I'm very old school in that I just want the content down the middle & the navs on the left, although these days I'm FORCED to put the nav on the top b/c EVERYONE does them at the top.
    That layout is still viable, tell anyone who doesn't like to to sod off -- besides part of responsive layout would/should be re-arranging itself to fit the screen -- so just do that for large-screens and put it at the top for smaller displays. That's where logical document structure and starting with the markup and progressively enhancing it shines.

    Quote Originally Posted by ep2002 View Post
    Or what's even WORSE now, a lot of sites make you scroll & scroll & the NEXT thing you know, you are on a TOTALLY different blog post & the ONLY way to know that is if you figured it out by the heating OR the URL.
    Yup, that's bad UX and I see a lot of sites wetting their own beds with that.
    Last edited by VIPStephan; Oct 30th, 2018 at 06:08 PM. Reason: split off irrelevant content to https://www.codingforums.com/forum-feedback-and-announcements/393765-annoying-video-ad.html
    “There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies and the other way is to make it so complicated that there are no obvious deficiencies.” – C.A.R. Hoare, The 1980 ACM Turing Award Lecture
    http://www.cutcodedown.com


 

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •