آشنایی با اصطلاحات پرکاربرد در طراحی سایت از آن دسته مواردی است که هر طراح سایت یا مدیر سایتی، ضروری است که با آنها آشنایی داشته باشد.
طراحی سایت و به طور کلی دنیای وب، از حوزه هایی است که اصطلاحات آن در زبان فارسی معادل چندانی ندارد. پس قطعاً برای افرادی که به تازگی قصد ورود به آن را دارند، موضوعات نامفهوم بوده و باعث فاصله گرفتن علاقهمندان در ابتدای راه میشود.
اما نگران نباشید، ما در این مقاله که توسط وبسایت همیار توسعه نوشته شده است. لیستی کامل، از مهمترین و کاربردیترین اصطلاحات طراحی سایت را معرفی کردهایم.
بی شک شما بعد از خواندن این مقاله، کوچکترین نیازی به مطالعه دوباره سایر مقالات نخواهید داشت.
پس تا پایان مقاله همراه ما باشید …
اصطلاحات اولیه در طراحی سایت
در ابتدا با مفاهیم اولیه آشنا خواهیم شد و بعد از آن به موارد تخصصی اشاره میکنیم.
دامنه (Domain)
یک نام منحصر به فرد که تنها متعلق به یک شخص یا شرکت میباشد. در تمام سطح اینترنت با آن نام یا آدرس شناخته میشود مثال: hamyar.dev
زیر دامنه (Sub Domain)
در اول هر دامنه قرار میگیرد. به طور معمول همهٔ ما با (WWW.) آشنا هستیم. اما بودن یا نبودن آن در زمان وارد کردن آدرس مهم نیست و شما با وارد کردن نام دامنه وارد سایت مورد نظر میشوید.
اما در مواردی زیر دامنهها خود به عنوان یک دامنه جدا عمل میکنند و معرف محتوای دیگری میباشند.
اگر دقت کرده باشید، بیشتر فرومها (forum) یا ایمیلها بهصورت زیر دامنه قرار گرفتهاند.
زیر دامنهها در مواردی نیز، به عنوان زبان جداگانه از یک دامنه قرار میگیرند.
مثال: forum.hamyar.dev یا www.hamyar.dev
ساب فولدر (Sub directory)
تفاوت ساب فولدر با زیر دامنه محل قرارگیری آن میباشد. ساب فولدر بعد از آدرس دامنه قرار میگیرد و با علامت اسلش (/) جدا میگردد. برخلاف زیر دامنه، ارتباط کامل در موضوعات با دامنه سایت دارد و همچنین از دامنه اصلی اعتبار خود را میگیرد.
مثال: hamyar.dev/wp-website
پسوند دامنه (Domain Extention)
پسوند دامنه در انتهای آدرس دامنه با یک نقطه از آن جدا میشود که معرف محل دامنه شما و نوع فعالیتی است که وبسایت انجام میدهد. از معروفترین پسوند دامنههای موجود (.com) ، (.org) و (.net) میباشد.
در ایران پسوند (.ir) معروفترین میباشد. سایت همیار توسعه که زمینه فعالیتش در طراحی سایت میباشد پسوند(.dev) را انتخاب کرده است که در دسته بندی توسعه دهندگان قرار میگیرد.
مثال: hamyar.dev
صفحه وب (Web Page)
همین صفحه از مقاله که شما در حال خواندن آن میباشید (web page) نام دارد. صفحه وب مجموعهای از المانهای مختلف، متن، لینک، تصاویر، ویدئو و هر چیزی که برای کاربر نهایی قابل مشاهده باشد را شامل میشود.
وب سایت (Website)
به تمام مجموعه صفحات وب که در کنار یکدیگر بر روی یک دامنه قرار میگیرند در اصطلاح وب سایت میگویند. وب سایتها انواع گوناگون دارند و در زمینه خاصی محدود نمیشوند.
وب سرور (Web Server)
یک روند رفت و برگشتی بین سرور کامپیوتر و کلاینت کامپیوتر شکل میگیرد. این پروسه به شکل خدمات دهنده و خدمات گیرنده تعریف میشوند.
درخواستهایی که شما توسط مرورگر خود ارسال میکنید بر روی سرور کامپیوتر قرار میگیرد و بعد از پردازش، جواب مورد نظر به سمت شما ارسال میشود.
وب سرور و میزبان وب کاملاً با یکدیگر متفاوت میباشند. در بین طراحان سایت گاهاً این دو مورد به اشتباه بیان میشود.
میزبان وب (Webhost)
یک ابرکامپیوتر که اطلاعات چندین سایت با توجه به ظرفیتش بر روی آن قرار دارد.
دستوراتی که از سمت وب سرور کامپیوتر شخصی ما ارسال میشود در وب سرور میزبان وب پردازش شده و سایت مورد نظر یا هدف جستجو را به عنوان جواب به سمت مرورگر ما میفرستد.
هاستها به شکل اختصاصی و اشتراکی نیز در دسترس قرار میگیرند.
کنترل پنل میزبانی وب
برای کنترل و بررسی، هاست و صفحات وب، ما به یک محیط و ابزاری نیاز داریم که بتوان به راحتی در یک فضای گرافیکی مناسب و کاربر پسند، مدیریت آن را انجام داد.
تعداد کنترل پنلهای میزبانی وب زیاد است. اما چند مورد از بهترینها را به شما معرفی میکنیم:
1- دایرکت ادمین (Direct admin):
یکی از بهترین کنترل پنلهای میزبانی وب میباشد که از ویژگیهای آن میتوان به رابط کاربری آسان، سرعت بالا، سبک بودن، پایداری بالا و مصرف کم در استفاده از منابع نام برد
2- سی پنل (Cpanel)
محبوبترین کنترل پنل میزبانی وب است که تمام مواردی که در مورد قبل به آن شاره کردیم را دارا میباشد. در اصل این دو رقیب اصلی یکدیگر میباشند.
از دیگر کنترل پنلهای معروف Zpanel-Plesk-WebsitePanel را میتوان نام برد.
صفحه اصلی (Home Page)
به اولین صفحهای که در ابتدای ورود به سایت با آن مواجه میشوید صفحه اصلی یا صفحه خانه گفته میشود. صفحه اصلی با توجه به حوزه سایت مورد نظر میتواند شامل متن و المانهای بصری گوناگون باشد.
اینترو (Intro)
اگر از علاقهمندان به موسیقی باشید قطعاً با این عبارت آشنایی دارید. در طراحی سایت نیز به آن بخش از سایت گفته میشود که قبل از ورد به صفحه اصلی به شکل یک انیمیشن جذاب برای خوش آمد گویی و تبلیغ به کاربران نمایش داده میشود.
صفحه ثابت (Static Page)
این گونه از صفحات کاملاً برای تمام کاربران، ثابت و یکسان بوده و محتوای نمایش داده شده، تغییر نمیکند.
تغییر در محتوای اینگونه از صفحات تنها بهوسیله مدیر سایت امکانپذیر میباشد.
صفحه پویا (Dynamic Page)
بر خلاف صفحات ثابت امکان تغییرات برای کاربران در این گونه از صفحات وجود دارد. کاربر میتواند در این حالت محتوا و اطلاعات مورد نیاز خود را وارد کند.
کدنویسی در صفحات پویا کمی پیچیدهتر از حالت عادی میباشد.
لینک (Link)
لینک یا پیوند در اصل مثل یک پل میان چند صفحه از یک یا چند وب سایت ارتباط برقرار میکند و حالتهای مختلفی دارد.
لینک داخلی (Interal Link)
لینکهای داخلی تنها در داخل دامنه ایجاد میشوند و بین صفحات مختلف یک سایت ارتباط برقرار میکنند.
لینک خارجی (Back Link)
لینک خروجی یا همان بکلینکها به ارتباط بین چندین وب سایت کمک میکند. لینکهای خروجی اگر به شکل درست ساخته شوند تأثیر بسیار خوبی بر سئو یک سایت دارند و به همین دلیل در بین متخصصان سئو از اهمیت بالایی برخوردار است.
سئو یا اس ای او (SEO)
سئو مجموعه فرایندهایی است که در داخل و بیرون سایت با هدف بهبود جایگاه صفحات سایت ما در نتایج جستجوهای مخاطبان برای عبارتهایی که مورد نظر ما هستند تا در آن رتبه مناسبی بگیرند گفته میشود.
URL
عبارتی که در بالای همین صفحه در قسمت آدرس میبینید url صفحه میباشد. اهمیت urlها بسیار زیاد است و از طریق مختلف لینک میشوند. نحوه نوشتن urlها بحث کاملاً تخصصی میباشد و در سئو سایت تأثیر میگذارد.
منو (Menu)
منوها از انواع مختلفی تشکیل شدهاند و در برگیرنده لینکهای داخلی میباشند. منو در اصل یک راهنمای خوب برای گشتوگذار کاربر در سایت میباشد.
انواع منوها عبارتاند از:
- نوار منوی افقی
- منوهای عمودی
- منوی کشویی بالابهپایین
- منوهای Fly-out
- منو موجود در فوتر
ساید بار (sidebar)
نوارهای کناری که معمولاً در سمت چپ و راست سایتها قرار میگیرد و شامل جدیدترین مطالب، جستجو، زمان، تبلیغات، برچسبها و بسیاری از موارد مهم دیگر میشود.
در طراحی سایت وردپرس، ساید بار را به راحتی میتوان در سایت قرار داد و کد نویسی پیچیدهای نیاز ندارد.
کلمه کلیدی (Keyword)
قطعاً درصد بسیار بالایی از کاربرانی که به این مقاله رسیدهاند با جستجوی کلمه کلیدی” اصطلاحات طراحی سایت “در موتور جستجو بوده است.
کلمه کلید از مهمترین مواردی است که در طراحی سایت به آن توجه میشود. متخصصان سئو رقابت اصلیشان همیشه بروی کلمات کلیدی بوده است.
کامنت (Comment)
منظور از کامنت در طراحی سایت میباشد، بخشهای زیادی از کدهای نوشته در Html توسط مرورگرها نادیده گرفته میشود. در اصل کامنت نشان دهنده این موضوع هستند که هر قسمت از کدهای نوشته شده چه عملکردی را انجام میدهند.
کامنت در کد نویسی نقش یادآوری را برای طراح ایفا میکند.
تب (Tab)
تب در مرورگر، همان صفحات متعددی است که به کمک لینکها باز شدهاند. در مرورگرهای دسکتاپی این مورد در بالای قسمت آدرس سایت مشخص است.
احتمالا همین الان بسیاری از شما که در حال مطالعه این مقاله میباشید تبهای زیادی را در مرورگر خود برای مطالعه بازکردهاید 🙂
فاو آیکون (Favicon)
با قسمت تب در مرورگر آشنا شدید؟
در کنار هر تب یک تصویر کوچک که غالباً لوگوی سایت میباشد وجود دارد. این همان favicon مورد نظر ماست. در موتورهای جستجو نیز این مورد در کنار آدرس هر سایت قرار گرفته است.
زبانهای مهم برنامهنویسی
پی اچ پی (PHP)
یکی از محبوبترین زبانهای برنامهنویسی سمت سرور میباشد که به دلیل کد باز (Open Source) بودن، قابلیتهای زیادی در خود جای داده است. در حال حاضر سایتهای بزرگی با این زبان طراحی شدهاند و سیستم مدیریت محتوای محبوب وردپرس نیز با این زبان کد نویسی شده است.
ای اس پی (ASP)
این زبان هم یکی از زبانهای محبوب حال حاضر بین برنامه نویسان و طراحان سایت میباشد که توسط شرکت بزرگ مایکروسافت طراحی شده است. یک زبان سمت سرور که در طراحی وبسایتهای داینامیک کاربرد بسیاری دارد.
نسخه پیشرفتهتر این زبان با نام ASP.NET بهعنوان جایگزین زبان اصلی ارائه شده است.
اچ تی ام ال (HTML)
زبان اصلی طراحی سایت میباشد. به کمک این زبان امکان ارتباط بین مرورگر و طراح به راحتی صورت میگیرد. نسخهٔ جدیدی از این زبان به نام XHTML روانه بازار شده که بسیار بهینهتر از نسخه قبلی خود میباشد. به کمک این زبان و انجام کد نویسی درست نمایش کدها در تمام مرورگرها به درستی انجام خواهد شد.
سی اس اس (CSS)
هرآن چیزی که شما در قالب طرحهای گرافیکی در سایت مشاهده میکنید توسط کدهای این زبان نوشته شده است.
کدهای css در صفحات Html قرار میگیرد و وجود آن کمک بسیاری به طراحی بصری سایتها کرده است.
جاوا اسکریپت (JS)
اول از هر چیز این زبان را با جاوا اشتباه نگیرید. این زبان در کنار دو زبان قبلی Html و Css از ارکان اصلی طراحی سایت میباشند. این زبان بر خلاف زبانهای سمت سرور که توسط سرور اجرا میشد، تنها توسط مرورگر کاربر کدهای آن اجرا میشود.
از این زبان در ارائه صفحات آنلاین مانند بازی بسیار استفاده میشود که تعاملی بودن آن را نشان میدهد.
در گذشته از این زبان، طراحان به ندرت استفاده میکردند و نهایت استفاده در زمان نشان دادن علائم هشدار یا خطا برای کاربر در سایت بود. اما در حال حاضر یکی از مهمترین مواردی است که در طراحی وب به آن پرداخته میشود.
ایجکس (AJAX)
ترکیب شده نام JavaScript و Asynchronous XML. AJAX میباشد.
مشخصه اصلی آن مربوط به بارگذاری صفحات میباشد که نیاز نیست برای بخشی از یک صفحه تمام آن دوباره بارگذاری شود.
پایتون (Python)
پایتون در سال 1991 طراحی شده است. این زبان را اکثراً به دلیل آسانتر بودن از سایر زبانها، طراحان به عنوان اولین زبان برای یادگیری خود انتخاب میکنند.
پایتون یک زبان برنامه نویسی همه منظوره میباشد و از تحلیل داده گرفته تا ساخت بازهای کامپیوتری پیشرفته مورد استفاده قرار میگیرد.
این اصطلاحات تخصصی طراحی سایت را حتماً باید بدانید!
VALID
صفحات معتبر وب. آن دسته از صفحاتی که در کدهای HTML و XHTML هیچگونه خطایی ندارند.
این خطاها را میتوان به کمک ابزارهای مختلفی شناسایی کرد که یکی از آنها W3C میباشد.
دابلیو تری سی (W3C)
یک ابزار جهانی در تعیین استاندارهای مربوط به طراحی سایت میباشد و از سال 1994 شروع به فعالیت و تعیین قوانین مربوطه در این زمینه پرداخته است. شرکتهای بزرگ دنیا از اعضای اصلی W3C هستند.
اسکریپت (script)
ابزارهایی هستند که با یک زبان برنامه نویسی خاص نوشته میشود. اسکریپتها میتوانند یک یا چند قابلیت به سایت اضافه کند. معمولاً در طراحی جداگانه، نوشته میشوند و بهصورت رایگان یا پولی میتوان آن را دریافت کرد. مثل: پرداخت آنلاین در بانکها، قسمت پرداخت آنلاین در طراحی سایت فروشگاهی و یا نوبت دهی آنلاین در طراحی سایت پزشکی.
F.A.Q
در فارسی به سؤالات متداول گفته میشود. طراحان سایت و کارفرمایان با توجه به نیاز سایت خود، بخشی را در سایت به عنوان سؤالات متداول ایجاد میکنند.
ریسپانسیو (Responsive)
ریسپانسیو یا همان واکنشگرا، به حالتی گفته میشود که وبسایت شما در تمامی ابزارها مثل گوشی، لپتاپ، تب لت و غیره به درستی نمایش داده شود و حالت به هم ریختگی در آن مشاهده نشود.
حتماً سایتهای زیادی را دیدهاید که حالت ریسپانسیو در آنها وجود ندارد؟
اما بهتر است بدانید گوگل در رتبه دادن به سایتهایی که به درستی در ابزارهای مختلف نمایش داده نمیشوند، حساسیت زیادی دارد و کسب رتبه بالا برای اینگونه از سایتها بسیار سخت میباشد.
سایت فلش (Flash Site)
به وب سایتهایی گفته میشود که کاملاً و یا در بخشی از سایت از تصویر، صوت، انیمیشن و … استفاده کردهاند.
هرزنامه (Spam)
همانطور که از نامش پیداست به محتوای بیهوده، کپی و … گفته میشود. در سئو نیز این حالت را برای سایتهایی در نظر میگیرند که از روشهای غیر طبیعی سعی در بالا آمدن دارند.
متا تگ (Meta tags)
برچسب بزرگ نیز به آن گفته میشود. از این تگهای برای قرار دادن اطلاعات مهم صفحات سایت در اختیار کاربر، مرورگر و … استفاده میشود.
آلت تگ (ALT tag)
یا همان برچسب جایگزین از این تگها نیز بیشتر در تصاویر استفاده میشود. حتماً توجه کردهاید که زمانی عکسی از صفحه یک سایت باز نمیشود، متنی را به جای عکس به شما نمایش میدهد که همان آلت تگ میباشد.
متن نامرئی (Invisible Text)
این متنها در مواردی برای گمراه کردن موتورهای جستجو استفاده میشود. متنها کاملاً همرنگ با پس زمینه هستند. بنابراین کاربر قادر به دیدن آن نیست اما در سایر ابزارها شناسایی میشود.
Inspect
یکی از امکانات مرورگرها میباشد که شما با استفاده از آن میتوانید به تمام کدهای موجود در صفحه سایت دسترسی داشته باشید. این ابزار به نوعی نشان دهنده پشت صحنه سایت است.
URL-Uniform Resource Locator
به آدرس مخصوص هر صفحه یا فایلی که در فضای وب وجود دارد مربور میشود. در واقع مانند اثر انگشت عمل میکند و کاملاً منحصر به فرد است.
جهت یابی (NAVIGATION)
از اصطلاحات مهم طراحی سایت که به پیمایش کاربر در صفحات سایت اشاره دارد. به کمک مکانهایی که در سایت مشخص شده کاربر را در رسیدن به مقصد مورد نظر هدایت میکند.
انکر تکست (ANCHOR TEXT)
لینکهایی که در قالب یک متن در سایت و صفحات مختلف قرار داده شدهاند. نمونه انکر تسکت را در همین مقاله بسیار میتوان دید مانند: طراحی سایت وردپرس
Stemming
به نوعی جستجوی ریشهای کلمه توسط موتورهای جستجو میباشد مثلاً اگر شما واژه سایت را وارد کنید در کنار آن طراحی سایت یا طراحی وب سایت را نیز شناسایی میکند.
خوراک فید (RSS Feed)
احتمالاً این مورد را در وبسایتهای خبری بیشتر مشاهده کردهاید. آر اس اس فایلی است با فرمت XML که هر بار محتوای سایت بهروزرسانی شود این فایل نیز به روز میشود و در صفحه اصلی سایت چکیدهای از متن اصلی خبر را نمایش میدهد.
کش (CACHE/CACHING)
این حالت زمانی رخ میدهد که شما از صفحات یک سایت بازدید کردهاید و در دفعات بعد اگر به همان سایت مراجعه کنید صفحات سریعتر از قبل برای شما باز میشوند که به اصطلاح میگویند صفحه کش شده است.
نتیجه گیری نهایی:
قطعاً اصطلاحاتی که در طراحی سایت میتوان نام برد خیلی بیشتر از موارد بالاست. حتی امکان نوشتن چندین مقاله در این زمینه وجود دارد.
تمام سعی ما در تیم طراحی سایت همیار توسعه این بوده است تا با مهمترین آنها به خوبی آشنا شوید. این لیست قطعاً در ادامه بهروزرسانی خواهد شد. اما این بار با کمک و نظر شما کاربران عزیز در بخش نظرات همین مقاله.
از اینکه تا پایان همراه ما بودید از شما متشکریم. اگر سؤالی در زمینه طراحی سایت و موضوعات پیرامون آن برای شما پیش آمد. میتوانید با همکاران ما در قسمت پشتیبانی سایت با دریافت مشاوره رایگان در ارتباط باشید.
حتما اگه میشه باز هم اصطلاحات جدید طراحی سایت رو اضافه کنید برای من که به تازگی وارد حرفه طراحی سایت شدم خیلی این مطلب مفید بود با بعضی از موارد قبلاً آشنایی داشتم با بقیه خیلی کمتر در مورد اصطلاحات مهم و تخصصی طراحی سایت وردپرس اگر مطلبی جدا یا حداقل در این مقاله اضافه کنید خیلی خوب میشه چون مقاله مشابه این موضوع وجود نداره.
اگر امکانش هست در مورد سایت فلش یکم بیشتر توضیح میدین؟ نمونه ایرانی سایت فلش داریم؟
سلام بله چشم، ما قطعا مقاله هایی از این دست را بیشتر در سایت همیار توسعه قرار خواهیم داد.
در رابطه با سوال دوم شما ما یک مقاله اخیرا با عنوان 10مورد از بهترین نمونه های طراحی سایت سال (2021) نوشته ایم که میتواند راهنمای مناسبی برای شما باشد.
https://hamyar.dev/the-best-example-site-design/