The Web Design & Development Megathread

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > The Web Design & Development Megathread

«‹›361 »

Defghanistan: Feb 9, 2010; 2base2furious

Chenghiz posted:

Why can't the devs work in Linux? Plenty of web dev tools available in OSX are also compiled for Linux. What keeps them in windows at all?

Checking out Docker now, thanks for the suggestion!

I tried to explain this in my first post but maybe it wasn't clear. They are running a Windows host to dev our product (a game). They then write their code within an Ubuntu Desktop VM because they like Sublime Text. The problem is that they also want to run their code on that same ubuntu desktop, which requires the environment to meet certain requirements which have been getting blasted because people change their dev environment setups (which is totally reasonable).

I really wish everyone were just on macs, but oh well.

Definitely checking out Docker, thank you!

# ? Jul 11, 2014 16:20

Adbot: ADBOT LOVES YOU

# ? May 9, 2024 20:15

excidium: Oct 24, 2004; Tambahawk Soars

Defghanistan posted:

They then write their code within an Ubuntu Desktop VM because they like Sublime Text.

Wait what? Sublime Text is available on Windows.

# ? Jul 11, 2014 16:33

Defghanistan: Feb 9, 2010; 2base2furious

excidium posted:

Wait what? Sublime Text is available on Windows.

Yeah but they're writing web code, so they write it, save it, run it.

This morning I thought about it and came up with the following idea, please pick it apart:

Goals:
1. Fast and easy for web devs to write and test code
2. Fast and easy for ansible deployments to run against
3. Code runs on environments that mirror production
4. Test environment can be blown away and recreated easily and consistently

Proposal:

On windows host machine:
1. Install Vagrant
2. Configure Vagrant file to create an ubuntu 12.04 VM, add a user, give that user a password, and attempt to mount a directory from the IP of the dev VM to /var/web
3. Actual work on part of web dev: "vagrant up" (go get coffee)

On "dev" VM (the vm you write code on)
1. Wherever your repo is cloned to, share that directory with user
a. This step is manual but we could script it

On web deploy playbooks:
1. Create "dev" flag that doesn't attempt to clone web repo ("webdev=true")
2. To be run after the dev VM has been spun up and has access to the /var/web/ mount

Result:
1. Destroyable test environments
a. vagrant destroy -f
b. vagrant up
c. ansible-playbook run
d. done
2. Clean deployments every time (and for brand new employees)
3. The code you write is immediately available on the test box, and the environments are uniform- hit save and your code is already on the perfectly clean dev environment

Edit: Had copy pasted an email and included a username lol

Defghanistan fucked around with this message at 16:46 on Jul 11, 2014

# ? Jul 11, 2014 16:41

Kudaros: Jun 23, 2006

Thanks for the replies regarding Django, Bootstrap, et al. I'll work through some tutorials and make some choices then.

# ? Jul 11, 2014 18:44

ex post facho: Oct 25, 2007

a shameful boehner posted:

I'm pretty sure that I want to embark on the road to becoming a full stack developer, or at least become competent enough to be employable. I currently work for a small startup with multiple responsibilities from QA to training to support, and through the position I've become at least somewhat familiar with HTML coding, SQL server, the Agile development process/scrum, FogBugz and a few other systems. So now I'm looking to build on that foundation and try to become more proficient in web development.

Does anyone have any experience with the website The Odin Project? It looks like a relatively recent new website (came up in May of this year I think) and seems to offer a ton of information on becoming a full stack web developer. Ranges from introduction to web development 101, Ruby programming, Ruby on Rails, HTML5, CSS3, Javascript and JQuery, and getting hired. I'm reading through a few of the introductory lessons now but was wondering if anyone else has gone through their process. Completely free! I read through the OP and didn't see it mentioned, but if anyone has any feedback if it's valuable enough to go through I'd greatly appreciate it.

