Register a SA Forums Account here!
JOINING THE SA FORUMS WILL REMOVE THIS BIG AD, THE ANNOYING UNDERLINED ADS, AND STUPID INTERSTITIAL ADS!!!

You can: log in, read the tech support FAQ, or request your lost password. This dumb message (and those ads) will appear on every screen until you register! Get rid of this crap by registering your own SA Forums Account and joining roughly 150,000 Goons, for the one-time price of $9.95! We charge money because it costs us money per month for bills, and since we don't believe in showing ads to our users, we try to make the money back through forum registrations.
 
  • Post
  • Reply
pipes!
Jul 10, 2001
Nap Ghost

Lumpy posted:

Sort answer: Yes.

Long answer: Yes; in good browsers, you get additional built-in functionality like remembering previous terms, a clear button, etc.

Proper input type declaration is a lost art.

Adbot
ADBOT LOVES YOU

Bodhi Tea
Oct 2, 2006

seconds are secular, moments are mine, self is illusion, music's divine.
Say I have 10 image elements (dynamically created), that I will be inserting into the DOM. I want to call a function after all of them have loaded. How would you do it?

My solution was call setInterval() and iterate over the elements, check that they all have a non-zero height, and clearInterval once they all do.

Is there a better way to do this?

Ghostlight
Sep 25, 2009

maybe for one second you can pause; try to step into another person's perspective, and understand that a watermelon is cursing me



^^^ depending on how you're dynamically creating the images, $(window).load should fire after the page has finished loading all its elements.


