|
Pivo posted:I ran into a funny issue recently you guys might find amusing. So we had some text we wanted to vertically centre in a div right. Width and height was fixed so it wasn't a challenge, although still used CSS translate or whatever to do it "the right way". The weird thing is, on OS X across all browsers, the + that we were displaying was off! It kept ending up being lower than we expected! But on Windows and Debian, it was always smack dab in the middle just like we wanted. What the gently caress was going on? So you don't like front end work because you don't understand typography. Got it.
|
# ? Aug 29, 2014 02:18 |
|
|
# ? May 9, 2024 07:29 |
|
Lumpy posted:So you don't like front end work because you don't understand typography. Got it. Yeah, frontend is hard but if you can't even get on top of font-stacks you've got a lot more coming.
|
# ? Aug 29, 2014 02:23 |
|
Lumpy posted:So you don't like front end work because you don't understand typography. Got it. Errr... Are we being antagonistic towards each other here? I'm not sure of the protocol. Should we start a flamewar? I'm just saying it's weird to put the + symbol on the baseline, even though I'm sure it was a very intentional stylistic decision (and who am I to question Helvetica?), it's just annoying when it comes to supporting multiple browsers across multiple platforms... Let's say we wanted to keep that + symbol in Helvetica. But also keep it aligned properly for users who only have Arial. What would you have done? I'm a backend guy, man, I get roped into this poo poo. Design and all that used to be a *hobby* for me. It's not as much fun when you're getting paid for it. Not knocking anyone, just saying, what a weird problem, right? But seriously, how would you have fixed it?
|
# ? Aug 29, 2014 02:30 |
Pivo posted:But seriously, how would you have fixed it? If you want to use a font like Helvetica you should be providing it to your users.
|
|
# ? Aug 29, 2014 02:33 |
|
Pivo posted:But seriously, how would you have fixed it? Trying to display a font in a way that it wasn't designed? What's to fix?
|
# ? Aug 29, 2014 03:12 |
|
Chenghiz posted:Trying to display a font in a way that it wasn't designed? What's to fix? Eh, you guys have a valid point. The font choices weren't mine. I don't like Helvetica Neue anyway. But yeah, you're right. Should have thought about that. Just so much work to do, you know? Fonts are the least of your worries. Until they cause problems.
|
# ? Aug 29, 2014 03:40 |
|
Pivo posted:Errr... Are we being antagonistic towards each other here? I'm not sure of the protocol. Should we start a flamewar? Not used typography for what probably was supposed to be an icon next to some typography. You never mentioned your use case, but my guess is was something like: code:
And yeah, front end work is not fun for the first few years as you deal with all this weird, obtuse crap that is usually the result of somebody *else* not understanding the constraints of web design. Then Stockholm Syndrome sets in and you convince yourself it's not so bad....
|
# ? Aug 29, 2014 04:49 |
|
Lumpy posted:The "+" there should not be part of the text, as you have painfully found out. It should either be an image (icon), or if for some reason, type is *needed*, SPANed out content:"+"; } content before/after is a styler's dream come true. I abuse it all the time to make block elements out of nowhere, and to mix it with position absolute to do some neato things.
|
# ? Aug 29, 2014 14:27 |
|
obstipator posted::before{ Yep. I'd still use an image instead though, since once again, you are at the mercy of your typefaces, as if you use Helvetica Neue, you still have the "baseline problem": http://jsfiddle.net/2xefqr59/ One of the "solutions" you could use, assuming the use case is what we are guessing is: code:
You can scale your SVG as needed for different size variants and all that jazz. There are many, many ways to skin that there cat though.
|
# ? Aug 29, 2014 15:43 |
|
I'm having trouble with Bootstrap because of course I am not a front-end dev, but I look like one on TV. I have a pretty typical static top navbar, just like the one at bootstrap.com. But I want my responsive design with the shrinking menu to show a hamburger and the word 'Menu' in the same clickable button or whatever it is. The example they provide and use for the hamburger is a bunch of spans with icon-bar in it. Now I did a hacky thing where I added another button that says menu, and it works even though they are two separate buttons but they're spaced a bit too far apart for my liking. I tried putting them both in the same div but that just made the thing into an even bigger button and added all sorts of padding or whatever that I don't want. Example ignoring closing divs/header tags. code:
|
# ? Aug 29, 2014 16:30 |
Wasn't somebody just asking about whether they should use YUI in this thread? http://yahooeng.tumblr.com/post/96098168666/important-announcement-regarding-yui quote:we have made the difficult decision to immediately stop all new development on YUI
|
|
# ? Aug 29, 2014 20:06 |
|
fletcher posted:Wasn't somebody just asking about whether they should use YUI in this thread? So look for some big corporations to decide on it in the next 6 months or so....
|
# ? Aug 29, 2014 20:23 |
Lumpy posted:So look for some big corporations to decide on it in the next 6 months or so.... I don't know about other organisations but all of Moodle's stuff uses YUI and between Moodle's autoloading and YUI's autoloading it's just a nightmare. Looking forward to seeing how they react to this, althoug the writing has been on the wall for god knows how long.
|
|
# ? Aug 29, 2014 21:05 |
|
For my icons, I just use http://fontawesome.io/
|
# ? Aug 29, 2014 21:33 |
|
https://symbolset.com/ is pretty great.
|
# ? Aug 29, 2014 21:57 |
|
I usually use http://iconmonstr.com/ which outputs in SVG or PNG, and I build my own custom fonts based on what I need. Lately though I've just been combining them into one SVG and serving that up.
|
# ? Aug 30, 2014 02:08 |
|
fletcher posted:Wasn't somebody just asking about whether they should use YUI in this thread? According to some folks in IRC, Yahoo's teams are trying out Ember and React right now.
|
# ? Aug 30, 2014 02:16 |
|
Web fonts + chrome + windows = oh god why do I have to explain this font rendering issue to these people
|
# ? Aug 30, 2014 10:17 |
|
Chrome 37 will alleviate those concerns. It should be live by now anyway
|
# ? Aug 30, 2014 11:30 |
|
Hey, it only took 5 years!
|
# ? Aug 30, 2014 17:20 |
|
I have a client site that uses statcounter — which has terrible load/connect times — as a supplementary JavaScript tracker to what Google Analytics gives them. What's the right way to insert the SCRIPT code into the HTML for statcounter so it doesn't jam up the other scripts, like jQuery $(document).ready() UI function calls? I'd like lightboxes, etc. to be initialized as soon as possible so they work, regardless of whether statcounter has decided to connect.
|
# ? Aug 30, 2014 17:29 |
|
onionradish posted:I have a client site that uses statcounter — which has terrible load/connect times — as a supplementary JavaScript tracker to what Google Analytics gives them. Create the script tag for stat counter dynamically and insert it as the last thing in your jQuery document ready function. You can use the 'async' property on a normal script tag, but browser support.
|
# ? Aug 30, 2014 18:39 |
|
Lumpy posted:Create the script tag for stat counter dynamically and insert it as the last thing in your jQuery document ready function. You can use the 'async' property on a normal script tag, but browser support. onionradish fucked around with this message at 20:35 on Aug 30, 2014 |
# ? Aug 30, 2014 19:08 |
|
Can anyone share a boilerplate invoice for freelance web development? I got my first payed job and I don't know where to start with forms.
|
# ? Aug 30, 2014 23:42 |
Analytic Engine posted:Can anyone share a boilerplate invoice for freelance web development? I got my first payed job and I don't know where to start with forms. I'd suggest something like Freshbooks
|
|
# ? Aug 30, 2014 23:50 |
|
I've been using Xero for all my accounting stuff, it's super useful and will handle all your bank reconciliation/invoicing/etc. Some goon who works with the company mentioned it in one of the computerman threads a while ago.
|
# ? Aug 30, 2014 23:50 |
|
Thanks, I'm trying out Freshbooks.
|
# ? Aug 31, 2014 15:29 |
|
How do I remove the space below my Wordpress footer when my theme is on boxed mode?
|
# ? Aug 31, 2014 16:00 |
Can you link us to the website so I can fiddle around with CSS in-browser?
|
|
# ? Aug 31, 2014 16:01 |
|
Makes sense! Here goes http://urlgone.com/fba910/ Disharmony fucked around with this message at 16:21 on Aug 31, 2014 |
# ? Aug 31, 2014 16:06 |
I don't know how your CSS is being generated (e.g. having a class selector followed by an element id) but try adding this somewherecode:
|
|
# ? Aug 31, 2014 16:10 |
|
It didn't work but it did help steer me to the right direction! Turns out the "auto" after margin:0px was crucial. Super thanks!
|
# ? Aug 31, 2014 16:20 |
Now I'm having a problem. I've just noticed on my site that what works in chrome isn't working in firefox. I have a text input box that, after a form has been submitted, gets disabled and an anchor tag gets through around it. When people click on the anchor tag, it cycles through the content of the input box. In chrome this works fine. In firefox the jquery .on('click', 'a.incorrectanswer', ... ) event handler isn't getting triggered at all. The only thing I can think is that in firefox you can't put an input box inside a link. Is this true? Is there a way to overcome it? The site is: http://www.marianminds.com/latin-verb-conjugator/ Just type an incorrect answer, click the 'check answers' button, and try to click on the glowing red input box. In chrome it works, in firefox it doesn't. I was hoping it was a simple z-index issue but no go. Anybody have any ideas on what's causing it and/or what to do? e: In fact, firefox isn't registering the triggered event handler for even the input box itself. When I add an event handler for all input.incorrect boxes, it doesn't register a click. e2: Augh. Apparently disabled elements don't trigger any events, for most browsers, and chrome is the exception. http://stackoverflow.com/questions/3100319/event-on-a-disabled-input I'll have to see about creating an invisible overlay or something. Grosssss e3: Okay all done. Added a <div> after it which would display over it. That can grab the click event and process everything normally from there. Dumb gross non-specified standards Sulla Faex fucked around with this message at 18:40 on Aug 31, 2014 |
|
# ? Aug 31, 2014 18:15 |
|
Whats a good way from a UX perspective for 'Click HERE to find out more' options? In this example, I am presenting a progress bar on account setup / configuration and want to tell them to 'click here' on the progress bar if they want to find out more. Should I think of better phrasing, a nice icon? Something else?
|
# ? Sep 1, 2014 01:53 |
|
Ahz posted:Whats a good way from a UX perspective for 'Click HERE to find out more' options? Need to learn ux? Here's how Make your call to action the link, and never, ever, ever, ever use the words 'click here' on a web page. That means you have utterly failed.
|
# ? Sep 1, 2014 01:58 |
|
Lumpy posted:Need to learn ux? Here's how You got me! But yeah, call to action.
|
# ? Sep 1, 2014 03:36 |
|
A fun exercise is to say "I want to [cta text". So you want the user to view a detailed view if they press that button, so maybe something just like "View Detailed Information", "Detailed Information", or "See More Details".
|
# ? Sep 1, 2014 16:40 |
|
I need to whip up a dashboard style site with Boostrap 3 (like these, but I don't care where it comes from). For right now I'm just looking for a pre-built theme. Anyone have any they've used an particularly liked?
|
# ? Sep 1, 2014 21:17 |
|
Can someone (preferably a safari user) take a look at the logo on this site and tell me if it looks blurry? http://bespokedrywall.campbellmarsh.co.uk/ (The orange "bespoke drywall" logo on the left) The client is insisting it's blurry but it looks fine to me. How should I be turning a svg into a png logo? I just picked an arbitrary large size (700px wide), but is that a bad idea if it's usually going to get squashed down to like 150px wide?
|
# ? Sep 2, 2014 15:59 |
|
|
# ? May 9, 2024 07:29 |
|
At default zoom level, it looks crisp on Chrome - Debian, but it does look a bit blurry on Safari - OS X Mavericks. It might be the default scaling that's used on OS X vs. others, it's probably optimized more for photography than for line graphics. Different scaling algorithms produce different results and are optimized for different use-cases. I don't know why you're downloading a 700x351 image just to display it at 185x90! BAD BAD BAD Scale it first!
|
# ? Sep 2, 2014 16:07 |