Just reposting from last page, since I didn't see anyone comment. Can someone more experienced take a peek at the curricula and let me know if it makes sense for someone just getting familiar with web design & development?

# ? Jul 11, 2014 20:19

karms: Jan 22, 2006; by Nyc_Tattoo; Yam Slacker

a shameful boehner posted:

Just reposting from last page, since I didn't see anyone comment. Can someone more experienced take a peek at the curricula and let me know if it makes sense for someone just getting familiar with web design & development?

It's pretty good! Has the right attitude about things, doesn't feel preachy, definitely gives you a birds-eye view of what's involved to create web stuff.

# ? Jul 11, 2014 22:00

EAT THE EGGS RICOLA: May 29, 2008

Yeah, at first glance that looks pretty good.

# ? Jul 11, 2014 22:01

Heskie: Aug 10, 2002

a shameful boehner posted:

Just reposting from last page, since I didn't see anyone comment. Can someone more experienced take a peek at the curricula and let me know if it makes sense for someone just getting familiar with web design & development?

Spent the last few hours reading through this as I'm a freelancer/contractor looking to go full-time, applying directly to agencies in the next few weeks. Looks pretty good and I'll be referring back to it once I've rebuilt my portfolio etc.

Thanks for the link.

# ? Jul 11, 2014 23:56

v1nce: Sep 19, 2004; Plant your brassicas in may and cover them in mulch.

Defghanistan posted:

1. Install Vagrant
2. Configure Vagrant file to create an ubuntu 12.04 VM, add a user, give that user a password, and attempt to mount a directory from the IP of the dev VM to /var/web

Just to re-iterate my point about Vagrant speeds; this should be fine if you're using NFS to link the dev VM (Ubuntu under VirtualBox on Windows) to the test environment VM (Ubuntu under Virtualbox on Windows). Just don't host the source your project on windows and execute it from the VM using a shared folder, especially if there's a lot of file access going on, because it's dog slow.

My advice would be to bash something together very quickly for one dev, and see how they get on to ensure the performance is OK before you spend days configuring all the environments just-so.

# ? Jul 12, 2014 03:31

spacebard: Jan 1, 2007; Football~

v1nce posted:

Just to re-iterate my point about Vagrant speeds; this should be fine if you're using NFS to link the dev VM (Ubuntu under VirtualBox on Windows) to the test environment VM (Ubuntu under Virtualbox on Windows). Just don't host the source your project on windows and execute it from the VM using a shared folder, especially if there's a lot of file access going on, because it's dog slow.

My advice would be to bash something together very quickly for one dev, and see how they get on to ensure the performance is OK before you spend days configuring all the environments just-so.

Vagrant 1.5 introduced rsync support (and much improved in 1.6), which is a good alternative to NFS on Windows. You need to be handy with Cygwin though. I prefer to work this way because all my dev tools are on my host machine and different from other developers' tools. Although I think most people stick with NFS still.

# ? Jul 12, 2014 14:18

Defghanistan: Feb 9, 2010; 2base2furious

v1nce posted:

Just to re-iterate my point about Vagrant speeds; this should be fine if you're using NFS to link the dev VM (Ubuntu under VirtualBox on Windows) to the test environment VM (Ubuntu under Virtualbox on Windows). Just don't host the source your project on windows and execute it from the VM using a shared folder, especially if there's a lot of file access going on, because it's dog slow.

My advice would be to bash something together very quickly for one dev, and see how they get on to ensure the performance is OK before you spend days configuring all the environments just-so.

Totally agree, I was going to set it up for myself maybe this weekend as a test.
Also to keep things as uniform as possible, I was going to have the devs maintain their current work environments (as little change as possible) and have them simply share their already cloned repos from their ubuntu desktop VM's to the ubuntu server VM's, so I don't think there should be much trouble there.

I'll let you know how it goes!

# ? Jul 12, 2014 15:45

Pollyanna: Mar 5, 2005; Milk's on them.

