www.webdeveloper.com
Results 1 to 9 of 9

Thread: on screen size, resolution etc

  1. #1
    Join Date
    Jun 2014
    Posts
    10

    on screen size, resolution etc

    Hi,
    I am a c++ dev new to web. How do a design page content for all screen sizes, resolution, window sizes.
    I am using createjs and I am developing a gamified content. I am specifying the object layout and sizes as a perecent of the visible window.

    But not clear if this is enough and not clear what the visible window is in all environments.

    Can you suggest?
    Is there a standard document, book or tutorial that discusses this.
    Thanks

  2. #2
    My first advice would be to pitch that createjs nonsense in the trash. All it will do is teach you how not to build a website; at least if you care about visitors actually using your content. Just your using the term "object layout" raises warning signs... though that could just be your mis-using the terminology since you just said you're new to web development.

    Coming from C++, you're going to have a leg up on a lot of people when it comes to building a site, but one big thing you're going to NEED to do is avoid overusing programming languages like JS or even back-end like PHP, and get a firm grasp on HTML and CSS. "real" programmers scoff at HTML as not being a real 'programming language', but in many ways it can be much more difficult as there are clear rules as to what tags mean and how to build things... than many people ignore by using crappy tools to try and do the work for them, the end result being inaccessible wrecks.

    Generally speaking your layouts should be three things:

    1) Elastic -- This means that your fonts are dynamically sizing; which is to say declared in % or EM, not pixels!, and your element/container widths are also in EM. This means the fonts and layout will auto-expand based on the users preferences so those with visual impairments or really good high dpi displays aren't sent diving for the zoom.

    2) Semi-fluid -- A fluid layout is one that auto-expands and contracts to fit the screen width. This is easy to do as the default behavior of all block-level containers is to auto-expand to fit their parent element; and why it's a total laugh when people go around throwing widths on EVERYTHING. Semi-fluid means that you set a max-width on the layout, so it cannot expand past a certain point. This is done so as to make sure that really long lines of text aren't unwieldy and hard to follow.

    3) Responsive -- the new kid in accessibility, the other two listed here should be considered stepping stones to this one. What it means is using something called "media queries" to strip off columns or add columns or otherwise make changes to the layout so as to best fit the available screen space.

    "good practice" if you are going to have multiple columns is to make the side columns a 'elastic fixed' width, and leave the center/main/content column fluid to fill the remaining space. Declaring column widths in percentages more often than not just results in broken columns at smaller AND larger sizes.

    Some things you should avoid:

    1) Fixed widths -- inaccessible rubbish that will be broken for someone, somewhere at sometime.

    2) Declaring fonts in pixels -- inaccessible rubbish that leaves many users diving for the zoom. There are a handful of legitimate usage cases like behind a complex image-replacement, but otherwise, just say no.

    3) Fixed heights -- as your content should be elastic and the containers dynamically sizing, fixing the height of elements is just begging for something to break. You'll see this folley all the time,

    *** abusive comment deleted by moderator ***

    As to what widths to use as a max-width, side column widths, or as your media query breakpoints - that should be dictated to you by the content, NOT the design. Designing before you have content is putting the cart before the horse...

    *** abusive comment deleted by moderator ***

    There's a reason the method I advocate for creating a site template is thus:

    1) CONTENT FIRST -- Take your content or a reasonable facsimile of future content, and place it into a logical order in a flat text editor as if HTML, CSS, JS, PHP or any of the rest of the web technologies never even existed.

    2) Mark up that content semantically -- which is to say that you should add HTML tags to say what things ARE, not what they look like!. If you are choosing your HTML tags based on what things look like, you're choosing the wrong tags for all the wrong reasons. To that end the semantically neutral tags <DIV> and <SPAN> have no business in the markup until the next step.

    3) Create a non-media query layout with CSS -- a lot of people will tell you to start with a mobile layout, but that just short-changes everyone. The lowest common denominator IMHO is IE8/earlier users where they don't have media queries, so that's what I make first -- a desktop layout for non-modern browsers. This is what old browsers will fall back on. This is the point at which you can add DIV and SPAN as needed to apply styling or group elements -- but only do so once you've expended all you can reliably do with your semantic tags from the last step.

    4) Add your media query layouts -- you may need to add more DIV and SPAN at this point as targets for changing the layout, but on the whole it should be a simple matter of stripping off floats, and adjusting margins/paddings and widths for smaller displays, and possibly adding more floats for larger ones if desired.

    5) Make it pretty -- this is the point at which I would add fancy colors, backgrounds, etc -- designing them to fit the layout NOT the other way around. Content dictates markup, content and markup dictate layout, layout dictates presentational affectations like background images... if any --

    *** abusive comment deleted by moderator ***

    6) further enhance with JavaScript if desired, keeping in mind the unwritten rule: "If you can't make a fully functional page without JavaScript FIRST, you likely have no business adding scripting to it!"

    The above process is called progressive enhancement, and it means that anything you build will "gracefully degrade" should any of the fancy bits along the way be missing/unavailable, ignored or even outright blocked -- be it JS, CSS or even the markup. The first two steps in particular are the most important part since that's what non-visual user-agents will get -- like screen readers, braille readers, and even more importantly SEARCH ENGINES.

    To accomplish the above you're going to need a firm grasp of HTML and CSS. The latter is the hard part, but a good place to start would be to find a good HTML reference and just read it beginning to end. I suggest this one:

    http://htmlhelp.com/reference/html40/

    It's older, but complete and one of the few to explain the HTML 4 specification in plain english. I suggest you concentrate on HTML 4 STRICT (or XHTML 1.0 STRICT) for now, as HTML 5 offers nothing of legitimate value and in many ways seems carefully crafted to set coding practices back a decade and a half.

    Read that refernece beginning to end, and pay particular attention to the "contains" and "contained in" parts as those rules are VERY important for cross-browser consistency. (even if the HTML 5-tards are trying to throw them out the window).

    ... and do yourself a huge favor and stay away from the nube predating halfwit nonsense like bootstrap, blueprint, YUI, grids, jQuery, and anything else that labels itself a "framework". They are at best a crutch for the inept, at worst fat bloated slow train wrecks that in many cases defeat the entire reason HTML and CSS even exist. Same goes for most of the 'preprocessors' like LESS and SASS -- pathetic tools for people who never learned to use CSS properly. Likewise avoid IDE's, WYSIWYGS, and all the other pathetically useless development environments as they will typically teach you more about how NOT to build a website than actually provide anything of value.

    There are only a few tools you really should have for building a site template (or even coding an entire site right down to a CMS system)

    1) Flat text editor --There are plenty of perfectly good text editors out there. I like Flo's Notepad 2, but editPlus, notepad++, sublime, text-wrangler, gEdit -- there's an endless number of them and every last one of them is free. You need anything more than that, you're probably doing something wrong... see idiotic bloated overpriced nonsense like Dreamweaver. As a dearly departed friend used to say "the only thing you can learn from Dreamweaver is how not to build a website".

    2) Browsers; all of them! -- Browsers are free, they all behave a little differently, so get them ALL. This means you will probably need a Windows environment, possibly multiple versions to test as many versions of IE as possible. Likewise you will probably want an OSX setup since you need to test Safari, and Firefox behaves differently on OSX than it does on Win/Lin.

    Virtualization software like VMWare or VirtualBox (I prefer the latter) can help greatly with this since it lets you run other OS in a window. I consider it a must-have on my testing machines -- case in point on this workstation right now I'm running OSX ML (to test safari and FF), Win98 (to test IE 5.5 and 6), WinXP (win 7 and 8 'native') and Arch (since linux has different fonts available to it) under a Win7 host.

    3) Testing Server -- If you are running linux you could just set up Apache, Mysql and PHP and set yourself off running. Likewise you could configure something similar native on OSX, but if you're on Windows you could either set up a proper LAMP server in a virtualization, or run a pre-configured testing server like WAMP or XAMPP (I prefer the latter). If you're really not into digging around grabbing packages and playing with makefiles and so forth, XAMPP and it's ilk can be a real godsend.

    Alright, I'll clam up for a bit -- hope this helps. Any questions fire away.
    Last edited by jedaisoul; 07-12-2014 at 05:35 AM.

  3. #3
    Join Date
    Mar 2012
    Posts
    1,753
    There is much wisdom in what DS says, even if it is time he grew up and stopped bad-mouthing people who disagree with his development philosophy. However, there are some counter-points I'd like to make...

    1. Web sites are increasingly graphical, to the point where graphics can be the message, not text. Also aesthetics play a more major role. So there is a place for design first/development second approach, even if the results are often/always(?) technically inferior. One might equally argue that a development first/design second approach often/always(?) leads to an aestetically inferior result? So it is "horses-for-courses"...

    2. There are apparently good accessibility reasons to specify fonts etc. in EMs rather than PX's. However, since visual impairment affects pretty well everything diplayed on the screen, not just web pages, why do we need web-specific solutions to the issues? And in particular, why do we need text-specific solutions??? Why not just set the monitor to a lower resolution than its design maximum??? Also, the down-side to using EMs is that the default relationship is 0.0625em = 1px, which is mathematically unweildly, and misleadingly precise. So, although I, personaly, am changing my practice towards using EMs instead of PXs, the argument is far from clear cut.

    3. The "blank sheet of paper" approach that DS seems to advocate is not optimal. What I, and I suspect many other develpers, do is start from my own outline template which is inherently responsive, and has graceful degradation for IE8 built in. This avoids the waste of time and effort in re-inventing these standard features for every site! I then adjust the default values in the outline template to suit the specific content.

  4. #4
    Join Date
    Oct 2013
    Posts
    559
    Don't bother coding for IE7-.

    Don't bother with any Windows version less than XP. (XP was the OS of 5% of my users on one site for the first 6 months of 2014. That number will do nothing but go down.)

    Don't bother running Win98/Win98SE and IE5.x/6 in a VM. That's just gotta be a symptom of OCD. For that matter, if you're running IE5.5 get a copy of Netscape 4. "What's a 'Netscape', Daddy?" "Here son, sit on my knee and let me tell you the story of the 'browser war' we fought back in my day. I lost many good friends in that war. Good, good friends [tear on cheek]."

    Why should you not bother?

    I guarantee you that 99.999999999% (+ or - 0.009999999) of the hits you get from those browsers and OSs are either scraper/spam bots from Russia or the Ukraine, or they are script kiddies probing for a Wordpress vulnerability. I've actually banned IE6- from all my websites and haven't caught but maybe one real, live human using any of those browsers. That's since May 2012. Your stats may say that you have 2% of users using IE6 or IE5.x. Hell, you will probably even see a few hits from IE2! They're all junk -- every last one of them. The lowest version of IE you need to care about is IE8 and that version will be down to less than 5% of your IE visitors (the human ones anyway) and less than 1% of all visitors within less than a year if it hasn't gotten there by now. In fact, I'm seriously contemplating banning IE7/8 as a significant portion of the traffic from those browsers is now junk like from IE6-. The only thing that keeps me from doing it for the time being is a couple of users I personally know who still have no choice but to use IE8 at work. That situation will change very shortly.

    As deathshadow rightly points out, browsers are free! If you must use XP- get Firefox, or Chrome, or Opera, or Safari. Of course that's if you have a choice, as in some work situations that's not an option. But by and large you have the choice! Why do we continue to support stupid people?! I've chosen not to. Go ahead and visit my sites with XP or ME or 2000 or Win98. Just don't use IE6 or lower. Netscape 4 is acceptable

    20+% of my visitors use a mobile browser on iOS or Android. Lessee. Hmm. Code for <2% of junk hits or code for 20% of real human visitors... Hmm. Tough choice. Really, really tough choice...

    Here's a challenge for everyone:
    Write valid HTML4.01 STRICT or XHTML1.0 STRICT code for a search input box that brings up the "Search" key on an iOS keyboard.

    Another challenge:
    Do the same but bring up the numbers keyboard for a form input.

    Go ahead and post your code here. I double-dog dare you.

    Can't be done. The only way to do either is to use HTML5 form attributes.

    DS: "But but but HTML5 is a train wreck!" Not if you are targeting real users who, by the way, are using mobile browsers and OSs, not IE5.5 and Win98. DS: "But but but you can't!" Yes you can, and should. Really and seriously why do you care about IE5.5 when you will get 1000+% more REAL LIVE HUMAN users using iOS7 and the latest version of Android? Really? You want to make an iOS user go through 2-3 more clicks/taps on a site search just so a 1-in-100,000 theoretical IE5.5/Win98 user can use your site?? Or because HTML4.x/XHTML1.x is the latest W3C "recommendation" and therefore you can only use one of those DOCTYPEs and its associated tags and attributes?? You're willing to degrade the useability of your site for a mobile user because of a "recommendation" that's 10+ years out of date? Or do you "cherry-pick" the HTML5 tags and attributes that suit your needs and then ***** about the spec as a whole?

    Look, a website will never render the same browser to browser and OS to OS. If you write valid HTML and CSS (or your CMS outputs same, and whatever the flavor of HTML/CSS) the best you can hope for is that your site will be useable and will render close to what you want it to look like across browsers, OSs, and devices -- even if you allow IE6- . Yeah, it's not gonna look exactly the same in OSX/Safari as it does in Win7/IE11. Get over it and move on. You'll never get pixel perfect rendering across all browser/OS/device combinations without a lot of extra coding that has no ROI. Something deathshadow and I totally agree on is "elastic" and "fluid" design. I've been doing it for more than a dozen years.

    And lastly, in case you don't believe my figures/statistics I have the server log files to back up my claims about OS/browser/junk hits.

    /signed/
    an HTML5-tard (and I wear that label proudly)

  5. #5
    Gah, have to split this into two posts... 10k? REALLY? I usually spit out ten times that before breakfast.

    Quote Originally Posted by Kevin2 View Post
    Don't bother coding for IE7-
    In other words don't bother writing HTML or CSS properly, since graceful degradation should be part of using them as such?

    Quote Originally Posted by Kevin2 View Post
    Don't bother with any Windows version less than XP. (XP was the OS of 5% of my users on one site for the first 6 months of 2014. That number will do nothing but go down.)
    I only do so as getting 5.5 to sit side-by-side with 6+7+8 is a pain in the ass.

    Quote Originally Posted by Kevin2 View Post
    Don't bother running Win98/Win98SE and IE5.x/6 in a VM.
    Unless of course you are testing for Windows CE users, since IE6 didn't even hit mobile windows until four or five years ago. What, did you miss the 6 on 6 party? That's ok, so did everyone else.

    Thankfully Windows Mobile has dragged itself out of the dark ages since then. Still though, it's a hefty part of why it's still an "also ran"

    Quote Originally Posted by Kevin2 View Post
    I guarantee you that 99.999999999% (+ or - 0.009999999) of the hits you get from those browsers and OSs are either scraper/spam bots from Russia or the Ukraine, or they are script kiddies probing for a Wordpress vulnerability.
    Or two thirds of my neighbors still running early P4's and P3's since I don't exactly live in the most affluent of towns; most of whom look at you when you have eight heads when you say "browser" as they just "click on the big blue E".

    But then I live in an area where just 100 miles north 33.6 dialup is a good day, and my alleged new and shiny 45mpbs down / 5mpbs up has an average ping time outside New Hampshire of 700ms. IF you're lucky enough to live in the city or the 'burbs you have no clue what I'm talking about. Visit Coos county some time -- or western Maine, or the Dakota's...

    Quote Originally Posted by Kevin2 View Post
    I've actually banned IE6- from all my websites
    Wow, so being a total jackass to visitors? Whatever happened to "this is the Internet, the only thing you know for sure about who will visit is we don't know who will visit!" -- you'd think after M$ pulled that stunt to Opera users people would have learned the lesson -- borked-dee borked-dee bork bork bork.

    Ever consider that your stats are low BECAUSE your site doesn't work for those people?

    Though mostly I get a laugh from the people who act like it's "hard" to support legacy browsers when it's so ridiculously simple and really should take no extra time. They don't get the fancy bells and whistles like rounded corners, box-shadows, text-shadows and goofy animations, who gives a flying ****... That's no reason for your CONTENT to not work without any stupid scripted shiv, shims, polyfills, or whatever they feel like calling them this week.

    Quote Originally Posted by Kevin2 View Post
    As deathshadow rightly points out, browsers are free! If you must use XP- get Firefox, or Chrome, or Opera, or Safari. Of course that's if you have a choice, as in some work situations that's not an option.
    Like every single AT&T help center that's locked down on IE6... like the ridiculous number of businesses that have in-house crapplets that only work in IE 5 or 6 and so don't let their employees use anything else.

    Yes, let's say to hell with those users :/

    Quote Originally Posted by Kevin2 View Post
    Write valid HTML4.01 STRICT or XHTML1.0 STRICT code for a search input box that brings up the "Search" key on an iOS keyboard.
    There's a search key? Not really an Apple kind of guy. Out of curiosity what "HTML 5 attribute" does that? Are you referring to LIST which relies on DATALIST which in most cases ends up slow loading code bloat on mobile. (mostly just due to people making the damned lists too long -- though that same problem is common with how some people use SELECT) and is still usually useless without scripting assistance, at which point just script it?

    Quote Originally Posted by Kevin2 View Post
    Do the same but bring up the numbers keyboard for a form input.
    I'd also be curious to know what does that... not that I'm familiar enough with "you don't actually own the hardware you're just renting it" and "kooality with a kapital K" Apple stuff to know what a "numbers keyboard" is.

    Of course, if your forms are complex enough and unclear enough to need dicking around with things like that, there's something wrong with your forms -- and your server side validation. Of course as I keep saying, if people would stop wasting 50 to 100k of markup and half a hundred k of scripting to do 10k of markup's job, bothered using proper form elements like LABELS instead of scripttardery and the idiotic "placeholder", things like page-loads and relying on server-side validation would probably be a non-issue.

    But apparently using what we already had was "too hard" -- so let's throw even more stuff in there to make it even more complicated and easier to abuse. That'll solve everything... :/

    Quote Originally Posted by Kevin2 View Post
    DS: "But but but HTML5 is a train wreck!" Not if you are targeting real users who, by the way, are using mobile browsers and OSs, not IE5.5 and Win98.
    ... and 99% of the stuff that's useful on mobile isn't HTML. In fact a LOT of the html 5 crap has no real world impact since things like NAV still aren't obeyed, just like what existed before NAV -- heading navigation -- only existed in "REAL" Opera. NOT that most people sleazing the NAV tag have any clue what it's for any more than they do numbered headings... part of why my biggest problem with HTML 5 is "throwing more markup at it isn't the answer"

    Quote Originally Posted by Kevin2 View Post
    Or because HTML4.x/XHTML1.x is the latest W3C "recommendation" and therefore you can only use one of those DOCTYPEs and its associated tags and attributes??
    Yes, god forbid you use the recommendation instead of a draft that's in flux... what happened the last time we used a draft of a specification on deployment websites because a browser (and quite literally just one browser) supported it? Oh yeah, that's right, the IE5 "broken box model", the introduction of "Quirks vs. standards" when the final version of the spec dropped, and a decade of fighting browser incompatibilities.

    Yes, let's all line up for that again...

    ... to be continued

  6. #6
    ... continued -- and that minute between posts thing is also annoying as hell.

    Quote Originally Posted by Kevin2 View Post
    You're willing to degrade the useability of your site for a mobile user because of a "recommendation" that's 10+ years out of date?
    I don't see why you can't have it both ways, the handful of goofy things that only effect forms you mentioned don't outweigh using HTML for what it's for, building progressive enhancement with graceful degradation -- and even IF you want those, you can toss them on last minute same as slapping the doctype on -- since older browsers will just ignore them... giving you a best of both worlds scenario.

    Quote Originally Posted by Kevin2 View Post
    Or do you "cherry-pick" the HTML5 tags and attributes that suit your needs and then ***** about the spec as a whole?
    Why not, when the spec is crap that seems to undo the progress of STRICT and the past fifteen years of improvements? The handful of useful bits like MANIFEST, Form attributes (debatable) and... Well there's... uhm... well... there's MANIFEST, and the new form attributes -- and that's literally the ONLY stuff I'll admit seems to serve any purpose -- are outweighed by idiotic code bloat.

    Like SECTION, NAV and ARTICLE being redundant to numbered headings and HR? Redundant semantics is as bad as none. Like ASIDE either being so restricted in semantic meaning (a literary aside) that it ends up as useless as ADDRESS -- or ends up abused into being little more than a glorified CENTER tag? Like tags that serve no purpose other than as scripting hooks, in which case why do they even HAVE tags? (CANVAS, PROGRESS, etc).

    Like HGROUP just showing the "working group" who came up with the spec not even understanding what numbered headings are? Thankfully this one was stricken from HTML 5 for that very reason -- good riddance.

    Like AUDIO and VIDEO being redundant to OBJECT? Oh and what happened to IMG allegedly being replaced by OBJECT in the next HTML so we weren't locked into browser maker preferences and support for file formats? You know, fighting vendor lock-in and letting the market decide? You'd think freetards with their panties in a wad because nobody gives a flying purple fish about OGG and Apple's sour grapes over losing the media format wars resulted in them shoving their codec/containers down our throats in the name of fighting "vendor lock-in" -- RIGHT, tell me another one Josephine.

    I'm not a big fan of Adobe, but really the rah-rah fight the power rage against Flash (when in my experience HTML 5 video is a million times LESS reliable at media delivery) just leaves me scratching my head. The only reason I'd use VIDEO is if I really have to support the people dumb enough to throw their money away on apple products -- and then I'd have a flash OBJECT able to play MP4 around that VIDEO tag, VIDEO being the fallback.

    Or how about suddenly EMBED being valid, when it was NOT adopted into HTML 4 since it was redundant to OBJECT -- so not only does a tag formerly rejected for being redundant now magically appear,

    Quote Originally Posted by Kevin2 View Post
    Look, a website will never render the same browser to browser and OS to OS. If you write valid HTML and CSS (or your CMS outputs same, and whatever the flavor of HTML/CSS) the best you can hope for is that your site will be useable and will render close to what you want it to look like across browsers, OSs, and devices -- even if you allow IE6- .
    Which is the laugh, we're actually arguing in favor of the same thing, we just have a different outlook on how to go about it. :P

    Quote Originally Posted by Kevin2 View Post
    an HTML5-tard (and I wear that label proudly)
    Sad... I'll admit it has maybe five or six neat things, and two or three things being shoved down our throats by the likes of Apple and it's "oooh shiny" more money than brains users... but I would only use it under duress (like dealing with Apple telling the people dumb enough to throw money away on their overpriced garbage what they can and cannot do like some sort of religious fundie) thanks to the rest of the specification being nothing more than "the new transitional" -- encouraging decade and a half out of date coding practices and on the whole seemingly crafted for the people who until recently were still vomiting up HTML 3.2 and slapping 4 tranny on it. Now they wrap 5 lip-service around the same bloated, outdated, buggy broken practices and get to slap each-other on the back over how "modern" they are.

    Colour me unimpressed.

    I think we need another specification created -- one that keeps all the intent, reasoning and objectives of STRICT, without all the pointless garbage that is HTML 5. Incorporate the handful of good things while dragging it kicking and screaming back to why STRICT was created... as for the most part HTML 5 reeks of everything that was wrong with HTML 3.2 and the various vendor specific things that were never part of the HTML specification that were magically adopted into 4 tranny but called deprecated. Removal of redundancies, clarification of the semantic meanings of the various tags, simplification of page creation and written from the point of view of telling people how to make websites instead of the point of view of how to make browsers.

    Which I'm still not sure how you deprecate something that was never part of the specification in the first place.

    But at that point, why not just design in strict so you have MEANINGFUL validation, ignore the one to two errors from the handful of 5 you end up using, then swap the doctype on deployment? Though really, the HTML 5 stuff that would end up useful on a page is unlikely to be anywhere BUT in the content (well, other than manifest) -- so at the template design stage you'd be fine with XHMTL 1.0 or HTML 4.01 since the 5 stuff likely wouldn't even show up at that point.

    Hmm... HTML 5 STRICT? It's an idea.

    Though again, if people had taken the time to learn 4.01 STRICT and learned to use semantics properly, they'd find most of HTML 5 to be nothing more then redundant code bloat and the worst of 1997 style coding. It sucked in 1997, there's no reason to go running at it like lemmings now. People call it "the future" and all I can think is "sure thing Mr. Peabody". It's about as modern as putting a Zonda F body on a model T. All flash, no substance.
    Last edited by deathshadow; 07-13-2014 at 11:27 AM.

  7. #7
    Quote Originally Posted by jedaisoul View Post
    1. Web sites are increasingly graphical, to the point where graphics can be the message, not text.
    In which case if they are the message, they are CONTENT, so what I'm saying still applies. You put down a link in your plaintext to where the image is going to be, and of course it's ALT text for people who don't/won't/can't see it. After all, that's why validators kvetch at you should you omit ALT. (and should probably throw a wobbly if you do alt="" too!)

    Quote Originally Posted by jedaisoul View Post
    Also aesthetics play a more major role. So there is a place for design first/development second approach, even if the results are often/always(?) technically inferior. One might equally argue that a development first/design second approach often/always(?) leads to an aestetically inferior result? So it is "horses-for-courses"...
    There's no reason for a content first approach to be any more or less aesthetically pleasing, though again, it doesn't matter how pretty it is, if it's useless to visitors what good is it? "technically inferior" also usually means telling some user somewhere at sometime "Kiss off, we don't want you here".

    Which is increasingly what it seems most websites are telling me as a visitor.

    Also though, you have to look at the major success stories of the Internet -- Amazon, Google, E-Bay, FaceBook, Craigslist -- not exactly a visit to the Louvre.

    In most cases, the flashy over the top "Design" you find the "design first" approach vomiting up ends up more trying to sweep a lack of content of value under the rug, and forgetting that a design should NOT be made to stroke the designer's ego, or the site owner's every little whim, but the VISITORS to the site. Admittedly, that's the hardest part to convince anyone of no matter how much sense it makes.

    Quote Originally Posted by jedaisoul View Post
    2. There are apparently good accessibility reasons to specify fonts etc. in EMs rather than PX's. However, since visual impairment affects pretty well everything diplayed on the screen, not just web pages, why do we need web-specific solutions to the issues?
    Generally it's not a web specific solution, it SHOULD just be following what the OS does; that it isn't is more the fault of the browser makers and certain OS than it is the specifications.

    Quote Originally Posted by jedaisoul View Post
    And in particular, why do we need text-specific solutions???
    As typically text is the only thing it's an issue with? As resizing pixel based elements like backgrounds and content images can look like complete ass and really isn't necessary?

    Though if all browsers resized content like REAL Opera did we could rely on zoom, but zoom sucks; particularly now that Presto is leaving the scene leaving users with accessibility needs stuck with 12.17 and blindly fumbling about to find a modern replacement for it... Thank you ChoOpera for your pathetically useless crippleware. Though honestly, after almost a decade of using Opera as my primary browser, every other browser feels like a trip in the wayback machine to IE4 Mac so far as the UI is concerned!)

    Quote Originally Posted by jedaisoul View Post
    Why not just set the monitor to a lower resolution than its design maximum???
    You ever do that on a LCD? Looks like someone stuffed cottage cheese into transparent spandex.

    Also, higher dpi == less jaggies. Hence why we're seeing 2560x1440 on 5" phone displays and 4096k+ wide desktop displays? But sure, let's ignore the entire reason this technology even exists...

    Quote Originally Posted by jedaisoul View Post
    Also, the down-side to using EMs is that the default relationship is 0.0625em = 1px, which is mathematically unweildly, and misleadingly precise.
    ... and should NEVER enter your mind or be used in the first place as that relationship isn't static, and anyone trying to use it generally is thinking 'fixed layout'. On my machine for example 0.05em = 1px, on my TV 0.416666~em = 1px... The people who use that relationship in development don't know enough about what EM's are or how they work to be flapping their gums on the subject! ... and there's a LOT of that going around; typically everyone who calls themselves a "designer" -- designer now having as much of a negative connotation to me as "framework", "SEO Expert" or "*** deleted by moderator ***"

    Sorry if that seems a bit harsh and over the top, but as our blessed St. George of the Church of Joe Pesci said: "It depends on what the exaggeration is." -- and in many ways it's accurate, the majority of people using those terms to describe themselves are giving those terms a bad name. Much like the overuse of HTML 5 turning it into a sick buzzword referring to things that have nothing to do with writing markup (much akin to "Web 2.0" in that department), or resets like Eric Meyer's "reset reloaded" giving resets a bad name.

    Quote Originally Posted by jedaisoul View Post
    3. The "blank sheet of paper" approach that DS seems to advocate is not optimal. What I, and I suspect many other develpers, do is start from my own outline template which is inherently responsive, and has graceful degradation for IE8 built in. This avoids the waste of time and effort in re-inventing these standard features for every site!
    Which means either cookie-cutting your sites, or making more work for yourself when the content doesn't fit your off the shelf starting point.

    Really though, when a starting template for a site (using placeholder content for a homepage) shouldn't break more than 16k of markup and 16k of CSS, is it really such a big deal to belt out that much code?

    Though I realize, most people use 50k of markup and 100k of CSS spanning six files where I use the numbers above.

    My starting point for a page is pretty simple:
    Markup - http://www.cutcodedown.com/for_others/template.html
    CSS - http://www.cutcodedown.com/for_others/screen.css

    That's as close to a starting 'template' or 'framework' as I've ever gotten.... and really the template.html isn't added until my second step of development, if at all; usually it's actually a PHP include since most stuff in the header and footer are identical across designs.

    IMHO you need much more than that, you're probably doing it wrong.
    Last edited by jedaisoul; 07-13-2014 at 01:38 PM.

  8. #8
    Join Date
    Mar 2012
    Posts
    1,753
    DS

    I would suggest that the corporate and public service workstations locked down on IE6 have no business being used for non-work related web browsing. So, unless people are writing web sites for businesses with commercial links to corporates or public bodies, I do not see the relevance.

    And, whilst I think that you have a point over the retrograde aspects of HTML5, I suspect that you are talking to the wrong audience. Have you considered presenting your views to the W3C? That is, if there is still time?

  9. #9
    Quote Originally Posted by jedaisoul View Post
    And, whilst I think that you have a point over the retrograde aspects of HTML5, I suspect that you are talking to the wrong audience. Have you considered presenting your views to the W3C? That is, if there is still time?
    "Cannot run out of time. There is infinite time... You are finite, I am finite... This... is wrong tool. Very bad, never use."

    I gave up on that five or six years ago after a friend and I spent the better part of six months banging our heads against the wall; the unexpected departure from this earth of said friend (who was half my age at the time) really killed off my attempts to even try to deal with the W3C -- just as it put on hold a rather large website project that I'm slowly trying to resurrect by the end of next month after some four years of it sitting on the trash heap.

    Dan was a ... stabilizing influence for my more radical views. He started out as my apprentice, and very quickly became the master. I taught him minimalist coding and all the good practices I'd picked up in the two decades of programming I had done before most people even knew what the Internet was, he came back a year later and taught me semantics and separation of presentation from content.

    In any case, at this point dealing with the W3C is like dealing with Congress, unless you're a major corporation with boku bucks to pay your way (Apple, Microsoft, Google), or a lobbyist exuding charisma and complete lack of ethics so you can bold-faced lie people into following you (mozilla) -- you'll never even get in the door. I'm a little shocked Opera has had as much influence as they have managed all things considered...

    Of course since HTML 5 was accepted from the WhatWG, they seem to have this new policy of "If you're not a browser maker, GTFO"

    See why my buddy Aaron felt the need to swing from a rope. I've lost a half dozen friends in as many years this way. Most people don't seem to want the world to change for the better, and it makes it so the handful of people actually trying to make things better end up so depressed, they either shut the world out becoming hermits or end their existence in it! "Status Quo" for the win?

    ... and then people wonder why I'm hostile. Most of the people I knew who felt the way I do about these things has passed on either through self-neglect or suicide. Kinda sick of watching people half my age or less -- chock full of promise -- pass on before me while the sleazy scam artists and people lacking more than two brain cells to rub together plod on aimlessly.

    *** deleted by moderator ***
    Last edited by jedaisoul; 07-13-2014 at 02:04 PM.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles