Easy to use CSS editor (WYSIWYG)

Discussion in 'Web Design and Development' started by Skechers, Aug 15, 2016.

Tags:
  1. Skechers macrumors newbie

    Joined:
    Aug 15, 2016
    Location:
    Seattle, WA
    #1
    Hi there, new member,

    I'm looking for a CSS editor that provides a visual layout feature.

    I'd like to layout the elements using the mouse drag and drop and if necessary then enter parameters by hand.

    I'd like to do this instead of coding CSS style by hand. Though I'd like to be able view and edit the code by hand if necessary too.

    Most important is ease of use. Second is richness. Third is price ($500 is reasonable for me).

    Thank you, Caesar.
     
  2. HobeSoundDarryl macrumors 604

    HobeSoundDarryl

    Joined:
    Feb 8, 2004
    Location:
    Hobe Sound, FL (20 miles north of Palm Beach)
    #2
  3. Skechers thread starter macrumors newbie

    Joined:
    Aug 15, 2016
    Location:
    Seattle, WA
  4. hwojtek macrumors 65816

    hwojtek

    Joined:
    Jan 26, 2008
    Location:
    A small rural village in western Poland
    #4
    FLUX is a powerful tool, I would however suggest Espresso http://macrabbit.com/espresso/ - the X-Ray live CSS editor capabilities of this app may be of use to the OP.
     
  5. jakeOSX macrumors regular

    Joined:
    Mar 24, 2005
    #5
    second vote for Espresso, it is a fantastic tool all around
     
  6. Skechers, Aug 19, 2016
    Last edited: Aug 19, 2016

    Skechers thread starter macrumors newbie

    Joined:
    Aug 15, 2016
    Location:
    Seattle, WA
    #6
    Yes, Flux was a confusing. There were almost no getting started resources. What there was is a few videos on the web. I still can't figure out how to add some text and style it ...

    I could see it has a lot of features though.

    I'll try this one as well.

    Thank you, Caesar.
    --- Post Merged, Aug 19, 2016 ---
    Well Espresso presents the user with a text editor with no visual controls when creating a new project. I don't know how to open up an existing web page and start editing it.

    The help file is very sparse, no getting started content. Mind you this is the Download version so it may have had features stripped out.
     
  7. hwojtek macrumors 65816

    hwojtek

    Joined:
    Jan 26, 2008
    Location:
    A small rural village in western Poland
    #7
    My advice would be: download a free sample layout from Templated, for example, to your desktop, open the index.html file in Espresso and start exploring.
    I use it solely for CSS X-Ray editing (I used CSSEdit from Macrabbit before, now it's incorporated into Espresso) and find it excellent. That said, your workflow may obviously vary...
     
  8. MechaSpanky macrumors 6502

    MechaSpanky

    Joined:
    Sep 11, 2007
    #8
    Some people in another forum recommended Blocs and it looks pretty slick but I haven't used it myself. It might be what you are looking for. http://blocsapp.com

    Mecha
     
  9. decksnap macrumors 68040

    decksnap

    Joined:
    Apr 11, 2003
    #9
    I have been using CSS Edit for years because i did not like the full-fledged (non-css) features of Espresso when I tried it way back then. How are you getting along using this simply as a CSS editor? Is it simple or do you have to jump through hoops to get the rest of the interface out of your way? Would love to upgrade to something newer that still has the magic of CSS Edit.
     
  10. hwojtek macrumors 65816

    hwojtek

    Joined:
    Jan 26, 2008
    Location:
    A small rural village in western Poland
    #10
    I believe at this version of Espresso, you can actually use it almost exactly as the CSS Edit. It's fully incorporated.
     
  11. iPaintCode macrumors regular

    iPaintCode

    Joined:
    Jun 24, 2012
    Location:
    Metro Detroit
    #11
    Espresso has some great CSS support but sadly it's be dormant and no activity from the developers (MacRabbit). Far as drag and drop and self tweaking, CSS can be finicky especially if you're using less supported cross browser features. Do yourself justice and just take a few free online tutorials from Code Academy or a free trial through Pluralsight and take their CSS3 course. There are other good free sites like Nettuts or the plethora of blog/tutorial sites out there. You can use Atom or Sublime and have it sync changes from DevTools to the css file it has loaded.
     
  12. decksnap macrumors 68040

    decksnap

    Joined:
    Apr 11, 2003
    #12
    I don't have any problems writing CSS by hand, CSS Edit just makes it so much better of an experience. Live preview, x-ray, etc.
     
  13. iPaintCode macrumors regular

    iPaintCode

    Joined:
    Jun 24, 2012
    Location:
    Metro Detroit
    #13
    You could always use CodeKit, it's a super easy app to use and it does live preview and you can use the DevTools to cover all the other bases. For designers or even devs who don't want to setup grunt or gulp just for watch it's a top notch alternative. With a modern editor like Atom, CodeKit and Chrome DevTools, it's a pretty solid setup and you're using all modern tooling not tools that are dated. Though YMMV in this case, use what works best for you.
     
  14. MacSince1985 macrumors 6502

    Joined:
    Oct 18, 2009
    #14
    Not exactly what you're looking for, but I develop with Coda and CodeKit. I write all the styles in LESS (CSS with variables, mixins and more). The autocomplete and syntax highlighting of Coda help reduce mistakes. CodeKit compiles LESS to CSS.
     
  15. baruchsienna macrumors newbie

    baruchsienna

    Joined:
    May 12, 2016
    #15
    Most important is ease of use.

    Check out Sparkle.cx

    I designed a website in no time, and loved doing it.
     

Share This Page