طراحی سایت با php به چه صورت است

آشنایی با طراحی سایت

آیا می‌خواهید نحوه ایجاد یک وب سایت اساسی را بیاموزید؟ ممکن است شروع به کار با HTML کرده باشید، اما این روزها بهترین راه حل طراحی سایت با php است.

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

 

قبل از شروع طراحی سایت، مطمئن شوید که یک ویرایشگر متن ساده یا محیط توسعه آماده PHP نصب کرده‌اید. می‌توانید برنامه نویسی با زبان php را با ابزاری ساده به مثل notepad Windows شروع کنید. Notepad ++ نیز گزینه بسیار مناسبی است.

همچنین باید یک وب سرور PHP داشته باشید تا فایل‌های خود را در آن بارگذاری کنید. ممکن است یک سرور از راه دور یا یک رایانه محلی با یکی از محیط‌های زیر را نصب کرده باشید:

LAMP (Linux ، Apache ، MySQL ، PHP) یا WAMP (Windows ، Apache ، MySQL ، PHP)

 

موضوع دیگری که اغلب در مبحث طراحی سایت با php مطرح می‌شود مربوط به برنامه نویسی فرانت اند و بک اند است.

فرانت اند (Front End)، به بخش قابل مشاهده‌ی یک web site یا نرم افزار توسط کاربران می‌گویند.

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

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

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

در واقع، زبان‌های برنامه نویسی مختلفی برای بخش بک اند وجود دارند مثل php – asp.net – java یا پایتون و در مقابل زبان‌های برنامه نویسی زیادی در حوزه‌ی برنامه نویسی فرانت اند استفاده می‌شوند که سه زبان مهم و اصلی آن HTML و CSS و جاوا اسکریپت می‌باشد.

 

ساختار طراحی سایت با php چگونه است؟

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

• طراحی گرافیک وب
• طراحی رابط کاربری
• تألیف کد استاندارد و نرم افزار اختصاصی
• طراحی تجربه کاربر
• بهینه سازی موتورهای جستجو

 

برای شروع آموزش طراحی سایت با php باید ابتدا با ساختار کلی آن آشنایی داشته باشید:

در سینتکس اصلی PHP از مجموعه‌ای از angled brackets استفاده می‌شود و انتهای هر تابع نیز از semi-colon استفاده می‌شود، به صورت زیر:

 

<?php [CODE…CODE]; ?>

 

 

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

<?php print(“Hello World”)?>

توجه داشته باشید که HTML نیز در نقل قول‌ها گنجانده شده است. خروجی آن معمولاً به صورت زیر ظاهر می‌شود:

 

در روند ساخت وب سایت با PHP فرقی نمی‌کند که با چه کدی وب سایت خود را می‌نویسید، فقط قبل از ادامه کار باید ساختار سایت را بدانید.

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

اما برای یادگیری طراحی سایت با PHP به صورت حرفه‌ای، باید به فریم‌ورک لاراول مسلط باشید. عموما وقتی صحبت از طراحی سایت با php می‌شود منظور همان فریم‌ورک لاراول است.

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

 

در این مقاله ما قصد ایجاد یک وب‌سایت PHP ساده را داریم. این سایت دارای یک صفحه است و با ۳ محتوای HTML مقدار دهی شده است.
قطعات کد و مثال‌هایی که در این مقاله طراحی سایت با php ارائه می‌شوند مربوط به یکی از پروژه‌ موجود در ریپوی گیت‌هاب می‌باشد.

 

شروع طراحی سایت با php

برای شروع طراحی سایت با php باید سه صفحه وب ساخته شود.

ساخت هدر/ header

کار خود را با ساخت هدر شروع می‌کنیم که در واقع این قسمت شامل اطلاعات مربوط به عنوان سایت ما است.
ابتدا کار خود را با ساخت فایل header.html شروع می‌کنیم و پس از آن اطلاعات مورد نظر را در هدر درج می‌کنیم؛

 

