آخرین مطالب
امکانات وب
کلمات کليدي true و false نيز مي‌توانند به‌عنوان unary operators به‌منظور overload کردن مورد استفاده قرار گيرند. نسخه‌ي overload شده‌ي اين operator ها با توجه به کلاسي که شما مي‌سازيد، شخصي‌سازي ميشود. هنگامي‌که true و false براي يک کلاس overload مي‌شوند، مي‌توانيد از اشياي آن کلاس براي کنترل کردن if، for، while و do-while و همچنين ? استفاده کنيد.
class TwoD
{
int X, Y;
public TwoD()
{
X = Y = 0;
}
public TwoD(int a, int b)
{
X = a;
Y = b;
}
public static bool operator true(TwoD op)
{
retu (op.X != 0 || op.Y != 0);
}
public static bool operator false(TwoD op)
{
retu (op.X == 0 && op.Y == 0);
}
public static TwoD operator --(TwoD op)
{
TwoD result = new TwoD();
result.X = op.X - 1;
result.Y = op.Y - 1;
retu result;
}
public static TwoD operator ++(TwoD op)
{
TwoD result = new TwoD();
result.X = op.X + 1;
result.Y = op.Y + 1;
retu result;
}
public void Show()
{
Console.WriteLine("{0}, {1}", X, Y);
}
}
class OpOverloadingDemo
{
static void Main()
{
TwoD ob = new TwoD(5, 5);
if (ob)
Console.WriteLine("ob is true");
Console.WriteLine();
for (; ob; ob--)
{
ob.Show();
}
Console.WriteLine();
ob = new TwoD(-3, -3);
while (ob)
{
ob.Show();
ob++;
}
}
}
دقت کنيد که چگونه از شيء TwoD براي کنترل if و while و for استفاده شده است. به‌عنوان مثال، در مورد if، شيء TwoD توسط true ارزيابي ميشود. اگر حداقل يکي از فيلدهاي اين شيء مخالف صفر باشد، دستور if اجرا خواهد شد. در مورد حلقه‌ها، حلقه تا زماني اجرا ميشود که شيء true باشد (فيلدهاي شيء مخالف صفر باشد) و به‌محض اينکه شيء false شد (همه‌ي فيلدها صفر شدند) برنامه از حلقه خارج ميشود.
overload کردن عملگرهاي منطقي
همانطور که مي‌دانيد، سي‌شارپ شامل عملگرهاي منطقي & ، | ، ! و && و || است. البته فقط & و | و ! مي‌توانند overload شوند. با اين حال با دنبال کردن يک سري قوانين مي‌توانيد از مزيت‌هاي && و || بهره ببريد.
اگر قصد استفاده از عملگرهاي منطقي short-circuit را نداشته باشيد، مي‌توانيد بسيار ساده & و | را overload کنيد که هر کدام از آنها يک مقدار bool را retu ميکند. overload کردن ! نيز مقدار bool را retu ميکند.
مثال زير عملگرهاي منطقي ! و & و | را overload ميکند. مانند قبل فرض بر اين است که شيء TwoD در صورتي true است که حداقل يکي از فيلدهاي آن غير صفر باشد و در صورتي‌که همه‌ي فيلدهاي TwoD صفر باشند، شيء false است:
using System;
class TwoD
{
int X, Y;
public TwoD()
{
X = Y = 0;
}
public TwoD(int a, int b)
{
X = a;
Y = b;
}
public static bool operator &(TwoD op1, TwoD op2)
{
retu ((op1.X != 0 && op1.Y != 0) && (op2.X != 0 && op2.Y != 0));
}
public static bool operator |(TwoD op1, TwoD op2)
{
retu ((op1.X != 0 || op1.Y != 0) || (op2.X != 0 || op2.Y != 0));
}
public static bool operator !(TwoD op)
{
retu (op.X == 0 & op.Y == 0);
}
public void Show()
{
Console.WriteLine("{0}, {1}", X, Y);
}
}
class OpOverloadingDemo
{
static void Main()
{
TwoD a = new TwoD(1, 2);
TwoD b = new TwoD(8, 8);
TwoD c = new TwoD();
Console.Write("Here is a: ");
a.Show();
Console.Write("Here is b: ");
b.Show();
Console.Write("Here is c: ");
c.Show();
Console.WriteLine();
if(!a)
Console.WriteLine("a is false");
if(!b)
Console.WriteLine("b is false");
if(!c)
Console.WriteLine("c is false");
Console.WriteLine();
if (a & b)
Console.WriteLine("a & b is true");
else
Console.WriteLine("a & b is false");
if(a & c)
Console.WriteLine("a & c is true");
else
Console.WriteLine("a & c is false");
Console.WriteLine();
if(a | b)
Console.WriteLine("a | b is true");
else
Console.WriteLine("a | b i false");
if(a | c)
Console.WriteLine("a | c is true");
else
Console.WriteLine("a | c is false");
}
}
خروجي:
در اين روش، operator method هاي & و | و ! هرکدام يک مقدار bool را retu ميکنند. به‌دليل اينکه از اين operator ها در حالت استاندارد خودشان استفاده شود، retu کردن مقدار bool ضروري است. روشي که در مثال قبل مشاهده کرديد، فقط براي زماني است که به short-circuit نياز نداريد.
فعال کردن operator هاي short-circuit
براي فعال کردن && و || بايد از چهار قاعده پيروي کنيد. يک، کلاس مورد نظر بايد & و | را overload کند. دو، retu type متدهاي overload شده‌ي & و | بايد از نوع همان کلاسي باشد که اين operator ها در آن overload مي‌شوند. سه، هر پارامتر بايد به يک شيء از جنس همان کلاسي که operator در آن overload شده است، رجوع کند. چهار، operator هاي true و false بايد براي کلاس مربوطه overload شود.
public TwoD(int a, int b)
{
X = a;
Y = b;
}
// Overload & for short-circuit evaluation.
public static TwoD operator &(TwoD op1, TwoD op2)
{
if ((op1.X != 0 && op1.Y != 0) && (op2.X != 0 && op2.Y != 0))
retu new TwoD(1, 1);
else
retu new TwoD();
}
// Overload | for short-circuit evaluation.
public static TwoD operator |(TwoD op1, TwoD op2)
{
if ((op1.X != 0 || op1.Y != 0) || (op2.X != 0 || op2.Y != 0))
retu new TwoD(1, 1);
else
retu new TwoD();
}
// Overload true.
public static bool operator true(TwoD op)
{
retu (op.X != 0 || op.Y != 0); // at least one field is non-zero
}
// Overload false.
public static bool operator false(TwoD op)
{
retu (op.X == 0 & op.Y == 0); // all fields are zero
}
// Overload !.
public static bool operator !(TwoD op)
{
retu (op.X == 0 & op.Y == 0);
}
public void Show()
{
Console.WriteLine("{0}, {1}", X, Y);
}
}
class OpOverloadingDemo
{
static void Main()
{
TwoD a = new TwoD(5, 6);
TwoD b = new TwoD(10, 10);
TwoD c = new TwoD();
Console.Write("Here is a: ");
a.Show();
Console.Write("Here is b: ");
b.Show();
Console.Write("Here is c: ");
c.Show();
Console.WriteLine();
if (!a)
Console.WriteLine("a is false");
if (!b)
Console.WriteLine("b is false");
if (!c)
Console.WriteLine("c is false");
Console.WriteLine();
if (a & b)
Console.WriteLine("a & b is true");
else
Console.WriteLine("a & b is false");
if (a & c)
Console.WriteLine("a & c is true");
else
Console.WriteLine("a & c is false");
Console.WriteLine();
if (a | b)
Console.WriteLine("a | b is true");
else
Console.WriteLine("a | b i false");
if (a | c)
Console.WriteLine("a | c is true");
else
Console.WriteLine("a | c is false");
Console.WriteLine();
// Now use short-circuit ops.
Console.WriteLine("Use short-circuit && and ||");
if (a && b)
Console.WriteLine("a && b is true.");
else
Console.WriteLine("a && b is false.");
if (a && c)
Console.WriteLine("a && c is true.");
else
Console.WriteLine("a && c is false.");
if (a || b)
Console.WriteLine("a || b is true.");
else
Console.WriteLine("a || b is false.");
if (a || c)
Console.WriteLine("a || c is true.");
else
Console.WriteLine("a || c is false.");
}
}
خروجي:
در اينجا نگاهي دقيقتر به برنامه‌ي بالا مي‌اندازيم و مي‌بينيم که چطور & و | اجرا شده‌اند. به اين قسمت از کد بالا توجه کنيد:
// Overload & for short-circuit evaluation.
public static TwoD operator &(TwoD op1, TwoD op2)
{
if ((op1.X != 0 && op1.Y != 0) && (op2.X != 0 && op2.Y != 0))
retu new TwoD(1, 1);
else
retu new TwoD();
}
// Overload | for short-circuit evaluation.
public static TwoD operator |(TwoD op1, TwoD op2)
{
if ((op1.X != 0 || op1.Y != 0) || (op2.X != 0 || op2.Y != 0))
retu new TwoD(1, 1);
else
retu new TwoD();
}
دقت کنيد که هر دو يک شيء از جنس TwoD را retu ميکنند. توجه داشته باشيد که چگونه اين شيء به‌وجود آمده است. اگر خروجي عملياتي که انجام شده true باشد، بنابراين يک شيء TwoD که true است (شيءاي که حداقل يکي از فيلدهاي آن غير صفر است) retu ميشود. اگر خروجي false باشد، يک شيء false ساخته شده و سپس retu ميشود.
بنابراين در عباراتي به شکل زير:
1
2
3
4
if (a & b)
Console.WriteLine("a & b is true");
else
Console.WriteLine("a & b is false");
خروجي a & b يک شيء TwoD است که در اين مورد يک شيء true است. از آنجا که operator هاي true و false در اين کلاس تعريف شده‌اند، شيءاي که retu شده است مربوط به true operator بوده و در نهايت يک مقدار بولين retu ميشود که در اينجا اين شيء true است و در نتيجه مقدار true نيز retu ميشود و محتويات دستور if اجرا خواهد شد.
به‌دليل اينکه قوانين مورد نياز رعايت شده‌اند، operator هاي short-circuit براي استفاده از اشياي TwoD نيز فعال هستند و به‌اين صورت کار ميکند که، اولين operand توسط operator true (براي ||) يا operator false (براي &&) بررسي ميشود. اگر خروجي عمليات قابل تشخيص باشد، بنابراين & يا | مربوطه مورد ارزيابي قرار نمي‌گيرد. در غير اين‌صورت، از & يا | مربوطه براي يافتن خروجي استفاده ميشود. بنابراين، استفاده از && يا || موجب ميشود & يا | مربوطه تنها زماني فراخواني شود که operand اول نتواند خروجي را مشخص کند. براي نمونه، به کد زير توجه کنيد:
1
if (a || c) Console.WriteLine("a || c is true.");
در ابتدا true operator روي a اعمال ميشود و از آنجا که در اين مورد a برابر با true است، ديگر نيازي به استفاده از | operator نيست. اما در کد زير:
if (c || a) Console.WriteLine(“a || c is true.”);
ابتدا true operator روي c اعمال ميشود که در اين مورد c برابر با false است. بنابراين، | operator فراخواني خواهد شد تا بررسي شود که آيا a برابر با true است يا خير (که در اين مورد، a برابر با true است). شايد در ابتدا فکر کنيد که تکنيک استفاده شده براي فعال کردن short-circuit مقداري پيچيده و دشوار باشد اما اگر اندکي در مورد آن فکر کنيد متوجه خواهيد شد که کارهاي انجام شده منطقي به‌نظر مي‌رسد. در حالت کلي، بهتر است از همين روش استفاده کنيد.
Conversion Operators
در برخي از مواقع، ميخواهيد از شيء يک کلاس در عبارتي استفاده کنيد که شامل data type هاي ديگري نيز است. در بعضي موارد، overload کردن يک يا چند operator مي‌تواند اين کار را براي شما انجام دهد اما گاهي چيزي که شما نياز داريد يک تبديل ساده از نوع کلاس به نوع مورد نظرتان است. براي انجام اين دسته از موارد، سي‌شارپ به شما اجازه ميدهد نوع خاصي از operator method را بسازيد که conversion operator ناميده ميشود. Conversion operator يک شيء از کلاس شما را به نوع ديگري که مد نظرتان است تبديل ميکند.
دو حالت از conversion operator موجود است: implicit و explicit که فرم کلي آنها به شکل زير است:
public static operator implicit target-type(source-type v) { retu value; }
public static operator explicit target-type(source-type v) { retu value; }
در اينجا، target-type مشخص کننده‌ي نوعي است که قصد داريد source-type را به آن تبديل کنيد و value مقدار کلاس، بعد از تبديل است. Conversion operator اطلاعات را مطابق با target-type باز مي‌گرداند (retu ميکند).
اگر conversion operator به‌طور implicit مشخص شود، بنابراين conversion به‌صورت اتوماتيک انجام خواهد شد، مثل حالتي که شيء در يک عبارت همراه با يک data type ديگري از نوع target-type در تعامل است. هنگامي‌که conversion به‌صورت explicit تعريف شده باشد، بنابراين هنگامي که cast مورد نياز است conversion فراخواني ميشود. توجه کنيد که نمي‌توانيد براي يک source-type و target-type هم implicit و explicit را تعريف کنيد.
براي نشان دادن conversion operator آن را در کلاس TwoD اعمال ميکنيم. با فرض اينکه ميخواهيد يک شيء TwoD را به يک int تبديل کنيد و در يک عبارت از جنس int از آن استفاده نماييد:
public TwoD(int a, int b)
{
X = a;
Y = b;
}
public static implicit operator int(TwoD op)
{
retu op.X * op.Y;
}
}
class OpOvDemo
{
static void Main()
{
TwoD ob1 = new TwoD(2, 2);
TwoD ob2 = new TwoD(1, 1);
int i = ob1 * 3;
Console.WriteLine(i);
i = ob1 - 3;
Console.WriteLine(i);
i = ob1 + ob2;
Console.WriteLine(i);
i = ob1;
Console.WriteLine(i);
}
}
طراحی وب سایت...ما را در سایت طراحی وب سایت دنبال می کنید
برچسب : طراحی وب سایت, طراحی سایت, طراحی وب, نویسنده : pooyesh webdesign30 بازدید : 218
Tim Beers-Lee (تيم برنرز لي)، بنيانگذار شبکه جهاني وب، با راه اندازي يک وب سايت در آگوست سال ????، نام خود را به عنوان نخستين طراح وب در تاريخ به ثبت رساند. او در نخستين وب سايت خود از ابرمتن (Hyperlink) و پيوندي براي ايميل استفاده کرده بود.
در آغاز، سايتهاي وب با کُدهاي طراحی ساده «اچ تي‌ام‌ال» نوشته مي شدند، گونه اي از زبان کُدنويسي که ساختار ساده‌اي به وب سايت ها مي داد، شامل سرتيتر و پاراگراف، و توانايي پيوند دادن به صفحه هاي وب ديگر، با اَبَرمتن. در مقايسه با روش هاي ديگر، اين راه تازه و متفاوتي بود که کاربران به سادگي مي توانستند با يک مرورگر، صفحه هاي پيوند خورده را باز کنند.
با پيشرفت وب و هنر طراحي آن، زبان کُد نويسي اش، اَبَرمتن يا اچ‌تي‌ام‌ال، پيچيده تر و پرانعطاف تر شد. ابزاري مانند جدول ها که بيشتر براي نمايش نمودارهاي داده اي بودند، بزودي مورد استفاده نادرست، براي چيدمان هاي پنهان در صفحه هاي وب قرار گرفتند. با پيدايش صفحه هاي الگوي وب يا «CSS»، روش نادرست طراحي با جدول هاي پنهان در صفحه، از گردونه خارج، و بجاي آن استفاده مناسب از صفحه هاي الگوي وب يا «CSS»، جايگزين شد.
فن آوري هاي يکپارچه سازي داده‌گاه ها (Database)، مانند زبانهاي کُدنويسي سمت سرور (Server-Side Scripting) مانند CGI, PHP, ASP.NET, ASP, JSP و ColdFusion، و استانداردهاي طراحي مدرن با الگوها (CSS)، ساختار سايت هاي وب را باز هم تغيير داده و آنرا پيشرفته تر کرده اند.
همچنين با آمدن نگاره هاي جاندار و فن آوري هاي پويانمايي به صفحه ها، مانند فِلَش (Flash)، چهره وب بيشتر از پيش تغيير کرد و توانمندي هاي تازه به سازندگان رسانه و طراح هاي وب داده شد، و توانايي هاي بيشتر و کارايي ها تازه مرورگرها براي html.
طراحي وب سايت
وب سايت مجموعه اي از اطلاعات درباره موضوع و يا عنوان خاص است. طراحي يک وب سايت مشخص کننده آرايش و ساختــار صفحات وبي است که بوجود آورنده وب سايت خواهند بود. يک صفحه وب شامـــل اطلاعاتي درمورد هدف ايجــاد وب سايت ميباشد. يک وب ســايت را همــانند کتابي تصور کنيد کـه هر صفحه وب در حکم برگي از کتاب خواهد بود.
در زمينه طراحي وب سايت جنبه هاي گوناگوني بايد در نظر گرفته شود که به سبب پيشرفت روز افزون اينترنت همواره براين موارد افزوده مي شود.
براي وب سايت هاي تجاري عمومي، موارد زير از جمله اصلي ترين آنها به شمار مي روند:
1.طراحي سايت بر طبق عنوان و محتواي مطالب مي باشد.
2.مطالب، جوهر کلام و اطلاعات درون سايت بايد مطابق با هدف سايت بوده و طيفي از عموم را نشانه رود که به دنبال اطلاعات ارائه شده در سايت هستند.
3.سايت بـــايد قابل فهم بوده طراحی و برقـــراري ارتبــاط با آن حتي براي مخاطباني کـه آشنايي چنداني بـا وب ندارند، آســـان باشد. چنانچه سايت به اندازه کافي بزرگ بوده و اطلاعات زيادي را شامــل شود، بـايد اطلاعات راهنما را به گونه اي بکار برد که به سرعت در اختيار بيننده قرار گيرند.
4.نماي کــار بايد کلي بوده و تمام صفحه را دربر گيرد تا بتواند پايـداري و ثبات را القــا کند. سبک نگارش بايد زيبا و تخصصي بوده و مناسب با سليقه مخاطبان و محتواي سايت باشد.
5.در نگارش متون و اطلاعاتي که مخاطب به دنبال آنها است بايد بزرگ نمايي شود تا به بيننده القا کند که اين همان چيزي است که به دنبال آن بوده است.
6.همچنين سايت بايد به سادگي در اينترنت يافت شود و درصورت امکان در بالاي ليست هاي جستجو قرار گيرد، اگرچه همواره اينگونه نباشد لااقل در موتورهاي جستجوي اصلي چنين شود.
يک وب سايت معمولا شامـل متن و تصـاويـر است. اولين صفحه يک وب سـايت صفحه خانه (Home Page) و يا صفحه ايندکس (index) ناميده مي شود. بعضي از وب سايت هـــا از صفحه اي استفـــاده ميکنند کـــه معمولا صفحه خوش آمد ناميده مي شود. اين صفحه ممکن است شــامــل مواردي چون پيغــــــــــام خوش آمـدگويي، انتخاب زبـــان، انتخاب ناحيه جغرافيايي و يـا اعلام عدم پذيرش مسوليت درمــوارد خاص باشد. هر صفحه وب درون سايت وب، يک فايل HTML است که URL مخصوص به خود را دارد.
بعد از اين که هر صفحه وب ساخته شد، اين صفحات با استفاده از فهرست راهنمايي که از پيوندهاي مختلف تشکيل شده است به يکديگر متصل مي شوند.
هنگامي که يک وب ســايت کامل شد براي آنکه بـراي همه برروي اينترنت قابل مشاهده باشد بايد منتشر و يا ارسال (Upload) شود. اين کار به کمک يک ميزبان FTP انجام ميشود. هنگامي که سايت منتشر شد، مدير سايت براي افزايش بازديدکنندگان، از تکنيکهاي گونــاگون استفاده مي کند. اين کار با ثبت کردن وب سـايت در موتورهاي جستجويي نظير Google و Yahoo، تبادل لينک با وب ســايت هاي ديگر، ايجاد پيوند با وب سايتهاي مشابه و غيره امکان پذير است.
نمونه طراحي استاتيک : http:\\rohanit.com
تاريخچه وب سايت
طرح وب سايت
طرح وب به قالب نمايشي و طراحي گرافيکي صفحات موجود در وب سايت مي گويند که معرف محتوا و مطالب آن وب سـايت مي باشد. طرح وب جلوه بصـري هدف وب سايت است و اولين بخش از يک صفحه وب است که ذهن مخاطب را با خود درگير مي کند.
طراح وب با در نظر گرفتن هدف سايت و مخاطبان آن و با استفـاده از المان هاي متناسب با رويکرد سـايت و به کمک ذهن خلاق و ذوق هنري خود در بکار بردن ابعاد و رنگها، طرحي خلق مي کند که ضمن ايجـاد يکپارچگي در کليه صفحات وب سايت، نماي تکرار شونده و خسته کننده را به مخاطب القا نکند. در وب سايت بايد از الگوي ثابتي در صفحات استفاده کرد که کاربر به هنگام ديدن صفحات متوجه اين است که همه صفحات در يک سايت مشخص هستند.
Adobe Flash
Adobe Flash (سابقا Macromedia Flash) يک برنــامه ايجاد انيميشن و يــا برنامه کاربردي گرافيکي قوي است که براي سـاخت و اجرا کردن محتواي پويـــا، مطالب چند رسانه اي مــانند صدا و تصويــر و برنامه هــاي کاربردي محاوره اي بر روي وب و از طريق مرورگر (Browser) مورد استفاده قرار مي گيرد.
فلش مــانند اغلب قــالب هــا و تــوافقنــامه هــاي اينترنتي نبوده و يک محصول تـــائيد شده از طرف ســازمــان استانداردهـا نمي باشد. فلش بسيار محدودکننده تر از قالب HTML بوده کـه به هر حال ديدن آن احتياج به يک Plugin اختصاصي دارد و با بيشتر امکانات کاربردي مرورگرهاي وب مانند دکمه Back سازگاري ندارد مگر اين که لينکي به يک صفحه HTML جديد از فــايل فلش پيوند داده شده بـــاشد که در اين صورت انيميشن صفحه قبـل بــايد از ابتدا شروع شود، تــا جائيکه محدوديتهــاي موجود ممکن است بــا توجه به اهداف طراحي وب سـايت، بي ربط بنظر برسند.
براساس آمـار 98 درصد از کاربــران وب در آمريکا برنــامه اجراي فلش را بـرروي رايــانه هاي خود نصب کرده اند و حدود 45 تا 56 درصد از آنها آخرين نسخه اين برنامه را دارند که البته نوساناتي نيز در اين آمار وجود دارد.
بسياري از طراحـان گرافيک از فلش به جهت کنترل کاملي کـه برروي هر بخش از طرح به آنها مي دهد و حرکت و روحي که به هر المان اضافه ميشود استفاده ميکنند.
برخي از طراحــــان برنــامه هــاي کاربردي به اين دليل از فلش استفــاده مي کنند که به آنهــــا اجازه ســـاخت برنــامه هائي را مي دهد که نيــازي به دوباره خواني و يـــا رفتن به صفحه جديد به ازاي هر فعل و انفعـــالي را ندارد. فلش توانائي استفاده از فونت هايي که برروي اغلب رايانه ها نصب نشده اند را دارد.
سايتهــاي بسياري وجود دارد که تمامــا در قالب فلش هستند. سايتهــاي ديگري نيز از فلش به جاي فايلهــاي تصويــري jpeg و يا gif استفـاده مي کنند، البته با قابليت حجم کمتر فايلهــاي برداري و سرعت بيشتر دريــافت فايلها.
همينطور از فلش مي توان براي جلوگيري از تکثير و يا جستجوي غير مجاز استفاده کرد.
مخالفان فلش ادعــا مي کنند که وب سايتهاي فلش طرحي کامل نداشته و اغلب داراي رابط کاربر مغشوش و غير استاندارد مي باشند. هم اکنون موتورهاي جستجو قادر به فهرست بندي فايلهـاي فلش نيستند که باعث مي شود مطالب ســايت به سادگي پيدا نشده و مورد جستجو قرار نگيرند، دليل آن اين است کـه بسيــاري از موتورهــاي جستجوگر، وب ســايتها را بــا تکيه بر متن، فهرست بندي مي کنند. البته اين قابليت وجود دارد که براي مرورگرهائي که توانائي نمايش فايلهــاي فلش را ندارند، مطالب جايگزين مشخص شود که اين مطالب به درک بهتر موتورهاي جستجوگر از سايت مي انجامد و باعث بوجود آوردن ديد بهتري از سايت مي شود.
زبــان اسکريپت نويسي فلش، Action Script ناميده مي شود و بـــه زبــان JaveScript شباهت دارد کــه البتـه ويژگي هاي مفيدي را با يکديگر ادغام نموده است. مثلا در خصوص اندازه قلم، پاسخ به رويدادهاي زمـان اجرا، امکاناتي براي افراد نابينا و بسياري ويژگيهاي ديگر.
ActionScript يک زبان شي گرا بوده که امکان استفاده از CSS ،XML و طراحي برنامه هاي کاربردي وب بر پـايه کلاس هاي ساخت يافته را در فلش به ما مي دهد.
وب سايت هاي پوياو ايستا
وب سايتهاي ايستا معمولا به وب سايتهايي گفته مي شود که صفحات آن يک بار ايجاد و تا مدت زماني تغيير نمي يابند و در صورت نياز به تغيير و بروزرساني صفحات آن معمولا اين کار پر دردسر و زمان بر است و در صورت نياز به تغيير بايستي صفحه تغيير يافته منتشر ( Upload ) گردد .
وب سايتهاي دايناميک به وب سايتهايي گفته مي شود که در طراحي آن از زبانهاي برنامه نويسي استفاده شده است و در صورت نياز به تغيير در سايت ( ايجاد صفحه جديد ، ويرايش متون ، ايجاد پيوند و ... ) اينکار به سادگي و توسط نرم افزار نوشته شده مخصوص آن انجام مي پذيرد .
در وب سايتهاي دايناميک صفحه به پايگاه داده وصل بوده و با توجه به درخواست کاربر ( جستجو ، پيوند به صفحه و ... ) محتويات صفحات تغيير مي يابند .
روش قديمي مورد استفاده در طراحي صفحات وب (HTML)، بصورت ايستا (Static) است که بـراي تبديل آن به مطالب پويا دو روش وجود دارد:
•روش سمت سرويس دهنده (Server-side)
•روش سمت سرويس گيرنده (Client-side)
در روش Server-side يک سرور وب که نرم افـــزار خاصي را اجرا ميکند، يک صفحه HTML مطابق بـا درخواست کاربر و متناسب با ديگر متغيرها ايجاد مي کند.
:: زبانهاي اسکريبت نويسي متداول عبارتند از:
PHP-Perl-JSP-ColdFusion-ASP-ASP .NET-Ruby-Python
مانند دايرکتوري معروف ايراني www.yaoo.ir که آينده روشني در انتظار اين طراحی سايت ميباشد.هزاران ايراني
DHTML سمت سرويس گيرنده نيز در جهت افزايش تحرک و فعل و انفعالات در صفحات وب بوجود آمده است
تکنولوزي توليد و نوسعه صفحات دايناميک مي باشد که به سه زبان #VB, C# , J نوشته مي شود.
ASP .NET بخشي از NET Platform. شرکت مايکروسافت و جانشين تکنولوژي قديمي تر از آن بــه نــــام ASP است. ASP .NET بر پــايــه "زبـــان مشترک زمــان اجـــرا" ساخته شده است، به اين معني که برنــامه نويســان مي توانند کــدهاي ASP .NET را بــا استفــاده از هر زبــان برنامه نويسي NET. مايکرو سافت بنويسند.
پايگاه داده (Database)
در علوم رايانه، پايگاه داده به عنوان يک مجموعه ساخت يــافته از داده ها يا اطلاعات ذخيره شده در يک رايانه تعريف مي شود. بطوريکه ميتوان آنرا براي پاسخ به درخواستها کاوش نمود.
داده هاي بازيــافت شده در جواب درخواستها، اطلاعاتي را به ما مي دهند که به عنوان نتــايج، مورد استفاده قرار مي گيرند. برنــامه کامپيوتري مورد استفــاده براي اداره کردن و جستجو نمودن يک پايگــاه داده، سيستم مديريت پايگــاه داده (DBMS) ناميده ميشود. خصوصيـات و طراحي سيستمهــاي پايگــاه داده در علم اطلاعات گنجانده شده اند.
Microsoft SQL Server يکي از انواع پايگاه داده مي باشد که از سيستم مديريت پايگاه داده رابطه اي استفاده مي کند و توليد شده توسط مايکروسافت است.
HP - PHP: Hypertext Preprocessor
PHP يک زبان برنامه نويسي انعکاسي است که در ابتدا براي توليد صفحات وب پويا ساخته شده بود.
PHP بيشتر در اسکريپت نويسي سمت سرويس دهنده بکار ميرود. بطور کلي PHP بر روي يک سرويس دهنده وب اجــرا مي شود بطوري کــه کدهــايPHP بــه عنوان داده هاي ورودي گرفتــه شده و صفحــات وب بـه عنوان خروجي ايجــاد مي شوند، بعلاوه از PHP ميتـوان طراحی براي اسکريپت نويسي(Command-line) و نيـــز ايجــاد رابــط گرافيکي کاربـــر سمت سرويس گيرنده استفــاده کــرد. PHP مي تواند بر روي اکثــر سرورهــاي وب و تقريبــا هر سيستم عاملي به راحتي قرار گيرد.
همچنين گروه PHP، کد منبع کامـل خود را براي ساخت، تغيير و توسعه PHP جهت استفــاده شخصي کاربـران، در اختيار آنها قرار داده است
طراحی وب سایت...ما را در سایت طراحی وب سایت دنبال می کنید
برچسب : نویسنده : pooyesh webdesign30 بازدید : 186
اتحاد جماهير شوروي آن زمان موشکي با نام «اسپونيک» (Spotnik) را به فضا مي‌فرستد و نشان ميدهد داراي قدرتي است که مي‌تواند شبکه‌هاي ارتباطي آمريکا را توسط موشک‌هاي بالستيک و دوربرد خود از بين ببرد. آمريکايي‌ها در پاسخگويي به اين اقدام روس‌ها، موسسه پروژه‌هاي تحقيقي پيشرفته “ARPA” را به‌وجود آوردند. هدف از تاسيس چنين موسسه‌اي پژوهش و آزمايش براي پيدا کردن روشي بود که بتوان از طريق خطوط تلفني، کامپيوترها را به هم مرتبط نمود. به طوري که چندين کاربر بتوانند از يک خط ارتباطي مشترک استفاده کنند. در اصل شبکه‌اي بسازند که در آن داده‌ها به صورت اتوماتيک بين مبدا و مقصد حتي در صورت از بين رفتن بخشي از مسيرها جابه‌جا و منتقل شوند. در اصل هدف “ARPA” ايجاد يک شبکه اينترنتي نبود و فقط يک اقدام احتياطي در مقابل حمله احتمالي موشک‌هاي اتمي دوربرد بود. هر چند اکثر دانش امروزي ما درباره شبکه به‌طور مستقيم از طرح آرپانت “ARPPA NET” گرفته شده‌است. شبکه‌اي که همچون يک تار عنکبوت باشد و هر کامپيوتر ان از مسيرهاي مختلف بتواند با همتايان خود ارتباط دااشته باشد واگر اگر يک يا چند کامپيوتر روي شبکه يا پيوند بين انها از کار بيافتاد بقيه باز هم بتوانستند از طراحی وب سایت مسيرهاي تخريب نشده با هم ارتباط بر قرار کنند.
اين ماجرا با وجودي که بخشي از حقايق به‌وجود آمدن اينترنت را بيان ميکند اما نمي‌تواند تمام واقعيات مربوط به آن را تشريح کند. بايد بگوييم افراد مختلفي در تشکيل اينترنت سهم داشته‌اند آقاي “Paul Baran” يکي از مهمترين آنهاست. آقاي باران که در دوران جنگ سرد زندگي مي‌کرد مي‌دانست که شبکه سراسري تلفن آمريکا توانايي مقابله با حمله اتمي شوروي سابق را ندارد. مثلا اگر رييس جمهور وقت آمريکا حمله اتمي متقابل را دستور دهد، بايد از يک شبکه تلفني استفاده مي‌کرد که قبلا توسط روس‌ها منهدم شده بود. در نتيجه طرح يک سيستم مقاوم در مقابل حمله اتمي روس‌ها ريخته شد.آقاي باران (Baran) تشکيل و تکامل اينترنت را به ساخت يک کليسا تشبيه کرد و معتقد بود، طي سال‌هاي اخير هر کس سنگي به پايه‌ها و سنگ‌هاي قبلي بنا اضافه ميکند و انجام هر کاري وابسته به کارهاي انجام شده قبلي است. بنابراين نميتوان گفت، کدام بخش از کار مهمترين بخش کار بوده‌است و در کل پيدايش اينترنت نتيجه کار و تلاش گروه کثيري از دانشمندان است. داستان پيدايش اينترنت با افسانه و واقعيت در هم آميخته شده‌است.
ولي آقاي باران (Baran) بنابر دلايلي حاضر با همکاري با نيروي هوايي آمريکا نشد. در اين ميان دانشمندي با نام تيلور (Tailon) وارد موسسه آرپا (ARPA) شد. او مستقيما به آقاي هرتسفلد رييس موسسه پيشنهاد کرد: (ARPA) آرپا هزينه ايجاد يک شبکه آزمايشي کوچک با حداقل چهار گره را تامين کند که بودجه آن بالغ بر يک ميليون دلار مي‌شد. با اين پيشنهاد تيلور تجربه‌اي را آغاز کرد که منجر به پيدايش اينترنت امروزي شد. او موفق شد در سال، دو کامپيوتر را در شرق و غرب آمريکا به هم متصل کند. با اين اتصال انقلابي در نحوه صدور اطلاعات در دنياي ارتباطات رخ داد که نتيجه آن را امروز همگي شاهد هستيم. اين شبکه به بسته‌هايي (packet) از داده‌ها که به وسيله کامپيوترهاي مختلف ارسال مي‌شدند اتکا داشت. پس از انکه ازمايشها سودمندي انرا مشخص کردند ساير بخشهاي دولتي و دانشگاهها پژوهشي تمايل خود را به وصل شدن به ان اعلام کردند . ارتباطات الکترونيکي به صورت روشي موثر براي دانشمندان و ديگران به منظور استفاده مشترک از داده‌ها در امد. در همان زمان که ARPAnet در حال رشد بود تعدادي شبکه پوشش محلي (LAN) در نقاط مختلف آمريکا به وجود امد. مديران LANها نيز به وصل کردن کامپيوترهاي شبکه‌هاي خود به شبکه‌هاي بزرگتر اقدام کردند . پروتوکل اينترنت ARPAnet IP زبان استاندارد حکمفرما براي برقراري ارتباط کامپيوترهاي شبکه‌هاي مختلف به يکديگر شد.تاريخ تولد اينترنت به طور رسمي اول سپتامبر ???? اعلام شده‌است. زيرا که اولين “IMP” در دانشگاه “UCLA” واقع در سانتاباربارا در اين تاريخ بارگذاري شده‌است.
از اوايل دهه ???? رشد استفاده از اينترنت به صورت تصاعدي افزايش يافت . يکي از علل چنين استقبالي ابزار جستجويي مانند Gopher و archie بوده‌است اما اينها در سال ???? تحت تاثير word wide web قرار گرفتند که به وسيله CERN يا ازمايشگاه فيزيک هسته‌اي اروپا ساخته شد . با ان که اينترنت از ابتدا طوري بود که مبادله اطلاعات براي تازه واردان بسيار ساده باشد. بزرگترين جهش در وب در سال ???? با عرضه نرم‌افزار موزاييک mosaic که نخستين برنامه مرورگر وب گرافيکي بود به وجود امد. برنامه موزاييک محصول تلاش دانشجويان و استادان بخش "مرکز ملي کاربردهاي ابر کامپيوتر " در دانشگاه ايلينويز آمريکا بود. براي نخستين بار موزاييک امکانات اشاره و کليک (به وسيله موش) را فراهم کرد. کاربران مي‌توانستند صفحات وب (web page) يا مجموعه‌اي از متن و گرافيک را کنار هم بگذارند تا هر کسي که ميخواست انها را بتواند روي اينترنت ببيند. وقتي با موش روي کلمه‌ها يا تصاوير خاصي که hyper link ناميده مي‌شد کليک مي‌کردند برنامه موزاييک به طور خود کار يک صفحه ديگر باز مي‌کرد که به کلمه يا تصوير خاص و کليک شده اختصاص داشت. بهترين بخش اين سيستم انجا بود که hyper linkها مي‌توانستند به صفحاتي روي همان کامپيوتر يا هر کامپيوتر ديگر اينترنت با خدمات وب اشاره کنند. صفحات وب هر روز متولد مي‌شدند و مفهوم موج سواري يا surfing روي وب متولد شد. اواسط سال ???? سه ميليون کامپيوتر به اينترنت وصل شده بود و در ان هنگام اجراي عمليات اهسته نشده بود. صفحات جديد وب که شامل همه چيز از اسناد دولتي تا مدارک شرکت‌ها و مدل‌هاي جديد لباس بود در سراسر دنيا چندين برابر شد . موزاييک و جانشينان ان مانند navigator محصول شرکت " نت اسکيپ " اينترنت را از قلمرو علمي به ميان مردم اوردند. طبق اخرين امار ?? درصد کاربران بعد از سال ???? وارد اين محيط شده‌اند. ميليون‌ها انساني که از اينترنت استفاده ميکنند نيازي ندارند که نکات فني مانند TCP/IP را بدانند . امروزه شرکتهاي خدمات دهنده اينترنت يا ISP اين کار را به عهده دارند.رشد روز افزون ان و ساده تر شدن استفاده ان همچنان ادامه دارد . هر چه تعداد مردم بيشتري به اينترنت رجوع کنند تعداد شرکتهاي سازنده برنامه‌هاي اينترنت بيشتر ميشود.با انکه بعضي از عاشقان اينترنت ان را نوعي شيوه زندگي مي‌دانند. در نظر بيشتر کاربران منبع سرگرمي اطلاعات است ولي بيشترين مصرف ان پست الکترونيکي يا همان email است که يکي از ابزارهاي ارتباطي کار امد به شمار ميرود. پيامها از کامپيوتري به کامپيوتر ديگر با سرعت پرواز ميکنند و منتظر ميمانند تا شخص فرصت خواندن انها را پيدا کند . وب امکانات خوبي براي کپي از نرم‌افزارهاي مجاز از لحاظ کپي فراهم ميسازد. وقتي که مي‌بينيم که در مدت کوتاهي اينترنت به چنين رشدي نايل آمده است، مطمئنا دشوار خواهد بود که آينده او را پيش بيني کنيم. طبق نظر کارشناسان ماهانه ?? درصد به تعداد کاربران اينترنت افزوده ميشود ولي تعداد دقيق کاربران که روزانه از آن استفاده ميکنند مشخص نيست. هرچند که پاره‌اي از کارشناسان تعداد آنها را تا ميليون نفر حدس مي‌زنند. تعداد رسمي کاربران اينترنتي را در سال ???? کارشناسان ميليون نفر اعلام کرده بودند. طراحی وب سایت
قطعا در سال‌هاي آينده تحولات شگرفي را در زمينه شبکه‌هاي اينترنتي شاهد خواهيم بود. به‌وسيله اينترنت انسان به راه‌هاي جديدي دست پيدا کرد. در کنار اين شانس جديد توسط اينترنت، بايد بگوييم خطراتي نيز در رابطه با سياست و اقتصاد و علم به دنبال خواهد داشت. فرم امروزي اينترنت مديون همکاري تمام کاربران اينترنت در سرتاسر گيتي است که با اين تصور که اطلاعات موجود در سطح جهان را به راحتي با يکديگر مبادله کنند. اين تصوري بود که آقاي باران(Baran) از اينترنت داشت و اميدواريم در آينده نيز تکامل اينترنت در اين مسير باشد.
ترسيمي از وب‌گاه‌هايي که تنها از فضاي WWWشبکه جهاني اينترنت را به خود اختصاص داده‌اند ولي اکثر ترافيک کل شبکه اينترنت را در خود جاي داده‌اند.
يکي از پرسرعت ترين اينترنت ها فن آوا ميباشد fanava.ir
طراحی وب سایت...ما را در سایت طراحی وب سایت دنبال می کنید
برچسب : طراحی وب سایت,طراحی سایت,طراحی وب, نویسنده : pooyesh webdesign30 بازدید : 187
کدام يک از کدهاي زير بر روي عناصر تاثير ميگذارند؟
وقتي به يک عنصر يکسري خصوصيات نسبت مي دهيم، و در يک استايل دهي گروهي يا در جاي ديگري يکسري خصوصيات ديگر براي آن مي نويسيم، از بين خصوصيات يکسان تمامي آنها به ارث برده ميشود و از بين ساير خصوصيات آن ويژگي هايي به ارث مي روند که نسبت به ساير دستورات ديرتر و يا به عبارتي بعد تر نوشته شده اند و در صفحه استايل دهي پايين تر قرار گرفته اند. با هم به بررسي مثال زير مي پردازيم :
h2
{
color: blue;
font-size: medium;
font-weight: normal;
}
h1, h2, h3
{
font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
background-color: navy;
color: white;
}
در دستورات ابتدايي رنگ نسبت داده شده به تگ h2 آبي است، اما در استايل دهي گروهي رنگ نسبت داده شده به آن سفيد است، به همين دليل رنگ فونت انتخابي براي آن سفيد خواهد بود. مهم نيست که در دستورات قبلي 100 بار رنگ آبي به h2 نسبت داده شود پرا که آخرين دستور css رنگ سفيد را به اين تگ نسبت مي دهد.
استايل دهي به لينک ها:
لينک ها در سراسر دنياي وب وجود دارند، اگر به لينک هاي اوليه با استايل پيش فرض نگاهي بيندازيم مي بينيم که لينک ها داراي يک خط در زير نوشته لينک (underline) هستند. به صورت پيش فرض مرورگرها از رنگ هاي زير براي لينک ها استفاده مي کنند:
آبي : لينکي که مشاهده نشده باشد.
بنفش : لينکي که شما آن را قبلا مشاهده کرده ايد.
قرمز: لينکي که فعال است و شما در حال کليک کردن بر روي آن هستيد.
در بيشتر مواقع استايل دهي به لينک ها ممکن است به شکل زير باشد:
A
{
font-weight: bold;
color: black;
}
با اين دستور به جاي اينکه لينک هاي آبي رنگ با سايز فونت نرمال داشته باشيم، لينک هاي شما به رنگ آبي و ضخيم خواهد بود.
همانطور که قبلا اشاره کرديم تا کنون يک نوع حالت براي لينک ها معرفي کرديم، لينک هاي مشاهده شده، لينک هاي فعال و لينک هايي که هنوز بر روي آنها کليک نشده است، اما نوع چهارمي وجود دارد که hover ناميده مي شود، اين حالت براي وقتي است که نشانه گر موس بر روي لينک مي آيد که با استايل دهي در css نيز ميتوان خصوصيات اين لينک را نيز تغيير داد.
در اينجا به برخي از استايل هايي که مي توان به لينک ها داد نگاهي مي اندازيم:
a {
font-weight: bold;
}
a:link {
color: black;
}
a:visited {
color: gray;
}
a:hover {
text-decoration: none;
color: white;
background-color: navy;
}
a:active {
color: aqua;
background-color: navy;
}
عکس بالا کليه حالت هاي مختلف لينک ها را نشان مي دهد و حالت hover آن لينک تماس با ما (contact us) است. تمامي رنگ هاي پيش زمينه و ساير رنگ هاي ديگر را مي توانيد با css ايجاد کنيد و مي توانيد افکت هاي بسيار جذابي مانند آن چيزي که در بخش فوتر سايت وب اسکالا مشاهده نماييد ايجاد کنيد.
پاک کردن پيشينه مرورگر:
ن صفحه سايت را چندين بار refresh کرده مرورگر وي به اصطلاح cache کرده و به همين دليل لينک هاي بازديد نشده را بازديد شده مي پندارد که به همين دليل مي بايست cache يا اطلاعات ذخيده شده را پاک کرد. براي اين منظور به اين صورت عمل مي کنيم:
در مرورگر اينترنت اکسپلورر : تب tools راانتخاب کرده، inteet option را کليک مي کنيد، زير browser history دکمه delete را بزنيد، در پنجره باز شده check box مربوط به history را فعال کنيد، انتخاب ساير گرينه ها با توجه به نظر خودتان مي تواند صورت گيرد. در نهايت دکمه delete را زده و پنجره inteet option را ok ميکنيم تا بسته شود و cache مرورگرمان پاک شود.
ساير مرورگرها نيز روشي مشابه دارند که آدرس دسترسي به history آنها نيز به صورت زير است:
Tools > Options يا Preferences > Privacy
کلاس هاي انتخابگر :
تا اينجا ياد گرفتيم که چگونه در يک فايل CSS خصوصيات مختلفي براي تگها بنويسيم و آموختيم که ميتوان خصوصيات يک کلاس را براي تگهاي مختلفي اعمال کرد يعني ميتوان کلاس را چندين بار استفاده کرد. به عنوان مثال بياييد کلاس زير را دريک پاراگراف اعمال کنيم :
.fun {
color: #339999;
font-family: Georgia, Times, serif;
letter-spacing: 0.05em;
}
به اين ترتيب 3 خصوصيت براي پاراگرافمان تعريف کرده ايم،که خصوصيت سوم letter-spacing به معناي اينست که فاصله بين کلمات موجود درمتن 0.05em باشد. (اگرارتفاع حرف M رابرابربا em1 درنظربگيريد 5% اين مقدار برابر با 0.05em خواهد بود).
حال براي اين که اين خصوصيات که در css نوشتيم برروي پاراگراف مدنظر اعمال شود کافيست که نام کلاس موجود در css رابه تگ مورد نظ مان درصفحه html نسبت دهيم:
<p class="fun">
A man walks into a bar; you would've thought he'd see it coming!
</p>
حال در نظربگيريد تگ <blockquote>درون صفحه html تان وجود دارد و درون اين تگ ميخواهيد يک پاراگراف قرار دهيد که کلاس fun داشته باشد ، همانند کد زير:
<blockquote>
<p class="fun">
Happiness is a dip in the ocean followed by a
int or two of Old Speckled Hen. You can quote me on that!"
</p>
</blockquote>
به نظر شما اگر بخواهيد چند پاراگراف درون اين تگ قراردهيد چه کارميتوان کرد؟ ميتوان راه حل زير را اعمال کرد:
<blockquote>
<p class="fun">"Happiness is a dip in the ocean followed by a pint or two of Old Speckled Hen. You can quote me on that! </p>
<p class="fun">"Join us for a weekend away at some of our favorite dive spots and you'll soon be making new friends. </p>
<p class="fun">"Anyway, about time I got on with some <em>proper</em> work!" </p>
</blockquote>
اما همانطور که مي بينيد تکرار نام کلاس در تگها ي بالا زياد صورت گرفته ، پس به جاي استفاده از روش بالا ميتوان روش بهتري را به کار برد :
<blockquote class="fun">
<p Happiness is a dip in the ocean followed by a pint or two of Old Speckled Hen. You can quote me on that! </p>
<p>"Join us for a weekend away at some of our favorite dive spots and you'll soon be making new friends. </p>
<p>"Anyway, about time I got on with some <em>proper</em> work!" </p>
</blockquote>
ID & CLASS
ياد گرفتيد که چگونه ميتوان از ID و کلاس براي تگهاي موجود در HTML خود استفاده نماييد ، به عنوان مثال براي کلاس از نماد "." قبل از نام کلاس در نظر گرفته شده در فايل سي اس اس استفاده مي کنيم و براي ID از نماد "#" .
نکته از مترجم : دقت نماييد براي استايل دهي هم از کلاس استفاه ميشود و هم از ID. اما تفاوت هايي هم در استفاده دارد وآن اينکه از ID براي استايل دهي و مشخص کردن عناصر اصلي صفحه مانند هدر فوتر و منو و غيره استفاده ميکنيم و يا براي استفاده در موارد برنامه نويسي .
تنها نکته در اين باره اين است که در يک صفحه HTML از نام يک ID فقط مي شود يکبار استفاده نمود اما از نام يک کلاس مي توان به هر تعداد استفاده کرد.
در نظر بگيريد براي چند تگ درون صفحه تان از يک کلاس يکسان استفاده کرده ايد، مثلا:
.fun {
font-family: Georgia, Times, serif;
color: #339999;
letter-spacing: 0.05em;
}
اما براي يکي از تگ ها علاوه بر خصوصيات فوق يک يا چند خصيصه ديگر نيز اضافه کنيد، به اين روش اين کار را انجام مي دهيم:
blockquote.fun {
font-style: italic;
}
بدين ترتيب چنانچه کلاس fun درون تگ blockquote قرار گيرد خصوصيت italic را نيز مي خواند ، اما اگر به ساير تگ هايي که مي خواهيم تنها کلاس fun را بخوانند تگ blockquote را قرار ندهيم خصيصه italic شدن فونت اعمال نمي شود.
براي روشن تر شدن اين موضوع مثال ديگري مي زنم:
فرض کنيد مي خواهيم تمامي متون قرار گرفته درون تگ p صفحه مان به رنگ آبي نفتي درآيند بنابراين کافيست که در CSS بنويسيم :
p {
color: navy;
}
اما حالا اگر بخواهيم يکي از متون قرار گرفته درون تگ p مان به رنگ ديگري درآيد کافيست ، به اين تگ p يه کلاس بدهيم و سپس به آن کلاس رنگ مورد نظرمان را نسبت دهيم:
.p.gre {
color: green;
}
استايل دهي قسمتي از متن با استفاده از span :
فرض کنيد که چنين متني داريد:
<p>Bubble Underis a group of diving enthusiasts based in the south-west UK who meet up for diving trips in the summer months when the weather is good and the bacon rolls are flowing. We arrange weekends away as small groups to cut the costs ofaccommodation and travel and to ensure that everyone gets a trustworthy dive buddy.</p>
onths when the weather is good and the bacon rolls are flowing. We arrange weekends away as small groups to cut the costs ofaccommodation and travel and to ensure that everyone gets a trustworthy dive buddy.</p>
.blue
{
Color: # a3c2fa;
}
قبل از شروع کار، ابتدا براي ايجاد تغيير در ظاهر و اندازه عناصر در وب سايت مي بايست با مفهوم block-level elements و inline elements آشنا شويد.
block-level elements و inline elements
block-level elements: به عناصر يا تگ هايي مي گوييم که توسط آن مي توان کل سطر يا فضايي که آن عنصر در اختيار خود دارد را مسدود يا به اصطلاح block کرد، هر عنصر block مي تواند درون خود عنصر و يا عناصر inline و يا block را جاي دهد.
inline elements : به عناصر يا تگ هايي مي گويند که آنها تنها مي توانند به اندازه متني که درون آن جاي گرفته قسمتي از سطر را اشغال نمايند، اين عناصر خطي يا به اصطلاح inline ناميده مي شوند، توجه داشته باشيد که درون تگ هاي inline تنها عنصر Inline جاي ميگيرد.
نحوه تشخيص عناصر inline بدين صورت است که اگر عنصري دوم در کنار عنصر اول در امتداد يک خط قرار گيرند عنصر اول قطعا inline است، اما اگر عنصر اول block باشد عنصر دوم در بالا يا پايين عنصر اول قرار خواهد گرفت و نه در امتداد عنصر اول.
در اينجا چند عنصر block را معرفي مي کنيم:
تگ هاي h1, h2,...و h6
P
div
Blockquote
Ul و ol
Form
وقتي که شما يک پاراگراف ايجاد مي کنيد، نيازي نيست که بعد از پايان پاراگراف اول با استفاده از <br /> به خط بعد برويد تنها کافيست يک تگ<p> را باز کرده متن خود را بنويسيد و سپس آن تگ را ببنديد.</p>
بذين ترتيب چون تگ p بلاک است خود به خود متني که در تگ دوم P قرار مي گيرد از ابتداي سطر بعد شروع مي شود.
و خروجي آن را بدين صورت خواهيم داشت:
ما را در سایت طراحی وب سایت دنبال می کنید
برچسب : طراحی وب سایت,طراحی سایت,طراحی وب, نویسنده : pooyesh webdesign30 بازدید : 275
در هر جاي کامپيوتر که دوست داريد فلدري به نام my-first-webpage بسازيد.
textEditor خودتان را که در جلسات قبل توضيح داديم باز کنيد کد زير را در آن کپي کنيد
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>The Most Basic Web Page in the World</title>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8"/>
</head>
<body>
<h1>The Most Basic Web Page in the World</h1>
<p>This is a very simple web page to get you started.
Hopefully you will get to see how the markup that drives
the page relates to the end result that you can see on
screen.</p>
<p>This is another paragraph, by the way. Just to show how it
works.</p>
</body>
</html>
از textEditor گزينه file>save as را بزنيد پنجره اي مانند زير نمايش مي يابد:
design-web-15.gif
مسير فلدر قبل را بدهيد تا در آنجا ذخيره شود.
نام فايل را انتخاب نماييد البته با پسوند html مانند my-first-webpage.html
از منوي کشويي save as type گزينه all files را انتخاب نماييد
حالا در فلدر مورد نظر فايلتان را با مرورگر باز نماييد . تبريک شما اولين صفحه وب خودتان را ساختيد!
design-web-16.gif
اهميت UTF-8
اين کاراکتر ست (Character Set) اجازه مي دهد زبان هاي ديگر هم بتوانند به درستي صفحه شما را ببينند. فرض کنيد يک کاربر کره اي که زبان انگليسي ندارد بخواهد صفحه شما را ببيند ، اين کاراکتر ست است که اجازه ميدهد شما با مشکلي مواجه نشويد.
اولين آناليز شما
يک مقايسه و يک آناليز ساده بين کد شما و ظاهري که در مرورگر مي بينيد ، مي تواند در يادگيري شما کمک شاياني کند:
design-web-17.gif
زمان مناسبي است که در مورد 2 تگ p و h1 و البته عناصر ديگر صحبت کنيم.
تيترها و سلسله مراتب آن (H)
تيترها عناصر بلاک و بسته شونده (container)هستند و سلسله مراتب مخصوص به خود را دارند و از h1 تا h6 وجود دارند.
از h1 براي مهم ترين تيتر از h2 براي تيتر کم ارزش تر و از h3 براي تيتر کم ارزش تر از h2 و به همين ترتيب تا h6
پاراگراف (p)
يک تگ بلاک و بسته شونده (container) است و براي يک بلوک متني استفاده مي شود اين بدان معني است که متن هاي خوتان را بايد داخل اين تگ قرار دهيد.
ليست (list)
فرض کنيد مي خواهيد ليست وب سايت هاي طراحي شده خودتان را نمايش دهيد ، به ليستي که من درسايت خودم استفاده کردم يک سري بزنيد.
اينجا:
design-web-18.jpgو اما ليست ها دو گونه اند:
Ol-order list : براي ليست هاي ترتيبي
Ul-unorder list: براي ليستهاي غير ترتيبي
به مثال زير دقت کنيد:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Lists - an introduction</title>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8"/>
</head>
<body>
<h1>Lists - an introduction </h1>
<p>Here's a paragraph. A lovely, concise little paragraph.</p>
<p>Here comes another one, followed by a subheading.</p>
<h2>A subheading here</h2>
<p>And now for a list or two:</p>
<ul>
<li>This is a bulleted list</li>
<li>No order applied</li>
<li>Just a bunch of points we want to make</li>
</ul>
<p>And here's an ordered list:</p>
<ol>
<li>This is the first item</li>
<li>Followed by this one</li>
<li>And one more for luck</li>
</ol>
</body>
</html>
و حالا خروجي کار رو در مرورگر ببينيد تا تفاوت هاي دو نوع ليست را ببينيد
design-web-19.gif
ظاهر همه ليست ها به همين سادگي نيستند و امروزه در طراحي وب سايت حرفه اي استفاده زيادي دارد. براي نمونه مي توانيد به فوتر وب سايت شرکت طراحي سايت وب اسکالا نگاهي بياندازيد تا ديدتان نسبت به استفاده از اين عنصر بازتر شود.
نظرات (0)
در هر جاي کامپيوتر که دوست داريد فلدري به نام my-first-webpage بسازيد.
textEditor خودتان را که در جلسات قبل توضيح داديم باز کنيد کد زير را در آن کپي کنيد
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>The Most Basic Web Page in the World</title>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8"/>
</head>
<body>
<h1>The Most Basic Web Page in the World</h1>
<p>This is a very simple web page to get you started.
Hopefully you will get to see how the markup that drives
the page relates to the end result that you can see on
screen.</p>
<p>This is another paragraph, by the way. Just to show how it
works.</p>
</body>
</html>
از textEditor گزينه file>save as را بزنيد پنجره اي مانند زير نمايش مي يابد:
design-web-15.gif
مسير فلدر قبل را بدهيد تا در آنجا ذخيره شود.
نام فايل را انتخاب نماييد البته با پسوند html مانند my-first-webpage.html
از منوي کشويي save as type گزينه all files را انتخاب نماييد
از منوي کشويي Encoding گزينه UTF-8 را انتخاب نماييد.
و حالا دکمه save را بزنيد.
design-web-16.gif
اهميت UTF-8
اين کاراکتر ست (Character Set) اجازه مي دهد زبان هاي ديگر هم بتوانند به درستي صفحه شما را ببينند. فرض کنيد يک کاربر کره اي که زبان انگليسي ندارد بخواهد صفحه شما را ببيند ، اين کاراکتر ست است که اجازه ميدهد شما با مشکلي مواجه نشويد.
اولين آناليز شما
يک مقايسه و يک آناليز ساده بين کد شما و ظاهري که در مرورگر مي بينيد ، مي تواند در يادگيري شما کمک شاياني کند:
design-web-17.gif
زمان مناسبي است که در مورد 2 تگ p و h1 و البته عناصر ديگر صحبت کنيم.
تيترها و سلسله مراتب آن (H)
تيترها عناصر بلاک و بسته شونده (container)هستند و سلسله مراتب مخصوص به خود را دارند و از h1 تا h6 وجود دارند.
از h1 براي مهم ترين تيتر از h2 براي تيتر کم ارزش تر و از h3 براي تيتر کم ارزش تر از h2 و به همين ترتيب تا h6
پاراگراف (p)
يک تگ بلاک و بسته شونده (container) است و براي يک بلوک متني استفاده مي شود اين بدان معني است که متن هاي خوتان را بايد داخل اين تگ قرار دهيد.
ليست (list)
فرض کنيد مي خواهيد ليست وب سايت هاي طراحي شده خودتان را نمايش دهيد ، به ليستي که من درسايت خودم استفاده کردم يک سري بزنيد.
اينجا:
design-web-18.jpgو اما ليست ها دو گونه اند:
Ol-order list : براي ليست هاي ترتيبي
Ul-unorder list: براي ليستهاي غير ترتيبي
به مثال زير دقت کنيد:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Lists - an introduction</title>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8"/>
</head>
<body>
<h1>Lists - an introduction </h1>
<p>Here's a paragraph. A lovely, concise little paragraph.</p>
<p>Here comes another one, followed by a subheading.</p>
<h2>A subheading here</h2>
<p>And now for a list or two:</p>
<ul>
<li>This is a bulleted list</li>
<li>No order applied</li>
<li>Just a bunch of points we want to make</li>
</ul>
<p>And here's an ordered list:</p>
<ol>
<li>This is the first item</li>
<li>Followed by this one</li>
<li>And one more for luck</li>
</ol>
</body>
</html>
ما را در سایت طراحی وب سایت دنبال می کنید
برچسب : طراحی وب سایت,طراحی سایت,طراحی وب, نویسنده : pooyesh webdesign30 بازدید : 256
استفاده از ليست هاي HTML در صفحه
دو نمونه از پر استفاده ترين ليستها در HTML ليستهاي مرتب و ليستهاي نامرتب هستند. در ليستهاي مرتب ترتيب بخشهاي مختلف ليست مشخص مي شود ولي در ليستهاي نامرتب اين ترتيب مشخص نمي شود
ليستهاي نامرتب
در ليستهاي نامرتب براي عناصر ليست از شماره و عدد يا حروف الفبا استفاده نمي شود. عناصر اين معمولاً با يک دايره تو پر مشخص مي شوند. تگ ابتداي آن <ul> است و تگ پاياني آن <ul/> است. براي جدا کردن هر بخش ليست در ابتداي آن از تگ <li> استفاده مي شود. بهتر است هر تگ <li> که باز مي شود با <li/> بسته شود. در زير يک مثال براي اين نوع ليست آورده شده است:
<ul>
<li>بخش اول ليست</li>
<li>بخش دوم ليست</li>
<li>بخش سوم ليست</li>
</ul>
مثال بالا يک ليست بولت دار با سه بخش را به ما مي دهد:
بخش اول ليست
بخش دوم ليست
بخش سوم ليست
به اين نکته هم توجه کنيد که <li> نيازي به تگ پاياني ندارد ولي بهتر است از تگ پاياني آن يعني <li/> استفاده شود.. فاصله متن ليست شده از ابتداي خط هم مقداري از بقيه متن بيشتر مي شود. شما مي توانيد اين فاصله را با افزودن تگ <ul> بيشتر کنيد فقط به خاطر داشته باشيد تگهايي را که باز کرده ايد در آخر ليست ببنديد.در زير يک مثال براي اين نمونه ليست آورده شده است:
<ul>
<ul>
<ul>
<li>خط اول ليست</li>
<li>خط دوم ليست</li>
<li>خط سوم ليست</li>
</ul>
</ul>
</ul>
نتيجه اين فرمان به شکل زير خواهد بود:
خط اول ليست
خط دوم ليست
خط سوم ليست
از شناسه type مي توان در تگ <ul> استفاده کرد و ظاهر ليست را تغيير داد.
مي توانيد ليست به دست آمده را در اينجا مشاهده کنيد. به خاطر داشته باشيد که در مرورگرهاي مختلف ممکن است نحوه نمايش ليستها متفاوت باشد.
قسمت اول ليست
قسمت دوم ليست
قسمت سوم ليست
اگر مي خواهيد از تگ <center> براي ليست خود استفاده کنيد در اين کار دقت کنيد. چون ممکن است تمام سطرهاي متن شما به يک اندازه نباشند. در اين صورت به جاي اينکه ليستي در يک خط و مستقيم داشته باشيد ممکن است ليستي در هم ريخته و شلوغ به وجود آيد. مانند زير:
<center>
<ul>
<li>بخش اول ليست که بلندتر از بقيه سطرهاي ليست است</li>
<li>بخش دوم ليست</li>
<li>بخش سوم ليست در سطر آخر</li>
</ul>
<center>
ليست نهايي به اين صورت در صفحه ديده مي شود.
بخش اول ليست که بلندتر از بقيه سطرهاي ليست است
بخش دوم ليست
بخش سوم ليست در سطر آخر
اگر شما در يک صفحه بيشتر به ليستها نياز داريد مي توانيد از روش بالا استفاده کنيد اما بايد بدانيد که ممکن است ظاهر ليست در اندازه هاي مختلف پنجره مرورگر به هم بخورد. راه ديگري که براي جلوگيري از اين به هم خوردگي وجود دارد استفاده از يک Table است که بعداً در مورد آن توضيح خواهيم داد.
طراحی وب سایت...ما را در سایت طراحی وب سایت دنبال می کنید
برچسب : طراحی وب سایت,طراحی سایت,طراحی وب, نویسنده : pooyesh webdesign30 بازدید : 152
در اين جلسه از آموزش طراحی وب سایت css با ساير گزينشگرهايي که در Css3 معرفي شده اند صحبت خواهيم کرد.
اگر دومين پست از آموزش css را خوانده ايد، با هم درمورد گزينشکرها صحبت کرديم
گفتيم که در css شش نوع گزينشگر براي انتخاب المنتها وجود دارد که يگي از ان ها کلاس هاي کاذب (pseudo-class) بودند، که اين سلکتورها براي نمايش رويدادهاي صفحه از جمله، کليک، هاور، فوکوس و ... استفاده مي شوند. در css کلاس هاي کاذب ديگري نيز وجود دارد که مربوط به طريقه انتخاب فرزندان (child) يک المنت پدراست. ما ميخواهيم در اين جلسه طراحی وب سایت در مورد آن ها توضيح دهيم.
کلاس هاي کاذب توارثي
کد html زير را در نظر بگيريد
1
<ul>
2
<li>Lang
3
<ul>
4
<li>HTML</li>
5
<li>CSS</li>
6
<li>Javascript</li>
7
</ul>
8
</li>
9
10
<li>CMS
11
<ul>
12
<li>Wordpress</li>
13
<li>Joomla</li>
14
<li>Drupal</li>
15
</ul>
16
</li>
17
</ul>
حال اگر بخواهيم به هر يک از اين گزينه ها يک رنگ متفاوت اختصاص دهيم، چه ميکرديم؟ حتما براي هر يک class تعريف مي کرديم و رنگ مورد نظر را انتخاب مي کرديم. خب اين روش درست است اما اگر ندانيم class آن چيست چطور؟ اگر سايت طراحی وب سایت دايناميک باشد، و اين اطلاعات بعدا اضافه شود به طوريکه نميتوان براي آن ها class تعريف کرد؟؟ در اين صورت بايد از کلاس هاي کاذب توارثي استفاده کنيم.
حال به تعريف دقيقتر اين کلاس هاي کاذب مي پردازيم :
nth-child(n) و nth-last-child(n)
nth-child(n) : با استفاده از اين کلاس کاذب مي توان براي تک تک المنت هاي يک صفحه طراحی وب سایت ، بدون استفاده از id يا class براي آن ها يک استايل متفاوت تعيين کنيم.
حرف n در داخل پرانتز يک عدد طبيعي است 1,2,3,...
اين عدد تعيين کننده چندمين فرزند از يک المنت پدر است
به طور مثال اولين تگ شماري 1 را دارد دومين شماره 2 و...
به کد css زير دقت کنيد تا متوجه شويد چگونه ميتوانيم به هر يک از li هاي کد html بالا استايل متفاوت دهيم.
1
ul li {
2
color: blue;
3
font: 24px tahoma;
4
text-shadow: -1px 1px 1px #333;
5
}
6
7
ul li:nth-child(1){color: red;}
8
ul li:nth-child(2){color: green;}
9
ul li:nth-child(1) li:nth-child(1){color: orange;}
10
ul li:nth-child(1) li:nth-child(2){color: brown;}
11
ul li:nth-child(1) li:nth-child(3){color: pink;}
12
ul li:nth-child(2) li:nth-child(1){color: gray;}
13
ul li:nth-child(2) li:nth-child(2){color: silver;}
14
ul li:nth-child(2) li:nth-child(3){color: yellow;}
البته در مروگر ie فقط از نسخه 9+ کار ميکند.
اگر کد را اجرا کنيد نتيجه اي شبيه زير خواهيد داشت.
کلاس کاذب nth-last-child(n) برعکس nth-child(n) عمل ميکند، به اين صورت که از اخر به شمارش المنت ها ميپرداز.
اگر nth-last-child را جايگزين nth-child در کد css بالا کنيم نتيجه کد طراحی وب سایت به شکل زير خواهد بود.
first-child و last-child
همانطور که از اسم کلاس ها معلومه first-child اولين فرزند از يک المنت پدر last-child آخرين فرزند از يک المنت پدر رو انتخاب ميکنند.
کد css زير را به کدهاي css بالا اضافه کنيد
1
ul li:first-child li {font-size: 18px;}
2
ul li:last-child li {font-size: 14;}
نتيجه
ديگر کلاس هاي کاذب
selection : اين کلاس طراحی وب سایت کاذب استايل المنت را هنگامي که ان را انتخاب ميکنيم، (در حالي که کليک چپ رو نگه داشتيم روي المنت ميکشيم يا CTRL + A ( در حالت پيشفرض مرورگرها
هنگامي که به طور مثال متني رو انتخاب ميکنيم، رنگ متن سفيد، و پس زمينه ان آبي ميشود. ما توانيم با استفاده از اين کلاس کاذب اين رنگ را هر کدام از المنتها تغيير دهيم يا ان را براي کل صفحه تعيين کنيم.
کد css :
1
::selection {
2
background: #999;
3
color: #edb;
4
}
5
6
::-moz-selection {
7
background: #999;
8
color: #edb;
9
}
10
11
::-webkit-selection {
12
background: #999;
13
color: #edb;
14
}
المنت هاي کاذب (pseudo-elemnt)
بعلاوه کلاس هاي کاذبي طراحی وب سایت که گفتيم، المنت هاي کاذب نيز وجود دارند.
::first-letter تغيير استايل اولين کاراکتر از يک متن.
کد html :
1
<p>7lea: javascript and web design tutarials</p>
کد css :
1
p {font-size: 20px;}
2
p::first-letter {font-size: 36px;}
::first-line تغيير استايل اولين خط از يک متن.
1
<p>7lea: javascript and web design tutarials<br>7lea: javascript and web design tutarials</p>
کد css :
1
p {font-size: 20px;}
2
p::first-line {font-size: 36px;}
بسيار خب آموزش اين جلسه طراحی وب سایت نيز به پايان رسيد در جلسه بعدي به معرفي گزينشگرهاي صفت (attribute) و باقي گزينشگرها ميپردازيم.
ما را در سایت طراحی وب سایت دنبال می کنید
برچسب : طراحی وب سایت,طراحی سایت,طراحی وب, نویسنده : pooyesh webdesign30 بازدید : 318
html چیست؟
پایه و اساس هر طراحی وب سایت اینترنتی است که از سه بخش کلی و اصلی و و تشکیل شده است.
در این روش شما صفحه ای را در دست دارید که با نوشتن کدهای جدید و یا کاهش و افزایش کدهای پیشین میتوانید به قالب مورد نظرتان دست یابید.
xhtml چیست؟
نوع دیگر نوشتن کدها ِطراحی وب سایت یک صفحه اینترنتی ست با این تفاوت که برای نمایش خود به دستوراتی نیاز دارد که در قسمت head جای گرفته اند و یا در قالب یک فایل جداگانه با پسوند انجام وظیفه میکنند. مثلا وقتی میخواهید برای قسمت پست یک وبلاگ نوع فونت، رنگ و سایز آن را تعیین کنید باید این دستور را در قسمت در بخش و یا در فایل مربوط به آن صفحه اعمال کنید و لازم نیست مانند قبل از هر متن از تگ (کد)استفاده کنید.
توجه: استفاده از دستورات style به طور دلخواه طراح میتواند در یک فایل css. و یا در همان صفحه مورد نظر در قسمت head و به صورت کد صورت بگیرد. در هر دو روش نتیجه یکسان خواهد بود.
css چیست؟
دستورات (style sheet) ی که نحوه نمایش یک صفحه طراحی وب سایت را مشخص می کنند نامیده میشوند و در صورتی که بخواهند در یک فایل جداگانه ایفای نقش کنند در فایلی با پسوند css. جای میگیرند. به عبارت دیگر: ساختار اصلی صفحات وب را تعیین می کند و شکل ظاهری آن را.
بعد از هر جستجوی در میان صفحات فارسی به وبگاههایی خواهیم رسید که را از نظر لغوی معنی کرده اند با این حال برای کامل بودن این سری آموزشی به تکرار مکررات هم میپردازم.
مخفف کلمه و به معنی مجموعه طبقه بندی شده و یا مجموعه آبشاری است.
HTML بهتر است و یا XHTML ؟
یکی از اصلی ترین و مهمترین ویژگی های طراحی وب سایت مطابقت آن با استانداردهای جهانی دسترسی سایت و به طراحی شده اند با مرورگرهای مختلف سازگارند :
--------------------------------------------------------------------------------------------------
در این سری آموزشی شما می توانید طراحی قالبهای تک ستونه، دو ستونه، سه ستونه، چهار ستونه، ایجاد header و footer و همین طور طراحی انواع قالبهای سایت را طبق نیاز و سلیقه خودتان بیاموزید و به راحتی در این قالبها فارسی بنویسید. این قالبها قابل استفاده برای انواع سیستمهای وبلاگ و سایت از جمله: و ... میباشند و فقط کافیست تا کدهای مورد نظرتان را در میان این کدها و در جایگاه مورد نظرتان قرار دهید. برای طراحی وب سایت به یکی از نرم افزارهای ویرایش صفحات وب مانند نیاز دارید و همینطور لازم است تا برای آزمایش صفحات ایجاد شده مرورگرهای i را روی سیستم خود داشته باشید اگر مرورگر هم داشته باشید بی شک طراحی مطمئن تر و کامل تری را خواهید داشت.
ما را در سایت طراحی وب سایت دنبال می کنید
برچسب : طراحی وب سایت,طراحی سایت,طراحی وب, نویسنده : pooyesh webdesign30 بازدید : 199