I have a Rewrite conundrum. I have a site (https://www.url.com) that serves a different language version under https://www.url.com/china/ - I currently have
code:
RewriteCond %{HTTP_HOST} ^(www\.)?url\.com.cn$
RewriteRule ^(.*)$ [url]http://www.url.com/china/[/url]$1 [L]
but rather than forwarding it to that address, I want to get it loading from that resource while retaining the .com.cn url. How do I do that?

e: also how do I post example urls without them being encased in BBcode :v:

Knyteguy
Jul 6, 2005

YES to love
NO to shirts


Toilet Rascal

---
Can't say on the rewrite offhand but that's how you stop URL parsing.

pipebomb
May 12, 2001

Dear God, what is it like in your funny little brains?
It must be so boring.
re: notes for the 'designer'. He got mad, called the owner. Said he was a graphics artist(è) and that he had no idea about all of the 'code' I had sent him. Brain.is.leaking.

Lumpy
Apr 26, 2002

La! La! La! Laaaa!



College Slice

pipebomb posted:

re: notes for the 'designer'. He got mad, called the owner. Said he was a graphics artist(è) and that he had no idea about all of the 'code' I had sent him. Brain.is.leaking.

Use my billboard analogy. If this artist was hired to design a billboard and delivered a square aspect ratio RGB file 720px by 720px they would either have to re-do it, or they would not be paid. Why is it acceptable to ignore the constraints the web imposes on design?

pipebomb
May 12, 2001

Dear God, what is it like in your funny little brains?
It must be so boring.
Yeah, he does magazine, newspaper stuff. I used the h1 = headline and so on analogy. He absolutely freaked that I sent links explaining what some elements were.

Thermopyle
Jul 1, 2003

...the stupid are cocksure while the intelligent are full of doubt. —Bertrand Russell

pipebomb posted:

Yeah, he does magazine, newspaper stuff. I used the h1 = headline and so on analogy. He absolutely freaked that I sent links explaining what some elements were.

Some people are loving idiots and you've got to

1) Get a new job.
2) Murder.
3) Deal with it. :(

supermikhail
Nov 17, 2012


"It's video games, Scully."
Video games?"
"He enlists the help of strangers to make his perfect video game. When he gets bored of an idea, he murders them and moves on to the next, learning nothing in the process."
"Hmm... interesting."

Lumpy posted:

Sort answer: Yes.

Long answer: Yes; in good browsers, you get additional built-in functionality like remembering previous terms, a clear button, etc.

Also, read this then look at your CSS. Pull common stuff into classes.

Inline-block? It seems kind of dumb to have a class called "inline-block", because I don't see any other common elements, except maybe "cursor", but can an element be of two classes?

Anyway, http://cdpn.io/itkpA I've also pasted in my jQuery... because I don't know when to stop.

Ghostlight
Sep 25, 2009

maybe for one second you can pause; try to step into another person's perspective, and understand that a watermelon is cursing me



Inline-block is kind of dumb, in that it's useful but it has a bunch of special cases and weird logic to it.

Anyway, the issue is that you're floating the search box right which is loving up the text-flow that inline-block demands. Quick fix for the alignment issues:

#header { text-align: right; }
#search { float: right; }

And the bonus is you can delete .space entirely because now that you're no longer floating #header it will correctly detect the height of #search.

Lumpy
Apr 26, 2002

La! La! La! Laaaa!



College Slice

supermikhail posted:

Inline-block? It seems kind of dumb to have a class called "inline-block", because I don't see any other common elements, except maybe "cursor", but can an element be of two classes?

Anyway, http://cdpn.io/itkpA I've also pasted in my jQuery... because I don't know when to stop.

I was thinking more along the lines of the repeated border instances, and the same magic numbers being in multiple places and so on. If you decide to change the '405px' height you have specified, will you need to update more than one spot? What if you decide eggshell is better than white for your border color; will you remember to update every spot?

In a tiny example lime this, it may not seem like much, but keeping your CSS modular will save you lots of headaches down the road. And yes, elements can have many classes, so you can do <p class="offset fixed-height some-other-name">blah</p>

supermikhail
Nov 17, 2012


"It's video games, Scully."
Video games?"
"He enlists the help of strangers to make his perfect video game. When he gets bored of an idea, he murders them and moves on to the next, learning nothing in the process."
"Hmm... interesting."
The white border is my debugging, except for two instances, which I might modify anyway. And the magic numbers are there until I put more effort into aligning everything properly. Not to seem ungrateful, just to clarify things. Thanks for your help. Until next time! Er. I guess I could have commented that it was debugging. Sorry.

Lumpy
Apr 26, 2002

La! La! La! Laaaa!



College Slice

supermikhail posted:

The white border is my debugging, except for two instances, which I might modify anyway. And the magic numbers are there until I put more effort into aligning everything properly. Not to seem ungrateful, just to clarify things. Thanks for your help. Until next time! Er. I guess I could have commented that it was debugging. Sorry.

That will teach me to try and help people. "Kids, you tried your best and you failed miserably. The lesson is, never try"

cheese eats mouse
Jul 6, 2007

A real Portlander now

pipebomb posted:

re: notes for the 'designer'. He got mad, called the owner. Said he was a graphics artist(è) and that he had no idea about all of the 'code' I had sent him. Brain.is.leaking.

Dude will be out of a job in 10 years if he doesn't shape up as an artist(è). If our account managers can understand h1 = header he can too.

kedo
Nov 27, 2007

Print designers who simply cannot understand that a different medium requires a different process are an endless source of amusement for me. I had a pretty hilarious conversation with the print designers in my studio awhile back about why I needed at least six levels of headlines for a site even if I wasn't immediately using them on mockups. A lot of their confusion boils down to having variables as part of a design. Publication designers actually tend to grock web design a lot better in my experience; they're used to getting copy at the last minute and having to somehow fit everything into an existing grid system, so dealing with an unknown isn't new to them.

But yeah, that dude is hosed if he can't figure things out.

Spatulater bro!
Aug 19, 2003

Punch! Punch! Punch!

Rubies posted:

Does anyone have any experience working with MS sharepoint? I have to do something for work and it needs to be a "sharepoint portal" for a specific work group. I'm great at html/css but over the years I've developed my own methods for things that work and I'm wondering how much I can dick around in my normal environment but make it work with their system. I've done a quick search for custom SP blah blah but im just seeing the same blocky frames in all the examples that pop up. Any advice for working with this system? How much can i make it appear like a normal page as if built from scratch?

SharePoint websites are really not unlike any other website, except you're working around the SharePoint ribbon, and you're dealing with master pages and page layouts (which is very much the same concept as master page/content pages in plain old ASP.NET). My advice is to find a good custom blank master page to start working with. The default master pages come with a bunch of content placeholders and other bullshit that you won't use. I've created my own that I use on every site I make. Then point to a custom .css and you'll be good to go.

Oh, and be sure to use SharePoint designer, as it makes life pretty easy.

The key to not making a site look too SharePointy is to not rely too heavily on SharePoint lists, or at least learn how to style them properly (a bit tricky, as it involves editing the xsl style sheets). Here are a few sites I've developed in SharePoint: http://www.goamp.com http://www.pens.org http://www.naemsp.org http://www.nlhep.org http://www.gceducation.org http://www.nahcr.com

You can see for the most part they're not too SharePointy.

simcole
Sep 13, 2003
PATHETIC STALKER
I have a quick design question I'd like someone else's opinion on. I'm helping a friend (no money) setup a website. He is a goods broker, and he has several new contacts who want him to broker their goods. They all do small time stuff but want to appear as part of a larger entity for marketability. So I'm thinking I'll set him up with a wordpress site for now since it's simple and not a huge time suck for me. HOW should I structure the pages for the side business? example:

Top domain http://brokerage.com
Then should I do http://company1.brokerage.com as a sub domain?
Should I do a folder view? http://brokerage.com/company1
or should I simply do a page in wordpress?

My 2 concerns:
1) will all company pages look the same since it'll ride the main pages's theme?
2) What about down the road when these sub companies buy their own domain names, how would I point them to the correct place?

