نگاه كن دوست من مفهوم table less يعني خالي از تيبل به اين معني كه در طراحي صفحات از تگهاي table td tr tbody و غيره استفاده نشه و حتي الامكان از تگهاي div span p li ul و ... استفاده بشه و Css چون با اينكار هم سرعت رندر صفحه بالاتر ميره هم سر درگمي طراح و ببيننده كد شما كمتر ميشه و هم اصولي تر و حرفه اي تر انجام ميشه
سلام دوست عزیز .
تیبل لس یعنی این که صفحه وب شما بدون استفاده از تگ های تیبل ساخته بشه .
البته در بعضی قسمت های سایت استفاده از جدول ها انکار ناپذیره .
ابن دو تا چیز هم که گفتین کاملا کتفاوت هستن .
Css یک زبان برنامه نویسی برای ایجاد سبک ها در صفحات وب می باشد .
اما این که میگن سایت با تیبل طراحی شده یعنی توی صفحه وب از تگ های تیبل به عنوان پایه ساختار صفحه وب استفاده شده و امکان این که با css سبک دهی شده باشه هم هست .
پس این دو تا دو چیز کاملا متفاوت هستن .
به نظر خودم ، مطلب رو درست نرسوندم .
اگر که متوجه نشدین بگین تا بیشتر توضیح بدم .
موفق باشید .
من راستش زیاد چیزی نفهمیدم :دی
یعنی من که میخوام ساختار سایتم رو با css طراحی کنم آیا از table هم باید استفاده کنم یا نه؟
در کل با وجود css آیا تگ های html هم لازمه یا نه؟
این نوع کد نویسی که بر اساس CSS هاست ایرادات خفنی هم داره ، اونم سازگاری با مرورگر هاست که درست کردنشون گاهی وقتا اعصاب آدم رو خورد میکنه . بخصوص وقتی که قرار باشه با IE سازگار کنی ) ( IE 8 ! ) ، اما سرعت این متد خیلی بالاست به طوریکه یه قالب خیلی شیک و گرافیکی با دایال آپ بالفرض 5 ثانیه طول میکشه لود شه ، همون قالب با table ممکنه مثلا 1 دقیقه ای وقتتو بگیره یا از اینجور صحبت ها . چندین سال پیش یه کتابی میخوندم به نام Speed up your web site این کتاب یاهو رو کامل بررسی میکرد که چجوریه اینقدر سرعت لودش بالاست و اینا ، چیزی که خیلی تاکید میکرد استفاده نکردن یا کم استفاده کردن از تیبل ها بود که میگقت واقعا موثره ، میتونم بگم خودشو تیکه تیکه کرد تا آخر کتاب سر همین یه قضیه !
این نوع کد نویسی که بر اساس CSS هاست ایرادات خفنی هم داره ، اونم سازگاری با مرورگر هاست که درست کردنشون گاهی وقتا اعصاب آدم رو خورد میکنه . بخصوص وقتی که قرار باشه با IE سازگار کنی ) ( IE 8 ! ) ، اما سرعت این متد خیلی بالاست به طوریکه یه قالب خیلی شیک و گرافیکی با دایال آپ بالفرض 5 ثانیه طول میکشه لود شه ، همون قالب با table ممکنه مثلا 1 دقیقه ای وقتتو بگیره یا از اینجور صحبت ها . چندین سال پیش یه کتابی میخوندم به نام Speed up your web site این کتاب یاهو رو کامل بررسی میکرد که چجوریه اینقدر سرعت لودش بالاست و اینا ، چیزی که خیلی تاکید میکرد استفاده نکردن یا کم استفاده کردن از تیبل ها بود که میگقت واقعا موثره ، میتونم بگم خودشو تیکه تیکه کرد تا آخر کتاب سر همین یه قضیه !
الان منظورتون اینه که css بئه یا tableless؟
کلا بهترین کار واسه یه قالب بندی شیک چیه؟و اینکه توی هر مرورگری به درستی نشون داده بشه.از css بهتر هم هست؟
اینو هم جواب بدین لطفا:
در کل با وجود css آیا تگ های html هم لازمه یا نه؟
بابا این دوستمون متوجه نمیشه اینجوری .. بزارید من توجیهش کنم ...
ببین توی table base شما میتونی بری توی front page ، همونجوری که توی word جدول میکشی ، یه سری جدول بکشی .. دقیقا با ماوس ، یعنی جدول هایی که وقتی میکشی شون از خودشون شکل ظاهری ندارن ، یعنی میشه گفت نامرئی هستن .. مگه اینکه تو خودت بهشون یه استایلی بدی .. مثلا رنگشون رو عوض کنی ، دورشون ، خط stroke بکشی .
میتونی مشخص کنی که داخل یه جدول یه تصویر بشه background ، یه تصویر بشه foreground .
در این حالت حتی اگه کد نویسی هم بلد نباشی ، میتونی یه چیزایی طراحی کنی .. حالا اگه tag هارم بلد باشی که چه بهتر ..
توی div base قضیه خیلی فرق میکنه . div فرقش با table اینه که table رو همونجوری که ترسیم میکنی ، عینا تو مرورگر هم نشون میده . چه IE و چه firefox و ... ولی div باید مختصاتش خیلی دقیق باشه .
مثلا باید بگی فاصله اش از راست صفحه چقدر باشه ، از چپ صفحه چقدر باشه ، از بالا ، از پایین ، چیزایی که اطرافش هستن چقدر ازش فاصله داشته باشن . و خیلی چیزای دیگه .
معمولا مشکلی هم که div داره ، همین خطاهایی هست که موقع اجرای مختصات پیش میاد و تو چیزی که بهت نشون میده بعضی چیزا سر جایی که میخوای وا نمیسن .
مثلا توی table شما متنت دقیقا همونجایی که داری می بینی و تنظیمش میکنی وا میسه روی ستون .
ولی تو div چون همه چیز با مختصات کار میکنه ، یه وقتی می بینی ستون سر جاشه ، ولی متن یکی دو سانت یا کمتر و بیشتر اینور تر یا اون ور تر واساده ..
فرق table base با div base توی load شدن اینه که ،سایتی که table base طراحی میشه ، وقتی میخواد لود بشه ، صبر میکنه تا همه ی ملحقات صفحه لود بشه ، بعد همه چیزو نشون بده ، ولی تو div base همه چیز از همون اول خورد خورد باز میشه . یعنی یه دفه می بینی از یه عکس و آیکون شروع میشه به باز شدن ، تو متنا و بک گراند و اینا ...
البته سایت هایی که table base هستن رو هم میشه با css اجراشون رو بهتر کرد و مقدار کدهای html شون رو کم کرد . و این یه نکته اساسی داره ، که میشه گفت مربوط میشه به seo ...
در کل شما در نظر بگیر که سایتت مثلا سه تا ستون داره، یکی سمت راست، یکی وسط و یکی سمت چپ. اینو دو جور میشه با HTML و CSS (دقت کن که این دو تا زبون برنامه نویسین) طراحی کرد. یکی اینکه توی HTML با استفاده از تگهای مربوط به table یه جدول سه ستونه بسازی که هر ستون جدول میشه یکی از ستونهای سایت. بعد محتوای هر ستون داخل یه سلول از جدول قرار میگیره. این میشه طراحی با جدول یا table based. در واقع از همون HTML و CSS استفاده شده ولی از تگهای جدول HTML برای قالب بندی سایت استفاده کردیم. این روش ، روش table based میشه که از قدیمها استفاده میشد ولی دیگه الان داره منسوخ میشه بین برنامه نویسا.
روش بعدی بدون جدول که بازم با css و html کار میشه ولی این بار بدون استفاده از تگهای جدول. این حالت هم استاندارده ، هم مشکلات کمتری داره. سبکتره ، زیبا تره و کلا اصلا قابل مقایسه نیست با حالت table based.
الان منظورتون اینه که css بئه یا tableless؟
کلا بهترین کار واسه یه قالب بندی شیک چیه؟و اینکه توی هر مرورگری به درستی نشون داده بشه.از css بهتر هم هست؟
اینو هم جواب بدین لطفا:
در کل با وجود css آیا تگ های html هم لازمه یا نه؟
سلام دوست عزیز .
من دیگه توضیح نمی دم .
چون توضیحات دوستان جامع و کامل بود .
1 - هیچ کدوم بد نیستن . اما روش استفاده از تیبل بیس دیگه غیر استاندارد هست . پس بهتر ه صفحه وب شما تیبل لس باشه . و صفحات تیبل لس هم با استفاده از html ایجائ میشن و با css سبک بندی .
2 -استفاده از روش تیبل لس می باشد . از css بهتر هم نیست . چون فقط همین یک زبان برای سبک بندی انتخاب شده و یه چیز کاملا متفاوت نسبت به html می باشد .
3 - بله . اگر که تگ های html نباشن شما می خواهید چی رو با css سبک بندی کنید ؟ پس وجود تگ های html الزامی می باشد اما وجود کد های css اختیاری هست .
اگر که متوجه نشدین یا هنوز سوالی باقی هست بگین تا بازم توضیح بدم .
موفق باشید .
ممنون خیلی جالب بود
ولی اینو نفهمیدم که آیا div توی css هست یا توی html ؟
اینجوری هم که دوستان در مورد به هم ریختگی صفحه با استفاده از div گفتن فکر میکنم استفاده ازش کار خطرناکی باشه !!!
کلا دوستان حرفه ای چی رو پیشنهاد میکنن؟
ممنون خیلی جالب بود
ولی اینو نفهمیدم که آیا div توی css هست یا توی html ؟
اینجوری هم که دوستان در مورد به هم ریختگی صفحه با استفاده از div گفتن فکر میکنم استفاده ازش کار خطرناکی باشه !!!
کلا دوستان حرفه ای چی رو پیشنهاد میکنن؟
div توی html هستش .. شما ، وقتی رو html کار میکنی .. یه اسمی برای اون div مشخص میکنی . چون تو یه صفحه ممکنه 10 تا div به کار ببری ، نمی تونی همه رو با یه tag بشناسونی ...
بعدش میری تو css ... میگی که مختصات div x من اینجوریه ... مختصات div Y من اینجوریه ...
ولی متن یا عکس مربوط به اون div تو همون html وارد میشن و ذخیره میشن .. css فقط و فقط استایل کارو لود میکنه .
یعنی شما تو html فقط میگی <div x1 >مثلا اینجا یه مطلب هست یا خبر هست </div x1 >
ولی محل قرار گرفتنش ، رنگش ، فونتش و این جور چیزاش از css خونده میشه .. دیگه کنار این نیست ..
عموما css رو هم تو یه فایل جداگونه میزارن ، بعد لینکش میکنن به html ... و به طور همزمان هر دو فایل خونده میشن و اجرا میشن ...
اما اگه css نباشه .. همه ی این چیزایی که گفتم ، داخل همین tag به کارت اضافه میشه ... یعنی دقیقا مینویسه فونت فلان .. وضعیت پاراگراف فلان .. سایز فلان .. فاصله ها و ...
div توی html هستش .. شما ، وقتی رو html کار میکنی .. یه اسمی برای اون div مشخص میکنی . چون تو یه صفحه ممکنه 10 تا div به کار ببری ، نمی تونی همه رو با یه tag بشناسونی ...
بعدش میری تو css ... میگی که مختصات div x من اینجوریه ... مختصات div y من اینجوریه ...
ولی متن یا عکس مربوط به اون div تو همون html وارد میشن و ذخیره میشن .. Css فقط و فقط استایل کارو لود میکنه .
یعنی شما تو html فقط میگی <div x1 >مثلا اینجا یه مطلب هست یا خبر هست </div x1 >
ولی محل قرار گرفتنش ، رنگش ، فونتش و این جور چیزاش از css خونده میشه .. دیگه کنار این نیست ..
عموما css رو هم تو یه فایل جداگونه میزارن ، بعد لینکش میکنن به html ... و به طور همزمان هر دو فایل خونده میشن و اجرا میشن ...
اما اگه css نباشه .. همه ی این چیزایی که گفتم ، داخل همین tag به کارت اضافه میشه ... یعنی دقیقا مینویسه فونت فلان .. وضعیت پاراگراف فلان .. سایز فلان .. فاصله ها و ...
ر طراحی سایت بر اساس دیو، که بهتراست به آن بگوییم Tableless شما از تگ های Div, Ul, Li, Span به جای تگ Table استفاده می کنید.
اصولا طراحی سایت بدون جدول نیاز به مهارت بالاتر از متوسط در نوشتن سی اس اس دارد.
ممکن است افراد آما تور هم بتوانند سایتی Tableless طراحی کنند، اما ممکن است سایت آن ها در تمام مروگر ها به خوبی نمایش داده نشود و یا مجبور شوند در بعضی از قسمت ها از جدول استفاده کنند.
مشکل ترین و مهمترین قسمت کار، طراحی Layout Tabless است که طراحان غیر حرفه ای می توانند از نمونه های آماده که در اینترنت موجود است استفاده کنند.
طراحی سایت Tableless مزیت های فراوانی دارد که در زیر به شرح آن می پردازیم:
۱- کاهش حجم کد نسبت به طراحی با Table
2- افزایش سرعت لود سایت به دلیل کاهش حجم کد
البته مروگری مانند IE6 کد های جدول را در چند مرحله لود می کند و با نبود جدول این مشکل حل می شود.
۳- سئو بهتر به علت اینکه کد ها کمتر شده اند و نسبت بین کد ها و متون سایت کمتر شده است
۴- انتخاب ترتیب لود شدن قسمت های سایت با استفاده از سی اس اس، اینکار هم برای کاربران و هم ربوت های موتور جستجو سودمند هستند.
۵- در این روش، به جای HTML از سی اس اس برای شکل دهی و ظاهر سازی سایت استفاده می کنید. پس از مزیت های استفاده از سی اس اس نیز بهره مند می شود
) ( IE 8 ! ) ، اما سرعت این متد خیلی بالاست به طوریکه یه قالب خیلی شیک و گرافیکی با دایال آپ بالفرض 5 ثانیه طول میکشه لود شه ، همون قالب با table ممکنه مثلا 1 دقیقه ای وقتتو بگیره یا از اینجور صحبت ها . چندین سال پیش یه کتابی میخوندم به نام Speed up your web site این کتاب یاهو رو کامل بررسی میکرد که چجوریه اینقدر سرعت لودش بالاست و اینا ، چیزی که خیلی تاکید میکرد استفاده نکردن یا کم استفاده کردن از تیبل ها بود که میگقت واقعا موثره ، میتونم بگم خودشو تیکه تیکه کرد تا آخر کتاب سر همین یه قضیه !
