Your address will show here +12 34 56 78
آموزش طراحی وب سایت
سلام خدمت تمامی دوستان و همراهان طرح سوم؛ در قسمت های قبل آموزش طراحی وب سایت با کدنویسی HTML آشنایی کامل پیدا کردید. امیدوارم اندکی تمرین کرده باشید. 😉  در این قسمت کمی بیشتر شما را با مباحث ویژگی المان ها آشنا می کنیم . در قسمت های قبل به خاطر دارید که برای هر تگ یا المان یک یا چند ویژگی می توانستیم تعریف کنیم و این ویژگی ها در قسمت کدهای CSS استفاده می شوند. در این قسمت مهم ترین ویژگی هایی که در قسمت های بعدی آموزش طراحی وب سایت نیاز می شود را معرفی می کنیم .
چند نکته را قبل از شروع یادآوری می کنیم :
– تمامی تگ های HTML می توانند دارای Attribute باشند.
– Attribute ها ویژگی های اضافی به تگ اختصاص می دهند.
– Attribute ها همیشه در تگ استارت قرار می گیرند. در قسمت پایانی تگ هیچ ویژگی درج نمی شود و تگ پایان صرفا برای بستن تگ استفاده می شود.
– Attribute ها همیشه با فرمت مقابل در تگ استارت قرار می گیرند: “name=”value

ویژگی href :
تگ لینک HTML با تگ a معرفی می شود و برای لینک دهی از ویژگی href استفاده می شود و لینک بصورت مقدار در داخل href قرار می گیرد:
<a href=”http://tarhesevom.com”>click here</a>

ویژگی SRC :
تمامی عکس ها در HTML داخل تگ img قرار می گیرند.
برای تعریف نمودن مسیر عکس از ویژگی src استفاده می شود :
<“img src=”img.jpg>

ویژگی width و height :
برای مشخص نمودن سایز عکس از این ویژگی استفاده می شود و می توان برای عکس مقدار ارتفاع و عرض را تعیین نمود:
<“img src=”img_girl.jpg” width=”500″ height=”600>

ویژگی Alt :
این ویژگی یک متن جایگزین به عکس می دهد که در صورتی که عکس به هر دلیلی قابل مشاهده نباشد این متن به جای عکس نمایش داده می شود. همچنین این ویژگی بسیار در سئو سایت موثر می باشد.
<“img src=”img.jpg” alt=”alternative text here>

ویژگی style :
این ویژگی برای المان استایل های مختلفی همانند سایز ، فونت، رنگ و … را ایجاد می کند.
<p style=”color:red”>I am a paragraph</p>
ویژگی lang :
این ویژگی در تگ <html> درج می شود. این ویژگی مشخص کننده زبان صفحه مورد نظر می باشد.
موارد استفاده این ویژگی در اپلیکیشن ها و همچنین موتورهای جستجو می باشد.
<“html lang=”fa-IR>

ویژگی title :
این ویژگی در داخل تگ p استفاده می شود و در قسمتی که این کد درج شود در هنگامی که موس بر روی نوشته قرار گیرد متن مورد نظر بصورت tooltip نمایش داده می شود.
<“p title=”I’m a tooltip>

نکاتی که در پایان باید حتما به آنها توجه کنید : 
– حتما تاکید میکنیم که از ویژگی ها در کدنویسی خود با حروف کوچک استفاده نمایید.
– حتما در تمامی ویژگی علامت “” را قرار دهید و بدون علامت ویژگی تعریف نکنید.
– ممکن است این سوال بوجود آید که اگر میخواستید داخل ویژگی همانند title عبارتی را درج نمایید که خود دارای “” باشد باید چکار کرد. در این حالت می توانید عبارت ویژگی را داخل ” قرار دهید و سپس متنی را که دارای علامت “” هست را داخل آن درج نمایید.
<‘p title=’Tarhe “Design” Sevom>
– همچنین می توانید برعکس این حالت را هم انجام دهید که علامت “” برای ویژگی تعریف شود و در داخل آن از ” استفاده نمایید.

این قسمت از آموزش طراحی وب سایت هم به پایان رسید. فراموش نکنید که حتما تمرین داشته باشید . هر سوالی هم وجود داشت در قسمت نظرات درج کنید کارشناسان ما در اسرع وقت به سوالات شما عزیزان پاسخ می دهند.
با طرح سوم همراه باشید…
0

آموزش طراحی وب سایت

سلام خدمت تمامی دوستان و همراهان طرح سوم. در جلسه قبلی آموزش طراحی وب سایت به معرفی و آشنایی با کدهای سورس HTML وب سایت ها پرداختیم . در این جلسه ساختار کلی و تگ های معروف HTML را توضیح می دهیم . امیدواریم تا این جلسه از آموزش طراحی وب سایت با طرح سوم راضی بوده باشید.

ساختار کلی HTML به این صورت می باشد :

<!DOCTYPE html>

<html>

<head>

<title>Page Title</title>

</head>

<body>

 

<h1>This is a Heading</h1>

<p>This is a paragraph.</p>

 

</body>

</html>

حالا مي خواهيم با تك تك اين عناصر آشنا شويم :

داك تايپ DocType  : Document Type Definition

اولين آيتم صفحه بدون فاصله است. اين يك قانون است.

