Visual Studio Toolbox

Visual Studio Toolbox: Web Essentials and CSSCop

Download this episode

Download Video

Description

In this episode, Mads Kristensen returns to show extensions he wrote to make Web development easier. Mads shows us what's new in the Image Optimizer and how the Web Essentials extension provides a number of features that help you write Web apps faster. He also previews a new extension: CSSCop, which is FXCop for stylesheets.

Demos:

  • Image Optimizer starts around 5:00
  • Web Essentials starts around 9:00
  • CSSCop starts around 33:45

If you missed Mads first appearance on this show, check out Episode 10 and watch Mads show the Web Standards Update for Visual Studio 2010 SP1.

Embed

Format

Available formats for this video:

Actual format may change based on video formats available and browser capability.

    The Discussion

    • mustgetit

      Matt back again Smiley thanks a lot refreshing our memory of 5000 people, like the part 2 web essentials, and why css cant explore all the features. Matt its very nice that you share your experiences web based tools as a part time developer. Recently we have a big project of a hosting firm, and matt,s video help us a lot in optimizing image for their web. yeh matt you are right image optimization play vital role in ranking. Idea of optimizing images through smartshit dot com. Its really amazing that their engine optimize images by it self. Its real time blunder most of web master use to do: not optimizing their images. I am totally agree with you matt that optimizing images can improve your site performance.

    • Sigma54

      This is great! I especially like the live preview option!

      Robert, when you have a stylesheet open, go to the Styles menu at the top and then you can use a designer to make or edit style rules! This is useful for those of us who aren't completely familiar with all the CSS options that are available! VS2010 doesn't have CSS3 in those designers but Expression Web 4 does have some CSS3 options in theirs which is fun to check out... especially the border radius options since it shows a preview of what it will look like as you change the parameters!

    • Serinia

      Big Smile great. love the improvement in writing code, regions/comments. Live preview is time saving! and the optimizer... I`m really glad to have these tools presented.

    • DeadX07

      Very nice tools, they make you quite a bit more productive where it matters for web development. Thanks.

    • itwolf

      Thank you for this video, I will for sure use it in my current project to optimize our images and speedup css coding...

    • programmer

      It is really annoying listening to the presenter smack his lip and have suck a dry mouth. Really good content, but had to tune out because it was ridiculously annoying.

    • programmer

      Really good development though. Didn't mean to be so harsh, but they should lower your mic or edit those sections out. Really awesome work and thank you.

    • Abner

      I find on problem, wheh you create a class on css, like this .class { } and you press the enter button after de close } than put ; after like this };

      I think this occurs because if you especify a propert like margin: 100px and press enter than put ; after.

      I think its a problem put ; when you press enter button after close }

    • Mike

      The Ctrl+arrow key for changing pixels isn't working for me.

    Comments closed

    Comments have been closed since this content was published more than 30 days ago, but if you'd like to continue the conversation, please create a new thread in our Forums, or Contact Us and let us know.