آموزش طراحی یک وب‌سایت، به زبان ساده

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

کد خبر: ۷۵۳۲۰

تاریخ: ۰۲ خرداد ۱۳۹۸ - ۱۲:۳۹

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

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

وب‌سایت چیست؟

وب‌سایت، وبگاه و یا تارنما، مجموعه‌ای از صفحات اینترنتی هستند که بر روی پروتکل ارتباطی اینترنت و یا شبکه‌های محلی قرار می‌گیرند. وب‌سایت‌ها درست مثل صفحات یک مجله، به هم مرتبط هستند. برای ورود به هر وب‌سایت، شما نیاز به یک آدرس اینترنتی خاص (دومین) دارید، که به وب‌سایت مذکور اختصاص داده شده است. با ورود به هر وب‌سایت، ممکن است با اطلاعاتی مختلف به شکل متن، ویدیو، عکس و دیگر انواع مولتی‌مدیا روبرو شوید.

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

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

سرور چیست؟

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

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

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

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

چگونه یک دامنه تهیه کنیم؟

دومین، دامنه یا آدرس اینترنتی، یک عبارت مشخص است که کاربران از طریق آن می‌توانند به وب‌سایت شما دسترسی داشته باشند. هر دومین از یک کلمه یا عبارت خاص و یک پسوند مشخص تشکیل شده است. پسوند‌های ارائه‌شده برای آدرس‌های اینترنتی، معنی و کاربرد خاص خود را دارند. دومین‌های Com؛ که شلوغ‌ترین و باارزش‌ترین پسوند به‌حساب می‌آیند، قیمتی بالاتر از دومین‌های اختصاصی ایران با آدرس ir. دارند.

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

خرید دومین‌های بین‌المللی، از طریق رابط‌های ایرانی امکان‌پذیر است. برای این کار لازم است عبارت «خرید دامنه» را در اینترنت جستجو کنید. پس از جستجو با تعداد زیادی از وب‌سایت‌های ارائه‌کننده خدمات دومین روبرو می‌شوید.

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

این موضوع را در نظر داشته باشید که راه‌اندازی یک وب‌سایت، بدون خرید دومین و سرور نیز امکان‌پذیر است. شرکت‌های زیادی مثل وب‌سایت مشهور Wordpress، آدرس اینترنتی و سرور رایگان را در اختیار کاربران قرار می‌دهند. هرچند محدودیت حجم و اضافه شدن واژه Wordpress به دومین شما باعث می‌شود که به‌عنوان یک راهکار بلندمدت، پیشنهاد نشوند.

تفاوت صفحات استاتیک و دینامیک

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

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

تفاوت وب‌سایت‌های دینامیک این است که بسیاری از تغییرات، با همکاری سرور انجام می‌شود. در این وب‌سایت‌های یک سیستم Backend مسئولیت تغییر‌ها را به عهده دارد. سیستمی پیچیده و پیشرفته که سرعت و کیفیت یک وب‌سایت را بالا می‌برد.

درصورتی‌که یک وب‌سایت ثابت با تغییرات حداقلی را مدنظر دارید، وب‌سایت‌های استاتیک می‌توانند گزینه‌ای مناسب برای شما باشند. این وب‌سایت‌ها حجم کمتری دارند و با سرعت بیشتری بر روی هاست‌های اشتراکی، بارگذاری می‌شوند.

از سوی دیگر اگر قصد راه‌اندازی یک وب‌سایت پیچیده مثل مجله اینترنتی، فروشگاه و دیگر انواع وب‌سایت بزرگ و شلوغ را دارید، باید سراغ وب‌سایت‌های دینامیک و سرور‌های قدرتمندتر بروید.

این موضوع را در نظر بگیرید که لازم نیست تمامی طراحی وب‌سایت دینامیک، از صفر آغاز شود. بسیاری از کد‌های آماده و سرویس‌های میزبان مثل Wordpress، نیاز کاربر به یادگیری زبان‌های برنامه‌نویسی پیشرفته را به حداقل می‌رساند.

چگونه وب‌سایت را طراحی کنیم؟