همانطوري كه فايل word 2013 در نمايش در 2000 دچار مشكل مي شود HTML ها با داك تايپ هاي متفاوت هم نمايش متفاوت در مرورگرها خواهند داشت.

در واقع اين داك تايپ است كه به مرورگر مي گويد اين سند از چه نوعي است و بايد به چه ترتيب Render شود . نحوه رندر شدن و تفاوت هاي آنها بايد در سطح حرفه اي تري مطرح شود.

داك تايپ ها هم در طول زمان به وجود مي آيند يعني مانند word نوع هاي جديدي روي قبلي ها عرضه مي شوند مانند HTML5  كه به تازگي مطرح شده است.

براي ديدن داك تايپ هاي موجود به اين آدرس بريد http://reference.sitepoint.com/html/doctypes

غير از داك تايپ ها تمامي عناصر صفحه داخل تگ HTML است كه شامل 2 بخش مي شود head و  body

عنصر HEAD

اين يك تگ container  است و در بالاي سند قبل از body قرار مي گيرد و شامل اطلاعاتي در باره صفحه است مانند title, meta, css  و …..

عنصر  title :

يك تگ container است كه متن وسط آن در عنوان (Title) بالاي صفحه قرار ميگيرد

عنصر meta  :

متا تگ يك تگ empty است و براي  دلايل متفاوتي استفاده مي شوند اطلاعات اضافي كه در مرورگر نمايش پيدا نمي كند . به طور مثال براي نام نويسنده ويا حق كپي رايت و يا نوع كاراكتر و ….

Css و  javascript  هم در  head قرار ميگيرند كه بنا به نياز استفاده ميشوند البته براي جاوااسكريپت ميتوان يك تفاوتهايي  در طراحی های حرفه ای  قائل شد.

عناصر body :

هرآنچه در body قرار مي گيرد را مي توان در خروجي ديد: تيترها، پاراگراف ها, تصاوير و …….

خب الان می توانید اولین کد خود را بنویسید و خروجی آن را مشاهده کنید. برای این کار ابتدا ویرایشگر خود را باز کنید و کد بالا را در آن کپی کنید. آن را با پسوند .html پوشه ای که قبلا درست کرده اید ذخیره کنید و با مرورگر خود فایل را باز کنید و خروجی که به شما می دهد تنها یک تگ عنوان و تگ پاراگراف می باشد.

حال به معرفی انواع تگ های معروف می پردازیم. ابتدا این را به خاطر داشته باشید که تگ ها عموما یک آغاز و یک پایان دارند. همانطور که در جلسات قبل توضیح دادیم. اما برخی تگ ها پایان ندارند مانند تگ img (تگ عکس). علاوه بر این، تگ ها هر کدام یک ویژگی هایی دارند که در داخل آغاز تگ درج می شوند. به این ویژگی ها Attribute گفته می شود . برای هر المان می توانید ویژگی های خاصی را تعریف کنید که این ویژگی ها هر کدام قابلیت هایی مخصوصی برای آن المان ایجاد می کند. این ویژگی ها می تواند اختصاص نام به تگ، اختصاص کلاس و یا آدرس لینک و موارد دیگر باشد. به مثال زیر توحه کنید :

<div class=”sampleclass” id=”number1”>text here</div>

همانطور که در کد بالا مشاهده می کنید تگ div تعریف شده است و در داخل آن محتوای متن text here قرار داده شده است. دو ویژگی id و class برای این تگ تعریف شده است که هر کدام مقدارهای خاصی اختصاص داده شده است. این مقدارها در کدهای CSS مورد استفاده است که بعدا در جلسات بعدی آموزش طراحی وب سایت با CSS به آن می پردازیم.

خب کدهای معروفی که در آغاز طراحی وب سایت باید بدانید، کد های زیر است :

Div

A

H1,h2,h3,h4,h5,h6

Img

P

Span

Meta

Link

Script

Ul

ol

Li

Style

تگ های بالا از جمله مهم ترین تگ های طراحی هستند. تگ های زیادی در طراحی وب سایت وجود دارند. ابتدا به معرفی این تگ ها می پردازیم …

تگ div :

این تگ برای وقتی استفاده می شود که می خواهیم چند المان را در داخل یک مجموعه قرار دهیم . بطور مثال این صفحه ای که مشاهده می کنید در قسمت بالای سایت یک هدر سایت قرار دارد در قسمت متن هایی که مشاهده می کنید یک قسمت اصلی سایت است و یک قسمت در پایین وب سایت هست که فوتر نام دارد. تمام این بخش ها را با کد div مشخص می کنیم.

تگ a :

این تگ برای تعریف کردن یک لینک به آدرس خاص استفاده می شود. دقت داشته باشید که برای درج کردن آدرس باید حتما از Attribute خاص ان استفاده کنید که در زیر توضیح داده شده است :

<a href=”http://tarhesevom.com “>click here</a>

در کد بالا یک تگ لینک تعریف شده است که در داخل آن ویژگی به نام href تعریف شده است. این ویژگی دارای مقدار یک لینک به آدرس وب سایت می باشد. با کلیک بر روی این المان لینکی که مقدار آن را وارد کرده اید در داخل صفحه مرورگر باز می شود.

 

تگ h :