Does anyone have an opinion on this?

kedo
Nov 27, 2007

Subdomains sound like the better option, especially considering point 2. If you need to point them to new domains in the future, it'd be a lot easier to do so as you can map the DNS to subdomains, but not subdirectories.

Point 1 is kind of up to you and depends on how you structure the site. You could do individual WP installs for each site, in which case you'd have a ton of control over how they all looked, or if you preferred you could have one WP install and make them all look the same. There are a lot of pros and cons either way.

In terms of design, if the subdomain folks really want to appear as individual businesses doing individual installs might be better. Just make sure your buddy maintains administrative control over them.

Oh My Science
Dec 29, 2008

simcole posted:

Does anyone have an opinion on this?

Wordpress multi-site is what you're looking for, it will allow you to administrate multiple Wordpress installs with one admin account. Each site in your network can have a different theme and they do not share media uploads.

As for the domain question, I would encourage them to setup their own domains now.

Oh My Science fucked around with this message at 20:27 on Dec 17, 2013

Maluco Marinero
Jan 18, 2001

Damn that's a
fine elephant.

Oh My Science posted:

Wordpress multi-site is what you're looking for, it will allow you to administrate multiple Wordpress installs with one admin account. Each site in your network can have a different theme and they do not share media uploads.

As for the domain question, I would encourage them to setup their own domains now.

Just one thing to take into account with multi site is the fact that user accounts are global within the multi site network. Thats okay if you intend that, but if there needs to be a clear functional split don't use WordPress multisite and do independent installs instead.

simcole
Sep 13, 2003
PATHETIC STALKER

Maluco Marinero posted:

Just one thing to take into account with multi site is the fact that user accounts are global within the multi site network. Thats okay if you intend that, but if there needs to be a clear functional split don't use WordPress multisite and do independent installs instead.

Ohh now there's a good tidbit. Thanks for the responses. Since it's just helping a friend quick and no $, I'll just make sure he/me makes all the changes and doesn't give out the admin password. Thank you.

Oh My Science
Dec 29, 2008

Maluco Marinero posted:

Just one thing to take into account with multi site is the fact that user accounts are global within the multi site network. Thats okay if you intend that, but if there needs to be a clear functional split don't use WordPress multisite and do independent installs instead.

I believe this plugin solves that problem: http://wordpress.org/plugins/multisite-user-management/

I haven't used it so let me know if it works simcole.

chami
Mar 28, 2011

Keep it classy, boys~
Fun Shoe

pipebomb posted:

A new gig I have uses a print designer to do their mockups,then the devs replicate it based on a PSD. This results in poo poo. I am trying to make the guy a list of what to do/not to do. Help?

* Use only websafe fonts - http://www.w3schools.com/cssref/css_websafe_fonts.asp
* or Google fonts - http://www.google.com/fonts
* Each font needs a familial fallback - sans/serif, monospace, etc. - no single font choices