I'm working with Foundation right now, and I have a couple questions:

Should I leave a section of consecutive links as a bunch, or should they be a list instead? e.g., I have this structure:
HTML code:
```
<div class='row'>
  <h1>Header</h1>
  <a href='#'>Link 1</a>
  <a href='#'>Link 2</a>
</div>
```
Is it fine to leave it like this, or should I put them in a <ul></ul> instead? Eventually, they'll be their own panels, and I want them side-by-side on a large screen, but stacked on a small screen. As they are right now, since they're just text, they just wrap around on the small screen.
Is there a way to modify the stacking/listing of the topbar dropdown menu to make it into a grid instead? On a small screen, the topbar automatically changes a section list into dropdown format, as a vertical stack of links. However, I want that to become a grid on a small screen - without it changing anything on the large screen.

Thanks for the help!

# ? Jul 14, 2014 16:15

Newf: Feb 14, 2006; I appreciate hacky sack on a much deeper level than you.

// I am not a web developer - do not take this advice

You should use markup to describe the semantic layout of the page. If it's a list of links (I think that it is!) then it should be marked up as a list.

# ? Jul 14, 2014 16:36

Pollyanna: Mar 5, 2005; Milk's on them.

Newf posted:

// I am not a web developer - do not take this advice

You should use markup to describe the semantic layout of the page. If it's a list of links (I think that it is!) then it should be marked up as a list.

Well, they're actually buttons. They're just links at the time being. Should I still put them in a list?

# ? Jul 14, 2014 17:07

Lumpy: Apr 26, 2002; La! La! La! Laaaa!; College Slice

Pollyanna posted:

Well, they're actually buttons. They're just links at the time being. Should I still put them in a list?

Ask yourself this very important question: Are the buttons or links representative of a list of things.

Hooray! You did it!!

But seriously, probably. Navigation is a LIST of places you can go on a site.

# ? Jul 14, 2014 17:19

Pollyanna: Mar 5, 2005; Milk's on them.

I suppose it makes sense. For links, anyway, I had a part where it was a sort-of listlike <h2><p>Section 1</p></h2> <h2><p>Section 2</p></h2> etc., I tried making it into a UL too and it just ended up making it more complicated. I'm still kinda new at figuring out how to wrangle Foundation and similar frameworks into doing what I want it to do :shobon:

I've also got another issue: I have those sections stuck in a grid for anything larger than a small screen. However, if I get all the way right to the end of small, and expand slightly to get past the small screen threshold, the columns pop up but they're running over each other! Is there a way to say "make these into a grid, but if they start to run into each other, get rid of the gridding"?

edit: Fixed it by just making them show up like that on large screens only. Also, does Foundation just not like vertical align or something?

edit 2: For those buttons I was talking about, one does take you elsewhere - but the other pops up a modal to show you a video. Is that technically a list?

Pollyanna fucked around with this message at 18:09 on Jul 14, 2014

# ? Jul 14, 2014 17:31

fuf: Sep 12, 2004; haha

Pollyanna posted:

I'm working with Foundation right now, and I have a couple questions:

Is there a way to modify the stacking/listing of the topbar dropdown menu to make it into a grid instead? On a small screen, the topbar automatically changes a section list into dropdown format, as a vertical stack of links. However, I want that to become a grid on a small screen - without it changing anything on the large screen.

You can do this by modifying the foundation sass file directly (components/_top-bar.scss, check around line 275) or by overriding with your own css. You wanna change it so that the list items keep floating left even on small screens, then do some stuff with the widths. This is the rule you need to edit:

code:

.top-bar-section ul li {
   your css here
}

# ? Jul 14, 2014 19:16

pipes!: Jul 10, 2001; Nap Ghost

use <button> for buttons :mad:

# ? Jul 14, 2014 19:36

Pollyanna: Mar 5, 2005; Milk's on them.

pipes! posted:

use <button> for buttons

They're buttons now

