<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	 xmlns:slash="http://purl.org/rss/1.0/modules/slash/" 
>

<channel>
	<title>Marketing Ninja &#187; Website Development</title>
	<atom:link href="http://www.marketing-ninja.com/category/website-development/feed" rel="self" type="application/rss+xml" />
	<link>http://www.marketing-ninja.com</link>
	<description>The Gruesome Diary of an Online Marketer</description>
	<pubDate>Tue, 23 Dec 2008 21:56:36 +0000</pubDate>
	<generator>http://wordpress.org/?v=2.5.1</generator>
	<language>en</language>
			<item>
		<title>Essential Graphic Design Tools for .NET Developers</title>
		<link>http://www.marketing-ninja.com/old-stuff/essential-graphic-design-tools-for-net-developers/</link>
		<comments>http://www.marketing-ninja.com/old-stuff/essential-graphic-design-tools-for-net-developers/#comments</comments>
		<pubDate>Sun, 27 Jan 2008 21:17:44 +0000</pubDate>
		<dc:creator>Aaronontheweb</dc:creator>
		
		<category><![CDATA[Old Stuff]]></category>

		<category><![CDATA[Website Development]]></category>

		<guid isPermaLink="false">http://www.ajaxninja.com/?p=299</guid>
		<description><![CDATA[On Friday night I decided to sit down and start work on a new project that I had been mulling over for a couple of days, but this time I was going to build the new service from the top-down, rather than from the bottom-up.
I&#8217;d start by building the end user experience first then shape [...]]]></description>
			<content:encoded><![CDATA[<p>On Friday night I decided to sit down and start work on a new project that I had been mulling over for a couple of days, but this time I was going to build the new service from the top-down, rather than from the bottom-up.</p>
<p>I&#8217;d start by building the end user experience first then shape all of my programmatic logic around creating that experience. I sat down and spent some time reading through <a href="http://www.amazon.com/gp/product/0470124482?ie=UTF8&amp;tag=jiidevsblo-20&amp;link_code=as3&amp;camp=211189&amp;creative=373489&amp;creativeASIN=0470124482"><em>Professional ASP.NET 2.0 Design: CSS, Themes, and Master Pages</em></a> (referral link), which was given to me at Christmas but I had yet to actually sit down and digest. I used this text to help guide me through my weekend CSS/graphic design adventure.</p>
<h2>Paint.NET - a Poor Man&#8217;s <em>PhotoShop</em> </h2>
<p>The first order of business, according to Jacob Sanford, the author, is to design yourself a logo around which you style the rest of the site.</p>
<div style="float: left"><a href="http://www.getpaint.net/"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="62" alt="Paint.NET logo" src="http://www.ajaxninja.com/wp-content/uploads/2008/01/paintnet.png" width="241" border="0" title="Essential Graphic Design Tools for .NET Developers" /></a> </div>
<p>I&#8217;m a pretty terrible graphic artist, so I decided to just try and do something simple. I normally use <a href="http://www.gimp.org/">The GIMP</a> since I can&#8217;t afford PhotoShop (I wouldn&#8217;t even know how to use it if I could,) but I had recently been referred to <a href="http://www.getpaint.net/">Paint.NET</a> by a classmate of mine who happens to &quot;get&quot; this whole &quot;art&quot; thing.</p>
<p>Paint.NET turned out to be a better choice than the GIMP for the following reasons:</p>
<ul>
<li>It consumes less system resources than the GIMP; </li>
<li>It has a simpler, less &quot;crowded&quot; interface; </li>
<li>It&#8217;s also free; and </li>
<li>It has a much smoother &quot;drawing canvas,&quot; if you will, for people like me who want to draw rather than edit. </li>
</ul>
<p>Using Paint.NET I threw together a basic logo and banner that I was comfortable with, then I moved onto the next part of the process: putting together a CSS layout.</p>
<h2>BluePrint - a Full CSS Framework</h2>
<div style="float: right"><a href="http://code.google.com/p/blueprintcss/"><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="60" alt="blueprint Essential Graphic Design Tools for .NET Developers" src="http://www.ajaxninja.com/wp-content/uploads/2008/01/blueprint.png" width="244" border="0" title="Essential Graphic Design Tools for .NET Developers" /></a> </div>
<p>CSS is not my forte; I can handle most CSS jobs thrown my way but I am by no means an expert. <a href="http://code.google.com/p/blueprintcss/">BluePrint</a> was designed with people like me in mind; people who may not be brilliant at creating original CSS designs but are clever enough to adapt existing designs in order to suit their needs.</p>
<p>BluePrint offers a solid foundation for doing grid-based design and has a smart system for managing columns, nested columns, rows, all without relying on tables at all. It also has built-in adapters for supporting Internet Explorer-related CSS quirks and a printable version of all of its layouts. I tinkered around with BluePrint and came up with an elegant 2-column design for my new project within a matter of minutes.</p>
<p>It&#8217;s a great framework and I highly recommend it for any CSS-challenged developers out there who just want to build a solid, robust layout without all of the headache that can go into building CSS from scratch.</p>
<h2>ASP.NET 2.0 CSS Friendly Control Adapters</h2>
<p>In chapter 5 of <a href="http://www.amazon.com/gp/product/0470124482?ie=UTF8&amp;tag=jiidevsblo-20&amp;link_code=as3&amp;camp=211189&amp;creative=373489&amp;creativeASIN=0470124482"><em>Professional ASP.NET 2.0 Design: CSS, Themes, and Master Pages</em></a> (referral link) Sanford describes how to use &quot;CSS Friendly Control Adapters&quot; to manipulate the output of complex ASP.NET controls like the GridView, TreeView, Login, Menu, and so on. </p>
<p>When I first started using BluePrint the output from one of my TreeView controls was really wacky, simply because it was trying to output a big mess of nested tables instead of nested list elements. I downloaded and installed the <a href="http://www.asp.net/cssadapters/">ASP.NET 2.0 CSS Friendly Control Adapters</a>, as recommended by Sanford, and edited my TreeView control&#8217;s output so that it would produce more CSS-Friendly output.</p>
<p>I highly recommend getting this adapter toolkit, and having Sanford&#8217;s book to help guide you through the process of modifying the adapters is also very helpful.</p>
<div class="wlWriterSmartContent" id="scid:0767317B-992E-4b12-91E0-4F059A8CECA8:541c0e54-c5a1-4c26-b1bd-2478cc194a3f" style="padding-right: 0px; display: inline; padding-left: 0px; padding-bottom: 0px; margin: 0px; padding-top: 0px">Technorati Tags: <a href="http://technorati.com/tags/Paint.NET" rel="tag">Paint.NET</a>,<a href="http://technorati.com/tags/BluePrint" rel="tag">BluePrint</a>,<a href="http://technorati.com/tags/ASP.NET" rel="tag">ASP.NET</a>,<a href="http://technorati.com/tags/CSS" rel="tag">CSS</a></div>
]]></content:encoded>
			<wfw:commentRss>http://www.marketing-ninja.com/old-stuff/essential-graphic-design-tools-for-net-developers/feed/</wfw:commentRss>
	<slash:comments>4</slash:comments>
	</item>
		<item>
		<title>How to Use Diagramming to Easily Organize and Plan Projects</title>
		<link>http://www.marketing-ninja.com/website-development/how-to-use-diagramming-to-easily-organize-and-plan-projects/</link>
		<comments>http://www.marketing-ninja.com/website-development/how-to-use-diagramming-to-easily-organize-and-plan-projects/#comments</comments>
		<pubDate>Fri, 09 Nov 2007 22:01:53 +0000</pubDate>
		<dc:creator>Aaronontheweb</dc:creator>
		
		<category><![CDATA[Website Development]]></category>

		<category><![CDATA[Productivity]]></category>

		<category><![CDATA[Project Planning]]></category>

		<category><![CDATA[SmartDraw]]></category>

		<guid isPermaLink="false">http://www.ajaxninja.com/?p=244</guid>
		<description><![CDATA[
Software professionals often use diagramming to help explicate their ideas to other technical and non-technical people involved in a project; they&#8217;re also often used by the developers themselves to help them inexpensively model their applications on paper before they sit down and spend considerable time developing the actual application.
I&#8217;m going to walk through a typical [...]]]></description>
			<content:encoded><![CDATA[<p style="float: left"><img src="http://www.ajaxninja.com/wp-content/uploads/2007/11/beep_profile_uml_api-activity1.png" alt="Sample UML Diagram" title="How to Use Diagramming to Easily Organize and Plan Projects" /></p>
<p>Software professionals often use diagramming to help explicate their ideas to other technical and non-technical people involved in a project; they&#8217;re also often used by the developers themselves to help them inexpensively model their applications on paper before they sit down and spend considerable time developing the actual application.</p>
<p>I&#8217;m going to walk through a typical project life cycle and briefly go into some of the diagram types that you can use to help illustrate your ideas and ultimately, increase productivity in your projects.  I&#8217;m sure there are several different diagramming standards that I don&#8217;t cover on this article, but I can&#8217;t sufficiently cover them all (sorry!)</p>
<h3>Brainstorming Phase</h3>
<p>All projects begin with a bit of brainstorming.</p>
<p style="float: left"><img src="http://www.ajaxninja.com/wp-content/uploads/2007/11/mindmap2.png" alt="Mind Mapping Example" title="How to Use Diagramming to Easily Organize and Plan Projects" /></p>
<p><strong>Mind Mapping - Illustrate Your Ideas</strong></p>
<p>All projects begin with an idea, and sometimes you just want to sit down and transcribe your ideas to paper. Mind Mapping diagrams are a simple method of doing that.</p>
<p>You simply begin with <strong>a central idea</strong> and then branch it out into <strong>topics</strong> and <strong>sub-topics</strong>. Mind Mapping software makes it really easy to take a vague idea and organically expand it to a full-bodied concept; in other words, it helps you make the transition from &#8220;idea&#8221; to &#8220;potential project.&#8221;</p>
<p><a href="http://www.youtube.com/watch?v=MlabrWv25qQ">Check out this video</a> for a more full-length exploration into mind mapping. Also, check out Web Worker Daily&#8217;s reviews of <a href="http://webworkerdaily.com/2007/03/08/three-web-based-mind-mapping-tools-reviewed/">three web-based mind mapping tools that you can use to get started</a>.</p>
<h3>End-Product Conceptualization</h3>
<p>Now that you&#8217;ve used mind maps to flesh out your idea into a potential project, it&#8217;s time to move from an idea to a conceptualization of a functional end-product produced by the project.</p>
<p style="float: left"><img src="http://www.ajaxninja.com/wp-content/uploads/2007/11/umlusecase.png" alt="UML Use Case Diagram" title="How to Use Diagramming to Easily Organize and Plan Projects" /></p>
<p><strong>UML Use Case Diagrams - Illustrate How Your End-Product May Be Used</strong></p>
<p>You shouldn&#8217;t begin planning a project and allocating resources for a project until you have a clear idea of how your end-users will actually consume or utilize your product. <strong>UML use case diagrams</strong> help you systematically determine all of the possible ways your product can be consumed by your end-users.</p>
<p>Of course use case diagrams don&#8217;t magically reveal how your product will be used by themselves; they simply help you incrementally iterate through all of the different ways your product can be consumed by different <strong>actors</strong>, or external entities, typically human, who interact with the product.</p>
<p>There are <a href="http://blogs.techrepublic.com.com/programming-and-development/?p=544">a lot of good reasons to use UML use cases in software engineering</a>, but I also think that diagramming use cases is essential to determining if your project creates enough potential value to be worth your development time.</p>
<p style="float: left"><img src="http://www.ajaxninja.com/wp-content/uploads/2007/11/umlclassdiagram.png" alt="UML Class Diagram Example" title="How to Use Diagramming to Easily Organize and Plan Projects" /></p>
<p><strong>UML Class Diagrams - Break Down Your End-Product Into Logically Independent Modules</strong></p>
<p>It&#8217;s essential to break your end-product down into logically independent components. The first reason is that you need to be able to organize individual team member efforts around isolated portions of the project; simply stated, you can&#8217;t have two people writing the same line of code at the same time.</p>
<p>The second reason is that you need to prioritize the components and determine what features or modules need to be developed first. Class diagrams not only help you break a product down to a collection of separate units called <strong>classes</strong>, but they help you understand the functional dependencies between classes.</p>
<p>Lastly, by breaking your product down into smaller sub-units, it&#8217;s easier to plan and schedule different deliverables during the course of production and development.</p>
<h3>Project Planning &amp; Organization</h3>
<p style="float: left"><img src="http://www.ajaxninja.com/wp-content/uploads/2007/11/orgchart.png" alt="Org Chart Example" title="How to Use Diagramming to Easily Organize and Plan Projects" /></p>
<p><strong>Org Charts - Organize Your Human Resources</strong></p>
<p>If you&#8217;re planning a project for a large organization or corporation, chances are that you already have a neatly organized hierarchy.</p>
<p>However, if you have to organize a team from a group of unaffiliated potential team members, an <strong>organizational chart</strong> is a great way to illustrate the delegation management and to help team members know whom to report to.</p>
<p>Org charts are pretty straight forward; if you want to learn <a href="http://management.about.com/cs/peoplemanagement/ht/BuildOrgChart.htm">how to build them in 10 minutes</a>, About.com has a simple tutorial on the subject, which I have linked to.</p>
<p style="float: left"><img src="http://www.ajaxninja.com/wp-content/uploads/2007/11/ganttchart.png" alt="Gantt Chart Example" title="How to Use Diagramming to Easily Organize and Plan Projects" /></p>
<p><strong>Gantt Charts - Plan Your Project&#8217;s Milestones and Schedule Deliverables</strong></p>
<p>Gantt Charts are a commonly used tool for scheduling group tasks, setting milestones, and dates for when deliverables are due. Gantt charts are simply meant to act as a tool for monitoring project progress and determining what tasks are behind schedule and a means of determining what tasks have the highest priority at any given time.</p>
<p>I recommend using them for large projects that consist of a high number of deliverables. Gantt charts make it simple to determine what needs to be worked on in any given day.</p>
<p><strong>There&#8217;s more to diagramming than what I&#8217;ve shown here</strong></p>
<p>While I&#8217;ve delved into Unified Modeling Language somewhat, I&#8217;ve stayed away from a lot of the tools that are used for software-development specifically. The diagram types I have showcased here on AjaxNinja, however, are perfect for assisting in planning projects of any kind. Enjoy.</p>
<p><strong>Photo Credits</strong><br />
All of the diagrams featured in this article were created with <a href="http://www.smartdraw.com/">SmartDraw</a>; most of them are default examples included with SmartDraw Suite, but the one at the top of the article is my own creation.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.marketing-ninja.com/website-development/how-to-use-diagramming-to-easily-organize-and-plan-projects/feed/</wfw:commentRss>
	<slash:comments>5</slash:comments>
	</item>
		<item>
		<title>The 7 Worst Reasons to Start a Website or Blog</title>
		<link>http://www.marketing-ninja.com/website-development/the-7-worst-reasons-to-start-a-website-or-blog/</link>
		<comments>http://www.marketing-ninja.com/website-development/the-7-worst-reasons-to-start-a-website-or-blog/#comments</comments>
		<pubDate>Wed, 03 Oct 2007 15:45:14 +0000</pubDate>
		<dc:creator>Aaronontheweb</dc:creator>
		
		<category><![CDATA[Website Development]]></category>

		<guid isPermaLink="false">http://www.ajaxninja.com/?p=200</guid>
		<description><![CDATA[
Starting a new website can be a lot of fun and it can be a great learning experience; however, a lot of people invest a lot of time and sometimes money into ill-conceived websites or blogs. Today I&#8217;m going to run through 7 bad reasons to start a website; save your time and money and [...]]]></description>
			<content:encoded><![CDATA[<p><!--adsense#programmer--><br />
Starting a new website can be a lot of fun and it can be a great learning experience; however, a lot of people invest a lot of time and sometimes money into ill-conceived websites or blogs. Today I&#8217;m going to run through 7 bad reasons to start a website; save your time and money and heed these warnings.</p>
<p><em>If I violate one of these reasons, should I bother making the website or blog?</em></p>
<p>There are plenty of exceptions, and if it doesn&#8217;t take you a long time to make the website then you should go ahead and do it regardless of how many reasons it violates. It&#8217;s when you have to invest a significant amount of time or money or both that you should question yourself.</p>
<ol>
<li>
<p><strong>Some cool new web technology just hit airwaves </strong>- Let&#8217;s take a look at <a href="http://silverlight.net/">Silverlight</a>, Microsoft&#8217;s brand new cross-browser plug-in for rich media applications for web pages. This technology has had a lot of buzz around it recently and developers/designers are just starting to sink their teeth into it. Right now would be a great time to launch a Silverlight-intensive website to impress clients or other designers, wouldn&#8217;t it? </p>
<p>But how do we know if Silverlight is going to be around for the long run? Will the technology last long enough to merit investing a significant amount of time and money into using it? Given that Silverlight is a Microsoft product the answers to those questions are likely &#8220;yes&#8221; but we do have examples from the past, such as <a href="http://en.wikipedia.org/wiki/VRML#Emergence.2C_popularity.2C_and_decline" title="VRML Popularity and Decline">Virtual Reality Modeling Language (VRML)</a>, which indicate that not all &#8220;hot&#8221; technologies make the cut in the long run.</p>
</li>
<li>
<p><strong>But everyone&#8217;s doing it</strong> - The current social networking fad is a great example; there are a number of organizations attempting to employ social networks in ways which are <a href="http://www.kuwayama.com/the_industry/2007/06/social-networking-fine-line-between.html">utterly asinine</a>. A particularly relevant passage from the old Web 1.0 book on community design, <a href="http://books.google.com/books?id=Jhvfh6thHS8C&amp;dq=&amp;pg=PP1&amp;ots=MmtY4JysJU&amp;sig=hjHb_Lm3_6NHWWhbxFQRATCdFZw&amp;prev=http://www.google.com/search%3Fhl%3Den%26client%3Dfirefox-a%26rls%3Dorg.mozilla%253Aen-US%253Aofficial%26hs%3DK1P%26q%3DDesign%2Bfor%2BCommunity%26btnG%3DSearch&amp;sa=X&amp;oi=print&amp;ct=title"><em>Design for Community</em></a> is one of Derek&#8217;s anecdotes from a meeting he had with a business client (paraphrased):</p>
<blockquote><p>I sat down with the client and listened to one of the executives explain how his company wanted a chat room for their website.</p>
<p>I went on to tell him about how they would need a dynamic web service, more robust hosting, and the approximate cost to develop it.</p>
<p>I then asked the executive &#8220;excuse me, but why do you need a chat room in the first place? Your company sells life insurance.&#8221;</p></blockquote>
<p>It&#8217;s this <em>we have to have it</em> mentality that causes a lot of corporations to get frustrated with new technologies, because they try to employ them without understanding the nature of the technologies and how they are used. I cover this extensively in my <a href="http://www.ajaxninja.com/?p=117"><em>Blogging for Business</em></a> series.</p>
</li>
<li>
<p><strong>A lot of people are talking about&#8230; </strong>- A great way to waste a lot of time and money but perhaps enjoy some temporary success is to chase after a hot topic in the media or on the net and dedicate a website around that single subject. Take the recent Britney Spears controversies for example.</p>
<p>One could probably make a pretty entertaining website making fun of Britney, but ultimately the amount of resonant interest in a website that covers just Britney Spears&#8217; maternal mishaps is going to be very small. What happens once the buzz wears off and the mainstream media moves onto bigger and better things? <em>Your audience goes bye-bye</em>.</p>
<p>Don&#8217;t build a website around a highly temporal or buzz-driven concept; build it around a much sturdier mission statement, one that can ultimately adapt and keep up with environmental changes in its domain.</p>
</li>
<li>
<p><strong>Drinking your own Kool-Aid</strong> - This problem is especially pertinent in Silicon Valley; as Ted from from <a href="http://www.uncov.com/">Uncov</a> pointed out in his most recent article regarding <a href="http://www.uncov.com/2007/10/2/techmeme-leaderboard-yawn">TechMeme&#8217;s new blog leaderboard</a>:</p>
<blockquote><p>It should come as no surprise that only people in Silicon Valley have a nonzero probability of giving a shit about top-N lists like this. Jesus Christ, you guys. Leave your house. Turn off your iPhone. Rob a liquor store. Anything. Just get over yourselves.</p></blockquote>
<p>And as one of Uncov&#8217;s readers aptly pointed out in the comments:</p>
<blockquote><p>The closing paragraph was perfect. The morons in the Valley run around caring about stuff that has absolutely no relevance anywhere else in the world. They&#8217;ve spent entirely too much time reading their own press. I heard a great comment regarding eBay&#8217;s failure with Skype partially being attributed to them being in Silicon Valley and the muddled thinking that goes on there. It was speculated that if they had been in Boston, New York or even LA, they would have never bought Skype because they wouldn&#8217;t be smoking the web-crack.</p></blockquote>
<p>The moral of the story is that your website/blog concept needs to be viewed from a perspective outside of your own in order to be proven. Just because <strong>you</strong> think a website/blog concept is a good idea doesn&#8217;t mean your intended audience will.</p>
</li>
<li>
<p><strong>Well someone else is making a lot of money writing about&#8230;</strong> - A number of websites covering a specific kind of material are receiving a lot of traffic, exposure, and ultimately success; you want to get a piece of the action. That&#8217;s all fine and good, but many upstart webmasters fail utterly in they attempt to charge into a domain with thought leaders who are better funded, more authoritative, and have an established audience. Becoming a fast follower only works if you have one of the following:</p>
<ul>
<li>an entirely unique or distinguishable perspective/authority in the target domain;</li>
<li>more resources than the existing thought leaders;</li>
<li>a pre-established audience from an existing website or blog under your influence;</li>
<li>or large amount of non-monetary resources, such as friends in high places, a social media power user account, software design talent, etc&#8230;</li>
</ul>
<p>YouTube is hands-down the thought leader in the peer-video market, given. Does that mean that other similar services shouldn&#8217;t try and enter the arena? No. Will Ferrell&#8217;s <a href="http://www.funnyordie.com/">FunnyOrDie.com</a>, a peer-video site geared towards sharing funny videos, has been a success because of the website&#8217;s unique perspective and because of Will Ferrell&#8217;s authority as one of the most popular contemporary comedians.</p>
</li>
<li>
<p><strong>I&#8217;m mad as hell and I want to be heard!</strong> - This applies more to blogging than running a website but I&#8217;m sure there are plenty of instances in the traditional website arena where this is applicable. Something in the world happens and it pisses you off; the first thing you want to do is run out and scream about how mad you are.</p>
<p>It&#8217;s fine to be mad, and it&#8217;s fine to vent about it, but if you invest a lot of money into launching a website to express your feelings<strong>, which are often temporary in their nature,</strong> then you&#8217;re stuck with a website that you don&#8217;t need as soon as those feelings pass.</p>
<p>What a waste of money! In addition if you write some especially incendiary content and it gets traced back to you, then you might find yourself in an awkward position with employers and perhaps even the law down the road. Keep your wits about you when you choose to write about controversial or inflammatory subjects.</p>
</li>
<li>
<p><strong>But I didn&#8217;t think anyone would read it&#8230;</strong> - What? This is a reason? Yes. Relating back to my last point, many individuals start websites and use them as personal diaries, recording their feelings on specific subjects, ranting about whatever it is that makes them upset, or disclosing highly personal information. Many of these authors write without the intention of being discovered or noticed; they simply want an online diary so they can express themselves.</p>
<p>On occasion these sites get discovered by employers, loved ones, and friends. If you don&#8217;t want people to read what you&#8217;re writing, you should probably avoid publishing your thoughts on the world&#8217;s most open information platform, or at least use Robots.txt to stave Google off.</p>
</li>
</ol>
<p>There are probably other bad reasons to start websites, but I&#8217;ve found through my own experience that these are the absolute worst. Have you had a different experience? Share it with us in the comments!<br />
<!--adsense#adsense_black_bfb--></p>
]]></content:encoded>
			<wfw:commentRss>http://www.marketing-ninja.com/website-development/the-7-worst-reasons-to-start-a-website-or-blog/feed/</wfw:commentRss>
	<slash:comments>0</slash:comments>
	</item>
		<item>
		<title>Code Sample: GDI+ that Adapts to Your Mobile Browser</title>
		<link>http://www.marketing-ninja.com/website-development/code-sample-gdi-that-adapts-to-your-mobile-browser/</link>
		<comments>http://www.marketing-ninja.com/website-development/code-sample-gdi-that-adapts-to-your-mobile-browser/#comments</comments>
		<pubDate>Thu, 26 Jul 2007 02:54:36 +0000</pubDate>
		<dc:creator>Aaronontheweb</dc:creator>
		
		<category><![CDATA[Website Development]]></category>

		<guid isPermaLink="false">http://www.ajaxninja.com/?p=39</guid>
		<description><![CDATA[I thought I&#8217;d follow up my post 10 great resources for learning GDI+ for ASP.NET 2.0 with the latest code I&#8217;ve rolled out from the AjaxNinja Laboratory. It&#8217;s called Adaptive GDI+ Rendering for Mobile Devices.
Abstract: Web browsers designed for embedded and mobile devices have to conserve memory, network bandwidth, and processing resources given how limited [...]]]></description>
			<content:encoded><![CDATA[<p>I thought I&#8217;d follow up my post <a href="http://www.ajaxninja.com/?p=34" title="10 Great Resources for Learning GDI+ for ASP.NET 2.0" target="_blank">10 great resources for learning GDI+ for ASP.NET 2.0</a> with the latest code I&#8217;ve rolled out from the AjaxNinja Laboratory. It&#8217;s called <strong>Adaptive GDI+ Rendering for Mobile Devices</strong>.</p>
<p><strong>Abstract</strong>: Web browsers designed for embedded and mobile devices have to conserve memory, network bandwidth, and processing resources given how limited those resources are compared to full-fledged computers, thus all browsers for mobile devices (and even computers) carry &#8220;preference&#8221; information to help mobile websites optimize their output for that particular browser.</p>
<p>Some browsers can&#8217;t even support common image types; many mobile devices don&#8217;t even support the increasingly popular <strong>.png</strong> extension. Thus, sometimes it may be to our benefit to detect and anticipate these short comings and adapt to them.</p>
<p><strong>AjaxNinja&#8217;s Solution</strong>: Using the lovely <strong>MobileCapabilities</strong>  class from the <strong>System.Web.Mobile</strong> namespace we can detect the MIME type of the browser&#8217;s preferred image and automatically re-render an existing image or generate an existing image to that type! Of course we may lose a lot of image quality if we&#8217;re moving from a .png to a .gif but it&#8217;s better than the image not being available at all!<br />
<span id="more-39"></span><br />
<strong>The Results</strong>:</p>
<p align="center">Using the popular OpenWave mobile phone simulator (it&#8217;s <strong>image/gif</strong>)</p>
<p><a href="http://www.ajaxninja.com/wp-content/uploads/2007/07/openwave_mobile_adaptive_gdi.PNG" title="OpenWave - Adaptive Rendering with GDI for Mobile Phones"></a></p>
<p style="text-align: center"><a href="http://www.ajaxninja.com/wp-content/uploads/2007/07/openwave_mobile_adaptive_gdi.PNG" title="OpenWave - Adaptive Rendering with GDI for Mobile Phones"><img src="http://www.ajaxninja.com/wp-content/uploads/2007/07/openwave_mobile_adaptive_gdi.PNG" alt="OpenWave - Adaptive Rendering with GDI for Mobile Phones" title="Code Sample: GDI+ that Adapts to Your Mobile Browser" /></a></p>
<p align="center">Using Firefox 2.0</p>
<p align="center"><img src="http://www.ajaxninja.com/wp-content/uploads/2007/07/adaptiveimage.thumbnail.jpg" alt="Firefox - Adaptive Image Rendering" title="Code Sample: GDI+ that Adapts to Your Mobile Browser" /></p>
<p align="center">Using Internet Explorer 6</p>
<p align="center"><img src="http://www.ajaxninja.com/wp-content/uploads/2007/07/adaptiveimage.gif" alt="Internet Explorer - Adaptive Rendering for Mobile Devices" title="Code Sample: GDI+ that Adapts to Your Mobile Browser" /></p>
<p align="left"><strong>Try it yourself at the AjaxNinja Mobile Lab - Adaptive GDI+ Rendering for Mobile Phones</strong>  - Leave a reply or comment with your phone, browser, and results here if you&#8217;d like.</p>
<p align="left"><strong>The Code</strong>:</p>
<p align="left">The first piece of code we have is a static utilities class I wrote that takes an incoming string with MIME type information and translates that data into an <strong>ImageFormat</strong> object that the GDI+ drawing libraries can understand. This also does the reverse operation and provides the MIME type if you&#8217;d like&#8230; It&#8217;s not terribly hard to write.</p>
<blockquote><p>namespace AjaxNinja.Mobile.Graphics<br />
{<br />
public static class MobileGDIUtility<br />
{<br />
public static ImageFormat getFormatPreference(MobileCapabilities mobCaps)<br />
{<br />
//Our return value (eventually)<br />
ImageFormat result;<br />
switch (mobCaps.PreferredImageMime) //Returns the MIME type of the preferred image<br />
{<br />
case &#8220;image/bmp&#8221;: //Bitmap<br />
result = ImageFormat.Bmp;<br />
break;<br />
case &#8220;image/gif&#8221;: //GIF<br />
result = ImageFormat.Gif;<br />
break;<br />
case &#8220;image/jpeg&#8221;: //JPEG<br />
result = ImageFormat.Jpeg;<br />
break;<br />
case &#8220;image/png&#8221;: //PNG<br />
result = ImageFormat.Png;<br />
break;<br />
case &#8220;image/tiff&#8221;: //TIFF<br />
result = ImageFormat.Tiff;<br />
break;<br />
default:<br />
//GIF is a good default value in case we have a fallthrough.<br />
result = ImageFormat.Gif;<br />
break;<br />
}<br />
return result;<br />
}        public static String getMIMEType(ImageFormat format)<br />
{<br />
if(format.Equals(ImageFormat.Bmp)) //Returns the MIME type of the preferred image<br />
return &#8220;image/bmp&#8221;;<br />
if(format.Equals(ImageFormat.Gif)) //GIF<br />
return &#8220;image/gif&#8221;;<br />
if(format.Equals(ImageFormat.Jpeg)) //JPEG<br />
return &#8220;image/jpeg&#8221;;<br />
if(format.Equals(ImageFormat.Png)) //PNG<br />
return &#8220;image/png&#8221;;<br />
if(format.Equals(ImageFormat.Tiff)) //TIFF<br />
return &#8220;image/tiff&#8221;;<br />
return &#8220;text/plain&#8221;; //If we fall all the way through, just return blank text<br />
}<br />
}<br />
}</p></blockquote>
<p>Now we have the <strong>MobileAdaptiveImage.ashx</strong> handler which does all of the real GDI+ work&#8230;</p>
<blockquote><p> public void ProcessRequest (HttpContext context) {<br />
MobileCapabilities mobCaps = (MobileCapabilities)context.Request.Browser;<br />
context.Response.ContentType = mobCaps.PreferredImageMime;</p>
<p>//Because people will want to know who made this heinously easy demo!<br />
String waterMark = &#8220;AjaxNinja&#8221;;</p>
<p>//Notice how I use the mobCaps.ScreenCharactersWidth attribute.. this is for LOWER bounding<br />
//int screenSize = mobCaps.ScreenPixelsWidth &gt; 300 ? 300 : mobCaps.ScreenCharactersWidth;<br />
int screenSize = 144;</p>
<p>System.Drawing.Bitmap bmp = new System.Drawing.Bitmap(screenSize, 100);<br />
System.Drawing.Graphics grphx = System.Drawing.Graphics.FromImage(bmp);<br />
System.Drawing.Font fnt = new System.Drawing.Font(&#8221;Verdana&#8221;, 12); //Verdana size 12</p>
<p>grphx.DrawString(mobCaps.PreferredImageMime, fnt, System.Drawing.Brushes.Yellow, 20, 10);<br />
System.Drawing.Font wm = new System.Drawing.Font(&#8221;Tahoma&#8221;, 8); //Tahoma size 8<br />
grphx.DrawString(waterMark, wm, System.Drawing.Brushes.White, 70, 80);<br />
//Send the image out to the response stream<br />
bmp.Save(context.Response.OutputStream, MobileGDIUtility.getFormatPreference(mobCaps));<br />
wm.Dispose();<br />
fnt.Dispose();<br />
grphx.Dispose(); //Clean-up<br />
bmp.Dispose();<br />
}</p></blockquote>
<p>Lastly we put it all together in <strong>mobileAdaptiveGDI1.aspx</strong></p>
<blockquote><p>&lt;html xmlns=&#8221;http://www.w3.org/1999/xhtml&#8221; &gt;<br />
&lt;body&gt;<br />
&lt;mobile:Form id=&#8221;Form1&#8243; runat=&#8221;server&#8221;&gt;<br />
This image is being rendered according to your mobile device&#8217;s preferences in real time.  &lt;br /&gt;<br />
&lt;mobile:Image Runat=&#8221;server&#8221; ImageUrl=&#8221;AdaptiveImage.ashx&#8221; /&gt;<br />
&lt;mobile:Link ID=&#8221;Link1&#8243; Runat=&#8221;server&#8221; NavigateUrl=&#8221;~/Default.aspx&#8221;&gt;Return to AjaxNinja Labs&lt;/mobile:Link&gt;<br />
&lt;/mobile:Form&gt;<br />
&lt;/body&gt;<br />
&lt;/html&gt;</p></blockquote>
<p>The line to take note of here is this one:</p>
<blockquote><p>&lt;mobile:Image Runat=&#8221;server&#8221; ImageUrl=&#8221;AdaptiveImage.ashx&#8221; /&gt;</p></blockquote>
<p>This is what triggers our HTTPHandler written on the .ashx page to fire and render the image.</p>
<p><strong>Download Source:</strong> <a href="http://www.ajaxninja.com/wp-content/uploads/2007/07/ajaxninja_adaptive_gdi_1_0.zip" title="Adaptive GDI+ Rendering Source Code">Adaptive GDI+ Rendering Source Code</a></p>
<p>If you have any questions, comments, or suggestions, please leave them!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.marketing-ninja.com/website-development/code-sample-gdi-that-adapts-to-your-mobile-browser/feed/</wfw:commentRss>
	<slash:comments>0</slash:comments>
	</item>
		<item>
		<title>10 Great GDI+ Resources for ASP.NET 2.0</title>
		<link>http://www.marketing-ninja.com/website-development/10-great-gdi-resources-for-aspnet-20/</link>
		<comments>http://www.marketing-ninja.com/website-development/10-great-gdi-resources-for-aspnet-20/#comments</comments>
		<pubDate>Tue, 24 Jul 2007 22:37:34 +0000</pubDate>
		<dc:creator>Aaronontheweb</dc:creator>
		
		<category><![CDATA[Website Development]]></category>

		<category><![CDATA[ASP.NET]]></category>

		<category><![CDATA[GDI+]]></category>

		<guid isPermaLink="false">http://www.ajaxninja.com/?p=34</guid>
		<description><![CDATA[GDI+ is the graphics engine used in Windows XP and is made available in the .NET framework for developers like us! GDI+ can be used for dynamic 2-dimensional vector graphics and imaging, which may be helpful for ASP.NET developers like us who want to draw graphs dynamically or programmatically add watermarks to existing images on [...]]]></description>
			<content:encoded><![CDATA[<p>GDI+ is the graphics engine used in Windows XP and is made available in the .NET framework for developers like us! GDI+ can be used for dynamic 2-dimensional vector graphics and imaging, which may be helpful for ASP.NET developers like us who want to draw graphs dynamically or programmatically add watermarks to existing images on our website. You can modify existing images on the fly or create new ones from scratch.<br />
<span id="more-34"></span><br />
I&#8217;m currently working on some GDI+ code that can alter its rendering style based on what the mobile device prefers (some phones prefer GIFs over JPEGs and you can actually check this at run-time using the MobileCapabilities class). My GDI+ code isn&#8217;t running as of writing this but you can check out the demo at our <a href="http://www.ajaxninja.com/lab/mobile/GDITest1/graphInput.aspx" title="AjaxNinja.com - Mobile .NET Lab - GDI+ Dynamic Charts for Mobile Phones" target="_blank">AjaxNinja.com Mobile .NET Lab</a>. Here&#8217;s a quick sample of the render code:<br />
<code>public Bitmap Render(SnapPoll.Types.SnapPoll poll, ImageFormat format)<br />
{<br />
//Start up the image drawing tool<br />
Bitmap bmp = new Bitmap(250, 250);<br />
Graphics g = Graphics.FromImage(bmp);<br />
Rectangle area = new Rectangle(0, 0, 250, 250);<br />
LinearGradientBrush pollBG; //Background gradient for the poll<br />
pollBG = new LinearGradientBrush(area, Color.Black, Color.OrangeRed,<br />
LinearGradientMode.ForwardDiagonal);<br />
g.FillRectangle(pollBG, area);<br />
//Draw the poll header in white<br />
Font f = new Font("Tahoma", 10);<br />
g.DrawString(poll.QuestionText, f, new SolidBrush(Color.White), new Rectangle(0,0, 250, 100));<br />
pollBG.Dispose();<br />
f.Dispose();<br />
g.Dispose();<br />
return bmp;<br />
}</code><br />
Doesn&#8217;t do too much but hey, not had to prove that I&#8217;m legit, right? <img src='http://www.marketing-ninja.com/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' title="10 Great GDI+ Resources for ASP.NET 2.0" /> </p>
<p>Anyways, I&#8217;ve come up with a list of 20 Great GDI+ Resources for ASP.NET 2.0  developers who are looking for some help with dynamically modifying images using ASP.NET.</p>
<p><strong>1. [Book] <a href="http://www.amazon.com/gp/product/0735621772?ie=UTF8&amp;tag=jiidevsblo-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=0735621772">Programming Microsoft  ASP.NET 2.0 Applications: Advanced Topics</a><img src="http://www.assoc-amazon.com/e/ir?t=jiidevsblo-20&amp;l=as2&amp;o=1&amp;a=0735621772" style="border: medium none  ! important; margin: 0px ! important" border="0" height="1" width="1" title="10 Great GDI+ Resources for ASP.NET 2.0" alt=" 10 Great GDI+ Resources for ASP.NET 2.0" /> by Dino Esposito</strong> - I&#8217;m currently reading chapter 9 of , which is a terrific resource for developers like me who have never worked with GDI+ before. I would strongly recommend getting a copy of that book before you try and tackle some really sophisticated GDI+ problems. Chapter 9 spends a lot of time discussing handling images stored in a database using BLOB fields, but towards the end of the chapter he presents some really good examples of using HTTP Handlers to dynamically render images and his book also has a good example on programmatically adding watermarks to existing images.  I also strongly recommend getting Dino&#8217;s <a href="http://www.amazon.com/gp/product/0735621764?ie=UTF8&amp;tag=jiidevsblo-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=0735621764">Programming Microsoft  ASP.NET 2.0 Core Reference</a><img src="http://www.assoc-amazon.com/e/ir?t=jiidevsblo-20&amp;l=as2&amp;o=1&amp;a=0735621764" style="border: medium none  ! important; margin: 0px ! important" border="0" height="1" width="1" title="10 Great GDI+ Resources for ASP.NET 2.0" alt=" 10 Great GDI+ Resources for ASP.NET 2.0" />; I keep that one on my desk and have dog-eared a number of the pages.</p>
<p><em>Disclaimer: If you click on the links for this book and subsequently purchase it, I will receive a small commission from Amazon.com. I only refer products that I actually use and think are worthwhile.</em></p>
<p><strong>2. <a href="http://www.wwwcoder.com/Default.aspx?tabid=68&amp;type=art&amp;site=4023&amp;parentid=256" title="WWWCoder: Working with GDI+ in ASP.NET" target="_blank">WWWCoder: Working with GDI+ in ASP.NET</a></strong> - EXCELLENT step-by-step guide with very compact, yet elegant examples. They show you the code and the images that are produced with every tiny babystep towards making using GDI+ for pretty common uses, such as coding text into images.</p>
<p><strong>3. <a href="http://www.codeproject.com/aspnet/gdiGraph.asp" title="CodeProject: Creating Dynamic Graphs in ASP.NET Using GDI+" target="_blank">CodeProject: Creating Dynamic Graphs in ASP.NET Using GDI+</a></strong> - Does not feature any in-depth information about the GDI+ library itself, but it does offer a custom ASP.NET control for dynamically drawing graphs for your ASP.NET projects and includes the source code for it. If you&#8217;re not as interested in learning GDI+ as you are in rolling something out as quickly as possible, then this is absolutely your best bet.</p>
<p><strong>4. <a href="http://www.developer.com/net/asp/article.php/3676546" title="Developer.com: Animating Graphics in ASP.NET with GDI+" target="_blank">Developer.com: Animating Graphics in ASP.NET with GDI+</a></strong> - Uses an interesting combination of the ASP.NET AJAX 1.0 and GDI+ to create simple GIF-style animations dynamically. Very cool if you&#8217;re trying to set something up that needs to be updated frequently and often in real time, like a clock or a stock ticker. This technique can also be used for updating GDI+ drawings without having to refresh the page (clever)!</p>
<p><strong>5.  <a href="http://www.c-sharpcorner.com/UploadFile/jodonnell/CSHangManASPNET11152005000453AM/CSHangManASPNET.aspx" title="Hangman Game written in C# using GDI+" target="_blank">CSharpCorner.com: Hangman: Using GDI+ in ASP.NET Applications</a></strong> - Very old article circa 2001, but still a neat gimmick if you want to learn about incremental GDI+ drawing during the course of a user session. The author here implements a simple &#8220;Hangman&#8221; game using the GDI+ calls and ASP.NET forms. While someone should rewrite this for ASP.NET 2.0 and AJAX, it&#8217;s still a perfectly good example.</p>
<p><strong>6. <a href="http://www.aspnetlibrary.com/articledetails.aspx?article=Drawing-images-and-bar-charts-with-System.Drawing" title="ASP.NET Library: Drawing Images and Bar Charts in System.Drawing" target="_blank">ASP.NET Library: Drawing Images and Bar Charts with System. Drawing</a></strong> - The most common need for GDI+ or any dynamic graphing applications for the web is charting and graphing data for users. This article gets straight to the meat and potatoes of drawing solid Bar Charts using GDI+. I don&#8217;t like the fact that the article is in VB.NET, but what can you do?</p>
<p><strong>7. <a href="http://www.eggheadcafe.com/tutorials/aspnet/b3501ea8-5426-4b9b-accd-8291f3c89dfe/net-gdi--convert-bitma.aspx" title="EggHeadCafe: Convert Bitmaps to JPEGs with GDI+" target="_blank">EggHeadCafe: Convert Bitmaps (.BMP) to JPEGS (.jpeg) with GDI+</a></strong> - In my attempt to diversify some of the code samples and bring you something other than charting, here is a small code sample that converts a folder of bitmaps to jpegs. Yes, GDI+ does dynamic file conversion too. This article is written in VB.NET but the GDI+ calls from the System.Drawing library are identical to those in C# as they are .NET framework features and not language-specific features.</p>
<p><strong>8.  <a href="http://www.codeproject.com/cs/miscctrl/TransparentDropShadowInCS.asp" title="CodeProject: Transparent drop shadow in C Sharp (GDI+)" target="_blank">CodeProject: Transparent drop shadow in C# (GDI+)</a> </strong>- A more advanced demonstration for those of you who are already familiar with a lot of the ins and outs of GDI+ and are more interested in spiffing up your dynamic images. Transparency is a tricky subject in GDI+ so if you&#8217;re interesting in learning about it then this is a good place to start.</p>
<p>While we&#8217;re on the subject of PNGs and transparency, during my research <a href="http://homepage.ntlworld.com/bobosola/pngtestfixed.htm" title="PNG workaround for IE" target="_blank">I came across an article on how to work around the issues of fuzzy or gray regions that are meant to be transparent in Internet Explorer</a>. It&#8217;s worth a read.</p>
<p><strong>9. <a href="http://codebetter.com/blogs/brendan.tompkins/archive/2004/01/26/6103.aspx" title="Code Better: Using GDI+ to Save Crystal-Clear Images in .NET" target="_blank">Code Better: Using GDI+ to Save Crystal-Clear GIF Images in .NET</a></strong> - On using GDI+to create GIF images and saving them to disk&#8230; The discussion portion at the bottom of the article also has some examples regarding transparency issues if you&#8217;re interested in making transparent GIFs.</p>
<p><strong>10. Removed</strong><br />
Feel free to leave me with any comments, suggestions, or recommendations for this list! I&#8217;m always looking to expand!</p>
<p>There really are not as many resources out there on the rather complex and esoteric subject of GDI+, but I hope I&#8217;ve helped you find some of the better ones.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.marketing-ninja.com/website-development/10-great-gdi-resources-for-aspnet-20/feed/</wfw:commentRss>
	<slash:comments>3</slash:comments>
	</item>
		<item>
		<title>FCKeditor - Awesome, Open Source WYSIWYG Editor</title>
		<link>http://www.marketing-ninja.com/website-development/fckeditor-awesome-open-source-wysiwyg-editor/</link>
		<comments>http://www.marketing-ninja.com/website-development/fckeditor-awesome-open-source-wysiwyg-editor/#comments</comments>
		<pubDate>Wed, 18 Jul 2007 17:46:09 +0000</pubDate>
		<dc:creator>Aaronontheweb</dc:creator>
		
		<category><![CDATA[Website Development]]></category>

		<category><![CDATA[FCKeditor]]></category>

		<category><![CDATA[Web Development]]></category>

		<guid isPermaLink="false">http://www.ajaxninja.com/index.php/2007/07/18/fckeditor-awesome-open-source-wysiwyg-editor/</guid>
		<description><![CDATA[

I was looking through ASP.NET 2.0 Website Programming: Problem - Design - Solution (Programmer to Programmer) at a Borders bookstore last night when I found a complete gem. Over the past couple of weeks I have been wondering if there were any good WYSIWYG Editor controls for ASP.NET, just like the suite I use for [...]]]></description>
			<content:encoded><![CDATA[<p><!--adsense#adsense_blue_bfb--><br />
<!--adsense#top_links_orange--></p>
<p>I was looking through <a href="http://www.amazon.com/gp/product/0764584642?ie=UTF8&amp;tag=jiidevsblo-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=0764584642">ASP.NET 2.0 Website Programming: Problem - Design - Solution (Programmer to Programmer)</a><img src="http://www.assoc-amazon.com/e/ir?t=jiidevsblo-20&amp;l=as2&amp;o=1&amp;a=0764584642" style="border: medium none  ! important; margin: 0pt ! important" border="0" height="1" width="1" title="FCKeditor - Awesome, Open Source WYSIWYG Editor" alt=" FCKeditor - Awesome, Open Source WYSIWYG Editor" /> at a <em>Borders</em> bookstore last night when I found a complete gem. Over the past couple of weeks I have been wondering if there were any good WYSIWYG Editor controls for ASP.NET, just like the suite I use for editing these blog entries, and thanks to this book I finally found one: <a href="http://www.fckeditor.net/" title="FCKeditor" target="_blank">FCKedtior</a>.</p>
<p>FCKeditor is a fully featured <strong>W</strong>hat <strong>Y</strong>ou <strong>S</strong>ee <strong>I</strong>s <strong>W</strong>hat <strong>Y</strong>ou <strong>G</strong>et editor that runs on a whole myriad of web platforms: ASP, ASP.NET, PHP, Ruby, ColdFusion, Plain HTML, PERL, and others. It works FOR EVERYTHING. FCKeditor is especially convienient for <a href="http://wiki.fckeditor.net/Developer%27s_Guide/Integration/ASP.Net">ASP.NET as it has a built-in control that you can add to your Visual Studio 2005 toolbars</a> without a whole lot of work.</p>
<p>You can perform a lot of common markups such as changing font, size, color, adding lists, links, images, and even embedding flash movies! In addition, FCKeditor can be <a href="http://www.fckeditor.net/demo/skins" title="FCKeditor - Skins Demo" target="_blank">skinned</a> to customize the interface for your users AND FCKeditor <a href="http://www.fckeditor.net/demo/language">can support a huge number of languages</a> (Esperanto, what the hell?). In short, as far as the user interface is concerned, FCKeditor is perfect!</p>
<p><a href="http://www.ajaxninja.com/wp-content/uploads/2007/07/fckeditor-11.png" title="FCKeditor - Text View"><img src="http://www.ajaxninja.com/wp-content/uploads/2007/07/fckeditor-11.thumbnail.png" alt="FCKeditor - Text View" border="0" title="FCKeditor - Awesome, Open Source WYSIWYG Editor" />Click for a full sized image</a></p>
<p>Here is a text sample using the FCKeditor&#8230; I didn&#8217;t do much other than make some text bold and some text have an orange background. You can click on the <strong>source</strong> button to view and edit the HTML output produced by the WYSIWYG operations.</p>
<p><a href="http://www.ajaxninja.com/wp-content/uploads/2007/07/fckeditor-2.png" title="FCKeditor - Code View"><img src="http://www.ajaxninja.com/wp-content/uploads/2007/07/fckeditor-2.thumbnail.png" alt="FCKeditor - Code View" border="0" title="FCKeditor - Awesome, Open Source WYSIWYG Editor" />Click for a full-sized image</a><br />
This is what you&#8217;d see in this example if you clicked the <strong>source</strong> button; as you can see the HTML is pretty simple. Click the <strong>source</strong> button again to return to text view.</p>
<p><strong>Caution:</strong> FCKeditor does not have any built-in tools for detecting if your HTML is being tampered with; I was able to insert javascript code into one of my sample posts, so <strong>do not assume that this control has HTML whitelisting protection</strong>. All user input is evil, MAKE SURE you are validating all of it on the server-side; I&#8217;m working right now on a reusable  HTMLWhiteList Validator control for ASP.NET 2.0, but I have a lot of work to do; first step is figuring out what to white list!</p>
<p><!--adsense#chikita_blog_header--></p>
]]></content:encoded>
			<wfw:commentRss>http://www.marketing-ninja.com/website-development/fckeditor-awesome-open-source-wysiwyg-editor/feed/</wfw:commentRss>
	<slash:comments>0</slash:comments>
	</item>
		<item>
		<title>Search Engine Optimization for ASP.NET 2.0</title>
		<link>http://www.marketing-ninja.com/search-engine-marketing/search-engine-optimization-for-aspnet-20/</link>
		<comments>http://www.marketing-ninja.com/search-engine-marketing/search-engine-optimization-for-aspnet-20/#comments</comments>
		<pubDate>Mon, 16 Jul 2007 20:57:22 +0000</pubDate>
		<dc:creator>Aaronontheweb</dc:creator>
		
		<category><![CDATA[Search Engine Marketing]]></category>

		<category><![CDATA[Website Development]]></category>

		<category><![CDATA[ASP.NET]]></category>

		<category><![CDATA[SEO]]></category>

		<guid isPermaLink="false">http://www.ajaxninja.com/index.php/2007/07/16/search-engine-optimization-for-aspnet-20/</guid>
		<description><![CDATA[I had a previous project called VandyStudents (along with a sub-project called VandyWiki)  which I ran mostly for fun and because at the time I created VandyStudents my alma mater, Vanderbilt University, did not have an online news portal. Shortly after the initial release of VandyStudents, Vanderbilt proposed, funded, and set up a Drupal-based [...]]]></description>
			<content:encoded><![CDATA[<p>I had a previous project called <a href="http://www.vandystudents.com/" title="VandyStudents.com - Vanderbilt University's Unofficial Student Community" target="_blank">VandyStudents</a> (along with a sub-project called <a href="http://www.vandywiki.com/" title="VandyWiki - Vanderbilt University's WikiPedia" target="_blank">VandyWiki</a>)  which I ran mostly for fun and because at the time I created VandyStudents my alma mater,<a href="http://www.vanderbilt.edu/" title="Vanderbilt University" target="_blank"> Vanderbilt University</a>, did not have an online news portal. Shortly after the initial release of VandyStudents, Vanderbilt proposed, funded, and set up a <a href="http://www.drupal.org/" title="Drupal" target="_blank">Drupal</a>-based system called <a href="http://www.insidevandy.com" title="InsideVandy" target="_blank">InsideVandy.com</a>, which is now the mainstay of online student media at Vanderbilt. One of reasons why VandyStudents failed draw in the kind of traffic I experienced with my hit project from yesteryear, Ashersworld, is because I designed it in such a way as to make it nearly impossible for Google to query.</p>
<p>AshersWorld was such a huge hit (relatively speaking) simply because it was EASY for Google to query all of its content and I did a good job promoting the site amongst other video gaming outlets, since AshersWorld as a cool new way to rate and share screen shots from video games. VandyStudents was such a dismal failure because I never really managed to reach out to student writers at Vanderbilt and the site was constructed using an architecture not conducive to spidering by search engines, namely a ton of ASP.NET 1.1 postbacks where there should have been hyper links. Take a look at the links on the front page for browsing through the most recent entires and you&#8217;ll see what I mean. They are ALL postbacks, which is a kiss of death if you&#8217;re hoping to make it big with a search engine.</p>
<p>Word of mouth alone isn&#8217;t enough to get a website going, although it will help a ton in the long run; you&#8217;ve got to get listed on search engines in order to reach out to a broader audience. Before I get into the specifics of how to use ASP.NET 2.0 mechanisms to make it easier for search engines discover your site, let me cover some of the basic principles of getting a site discovered.</p>
<p><strong>Cardinal Rule</strong>: <strong>Have Content Worth Finding</strong> - If you have a site with poor content, fix that first before you read the rest of this article.</p>
<p><strong>Have Sites with Similar Content Link to Yours</strong> - This is a great way to improve your PageRank score, so long as the sites linking to you do not violate the cardinal rule! The way I promoted AshersWorld (which is now defunct) was simply by putting a ton of effort into creating a lot of original content, and then I&#8217;d share that content on message boards of similar user communities, and eventually those communities began posting links to my site. If you have quality content, there is no need to be obnoxious.</p>
<p><strong>Use META and Title Tags Effectively</strong> - This is another major breadwinner that is often ignored by web designers. Use Meta and Title Tags to appropriately describe every page on your site, as this will make it easier for Google to assign pageranks for particular keywords. Make sure you are accurate in your use of these META tags. Don&#8217;t describe yourself as an &#8220;Web 2.0 Script Source&#8221; when your website publishes recipes for chocolate chip cookies.</p>
<p><strong>SEO in ASP.NET 2.0</strong></p>
<p>Before I start handing out the links, let me give you one quick lesson from my personal experience&#8230; AVOID POSTBACKS ON .NET CONTROLS LIKE THEY ARE THE PLAGUE. If you use a DataGrid, come up with a custom paging mechanism for your data set that doesn&#8217;t rely on postbacks&#8230; Use AJAX or Query strings instead.</p>
<p>Now for the meat and potatoes&#8230;</p>
<p><strong>General SEO Information</strong></p>
<p><a href="http://seoz.wordpress.com/2007/07/16/search-engine-optimization-factors/trackback/" title="Search Engine Optimization Factors" target="_blank">Search Engine Optimization Factors</a> - Great article on general content and HTML tips to help you optimize your pages for indexing by Google.</p>
<p><strong>General SEO Information with ASP.NET</strong></p>
<p><a href="http://www.amazon.com/gp/product/0470131470?ie=UTF8&amp;tag=jiidevsblo-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=0470131470">Professional Search Engine Optimization with ASP.NET: A Developer&#8217;s Guide to SEO</a><img src="http://www.assoc-amazon.com/e/ir?t=jiidevsblo-20&amp;l=as2&amp;o=1&amp;a=0470131470" style="border:medium none !important;margin:0 !important;" border="0" height="1" width="1" title="Search Engine Optimization for ASP.NET 2.0" alt=" Search Engine Optimization for ASP.NET 2.0" /> - This book doesn&#8217;t come out until September of 2007 but I will be getting a copy of it for sure. Having taught myself ASP.NET, SQL, AJAX from books, I can say that Wrox does a pretty good job.</p>
<p>If you&#8217;re interested in a performing SEO with PHP, check out <a href="http://www.amazon.com/gp/product/0470100923?ie=UTF8&amp;tag=jiidevsblo-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=0470100923">Professional Search Engine Optimization with PHP: A Developer&#8217;s Guide to SEO</a><img src="http://www.assoc-amazon.com/e/ir?t=jiidevsblo-20&amp;l=as2&amp;o=1&amp;a=0470100923" style="border:medium none !important;margin:0 !important;" border="0" height="1" width="1" title="Search Engine Optimization for ASP.NET 2.0" alt=" Search Engine Optimization for ASP.NET 2.0" />, which came out in April of this year (2007).</p>
<p><a href="http://www.wwwcoder.com/main/parentid/457/site/6173/68/default.aspx" target="_blank">WWWCoder: Search Engine Optimziation (SEO) and ASP.NET Developers</a> - Covers some of the issues I described about POST backs and Title/Meta tags but also goes into some issues regarding ASP.NET ViewState and Creating Friendly URLs. I have included a number of links to URL Rewriting scripts and binaries to help you with URL rewriting utilities.</p>
<p><strong>URL Rewriting</strong></p>
<p><u>Code Samples</u>:</p>
<p><a href="http://www.developerfusion.co.uk/show/5302/" target="_blank">URL Rewriting with Regex (Regular Expressions) for ASP.NET 2.0</a><a href="http://www.developerfusion.co.uk/show/5302/" target="_blank"><br />
</a></p>
<p><a href="http://www.codeproject.com/aspnet/urlrewrite.asp" target="_blank"> CodeProject: Simple URL Rewrite for .NET 2.0</a></p>
<p><a href="http://www.15seconds.com/Issue/030522.htm" target="_blank">15Seconds: Rewrite.NET</a></p>
<p><u>Binaries</u>:</p>
<p><a href="http://weblogs.asp.net/scottgu/archive/2006/01/18/435870.aspx" target="_blank">UrlRewritingModule w/ Regular Expression Support for ASP.NET 2.0</a></p>
<p>I haven&#8217;t decided which one of the libraries I am going to use yet, as I have to take the &#8220;shared host&#8221; problem into consideration, but once I do I will provide a review and let everyone know how I liked/didn&#8217;t like it.</p>
<p>-A.S.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.marketing-ninja.com/search-engine-marketing/search-engine-optimization-for-aspnet-20/feed/</wfw:commentRss>
	<slash:comments>2</slash:comments>
	</item>
	</channel>
</rss>

<!-- Dynamic Page Served (once) in 1.049 seconds -->