* H1/H2/H3/P need to be distinctive, proportionate and scalable
* Blockquotes - stylized, indented
* Avoid beveling elements
* Lean toward contrast as opposed to borders
* Avoid textured elements
* Avoid images where color, shading, translucency can be used
* Avoid drop-shadow on text, lean toward contrast, weight
* Consistent padding between elements - makes responsive design more achievable

As a designer whose training was all in print, this is great advice. I'm a little confused as to this last bullet point though - how does it help make a design responsive? My only experience with doing responsive design has been me doing my personal site in Twitter Bootstrap and making a million mistakes along the way, so I think I might be missing some theory behind this practice.

kedo posted:

Print designers who simply cannot understand that a different medium requires a different process are an endless source of amusement for me. I had a pretty hilarious conversation with the print designers in my studio awhile back about why I needed at least six levels of headlines for a site even if I wasn't immediately using them on mockups. A lot of their confusion boils down to having variables as part of a design. Publication designers actually tend to grock web design a lot better in my experience; they're used to getting copy at the last minute and having to somehow fit everything into an existing grid system, so dealing with an unknown isn't new to them.

But yeah, that dude is hosed if he can't figure things out.

This is probably basic-level stuff for everyone else here, but the way I wrapped my head around variability in web type size is to just think of things in terms of the size of the body copy. Copy is 1 em, and then h1 is 2em or whatever suits your needs and so on and so forth. It's not too different from establishing a baseline grid on a print layout and then building off that. I'm not sure how correct this is from a web perspective but I remember reading articles about people doing responsive typography by first declaring a body font size and then basing everything else off multiples of that.

chami fucked around with this message at 21:44 on Dec 17, 2013

kedo
Nov 27, 2007

chami posted:

As a designer whose training was all in print, this is great advice. I'm a little confused as to this last bullet point though - how does it help make a design responsive? My only experience with doing responsive design has been me doing my personal site in Twitter Bootstrap and making a million mistakes along the way, so I think I might be missing some theory behind this practice.

It just makes things a lot easier and more intuitive. If every top level element on the page (say your content column, sidebar, header and footer) has 40px of padding at browser dimensions, it's easy to figure dimensions at smaller sizes and it's also just easier to code because you can probably get away with declaring the new widths once. For example you could easily swap them out for 30px when you hit a tablet breakpoint, and then maybe 20px at a mobile breakpoint. If every single element on the page has custom padding you're going to have to do a lot of math and make a lot of new declarations, and at the end of the day you're probably going to gently caress something up.

Think of it like if you had a grid system you used across various print mediums for a brand, but every column of the grid was a different width. Repurposing the grid on a business card vs. letterhead vs. annual report would be a huge pain in the rear end. If all the columns were of equal width and you had a set number you used consistently, it'd be way more useful and pleasurable to work with.

chami posted:

I'm not sure how correct this is from a web perspective but I remember reading articles about people doing responsive typography by first declaring a body font size and then basing everything else off multiples of that.

A lot of people still do it that way, but with CSS preprocessors there are different (and imho easier) ways to maintain consistent sizes. I'd rather use a bunch of semantic SASS variables for my font sizes because they're just easier to remember than numbers (eg. $small, $medium and $large vs. 1em 1.5em 2em), and then swap out font sizes with nested media queries, but really either way works fine.

kedo fucked around with this message at 22:25 on Dec 17, 2013

pipes!
Jul 10, 2001
Nap Ghost

kedo posted:

A lot of people still do it that way, but with CSS preprocessors there are different (and imho easier) ways to maintain consistent sizes. I'd rather use a bunch of semantic SASS variables for my font sizes because they're just easier to remember than numbers (eg. $small, $medium and $large vs. 1em 1.5em 2em), and then swap out font sizes with nested media queries, but really either way works fine.

modular scale 4 lyfe

kedo
Nov 27, 2007

Out of all of the new CSS pre/postprocessors coming out every drat day, this is about the only one that's seemed intriguing to me: http://www.myth.io/

chami
Mar 28, 2011

Keep it classy, boys~
Fun Shoe