For the other instance of buttons, one of them is not a link or button, is the thing. It's a label, more like, but I want it to be more or less the same kind of element - I just can't figure it out :shepface:

fuf posted:

You can do this by modifying the foundation sass file directly (components/_top-bar.scss, check around line 275) or by overriding with your own css. You wanna change it so that the list items keep floating left even on small screens, then do some stuff with the widths. This is the rule you need to edit:
code:
.top-bar-section ul li {
   your css here
}

drat, I'm using the basic CSS version. I haven't got SCSS going on this machine yet.

I think I understand that I need to change the width of the li elements, but I'm not sure how I'd do that programmatically. I'm playing around with the widths in the topbar, and I'm realizing that having them float left means that I end up with some empty space after the last element - I want a box that spans the full-width of the topbar.

I dunno if I can explain what I'm trying to do with words, sorry.

# ? Jul 14, 2014 20:01

kedo: Nov 27, 2007

Pollyanna posted:

They're buttons now

For the other instance of buttons, one of them is not a link or button, is the thing. It's a label, more like, but I want it to be more or less the same kind of element - I just can't figure it out

code:

<nav>
  <ul>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
  </ul>
  <label for="myButton">This is My Button</label>
  <button id="myButton">Butts</button>
</nav>

Pollyanna posted:

I think I understand that I need to change the width of the li elements, but I'm not sure how I'd do that programmatically. I'm playing around with the widths in the topbar, and I'm realizing that having them float left means that I end up with some empty space after the last element - I want a box that spans the full-width of the topbar.

I dunno if I can explain what I'm trying to do with words, sorry.

Got a screenshot of what you're trying to accomplish? It doesn't sound that complex.

# ? Jul 14, 2014 20:12

Pollyanna: Mar 5, 2005; Milk's on them.

kedo posted:

code:

<nav>
  <ul>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
  </ul>
  <label for="myButton">This is My Button</label>
  <button id="myButton">Butts</button>
</nav>

Got a screenshot of what you're trying to accomplish? It doesn't sound that complex.

The nav stuff is the grid issue I'm working on right now, which I'll cover in a sec. What I want in the little trouble section is something akin to that label-button combo right there, such that the label is floating to the right of and vertically aligned with the button. Does that make sense? Like this:

HTML code:

<button id='my-button'>hello</button>
<label for="my-button" class="panel">hello</label>

except that the height of the panel is equal to that of the button. And it's also not a panel, it's just text.

As for the grid, I'm looking for something sort of like this, except without the white spaces between button groups. Literally like the dropdown menu in grid format.

# ? Jul 15, 2014 00:08

Kobayashi: Aug 13, 2004; by Nyc_Tattoo

Pollyanna posted:

The nav stuff is the grid issue I'm working on right now, which I'll cover in a sec. What I want in the little trouble section is something akin to that label-button combo right there, such that the label is floating to the right of and vertically aligned with the button. Does that make sense? Like this:
HTML code:
<button id='my-button'>hello</button>
<label for="my-button" class="panel">hello</label>
except that the height of the panel is equal to that of the button. And it's also not a panel, it's just text.

As for the grid, I'm looking for something sort of like this, except without the white spaces between button groups. Literally like the dropdown menu in grid format.

I've re-read your posts a few times and I don't understand what you're asking. A quick sketch or screenshot would really be helpful.

# ? Jul 15, 2014 01:16

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

Pollyanna posted:

except that the height of the panel is equal to that of the button. And it's also not a panel, it's just text.

The answer to this basically comes down to "how is everything else structured?"

From what I can gather you just want some text next to a button without a linebreak, in which case you either float the text element or position it absolutely within the container. As Kobayashi says, it's a lot easier to code to a design rather than a description - if it's suitable you can wholesale steal that grid code if you want, because the white spaces between groups is just margin: 0 0 1.25em; applied to the button elements.

# ? Jul 15, 2014 01:30