تگ های عنوان از h1 شروع می شوند و معمولا تا h6 ادامه دارند. این تگ ها برای مشخص کردن عناوین از متن های پاراگراف قابل استفاده هستند . اختصاص 6 شماره برای این تگ برای این منظور می باشد که میزان اهمیت هر کدام مشخص شود . بطور مثال یک پایان نامه در فصل دوم (که می تواند تگ h1 باشد) دارای موضوعات کلی می باشد که هر کدام در این فصل از پایان نامه بعنوان زیر موضوع فصل مطرح می شوند . این عناوین موضوعات را با تگ h2 مشخص می نماییم و همینطور در لایه های زیرین موضوعات تگ های h3 و … تعریف می شوند.

 

تگ  img :

این تگ برای تعریف یک عکس در صفحه شما کاربرد دارد. فقط دو نکته رو دقت داشته باشید که تگ img تگی هست که پایان ندارد و برای تعریف عکس باید لینک عکس را ویژگی آن قرار دهید. بطور مثال :

<img class=”class1″ src=”http://tarhesevom.com/wp-content/uploads/2018/06/lastlogo.png”>

در کد بالا تگ عکس تعریف شده و برای آن ویژگی های کلاس و سورس عکس تعریف شده است که هر کدام مقدار خود را دارند و لینک عکس در ویژگی سورس تعریف شده است.

 

تگ P :

این تگ برای درج پاراگراف در صفحه استفاده می شود. بطور مثال :

<p>some text here</p>

 

تگ span :

این تگ عموما برای تغییر رنگ و یا فونت قسمتی از یک تگ پاراگراف استفاده می شود . بطور مثال :

<p>I Have <span style=”color:blue”>blue</span> eyes.</p>

در این کد تگ پاراگراف تعریف شده است که در داخل آن می خواهیم یک کلمه رنگ خاصی داشته باشد. آن کلمه با استفاده از تگ span می تواند ویژگی های خاصی داشته باشد که در این قسمت ویژگی style برای آن تعریف شده و در داخل آن مقداردهی برای رنگ المان داده شده است.


تگ meta :

این تگ برای تعریف اطلاعات متا در صفحه تعریف می شود . بعنوان مثال

  <meta name=”description” content=”tarhesevom Web tutorials”>

این تگ متا برای تعریف توضیحات صفحه اختصاص داده شده است. دارای دو ویژگی name و content می باشد.

 

تگ link :

این تگ برای لینک دهی فایل ها به صفحه شما اختصاص داده شده است . برای مثال شما در جلسات آینده در آموزش طراحی وب سایت با کدهای CSS آشنا می شوید و بعد از ایجاد کردن کدهای CSS باید آنها را به صفحه خود لینک دهید. مثال زیر را ببینید :

<link rel=’stylesheet’ id=’dashicons-css’  href=’http://tarhesevom.com/test.css’ type=’text/css’ media=’all’ />

این تگ به فایلی در وب سایت ارجاع می کند و تمامی کدهای آن فایل را در صفحه بارگذاری می نماید. بعدا با فایل های CSS آشنا می شوید .

تگ script :

این تگ برای درج کدهای  javascript در صفحه کاربرد دارد.

 

<script>

document.getElementById(“demo”).innerHTML = 5 + 6;

</script>

 

با کدهای javascript بزودی آشنا می شوید .

 

تگ  ul :

این تگ برای ایجاد یک لیست استفاده می شود . توجه داشته باشید که بعد از تگ های ul و ol در داخل این تگ ها همیشه تگ های li قرار دارد.

تگ ol :

این تگ نیز برای ساخت یک لیست استفاده می شود با این تفاوت که تگ  ol خروجی کار که همان تگ های li در داخل این مجموعه باشد با بصورت شماره گذاری مرتب نشان می دهد. اما در کد ul تمامی المان های لیست همانند بولت گذار در ورد مشاهده می شوند و دارای عدد برای هر المان لیست نمی باشند.

تگ li :

این تگ در زیر مجموعه تگ های ul و ol کاربرد دارد و برای تعریف المان های لیست در این تگ ها استفاده می شود.

تگ style :

این تگ برای درج کدهای CSS در صفحه وب سایت کاربرد دارد. در قسمت آموزش CSS به این مبحث بطور کامل می پردازیم .

 

خب ، این جلسه از آموزش طراحی وب سایت هم به پایان رسید . سعی کنید کمی تمرین داشته باشید و از المان های مختلف در صفحه خود استفاده کنید تا نحوه کار و خروجی های آن را مشاهده کنید.

سوال و یا نظرات خود را در پایین این برگه درج کنید ، کارشناسان شرکت طرح سوم آماده پاسخگویی به سوالات شما هستند.

 

0