kedo posted:

It just makes things a lot easier and more intuitive. If every top level element on the page (say your content column, sidebar, header and footer) has 40px of padding at browser dimensions, it's easy to figure dimensions at smaller sizes and it's also just easier to code because you can probably get away with declaring the new widths once. For example you could easily swap them out for 30px when you hit a tablet breakpoint, and then maybe 20px at a mobile breakpoint. If every single element on the page has custom padding you're going to have to do a lot of math and make a lot of new declarations, and at the end of the day you're probably going to gently caress something up.

Think of it like if you had a grid system you used across various print mediums for a brand, but every column of the grid was a different width. Repurposing the grid on a business card vs. letterhead vs. annual report would be a huge pain in the rear end. If all the columns were of equal width and you had a set number you used consistently, it'd be way more useful and pleasurable to work with.

Thanks, "have a consistent grid system and don't leave content all over the page" is easier to understand than "consistent padding between elements".

Oh My Science
Dec 29, 2008

kedo posted:

Out of all of the new CSS pre/postprocessors coming out every drat day, this is about the only one that's seemed intriguing to me: http://www.myth.io/

Take away my mixins and I might murder someone. Looks neat though.

Ghostlight
Sep 25, 2009

maybe for one second you can pause; try to step into another person's perspective, and understand that a watermelon is cursing me



kedo posted:

Out of all of the new CSS pre/postprocessors coming out every drat day, this is about the only one that's seemed intriguing to me: http://www.myth.io/
I don't think Chrome likes whatever they've done with Source Sans.

pipes!
Jul 10, 2001
Nap Ghost

chami posted:

Thanks, "have a consistent grid system and don't leave content all over the page" is easier to understand than "consistent padding between elements".

It's funny how web technology is finally starting to catch up with print. Ligatures, grid systems, alignment, text flowing, etc.


kedo posted:

Out of all of the new CSS pre/postprocessors coming out every drat day, this is about the only one that's seemed intriguing to me: http://www.myth.io/

Globally scoped variables :laugh:

Risket
Apr 3, 2004
Lipstick Apathy
I'm not entirely whether this should go here or in the Wordpress thread.

I'm building a ecommerce site using Wordpress with WooCommerce, with the free Mystile theme installed using the red.css Theme Stylesheet. I don't have a lot of experience, but I've been customizing the CSS to make it look the way I want it to, and it's going well, but I've run into a snag and I don't seem to know the correct terms to Google for a solution.

The navigation bar looks like this in the stock Mystile theme:



I've changed the background to look like this, along with the font color, background for the navigation bar, hover color, etc...


Here's my problem, when I go to one of the menu options that has a submenu, when one of the child menu items is moused over the background of the parent link changes:


How do I keep the main navigation link from changing it's background when I mouse over a submenu element?

Here is the CSS that I used to make these changes:
code:

/*
Sets the color of the navigation links
*/
#header #navigation ul.nav > li a  {
    background:  rgba(0,0,0,0);
    border:  none;
    color:  #fcfcfc;
}

/*
Sets the color of the navigation links while they are being moused over.
*/
#header #navigation ul.nav > li a:hover  {
   background:  rgba(0,0,0,0);
   color:  #ee0000;
}

/*
Sets the color of the navigation links menus, no mouse over.
*/
#header #navigation ul.nav ul a:link  {
   color:  #3E3E3E;
}

/*
Sets the color of the navigation links menus, mouse over.
*/
#header #navigation ul.nav ul a:hover  {
   color:  #ee0000;
   background:  rgba(0,0,0,0);
}
Please note that I have no idea what I'm doing, so this code is probably complete crap.

Thanks

Damiya
Jul 3, 2012

pipes! posted:

Globally scoped variables :laugh:

Nm

Damiya fucked around with this message at 08:56 on Dec 18, 2013

Maluco Marinero
Jan 18, 2001

Damn that's a
fine elephant.

pipes! posted:

It's funny how web technology is finally starting to catch up with print. Ligatures, grid systems, alignment, text flowing, etc.


Globally scoped variables :laugh:

But the CSS spec for variables has selector scoped variables.