Pollyanna: Mar 5, 2005; Milk's on them.

Kobayashi posted:

I've re-read your posts a few times and I don't understand what you're asking. A quick sketch or screenshot would really be helpful.

This sorta progression. The typical mobile hamburger dropdown menu except instead of a stacked column of links, it's an n by m grid of buttons. You click on the burger, a grid pops out. I understand how to make a dropdown mobile topbar menu in Foundation, but not how to modify the resulting menu.

I'm not an artist so I really hope that makes sense. :saddowns:

# ? Jul 15, 2014 01:32

Kobayashi: Aug 13, 2004; by Nyc_Tattoo

So you're trying to customize items within the Foundation's hamburger menu? I've never used Foundation, but judging by the Zurb homepage, I'd start with the "off-canvas-list" class and try making the list items display as inline block elements:

code:

.off-canvas-list li {
  display: inline-block;
}

All your ULs should act like rows, and the LIs will act kind of like cells (although you'll have to play around with the layouts).

code:

<nav>
  <ul>
    <li><button>Button!</button></li>
    <li><a href="">Link!</a></li>
    <li>Text!</li>
  </ul>
</nav>

Does the help?

# ? Jul 15, 2014 02:04

Pollyanna: Mar 5, 2005; Milk's on them.

Actually, yeah, I think I get it now. Although it looks sorta like this:

(whoops)

I get that the widths of each li should ideally add up to 100% of the ul element's width, so that they basically form a reactive little grid. I dunno how I would tell Foundation to do that, though. Plus, I don't quite understand why everything has that little white space between them - I can't find an element they belong to, apparently they directly belong to ul or are some sort of background? :psyduck:

Pollyanna fucked around with this message at 02:53 on Jul 15, 2014

# ? Jul 15, 2014 02:45

down with slavery: Dec 23, 2013; STOP QUOTING MY POSTS SO PEOPLE THAT AREN'T IDIOTS DON'T HAVE TO READ MY FUCKING TERRIBLE OPINIONS THANKS

Pollyanna posted:

This sorta progression. The typical mobile hamburger dropdown menu except instead of a stacked column of links, it's an n by m grid of buttons. You click on the burger, a grid pops out. I understand how to make a dropdown mobile topbar menu in Foundation, but not how to modify the resulting menu.

I'm not an artist so I really hope that makes sense.

Use the dev tools to identify the element you want to edit (literally right click -> inspect this element) and add the lines of css to the bottom of your css files ?

If you don't understand how to modify an element on the page you should take a step back and familiarize yourself with HTML/CSS before trying to modify pieces of a framework like Zurb. You're just going to gently caress it up anyhow.

"Why is there white space there" should never be a problem you're asking in this thread unless it's your first post. You've posted how many times in here? Inspect the element, determine if there is margin or padding, etc.

And for god's sake if you're going to poo poo up the thread use something like jsfiddle.net or just post a link to whatever you're working on because you don't even know how to ask a question.

edit. Seriously, you have the fifth most posts in this thread. Read more post less.

down with slavery fucked around with this message at 02:48 on Jul 15, 2014

# ? Jul 15, 2014 02:46

v1nce: Sep 19, 2004; Plant your brassicas in may and cover them in mulch.

down with slavery posted:

you don't even know how to ask a question.

For some reason this bit tickled me in just the right way.

Conceptual question!

Building a site from the ground up, I have call to attach lots of jQuery events to elements willy-nilly through the HTML. 99% of the time I'll use a class name for this, so I end up with lots of crap like:

code:

<button class="magic-button"></button>
$('.magic-button').on('click', function() { doMagicShit(); });

If someone new comes to work on the page and decides to redesign the ".magic-button" element, they might see the class in the CSS and (rightly) think it's only used for styling, and remove it, breaking all my poo poo.
Is there a recognised way to make a differentiation between style classes and javascript classes?

I've read a few posts which advocate instead applying the JavaScript "class" by using a data attribute, effectively:

code:

<button data-js="magic-button"></button>
$('[data-js="magic-button"]').on('click', function() { doMagicShit(); });

To me, this is more keystrokes (boo) and I remember reading that using find-by-attribute-name/value is quite a bit slower if you're using it a lot.

Another alternative is just prefixing "js-" onto class names used by javascript, to avoid the same confusion.

Just wondering if anyone has an opinion, or knows another alternative that's worked well for them?

# ? Jul 15, 2014 07:44

Heskie: Aug 10, 2002

v1nce posted:

I've read a few posts which advocate instead applying the JavaScript "class" by using a data attribute, effectively:
code:
<button data-js="magic-button"></button>
$('[data-js="magic-button"]').on('click', function() { doMagicShit(); });

This is how I did it on a recent project, while it worked for simple things like buttons I had issues with larger widgets. The problem I had was when a child element of was important to the JS. For example, a div wrapper on an accordion widget, where data-js is added to clickable titles. Do I mark all them up with data-js, making GBS threads up the markup? How do you make it clear?

I suppose some form of BEM naming convention could work in this instance?

I'd be interested in how others solve this too

Pollyanna posted:

should I put them in a <ul></ul> instead?

This isn't specific to Foundation, but have a read of this CSS Tricks article, Navigation in Lists: To Be or Not To Be

Pollyanna posted:

I had a part where it was a sort-of listlike <h2><p>Section 1</p></h2> <h2><p>Section 2</p></h2> etc.,

Please don't do this!

# ? Jul 15, 2014 09:45

Lumpy: Apr 26, 2002; La! La! La! Laaaa!; College Slice

v1nce posted:

For some reason this bit tickled me in just the right way.

Conceptual question!

Building a site from the ground up, I have call to attach lots of jQuery events to elements willy-nilly through the HTML. 99% of the time I'll use a class name for this, so I end up with lots of crap like:
code:
<button class="magic-button"></button>
$('.magic-button').on('click', function() { doMagicShit(); });
If someone new comes to work on the page and decides to redesign the ".magic-button" element, they might see the class in the CSS and (rightly) think it's only used for styling, and remove it, breaking all my poo poo.
Is there a recognised way to make a differentiation between style classes and javascript classes?

I've read a few posts which advocate instead applying the JavaScript "class" by using a data attribute, effectively:
code:
<button data-js="magic-button"></button>
$('[data-js="magic-button"]').on('click', function() { doMagicShit(); });
To me, this is more keystrokes (boo) and I remember reading that using find-by-attribute-name/value is quite a bit slower if you're using it a lot.

Another alternative is just prefixing "js-" onto class names used by javascript, to avoid the same confusion.

Just wondering if anyone has an opinion, or knows another alternative that's worked well for them?

One way I have found useful is to have semantic class names. These describe what the thing *is*, so they are A) good for sticking events on, and B) are less likely to be removed because they aren't "Just for hanging CSS on". For example:

HTML code:

<button class="action_button big green">Do something Cool</button>
<button class="cancel_button plain red">cancel</button>
<label class="checkbox_label small secondary_text_color" for="blah">
    <input type="checkbox" id="blah"> Toggle a thing.
</label>

The action_button, cancel_button, and checkbox_label describe the purpose of the element, and the others describe style. You may not even put any CSS rules on the "purpose" selectors to reinforce they are not for style. Obviously you can still run into problems with people removing them, but if you really are running into issues with data attributes being too slow (you tested performance on your page before starting to worry about this, right?

) then it might be something to try.

# ? Jul 15, 2014 12:17

Pollyanna: Mar 5, 2005; Milk's on them.

down with slavery posted:

Use the dev tools to identify the element you want to edit (literally right click -> inspect this element) and add the lines of css to the bottom of your css files ?

If you don't understand how to modify an element on the page you should take a step back and familiarize yourself with HTML/CSS before trying to modify pieces of a framework like Zurb. You're just going to gently caress it up anyhow.

"Why is there white space there" should never be a problem you're asking in this thread unless it's your first post. You've posted how many times in here? Inspect the element, determine if there is margin or padding, etc.

And for god's sake if you're going to poo poo up the thread use something like jsfiddle.net or just post a link to whatever you're working on because you don't even know how to ask a question.

