بعد از این که با ابزار های طراحی سایت آشنا شدید و تصمیم گرفتید که وب سایت خود را طراحی کنید ، نیاز است که بدانید این ابزارها را به چه روشی استفاده کنید و یا به بیان دیگر ، با روش های متداول طراحی و ساخت صفحات وب یا وب پیج آشنا شوید. بدین منظور با ما همراه باشید.
برای ساخت صفحات اینترنتی در طراحی سایت ، سه راه حل متداول وجود دارد:
در قسمت اول با استفاده از CSS یک قالب دو ستونی کلاسیک با navigation سمت چپ ایجاد کردیم که تنها چند نوع تگ HTML داشت. قسمت اول کد صفحه را ارائه کرده و توضیح می‌داد که قرار است از چه تگ‌های HTML استفاده کنیم.
همانطور که می‌دانید، تمام محتوایی (متن، عکس، فلش، و غیره) که کاربر هنگام مشاهده یک صفحه وب می‌بیند با HTML مشخص شده و بین تگ‌های <body> و </body> قرار دارد.
در این مورد داریم:
<body>
<div id=”navigation”>
<h2>The Main navigation</h2>
</div>
<div id=”centerDoc”>
<h1>The Main Heading</h1>
<p>
</p>
</div>
</body>
توجه :
شما باید صفحه HTML ساده خودتان را ایجاد کنید به طوری که بتوانید با من همراهی کرده و گام به گام صفحه را ایجاد کنید.
در کد بالا دو بخش اصلی مشاهده می‌کنیم که هر کدام در داخل تگ‌های <div> محصور شده‌اند. همانطور که در قسمت اول این آموزش یاد گرفتیم، تگ‌های <div> برای این طراحی شده‌اند تا برای ایجاد یک «قسمت» در سند یا به عبارت دیگر، یک ظرف مورد استفاده قرار بگیرند.
دو لفاف مانند آنچه گفتیم ایجاد کرده و هر یک از آن‌ها را با یک ID (یا شناسه) منحصر به فرد نامگذاری می‌کنیم:
قالب سایت ، یکی از مهم ترین بخش های سایت است. فرض کنید محتوای سایت شما کاملا متحصر به فرد و کامل است ؛ اما اگر این محتوا در قالب مناسبی برای بازدیدکننده نمایش داده نشود ، ارزش خود محتوا خود به خود کم میشود. بنابراین توجه به نوع قالب های موجود در بحث طراحی سایت و سپس انتخاب تم مناسب از میان انواع قالب های وب سایت ، مهم است. در ادامه با انواع قالب های وب سایت آشنا میشوید.
تمامی بخش های تشکیل دهنده ی یک وب سایت ، مجموعا یک قالب را ایجاد می کنند که به آن پوسته یا تم نیز گفته میشود. در پوسته یا قالب وب سایت ، بخش هایی به صورت مشترک با سایت های دیگر وجود دارند ؛ اما این که هر یک از آیتم ها دقیقا در کجای سایت ، با چه شمایلی و یا چه رنگ هایی قرار بگیرند ، مجموعا قالب وب سایت را تشکیل می دهد که در طراحی سایت ، سبب متمایز شده یک سایت از سایت دیگر میشود. در ادامه با تعریف قالب سایت و جایگاه و شیوه ساخت آن آشنا میشوید.
در بخش اول ، دو ابزار ضروری طراحی سایت ، یعنی مرورگر ها و ادیتور های متنی معرفی کردیم. در ادامه ، به صورت مفصل تر انواع ادیتور های متنی که برای درج کدهای مختلف و ویرایش آن ها مورد استفاده قرار میگیرند را معرفی می کنیم.
بعد از این که با ابزارهای اولیه برای طراحی سایت آشنا شدید و البته آشنایی مقدماتی با انواع زبان ها نظیر HTML پیدا کردید ، لازم است با بخش های تشکیل دهنده یک وب سایت استاندارد جهت طراحی وب سایت کاملی آشنا شوید. این بخش ها را در ادامه معرفی می کنیم.
بعد از این که با تعریف طراحی وب سایت آشنا شدید ، مهم ترین موضوع ، ابزارهایی ضروری برای طراحی یک وب سایت می باشد که قطعا سوال بسیاری از کاربران مبتدی می باشد. این که درطراحی وب چه ابزاری را به کار گیریم و با استفاده از چه نرم افزارهایی به طراحی سایت مشغول شویم ، مهم ترین بخش در یادگیری طراحی سایت است و در این مقاله و مقاله بعدی ، به اختصار با آن ها آشنا خواهید شد.
در معرفی بوت استرپ باید گفت که یک چهار چوب front-end قدرتمند برای توسعه سریع و راحت وب می باشد. بر اساس قالب های طراحی HTML و CSS در بخش های تایپوگرافی، فرم ها، دکمه ها، جداول، آرشیو، منو ها، هشدار ها، زبانه ها و بسیاری از پسوند های جاوا اسکریپت می باشد.
از کاربرد های Bootstrap این است که قابلیت ایجاد طراحی سایت ریسپانسیو را می دهد.
کد QR یا همان Code Quick Responding کد هایی هستند که استفاده از آن ها روز به روز در حال گسترش می باشد و مطمئنا نمونه هایی را در سایت های اینترنتی مشاهده کرده اید. اما هنوز خیلی ها از کاربرد های کد QR اطلاع ندارند. کد کیوآر کاربرد ارزنده ای می تواند داشته باشد. در این بخش به معرفی کاربرد های QR می پردازیم. کد کیوآر امروزه در طراحی سایت بسیار طرفدار پیدا کرده است.
کد های کیوآر عموما برای هدایت کاربران به یک آدرس اینترنتی خاص استفاده می شوند. اما برخلاف تصور عموم، این تنها کاربرد کد های QR نیست. کد های کیوآر موارد و کاربرد های استفاده مختلف و ارزنده ای دارند که روز بروز در حال گسترش می باشد.
یکی دیگر از دیگر کاربرد کد های QR برای باز کردن یک موقعیت بر روی نقشه و هدایت کاربران به آن موقعیت می باشد. همچنین برای باز کردن یک لینک و یا متن اشتراک گذاری شده در یکی از شبکه های اجتماعی استفاده می شود.
