<?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:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Admix Web</title>
	<atom:link href="http://www.admixweb.com/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.admixweb.com</link>
	<description>A blog for web developers to improve and share their knowledge</description>
	<lastBuildDate>Fri, 12 Mar 2010 12:54:48 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.1</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Incredible Examples of Superman Illustrations</title>
		<link>http://www.admixweb.com/2010/03/12/incredible-examples-of-superman-illustrations/</link>
		<comments>http://www.admixweb.com/2010/03/12/incredible-examples-of-superman-illustrations/#comments</comments>
		<pubDate>Fri, 12 Mar 2010 12:54:48 +0000</pubDate>
		<dc:creator>Teylor Feliz</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[inspiration]]></category>

		<guid isPermaLink="false">http://www.admixweb.com/?p=3339</guid>
		<description><![CDATA[
I am sure many designers will agree with me when I say that comic illustrations are amazing, and I never get tired of looking at them.  The core of a good comic is amazing illustrations, because, in my opinion, the words on the page come secondary to the graphic depictions they accompany.  The [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.admixweb.com/wp-content/uploads/2010/03/titlepic.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></p>
<p>I am sure many designers will agree with me when I say that comic illustrations are amazing, and I never get tired of looking at them.  The core of a good comic is amazing illustrations, because, in my opinion, the words on the page come secondary to the graphic depictions they accompany.  The essence of a comic is to lure the reader into an imaginary world through spectacular graphics, which include the use of color, shading, expression, action, and of course characters.  One of the most famous iconic comic characters is the superhero, Superman, which is part of DC Comics.  The coloring of Superman is composed of the three primary colors, Yellow, Blue, and Red, which give an aesthetically pleasing effect to this renowned comic character.  Here are some incredible examples of Superman illustrations for you to enjoy!  Get inspired!</p>
<p><span id="more-3339"></span></p>
<h4>Artist: luxun</h4>
<p><a href="http://luxun.deviantart.com/art/superman-57386921"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermanbyluxun.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: JPRart</h4>
<p><a href="http://jprart.deviantart.com/art/Superman-11149616"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermanbyJPRart.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: JPRart</h4>
<p><a href="http://jprart.deviantart.com/art/Superman-in-flight-87891920"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermanbyJPRart2.jpg" alt="" title="" width="485" height="400" class="alignnone size-full wp-image-3344" /></a></p>
<h4>Artist: JPRart</h4>
<p><a href="http://jprart.deviantart.com/art/Batman-and-Superman-64545242"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermanbatman1.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: Andy Parkart</h4>
<p><a href="http://andyparkart.deviantart.com/art/Superman-Confidential-Cover-63258143"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermanconfidential.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: mbreitweiser</h4>
<p><a href="http://mbreitweiser.deviantart.com/art/Batman-Superman-colored-141013802"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/batmansupermancolored.jpg" alt="" title="" width="485" height="400" class="alignnone size-full wp-image-3354" /></a></p>
<h4>Artist: edbenes</h4>
<p><a href="http://edbenes.deviantart.com/art/Superman-and-Batman-24588730"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermanbatman2.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: Kerong</h4>
<p><a href="http://kerong.deviantart.com/art/Superman-bullet-61348597"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermanbullets.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: dcjosh</h4>
<p><a href="http://dcjosh.deviantart.com/art/Kirby-Superman-Final-64125796"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermanfinal.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: RobHough</h4>
<p><a href="http://robhough.deviantart.com/art/Superman-24435986"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermancar.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: Skage</h4>
<p><a href="http://skage.deviantart.com/art/superman-and-darksied-62672545"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermandarksied.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: Bakanekonei</h4>
<p><a href="http://bakanekonei.deviantart.com/art/Superman-Batman-54-CVR-95607962"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermanbatmanrevenge.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: iANAR</h4>
<p><a href="http://ianar.deviantart.com/art/Batman-and-Superman-7218706"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermanbatman3.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: nefar007</h4>
<p><a href="http://nefar007.deviantart.com/art/superman-69365346"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermanmanofsteel.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: manapul</h4>
<p><a href="http://manapul.deviantart.com/art/Superman-Batman-61-cvr-colors-116526268"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermanbatman4.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: NeMAfronSPAiN</h4>
<p><a href="http://nemafronspain.deviantart.com/art/old-Superman-sketch-107786316"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/sketchsuperman.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: Fikkoro</h4>
<p><a href="http://fikkoro.deviantart.com/art/Superman-53948878"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermanandboy.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
<h4>Artist: Roberto Flores</h4>
<p><a href="http://roberto-flores.deviantart.com/art/Superman-78573816"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/supermanwhite.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.admixweb.com/2010/03/12/incredible-examples-of-superman-illustrations/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Interview with the Web Designer, Damian Herrington</title>
		<link>http://www.admixweb.com/2010/03/10/interview-with-the-web-designer-damian-herrington/</link>
		<comments>http://www.admixweb.com/2010/03/10/interview-with-the-web-designer-damian-herrington/#comments</comments>
		<pubDate>Wed, 10 Mar 2010 18:08:49 +0000</pubDate>
		<dc:creator>Holly Lamarche</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Interview]]></category>

		<guid isPermaLink="false">http://www.admixweb.com/?p=3302</guid>
		<description><![CDATA[
As I have mentioned in our last interview, here at Admix Web we are doing an interview series, where we will conduct informal weekly interviews of fellow designers and developers.  It is our contention that these interviews will not only give us great insight into the people behind the designs, but they will also [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.admixweb.com/wp-content/uploads/2010/03/damianherrington.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></p>
<p>As I have mentioned in our last interview, here at Admix Web we are doing an interview series, where we will conduct informal weekly interviews of fellow designers and developers.  It is our contention that these interviews will not only give us great insight into the people behind the designs, but they will also help with networking, collaboration, and generally getting to know each other on a more personal level.  We are still looking for people to interview, so please contact me at hlamarche[at]Admixweb[dot]com if you are interested in being interviewed or would like to nominate someone for an interview.  Last week, I had the pleasure of interviewing the well-known designer, <a href="http://www.admixweb.com/2010/03/04/interview-brian-k-mcdaniel-of-bkmcdaddy-designs/">Brian K. McDaniel</a> of bkmacdaddy designs.  This week, I went on over to the UK and interviewed the new up and coming UK designer, Damian Herrington.  Enjoy!</p>
<p><span id="more-3302"></span></p>
<h4>Thank you so much for doing this interview for Admix Web.  Can you give us a brief background on yourself?</h4>
<p>Thank you for interviewing me. My name is Damian Herrington, and I am a freelance Web Designer from Hull, East Yorkshire, United Kingdom. My core skills and services are designing and developing user-friendly, innovative and detailed websites. I can also provide content management integration in the form of Wordpress and e-commerce integration in the form of X-Cart.</p>
<h4>Do you consider yourself a web designer, web developer, or both?</h4>
<p>I would consider myself a web designer, but I am not afraid to get my hands dirty and do some developing.</p>
<h4>Why Design/Development as a career?  What were your inspirations for that profession?</h4>
<p>Originally I wanted to be a programmer. I love creating something from nothing, and also I enjoy the pursuit of trial and error when something isn’t going to plan and the self-satisfaction you get from finding the solution. It was in my second year of university that the programming we were doing was going over my head, and I didn’t enjoy it anymore. I then became interested again in designing and developing websites. My inspiration doesn’t necessary come down to a single person or company; it comes down to the enjoyment of the website, where it looks amazing and is very usable, which is a winning combination. I suppose that’s my inspiration in wanting to be really good at web design. </p>
<h4>Are you self-taught or did you study design/development?</h4>
<p>I am mostly self-taught, touching on certain aspects through college and university as the courses were not specific to web design or development but the main impetus has been myself to learn and develop my skills further.</p>
<h4>How many years have you been in the field, and how has the field changed during that time?</h4>
<p>As a profession it has been since May 2009 when I started freelancing. But, web design and development has been with me since college, so about 8 years on and off learning.  I think the main change in this field I have noticed over the years is website quality. If you go back 10 years and look at Microsoft’s website for example, you notice the design is flat and the emphasis was on making sure everybody could see every possible link that the user could ever possibly want to go to. Now websites are about engaging the user experience, the visual elements and the way the information is presented is now well thought out and I think that’s down to the shift being from somebody like a “techie” building a website to now a professional with a background in designing and developing websites. </p>
<h4>Can you describe a day in the life of Damian Herrington?</h4>
<p>As a freelancer I still like to keep my day as structured and regimented as possible, similar to what I would get at a company or agency. So it would go something like this, I get up around 9:30am, breakfast and begin checking e-mails, read some news and blogs, begin working on projects until either 1:00pm or 2:00pm depending on how engrossed I am in my work, have 1 hour for lunch away from the computer, and back to work until around 7:00pm and that’s pretty much it. The day/s I am not working on projects I am marketing and or other administrative tasks. I don’t work weekends unless something really needs doing as I feel like I am never away from the computer otherwise. </p>
<h4>What was your first design you actually marketed? How do you feel about it now? </h4>
<p><img src="http://www.admixweb.com/wp-content/uploads/2010/03/design2.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></p>
<p>Because I have not been in business that long I still use one of the first websites I marketed on my portfolio. I think it’s a nice clean business website. However, I would do so many different things with it now both with its design and development. It’s funny how in a short space of time my techniques differ from when I built that website. Looking at some of the other designs I made for personal work I don’t like them at all, which just shows that designers can always better themselves by learning new things no matter what the experience. </p>
<p><img src="http://www.admixweb.com/wp-content/uploads/2010/03/design1.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></p>
<h4>What are your favorite types of movies and why?</h4>
<p>My favorite types of movie genre are; Thriller, Action, Sci-Fi and Comedy. My favorite films of all time would have to be all the Back To The Futures, Shawshank Redemption, Midnight Express and Iron Man plus many others in my collection. Why? I can&#8217;t really answer that, other than the enjoyment that they bring watching them over and over again. They never lose their appeal. </p>
<h4>What books do you consider must reads?</h4>
<p>Providing you have the time, all books! With regards to design and development when I was writing my dissertation I really enjoyed Jeffrey Zeldman&#8217;s designing with web standards, it&#8217;s a really good book that provides the neccessary foundations for good web standards. Other than that its been a while since I read any design/development orientated books. On my list to read though I would like Smashing Magazine&#8217;s book and also David Airey&#8217;s book, Logo Design Love. Outside of the work world I am currently reading Robinson Crusoe.</p>
<h4>If you could give a Shout Out to someone who has inspired you in your life, but may not know it, who what it be?</h4>
<p>That’s a tough one. Purely from a design point of view it would have to be everybody who I follow on twitter, read their blogs and view their websites on CSS showcase galleries. From the point of view in succeeding in what I love to do and becoming the very best I can possibly be has to go to my mum. </p>
<h4>What is your favorite type of design work? And, what has been your favorite project? </h4>
<p><img src="http://www.admixweb.com/wp-content/uploads/2010/03/wsite.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></p>
<p>I think my favorite type of design has to be something with a grungy element or something that can really let your creativity be exploited. This is a design I am working on currently for a friends’ band. This has allowed me to; I think create a really good theme without any constraints. So I would have to say so far this design has been most enjoyable. </p>
<h4>What is your least favorite type of design work?</h4>
<p>I think my least favorite design work, and I believe it’s the same for most designers is your own website. I have so many ideas, and its difficult to separate those ideas from the good and the insane. Aside from my website I would have to say really minimalist sites. I feel like when I design a minimalist site there is too much space or I should be putting something in a particular place. But again that’s probably down to experience and good use of content placement. </p>
<h4>Explain the significance of your company logo.</h4>
<p> I wanted a logo that was clean, easily memorable and something that signified a connection or a bond between me and my clients and so that’s why it looks similar to an atomic symbol minus the atoms and molecules.</p>
<h4>Are you a Mac or a PC?  Why?</h4>
<p>Mac. I was getting frustrated with my PC, as it just seemed everything that I did, it wanted to take forever or just crash and I had enough. I moved to Linux for a short period of time, but I was unhappy with the lack things I was a custom too. So I moved to Mac and never looked back. Plus you can’t beat how the Mac visually looks internally (OS wise) and externally and all the wonderful applications there are. I do however still use PC for development purposes. </p>
<h4>What design tools do you use?  Which tools would you suggest to fellow designers/developers?</h4>
<p>I use Photoshop for mainly everything. So I would say invest in the creativity suite as you have everything you could ever possibly need. Even though it’s expensive I think it’s worth it in the long run. I also use Illustrator for specific design elements too. Development wise I did use Cyberduck (FTP) and Text-Wrangler (Text editor) both pretty good and free but recently I have been using Coda and I am very impressed. Another excellent application I would suggest to invest in is Little Snapper. It’s nicely built and manages your website snapshots perfectly, ideal for keeping a collection of your favorite websites.</p>
<h4>What does your workspace look like? </h4>
<p><img src="http://www.admixweb.com/wp-content/uploads/2010/03/workspace.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></p>
<p> Not the most interesting of setups, but it gets the job done. I use the Macbook and additional screen for all my daily designing and developing needs. When I need to be in Windows, I use the Mac Mini as my development area so I can stay in Leopard and use Coda and the Macbook dual boots into Windows XP where I use IETester. </p>
<h4>What makes you unique?</h4>
<p>I think being a one-man band I can work more closely and have more time with a client, ensuring their ideas transpire into creating their ideal website. I also believe my punctuality and the ability to help the client in what ever way after the website has been finished is also a bonus rather than just building them a website, taking there money and not having any contact after. </p>
<h4>What are some of the design and development blogs you read on a regular basis, why?</h4>
<p>CSS-Tricks, most of the tuts+ network, Smashing Magazine, Web Designer Depot, Chris Spooner’s blogs, CMD + SHIFT, It’s Nice That, David Airey and FFFFOUND! are just some of the blogs I read. I read these blogs because I love reading and learning about the design and development world and these blogs provide great content.</p>
<h4>Where do you see yourself in 10 years?  Where do you see design, the web, and development in 10 years?</h4>
<p>In 10 years time, I would like to see myself either as a successful freelance web designer or taken the plunge and opened my own design and development studio. I think design won’t change that much, trends will come and go I think the difference will be how users will be able to receive and interact with the content either through mobile development or through your Television.</p>
<h4>Please share some pearls of wisdom for up and coming designers in the field.</h4>
<p>Do what you love and love what you do. Not everything in life is all crumpets and cream so just work hard, never stop learning, stay motivated and stay determined on doing what you want to do or where you want to be. </p>
<h4>How can people get in contact with you?</h4>
<p>You can contact me via my contact form/e-mail address on <a href="http://www.damianherrington.co.uk">my website</a>, <a href="http://twitter.com/iDamianH">twitter</a> or <a href="http://damianherrington.tumblr.com/">Tumblr</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.admixweb.com/2010/03/10/interview-with-the-web-designer-damian-herrington/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
		<item>
		<title>How to Create a Fancy Image Gallery with CSS3</title>
		<link>http://www.admixweb.com/2010/03/08/how-to-create-a-fancy-image-gallery-with-css3/</link>
		<comments>http://www.admixweb.com/2010/03/08/how-to-create-a-fancy-image-gallery-with-css3/#comments</comments>
		<pubDate>Mon, 08 Mar 2010 14:22:38 +0000</pubDate>
		<dc:creator>Teylor Feliz</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[animation]]></category>
		<category><![CDATA[CSS3]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[development]]></category>

		<guid isPermaLink="false">http://www.admixweb.com/?p=3122</guid>
		<description><![CDATA[
Even though CSS3 is still in the development stages, it is the new craze that many web developers are excited about. CSS3 is something that will take web development into newer and greater heights, while modernizing the web and allowing web designers and developers to make their creativity a reality.  CSS3 allows for web [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.admixweb.com/wp-content/uploads/2010/03/imagegallerycss3.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></p>
<p>Even though CSS3 is still in the development stages, it is the new craze that many web developers are excited about. CSS3 is something that will take web development into newer and greater heights, while modernizing the web and allowing web designers and developers to make their creativity a reality.  CSS3 allows for web techniques such as: text shadows, rounded borders, animations, custom web fonts, and much more.  Recently, while talking with colleagues about CSS3 animations, many of them agreed how CSS3 animation is going to replace most of the JavaScript animation once it is supported by all the browsers. However, that is the downside currently to CSS3, because right now the only browsers that support it are Safari and Chrome, even though <a href="http://dev.opera.com/articles/view/css3-transitions-and-2d-transforms/">Opera 10.50</a> is going to support it soon.  Today, I have prepared a tutorial about how to use CSS3 to make an image gallery with animation. I recommend to use one of these browsers to see the animations; however, the gallery is going to be usable in browsers without support of the animation.</p>
<p><span id="more-3122"></span></p>
<h4>HTML Structure</h4>
<p>First of all, we will create an HTML file with the structure below, which is a div tag with gallery as ID that has an unordered list with each item containing two images. The first image is the thumbnail with the class name &#8220;mini&#8221; and the second one is the image to display when with the mouseover action with the class name &#8220;pic&#8221;. </p>

<div class="wp_syntax"><div class="code"><pre class="html4strict" style="font-family:monospace;"><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">div</span> <span style="color: #000066;">id</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;gallery&quot;</span>&gt;</span>
    <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">ul</span>&gt;</span>
        <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen1_small.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;mini&quot;</span> <span style="color: #000066;">width</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #000066;">height</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen1.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;pic&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
        <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen2_small.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;mini&quot;</span> <span style="color: #000066;">width</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #000066;">height</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen2.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;pic&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span>  <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
        <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen3_small.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;mini&quot;</span> <span style="color: #000066;">width</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #000066;">height</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen3.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;pic&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
        <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen4_small.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;mini&quot;</span> <span style="color: #000066;">width</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #000066;">height</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen4.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;pic&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
        <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen5_small.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;mini&quot;</span> <span style="color: #000066;">width</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #000066;">height</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen5.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;pic&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
        <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen6_small.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;mini&quot;</span> <span style="color: #000066;">width</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #000066;">height</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen6.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;pic&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span>  <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
        <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen7_small.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;mini&quot;</span> <span style="color: #000066;">width</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #000066;">height</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen7.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;pic&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
        <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen8_small.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;mini&quot;</span> <span style="color: #000066;">width</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #000066;">height</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen8.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;pic&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
        <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen9_small.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;mini&quot;</span> <span style="color: #000066;">width</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #000066;">height</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen9.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;pic&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span>  <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
        <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen10_small.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;mini&quot;</span> <span style="color: #000066;">width</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #000066;">height</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen10.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;pic&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
        <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen11_small.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;mini&quot;</span> <span style="color: #000066;">width</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #000066;">height</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen11.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;pic&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
        <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen12_small.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;mini&quot;</span> <span style="color: #000066;">width</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #000066;">height</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;100&quot;</span> <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">img</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;images/imagen12.jpg&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;pic&quot;</span>  <span style="color: #66cc66;">/</span>&gt;</span> <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
     <span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">ul</span>&gt;</span>
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">div</span>&gt;</span></pre></div></div>

<h4>Styling with CSS</h4>
<p>The second step is styling the div tag that is going to contain the gallery. The property used from CSS3 is <a href="http://www.w3.org/TR/css3-background/#the-box-decoration-break">box-shadow</a>.</p>

<div class="wp_syntax"><div class="code"><pre class="css" style="font-family:monospace;">&nbsp;
<span style="color: #cc00cc;">#gallery</span> <span style="color: #00AA00;">&#123;</span>
    <span style="color: #000000; font-weight: bold;">border</span><span style="color: #00AA00;">:</span> <span style="color: #933;">10px</span> <span style="color: #993333;">solid</span> <span style="color: #cc00cc;">#1D0C16</span><span style="color: #00AA00;">;</span>
    <span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span> <span style="color: #933;">300px</span><span style="color: #00AA00;">;</span>
    <span style="color: #000000; font-weight: bold;">width</span><span style="color: #00AA00;">:</span> <span style="color: #933;">800px</span><span style="color: #00AA00;">;</span>
    <span style="color: #000000; font-weight: bold;">margin-left</span><span style="color: #00AA00;">:</span> <span style="color: #993333;">auto</span><span style="color: #00AA00;">;</span>
    <span style="color: #000000; font-weight: bold;">margin-right</span><span style="color: #00AA00;">:</span> <span style="color: #993333;">auto</span><span style="color: #00AA00;">;</span>
    <span style="color: #000000; font-weight: bold;">overflow</span><span style="color: #00AA00;">:</span> <span style="color: #993333;">visible</span><span style="color: #00AA00;">;</span>
    <span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span> <span style="color: #cc00cc;">#272229</span><span style="color: #00AA00;">;</span>
    <span style="color: #808080; font-style: italic;">/*box shadow effect in Safari and Chrome*/</span>
    -webkit-box-shadow<span style="color: #00AA00;">:</span> <span style="color: #cc00cc;">#272229</span> <span style="color: #933;">10px</span> <span style="color: #933;">10px</span> <span style="color: #933;">20px</span><span style="color: #00AA00;">;</span>
    <span style="color: #808080; font-style: italic;">/*box shadow effect in Firefox*/</span>
    -moz-box-shadow<span style="color: #00AA00;">:</span> <span style="color: #cc00cc;">#272229</span> <span style="color: #933;">10px</span> <span style="color: #933;">10px</span> <span style="color: #933;">20px</span><span style="color: #00AA00;">;</span>
    <span style="color: #808080; font-style: italic;">/*box shadow effect in IE*/</span>
    filter<span style="color: #00AA00;">:</span> progid<span style="color: #3333ff;">:DXImageTransform</span><span style="color: #6666ff;">.Microsoft</span>.Shadow<span style="color: #00AA00;">&#40;</span><span style="color: #000000; font-weight: bold;">color</span><span style="color: #00AA00;">=</span><span style="color: #ff0000;">'#272229'</span><span style="color: #00AA00;">,</span> Direction<span style="color: #00AA00;">=</span><span style="color: #cc66cc;">135</span><span style="color: #00AA00;">,</span> Strength<span style="color: #00AA00;">=</span><span style="color: #cc66cc;">10</span><span style="color: #00AA00;">&#41;</span><span style="color: #00AA00;">;</span>     
    <span style="color: #808080; font-style: italic;">/*box shadow effect in Browsers that support it, Opera 10.5 pre-alpha release*/</span>
     box-shadow<span style="color: #00AA00;">:</span> <span style="color: #cc00cc;">#272229</span> <span style="color: #933;">10px</span> <span style="color: #933;">10px</span> <span style="color: #933;">20px</span><span style="color: #00AA00;">;</span>
<span style="color: #00AA00;">&#125;</span></pre></div></div>

<p> This margin given to the unordered list sets the position in the center of the div. </p>

<div class="wp_syntax"><div class="code"><pre class="css" style="font-family:monospace;"><span style="color: #cc00cc;">#gallery</span> ul<span style="color: #00AA00;">&#123;</span>
    <span style="color: #808080; font-style: italic;">/* This position the ul content in the middle of the gallery*/</span>
    <span style="color: #000000; font-weight: bold;">margin-left</span><span style="color: #00AA00;">:</span><span style="color: #933;">-30px</span><span style="color: #00AA00;">;</span> 
<span style="color: #00AA00;">&#125;</span></pre></div></div>

<p>Now to each item of the unorded list we eliminate the list style and give a padding of 10 pixels for better appearance and display inline-table to fix the position of the image to display with the mouseover.</p>

<div class="wp_syntax"><div class="code"><pre class="css" style="font-family:monospace;"><span style="color: #cc00cc;">#gallery</span> ul li <span style="color: #00AA00;">&#123;</span>
    <span style="color: #808080; font-style: italic;">/* In order to create the proper effect with hover we should use display inline-table
        This will display the big picture right next to its thumbnail
    */</span>
    <span style="color: #000000; font-weight: bold;">list-style</span><span style="color: #00AA00;">:</span><span style="color: #993333;">none</span><span style="color: #00AA00;">;</span> 
    <span style="color: #000000; font-weight: bold;">display</span><span style="color: #3333ff;">:inline-</span>table<span style="color: #00AA00;">;</span> 
    <span style="color: #000000; font-weight: bold;">padding</span><span style="color: #00AA00;">:</span><span style="color: #933;">10px</span><span style="color: #00AA00;">;</span>	     
 <span style="color: #00AA00;">&#125;</span></pre></div></div>

<p>Here is where we create animation with the CSS property <a href="http://www.w3.org/TR/css3-transitions/">transition</a> which is part of the CSS3. The properties from CSS3 used are <a href="http://www.w3.org/TR/css3-transitions/">transition</a> and <a href="http://www.w3.org/TR/css3-background/#the-box-decoration-break">box-shadow</a>.</p>

<div class="wp_syntax"><div class="code"><pre class="css" style="font-family:monospace;"><span style="color: #808080; font-style: italic;">/* This is the pic to display when the hover action occur over the li that contains the thumbnail  */</span>
<span style="color: #cc00cc;">#gallery</span> ul li .pic<span style="color: #00AA00;">&#123;</span>
    <span style="color: #808080; font-style: italic;">/* Animation with transition in Safari and Chrome */</span>
    -webkit-transition<span style="color: #00AA00;">:</span> all 0.6s ease-in-out<span style="color: #00AA00;">;</span>
    <span style="color: #808080; font-style: italic;">/* Animation with transition in Firefox (No supported Yet) */</span>
    -moz-transition<span style="color: #00AA00;">:</span> all 0.6s ease-in-out<span style="color: #00AA00;">;</span>
    <span style="color: #808080; font-style: italic;">/* Animation with transition in Opera (No supported Yet)*/</span>
    -o-transition<span style="color: #00AA00;">:</span> all 0.6s ease-in-out<span style="color: #00AA00;">;</span>
    <span style="color: #808080; font-style: italic;">/* The the opacity to 0 to create the fadeOut effect*/</span>
   opacity<span style="color: #00AA00;">:</span><span style="color: #cc66cc;">0</span><span style="color: #00AA00;">;</span>
   <span style="color: #000000; font-weight: bold;">visibility</span><span style="color: #00AA00;">:</span><span style="color: #993333;">hidden</span><span style="color: #00AA00;">;</span> 
   <span style="color: #000000; font-weight: bold;">position</span><span style="color: #00AA00;">:</span><span style="color: #993333;">absolute</span><span style="color: #00AA00;">;</span> 
   <span style="color: #000000; font-weight: bold;">margin-top</span><span style="color: #00AA00;">:</span><span style="color: #933;">10px</span><span style="color: #00AA00;">;</span> 
   <span style="color: #000000; font-weight: bold;">margin-left</span><span style="color: #00AA00;">:</span><span style="color: #933;">-20px</span><span style="color: #00AA00;">;</span> 
   <span style="color: #000000; font-weight: bold;">border</span><span style="color: #00AA00;">:</span><span style="color: #933;">1px</span> <span style="color: #993333;">solid</span> <span style="color: #000000; font-weight: bold;">black</span><span style="color: #00AA00;">;</span>
   <span style="color: #808080; font-style: italic;">/*shadow box effect in Safari and Chrome*/</span>
   -webkit-box-shadow<span style="color: #00AA00;">:</span><span style="color: #cc00cc;">#272229</span> <span style="color: #933;">2px</span> <span style="color: #933;">2px</span> <span style="color: #933;">10px</span><span style="color: #00AA00;">;</span>
   <span style="color: #808080; font-style: italic;">/*shadow box effect in Firefox*/</span>
   -moz-box-shadow<span style="color: #00AA00;">:</span><span style="color: #cc00cc;">#272229</span> <span style="color: #933;">2px</span> <span style="color: #933;">2px</span> <span style="color: #933;">10px</span><span style="color: #00AA00;">;</span>
   <span style="color: #808080; font-style: italic;">/*shadow box effect in IE*/</span>
   filter<span style="color: #3333ff;">:progid</span><span style="color: #3333ff;">:DXImageTransform</span><span style="color: #6666ff;">.Microsoft</span>.Shadow<span style="color: #00AA00;">&#40;</span><span style="color: #000000; font-weight: bold;">color</span><span style="color: #00AA00;">=</span><span style="color: #ff0000;">'#272229'</span><span style="color: #00AA00;">,</span> Direction<span style="color: #00AA00;">=</span><span style="color: #cc66cc;">135</span><span style="color: #00AA00;">,</span> Strength<span style="color: #00AA00;">=</span><span style="color: #cc66cc;">5</span><span style="color: #00AA00;">&#41;</span><span style="color: #00AA00;">;</span>
   <span style="color: #808080; font-style: italic;">/*shadow box effect in Browsers that support it, Opera 10.5 pre-alpha release*/</span>
   box-shadow<span style="color: #00AA00;">:</span><span style="color: #cc00cc;">#272229</span> <span style="color: #933;">2px</span> <span style="color: #933;">2px</span> <span style="color: #933;">10px</span><span style="color: #00AA00;">;</span>
<span style="color: #00AA00;">&#125;</span></pre></div></div>

<p>Adding the pointer cursor to the thumbnail at the mouseover action.</p>

<div class="wp_syntax"><div class="code"><pre class="css" style="font-family:monospace;"><span style="color: #cc00cc;">#gallery</span> ul li <span style="color: #6666ff;">.mini</span><span style="color: #3333ff;">:hover</span><span style="color: #00AA00;">&#123;</span>
    <span style="color: #000000; font-weight: bold;">cursor</span><span style="color: #00AA00;">:</span><span style="color: #993333;">pointer</span><span style="color: #00AA00;">;</span>
<span style="color: #00AA00;">&#125;</span></pre></div></div>

<p>To finish we create the effect of the animated gallery, modifying the opacity and height of the image gradually with the mouseover action.</p>

<div class="wp_syntax"><div class="code"><pre class="css" style="font-family:monospace;"><span style="color: #808080; font-style: italic;">/* This create the desired effect of showing the image when we mouseover the thumbnail*/</span>
<span style="color: #cc00cc;">#gallery</span> ul li<span style="color: #3333ff;">:hover </span><span style="color: #6666ff;">.pic</span> <span style="color: #00AA00;">&#123;</span>
    <span style="color: #808080; font-style: italic;">/* width and height is how much the picture is going to growth with the effect */</span>
   <span style="color: #000000; font-weight: bold;">width</span><span style="color: #00AA00;">:</span><span style="color: #933;">200px</span><span style="color: #00AA00;">;</span> 
   <span style="color: #000000; font-weight: bold;">height</span><span style="color: #00AA00;">:</span><span style="color: #933;">200px</span><span style="color: #00AA00;">;</span>
   opacity<span style="color: #00AA00;">:</span><span style="color: #cc66cc;">1</span><span style="color: #00AA00;">;</span> 
   <span style="color: #000000; font-weight: bold;">visibility</span><span style="color: #00AA00;">:</span><span style="color: #993333;">visible</span><span style="color: #00AA00;">;</span> 
   <span style="color: #000000; font-weight: bold;">float</span><span style="color: #00AA00;">:</span><span style="color: #000000; font-weight: bold;">right</span><span style="color: #00AA00;">;</span>
<span style="color: #00AA00;">&#125;</span></pre></div></div>

<ul>
<li style="display:inline"><a href="http://www.admixweb.com/demos/css3gallery/"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/demolink.png" alt="See Demo" title="See Demo" width="114" height="39" /></a></li>
<li style="display:inline"><a href="http://www.admixweb.com/demos/css3gallery/css3gallery.zip"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/downloadlink.png" alt="" title="Download" width="139" height="39" /></a></li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.admixweb.com/2010/03/08/how-to-create-a-fancy-image-gallery-with-css3/feed/</wfw:commentRss>
		<slash:comments>19</slash:comments>
		</item>
		<item>
		<title>30+ Sites to Promote and Submit Your Articles</title>
		<link>http://www.admixweb.com/2010/03/05/3-sites-to-promote-and-submit-your-articles/</link>
		<comments>http://www.admixweb.com/2010/03/05/3-sites-to-promote-and-submit-your-articles/#comments</comments>
		<pubDate>Fri, 05 Mar 2010 13:13:35 +0000</pubDate>
		<dc:creator>Teylor Feliz</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[community links]]></category>
		<category><![CDATA[development]]></category>
		<category><![CDATA[resources]]></category>

		<guid isPermaLink="false">http://www.admixweb.com/?p=3187</guid>
		<description><![CDATA[
Most design and development bloggers post their articles in the more famous websites that accept community news, such as Digg, Reddit, DZone, Design Bump, Stumbleupon, Design Float and The Web Blend, but there are so many other sites out there to help promote your articles.  In this post, I am listing 30+ websites where [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.admixweb.com/wp-content/uploads/2010/03/sitespromote.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></p>
<p>Most design and development bloggers post their articles in the more famous websites that accept community news, such as Digg, Reddit, DZone, Design Bump, Stumbleupon, Design Float and The Web Blend, but there are so many other sites out there to help promote your articles.  In this post, I am listing 30+ websites where you can promote your design and development articles. Even though these websites my not be as well-known as the ones I just mentioned, most have a strong diverse viewing group, which can help to bring unique viewers to your site on a regular basis, as well as increasing the number of incoming links.  Moreover, posting your news in the smaller sites tends to increase collaboration and networking because the people behind these smaller sites are more personal and want you to help them, as much as they want to help you.  I hope you find this list of community news submission sites that fly under the radar useful!  Feel free to add some additional community news sites in the comments section.  Enjoy!</p>
<p><span id="more-3187"></span></p>
<h4>Sites to Post Community News</h4>
<p><a href="http://www.animhut.com/">AnimHut</a><br />
<a href="http://arbent.net/blog/">Arbent</a><br />
<a href="http://www.area1.info">Area 1</a><br />
<a href="http://www.artfans.info/">Art Fan Design</a><br />
<a href="http://www.cancelbubble.com">cancelBubble</a><br />
<a href="http://www.colorburned.com">Color Burned</a><br />
<a href="http://www.crazyleafdesign.com/blog">Crazy Leaf Design</a><br />
<a href="http://www.cre8ivecommando.com">Cre8ive Commando</a><br />
<a href="http://www.cssleak.com">CSS Leak</a><br />
<a href="http://www.cssreflex.com">CSS Reflex</a><br />
<a href="http://www.cssstyle.me">CSS Style</a><br />
<a href="http://www.designdazzling.com">Design Dazzling</a><br />
<a href="http://www.designfollow.com">Design Follow</a><br />
<a href="http://www.designjuices.co.uk">Design Juices</a><br />
<a href="http://www.designyourway.net/blog">Design Your Way</a><br />
<a href="http://www.designrfix.com">DesignrFix</a><br />
<a href="http://www.desizntech.info">Desizn Tech</a><br />
<a href="http://www.favshare.net">FavShare</a><br />
<a href="http://www.graphic-design-links.com">Graphic Design Links</a><br />
<a href="http://www.graphicrating.com">Graphic Rating</a><br />
<a href="http://www.inspiredbit.com">Inspired Bit</a>Instant Shift<br />
<a href="http://www.psdlearning.com">PSD Learning</a><br />
<a href="http://www.quandtnet.com">Quandtnet</a><br />
<a href="http://www.scarletbits.com">Scarlet Bits</a><br />
<a href="http://www.sharebrain.info">ShareBrain</a><br />
<a href="http://skillz-community.net/">Skillz Community</a><br />
<a href="http://www.smashingpost.com">Smashing Post</a><br />
<a href="http://www.speckyboy.com">Speckyboy</a><br />
<a href="http://www.toproundups.com">Top Round Ups</a><br />
<a href="http://www.tripwiremagazine.com">Tripwire Magazine</a><br />
<a href="http://www.visualswirl.com">Visual Swirl</a><br />
<a href="http://www.w3avenue.com">W3Avenue</a><br />
<a href="http://www.webanddesigners.com">Web and Designers</a><br />
<a href="http://www.webdesign-ne.ws">Web Design News</a><br />
<a href="http://www.webdeveloperjuice.com">Web Developer Juice</a><br />
<a href="http://www.wparena.com">WP Arena</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.admixweb.com/2010/03/05/3-sites-to-promote-and-submit-your-articles/feed/</wfw:commentRss>
		<slash:comments>32</slash:comments>
		</item>
		<item>
		<title>Interview: Brian K. McDaniel of bkmcdaddy Designs</title>
		<link>http://www.admixweb.com/2010/03/04/interview-brian-k-mcdaniel-of-bkmcdaddy-designs/</link>
		<comments>http://www.admixweb.com/2010/03/04/interview-brian-k-mcdaniel-of-bkmcdaddy-designs/#comments</comments>
		<pubDate>Thu, 04 Mar 2010 13:13:05 +0000</pubDate>
		<dc:creator>Holly Lamarche</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Interview]]></category>

		<guid isPermaLink="false">http://www.admixweb.com/?p=3133</guid>
		<description><![CDATA[
Two weeks ago, I wrote, We are Calling all Web Designers and Developers: We Want to Know the REAL You, an article where I requested designers and developers to nominate colleagues in the field for an informal interview conducted by myself.  It is my contention that these interviews will not only give us great [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.admixweb.com/wp-content/uploads/2010/03/brianmcdaniel.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></p>
<p>Two weeks ago, I wrote, <a href="http://www.admixweb.com/2010/02/17/calling-all-web-designers-and-developers-i-want-to-know-the-real-you/">We are Calling all Web Designers and Developers: We Want to Know the REAL You</a>, an article where I requested designers and developers to nominate colleagues in the field for an informal interview conducted by myself.  It is my contention that these interviews will not only give us great insight into the people behind the designs, but they will also help with networking, collaboration, and generally getting to know each other on a more personal level.   This is our first interview to be shared with our viewers on Admix Web, and I am honored to say it is a great fellow designer who does so much for the design and development community.  Enjoy this intriguing interview with the non-traditional, unconventional all around great guy, <a href="http://www.bkmacdaddy.com/blog/">Brian K. McDaniel</a>, of <a href="http://www.bkmacdaddy.com/">bkmacdaddy designs</a>.</p>
<p><span id="more-3133"></span></p>
<h4>Thank you for taking the time for this Interview.  Can you tell the viewers a little about yourself?</h4>
<p><img src="http://www.admixweb.com/wp-content/uploads/2010/03/blackwhite.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></p>
<p>My pleasure. I&#8217;m honored to be asked. My life story so far could probably make an interesting book, but I&#8217;ll try to keep it succinct. I grew up in San Francisco, son of a Southern Baptist Pastor. Graduated high school in Honolulu, HI, after we moved there in the middle of my senior year, and started playing in nightclub bands. I am classically trained on the piano from age 7, so I turned those skills into keyboards and lead singing for the next 5+ years. I met my wife while on tour in Guam and we were married 8 months from the day we met. This year we&#8217;ll be celebrating our 21st anniversary! We moved back to San Francisco, had 3 kids over the next few years while I became an operations manager at a distribution center. In the late 90s I utilized my music skills to become an ordained Worship Pastor at a small church in the SF Bay Area, where I started teaching myself web design to create the church&#8217;s website. 6 years later I transitioned to full-time Pastor at one of the largest multi-cultural Baptist churches in the country, but after 5 years focused on growing that church my wife and I became disillusioned with organized religion, packed up everything and moved back to Hawaii, where we tried to make a new start. After 2 years of combining various freelance jobs with operations management at a wine distributor, we decided it was time to get back on the mainland, but weren&#8217;t ready to go back to the Bay Area. So we sold everything that we couldn&#8217;t fit into a 4&#8242; x 6&#8242; shipping crate and moved to Tallahassee, FL, sight unseen. This is when I transitioned into full-time freelance web and graphic design, and so far it has been a blast!</p>
<h4>Do you consider yourself a web designer, web developer, or both?</h4>
<p>I typically use the title &#8220;web designer&#8221; but I do a little bit of everything. I&#8217;m definitely more of a designer than a developer, but I very seldom outsource any development. I&#8217;m not one for titles or for joining in the debates of what they should mean. I just do what I do and strive to do it well.</p>
<h4>Why Design as a career?  What were your inspirations for that profession?</h4>
<p>Well, as you can probably surmise from my bio, I am a bit of a nomad, geographically, spiritually, and philosophically. I am also a lover of creative expression and its mediums. When I came out of high school I had to make a choice between music or graphic design as a career, and I chose music because it is my deepest passion. But after awhile it became apparent that music was not going to pay the bills, and web design was. For me it still involves creative expression, so what&#8217;s better than getting paid to do something you love to do? I truly had no inspirations for the profession. I just started teaching myself how to do it out of curiosity and then necessity; I am completely self taught, and still learning all the time. I started teaching myself on Dreamweaver back in the mid-90s when I purchased my first home computer. Been learning ever since.</p>
<h4>How many years have you been in the field, and how has the field changed during that time?</h4>
<p>By the time this interview is over I&#8217;m going to feel so old! I started in the mid-90s creating websites in Macromedia Fireworks and Dreamweaver, using tables and HTML and all that fun stuff. 15+ years later and the field is always changing. The speed with which technology advances is a challenge to keep up with. Seems like I just got a firm grasp on CSS and XHTML and now I have to learn CSS3 and HTML5! It&#8217;s a lot of fun to learn the new stuff, though, and exciting to see all the things we can do now in comparison to the limitations we used to have.</p>
<h4>Can you describe a day in the life of bkmacdaddy?</h4>
<p>Every day but Sunday (my attempt at a day off) starts at 5am. After feeding the cat and getting my coffee started, I sit at my desk and go through emails, then RSS feeds, then Twitter and any other social media. After 1-2 hours of this I get the days projects started. Since I am a one-man studio, this can be any number of things, from coding email blasts, to writing proposals, to invoicing and accounting, to designing logos, to website design and building. This is, of course, interspersed with getting my kids off to school and on some days my wife to school as well (she&#8217;s getting her cosmetology license at Aveda Institute). Throughout the day I continue to check in with RSS feeds and Twitter because it helps me feel connected. Usually I&#8217;ll stop around noon or 1:00 and make myself something for lunch, which I&#8217;ll eat while watching ESPN Sportscenter or something of that nature. Then back to the desk, where I&#8217;ll continue until around 5:30 or 6, when my family eats dinner. If I am satisfied with where I have left off for the day, I&#8217;ll stop working and usually mess around on twitter for a bit, then recline to the sofa with my wife and kids, a glass of wine or a Bloody Caesar, and whatever&#8217;s on the DVR for that night. I usually go to sleep by 10 or 11, and then start it all over again!</p>
<h4>What does your workspace look like? </h4>
<p><img src="http://www.admixweb.com/wp-content/uploads/2010/03/desk.jpg" alt="" title="" width="485" height="400" class="imagenpost" /></p>
<p>We have a desk on one side of our living room, which I prefer because it keeps me connected to the rest of the family even when I&#8217;m working. I have two 24&#8243; monitors side by side that I do everything on. I keep a notebook, a sketchbook, and usually some kind of beverage within reach at all times. My wife sits across from me where she works on her laptop, so we can face each other. She is a freelance photographer and artist, among other things, so usually we&#8217;re both sitting at the desk working away.</p>
<h4>Would you define yourself as introverted or extroverted? How does that effect client relations?</h4>
<p>I am definitely an introvert, but I have an extrovert side that comes out pretty easily in client situations. I guess all those years on stage in front of people help with that. I am very comfortable dealing with clients because I approach everything with an attitude of treating others the way I want to be treated. This works well for me.</p>
<h4>If you could give a Shout Out to someone who has inspired you in your life, but may not know it, who what it be?</h4>
<p>Probably the whole design community I am getting to know through social media and online interaction. Until recently I didn&#8217;t even know it existed, but I have grown in leaps and bounds since discovering others who share the same interests, skills, challenges, experiences and passions.</p>
<h4>How do you balance your raw inspirations for a project, with the client’s sometimes bad ideas?</h4>
<p>This has been a challenge for me, and I&#8217;ve even written about it on Freelance Folder. Ultimately I try to do everything I can to give the client what they want paired with my own advice, experience and inspiration. Seldom do I have to just suck it up and create &#8220;bad design&#8221;, but it has happened on occasion. In all cases I believe the client deserves to get what they want, since they are paying for it. I just believe it is part of my job to share with them my experience and ideas and reasoning before submitting to their requests.</p>
<h4>What is your favorite type of design work? And, what has been your favorite project?</h4>
<p>I really love designing and building websites. I thrive on the challenge of making everything I envision translate into a functioning website. My favorite project almost always is the one I just finished, so in this case it would be <a href="http://www.m2matiz.com/">m2matiz</a> and <a href="http://www.visitmog.com.au/">visitmog</a></p>
<p><strong>m2matiz</strong><br />
<a href="http://www.m2matiz.com/"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/m2matiz.jpg" alt="" title="m2matiz" width="485" height="400" class="imagenpost" /></a><br />
<strong>visitmog</strong><br />
<a href="http://www.visitmog.com.au/"><img src="http://www.admixweb.com/wp-content/uploads/2010/03/website.jpg" alt="" title="website" width="485" height="400" class="imagenpost" /></a></p>
<h4>Explain the significance of your company name.</h4>
<p>My initials are &#8220;BKM&#8221; so that&#8217;s the start of the name. Years ago someone made a joke about my last name (McDaniel) and called me the &#8220;Mack Daddy&#8221;, which I thought was funny and yet fitting in my aspirations as a designer &#8211; to be the &#8220;Mack Daddy of design&#8221; would mean to me that I was one of the top in my field. I still don&#8217;t believe I&#8217;m anywhere close to that aspiration, but I love the humor of the name and the goal it sets for me, as well as the curiosity it inspires in others who see it. I get asked about it often, and it&#8217;s fun to explain.</p>
<h4>What design tools do you use?  Which tools would you suggest to fellow designers/developers?</h4>
<p>Adobe CS4 Master Suite for pretty much everything. I learned on Fireworks and Dreamweaver back when Macromedia first put them out, so I still use Fireworks for 80% of my design work, code websites in Dreamweaver (code view only &#8211; never liked WYSIWYG editors), and print work in either Photoshop, Illustrator and/or InDesign. I see these tools as the industry standards, but I really haven&#8217;t used much else so that would be all I could recommend.</p>
<h4>Do you work better under pressure or do you need time to cultivate your ideas?</h4>
<p>Both. I thrive on pressure and I am the type of person that never likes to stop in the middle of things. Combine that with my laid back attitude and high patience level and it really works well for pressure situations. But good ideas don&#8217;t always come immediately, so the cultivation aspect usually works well for me too. When I&#8217;m working against a tight deadline, the finished project tends to undergo a metamorphosis along the way anyway, so I think it lends to cultivation while still pushing forward. But I really love the pressure of deadlines (most of the time).</p>
<h4>Tell me about the Blog:  What made you start it and why do you write?</h4>
<p>I started the blog for a few reasons. First off, I love to express myself, my thoughts, my beliefs and ideas through writing. I have experience teaching and writing curriculum, as well as my pastoral and leadership background, which breeds a passion for sharing, helping, teaching, discussing and learning through the interaction that can happen on a blog. Second, I knew that the blog would help my business in several ways. It would improve my website&#8217;s SEO, it would enable others to gain insight into who I am and my approach to my business and to life, and it would create another place for me to connect with people. Most everything I write on the blog is inspired from an experience or a need I&#8217;ve witnessed. It is a true creative outlet for me, and I wish I had time to do it more often. But it has also opened doors for me to write and share on other blogs, such as this one!</p>
<h4>You seem so energetic, as if you never get burnout.  What keeps you motivated?</h4>
<p>I honestly don&#8217;t know why I don&#8217;t get burned out. I feel like I should with the ridiculous schedule I keep, but I guess when you are in a situation that allows you to do something you truly love, with people you respect and enjoy, while still getting to spend a lot of time with those that are most important to you (my wife and children) there really is not a down side. My motivation is my passion for all of those things. Whenever I think about getting tired, I just look at my kids and my wife and I am reminded why I do what I do. Giving them a life that, while not lavish, is genuine and decent and full of real love is enough to keep me going no matter what. Besides, it takes way more energy to be negative.</p>
<h4>My favorite quote is, “Life is what happens when you are busy making plans.”  Are you are planner or a doer?</h4>
<p>Both. I&#8217;m an analytical thinker, so I like to examine things from every angle and determine the best course of action. But I also have lived long enough to realize that spontaneity is the lifeblood of adventure, and I want to reach the end of my life knowing that I have experienced every adventure I possibly can. I don&#8217;t see the point in having a 5-year plan for my life. I have goals, but I don&#8217;t necessarily have them etched in stone. I prefer to live in flexibility, and this makes life more interesting and exciting. For instance, when we decided to move from SF to Hawaii, we raised the money and made the move in less than 4 months. Likewise, when we decided to move to Florida, we did it in 3 months. We didn&#8217;t take the &#8220;reasonable&#8221; amount of time to save up the amount of money we probably should have, but just believed we could make it work simply because we set our minds to it. To me, life without risk is a waste of time.</p>
<h4>Where do you see yourself in 10 years? </h4>
<p>I have no idea. I stopped trying to make predictions for myself or others years ago. I live day by day, because no matter how much I think I know, I will never be able to predict what will happen next. At our wedding reception I was asked what my expectations were for our marriage. My response: &#8220;I have no expectations; therefore I will have no disappointments.&#8221; I still live that way.</p>
<h4>Please share some pearls of wisdom for up and coming designers in the field.</h4>
<p>When people ask me for advice, I have the same answer no matter what the field. Pursue your dreams with everything in you. If you fail, at least you know you gave it your all. If you succeed, you reap the joy of obtaining your heart&#8217;s desire. Either way, in my book, you&#8217;ve succeeded. This world needs people who have thrown caution to the wind and pursued their passions with wild abandon. Those are the people who will not just make a difference in this world, but will make this world different. That&#8217;s who I want to be, and that&#8217;s the kind of people I want to associate myself with.</p>
<h4>How can people get in contact with you?</h4>
<p><img src="http://www.admixweb.com/wp-content/uploads/2010/03/picture11.jpg" alt="" title="picture1" width="485" height="400" class="imagenpost" /></p>
<p>Primarily through <a href="http://www.bkmacdaddy.com/blog/">my website</a> or on Twitter. I have a contact form and my email on the website, and I am <a href="http://twitter.com/bkmacdaddy">@bkmacdaddy</a> on Twitter, which I pretty much have open all the time, except when I&#8217;m sleeping. I am also on <a href="http://www.facebook.com/bkmacdaddy">Facebook</a> and <a href="http://www.linkedin.com/in/bkmacdaddy">LinkedIn</a>, so whatever your preferred flavor of communication, feel free to connect with me.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.admixweb.com/2010/03/04/interview-brian-k-mcdaniel-of-bkmcdaddy-designs/feed/</wfw:commentRss>
		<slash:comments>15</slash:comments>
		</item>
		<item>
		<title>Watermark, watermark everywhere and not an image to copy!</title>
		<link>http://www.admixweb.com/2010/03/01/watermark-watermark-everywhere-and-not-an-image-to-copy/</link>
		<comments>http://www.admixweb.com/2010/03/01/watermark-watermark-everywhere-and-not-an-image-to-copy/#comments</comments>
		<pubDate>Mon, 01 Mar 2010 13:14:38 +0000</pubDate>
		<dc:creator>Christian Alvarado</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[development]]></category>
		<category><![CDATA[PhotoShop]]></category>

		<guid isPermaLink="false">http://www.admixweb.com/?p=3096</guid>
		<description><![CDATA[
Digital media has certainly made taking and copying your artwork easier and faster. If you decide to upload your digital media onto a personal website, or a blog, for instance, and all an individual has to do is save these pictures and images onto their own computers. Without knowing who is downloading your images, it [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.admixweb.com/wp-content/uploads/2010/02/generictextwatermark.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></p>
<p>Digital media has certainly made taking and copying your artwork easier and faster. If you decide to upload your digital media onto a personal website, or a blog, for instance, and all an individual has to do is save these pictures and images onto their own computers. Without knowing who is downloading your images, it is difficult to ensure the security and safety of your digital media in terms of usage. With the thousands of hackers and infiltrators all over the web, who knows just how some of them would use your pictures? Therefore, the question is: Is there a way to protect your images from other people using them?  Well, I would like to suggest the use of watermarks. Aside from setting the access to your websites to a safe minimum, you should also learn how to add watermark to images to make your images even more secure.  Furthermore, in this way, you can take protection your images at an increased level. </p>
<p><span id="more-3096"></span></p>
<h4>What is a Watermark</h4>
<p>A watermark is an image or pattern that appears on your image, in a different shade or low opacity text/image, and these watermark images can be used as a way to tag your images with any sort of information you desire.  In my opinion, watermarking is one of the easiest and most effective ways to ensure your images are secure on the web.  There are various types of watermarks, and depending on what your desired outcome is, you can decide which type is most appropriate for your specific image.  These are the steps to decide which specific watermark to use for your digital media.</p>
<h4>Types Of Watermarks</h4>
<p><strong>Generic text watermark</strong><br />
<img src="http://www.admixweb.com/wp-content/uploads/2010/02/generictextwatermark.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></p>
<p>As suggested by the name, your watermark would not have any connections to you whatsoever, nor does it have any specific meaning. For example, you can opt to use &#8220;Demo&#8221; or &#8220;Sample&#8221; as your generic watermark, for instance, just so people would not think of downloading your photos.</p>
<p><strong>Specific text watermark</strong><br />
<img src="http://www.admixweb.com/wp-content/uploads/2010/02/specifictextwatermark.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></p>
<p>The watermark here is more specific in nature, which means it provide specific information for a specific purpose. For example, you can use your file name or even the name of your website, for additional advertising. No matter the specific text you use, this will still serve its purpose of protecting your photos. In addition, by being specific, it gives more insight to the viewer as to who actually owns the images itself.</p>
<p><strong>Date watermark</strong><br />
<img src="http://www.admixweb.com/wp-content/uploads/2010/02/datewatermark.jpg" alt="" title="" width="485" height="139" class="imagenpost" /> </p>
<p>This type of watermark of course, will be a date that is displayed all over the pictures.  This date could be the date the digital media was created, the date you are sending the pictures, or any other significant date associated with the image. All though this type of watermark is not used that frequently, it is still very handy in organizing your photos.</p>
<p><strong>Copyright watermark</strong><br />
<img src="http://www.admixweb.com/wp-content/uploads/2010/02/copyrightdate.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></p>
<p>Using your copyrighted material to watermark your images would be the most effective method of watermarking. Through this watermark, you are expressing that your pictures are copyrighted, thus prohibited from public use.  This is one of the most used watermarks, and it tends to be very successful in preventing someone from stealing your images.</p>
<h4>Conclusion</h4>
<p>Whichever watermark you decide to choose, it is an important and essential step in creating your images. If sending work to a client or just posting a new piece onto your blog, by watermarking your images you are keeping your images yours.  Feel free to contact me for any further information on the topic!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.admixweb.com/2010/03/01/watermark-watermark-everywhere-and-not-an-image-to-copy/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
		<item>
		<title>Admix Web Mix of the Month: February 2010</title>
		<link>http://www.admixweb.com/2010/02/28/admix-web-mix-of-the-month-february-2010/</link>
		<comments>http://www.admixweb.com/2010/02/28/admix-web-mix-of-the-month-february-2010/#comments</comments>
		<pubDate>Sun, 28 Feb 2010 20:18:11 +0000</pubDate>
		<dc:creator>Holly Lamarche</dc:creator>
				<category><![CDATA[Design]]></category>

		<guid isPermaLink="false">http://www.admixweb.com/?p=3090</guid>
		<description><![CDATA[
This month of February 2010 has been historic for us because not only did we finish and post our new design for Admix Web, but we welcomed our new neice Natalia Marie into the world, we have had the opportunity to meet some new amazing designers and developers, and we launched our new interview series, [...]]]></description>
			<content:encoded><![CDATA[<p><img class="imagenpost" src="http://www.admixweb.com/wp-content/uploads/2009/09/coctail.jpg" alt="" width="485" height="139" /></p>
<p>This month of February 2010 has been historic for us because not only did we finish and post our new design for Admix Web, but we welcomed our new neice Natalia Marie into the world, we have had the opportunity to meet some new amazing designers and developers, and we launched our new interview series, where I will interview one designer or developer each week. As always, in the Mix of the month, we repost our three most popular articles of the month, as well as the three best articles submitted in our Community News section, and the three best articles we discovered this month. And, in the next few months when we launch our CSS gallery, we will post the best three sites submitted in our CSS gallery as well! However, remember that we are still accepting sites for the gallery, and we just will not post them until the new gallery has been finished. And, as always remember to use our search, tag, and catergory features to look through our archives for great articles written over the past year! </p>
<p><span id="more-3090"></span></p>
<h4>Most Popular Articles by Admix Web for February 2010</h4>
<p><a href="http://www.admixweb.com/2010/02/09/web-accessibility-6-reasons-why-its-important/">Web Accessibility: 6 Reasons Why Its Important</a></p>
<p><a href="http://www.admixweb.com/2010/02/26/15-free-abobe-air-applications-for-designers-and-developers/">15+ Free Abobe Air Applications for Designers and Developers</a></p>
<p><a href="http://www.admixweb.com/2010/02/22/do-you-have-what-it-takes-to-be-a-freelance-web-designer-or-developer/">Do You Have What it Takes to be a Freelance Web Designer or Developer?</a></p>
<h4>Best Community News Submitted by Viewers for February 2010</h4>
<p><a href="http://www.bestpsdtohtml.com/40-examples-of-cool-javascript/" target="_blank">40 Examples of Cool Javascript</a> from Best PSD to HTML</p>
<p><a href="http://www.designjuices.co.uk/2010/02/whats-the-best-way-to-promote-your-latest-article/" target="_blank">What’s the Best way to Promote your Latest Article?</a> from Design Juices</p>
<p><a href="http://inspirebit.com/2010/02/21-wonderful-logos-for-your-daily-dose-of-inspiration/" target="_blank">21 Wonderful Logos for your Daily Dose of Inspiration</a> from Inspire Bit</p>
<h4>Best Links Discovered in February 2010</h4>
<p><a href="http://joncom.be/code/css-clocks/" target="_blank">HTML clocks using JavaScript and CSS rotation</a> from Jon Combe</p>
<p><a href="http://www.fuelyourcreativity.com/36-minutes-of-creative-genius/" target="_blank">36 Minutes of Creative Genius </a>from Fuel your Creativity</p>
<p><a href="http://www.smashingmagazine.com/2010/02/25/designing-user-interfaces-for-business-web-applications/" target="_blank">Designing User Interfaces For Business Web Applications</a>from Smashing Magazine</p>
]]></content:encoded>
			<wfw:commentRss>http://www.admixweb.com/2010/02/28/admix-web-mix-of-the-month-february-2010/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>15+ Free Abobe Air Applications for Designers and Developers</title>
		<link>http://www.admixweb.com/2010/02/26/15-free-abobe-air-applications-for-designers-and-developers/</link>
		<comments>http://www.admixweb.com/2010/02/26/15-free-abobe-air-applications-for-designers-and-developers/#comments</comments>
		<pubDate>Fri, 26 Feb 2010 14:10:20 +0000</pubDate>
		<dc:creator>Teylor Feliz</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[development]]></category>
		<category><![CDATA[resources]]></category>

		<guid isPermaLink="false">http://www.admixweb.com/?p=3032</guid>
		<description><![CDATA[
Adobe AIR, which stands for Adobe Integrated Runtime, is a cross-functioning system runtime engine that allows web designers and web developers to create rich internet applications, and Adobe AIR is compatible with Windows, Macs and Linux. Adobe AIR is a very functional and useful system for web designers and web developers because it permits Flash, [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.admixweb.com/wp-content/uploads/2010/02/colorbrowser.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></p>
<p>Adobe AIR, which stands for Adobe Integrated Runtime, is a cross-functioning system runtime engine that allows web designers and web developers to create rich internet applications, and Adobe AIR is compatible with Windows, Macs and Linux. Adobe AIR is a very functional and useful system for web designers and web developers because it permits Flash, Flex, JavaScript, HTML and AJAX code to look like traditional desktop applications by running without the Web browser.  Adobe has created an official Adobe AIR Marketplace which essesntially trys to show all of the Adobe AIR applications that exist.   These applications range from tools useful for designers to developers to bloggers to the average person using the web.  These are great tools and applications because they can make our lives as designer and developers easier, and best of all they are free.  I have compliled a list of 15+ great Adobe AIR applications for you all to use. Remember, this list is not a best of or all inclusive, just ones that I have found to be helpful! Click on the images for links to the application.  Enjoy!</p>
<p><span id="more-3032"></span></p>
<h4>InPreso Screens</h4>
<p><a href="http://www.inpreso.com/inpresoscreens/"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/inpreso.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>Easy to use interface that allows making fast mock-ups or design wireframes in only a few minutes.  The features on the free model include: 30+ predefined controls, static images, language support, and flash movies with growing set of ready UI patterns and widgets.</p>
<h4>TweetDeck</h4>
<p><a href="http://www.tweetdeck.com/"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/tweetdeck.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>TweetDeck is the leading browser for the real-time and social web, allowing users to connect with Twitter, Facebook, LinkedIn and MySpace. I personally use this application myself, and it allows me to connect all my social media outputs into one.  Great resource!</p>
<h4>Boks</h4>
<p><a href="http://www.adobe.com/cfusion/marketplace/index.cfm?event=marketplace.offering&amp;marketplaceid=1&amp;offeringid=11840"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/boks.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>Boks is an Adobe AIR application that provides a User Interface for Blueprint CSS&#8217;s framework. It&#8217;s been designed for those who think the Grid System is good, but never really delved into it.  This application is worth checking out. </p>
<h4>SQLFury</h4>
<p><a href="http://www.sqlfury.com/"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/sqlfury.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>SQLFury is a developer tool written for the Adobe AIR system runtime, and it performs SQL scans of websites to identify any SQL injection issues . SQLFury utilises blind or inband SQL injection techniques to identify vulnerable targets.  This is a useful appliaction for anyone who uses SQL, because it can cute your worktime down!</p>
<h4>Screen Scales</h4>
<p><a href="http://www.littlearea.com/projects/screen-scales/"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/screenscales.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>Screen Scales is a program that allows you to drag markers connected by a line that displays the distance between the two points. This program has more features than the average screen caliper program. Pretty Cool!</p>
<h4>htmlText Editor</h4>
<p><a href="http://www.adobe.com/cfusion/marketplace/index.cfm?event=marketplace.offering&amp;marketplaceid=1&amp;offeringid=10200"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/httmltexteditor.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>A WYSIWYG editor for htmlText. Since the html markup used in Flex components that have an htmlText property use a subset of html, you can&#8217;t use Dreamweaver or other html editors for WYSIWYG editing. This will help you create your htmlText visually, speeding up the workflow.</p>
<h4>Klok</h4>
<p><a href="http://klok.mcgraphix.com/klok/index.htm"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/klok.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>Klok is a personal time tracking application that makes it easy for anyone working on multiple clients, projects or tasks to keep track of their hours. In contrast to many time entry applications, Klok is meant for those of us who want to press a button when we start working and another when we stop. This is a very useful application!</p>
<h4>ImageSizer</h4>
<p><a href="http://www.adobe.com/cfusion/marketplace/index.cfm?event=marketplace.offering&amp;marketplaceid=1&amp;offeringid=10740"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/imagesizer.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>ImageSizer is an application built to resize, rotate, optimize and rename a batch of images, outputting them as a single compressed zip file &#8211; perfect if you want to e-mail a load of images off your digital camera, or a folder of images &#8211; just drag, drop, fiddle with settings and press &#8216;Compress your images&#8217;. Great for designers when working with images.</p>
<h4>BetaDesigns Caliper</h4>
<p><a href="http://www.adobe.com/cfusion/marketplace/index.cfm?event=marketplace.offering&amp;marketplaceid=1&amp;offeringid=10142"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/caliper.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>The Calilper floats above other applications on screen and can be used to measure anything on your monitor.</p>
<h4>Lita SQLite Administration Tool</h4>
<p><a href="http://www.adobe.com/cfusion/marketplace/index.cfm?event=marketplace.offering&amp;marketplaceid=1&amp;offeringid=10386"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/lita.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>Lita is an administration interface for SQLite databases.  Some of the features include the ability to create, rename, delete, and empty tables, encrypt or re-encrypt your databases, easily run, import and export your custom SQL statements and create and delete indices.  Very useful application!</p>
<h4>kuler desktop</h4>
<p><a href="http://www.adobe.com/cfusion/marketplace/index.cfm?event=marketplace.offering&amp;offeringid=10162&amp;marketplaceid=1"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/kuler.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>This application allows you to import kuler themes directly into Creative Suite 3 Illustrator, InDesign, and Photoshop. This is a really useful application as well. </p>
<h4>Contrast-A</h4>
<p><a href="http://www.adobe.com/cfusion/marketplace/index.cfm?event=marketplace.offering&amp;offeringid=10763&amp;marketplaceid=1"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/contrasta.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>Contrast-A allows users to interact with a 3-dimensional RGB color space, experiment with color combinations, check the contrast according to both WCAG 2.0 and 1.0 and see the results for different types of color deficiency. Custom color palettes can be created, printed and saved as Pdf to the user&#8217;s desktop. </p>
<h4>Pixus</h4>
<p><a href="http://www.adobe.com/cfusion/marketplace/index.cfm?event=marketplace.offering&amp;offeringid=10177&amp;marketplaceid=1"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/pixus.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>The Pixus Adobe AIR application is a ruler to measure objects on the screen whien designers and developers are working.  I use this application myself, and I really find it helpful in my work.</p>
<h4>Color Browser</h4>
<p><a href="http://code.google.com/p/colorbrowser/"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/colorbrowser.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>Color Browser is intended as a way to organize favorite color palettes locally. Since it would be a pain to reproduce palettes you&#8217;ve created yourself in Adobe apps, or online with Kuler, or ColourLovers you can import ASE files into the application (note that this was broken in previous versions). There is no limit to the number of colors in a palette, though there are obviously practical limits to what it can show. Thank you to those that have dropped a note, I read every one.</p>
<h4>COLOURlovers</h4>
<p><a href="http://www.adobe.com/cfusion/marketplace/index.cfm?event=marketplace.offering&amp;marketplaceid=1&amp;offeringid=10077"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/colourlovers.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>You can use the Desktop Color Finder to search our entire database of nearly 1 million named colors and more than 300,00 user created color palettes. I am sure you can see how this one could be useful.  Very cool application!</p>
<h4>MockFlow Desktop</h4>
<p><a href="http://www.adobe.com/cfusion/marketplace/index.cfm?event=marketplace.offering&amp;marketplaceid=1&amp;offeringid=17283"><img src="http://www.admixweb.com/wp-content/uploads/2010/02/mockflow.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></a></p>
<p>MockFlow is an online tool to create and share user interface designs for software &#038; websites. This desktop client provides all the features of its web counterpart that includes real-time collaboration, team chat, sitemaps, export, feedback collection, revisions, and it adds offline capabilities and caching, which is really great!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.admixweb.com/2010/02/26/15-free-abobe-air-applications-for-designers-and-developers/feed/</wfw:commentRss>
		<slash:comments>12</slash:comments>
		</item>
		<item>
		<title>Do You Have What it Takes to be a Freelance Web Designer or Developer?</title>
		<link>http://www.admixweb.com/2010/02/22/do-you-have-what-it-takes-to-be-a-freelance-web-designer-or-developer/</link>
		<comments>http://www.admixweb.com/2010/02/22/do-you-have-what-it-takes-to-be-a-freelance-web-designer-or-developer/#comments</comments>
		<pubDate>Mon, 22 Feb 2010 13:08:24 +0000</pubDate>
		<dc:creator>Teylor Feliz</dc:creator>
				<category><![CDATA[Business]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[development]]></category>
		<category><![CDATA[freelance]]></category>

		<guid isPermaLink="false">http://www.admixweb.com/?p=3006</guid>
		<description><![CDATA[
For the past year, I have been doing freelance web programming and some web design for various clients, and I must say that the job is more difficult then I even could have imagined.  I worked for in-house companies for seven years, before becoming a freelancer, and I must say that I wish I [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.admixweb.com/wp-content/uploads/2010/02/freelance.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></p>
<p>For the past year, I have been doing freelance web programming and some web design for various clients, and I must say that the job is more difficult then I even could have imagined.  I worked for in-house companies for seven years, before becoming a freelancer, and I must say that I wish I had known what freelancing entailed before I got myself into it.  Now, I am not trying to be a pessimist, because the truth is that being a freelance web designer or developer is one of the most rewarding careers or opportunities you could have, but it is also packed with challenges that need to be considered before you step into the world of a freelancer.  When I first decided to become a freelancer, I thought it would involved me being able to work in my boxers, watch TV, and take vacations whenever I wanted, but the truth is freelance work is challenging work; so are you up to the challenge.  Do you have what it takes to be a freelance web designer or developer?  Check out these 15 things to consider, and you decide! </p>
<p><span id="more-3006"></span></p>
<h4>Make Awesome Business Cards</h4>
<p>This is a must for the successful freelancer. You will need business cards with your logo, business name, and contact information; however, I suggest taking it one step further and making this business card a true representation of your artistic ability and originality. I suggest spending a little extra money and time designing your business card, because it is a marketing opportunity that stays with a person and can really impress potential clients. Every business uses business cards as a way to network and advertise, but with web developers, I recommend using creative business cards so that prospective clients can immediately get a taste of your potential.</p>
<h4>Get your Portfolio Ready</h4>
<p>As a freelancer, you really need a fantastic portfolio.  When you are trying to show the world your capability in the area of web design, your website design portfolio is your portal to the world. The portfolio is the most essential website a freelancer will ever create in his or her career, because its sole purpose is to show their knowledge, scope, talent, and skill. If your website design portfolio is not creative, eye-catching, or innovative, it will not matter what websites you have in your repertoire, potential clients will not give you a second look.  So as a freelancer, you will need to take that extra time and effort to make an outstanding portfolio. </p>
<h4>Learn about Billing</h4>
<p>As a freelancer, you must know about billing and<a href="http://www.admixweb.com/tag/pricing/"> pricing</a>.  As a normal employee in a web design business, you will usually not have to worry about setting prices, billing, making estimates, making invoices, collecting payments etc.  However, as a freelancer, you become more than just a designer/developer, you become your own office manager!  So, it is important that you consider taking a class on billing, read some blog posts about it, or have a friend help you out in that area. As your business grows, you may even be able to hire someone to take care of the finances.</p>
<h4>Be Ready to Work at Any Time</h4>
<p>In a company, you usually have your scheduled hours, usually 8-5, and you can feel some bit of normalcy and structure in your life; however, as a freelancer, you have to be ready to work at any time and any hour. For example, this past weekend, I was expected to meet a client at 8am on a Saturday, at his warehouse.  The truth is, I had no problem doing it, because it is a great project, but the hours of a freelances are odd, and I was not expecting that when I first started!</p>
<h4>Update your Resume</h4>
<p>Even with Freelance, you have to always have an updated and impressive resume, even though you are technically not looking for “a job.”  Many potential clients expect to see a resume with where you have worked, experience, education, and sample projects, to see if you are compatible with their project.  So, even if you are technically working for yourself, be ready to show your resume as a freelancer. </p>
<h4>Accommodate your Clients</h4>
<p> When you are a freelancer, you are personally responsible for seeking, getting, accommodating, and retaining clients, which can be a daunting task.  So, that involves advertising of course, but I believe that accommodating your clients in the most important part, to ensure that your current clients are satisfied, so they will return. In my article, “10+ Tips to Improve Interaction with Clients,” I wrote about tips to help keep your clients happy. If your current clients are happy, they are more likely to give positive word of mouth advertising for you, as well as come back for future projects!  So, make sure you do what you can to keep you clients happy. </p>
<h4>Learn, Learn, and Learn Some More</h4>
<p>As a freelancer, you are often expected to know about everything, and when a potential client is looking for an employee to work on a project, they will generally look at the two ends of the spectrum. They either look for the preverbal “jack of all trades” type web designer or developer who can do just about anything, or they look for the best in a certain area. In my opinion, it is obviously pretty difficult and nearly impossible to be the best at what you do, so I suggest trying to diversify as much as possible so that you can greater your possibility of getting a project. For example, try to learn as many languages, applications, etc as possible in order to be competitive in this market. So, be ready to learn, learn, and learn.</p>
<h4>Get Your Name Out There</h4>
<p>You must promote yourself when you are a freelancer, which was a true shock for me when I first entered the field.  I am actually a fairly shy person, so I find it difficult to promote myself, because originally I thought I was bragging when I would try to get my name out there.  However, when you are doing freelance, you must keep a consistent flow of clients coming in to keep your business going. I cannot speak for all web developers, but I can speak for myself when I say that when I first started doing freelance, I was not too educated in the world of marketing, and I was unaware of all the way you can advertise for very cheap and even free! The more places you get your name out there, the more chance you have to increase your client base.  Furthermore, what I learned, is that try first to be social where you feel comfortable, and let the promotion grow from there! </p>
<h4>Manage Your Time</h4>
<p>You must be a responsible person who manages time well in order to be a successful freelancer.  In my case, this was one of the most challenging areas for me when I first entered the world of freelance.  When you are a freelancer, you could have more than one project to work on at the same time, as well as dealing with all of these other things you have to consider, so be ready to be overwhelmed, if you do not manage your time well.  In addition, you may need to learn how to multi-task, so be ready to tighten up your time management skills.</p>
<h4>Blog</h4>
<p> Freelancers should really consider starting a blog, which can take a lot of time and energy, but it really pays off. Writing a blog helps to get your name out there, shows the world you know what you are talking about, and gives people another avenue to reach your work. A great suggestion, even though I have not yet done so myself, is to link your blog and portfolio together. This will give increased access to your business, and hopefully increase your clientele.</p>
<h4>Manage Your Office Well</h4>
<p>Though this is not a requirement, you should have a nice space where you can bring clients when you are doing freelance.  Of course, most clients will not expect you to have an amazing office space, when you are only a freelancer; however, you should have a clean, well organized space where you can bring client to discuss potential projects.  For example, I will bring clients to my office, or if my house is not well organized, I will ask to meet in a public place, or I will go to the client’s location.  If your office place is not at least somewhat aesthetically pleasing, you will drive away your clientele.</p>
<h4>Learn the Legality of Being a Freelancer</h4>
<p>I am sure I am like many freelancers, when I say I did not know anything about legal business issues when I first started out.  I was however, very lucky that my wife is an attorney and well versed in business and legal relations, but if I did not have her to assist me, I probably would not have made it as a freelancer when I first started.  You must know about the legal issues that can affect you as a freelancer, which is out of the realm of most designers and developers.  I am not saying to get a legal degree, but to the very least draft a very detailed contact to have for clients, to protect your financially and from liability. </p>
<h4>Be Patient and Humble</h4>
<p>So, now that you have realized that you have what it takes to be a freelancer, just be ready to be patient and humble when you first start out as a freelancer.  When I first started out, I was forced to do a lot of projects which honestly I did not care for, for prices that nearly insulated me.  In fact, I found out that many clients would prefer to go to a web development business, rather than coming to me as a freelancer, even though I knew I had the talent, but I did not have the clientele portfolio to show it. Even after 1 year of being a freelancer, I still have to be willing to take projects which may not be my favorite.  But, be patient and humble, and you will start to get amazing projects, and realize being a freelancer is an incredible job!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.admixweb.com/2010/02/22/do-you-have-what-it-takes-to-be-a-freelance-web-designer-or-developer/feed/</wfw:commentRss>
		<slash:comments>21</slash:comments>
		</item>
		<item>
		<title>We are Calling all Web Designers and Developers: We Want to Know the REAL You</title>
		<link>http://www.admixweb.com/2010/02/17/calling-all-web-designers-and-developers-i-want-to-know-the-real-you/</link>
		<comments>http://www.admixweb.com/2010/02/17/calling-all-web-designers-and-developers-i-want-to-know-the-real-you/#comments</comments>
		<pubDate>Thu, 18 Feb 2010 03:14:51 +0000</pubDate>
		<dc:creator>Holly Lamarche</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[development]]></category>
		<category><![CDATA[Interview]]></category>

		<guid isPermaLink="false">http://www.admixweb.com/?p=2929</guid>
		<description><![CDATA[
This post is the foundation for a personal interview series we will start next week, where we will interview various web designers and developers that have been suggested to us by our readers!  We want to delve into their creative minds, and get to know what really makes them tick! Inspired by Brian K. [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.admixweb.com/wp-content/uploads/2010/02/brain.jpg" alt="" title="" width="485" height="139" class="imagenpost" /></p>
<p>This post is the foundation for a personal interview series we will start next week, where we will interview various web designers and developers that have been suggested to us by our readers!  We want to delve into their creative minds, and get to know what really makes them tick! Inspired by <a href="http://www.bkmacdaddy.com/about.html">Brian K. McDaniel</a>, a fellow web designer and blogger&#8217;s idea of the, <a href="http://bkmacdaddy.com/blog/behind-the-avatar-2-meet-the-husbandwife-team-behind-admixweb-com">&#8220;Behind the Avatar&#8221;</a> series, we want to get to know more about the people we follow on Twitter, the designers and developers we chat with, the people our readers follow on Twitter, and the designers and developers behind the blogs.  The first thing I do when someone adds me on Twitter, is visit their blog to read the &#8220;about us&#8221; page, but usually that just leaves me wanting to know more; I want to know the person behind the blog.</p>
<p><span id="more-2929"></span></p>
<p>
Here on Admix Web, we believe in the importance of collaboration rather than competition between fellow web designers and developers.  Furthermore, we believe in the importance of networking, meeting and getting to know colleagues in the field, and collaborating with fellow designers rather than seeing them as competition. However, our fellow designers and developers live in countries ranging from UK to USA to Serbia to Canada to India, thus it makes it difficult to meet up for a cup of coffee and a chat.  Therefore, we are calling all Web Designers and Developers, because we want to know more about you, and we want to share what we learn with my readers.</p>
<h4>How to Nominate</h4>
<p>If you know a web developer or designer you would like to nominate for an interview, please email me at hlamarche@admixweb.com or leave a comment with their name and contact info.  Also, you can nominate yourself for this series; do not be afraid!  I want people who are interesting in sharing and discussing what makes them tick, so be ready to have your brain picked! And remember, I can always select my own people for the interviews; however, I want involvement from YOU, so please nominate away!</p>
<h4>How to Get Involved</h4>
<p>I want our readers to be involved not only through the nomination process, but also in the interview itself.  Feel free to suggest various questions about topics you want to know.  I want to provide you with the information you are craving!</p>
<h4>Stay Tuned</h4>
<p>Stay tuned for the first interview, which will be posted in the next few weeks!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.admixweb.com/2010/02/17/calling-all-web-designers-and-developers-i-want-to-know-the-real-you/feed/</wfw:commentRss>
		<slash:comments>29</slash:comments>
		</item>
	</channel>
</rss>