That said though, I think its pretty dumb to tout future proof code as a feature as if they know that the spec will definitely conform to the current iteration. Future proofing CSS seems to me a dumb fools errand, like assuming that a version 0.1 API won't require code changes in the future.

At least with SASS if the spec changes you just change the output, and fire deprecation warnings if required.

kedo
Nov 27, 2007

Risket posted:

I'm not entirely whether this should go here or in the Wordpress thread.

...

Looks like that background is getting declared elsewhere, there's nothing in that code that would give something a white background color.

Also you should probably use background: none; instead of background: rgba(0,0,0,0); as old browsers that don't support the rgba method will probably look hosed up.

Maluco Marinero posted:

That said though, I think its pretty dumb to tout future proof code as a feature as if they know that the spec will definitely conform to the current iteration. Future proofing CSS seems to me a dumb fools errand, like assuming that a version 0.1 API won't require code changes in the future.

Oh yeah. I'm not suggesting it's something we should all start using right away, but it's interesting! :)

pipes!
Jul 10, 2001
Nap Ghost

Maluco Marinero posted:

But the CSS spec for variables has selector scoped variables.

CSS should never, ever be used as an example of anything resembling something positive for a coding "language." I'm still in the process of undoing all the bad habits it taught me.


Maluco Marinero posted:

At least with SASS if the spec changes you just change the output, and fire deprecation warnings if required.

Agreed. SASS is the CSS that CSS should have been.

Munkeymon
Aug 14, 2003

Motherfucker's got an
armor-piercing crowbar! Rigoddamndicu𝜆ous.



Ghostlight posted:

I don't think Chrome likes whatever they've done with Source Sans.

Something on that page looks like poo poo on every browser I try :|

postprocessor especially

Rubies
Dec 30, 2005

Live Forever
Die Every Day

:h: :s: :d: :c:

caiman posted:

SharePoint websites are really not unlike any other website, except you're working around the SharePoint ribbon, and you're dealing with master pages and page layouts (which is very much the same concept as master page/content pages in plain old ASP.NET). My advice is to find a good custom blank master page to start working with. The default master pages come with a bunch of content placeholders and other bullshit that you won't use. I've created my own that I use on every site I make. Then point to a custom .css and you'll be good to go.

Oh, and be sure to use SharePoint designer, as it makes life pretty easy.

The key to not making a site look too SharePointy is to not rely too heavily on SharePoint lists, or at least learn how to style them properly (a bit tricky, as it involves editing the xsl style sheets). Here are a few sites I've developed in SharePoint: http://www.goamp.com http://www.pens.org http://www.naemsp.org http://www.nlhep.org http://www.gceducation.org http://www.nahcr.com

You can see for the most part they're not too SharePointy.

Thanks for the reply! (also thanks Diabolik for the reply a few pages ago). I'm starting to feel a little bit better about having to use sharepoint - for this project it's not an option to build outside of SP, which is unfortunate but the guy at the top of the committee is familiar with it and won't budge for scary "new codes" like HTML and CSS. If I can at least make it passable I'll feel pretty good about having my name attached to it, and I can see from your examples that an SP site can come out looking fine with a little elbow grease.

Skiant
Mar 10, 2013

Ghostlight posted:

I don't think Chrome likes whatever they've done with Source Sans.

OSX has a different font rendering and usually makes it appear bolder, so it probably looks fine on their 3000$ machines.

fletcher
Jun 27, 2003

ken park is my favorite movie

Cybernetic Crumb
Some users are reporting SSL certificate errors when accessing my site (which is weird since server config hasn't changed recently) but it seems to work fine for me on multiple browsers and devices. What might cause something like that?

Error message is "certificate was signed by an unknown authority" - but it's a well known cert provider. One person that hit it was using Chrome on Mac, the other was from the latest Android OS.

fletcher fucked around with this message at 21:08 on Dec 19, 2013

Adbot
ADBOT LOVES YOU

Oh My Science
Dec 29, 2008
If your certificate is signed by a major certificate authority then it just means one of the chain certificates in between yours and the root is not installed on the web server.

Try using http://www.digicert.com/help/ to check your url.

  • 1
  • 2
  • 3
  • 4
  • 5
  • Post
  • Reply