آموزش طراحی وب سایت
سلام خدمت تمامی دوستان و همراهان طرح سوم؛ تا قسمت های قبل آموزش طراحی وب سایت آشنایی با دامنه و هاست و نرم افزارهای کدنویسی رو یاد گرفتید. در این قسمت وارد کدنویسی طراحی وب سایت می شویم. خب در ابتدا باید این مطلب را بدانید که طراحی وب سایت و کدنویسی آن چند بخش دارد که در این جا قسمت هایی رو معرفی می کنیم بهتون و در کنار شما هستیم تا کاملا یک وب سایت داینامیک را طراحی کنید . قسمت اولی که باید یاد بگیرید کد های HTML است . HTML خلاصه شده Hypertext Markup Language هست . کلیه المان هایی که در این صفجه یا در هر صفحه وبی که مشاهده می کنید تماما کدهای HTML هستند . کدهای HTML همانند ستون های خانه و دیوار های آن هستند که ساختار اصلی وب سایت را تشکیل می دهند . قسمت بعدی کدنویسی ، دستورات CSS که خلاصه شده Cascading Style Sheets هستند که این دستورات اگر بخواهیم همانند سازی کنیم مثل طراحی داخلی و چیدمان وسایل خانه می باشند. طرز قرار گیری متن ها، عرض ها و نحوه قرار گیری منو ها ، رنگ ها و … تمام ساختار گرافیکی که مشاهده می کنید تماما در کدهای CSS تعریف می شوند . در کنار این کد ها دستورات Javascript نیز به کار می آیند تا امکانات تصویری و بعضا کدهایی برای قسمت های مختلف وب سایت در آنها درج کنید. عکس زیر خلاصه ای از این مطلب را نمایش می دهد :
design-web-06.gif
ابتدا به آموزش HTML و تگ های آن می پردازیم و سپس به آموزش کدنویسی CSS . چرا که شروع طراحی با کدهای HTML هستند و برای لباس پوشاندن به این کدها سراغ کدهای CSS می رویم . بعداز یادگیری این کدها سراغ کدهای داینامیک سازی می رویم که زبان برنامه نویسی PHP از این قسمت استارت می خورد . تمام قسمت هایی که می بینید توسط کدهای PHP داینامیک سازی شده اند و قابلیت بروزرسانی ، حذف و ایجاد مطالب و محتواها از داخل Backend سایت مدیریت می شوند. خب برای اینکه کمی با کدهای وب سایت آشنا بشید داخل همین صفحه ای که هستید دکمه های ctrl+U را فشار دهید . صفحه ای که باز می شود شامل تمامی کدهای HTML هست که در این صفحه ایجاد شده اند . در کدهای HTML ساختار خاصی وجود دارد که طبق این ساختار دستورات خوانده می شوند و برای کاربر به نمایش گذاشته می شوند . این ساختار همانند بدن انسان می باشد. یعنی کدهای HTML دارای یک مجموعه تگ بنام HTML هستند که داخل این تگ دو زیر مجموعه تگ HEAD و BODY وجود دارد . می توانید در صفحاتی که کدهای آن را باز می کنید این تگ ها را پیدا کنید. خب اصلا تگ چیست !؟ تگ يعني اسمي كه ميان اين دو <> قرار گيرد و نام تگ همان متني است كه بين اين دو <> قرار مي گيرد. بطور مثال تگ HTML به این صورت نوشته می شود :اگر اندکی دقت کنید تمامی تگ ها تکرار می شوند و علامت / در کنار آنها در پایین تر قرار می گیرد. یعنی تمامی تگ ها با علامت <> شروع می شوند و با علامت </> بسته می شوند. می توانید در پایین صفحه بروید و پایان تگ را مشاهده کنید. خب تگ ها فقط به این چند نمونه تگ HTML ، BODY و HEAD ختم نمیشه. خیلی تگ های زیادی در طراحی وب سایت هست که یادگیری آنها بسیار واجب هست. تگ های معروف شامل تگ های عنوان به نام های h1,h2,h3,h4,h5,h6 هستند که تمامی این ها تگ های عنوان متن ها هستند. متن ها عموما در داخل تگ <p> قرار می گیرند . تگ های <div> نیر برای تعریف قسمت های مختلف وب سایت که تمام در داخل آن مجموعه تعریف می شوند کاربرد دارد. در آینده به معرفی تمام این تگ ها می پردازیم.
خب برای این جلسه فعلا فقط کافی است چندین وب سایت را باز کنید و با فشار دادن دکمه های CTRL+U کدهای سورس صفحه وب را مشاهده کنید. همین ! در قسمت های بعد به معرفی این تگ ها بصورت کامل می پردازیم . اگر سوالی داشتید در قسمت نظرات بپرسید تا در اسرع وقت کارشناسان ما جواب را ارسال کنند. 
0