اگر تصمیم گرفتید که یک وب‌سایت استاتیک را راه‌اندازی کنید، باید با استفاده از HTML و CSS که زبانی اختصاصی برای طراحی شکل ظاهری وب‌سایت هستند، طراحی را آغاز کنید. اگر علاقه‌ای به یادگیری یک زبان رایانه‌ای جدید ندارید، می‌توانید از برنامه‌های اختصاصی طراحی صفحات وب استفاده کنید. این برنامه‌ها با رابط کاربری خاص خود، می‌توانند پیچیدگی طراحی صفحات استاتیک را به حداقل برسانند. برنامه‌هایی مثل Dreamweaver، Google Web Designer، Open Element و دیگر برنامه‌های شناخته‌شده در این زمینه، می‌توانند نقطه آغاز برای طراحی صفحات استاتیک وب باشند.

پس از طراحی و ساخت صفحات موردنظر، باید آن‌ها را به سرور سایت منتقل کنید. ارائه‌دهنده سرور، راه انتقال فایل‌ها را در اختیار شما قرار خواهد داد. با نام‌گذاری فایل صفحه اصلی سایت به نام index.html و بارگذاری آن بر روی سرور، با هربار مراجعه به سایت، این صفحه دانلود و در مرورگر نمایش داده می‌شود. صفحه ایندکس، صفحه خانه و اصلی وب‌سایت است که از طریق لینک‌های مختلف، به دیگر صفحات وب‌سایت، متصل می‌شود.

درصورتی‌که نیاز به طراحی یک وب‌سایت پویا باشد، سه راه مختلف پیش روی کاربر قرار دارد. راه اول، یادگیری زبان‌های برنامه‌نویسی و مارک‌آپ HTML، CSS و Java Script است تا بتوان نقطه آغازی برای طراحی یک وب‌سایت دینامیک باشد. راه ساده‌تر استفاده از سرویس‌های آماده‌ای مثل Wordpress، Joomla، Drupal، Magneto و دیگر راهکار‌های مشهور است. این سیستم‌ها، حجم بسیار بالایی از طراحی یک وب‌سایت را به‌صورت پیش‌فرض انجام داده‌اند و تنها لازم است با انتخاب قالب موردنظر و تغییراتی اندک، یک وب‌سایت پویا را راه‌اندازی کرد.

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

از یک طراح وب‌سایت چه بخواهیم؟

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

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

مدت‌زمان انجام کار و جرائم دیرکرد، باید در قرارداد اولیه وارد شود و میزان پشتیبانی از وب‌سایت نیز باید مشخص باشد. در نظر داشته باشد که با تغییر دنیای وب، ممکن است وب‌سایت شما بعد از مدتی نیاز به تغییر و بهبود داشته باشد. مشخص شدن میزان و کیفیت پشتیبانی وب‌سایت، از هزینه‌های اضافه برای بهبود و تعمیر سایت طراحی‌شده جلوگیری خواهد کرد.

راه‌کار قدم‌به‌قدم طراحی یک وب‌سایت ساده

۱. یک دومین و آدرس اینترنتی تهیه کنید.

۲. یک سرور یا هاست اشتراکی را خریداری کنید.

۳. نیم‌سرور‌های دومین را به آدرس‌های مشخص‌شده توسط شرکت ارائه‌دهنده سرور تغییر دهید.

۴. یک صفحه ساده وب را روی کامپیوتر خود طراحی کنید و نام فایل را به Index.html تغییر دهید.

۵. صفحه یا صفحات طراحی‌شده را به همراه تمامی فایل‌ها، به سرور منتقل کنید.

راه‌کار قدم‌به‌قدم راه‌اندازی یک‌وبسایت وردپرس

۱. یک دومین و آدرس اینترنتی تهیه کنید.

۴. فایل زیپ وردپرس فارسی را از آدرس wp-persian.com دانلود کنید.

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

۶. به صفحه wp-persian.com/codex مراجعه کنید و اطلاعات لازم را برای راه‌اندازی کامل یک وب‌سایت وردپرس مطالعه کنید.

۷. قالب موردنظر خود را انتخاب و ویرایش کنید.