HTML and CSS HELP

Hello everyone
I am new and beginner in HTML and CSS designing, know all the basic concepts but want to move forward to advance level, like using bootstrap
Is there anyone who can help me in this?

Looking forward
Abee

 

Hi Abee!

To know the advance level, better you atten the training instute where you can learn the things professioality.

Regards,Velu

 

Hi Velu

Thankyou for your reply, I just need some verifications on some tasks that either I'm doing right way or not.
As far as training institute, I've already told I know basics just new some help in advance level coding.
I am sure when you were new to CSS, someone had must guide you(everyone needs)

Anyways thankyou, your suggestion is valuable to me

Regards
Abee

 

Well... first off all, if you want to be professional, throw Bootstrap in the trash. That is ineptitude right there, and definitely not something you should play with unless you already know why you shouldn't play with it.

Personally, I usually find it much easier to understand something if I'm trying to solve a specific problem, or achieve something specific in looks/style - that way, you also have code you can paste when asking "is this the right way to do this?".

I also suggest looking through some of the threads on this forum - there are many good tutorials and such hidden away in the depths.

 

Thankyou poPSiCLe but for responsiveness Shouldn't I use bootstrap or do you suggest something else?
and yes I am already checking threads(Lots of questions there so reading them properly for better understanding)

 

No profession who has done any serious evaluation Bootcrap would ever use it or recommend it. It just adds the equivalent of bedbugs to web pages and the bloodsucking Bootcrap classes will make a site unmaintainable. There is no easier, way to do valid high quality then to use a text editor and write your own code.

Professionals don't use junk that restricts us; produces invalid code; or adds bloat to web pages. Bootcrap fails on all three counts and using it ust marks you as a wannabe not capable of doing much more than slopping out cheap mom and pop sites. As for responsiveness, for that you need to learn and understand how each HTML tag works; how each CSS property works; and how to apply presentation over layout without compromising content.

You learn by doing, and using tools that add layers of additional abstraction before you understand how things actually work at the primitive level will just limit you to developing in the low end niche.

 

I'll add two more reasons to not use bootstrap:

Bootstrap is a mobile first paradigm, an absolutely wrong, ignorant and backward approach to device responsiveness. There are several folks, myself included, who have discussed this issue. Search in particular for @deathshadow answers. Start here for a comprehensive write-up.

Bootstrap plugins depend on jQuery. Without it they fail, and not gracefully. That breaks two cardinal rules; bare naked html should be fully functional*, and all bells and whistles (anything other than plain html) should fail without breaking the page. The Bootstrap site actually has the gall to suggest you tell your visitors, via noscript, to turn javascript on and even instruct them on how to do it. Isn't that a kick to the tenders! It is not within the purview of the web author to determine what UA the visitor uses, nor how it is configured. Our job is to deliver a fully functional, accessible and usable web page without regard to which UA is in use.

cheers,

gary

* There is a fundamental difference between web pages and web applications. Don't conflate the two.

 

More so when you consider that there are users and other things accessing your site to which JavaScript provides nothing. How useful is the goofy hover dropdown menu when the browsing device doesn't have hover states like say... on a touch screen. Even though you CAN do it with CSS, the endless pointless idiocy of using Scripting for menus is a major usability issue.

Or when you figure in non-sighted or visually impaired users relying on screen readers (software that reads the screen aloud to you), braille readers, TTY devices or other non-visual user-agents.

Search is similarly impacted -- whilst Google and some others have been implementing hooks to try and figure out what the scripttardery is doing, there's no lack of broken navigation and broken page links the endless pointless scripting for nothing can result in preventing access to. I see it all the time where someone comes to me with a site asking why their subpages content isn't being indexed, and it's because the only way to even GET to those sub-pages is via JavaScript. HERPA! FREAKING! DERP!

Simple fact is HTML is supposed to be a "content delivery system" -- what it's delivering to is SUPPOSED to be every conceivable communication method, not just the magical combination of visual layout and screen size you happen to be lucky enough to sit in front of. It's why HTML tags have MEANINGS separate from their default appearance; so the user-agent (like a browser) can best try to communicate that meaning regardless of the capabilities of the device it's on!

Which is why when "Designing" a layout dicking around with appearance before you have semantic markup of content is utterly and completely back-assward; hence why I keep saying that the PSD jockeys spanking it on the screen to make pretty pictures with their tablets who have the unmitigated GALL to call themselves "designers" generally don't know enough about HTML, CSS or accessibility to be designing jack ****! It's even a laugh when you press them about things like pixel density to legibility, emissive colourspace and legible contrasts they usually have no damned clue what those even are.

It's why I have that "content first" and "progressive enhancement" methodology for building sites that @kk5st linked to. There is so much more to a website than the fancy screen layout nonsense; as I often say you have to consider them stepping stones you need to cross BEFORE worrying about appearance; typically graphics, colours and typography best handled as a "paintover" of a working semi-fluid elastic responsive layout.

As to frameworks, listen to what others have said here -- It's a laugh, I'm usually the ass ranting and raving about the evils of them; kind of warms my three times too small heart to see it rubbing off.

This part:

Once you have a proper command of CSS -- something you should have BEFORE you even LOOK at a framework -- if making a sane and rational accessible layout takes you more than 3k or 250 or so lines of CSS at the end of your screen media stylesheet, you're doing something horrifyingly and terrifyingly WRONG.... like using one of those idiotic 100k+ frameworks like bootcrap. Hence why when you posted:

I kind of had to chuckle, since "advanced level" has no business in the same SENTENCE as nube-predating ignorant halfwit mouthbreathing nonsense like bootcrap. There's a reason I often tell people to go find a stick to scrape it off with before they track it all over a website's carpets.

All things like bootcrap, yui, blueprint, and their kin do is teach you bad HTML habits, teach you to use classes in a presentational manner pissing on the entire notion of separating presentation from content, and teach you how to make more work for yourself. There's an entire development paradigm called "OOCSS" that is similarly flawed and back-assward in thinking, and I have the same feelings towards "preprocessor" nonsense like LESS or SASS. Whenever someone calls it "easier" I'm left utterly and completely flabbergasted as to how more work using more code that makes you write even more code is "easier" -- though after some 38 years of programming and decade and a half of working on websites I fully recognize the phenomenon -- it's the "only tool they know how to use is a hammer" scenario. Suddenly everything looks like nails.

Simple fact is they learned it BEFORE learning the underlying technologies, which leaves them flat footed when it comes to recognizing if such frameworks are actually providing benefits or not.

This extends quite well into JavaScript frameworks too. jQuery being the thousand pound gorilla in the room. It's fat, bloated, clumsy, and 99.99% of what people do with it falls into three categories:

1) Stuff that could have been written cleaner and simpler without jQuery.

2) Stuff that's CSS' job.

3) Stuff that has NO damned business on a website if you actually care about people using it!

The only reason it is popular and common is ignorance, and predators taking advantage of that ignorance. It's the same old story that time and time again has let fancy artists make things that are all cool and flashy to woo the suits with checkbooks, that then turn around and tank the project in question. Doesn't matter if it's Microsoft Bob, IBM OS/2, the PCJr Keyboard, Windows Metro, Moller's Air Car, Google Glass, the Segway, or the king of all abject failures reeking of "gee ain't it neat" bullshit: Clippy.

Two of the leading causes of tech failure are plain as day once you recognize them, someone with something flashy out to make a quick buck by preying on the ignorance of others, or someone having that same flash and flair without the engineering knowledge to support it.

Which is why for example 99% of the stuff at places like ThemeForest and TemplateMonster are outright scam artist hoodoo-voodoo. You might as well be trying to read chicken entrails or the casting of bones for all the good any of that garbage will do you.

MIND YOU, you can make good money being a sleazeball scam artist, just be honest about being dishonest.

Basically best advice I can give you?

1) HTML is for saying what things ARE, not what they look like. As such if you use the style="" attribute you are probably doing something wrong, and if you use the <style> tag you ARE doing something wrong. Hence my saying "if you choose your tags based on the default appearance, you're choosing all the wrong tags for all the wrong reasons"

2) CSS is for what it looks like for specific media targets, which means if you have a <link rel="stylesheet"> without a MEDIA attribute on it, you're doing something wrong.

3) If you can't make the page fully functional without JavaScript FIRST, you probably have no business adding JavaScript to it. This was often cited as the "unwritten rule of JavaScript" -- or at least it was a decade ago before scripttardery and "JS for nothing" became the new thug life.

4) Seriously, take some time to read up on things like the WCAG, and the various web usability articles at the NNGroup.

http://www.w3.org/TR/WCAG20/

http://www.nngroup.com/topic/web-usability/

The WCAG can be a bit of a dry read, but the most important points in that brick of legalese is "use legible colour contrasts", "use dynamic (em) instead of fixed (px) font sizes, paddings, and line heights", "do not design fixed width layouts", and "use semantic markup with graceful degradation techniques".

The NNGroup articles, just keep reading and soak up what you can. There is NO better authority on usability, which is why they piss off the artsy fartsy types more than my posts here do. Seriously, find a "designer" and ask their opinion of Neilsen-Norman; most won't even know what it is, and the ones who do will go into full froth rabid attack mode.

See, NN is based on usability studies and research, not pulling something pretty out of your ass and calling it design.

But then I treat proper web design the same way I would electrical design or mechanical design; there are rules and guidelines and even limitations you have to accept if the result is going to be useful to the end user... and that's why most of the twits calling themselves "designers" will often use "but it limits what I can do visually" as the first of MANY lame excuses for their non-professional (though often very attractive) results.

... as I keep saying time and time again on various forums, it doesn't matter how pretty it is if it gets in the way or outright prevents the user from getting at what they came to your sites for -- the content.

Goes hand in hand with another hard to initially grasp concept for designers and even site owners; The designer should NOT be designing to stroke their own ego, NOR are they designing it for the client or to the clients wants or needs; the purpose of a design is first and foremost to meet the VISITOR's needs.

Two things businessmen and artists, particularly if advertising execs get involved, often lose utter and complete sight of, then wonder why their project is failing miserably inside six months to a year. Small site owners are often their own worst enemy on this one.

But, there are a LOT of lame excuses out there when it comes to web design and development:
http://www.456bereastreet.com/archive/200704/lame_excuses_for_not_being_a_web_professional/

 

It's not a good decision to learn bootstrap first, you must be able to do anything 'manually' to consider yourself developer. But if you want to do it, who am I to judge. Good luck.