آموزش طراحی وب سایت
سلام دوباره خدمت شما دوستان و همراهان طرح سوم . از امروز استارت کدنویسی را می زنیم و کم کم شروع می کنیم خروجی کد ها را مشاهده کنیم. در ابتدای آموزش طراحی وب سایت به معرفی ابزارهای کدنویسی پایه می پردازیم و نحوه کدهای html و CSS را آموزش می دهیم . با ما همراه باشید. این آموزش طراحی وب سایت و آموزش های قسمت های بعد، برای کسانی مفید است که از آموزش طراحی وب سایت اطلاعی ندارند و می خواهند تازه به جمع طراحان سایت ملحق شوند پس مسلما از ساده ترین نکات آغاز می شود . این آموزش طراحی وب سایت شما را با HTML و CSS آشنا میکند و راه را برای ساخت یک وب سایت استاندارد به شما نشان می دهد. سعی دپارتمان طراحی وب سایت طرح سوم بر این است تا مطالب آموزشی را به ساده ترین روش های ممکن ارائه دهد تا برای افرادی که حتی هیچ اطلاعاتی از طراحی وب سایت ندارند بتوانند از این آموزش ها استفاده کنند. لطفا ما را از نقطه نظرات و پیشنهادات خود مطلع کنید… خب، آموزش را شروع می کنیم . قبل از این که وب سایت خودتان را بسازید و شروع به کدنویسی کنید، می بایست کامپیوتر خود را برای کار آماده نمایید که شامل برنامه هایی است که یا در سیستم شما موجود می باشد و یا این که می بایست آن ها را نصب نمایید. برنامه های زیادی در بازار موجود می باشد ولی در ابتدا از برنامه های رایگان و قابل دسترس استفاده می کنیم. وسایل و برنامه های اصلی که شما نیاز دارید: 1- وسیلۀ ابتدایی برای ویرایش فایل های متنی که در واقع صفحه وب شما را شامل میشود 2- یک مرورگر (web browser) برای دیدن صفحات وب در آن 3- فرستادن صفحه وب سایت به محیط اینترنت با استفاده از ftp client چون اکثر کاربران ما درایران از ویندوز استفاده می کنند پس ابزارهای موجود در ویندوز را بررسی خواهیم کرد. ابزارهای اولیه در ویندوز برای آموزش طراحی وب سایت: 1- ادیت کردن متن : برای ادیت کردن متن در ویندوز می توانید از Notepad استفاده نمایید. این نکته را در نظر داشته باشید که در طراحی سایت ادیتورهای زیادی وجود دارند و برای شروع کار می توانید از ادیتور Sublime استفاده کنید. 2- دیدن خروجی فایل : برای دیدن کار خروجی می بایست از مرورگر و یا browser استفاده کنیم. مرورگرهای متفاوتی وجود دارد که بحث آنها بسیار مفصل است ولی در محیط ویندوز مرورگر Internet Explorer در دسترس است. اما توصیه ما این است که ابتدای کار مرورگر Chrome را دانلود و نصب کنید. 3- برای فرستادن صفحه به محیط وب از دستور ftp استفاده خواهیم کرد که در ادامه به آن اشاره میکنم. برای طراحی وب سایت ، گاهی نیاز به قسمت هایی در ادیت و ویرایش عکس وجود دارد که باید در سطح ابتدایی کار با نرم افزارهای ویرایش عکس رو بلد باشید. همکاران ما در بخش آموزش طراحی گرافیک این آموزش ها را آماده کرده اند تا نیاز طراحی گرافیکی شما هم برطرف گردد. بعد از نصب نرم افزارهایی بالا، بایستی پوشه سایت خود را درست کنید و در مکانی در کامپیوتر خود ذخیره کنید. بطور مثال در درایو D کامپیوتر خود پوشه ای به نام My New Site بسازید. بزودی در داخل این پوشه کد های وب سایت را می سازید و تمام دستورات از داخل آن فراخوانی می شود. توصیه می کنم که حتما و حتما قسمت های قبل آموزش طراحی وب سایت را مطالعه کنید و جلسات را به ترتیب بخوانید .
0

آموزش فتوشاپ

سلام خدمت تمامی دوستان و همراهان عزیز طرح سوم. آموزش طراحی گرافیک دیگه ای براتون آماده کردیم. در این آموزش طراحی گرافیک قصد داریم روشی را آموزش بدهیم تا متنی را بر روی یک منحنی قرار دهیم . برای اینکه در فتوشاپ متنی را بر روی یک مسیر تایپ کنید به روش زیر باید عمل کنید.

یک سند جدید با ابعاد دلخواه ایجاد کنید . برای این کار از منوی file گزینه new را انتخاب و یا از کلیدهای ctrl+N استفاده کنید.

حال قصد داریم که متن را بر روی یک مسیر دایره ای قرار دهیم. به جای دایره هر مسیر دیگری هم که رسم کنید روش کار به همین صورت است.

برای این کار ابزار Ellipse را انتخاب کنید. با انتخاب این ابزار نوار تنظیمات مربوط به آن در بالای نرم افزار فعال می شود. گزینه اول را روی حالت Path تنظیم کنید تا برای شما یک مسیر رسم کند.

سپس روی صفحه درگ کنید تا یک مسیر دایره ای رسم شود. در حین رسم کلید shift را پایین نگه دارید تا یک دایره رسم شود.

حالا ابزار Type را بردارید و روی نقطه ای از مسیر دایره ای کلیک کنید. پس از کلیک کردن شروع به تایپ متن مورد نظرتان کنید. متن روی مسیر تایپ می شود. به همین سادگی. این آموزش طراحی گرافیک هم امیدواریم برای شما کاربرد داشته باشه.
در صورت وجود هر اشکال یا سوالی کامنت بذارید. 
منتظر آموزش های جدید ما باشید…

 

0

آموزش طراحی وب سایت

سلام خدمت دوستان و همراهان طرح سوم . در جلسه قبل آموزش طراحی وب سایت با دامنه و انواع دامنه آشنا شدید. در این قسمت آموزش طراحی وب سایت هاست رو توضیح می دهیم . اگر قسمت اول آموزش طراحی وب سایت را مطالعه نکردید توصیه می کنیم حتما ابتدا مراحل را به ترتیب بخوانید.

یک وب سایت شامل بسیاری از فایل ها می باشد و شما برای ساخت سایت نیازمند یک فضای میزبانی هستید تا فایل های خود را در آنجا قرار دهید. فضای میزبانی یک سرور همانند کامپیوتر خانگی شما اما قدرتمندتر از آن و همیشه روشن و متصل به اینترنت است. این سرورها در مکان هایی به نام مرکز داده (Data Center) نگه داری می شوند.