<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”description” contents=”About CM Cawley Biography website in PHP”>
<link rel=”stylesheet” href=”style.css” type=”text/css”>
</head>
<body>
<header>
<nav id=”navigation”>
<ul>
<li><a href=”index.php”>Home</a></li>
<li><a href=”about.php”>About</a></li>
<li><a href=”https://www.makeuseof.com/tag/author/ccawley/”>MakeUseOf</a></li>
</ul>
</nav>
</header>
<div id=”contents”>

درج محتوا در body

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

پس می‌توانید یک صفحه به نام body.html ایجاد کنید و اطلاعاتی که می‌خواهید در صفحه نمایش پیدا کند را به آن اضافه کنید؛

مثال:

 

<p> مکتب‌خونه بزرگ‌ترین رسانه دیجیتال آموزش مجازی در ایران است که از سال ۱۳۹۰ فعالیت خود را آغاز کرده است. هدف مکتب‌خونه در دسترس قرار دادن آموزش با کیفیت بالا برای همه‌ی فارسي‌زبانان است. ما اعتقاد داریم که هیچ کس نباید به خاطر هیچ چیز از لذت یاد گرفتن محروم شود. نباید سن و سال، مکان، موقعیت یا امکانات مالی فرد، وی را از یادگیری و موفقیت باز دارد. </p><p> در این مقاله در رابطه با طراحی سایت با پی اچ پی مطالب مفیدی برایتان بارگزاری شده است.. </p>

 

ساخت فوتر/Footer

ایجاد قسمت پاورقی صفحه وب، مرحله بعدی از طراحی سایت با php است. فایلی با عنوان footer.html ایجاد می‌کنیم و مقداری محتوا به آن اضافه می‌کنیم. این محتوا می‌تواند شامل اطلاعات حق چاپ باشد یا شاید پیوندهای مفیدی برای هر یک از افرادی که از صفحه شما بازدید می‌کنند؛

 

</div>
<footer>
Contact me on Twitter: <a href=”https://www.twitter.com/TheGadgetMonkey”>@TheGadgetMonkey</a>
</footer>
</body>
</html>

حال صفحات وب سایت PHP خود را کنار هم قرار دهید.

با سه فایل جداگانه HTML در / html / می‌‌توانید از PHP echo برای کامپایل آن‌ها در یک صفحه استفاده کنید.

 

یک فایل PHP جدید به نام index.php با سه خط زیر در آن ایجاد کنید:

 

<?php echo file_get_contents(“html/header.html”); ?>
<?php echo file_get_contents(“html/body.html”); ?>
<?php echo file_get_contents(“html/footer.html”); ?>

 

آن را ذخیره کنید، در سرور خود بارگذاری کنید، سپس به index.php بروید. حال می‌توانید صفحه وب کامل شده را در مرورگر خود مشاهده کنید.

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

در نهایت، می‌توانید یک PHP flourish را با خط نهایی زیر به صفحه خود اضافه کنید که شامل یک اعلامیه حق چاپ و یک تاریخ(سال جاری) همیشه به روز است؛

 

<p>Copyright © CM Cawley <?php echo date(“Y”); ?></p>

 

این اطلاعات در فایل index.php زیر پاورقی ظاهر می‌شوند. توجه کنید که چگونه عبارت اکو (“Y”) سال جاری را چهار رقمی نمایش می‌دهد. با مراجعه به لیست آموزش‌های W3Schools می‌توانید نحوه نمایش این مورد را تغییر دهید.

به عنوان مثال، یک حروف کوچک “y” سال را در قالب دو رقمی نمایش می‌دهد، نه چهار رقمی

می‌توانید از CSS برای موقعیت دهی و استایل دادن به پروژه خود و افزودن سایر عناصر استفاده کنید. همچنین می‌توانید CSS این پروژه را در مخزن GitHub، همراه با دیگر کد‌های وب سایت PHP ساده پیدا کنید.

 

بسیار خوب، با توجه به مقاله طراحی سایت با php شما توانسته‌اید اولین وب سایت PHP خود را از ابتدا ایجاد کنید.

 

 

نتیجه گیری

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