انجمن‌های فارس وب

نسخه کامل: 100 ابزار مفيد براي طراحان وب و وبمسترها (بخش دوم)
شما در حال بازدید از بایگانی ارسال های انجمن هستید این نسخه کامل نیست : برای مشاهده نسخه کامل اینجا کلیک کنید
عنوان مقاله: 100 ابزار مفيد براي طراحان وب و وبمسترها
سطح مقاله: تخصصي - مقدماتي
منبع: [ جهت مشاهده لينك عضو شويد ! ]

توضيح : اين مبحث ادامه ي مقاله 100ابزار مفيد براي طراحان وب و وبمسترها مي باشد كه به علت كثرت حجم مطلب به 2 بخش تقسيم شده است . بخش اول اين مقاله از آدرس [ جهت مشاهده لينك عضو شويد ! ] قابل دسترسي مي باشد .


51- چت با بازديدكنندگان : با مراجعه به [ جهت مشاهده لينك عضو شويد ! ] مي توانيد ابزاري را دريافت كنيد كه با استفاده از آن با مشتريان يا بازديدكنندگان خود به صورت آنلاين در تماس باشيد .



52- جعبه رنگ : با مراجعه به آدرس [ جهت مشاهده لينك عضو شويد ! ] رنگ ها ، تركيب صحيح و كدهايشان هميشه در دسترس شما قرار دارند .



53- طراحي لوگو : در سايت [ جهت مشاهده لينك عضو شويد ! ] قادر خواهيد بود بدون دانش گرافيك و به سرعت و سادگي هرچه تمام تر لوگو و بنر هاي دلخواه خود را به صورت آنلاين بسازيد .



54- اشكال فانتزي : همانطور كه مي دانيد اشكال فانتزي (Badges) يكي از لزومات وب 2 تلقي مي شود . سايت [ جهت مشاهده لينك عضو شويد ! ] ابزاري را فراهم كرده كه با استفاده از آن مي توان اشكال با طرح ها و رنگ ها و فونت هاي متفاوتي توليد و استفاده كرد .



55- پشت زمينه ي متحرك : چنانچه به استفاده از عكس هاي پشت زمينه ي متحرك براي صفحات خود هستيد ، از سايت [ جهت مشاهده لينك عضو شويد ! ] غافل نشويد . اين سايت نمونه هاي زياد و جالبي را عرضه مي كند .



56- موقعيت بازديدكنندگان : با مراجعه و ثبت نام در سايت [ جهت مشاهده لينك عضو شويد ! ] مي توانيد از موقيت بازديدكنندگانتان در نقشه باخبر شويد ، لازم به ذكر است كه اين سايت شمارنده و دفتر ميهمان را نيز ارائه مي كند .



57- فونت رايگان : با مراجعه به سايت [ جهت مشاهده لينك عضو شويد ! ] مي توانيد از فونت هاي طبقه بندي شده از فانتزي گرفته تا فونت هاي شركت هاي معروف بهره مند شويد . تعداد فونت هاي اين سايت تاكنون بيش از 7000 مورد مي باشد.



58- تست طرح وب : همانطور كه مي دانيد ممكن است صفحات وبي را كه طراحي كرده ايد در سيستم عامل ها و مرورگرهاي مختلف به طور متفاوت و گاها" نا متعارف نشان داده شوند . سايت [ جهت مشاهده لينك عضو شويد ! ] ابزاري را براي شما فراهم آورده كه توسط آن مي توانيد طرح خود را در مرورگرها و سيستم هاي مختلف بررسي كنيد .



59- طراحي كلي قالب : در سايت [ جهت مشاهده لينك عضو شويد ! ] ابزاري وجود دارد كه كار طراحي قاب اوليه (Layout) را براي شما ساده مي كند . خروجي اين ابزار تگ div و CSS مي باشد .



60- تغيير سايز متن توسط كاربر : اگر مايل هستيد بازديدكنندگان بتوانند سايز متن ها را به سليقه ي خود بزرگ يا كوچگ كنند ، حتما" به سايت [ جهت مشاهده لينك عضو شويد ! ] سري بزنيد .


61- منوي كريستالي : با مراجعه به سايت [ جهت مشاهده لينك عضو شويد ! ] مي توانيد چگونگي ساخت منوهاي كريستالي حرفه اي با 2 رنگ و تنها با استفاده از CSS را فرا بگيريد .



62- محاسبه طول مشبك ها : چنانچه در طراحي وب سروكارتان با تگ هاي div كنار هم و داراي margin هاي مختلف مي باشد ، با ابزار واقع در آدرس [ جهت مشاهده لينك عضو شويد ! ] مي توانيد محاسبه ي كاملا" دقيقي را از طول اين مشبك ها داشته باشيد .



63- قالب متفاوت : چنانچه از قالب هاي تكراري خسته شده ايد و به دنبال قالب اوليه (layout) خاصي مي باشيد ، سايت [ جهت مشاهده لينك عضو شويد ! ] پيشنهاد خوبي برايتان دارد .



64- جعبه هاي فانتزي : چنانچه به دنبال جعبه هايي با گوشه هاي گرد و با حداقل كد نويسي هستيد ، حتما" به سايت [ جهت مشاهده لينك عضو شويد ! ] سري بزنيد .



65- CSS حرفه اي تر : با مراجعه به آدرس [ جهت مشاهده لينك عضو شويد ! ] خواهيد آموخت كه چطور با استفاده از شروط ، CSS را حرفه اي تر بنويسيد .



66- چك ليست استانداردها : اگر قصد استاندارد سازي وبسايت خود را داريد ، ابتدا چك ليست واقع در آدرس [ جهت مشاهده لينك عضو شويد ! ] را چك كنيد .



67- CSS در مرورگرها : با استفاده از ابزار سايت [ جهت مشاهده لينك عضو شويد ! ] قادر خواهيد بود كدهاي CSS خود را ويرايش كرده و نتيجه را به طور شبيه سازي شده در مرورگرهاي Internet Explorer و Firefox مشاهده كنيد.



68- مولد ليست : با استفاده از ابزار موجود در سايت [ جهت مشاهده لينك عضو شويد ! ] قادر خواهيد بود انواع ليست هاي دلخواه را به صورت آنلاين توليد كنيد .



69- Tab وسط : منو ها و تب هاي انعطاف پذير و به صورت تنظيم شده در مركز و بر مبناي CSS را با مراجعه به آدرس [ جهت مشاهده لينك عضو شويد ! ] بيابيد .



70- گالري عكس با CSS : چنانچه به دنبال ايجاد قالب گالري عكس و نحوه ي نمايش هاي مختلف آن هستيد ، حتما" سري به سايت [ جهت مشاهده لينك عضو شويد ! ] بزنيد .


71- لوگوي 3 بعدي : با استفاده از ابزار سايت [ جهت مشاهده لينك عضو شويد ! ] به صورت آنلاين مي توانيد لوگوهايي با متن هاي 3 بعدي در رنگ ها و سايزها و سبك هاي متفاوتي ايجاد كنيد .



72- ايجاد FavIcon : حتما" در كنار نوار آدرس مرورگرتان ديده ايد كه در بعضي از سايت ها آيكون خاصي را نمايش مي دهد . به كمك ابزار واقع در آدرس [ جهت مشاهده لينك عضو شويد ! ] قادر خواهيد بود با ارائه عكس هاي دلخواه و اخذ خروجي ، اين آيكون را براي سايت خود مورد استفاده قرار دهيد .



73- توليد htaccess. : همنطور كه php كارها مي دانند ، فايل htaccess. نقش مهمي در هدايت اعمال در Appache دارد . با استفاده از ابزار سايت [ جهت مشاهده لينك عضو شويد ! ] مي توانيد بدون نياز به داشتن علم htaccess. اين فايل را بر اساس نياز سرور خود توليد كنيد .



74- دكتر واتسون : چنانچه تمايل داريد از معروفيت سايت خود ، وضعيت لينك ها ، سرعت بارگزاري و ... مطلع شويد ، سايت [ جهت مشاهده لينك عضو شويد ! ] را فراموش نكنيد .



75- CSS پايه : چنانچه در مورد CSS اطلاعات زيادي نداريد و يا اينكه قصد داريد به سرعت فايل پايه CSS خود را بنويسيد ، ابزار سايت [ جهت مشاهده لينك عضو شويد ! ] حتما" مفيد خواهد بود .



76- تايپوگرافي : تايپو گرافي (فن چاپ) هنري است كه متني خاص را در اشكال ، رنگها ، طرح ها و اندازه هاي مختلف تركيب مي كند. با مراجعه به سايت [ جهت مشاهده لينك عضو شويد ! ] مي توانيد اين هنر را با متون دلخواه خود ايجاد و سپس استفاده نماييد .



77- تركيب رنگها : در طراحي وب ، تركيب و همخواني رنگها بسيار حائز اهميت مي باشد . با مراجعه به سايت [ جهت مشاهده لينك عضو شويد ! ] خواهيد توانست تركيبات و تناسبات رنگي استاندارد را فراهم و يا امتحان كنيد .



78- دكمه هاي 3 بعدي : با مراجعه به سايت [ جهت مشاهده لينك عضو شويد ! ] مي توانيد از هزارن سبك دكمه هاي 3 بعدي با سليقه و متن انتخابي خود بهره ي كافي را ببريد .



79- تكه تكه نمودن عكس ها : همانطور كه مي دانيد در يك صفحه ي وب عكس هاي بزرگ و پر حجم را تكه تكه كرده و تكه ها را جهت نمايش در يك جدول جمع مي كنند . اين امر به منظور بارگزاري بهينه ي عكس ها مي باشد . چنانچه قصد انجام چنين عملي داريد ، سايت [ جهت مشاهده لينك عضو شويد ! ] عكس مورد نظرتان را دريافت كرده و پس از تكه تكه كردن به همراه كد HTML به شما پس مي دهد .



80- مولد هاي آنلاين : همانطور كه در اين مقاله مشاهده نموديد ، برخي از سيستم هايي كه معرفي شد به صورت آنلاين امكان توليد آيتم خاصي را فراهم مي نمايند ؛ همانند دكمه ها ، كد ها ، ويرايش آنلاين و ... در آدرس [ جهت مشاهده لينك عضو شويد ! ] با 100 مولد آنلاين ديگر آشنا خواهيد شد .


81- طراحي قالب : در سايت [ جهت مشاهده لينك عضو شويد ! ] ابزاري جهت طراحي قالب به صورت آنلاين پيش بيني شده است ؛ بدين گونه كه پس از انتخاب شماي كلي قالب با چند كليك رنگ ها ، فونت ها و ... آن را براي هر جزء قالب (سرآيند ، منو ها ، بخش اصلي و ...) تعيين و پس از مشاهده ي پيش نمايش لحظه به لحظه خروجي آن را تحويل خواهيد گرفت . استفاده از اين ابزار را به كساني كه آشنايي كافي با ايجاد صفحات ساده ي وب ندارند ، توصيه مي كنم .



82- بهينه سازي سورس كدها : ابزار سايت [ جهت مشاهده لينك عضو شويد ! ] كدهاي شلوغ PHP ، JavaScript و CSS شما را گرفته و با توجه به درخواست شما آنها را با اضافه نمودن فاصله هاي استاندارد ، سمي كالن (;) ، حذف فاصله ها و خطوط اضافي و ... به صورت شسته و رفته پس مي دهد .



83- ويرايش عكس ها : گاهي پيش مي آيد به صورت روتين عكسي را ويرايش كنيم ، زماني كه به نرم افزارهايي همانند فتوشاپ دسترسي نداريم . با مراجعه به سايت [ جهت مشاهده لينك عضو شويد ! ] خواهيد توانست عكس هاي خود را به صورت آنلاين ويرايش و به همراه جلوه هاي ويژه بهينه سازيد .



84- تئوري رنگ ها : سايت [ جهت مشاهده لينك عضو شويد ! ] حاوي 3 ابزار جادوگر رنگ ، گردونه ي رنگ و تحليل كنتراست رنگها مي باشد . با استفاده از اين ابزارها خواهيد توانست صفحات وب خود را بر اساس روانشناسي رنگها ، تطابق رنگ هاي گرم و سرد و دامنه هاي رنگي متناسب طراحي و پياده سازي كنيد .



85- ساخت پيش نمايش : همانطور كه در اين مقاله مشاهده نموديد ، همه ي موارد داراي يك عكس پيش نمايش هستند كه برخي از آنها حاوي عكس صفحه ي يك وب سايت مي باشد . با مراجعه به سايت [ جهت مشاهده لينك عضو شويد ! ] مي توانيد با با وارد كردن آدرس يك صفحه وب و اخذ پيش نمايش به صورت عكس ، قسمتي از آن را انتخاب و با افزودن جلوه هايي مانند سايه ، گوشه گرد و ... در موارد لزوم استفاده نماييد .



86- ايجاد طيف رنگي : در ابزار واقع در سايت [ جهت مشاهده لينك عضو شويد ! ] خواهيد توانست طيف هاي رنگي دلخواه خود را با رنگ ها و سايزها و سبك هاي مختلف در 2 فرمت png و jpeg توليد و استفاده كنيد .



87- كاراكترهاي خاص : شايد در برخي از موارد نياز به استفاده اختصارات خاص در يك صفحه ي وب باشيد . در آدرس [ جهت مشاهده لينك عضو شويد ! ] مي توانيد به عنوان يك مرجع ، همه ي اين علائم را در دسترس داشته باشيد .



88- طراحي عكس پشت زمينه : در آدرس [ جهت مشاهده لينك عضو شويد ! ] ابزار مخصوصي جهت طراحي پشت زمينه صفحات وب تعبيه شده كه امكانات و انتخاب هاي خوبي را براي اين كار در اختيار طراحان مي گذارد .



89- ساخت فرم : توسط ابزار سايت [ جهت مشاهده لينك عضو شويد ! ] قادر خواهيد بود فرم هاي دلخواه خود را به سهولت توليد و استفاده كنيد .



90- دسته بندي درختي : با مراجعه به آدرس [ جهت مشاهده لينك عضو شويد ! ] خواهيد آموخت كه چگونه اينگونه دسته بندي را براي صفحات وب خود پياده كنيد .


91- تغيير خودكار قالب : چنانچه مايل هستيد طرح قالب سايتتان بر حسب روشنائي و ساعات شب و روز به صورت خودكار براي كاربران تغيير كند ، حتما" به آدرس [ جهت مشاهده لينك عضو شويد ! ] مراجعه كنيد .



92- رمزينه سازي HTML : شايد در برخي از موارد بخواهيد كد سورس HTML شما از ديد كاربران مخفي و به صورت رمز شده (Encode) باشد . در سايت [ جهت مشاهده لينك عضو شويد ! ] خواهيد توانست اين عمل را انجام دهيد . لازم به ذكر است كه خروجي اين ابزار به زبان Javascript مي باشد .



93- بررسي تگ هاي Meta : با مراجعه به سايت [ جهت مشاهده لينك عضو شويد ! ] خواهيد توانست اطلاعات مفيدي در مورد چگونگي آناليز وبسايت خود توسط روبات هاي جستجوگر ، چگونگي ارتقاع تگ هاي Meta (Meta Tags) و ... به دست آوريد.



94- تست امنيت سايت : با مراجعه به سايت و وارد نمودن IP وب سايت خود [ جهت مشاهده لينك عضو شويد ! ] خواهيد توانست امنيت سايت خود را از نظر پورت ها ، ديواره ي آتش و ... آزمايش كنيد .



95- رويت صفحات وب توسط روبات ها : با مراجعه به سايت [ جهت مشاهده لينك عضو شويد ! ] خواهيد توانست اطلاعات خوبي در مورد نحوه ي فهرست شدن سايت خود توسط موتورهاي جستجوگر به دست آوريد ؛ همچنين مي توانيد نحوه ي رويت صفحات سايت خود را توسط روبات هاي موتورهاي جستجوگر مشاهده نماييد .



96- مشاهده سورس سايت ها : شايد برايتان جالب باشد كه بدون مراجعه به وب سايتي از نحوه ي كد نويسي و تجزيه و تحليل آن بهرمند شويد . با مراجعه به سايت [ جهت مشاهده لينك عضو شويد ! ] خواهيد توانست با وارد كردن آدرس سايت ها به اين امر دست پيدا كنيد .



97- ايجاد قاب : چنانچه علاقمنديد جعبه ها و يا فضاي خاصي را همانند قاب واقعي تزئين كنيد ، پيشنهاد مي كنم سايت [ جهت مشاهده لينك عضو شويد ! ] را مشاهده نماييد .



98- بهينه سازي عكس ها : سايت [ جهت مشاهده لينك عضو شويد ! ] به كيفيت عكس هاي شما بهبود مي بخشد ؛ به نحوي كه بدون دانستن علم گرافيك و به سهولت فقط با وارد نمودن عكس مورد نظر خود ، مي توانيد از نسخه ي بهينه شده ي آن استفاده نماييد .



99- نام رنگ ها : همانطور كه مي دانيد رنگهاي استفاده شده در طراحي وب به غير از كد ، از نامي هم برخوردارند كه مي توان به جاي كد از آن نيز استفاده نمود . در آدرس [ جهت مشاهده لينك عضو شويد ! ] نام تمامي كدهاي رنگي را در اختيار خواهيد داشت.



100- شماره صد : اين مورد با ديگر موارد كمي فرق دارد ! اين سايت در حال حاضر ابزار خاصي را ارائه نداده و به زبان انگليسي نمي باشد . اين سايت و انجمن هايش كه عنوان "انجمن وبمستر هاي فارسي زبان" و نشان سيب كه همان سنبل سلامت است را به دوش مي كشد ، اميد دارد در راه سلامت وب و پيشرفت طراحان وب فارسي زبان قدمي بزرگ بردارد . اين سايت همان فارس وب خودمان بوده و از آدرس [ جهت مشاهده لينك عضو شويد ! ] و انجمن هايش از آدرس [ جهت مشاهده لينك عضو شويد ! ] قابل دسترس همگان مي باشد !



اميدوارم از خواندن اين مقاله طولاني خسته نشده باشيد !


این مقاله آموزشی برای اولین بار در فارس وب و به زبان شيرين فارسي نوشته شده است . لطفا" با کپی های بدون منبع مطالب ، زحمات نویسنده ی آن مطلب را خدشه دار نکنید .
مرجع آدرس ها