شرکت های میزبانی وب، سرورهای خود را از این مراکز داده تهیه کرده و خدمات میزبانی وب را به کاربران خود ارائه می دهند. در حال حاضر قویترین سرورها در کشورهای آمریکا، کانادا، انگلیس، آلمان، فرانسه قرار دارند که با توجه به وب سایتی که می خواهید طراحی کنید ممکن است یکی از شرکت ها را انتخاب کنید و این امر برایتان مهم باشد که سرور در چه کشوری قرار دارد.

سرورها را می توان هم از شرکت های ایرانی تهیه کنید و هم از شرکت های خارجی. تنها برتری سرورهای ایران در مقایسه با سروهای خارجی، پینگ بالای سرورهای خارجی در مقایسه با سرورهای ایرانی به دلیل دور بودن سرور از کشور (ایران) است. پینگ عددی می باشد که میزان دسترسی ‌پذیری به سایت شما را بر حسب ميلی ثانیه نشان می دهد، که این عدد در سرورهای ایرانی بین 40 تا 60 میلی ثانیه و برای سرورهای خارجی بین 250 تا 350 میلی ثانیه است. البته این نکته را هم اضافه می کنیم که این عدد دقیقا مشخص کننده سرعت بارگذاری سایت شما نمی باشد، چرا که در صورتی سرور دارای منابع قویتری (رم و سی پی یو و … ) باشد مسلما سرعت بارگذاری سایت شما سریعتر خواهد بود. برتری سرورهای خارجی در مقایسه با سرورهای ایرانی قدرتمندی و پایداری (up time) بالای آنها می باشند (سرورها با قدرتی که دارند در اکثر مواقع باید به درستی کار کنند و نباید قطعی و یا خطا در سرور داشته باشند… ) و با توجه به قوی بودن منابع سرور سرعت بارگذاری را افزایش می دهند.

همانطور که در سیستم خانگی شما سیستم عامل نصب می شود بر روی سرور نیز سیستم عامل ویندوز یا لینوکس نصب می شود که هر یک از این سیستم عامل ها کدنویسی خاص خود را پشتیبانی می کنند.

هر سایت با توجه به زبان برنامه نویسی آن، نیازمند امکانات و قابلیت های خاصی بر روی سرور می باشد. به طور مثال سایتی که با زبان ASP نوشته شده است در سرورهای ویندوزی و سایتی که با زبان PHP نوشته شده در سرورهای لینوکسی قابل اجرا و میزبانی می باشد. پس حتما پس از انتخاب زبان برنامه نویسی سایت، فضای میزبانی را خریداری کنید.

در انتخاب هاستینگ وب باید چند نکته رو توجه داشته باشید . در ادامه چند نکته بسیار مهم در این رابطه بیان کرده ایم.

نکته اول : در هنگام خرید باید به این موضوع توجه داشته باشید که مقدار فضای میزبانی و پهنای باند ارائه شده برای وب سایت شما چقدر می باشد. شرکت های خدمات هاستینگ، فضاهای میزبانی خود را در بسته های مختلفی ارائه می کنند.

مقدار فضای میزبانی باید با توجه به حجم فایلهای سایت و فایلهایی که در آینده به آن اضافه خواهید کرد محاسبه کرده و خریداری کنید. البته این مقدار در صورتی که فضای میزبانی شما پر شود قابل افزایش است. همچنین پهنای باند ارائه شده باید به مقدارکافی باشد تا در صورتی که آمار بازدید شما زیاد شد و تعداد بارگذاری صفحات سایت بالا رفت پهنای باند شما تمام نشود. البته پهنای باند به صورت ماهانه صفر می شود. برخی شرکت ها نیز پهنای باند را به صورت نامحدود ارائه می کنند.

 نکته دوم : تعداد Park Domain, Subdomain, MYSQL Database, Email account  می باشد که برخی شرکت ها این گزینه ها را به صورت محدود ارائه می کنند.

 نکته سوم : تهیه بکاپ و ارائه آن به مشتری در صورت مشکل در سایت می باشد، بسیاری از شرکت ها بکاپ های خود را به صورت هفتگی و ماهانه تهیه می کنند و گاها مسئولیتی در سالم بودن بکاپ خود ندارند و مشتری را موظف به تهیه بکاپ می کنند و برخی نیز تنها یک بار بکاپ را بازگردانی می کنند و برای دفعات بعدی هزینه دریافت می کنند.

نکته چهارم : کنترل پنل ارائه شده توسط شرکت میزبان می باشد که برای سرورهای لینوکس کنترل پنل Cpanel و Direct Admin و برای سرورهای ویندوزی Plesk ارائه می شود. توجه داشته باشید که کنترل پنل Cpanel دارای امکانات بهتری نسبت به Direct Admin در سرورهای لینوکسی می باشد .

نکته پنجم : زبان ها و برنامه هایی آن سرور پشتیبانی می کند از قبیل نسخه زبان برنامه نویسی، نسخه دیتابیس و مزایا و ویژگی های جانبی سرور مثل Zend Optimizer ، ionCube PHP Loader ، ImageMagick, NetPBM, GD و …
جلسه دوم آموزش طراحی وب سایت هم به پایان رسید و در جلسات بعد آموزش طراحی وب سایت و کدنویسی ها رو شروع می کنیم . با ما همراه باشید.

0

آموزش فتوشاپ