edit. Seriously, you have the fifth most posts in this thread. Read more post less.

Jesus, sorry I stopped on your tail. How else am I supposed to learn if not by asking questions? It's not like I'm just having other people do the work for me, sometimes I get confused while digging into a page and I need clarification on how things work and what I should be looking for.

Heskie posted:

This isn't specific to Foundation, but have a read of this CSS Tricks article, Navigation in Lists: To Be or Not To Be

Thanks for the link! This is a really good website. I kinda agree with not putting a group of buttons or panels in a list, because they don't necessarily have anything in common other than being near each other. I also like the list-less navigation idea, I try not to use lists if it's either not appropriate or I don't absolutely have to. For the navigation, though, Foundation requires me to use ul and li in order to use the Top Bar component.

quote:

Please don't do this!

I have absolutely no clue what I was trying to do with that code snippet. :psyduck:

Whatever it is, it's nowhere in the markup now.

# ? Jul 15, 2014 14:38

down with slavery: Dec 23, 2013; STOP QUOTING MY POSTS SO PEOPLE THAT AREN'T IDIOTS DON'T HAVE TO READ MY FUCKING TERRIBLE OPINIONS THANKS

Pollyanna posted:

Jesus, sorry I stopped on your tail. How else am I supposed to learn if not by asking questions?

http://www.codecademy.com/courses/css-coding-with-style/0/1

Seriously, it's going to be way easier if you take your time and learn about the technologies you're using before diving into a complete front end framework and trying to modify it.

quote:

For the navigation, though, Foundation requires me to use ul and li in order to use the Top Bar component.

It doesn't, http://foundation.zurb.com/docs/components/topbar.html (protip: use the documentation they provide)

You should be using <nav> to hold your menu li's imo.

# ? Jul 15, 2014 15:36

Maluco Marinero: Jan 18, 2001; Damn that's a
fine elephant.

down with slavery posted:

http://www.codecademy.com/courses/css-coding-with-style/0/1

Seriously, it's going to be way easier if you take your time and learn about the technologies you're using before diving into a complete front end framework and trying to modify it.

Yeah. The issue is not your post quantity alone, its that you have been trying to tackle various technologies over the last year without taking even short efforts to learn the fundamentals of how they work.

You're in danger of becoming/remaining a copy pasta programmer for the rest of your career because it feels like you're refusing to actually learn the fundamentals of the trade.

Take a night to work on through some of these code tutorials and understand the basic premises of HTML and CSS. Learn what each tag means semantically, if you had done this you would've never posted a code snippet trying to put a paragraph tag in a header tag.

You can't learn this effectively through Q&A on the forum because you don't know what the right questions are. Use the learning resources until you have enough knowledge that you can ask meaningful targeted questions, otherwise you are wasting your time and crippling your education.

# ? Jul 15, 2014 15:48

Pollyanna: Mar 5, 2005; Milk's on them.

Maluco Marinero posted:

Yeah. The issue is not your post quantity alone, its that you have been trying to tackle various technologies over the last year without taking even short efforts to learn the fundamentals of how they work.

You're in danger of becoming/remaining a copy pasta programmer for the rest of your career because it feels like you're refusing to actually learn the fundamentals of the trade.

Take a night to work on through some of these code tutorials and understand the basic premises of HTML and CSS. Learn what each tag means semantically, if you had done this you would've never posted a code snippet trying to put a paragraph tag in a header tag.

