11 {{ upvoteCount | shortNum }}
11 {{ upvoteCount | shortNum }}

Best free CSS editor to help me create, modify, & learn coding.

by Robert M Gouge
8 replies
  • WEB DESIGN
    • |
Back in the day, I remember learning to code HTML by using microsoft frontpage and flipping back and forth between editor and WYSIWYG editor. Through the use of this, I became fairly proficient in understanding how the HTML coding worked, commands, and styling.

Fast forward to today, and HTML design is non-existant as all styling is done through CSS. HTML coding seems limited to simply pulling chunks from CSS to create the pages.

I've gradually been learning CSS and I'm proficient enough to do most modifications to existing stylesheets, but creating my own is another story.

I'm finding myself needing more and more custom designs lately and I really need to find a way to produce the results I want without spending a ton on outsourcing, what are mostly simply projects. For example: I'm trying to code two custom opt-in forms through Opt-inSkin and the plugin simply breaks if I only create them with HTML code. CSS is mandatory.

So, can anyone recommend a free CSS/HTML editor that will help me manage these types of projects and learn while I do?
#coding #create #css #editor #free #learn #modify
  • Profile picture of the author ImagineMonkey
    Originally Posted by Robert M Gouge View Post

    HTML coding seems limited to simply pulling chunks from CSS to create the pages.
    Not quite true. HTML is a very important aspect to designing a webpage (html5 specifically). You tie in the CSS to the HTML elements to add design to your structure. Don't discount HTML5 as just "HTML". It's not. The new elements, such as <article>/<section>/<nav>/etc, are very unique to the new standards of web design. I'd suggest learning CSS3 by visiting WC3Schools.com.

    You can also learn many of the CSS3 declarations on the internet.
    Signature
    Imagine Monkey: Designing websites, one banana at a time.

    http://www.ImagineMonkey.com
    {{ DiscussionBoard.errors[6832373].message }}
    • Profile picture of the author Robert M Gouge
      Originally Posted by ImagineMonkey View Post

      Not quite true. HTML is a very important aspect to designing a webpage (html5 specifically). You tie in the CSS to the HTML elements to add design to your structure. Don't discount HTML5 as just "HTML". It's not. The new elements, such as <article>/<section>/<nav>/etc, are very unique to the new standards of web design. I'd suggest learning CSS3 by visiting WC3Schools.com.

      You can also learn many of the CSS3 declarations on the internet.

      I suppose what I meant to say, is that it's not as simple to design a page as when HTML was the standard. It's certainly more complex these days as you generally need a solid knowledge of CSS, HTML, & PHP do to even the most basic of customizations.

      Is there any such thing as a CSS WYSIWYG editor that could help me create things?
      {{ DiscussionBoard.errors[6832483].message }}
  • Profile picture of the author rajeevrla
    Dreamweaver can be used to see runtime changes with CSS, however best way to learn CSS would be to design a page and then use the browser's debugging tool. Chrome and IE has inbuilt. For firefox, firebug is the one you should choose.

    I basically design a wireframe in HTML and basic CSS. Then load that page in firefox and apply the CSS using firefbug to see the actual changes. If I'm satisfied with the look of a particular DIV, I copy the code from firebug and put that to my CSS file. Try it, it's very handy. you'll learn a lot.
    Signature

    Have a great day!

    {{ DiscussionBoard.errors[6832632].message }}
    • Profile picture of the author Robert M Gouge
      Originally Posted by rajeevrla View Post

      Dreamweaver can be used to see runtime changes with CSS, however best way to learn CSS would be to design a page and then use the browser's debugging tool. Chrome and IE has inbuilt. For firefox, firebug is the one you should choose.

      I basically design a wireframe in HTML and basic CSS. Then load that page in firefox and apply the CSS using firefbug to see the actual changes. If I'm satisfied with the look of a particular DIV, I copy the code from firebug and put that to my CSS file. Try it, it's very handy. you'll learn a lot.
      Yea, this is what I've been doing.

      Thanks.
      {{ DiscussionBoard.errors[6833880].message }}
      • Profile picture of the author ronc0011
        My personal favorite is Microsoft's Visual Web Developer Express Edition which is free. VWD is a massively powerful editor It does all the things you mentioned and in fact I think it's an excellent way to learn CSS due in large part to the "code hints", dropdown menus that offer legal elements /attributes as you are coding. This is an amazingly useful feature when you're first learning the language and syntax. Another thing you might find useful is the video tutorials at ASP.NET There are hundreds of hours of free video tutorials though they are mostly aimed at using ASP AND VB.net and C# also MS SQL however they all use the Visual Web Developer Editor so you get lots of live example of how to use the editor also all ASP pages are in fact HTML page and CSS So even though HTML /CSS isn't really the focus of the tutorials it is an inescapable fact of creating any kind of web page.

        Just Google Microsoft Visual Web Developer Express Edition Download. This will take you to the download page where the installer is which will actually install VWD and also MS SQL express. this is actually a waay cool setup where you can develop ASP applications with SQL backend. It's just sooo way cool stuff.
        {{ DiscussionBoard.errors[6835597].message }}
  • Profile picture of the author gamerightnow
    On google search? and at Adobe?
    If you need copy/paste Ajax, PHP, Forms, Logins etc I have those kind of programs, IM me about them. or below
    {{ DiscussionBoard.errors[6853230].message }}
  • Profile picture of the author clickbump
    Originally Posted by Robert M Gouge View Post

    So, can anyone recommend a free CSS/HTML editor that will help me manage these types of projects and learn while I do?
    For the Mac, I can recommend TextWrangler.

    For the PC, I like EditPlus.

    I'm also just now playing around with BluePen > bluePen editor - online visual CSS editor

    Its a live online CSS editor that looks pretty slick although I don't particularly like the fact it requires a js file added to the site. Wish it was just a browser extension.

    Here's a comprehensive list from my favoriate html/css tips site "Smashing Magazine" > http://www.smashingmagazine.com/2008...tors-reviewed/
    Signature
    {{ DiscussionBoard.errors[6856737].message }}
  • Profile picture of the author Abdullah Isa
    To be honest - CSS is such that you do not need an editor to edit it - or rather, you can use a simple Notepad or Notepad ++ (I prefer the second, it color codes elements for you)

    However, the fastest way to achieve what I think you are talking about - to simply modify and see what the results are - would be to use the Firefox browser and then install a free add-on from the official site which allows you to do this.

    There are a few good ones, namely "Web Developer" "Firebug" and "TampaData".

    I hope my answer was helpful.
    {{ DiscussionBoard.errors[6866023].message }}

Trending Topics