5 ms·

Every university visual communications program (graphic design) teaches grids ... for a reason. * http://departments.risd.edu/registrar/web/1112cat.pdf (a

Every university visual communications program (graphic design) teaches grids ... for a reason. * http://departments.risd.edu/registrar/web/1112cat.pdf (a number of classes focus on grid systems. this is one of the most respected design programs in the country) * http://graphicdesigntheory.net/Images/DT/Armstrong_GDTsyllabus.pdf * http://pacificgraphicdesign.wordpress.com/courses/graphic-design-ii-2/graphic-design-ii-syllabus/

papsosouid 14y ago
See my response above. We are talking about web design, not graphic design.
- jiggy2011 14y ago
  Why is web design so different here? We are still talking about content that is consumed with your eyes.
  - papsosouid 14y ago
    That is precisely how it is different. We're not talking about content that is just consumed with our eyes. It is consumed by computer programs also. And we need to convey information in a way that those programs can understand. Hiding semantic meaning in classes is bad, as is pushing presentation information into markup. A screen reader has no way to understand that a div with a class of "errormsg" is anything at all. It is just a generic meaningless item. A screen reader can understand that a paragraph tag with a role of "alert" has a specific defined meaning, this is text content indicating an error or warning message. Just as a div with a class of "navbar-fixed-top" is completely meaningless, and a nav tag conveys the specific meaning of "this is a container holding navigation items".
    - jiggy2011 14y ago
      I'm not sure how using a grid system or something like bootstrap is "pushing presentation into markup". Regardless of whether you use bootstrap or not you are always going to be specifying CSS classes which describe the presentation of elements, not sure how else it can be done? Screen reader software will generally ignore anything that it doesn't understand or deem irrelevant. Whenever I have tried screen readers they will say "ok, there's 3 divs with content here. Let's read them out one at a time or just read the headings and wait for the user to select one". How they are arranged in a grid will be irrelevant to the software. Does bootstrap present some particular problem for screen readers? You are yet to explain what you think best practices should be here.
      - papsosouid 14y ago
        >Regardless of whether you use bootstrap or not you are always going to be specifying CSS classes which describe the presentation of elements, not sure how else it can be done? http://coding.smashingmagazine.com/2012/06/19/classes-where-were-going-we-dont-need-classes/ http://coding.smashingmagazine.com/2012/06/19/classes-where-... >Screen reader software will generally ignore anything that it doesn't understand or deem irrelevant. Yes, that's the problem. Putting useful information in places where software has no way to understand it. >Whenever I have tried screen readers they will say "ok, there's 3 divs with content here. Let's read them out one at a time or just read the headings and wait for the user to select one". And if you had the appropriate tag instead of a meaningless div, it would know what to do. That's the point. Google for semantic html.
        jiggy2011 14y ago
        > Yes, that's the problem. Putting useful information in places where software has no way to understand it. You aren't putting "useful information" in the classes, you are putting presentation related information in there, if you are displaying the content non-visually it is irrelevant and can be safely ignored. Writing semantic HTML is nice for bots and browsers, but there is nothing stopping you from doing this whilst using bootstrap or whatever. Another thing to consider is that bootstrap aims for backwards compatibility so you are going to be restricted by tags that can be supported by old versions of IE etc. Even if you could write perfect semantic HTML I don't see how that would make it bad practice to organise your pages using grids?
        papsosouid 14y ago
        >You aren't putting "useful information" in the classes, you are putting presentation related information in there, if you are displaying the content non-visually it is irrelevant and can be safely ignored. "This is navigation" is not just presentation, it is real, meaningful information. >Writing semantic HTML is nice for bots and browsers, but there is nothing stopping you from doing this whilst using bootstrap or whatever The contortions it would take to make bootstrap work with proper markup would consume far more time than simply writing correct CSS to begin with.

papsosouid 14y ago

See my response above. We are talking about web design, not graphic design.

jiggy2011 14y ago
Why is web design so different here? We are still talking about content that is consumed with your eyes.
- papsosouid 14y ago
  That is precisely how it is different. We're not talking about content that is just consumed with our eyes. It is consumed by computer programs also. And we need to convey information in a way that those programs can understand. Hiding semantic meaning in classes is bad, as is pushing presentation information into markup. A screen reader has no way to understand that a div with a class of "errormsg" is anything at all. It is just a generic meaningless item. A screen reader can understand that a paragraph tag with a role of "alert" has a specific defined meaning, this is text content indicating an error or warning message. Just as a div with a class of "navbar-fixed-top" is completely meaningless, and a nav tag conveys the specific meaning of "this is a container holding navigation items".
  - jiggy2011 14y ago
    I'm not sure how using a grid system or something like bootstrap is "pushing presentation into markup". Regardless of whether you use bootstrap or not you are always going to be specifying CSS classes which describe the presentation of elements, not sure how else it can be done? Screen reader software will generally ignore anything that it doesn't understand or deem irrelevant. Whenever I have tried screen readers they will say "ok, there's 3 divs with content here. Let's read them out one at a time or just read the headings and wait for the user to select one". How they are arranged in a grid will be irrelevant to the software. Does bootstrap present some particular problem for screen readers? You are yet to explain what you think best practices should be here.
    - papsosouid 14y ago
      >Regardless of whether you use bootstrap or not you are always going to be specifying CSS classes which describe the presentation of elements, not sure how else it can be done? http://coding.smashingmagazine.com/2012/06/19/classes-where-were-going-we-dont-need-classes/ http://coding.smashingmagazine.com/2012/06/19/classes-where-... >Screen reader software will generally ignore anything that it doesn't understand or deem irrelevant. Yes, that's the problem. Putting useful information in places where software has no way to understand it. >Whenever I have tried screen readers they will say "ok, there's 3 divs with content here. Let's read them out one at a time or just read the headings and wait for the user to select one". And if you had the appropriate tag instead of a meaningless div, it would know what to do. That's the point. Google for semantic html.
      - jiggy2011 14y ago
        > Yes, that's the problem. Putting useful information in places where software has no way to understand it. You aren't putting "useful information" in the classes, you are putting presentation related information in there, if you are displaying the content non-visually it is irrelevant and can be safely ignored. Writing semantic HTML is nice for bots and browsers, but there is nothing stopping you from doing this whilst using bootstrap or whatever. Another thing to consider is that bootstrap aims for backwards compatibility so you are going to be restricted by tags that can be supported by old versions of IE etc. Even if you could write perfect semantic HTML I don't see how that would make it bad practice to organise your pages using grids?
        papsosouid 14y ago
        >You aren't putting "useful information" in the classes, you are putting presentation related information in there, if you are displaying the content non-visually it is irrelevant and can be safely ignored. "This is navigation" is not just presentation, it is real, meaningful information. >Writing semantic HTML is nice for bots and browsers, but there is nothing stopping you from doing this whilst using bootstrap or whatever The contortions it would take to make bootstrap work with proper markup would consume far more time than simply writing correct CSS to begin with.