سلام دوستان و همراهان طرح سوم… در این مقاله آموزش طراحی گرافیک می خواهیم یکی از ابزارهای فتوشاپ به اسم Clone رو آموزش بدیم بهتون . طبق مراحل این مقاله پیش برید و هر سوالی داشتید داخل نظرات بپرسید حتما.

خروجی کارمون تصویر زیر هستش که عکس یک خانم از داخل اون حذف شده است و در آخر این آموزش شما هم می توانید این کار رو انجام بدید.

final

برای شروع نیاز به این تصویر دارید. اون رو ذخیره کنید.
2

مرحله اول

تصوبر رو داخل فتوشاپ باز کنید!

2

 

3

 

مرحله دوم

ابزار کلون تول Clone Tool رو انتخاب کنید.

4

برای این کار اول نیاز داریم یک منبع برای قسمت مورد نظر انتخاب کنیم تا تصویر رو از اونجا برداشت کنه. هرجا رو میخواین انتخاب کنید و در نظر داشته باشیدش. Alt رو بگیرید بعد کلیک کنید اون قسمت انتخاب میشه! حالا هرجا کلیک کنید از همونجا برمیداری میزاره اونجا که کلیک کردید! خلاصه ۴ ۵ بار این کار رو کنید روش کلیش رو یاد بگیرید! فقط دقت داشته باشید که از جایی که منبع رو بر می دارید المان های اضافی نداشته باشه.

حالا یه لایه جدید بسازید قلمش رو نرم کنید و اینجاها انتخاب کنید و پیر زنه رو پاک کنید از همین روش 6

 

حالا یه همچین عکسی میشه

7

 

قسمت هایی وجود داره تو طرح که باید اصلاح بشه . اشکال نداره حالا یکم دیگه روش کار میکنیم فقط یادتون نره هر مرحله رو روی یه لایه مختلف باشه، پس الان شما ۲تا لایه باید داشته باشید.

8

 

مرحله سوم

یکم اگه دقت کنید علفهای کنار پای راست پیرمرد خیلی شفافتره از همونا استفاده میکنیم و جای چمن های غیر شفاف قرار میدیم روی یه لایه جدید

11

 

همین عملیات رو برای گلها و جاهای دیگه که یکم غیر طبیعی شده انجام بدید.

12

 

مرحله آخر

یک لایه جدید درست کنید و از چمن های سمت راست فرد که یکم سایه دارن استفاده کنید و چپ قرار بدید و بعد یه ماسک به لایه بدید و با یه قلم خیلی نرم دور لایه رو پاک کنید تا چمن لبه نداشته باشه و لایه جدید بشینه روی لایه قدیمی.

13

 

14

 

آموزش خیلی ساده بود توضیح خاصی هم نداشت فقط یکم حوصله و تمیزکاری میخواد. هدف هم فقط تمرین و کار کردن با ابزار Clone Tool بود . منتظر قسمت های دیگر آموزش طراحی گرافیک باشید…

final

0

آموزش طراحی وب سایت
سلام خدمت تمام همراهان طرح سوم . می خواهیم از امروز آموزش طراحی وب سایت رو برای شما عزیزان در داخل وب سایت قرار بدهیم . در این مقاله آموزش طراحی وب سایت رو استارت میزنیم و شما را با تمام مباحثی که برای طراحی وب سایت نیاز است آشنا می کنیم. قبل از شروع طراحی وب سایت مباحث پایه ای هست که یادگیری و دانستن آنها خالی از لطف نیست. اولین قسمت در طراحی وب سایت دانستن عانی دامین و هاست می باشد. اولین کار در آموزش طراحی وب سایت تهیه دامین یا دامنه برای وب سایت هست . دامین نام وب سایت هست که با اسم دامنه وب سایت فراخوانی می شود. بطور مثال دامنه این وب سایت tarhesevom.com هستش . شما می توانید با مراجعه به وب سایت های ثبت دامنه اولین دامنه خودتون رو ثبت کنید. پسوند دامنه ها متفاوت است . رایج ترین پیوند دامنه ها دات کام (com.) هست که خیلی راحت میشه دامنه رو ثبت کرد . دامنه های داخل ایران هم که دامنه های ملی حساب می شوند و دارای پسوند ir هستند هم از طریق سامانه نیک به نشانی nic.ir به راحتی قابل ثبت هستند. دامنه های .info ، .biz و .name نیز در زمره دامنه های قابل ثبت برای عموم ولی با کاربری خاص می باشند. پسوند .info برای طراحی سایت های اطلاعاتی (Information) ، پسوند .biz برای سایتهای تجاری (Business) و پسوند .name هم فقط برای سایتهای شخصی مناسب می باشد استفاده از این سه پسوند در خارج از این چارچوب تعریف شده ممنوع و منجر به حذف دامنه و سلب حقوق مربوطه از مالک آنها خواهد شد. همچنین کلیه دامنه های بین المللی فوق و بسیاری از دامنه های محلی تابع قوانین حمایت کننده از علائم تجاری می باشند.
دامنه ها هر چند زیر نظر یک موسسه (ICANN) صادر می شوند اما پسوندهای گوناگون ممکن است ثباتهای (Registrar) گوناگون داشته باشند که به عنوان نماینده عمل می نمایند. هریک از این ثباتها می توانند در قبال دریافت مبالغی ناچیز امنیت یا خدمات بیشتری را ارائه نمایند. دقت فرمایید که ثبت دامنه ارتباط مستقیم با خدمات میزبانی نداشته و هریک از این خدمات را می توان از طریق تامین کنندگان مختلف تهیه نمود.
همانطور که برای تهیه یک محل سکونت یا تجارت اولین سوال آدرس منطقه مورد نظر است، برای وب سایت نیز این امر اولین مرحله برای شروع می باشد و همانطور که در دنیای واقعی نیز آدرس شما بیانگر بسیاری از نکات برای مخاطبین قبل از رویارویی با شما می باشد. دردنیای مجازی نیز این امر صادق است. آدرس شما مثلا در یک محل گران قیمت یا یک ساختمان معروف گویای سطح بالای فعالیت شماست ، آدرس دفتر کار شما در یک محل مسکونی ممکن است مشکلاتی را برای شما بوجود آورد یا مراجعین شما را دچار سردر گمی نماید ، فعالیتهای تجاری در مناطق مسکونی ممکن است با محدودیتهایی روبرو گردد. با کمی تفاوت می توان مشخصه های مشابهی را نیز برای آدرس مجازی تعریف نمود. هر سایت می تواند از طریق تعداد نامحدودی آدرس ثبت شده قابل دسترسی باشد.
نام دامنه: پس از انتخاب پسوند نام دامنه مهمترین قسمت تشکیل دهنده آدرس یک سایت می باشد. این نام از ترکیب 3 الی 64 حرف ، عدد یا خط تیره (بدون فاصله) تشکیل می گردد. اگر در ثبت عبارت خاصی به عنوان نام دامنه خود اصرار دارید که این عبارت قبلا ثبت شده باشد گریزی غیر از تغییر پسوند مورد نظر خود نخواهید داشت. 
چنانچه آدرس سایت شما حاوی علامت تجاری شما باشد، می توانید جهت اطمینان از دسترسی آسانتر و حفاظت از نام تجاری خود کلیه مشتقات و ترکیبهای آنرا بر روی پسوندهای مختلف ثبت نمایید. توجه به نکات زیر به هنگام ثبت دامنه لازم است:

– عبارت انتخابی تشابه با نام تجاری معروف و معتبر نداشته باشد.
– کوتاه و متشکل از حداقل تعداد حروف باشد.
– تلفظ و بخاطر سپردن آن آسان باشد.
– حتی المقدور با نوع فعالیت سایت ارتباط داشته باشد.
– از اعداد و خط تیره استفاده نشده یا حداقل استفاده صورت گیرد.
– مشابه نام سایت دیگری که موجب سردرگمی بازدید کنندگان شود نباشد.
– برای اطمینان از مالکیت دامنه هنگام ثبت آن بهتر است از قرار گرفتن آدرس پست الکترونیکی خود در قسمت Admin Contact مشخصات دامنه مطمئن شوید.
– حتی المقدور از طریق مراکزی برای ثبت دامنه خود اقدام نمایید که کلمه عبور و مجوز جابجایی و تغییرات را در اختیار شما قرار می دهند.
– حتما شرایط و تعهدات ثبت کننده دامنه و نمایندگیهای و همچنین شرایط اختصاصی پسوند مورد تقاضی را مطالعه و از تبعات حقوقی اقدامات خود آگاه شوید.
– هرگز از آدرس مجهول یا غیر واقعی در مشخصات دامنه خود استفاده ننمایید.
– قبل از انتخاب دامنه مطمئن شوید که علامت تجاری یا هر گونه علامت ثبت شده دیگر که متعلق به غیر بوده و شما قانونا مجوز رسمی جهت استفاده از آنرا ندارید در آدرس شما بکار نرفته باشد.
– درصورتی که نام مورد نظر شما قبلا ثبت شده و تاریخ انقضای آن نزدیک است می توانید از خدمات دهنده خود تقاضای خدمات پیش سفارش (Back Order) دامنه را بنمایید.
– هرگز از DNS شرکتها و خدمات دهنده هایی که مجاز به استفاده از آن نمی باشید در دامنه خود استفاده نکنید و ابن مشخصات را بدون مشورت با شخص فنی تغییر ندهید. زیرا هر تغییری در این مشخصات می تواند منجر به غیر فعال شدن سایت شما گردد.
– اعتبار دامنه خود را حتی المقدور تا یک ماه قبل از سر رسید انقضا تجدید نمایید.
– جهت انتقال دامنه ها از یک ثبت کننده به ثبت کننده دیگر یکماه زودتر از تاریخ انقضا اقدام نمایید.
– به محل و حساسیتهای سیاسی و اقتصادی ثبت کننده خود دقت نمایید، در صورت وجود دعاوی در ارتباط با پسوندهای عمومی و اختصاصی محل دادگاه رسیدگی کننده ، محل ثبت کننده دامنه خواهد بود.
– در ارتباط با استفاده از دامنه قوانین بین المللی و قوانین محلی را همزمان در نظر داشته باشید.
– از خدمات مانیتور مشخصات دامنه یا مخفی نمودن مشخصات خود برای جلوگیری از مزاحمتهای تبلیغاتی و سرقت دامنه خود استفاده نمایید.
اولین قسمت از آموزش طراحی وب سایت رو تموم کردید. از قسمت های بعدی اندکی بیشتر وارد مباحث آموزش طراحی وب سایت میشیم تا کم کم بتونید برای خودتون کدهایی رو در وب سایت خلق کنید…
0