مزایای طراحی وب سایت با div نسبت به table
دسته بندی : آموزش html، طراحی وب سایت ، اخبار اینترنت
حتما شنیدید که خیلی جاها توصیه میشه که برای Layout صفحه بجای Table از Div استفاده کنید. اما چرا؟
وظیفه اصلی تگ div در واقع چیدمان صفحه و طراحی قالب صفحه است و به همین دلیل است که نسبت به table فوق العاده انعطاف پذیرتر است. شما براحتی می توانید یک div را در هر مکانی از صفحه در کوتاهترین زمان قرار بدهید. حالا به این انعطاف پذیری قابلیت حرکت ( انتقال ) را که با کمک تکنولوژی آژاکس اضافه شده نیز بی افزایید.
از طرف دیگر، div کد کمتر و بهینه تری (<div> </div>) نسبت به یک table (که معادل <table><tr><td></td></tr></table>) ایجاد می کند. که این هم باعث کاهش حجم صفحه تولیدی می شود و هم باعث لود شدن سریعتر صفحه .
نکته دیگری که وجود دارد آن است که crawler ها که وظیفه جستجوی و ذخیره کردن طراحی وب سایت را برای موتورهای جستجو ( مثلگوگل ) بعهده دارند. چون بصورت معنایی صفحات را crawl می کنند بنابراین اگر صفحه شما بهتر و معنایی تر ایجاد شده باشد ، ازPage rank بالاتری هم برخوردار خواهد بود. مشکل Crawler ها در ایجاد ارتباط بین مطالب داخل تیبل است. زمانیکه شما مطالب مرتبط با یک موضوع را در بخش های مختلف یک تیبل قرار میدید Crawler ها در نحوه ارتباط این بخش ها با هم و همچنین نحوه ارتباطشون با مطلب اصلی دچار سردرگمی میشن.
نکته دیگری که یک div را در قالب بندی دردرجه بالاتری قرار می دهد، انعطاف پذیری آن در CSS هاست. به این معنی که شما می توانید یک قالب چندین منظوره ایجاد کنید و بعد با تغییر مکان div ها که با css انجام می دهید . کل قالب صفحه تغییر شکل پیدا می کند.
حالا با این همه برتری div نسبت به table ممکن است برای شما این سوال ایجاد شود که table برای چه مواردی باید استفاده شود. طراحی وب سایت html همانطور که div را برای قالب بندی وقرار دادن متن و تصویر پیاده سازی کردند. table را هم برای ایجاد صفحات به شکل Tab و ایجاد جداول ( لیست های موجود در صفحه) بوجود آوردند. در اکثر مواقع توصیه می شود که برای پیاده سازی Tab ها از table استفاده کنید. همانطور که مسلما خود شما هم متوجه شدید با استفاده از یک table براحتی می توان یک tab را پیاده سازی کرد. درصورتی که اگر بخواهید همان tab را با div پیاده سازی کنید باید زمان و انرژی بیشتری صرف کنید.
در کل با توجه به این نکات کلیدی :
حجم کمتر صفحه طراحی وب سایت تولید شده
Page rank بالاتر در گوگل و سایر search engine ها
قالب انعطاف پذیرتر
برای قراردادن متن و تصویر در وب توصیه شده که از div استفاده شود
کنترل بیشتر بوسیله css
جدول صرفا برای ساختار tabی مناسب است
کنترل و حرکت توسط آژاکس
…
به شما اکیدا توصیه می کنم که بجای استفاده از table در قالب بندی صفحات از div استفاده کنید و از قدرت آن لذت ببرید.
....
آموزش ساخت طراحی وب سایت با Dreamweaver CS4
آموزش ساخت وب سايت با Dreamweaver CS4
عنوان اصلي : Creating First Web Site In Dreamweaver CS4
آموزش طراحی وب سایت بسيار زيبا اما ساده در نرم افزار Adobe Dreamweaver CS4 به مدت زمان 2 ساعت و 40 دقيقه در آموزش مالتي مديا محصول موسسه آموزشي Lynda ارائه شده بر روي 1 حلقه CD به همراه فايل هاي تمريني
اين آموزش پروسه طراحي يك سايت را در نرم افزار دريم ويور CS4 به شما مي آموزد از ساختن يك صفحه ساده HTML تا استايل گذاري بر روي آن بوسيله CSS و همچنين نحوه ساخت انواع فرم ها به عنوان مثال فرم تماس با ما .
اين مجموعه آموزش بهترين مجموعه آموزش طراحی وب سایت براي شروع آموختن طراحي وب است .
در ادامه با برخي از سرفصل هاي درسي اين مجموعه آموزش Dreamweaver CS4 آشنا مي شويم :
آشنايي با مدرس مجموعه و سرفصل هاي اين كورس آموزشي از زبان مدرس شامل 3 درس
آموزش مفاهيم اوليه وب و وب سايت ها شامل 3 درس
آموزش ساخت صفحات وب در دريم ويور شامل 5 درس
آموزش اعمال CSS ها براي سبك بندي صفحات وب در Adobe Dreamweaver CS4 شامل 4 درس
آموزش پيشرفته CSS ها در Dreamweaver CS4 شامل 5 درس
آموزش ذخيره و استفاده از قالب ها در Dreamweaver CS4 شامل 1 درس
آموزش وارد كردن تصاوير در صفحات طراحی وب سایت شامل 2 درس
آموزش ساخت Photo Gallery و كاربرد فايل هاي فلش در صفحات وب شامل 3 درس
آموزش ساخت فرم تماس وب سايت در Dreamweaver CS4 شامل 2 درس
آموزش تست كردن نهايي براي رفع ايرادات آن و در نهايت آموزش كامل قرار دادن يك وب سايت بر روي اينترنت شامل 3 درس
و چندين و چند آموزش كاربردي ديگر مانند آموزش آماده سازي وب سايت براي موتورهاي جستجو ، استفاده از FTP و بسياري موارد ديگر
برچسب: طراحی وب سایت,طراحی سایت,طراحی وب,
نویسنده: rozita