SitePoint Sponsor

User Tag List

Page 2 of 3 FirstFirst 123 LastLast
Results 26 to 50 of 58
  1. #26
    SitePoint Mentor bronze trophy
    John_Betong's Avatar
    Join Date
    Aug 2005
    Location
    City of Angels
    Posts
    1,808
    Mentioned
    73 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by deathshadow60 View Post
    Oops.
    <!-- #content, #contentWrapper --></div></div>

    What I get for just belting it out raw on the laptop. Wasn't actually meant to be used as working code so much as an example of the theory....

    gimme a couple moments and I'll toss together a working example of that which is a bit more fleshed out.

    @deathshadow60,

    http://www.cutcodedown.com/codeExamp.../template.html

    Many thanks for the fleshed out working example. I have been looking quite some time for a new skin and yours seems ideal. I look forward to adding the content.

    On my localhost version I added some colours, still cannot fathom out what is happening and would be grateful for an explanation.

    www-cutcodedown-com-codeExamples-fluidDemo-template-html.jpg
    Last edited by John_Betong; Apr 8, 2012 at 09:10. Reason: spellin: not my fortay

  2. #27
    SitePoint Mentor silver trophybronze trophy

    Join Date
    Feb 2008
    Location
    Preston, Lancashire
    Posts
    1,377
    Mentioned
    72 Post(s)
    Tagged
    1 Thread(s)
    @itmitică;

    would it be possible to give the most basic example of responsive web design. I am more interested in something very basic to grasp it's concepts. The frameworks out there have javascript to them, so is this something we need?
    follow me on ayyelo, Easy WordPress; specializing in setting up themes!

  3. #28
    SitePoint Wizard bronze trophy Black Max's Avatar
    Join Date
    Apr 2007
    Posts
    4,029
    Mentioned
    12 Post(s)
    Tagged
    0 Thread(s)
    Rachel Andrew's doing something fun with responsive design that doesn't involve bloated stylesheets or grids. The code archive for her book contains some interesting samples in Chapter 9.

  4. #29
    Non-Member
    Join Date
    Feb 2012
    Posts
    892
    Mentioned
    10 Post(s)
    Tagged
    0 Thread(s)
    @Sega

    Javascript only use is to fix things otherwise impossible to fix by CSS. It's not something you'd rely on for the important stuff, it's more something like the last resort.


    A basic example.

    Let's start from a layout like you do now: main content as a column, nav floated left. In this case, you have a version with main content and nav side by side, that may look good on bigger screens, but on smaller screens you'll have an unreadable scalled down version of them side by side.

    When you add a media query like this to your old CSS:

    Code:
    @media screen and (max-width:480px)
    {
    	#nav
    	{
    		float: none;
    	}
    }
    on smaller screens you'll now have a different version for your layout, where the main content occupy the whole screen, it doesn't share it with the nav element. As such, the readability may increase.

    <hr>

    Now, for a different approach.

    You forget about making sites the old way.

    You start mobile first: less strain on the mobile devices and their smaller bandwidths: a basic layout.

    No JS slides for mobile. You cut down the number of graphic elements. An easier to use nav.


    The next steps: tablets through desktops. You start adding graphic elements, JS slides, start floating elements to add columns.

  5. #30
    SitePoint Member
    Join Date
    Mar 2012
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Now, for a different approach.

    You forget about making sites the old way.

    You start mobile first: less strain on the mobile devices and their smaller bandwidths: a basic layout.

    No JS slides for mobile. You cut down the number of graphic elements. An easier to use nav.

    The next steps: tablets through desktops. You start adding graphic elements, JS slides, start floating elements to add columns.
    I disagree with the "mobile first" approach.

    Instead of starting with mobile, and adding more things for bigger screens, why not design the site to be fast and light on every device? Why do we assume that mobile users want a super-fast, stripped-down version of the site, but desktop users want all kinds of extra bloated stuff?

    My desktop is an ancient Dell, dual-booting Windows XP and Ubuntu. My smart phone is more powerful in every way than my desktop, and the 4GLTE signal on my phone is faster than my home cable connection. Sliders, JQuery effects, and things like that work better on my phone! And I particularly don't like the idea that I am getting a lesser version of the site, and missing some content, when browsing on my phone.

    How about no sliders (or any other unnecessary JS/JQuery stuff) at all? (Unless you have clients that absolutely have to have them, like some of mine, heh.) Why not easier to use navigation menus on every device?

    There's no way to add extra stuff for bigger screens and not have the mobiles download it anyway, without using JS or server-side scripting. And then you run into a lot of other issues trying to do that. And having mobiles download stuff and not showing it is the worst of both worlds.

    Starting with mobile first also adds the problem of browsers that can't understand media queries - IE8 - getting the mobile version unless you use respond.js or something - more unnecessary JS, in my opinion.

    Every site I design is responsive. Instead of going "mobile first", I design every site for IE8 first, knowing that it will be visited on crappy connections, or with an ancient computer like mine. I only use media queries to change the layout - going from 2 or 3 columns to one, adjusting some font sizes, and changing the way the nav menu appears - without removing or adding any content (except for a few very small things). Then use TinySrc or another image swapping technique to send smaller image files to smaller screens, if I have to use large images.

    That's it. No grid systems, no unnecessary bloat.

  6. #31
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Conquer View Post
    Why do we assume that mobile users want a super-fast, stripped-down version of the site, but desktop users want all kinds of extra bloated stuff?
    BINGO!!! You go on to mention all the things that IMHO have no *** business on a website in the first place! Stupid scripted animated crap that turns websites into slow buggy broken disasters.

  7. #32
    Non-Member
    Join Date
    Feb 2012
    Posts
    892
    Mentioned
    10 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Conquer View Post
    I disagree with the "mobile first" approach.

    [...] Why do we assume that mobile users want a super-fast, stripped-down version of the site, but desktop users want all kinds of extra bloated stuff?
    I don't necessarily disagree, but I dislike the approach you take, with false arguments. Why do you automatically assume "extra bloated stuff"?

    Quote Originally Posted by Conquer View Post
    My desktop is an ancient Dell, dual-booting Windows XP and Ubuntu. My smart phone is more powerful in every way than my desktop, and the 4GLTE signal on my phone is faster than my home cable connection. Sliders, JQuery effects, and things like that work better on my phone! And I particularly don't like the idea that I am getting a lesser version of the site, and missing some content, when browsing on my phone.
    Your experience alone is not a standard which you'd force on your clients and users. That's a narrow view, counter productive approach.



    Quote Originally Posted by Conquer View Post
    How about no sliders (or any other unnecessary JS/JQuery stuff) at all? (Unless you have clients that absolutely have to have them, like some of mine, heh.) Why not easier to use navigation menus on every device?
    How about less "my way is the way"? If others want those things, it's their choice. Who are you to try and decide for everyone?

    Quote Originally Posted by Conquer View Post
    There's no way to add extra stuff for bigger screens and not have the mobiles download it anyway, without using JS or server-side scripting. And then you run into a lot of other issues trying to do that. And having mobiles download stuff and not showing it is the worst of both worlds.
    I tend to agree with you here.

    Quote Originally Posted by Conquer View Post
    Starting with mobile first also adds the problem of browsers that can't understand media queries - IE8 - getting the mobile version unless you use respond.js or something - more unnecessary JS, in my opinion.
    I tend to agree with you here as well.

    Quote Originally Posted by Conquer View Post
    Every site I design is responsive. Instead of going "mobile first", I design every site for IE8 first, knowing that it will be visited on crappy connections, or with an ancient computer like mine. I only use media queries to change the layout - going from 2 or 3 columns to one, adjusting some font sizes, and changing the way the nav menu appears - without removing or adding any content (except for a few very small things). Then use TinySrc or another image swapping technique to send smaller image files to smaller screens, if I have to use large images.

    That's it. No grid systems, no unnecessary bloat.
    It's a far fetch, you "knowing" so many "precise" things about your visitors as well as, again, the "unnecessary bloat" you don't even know what it may actually be, but you are quick to label it so. Completely far fetched.

    <hr>

    You have a system. If it were so good, everybody would be quick to adopt it. Instead, it's just a system amongst many others. It pays to know them all.

    A project may require an approach, another project a completely different approach. Knowing more than one system helps that.

    It doesn't make sense to automatically dismiss one system or the other. Or to slander by implying about things you don't even know what they may be.

  8. #33
    Non-Member
    Join Date
    Feb 2012
    Posts
    892
    Mentioned
    10 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by deathshadow60 View Post
    BINGO!!! You go on to mention all the things that IMHO have no *** business on a website in the first place! Stupid scripted animated crap that turns websites into slow buggy broken disasters.
    That's false generalisation for the sake of strong beligerant purposes. It's a narrow false view and without real proof and fundament.

    You don't like some stuff? I'm pretty sure some will look at your designs and believe they're so bad they won't even take them seriosly. And they may actually give you reasons you may not like. That's real world: everyone can make choices, it's not someone deciding they have the best solution that fits everyone.

  9. #34
    <title class="lol"> bronze trophy TehYoyo's Avatar
    Join Date
    Feb 2012
    Location
    Northeast Chicago Suburbs
    Posts
    806
    Mentioned
    18 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by itmitică View Post
    I don't necessarily disagree, but I dislike the approach you take, with false arguments. Why do you automatically assume "extra bloated stuff"?
    Most likely b/c he sees it all over the web...but wait...that's only him...obviously not trustable.
    Your experience alone is not a standard which you'd force on your clients and users. That's a narrow view, counter productive approach.
    Would you have him testify as to what you experience, instead? Or just not share his opinion at all? I'm sure he wants to apologize for adding to the conversation.

    How about less "my way is the way"? If others want those things, it's their choice. Who are you to try and decide for everyone?
    How ironic....
    <hr>
    Nice HTML4! Wait...what are you trying to do?

    Or to slander by implying about things you don't even know what they may be.
    If you could share how you slander about things that you don't even know about, I'd be very impressed and very interested to hear. Mind sharing?

    ~TehYoyo

  10. #35
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by deathshadow60 View Post
    BINGO!!! You go on to mention all the things that IMHO have no *** business on a website in the first place! Stupid scripted animated crap that turns websites into slow buggy broken disasters.
    Quote Originally Posted by itmitică View Post
    That's false generalisation for the sake of strong beligerant purposes. It's a narrow false view and without real proof and fundament.
    I have to agree with itmitca here. I'm not saying content should be cut out for mobile users, but most of the design details should be stripped out, ads, etc. Just give them navigation and content, perhaps a logo too just to identify it as your site.

    I know when I go to mobile sites, I hate navigating through everything on the real site. I do believe mobile should be stripped down a bit.
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  11. #36
    SitePoint Member
    Join Date
    Mar 2012
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by itmitică View Post
    I don't necessarily disagree, but I dislike the approach you take, with false arguments. Why do you automatically assume "extra bloated stuff"?
    Okay, first of all, I wasn't attacking your post personally, only challenging the idea that mobile users are somehow special and get light-weight, fast sites, while desktop users get all kinds of extras.

    Sliding image galleries, JQuery effects, animations, huge graphics... those kinds of things are extras. They aren't really needed. Yeah, they look nice sometimes, but a well-designed site can achieve its purpose (and look great!) without using them.

    No, I'm not saying never ever use them. Sometimes, used sparingly, they can enhance a site. But I have seen very few sites that use those things sparingly. Mostly, it seems to be "Let's just throw everything in here because it looks cool" or "It all came with the WordPress theme so we're gonna use it, and even the stuff we're not using on our site gets downloaded, too, but who cares? Yay."

    Your experience alone is not a standard which you'd force on your clients and users. That's a narrow view, counter productive approach.
    Only using my experience as an example that mobile users are not necessarily less limited with their devices than desktops and that mobile users don't necessarily want a lesser experience than desktop users.

    How about less "my way is the way"? If others want those things, it's their choice. Who are you to try and decide for everyone?
    I'm not. Designers who decide to strip content and features from sites for mobile users are the ones who making choices for their users.

    It's not a great idea to assume that mobile users have different needs than desktop users - that mobile users are "on the go" or are "in a hurry" and other such things I see tossed around to justify giving mobile users a stripped version of the site. People browse from their mobiles in all sorts of different situations. (And I know many people who have no home computer and their only internet access is with mobile phones or tablets, so what about them?)

    It's a far fetch, you "knowing" so many "precise" things about your visitors as well as, again, the "unnecessary bloat" you don't even know what it may actually be, but you are quick to label it so. Completely far fetched.
    If by saying I know users will be visiting the site on slow connections and crappy computers, I know a lot of "precise" things about my visitors, then yeah, I do "know" that, because it's a fact.


    Or to slander by implying about things you don't even know what they may be.
    Slander? What?

    My point is: You should design a site to be fast and lightweight for everybody, not just mobile users. And not remove content and features for some groups.

  12. #37
    SitePoint Member
    Join Date
    Mar 2012
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by RyanReese View Post
    I know when I go to mobile sites, I hate navigating through everything on the real site. I do believe mobile should be stripped down a bit.
    If it's a pain to navigate the "real site" on a mobile, I would say that is poor design of the site, then. I think that the full site should be as easy to use on a mobile as it is on a desktop, call me crazy. Yes, even the ads.

    If the "design details" can be stripped out and the site does what it should without them when viewed on a small screen, then maybe they don't really need to be there in the first place?

    Again, not saying don't use them, just use them wisely.

  13. #38
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by John_Betong View Post
    On my localhost version I added some colours, still cannot fathom out what is happening and would be grateful for an explanation.
    Well... lemme see if I can explain it piece by piece.

    The markup is pretty much your normal semantic markup for a website. Headings to start each subsections, horizonatal rules for semantic section breaks when a heading might not be appropriate (like before the footer) or for consistency of flow (between the menu and the content area). If you view the page with CSS off, you get a decent idea of what screen readers, search engines, and people on narrow bandwidth who disable ... everything... tend to see. That's why we have the concept of progressively enhancing a page; write the markup first with no real concern for what it's going to look like on screen, print, or any other specific target.

    The 'magic' of the markup are our presentational hooks. It should be noted that presentational hooks are NOT presentation -- it's why we have DIV and SPAN, to allow us to hook into the content without changing the meaning... that our content should already have.

    It's also why HTML 5's "section", "nav", "header" etc are a pointless waste of markup, and amount to applying meaning around things that already have meaning.

    div#pageWrapper as the outermost container is naturally used to control our widths across the entire page. It's SO much easier to use one element for that than to waste time declaring widths on every last little blasted thing. This is where a LOT of people screw up on their page designs and CSS.

    div#columnWrapper is there to contain our floats, and provide any extra style we might want. If you want to add something like faux-columns, this element would be where that would go.

    div#contentWrapper, div#content -- using a double wrapper lets us do a holy-grail type layout of having the most important thing -- the main content, be our fuild center column and keep it first in the source order -- without the headaches and hacks needed to implement it using just one DIV... oh noes, an extra DIV that's actually serving a purpose. (You'll see me railing against pointless DIV all the time -- this isn't one of them!)

    The outer div#contentWrapper is floated at 100% width, so it takes up the entire screen. The inner DIV gets margins to make room for the columns to be rendered over, and normal padding.

    div#firstSideBar and div#secondSideBar would be our two seperate columns for the three column layout -- but to treat them as a single column we have to wrap both of them in a third div.

    For the two column layout, our default which as discussed so far is the 'lowest common denominator' of desktop browsers that don't know media queries, simply applies a right margin to #content... then uses the classic holy grail trick of a negative margin on #sideBarWrapper to reduce it's width below 0px.

    #contentWrapper is 100% width and floated left -- so there's no pixels left for a float to go next to it. Using the negative margin to make #sideBarWrapper 0 width or narrower, floats it up OVER it. Poof, two columns.

    Our first media query for making the three column layout uses this:

    Code:
    <link
    	type="text/css"
    	rel="stylesheet"
    	href="bigScreen.css"
    	media="screen and (min-width:64em)"
    />
    Which means any screen device wider than 64em gets that stylesheet layered on top of the non-query one.

    Inside that stylesheet all I do to make the third column is put a margin on each side of #content to make a place for the sidebars to render, strip the style off the outer #sideBarWrapper and instead apply columns to the inner #firstSideBar and #secondSideBar.

    I set them both to the same width, and float them both the same way. For the second sidebar I just swap what side the margin is on, making it overlap to the right instead of the left, and then slide it back over -100%... basically the normal holy-grail type three column layout. IF you want them reversed with the first one on the left, just change the standalone #secondSideBar to #firstSidebar. You could even do this:

    Code:
    #content {
    	margin:0 38em 0 0;
    }
    
    #sideBarWrapper {
    	float:none;
    	width:auto;
    	margin:0;
    }
    
    #firstSideBar,
    #secondSideBar {
    	position:relative;
    	float:left;
    	width:18em;
    	margin-left:-19em;
    }
    
    #secondSideBar {
    	left:-19em;
    }
    It also increases the max-width. You have to remember I designed for queryless FIRST... if we can go to three columns using queries, we can go wider.

    For the small screen version, we just want to strip out the columns... so first, let's target small screens:

    Code:
    <link
    	type="text/css"
    	rel="stylesheet"
    	href="smallScreen.css"
    	media="screen and (max-width:640px)"
    />
    Anything 640px or narrower gets that stylesheet applied to it in additon to our queryless one. All I did here was decrease the min-width to that of the lowest end Opera mini devices. Anything smaller... really shouldn't be used for web browsing or is going to ignore all this anyways. I set the width to 100% so it goes edge to edge -- screen real-estate on small screens is precious, don't waste it on a background...

    Stripping off the columns is then easy. Get rid of all the margins, remove the floats on #sideBarWrapper. On a real layout you may have other styling you might also want to strip off it -- I would advise stripping background off of body, so the mobile browser isn't wasting time trying to render or load it. Excessive use of CSS3 properties can really hog memory and slow down rendering, so axing a number of those can also help.

    Testing is important on that; getting a real iPod/Pad/Phone AND a droid device is a good start -- though getting a Mac, building a Hackintosh, or tricking OSX into running under VirtualBox to use the iOS Simulator that comes with xCode lets you nab several Apple devices at once.

    I have a legal Hackintosh to that end -- cute loophole; you can only legally run OSX on Apple branded hardware. I gave my 'parts pile' Apple IIe Platinum (no psu, busted mainboard -- as opposed to my good one that still runs fine) a 'upgrade' by stuffing a Atom 330 motherboard and the USB keyboard from a dead G3 iMac into it... Though I'm thinking on using this dead G5 Tower a friend gave me with a i7 920 board for a more capable one.)

    Again why I consider this an example, NOT a framework to be perfectly copied. On top of the idiocy of frameworks in interpreted code on narrow pipes, they are often inflexible or require so much effort to learn well enough to modify with confidence, you'd be better off just working with scratch for each different type of page.

    It's all about the process of building up a page with progressive enhancement... Content should dictate layout, NOT the other way around. Make your non-css semantic page, use CSS to bend it to your will for non-media query screen and print, then use media queries to further refine screen by size. That way when/if some fancy bit of new technology is missing, it gracefully degrades.

    ... and again why drawing some goofy picture of a layout in Photoshop first tends to be little more than a disaster filled with 'not viable for web deployment' concepts.

  14. #39
    Mazel tov! bronze trophy kohoutek's Avatar
    Join Date
    Aug 2004
    Location
    Hamburg, Germany
    Posts
    4,248
    Mentioned
    30 Post(s)
    Tagged
    0 Thread(s)
    Please keep the discussion civil, no personal attacks.

    Danke.
    Maleika E. A. | Rockatee | Twitter | Dribbble



  15. #40
    SitePoint Zealot RyanKing1809's Avatar
    Join Date
    Oct 2011
    Location
    Melbourne, Australia
    Posts
    170
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey guys, have you seen this ems-based media-query layout. It allows you to flexibly keep optimal line length and layout ratios (the reason I would use fixed layout) as a function of the width of window measured in ems. There is a bug with webkit that doesn't execute media-queries on window resize.

    http://blog.cloudfour.com/the-ems-ha...a-queries-ftw/

    What's your thoughts?

  16. #41
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by RyanKing1809 View Post
    Hey guys, have you seen this ems-based media-query layout. It allows you to flexibly keep optimal line length and layout ratios (the reason I would use fixed layout) as a function of the width of window measured in ems. There is a bug with webkit that doesn't execute media-queries on window resize.

    http://blog.cloudfour.com/the-ems-ha...a-queries-ftw/

    What's your thoughts?
    Well, we have:
    100% = 1 em ~= 16px ~= 14pt
    Flawed methodology since it doesn't always apply, and somebody can't do their math as that's 12pt aka 6 lpi, NOT 14pt.
    http://battletech.hopto.org/html_tut.../template.html

    12pt, not 14... it goes downhill from there.

    HTML 5 rubbish, endless IE version sniffing, design elements like the 'three across equal height' subsection that reeks of the "but I can do it in photoshop" nonsense (exactly the type of thing I mean when I say "not viable for web deployment")... throw in the memory hogging webfonts and it's annoyingly slow to render on desktop; a disaster in the IOS emulator so I don't even want to think what it would be like on the real hardware. (iOS simulator is NOT timer accurate)

    Though yeah, webkit is an idiot about zoom; not too surprising given they're new to it on the desktop; LAST of the browsers to join us in resizing content like Opera has for a decade, and they handle it about as well as IE does, which is to say not at all. Again, zoom sucks.

  17. #42
    SitePoint Mentor silver trophybronze trophy

    Join Date
    Feb 2008
    Location
    Preston, Lancashire
    Posts
    1,377
    Mentioned
    72 Post(s)
    Tagged
    1 Thread(s)
    I have my own opinion on things, yes @deathshadow60 ; you might be right on many many things, but this does not mean we should ignore them. HTML5 is the future, just like jQuery is now the present. I agree they are bloating the web up, but that's what's happening. We cannot change the trends, all we can do is follow them enhancing what we do. I really like the way you base your arguements but I feel we have to seriously look more into following what's already there and enhancing it. If you separate yourself so much from what's normal in web design in the end you'd be left on the outside of what's going on.
    follow me on ayyelo, Easy WordPress; specializing in setting up themes!

  18. #43
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Sega View Post
    but that's what's happening. We cannot change the trends, all we can do is follow them enhancing what we do.
    Sorry, never been much of a lemming, much less one to simply roll over and take it... especially when it boils down to forgetting the past and being told to BOHICA.

    ... and there ARE advancements worth using; media queries is one of them, much of CSS3 is another; but simply hopping on the bandwagon of pointless site-flushers thanks to card stacking of facts, transfer, glittering generalities and manufactured testimonials? At that point might as well put on the white wool sweater and go "baaah"; probably why I fight right back with name calling, plain folks, lesser of two evils and my own glittering generalities. Fighting fire with fire.

    The reasonable man adapts himself to the world, the unreasonable one persists in adapting the world to himself. Therein, all progress depends on the unreasonable man. -- George Bernard Shaw.

    Honestly, if "HTML 5 is the future" I want no part of that future, and will wait for HTML 6 to deprecate all the redundancies, idiocies and mistakes just as HTML 4 did for HTML 3.2 -- since that's really what it boils down to! HTML 5, the new 3.2. If you've been coding tranny the past 14 years, you'll feel right at home.

  19. #44
    SitePoint Mentor silver trophybronze trophy

    Join Date
    Feb 2008
    Location
    Preston, Lancashire
    Posts
    1,377
    Mentioned
    72 Post(s)
    Tagged
    1 Thread(s)
    @deathshadow60

    You do have a point, and I agree with you whole-heartidly, but things are evolving on the web and we have to evolve with these changes. If we don't we will be left behind wondering where we went wrong.

    Quote Originally Posted by George Bernard Shaw.
    The reasonable man adapts himself to the world, the unreasonable one persists in adapting the world to himself. Therein, all progress depends on the unreasonable man.
    Agreed, but those people have to be in a position of power to make the changes, unless they have some crazy Tony Mantana-like aura on the world. I agree with this statement and I practice this everyday. This is probably why I am here doing what I do, instead of cuped up in a 9 - 5 office job riddled with office politics and idle worship to get me noticed by somebody a little higher up the hierarchy.
    follow me on ayyelo, Easy WordPress; specializing in setting up themes!

  20. #45
    SitePoint Zealot RyanKing1809's Avatar
    Join Date
    Oct 2011
    Location
    Melbourne, Australia
    Posts
    170
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by deathshadow60 View Post
    Flawed methodology since it doesn't always apply, and somebody can't do their math as that's 12pt aka 6 lpi, NOT 14pt.
    http://battletech.hopto.org/html_tut.../template.html
    Thanks for the link - so their maths is a little out, the layout still works despite 16px baseline assumption. Does even matter if you use the baseline assumption? All fonts are proportionately scaled off the baseline. So if the fonts scale smaller because of smaller baseline it doesn't matter because the layout functions exactly the same as it would if you didn't make a base line assumption in the first place. So what that different devices have different em baselines, the 16px assumption helps create the correct proportion to display on desktops that is also scalable. It's just a more controlled way of using ems. So why does the baseline assumption matter? It still works. Is there any practical reason why I shouldn't use it? Can you show me a layout the breaks with the 16px assumption?


    Quote Originally Posted by deathshadow60 View Post
    HTML 5 rubbish, endless IE version sniffing, design elements like the 'three across equal height' subsection that reeks of the "but I can do it in photoshop" nonsense (exactly the type of thing I mean when I say "not viable for web deployment")... throw in the memory hogging webfonts and it's annoyingly slow to render on desktop; a disaster in the IOS emulator so I don't even want to think what it would be like on the real hardware. (iOS simulator is NOT timer accurate)
    These are moot points - we're only talking about responsive layouts here. If you can produce a web page design quickly in photoshop (I use illustrator mostly for web) I see not reason no to use it - I don't believe it to be a reason for bad coding.

    Anyway the em media queries - It's a bit buggy (has some extra padding to the right side of layout) in portrait on both my iphone and my ios simulator set to iphone - assume this is just clumsy coding more than anything else. Works fine in landscape as well as everything else I've tried it on. It doesn't media query on rotating the the device but you can naturally pinch zoom out with ios devices.

  21. #46
    Non-Member
    Join Date
    Feb 2012
    Posts
    892
    Mentioned
    10 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Conquer View Post
    Sliding image galleries, JQuery effects, animations, huge graphics... those kinds of things are extras. They aren't really needed. Yeah, they look nice sometimes, but a well-designed site can achieve its purpose (and look great!) without using them.
    To me you're still making assumptions you shouldn't. What huge graphics? Why do you assume things never mentioned once? These 'evil' assumptions are not grounds for actual tech talk.

    Back to tech talk. Sliding is about actual content. Where you take chunks out of the normal content and make slides out of it. It's called progressive enhancement. Together with graceful degradation, they seem to be missing from your views on developing.

    <hr>

    Quote Originally Posted by Conquer View Post
    Only using my experience as an example that mobile users are not necessarily less limited with their devices than desktops and that mobile users don't necessarily want a lesser experience than desktop users.
    And I have the opposite personal example, where my desktop is better. Additionally, I can't help but question your so called low speed on home connection versus your high speed on 4GLTE. You're saying you can't use your smartphone as a modem or as a mobile spot and get faster internet at home, on your desktop?

    <hr>

    Quote Originally Posted by Conquer View Post
    It's not a great idea to assume that mobile users have different needs than desktop users - that mobile users are "on the go" or are "in a hurry" and other such things I see tossed around to justify giving mobile users a stripped version of the site. People browse from their mobiles in all sorts of different situations. (And I know many people who have no home computer and their only internet access is with mobile phones or tablets, so what about them?)
    But they do. No matter how fast is their mobile connection, their much smaller screen and the different types of user interfaces makes for completely different needs. In fact, that's your job, as a developer, to realize that mobile users have different needs.

    <hr>

    Quote Originally Posted by Conquer View Post
    My point is: You should design a site to be fast and lightweight for everybody, not just mobile users. And not remove content and features for some groups.
    Agreed on the first part. The second part you need to give more thought. You forget about accessibility. It actually means adding content and features for some groups, while removing the same content and features for some other groups.

    Now extend this concept, of accessibility, and think of mobile users like a group that has special needs. Because that's how it works.

  22. #47
    Non-Member
    Join Date
    Feb 2012
    Posts
    892
    Mentioned
    10 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Conquer View Post
    I think that the full site should be as easy to use on a mobile as it is on a desktop, call me crazy.
    I'm sorry, but I do. Unless you mean the full modified site, which no one ever argued against. Removing content was never about removing essential, core content.

    <hr>

    Quote Originally Posted by Conquer View Post
    If the "design details" can be stripped out and the site does what it should without them when viewed on a small screen, then maybe they don't really need to be there in the first place?
    Completely and totally theoretical views are known to quickly fail in real world. You can't deny design from a web page. That is bubkis.

  23. #48
    Non-Member
    Join Date
    Feb 2012
    Posts
    892
    Mentioned
    10 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by TehYoyo View Post
    <hr>
    Nice HTML4! Wait...what are you trying to do?
    Not sure what you mean. Could you be more specific? Thanks.

    But if you mean you can't actually find a definition for <hr> in HTML5, there it is: http://developers.whatwg.org/groupin...the-hr-element.

    The hr element represents a paragraph-level thematic break, e.g. a scene change in a story, or a transition to another topic within a section of a reference book.
    This is what I'm trying to do: to mark a change, a transition. For those that understand HTML, that is.

    Also, beats the hell out of the "-------------------------" or "====================" in one's posts, don't you think?

  24. #49
    Non-Member
    Join Date
    Feb 2012
    Posts
    892
    Mentioned
    10 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by deathshadow60 View Post
    I'm in the middle on that... kind of...

    If you start in the middle -- basically what you send IE8/lower who don't know media queries; then add code to expand it up for larger displays on modern browsers, and code to shrink it down for modern handhelds -- it will gracefully degrade in a useful/non-annoying manner for IE8-, who are still large enough a crowd you shouldn't be pissing them off sending them the mobile version of your site.
    Yeah, I know what you mean. This is my first instinct too. But it's not the only way to get things done, nor the only way that gives good results.

    Starting in the middle gives you lots of problems you need to overcome: some unsupported CSS in IE8- and other older browsers, quirks about implementations in them browsers, when it comes to more advance CSS. And the middle has a way of moving around, while the base is more stable.

    Who says mobile first doesn't resolves these issues better? Certainly not just one oversimplified template, with not much CSS to show for, and certainly not just one single opinion, based on a personal narrow view on developing. You just can't ask all to surrender their CSS to a bottom line or all to agree on just one way to do things.

  25. #50
    Non-Member
    Join Date
    Feb 2012
    Posts
    892
    Mentioned
    10 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by TehYoyo View Post
    If you could share how you slander about things that you don't even know about, I'd be very impressed and very interested to hear. Mind sharing?

    ~TehYoyo
    Not at all.

    It goes like this:

    One says:
    "I've heard TehYoyo not only technically destroyed every itmitică's response in Responsive Web Design Techniques thread, but he also made itmitică cry for days by being so mean and harsh to him! Can you believe that guy?!"

    The other responds:
    "That's slander about things you don't even know about. TehYoyo it's a stand up guy. If you've bother to read the Responsive Web Design Techniques thread, it'd be very obvious that's not true. TehYoyo never got into any technical matters whatsoever with itmitică, in that thread."


Bookmarks

Posting Permissions

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