You can't learn this effectively through Q&A on the forum because you don't know what the right questions are. Use the learning resources until you have enough knowledge that you can ask meaningful targeted questions, otherwise you are wasting your time and crippling your education.

I've reviewed the fundamentals over and over, plus I've been exposed to this poo poo for a long time. I know what each tag means, I know how to use them semantically.

I can figure this out by myself, and learn from it. I will be fine.

# ? Jul 15, 2014 15:50

Lumpy: Apr 26, 2002; La! La! La! Laaaa!; College Slice

Pollyanna posted:

Jesus, sorry I stopped on your tail. How else am I supposed to learn if not by asking questions? It's not like I'm just having other people do the work for me, sometimes I get confused while digging into a page and I need clarification on how things work and what I should be looking for.

Nobody wants you to stop asking questions. That said, personally, I wish you would stop asking so many "bad" questions. Your posting history is full of them where it is painfully obvious you have made little or no attempt at :google:

, reading the docs, or simple trial and error. You seem to flit from one project / subject area to the next without ever grasping any of them: ran into a slight roadblock with Bootstrap? Better switch to Foundation and ask all about that!! Your questions tend to have end goals that are vague ("Guys, how do I do a thing?") with no attempt at effort to clearly define what you want to happen, your current state, and what you've done so far to try and get there, so people waste time answering the wrong questions. You don't use the widely available and easy to use tools that would help people help you like JSFiddle or CodePen.

When you first start out doing this stuff, it's exciting, and the desire for immediate results is understandable. I applaud your desire to learn as much as you can as fast as you can. At the end of the day though, you'll be best served by slowing down a little, focusing on the basics and UNDERSTANDING them, rather than asking for one-liners to paste to make it work this very second. Today, don't "accomplish" anything. Read up on chrome's dev tools. Take that code academy class that was linked. And when you do ask questions here, which you should continue to do so, remember that we are not robots. We are people who are taking time away from our work or free time to help you out. Be nice to us and make it as easy as you can for us to help you by being clear.

# ? Jul 15, 2014 15:51

kedo: Nov 27, 2007

down with slavery posted:

edit. Seriously, you have the fifth most posts in this thread. Read more post less.

Where/how do you see this number? Am I winning the thread?

\/\/ :black101:

kedo fucked around with this message at 16:18 on Jul 15, 2014

# ? Jul 15, 2014 15:55

fuf: Sep 12, 2004; haha

http://forums.somethingawful.com/misc.php?action=whoposted&threadid=3554791

yes you are

# ? Jul 15, 2014 15:59

Subjunctive: Sep 12, 2006; ✨sparkle and shine✨

If you want to get actionable feedback, it's often pretty helpful to come in with an opinion. "I want to do X, and here's what I've come up with so far. I'm not super happy with Y or Z, but I like how Q fits together. Anyone have ideas on how I might improve those pieces?" Not only does it show greater depth of consideration, but you're more likely to get reusable advice about how to approach classes of problems.

Someone also mentioned a good front-end news aggregator here or in the front-end thread, which sort of thing can help absorb strategies and approaches.

# ? Jul 15, 2014 16:52

fuf: Sep 12, 2004; haha

Subjunctive posted:

Someone also mentioned a good front-end news aggregator here or in the front-end thread, which sort of thing can help absorb strategies and approaches.

I think it was http://sidebar.io/

(I am just full of helpful links today :v:

)

# ? Jul 15, 2014 17:11

Adbot: ADBOT LOVES YOU

# ? May 9, 2024 20:15

pipes!: Jul 10, 2001; Nap Ghost

Subjunctive posted:

Someone also mentioned a good front-end news aggregator here or in the front-end thread, which sort of thing can help absorb strategies and approaches.

I would also advocate not drinking from the firehose too much until you have a better handle on the basics. Really easy to fall down a frontend dev trend of the moment k-hole without really knowing what you're practicing.

# ? Jul 15, 2014 18:50

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > The Web Design & Development Megathread

«‹›361 »