درباره قالب جدید وبلاگ «یک پزشک»

37

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

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

از ایشان خواستم از لحاظ فنی توضیحات بیشتری در مورد قالب جدید بدهند:

همانطور که می‌دانید، اینترنت با سرعت بالاتر از 128 کیلوبیت در ثانیه برای کاربران خانگی در دسترس نیست و تعداد کاربرانی که به همین سرعت 128 کیلوبیت در ثانیه نیز دسترسی دارند، محدود است. بخش اعظم کاربران وب در ایران از سرعت 56 کیلوبایت در ثانیه استفاده می‌کنند که آن نیز همیشه با کیفیت نبوده و میانگین سرعت دسترسی به اینترنت برای کاربران dial up حدود 45 کیلوبیت در ثانیه است. با توجه به این موضوع یکی از مواردی که در طراحی سایت حتما باید در نظر گرفته شود، محدودیت سرعت کاربران است. سایت هر قدر سریع تر بارگذاری شود،‌کاربران رضایت بیشتری از سایت خواهند داشت.

برای قالب یک پزشک دو هدف مد نظر قرار گرفت:
– حرکت به سمت مجله شدن
– پایین نگاه داشتن حجم صفحات به خاطر محدودیت سرعت اینترنت

برای حرکت به سوی قالب مجله باید مواردی در نظر گرفته می شد. در طراحی مدرن و امروزی سعی می شود تا تمامی عناصر گرافیکی که کمکی به کاربران نمی کنند، حذف گردد. تا کنون از خود پرسیده اید که چرا سایت هایی مانند facebook, friendfeed, delicious یا digg طرح هایی به شدت ساده دارند و صفحات گرافیکی در آنها استفاده نشده است؟

زمانی که بخواهید رضایت کاربران را در سایت در اولیت قرار دهید باید هر عنصری از صفحه را که کمکی به کاربر نمی کند،‌ از داخل صفحه حذف کنید. از این طریق می‌توانید به کاربر کمک کنید که با اعتماد به نفس بیشتری به دنبال بخش های مورد نظر خود در سایت بگردد. در بخشی از سایت که کاربر را مجبور به فکر کردن کند باید مورد بازبینی قرار گیرد. محیط سایت باید کاملاً گویا باشد. این اولین قانونی usability است که در کتاب Don’t Make Me Think آورده شده است. حتی برای سادگی بیشتر، دکمه های مربوط به ثبت پست در سایت‌هایی مانند دلیشز و تویتر را با جاوا اسکریپت مخفی شد و تنها در زمانی که نشانگر ماوس را بر روی پست قرار دهید، این بخش نمایان می شود.

برای دست یابی به محیطی کاملاً ساده و موثر سعی شد که تمامی عناصر گرافیکی زاید از صفحه حذف شود و از این عناصر فقط زمانی استفاده شود که هدف، جلب توجه کاربر باشد. برای رنگ پس زمینه نیز رنگ سفید انتخاب شد که به علت کنتراست بالا با رنگ مشکی ( پیش زمینه) بهترین شرایط را برای خواندن متن فراهم می کند.

به این خاطر که تصمیم گرفته شده بود که ظاهر جدید سایت شبیه به مجله باشد، بنابر این تعداد زیادی تصویر به شکل thumbnail در طرح قرار می گرفت. قطعاً این تصاویر حجم صفحه را بالا می برد و به دنبال راهکاری بودیم تا این مشکل را برطرف کنیم. برای این منظور دو متد استفاده شد
– کم کردن تعداد http request ها با استفاده از CSS sprite ها
– استفاده از تکنیک lazy loading برای تصاویر داخل صفحه

برای کاهش تعداد درخواست‌ها از سرور تمامی پلاگین‌های جی کوئری را در یک فایل قرار دادیم و تعداد فایل‌های جاوا اسکریپت و سی اس اس را به حداقل ممکن کاهش دادیم در حال حاضر نزدیک به 50 آیکون و تصویر در خود طرح استفاده شده است که به ازای هر کدام از این تصاویر در بارگذاری صفحه،‌ یک http request به سرور ارسال خواهد شد. هر کدام از این درخواست‌ها، کسری از ثانیه زمان نیاز دارد و برای 50 تصویر،‌ این زمان محسوس است. برای حل این مشکل ما 50 تصویر را 8 تصویر گنجاندیم و با استفاده از CSS این تصاویر را در پس زمینه عناصر قرار دادیم. به این شکل،‌42 درخواست کمتر به server ارسال خواهد شد و سایت با سرعت بیشتری بارگذاری می شود. در بین این تصاویر، سه تصویر وجود دارد که داخل sprite قرار ندارد و حجمی کمتر از 2 کیلوبایت دارند، در گام بعدی تصمیم داریم که این تصاویر را کد کرده و در داخل خود فایل CSS قرار دهیم. به این طریق می توانیم 3 درخواست دیگر صرفه جویی داشته باشیم. بعد از آن نیز تصمیم بر این است که نخست صفحات سایت را نیز gzip کنیم و برای تصاویر داخل صفحه expire header در نظر بگیریم که در مراجعات بعدی کاربر به سایت برای هر تصویر conditional get request ارسال نشود و از این طریق نیز، سرعت را به حداکثر ممکن برسانیم.

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

با استفاده از این دو تکنیک در حال حاضر برای بارگذاری اولیه سایت تنها 45 درخواست به سرور ارسال می شود ( با احتساب تمام تصاویر thumbnail موجود در صفحه و بدون در نظر گرفتن request‌ های مربوط به google friend connect ).

در این تصویر مشخص شده است که برای بارگذاری اولیه صفحه در حالتی که cache مرورگر خالی باشد تنها 45 درخواست به سرور ارسال می شود و حجم صفحه نیز 360 کیلوبایت است (این تست با سرعت 30 کیلوبیت در ثانیه گرفته شده است). بخش‌هایی که با رنگ قرمز مشخص شده اند، تصویر دیگر صفحه‌اند که با استفاده از تکنیک lazy load بارگذاریشان به تاخیر افتاده و زمانی که کاربر صفحه را scroll کند این تصاویر load خواهند شد. در صورتی که متون داخل صفحه نیز gzip شوند حجم صفحه اول زیر 300 کیلوبایت شده و بر روی سیستمی با سرعت 45 کیلوبیت در ثانیه در عرض 54 ثانیه load خواهد شد. البته در نظر داشته باشید که این حجم برای بازدید اول بوده و در این حالت cache مرورگر خالی است. در بازدیدهای بعدی در صورتی که تصویری به صفحه اضافه نشده باشد تعداد درخواست‌ها به 4 درخواست کاهش می یابد و حجم صفحه به 70 کیلوبایت می‌رسد که با سرعت 45 کیلوبایت در کمتر از 10 ثانیه load خواهد شد.

برای جلوه‌های استفاده شده در سایت از jQuery استفاده شده است. حجم این کتابخانه در حالت فشرده نشده حدود 70 کیلوبایت است ولی اگر این فایل gzip شود حجم آن به 23 کیلوبایت خواهد رسید. فشرده‌سازی این فایل بر روی وردپرس ممکن است ولی به جای اینکار از فایل جی کوئری که بر روی سرورهای گوگل قرار دارد، استفاده شده. اینکار چند مزیت دارد.
– چون این فایل بر روی سرور های CDN گوگل قرار دارد،‌ فایل از نزدیک‌ترین مکان به محل استقرار کاربر برای او ارسال می‌شود و همچنین پایداری سرورهای گوگل همیشه بالاست.
– اگر کاربر از سایت دیگری بازدید کرده باشد که آن سایت نیز از جی کوئری بر روی سرور گوگل استفاده کرده باشد، این فایل در cache مرورگر وجود خواهد داشت و به این شکل سایت با سرعت بالاتری load می شود.
– گوگل این فایل را به شکل فشرده برای کاربر ارسال می کند.

در سال اخیر به خاطر ارائه مرورگرهای جدید، استفاده از فونت‌های مختلف بر روی وب امکان پذیر شده است. البته پشتیبانی از این قابلیت در حال حاضر کامل نیست و برخی از مرورگرها از این قابلیت پشتیبانی نمی کنند ولی در حال حاضر با توجه به آمار سایت یک پزشک بیش از 70 درصد کاربران قادر به دیدن فونت پیوست شده به صفحه هستند.
قابلیت font-face در CSS3 در نظر گرفته شده است که با استفاده از آن می توانید فونت مورد نظر خود را به صفحه پیوست کنید. در صورتی که فونت مورد نظر بر روی سیستم کاربر موجود نباشد، این فونت از سرور دانلود شده و متن مورد نظر با فونت مورد نظر شما برای کاربر نمایش داده خواهد شد. این قابلیت در تمامی مرورگرهای جدید پشتیبانی می شود و مرورگر های IE نیز از این قابلیت از نسخه 4 پشتیبانی می کنند ولی فرمت فونتی که برای IE استفاده می شود یک فرمت خاص است که برای نمایش صحیح فونت در IE مجبور خواهید بود که فرمت فونت خود را از ttf به eot تغییر دهید. البته به خاطر برخی مشکلات در فونت‌ها فارسی در صورتی که متن شما حاوی کلمات انگلیسی باشد، حروف انگلیسی در اینترنت اکسپلورر 6 به شکل مربع نمایش داده می‌شود که به همین خاطر مجبور شدیم که فونت های مربوط به تیتر مطالب را در IE6 با همان فونت arial نمایش دهیم ولی بقیه مرورگرهای مدرن، تیتر صفحات را با استفاده از فونت کودک نشان می‌دهند. به نظر می‌رسد که سایت یک پزشک اولین سایت فارسی باشد که از این تکنیک استفاده کرده و حتی در مرورگر های IE نیز فونت ها به درستی نمایش داده می شود.

به جز مواردی که ذکر شد، اقدامات دیگری نیز برای بهبود طرح انجام شده که بیشتر به افزایش usability طرح کمک کرده است همانند استفاده مناسب از فضای سفید برای تفکیک اجزای داخل صفحه و یا استفاده از مقیاس em برای متن صفحه که اجازه افزایش یا کاهش سایز متن را به کاربران مرورگر های IE نیز می‌دهد. بخش navigation سایت نیز به شکل drop down menu ایجاد شده و این بخش نیز کاملا با CSS ایجاد شده تا مشکلی برای موتورهای جستجو در index کردن صفحات به وجود نیاید از طرفی این بخش تا 3 مرحله زیر شاخه را پشتیبانی می کند (در حال حاضر تنها یک مرحله زیر شاخه استفاده شده است). بخش کد کردن قالب برای وردپرس 3 نیز با دقت زیادی انجام شده است و تا جایی که ممکن بود از به کارگیری پلاگین ها پرهیز شده است تا از این طریق فشار کمتری به سرور وارد شود.

آمار نشان می‌دهد که در آینده نزدیک در کشورهای توسعه یافته، وب گردی از روی موبایل از وب گردی از طریق کامپیوتر ای رومیزی پیشی خواهد گرفت. در حال حاضر در ایران نیز از زمان رقابت های جام جهانی، هر دو اپراتور فعال در کشور (همراه اول و ایرانسل) سرویس های GPRS نامحدود و با قیمت تقریبا مناسب ارائه کرده‌اند. امید است که وب گردی از روی موبایل نیز در ایران گسترش یابد. برای این منظور نیست قصد داریم نسخه موبایل سایت را به شکلی اصولی در آینده‌ای نزدیک آماده کنیم تا کاربران با سهولت بیشتری بتوانند از اطلاعات سایت بر روی ابزارهای دیجیتال خود استفاده کنند.


اگر خواننده جدید سایت «یک پزشک»  هستید!
شما در حال خواندن سایت یک پزشک (یک پزشک دات کام) به نشانی اینترنتی www.1pezeshk.com هستید. سایتی با 18 سال سابقه که برخلاف اسمش سرشار از مطالب متنوع است!
ما را رها نکنید. بسیار ممنون می‌شویم اگر:
- سایت یک پزشک رو در مرورگر خود بوک‌مارک کنید.
-مشترک فید یا RSS یک پزشک شوید.
- شبکه‌های اجتماعی ما را دنبال کنید: صفحه تلگرام - صفحه اینستاگرام ما
- برای سفارش تبلیغات ایمیل alirezamajidi در جی میل یا تلگرام تماس بگیرید.
و دیگر مطالب ما را بخوانید. مثلا:

عکس‌های نوستالژیک: آدم‌های و تلویزیون‌هایشان در دوره اوج تلویزیون

دوره اوج شکوه تلویزیون کی بود؟ دست‌کم دوره اوج مونواوگ چه زمانی بود؟یک زمانی تلویزیون پیشرفته‌ترین وسیله ارتباطی ما با دنیای خارج بود. الان تلویزیون‌های هوشمند، گوشی و تبلت‌ها و لپ‌تاپ‌ها جای آن به اصطلاخ متکلم وحده را گرفته‌اند.…

عکس‌های قدیمی از کلاس‌های تایپ دهه 1950 تا 1970 – زمانی که تایپ یک مهارت پایه بود و چه بسا با…

در تاریخ آموزش آمریکا، در یک برهه دبیرستان‌های آمریکا برای آموزش یک مهارت ضروری برای ورود به دنیای مدرن تجهیز شدند: تایپ کردن. ظهور کلاس‌های تایپ در دبیرستان‌های ایالات متحده، فصلی جذاب در تاریخی آموزش بود.شروع  آموزش تایپ را می‌توان در…

خرابی چون‌ که از حد بگذرد آباد می‌گردد! – گالری عکس‌های قبل و بعد این مکان‌های زشت یا مخروبه

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

آخرین «نمونه» مقاوم – هر یک از اینها، آخرین چیزهای سالم به جا مانده در طول تاریخ هستند

از برخی جنبه‌های تاریخی چیزهای قالب توجهی به جا مانده، مثلا هزاران سکه از یک دوره تاریخ یا ده‌ها زره یا شمشیر یا کتاب‌های پوستی فراوان. اما برخی چیزها هم آنقدر نادر از بلایایی طبیعی و فساد و آتش‌سوزی‌های در امان مانده‌اند که تبدیل به آخرین…

عکس‌های تاریخی که با دیدن آنها درمی‌مانیم که آنها واقعا در گذشته گرفته شده‌اند یا در یک آینده بهتر و…

گذشته بهتر بود یا آینده. این یک سوال باستانی است. معمولا ما تصور می‌کنیم که ترجیح دادن گذشته، تنها یک حس نوستالژیک خام است. چیزی که بن‌مایه فیلم نیمه‌شب در پاریس هم بود.اما گاهی ما پیش خودمان فکر می‌کنیم که این ترجیح و دوست داشتن، شاید…

داستان تکامل اتاق خواب‌ها از دوران انسان‌های اولیه تا اتاق‌ خواب‌های هوشمند + گالری عکس

تکامل اتاق خواب‌ها تحت تأثیر عوامل مختلفی از جمله تغییرات فرهنگی، فناوری و اجتماعی قرار گرفته است. با گذشت زمان، اتاق خواب‌ها از فضا‌های خواب ساده به پناهگاه‌ها و آسایشگاه‌های چند منظوره و شخصی تبدیل شده‌اند.مروزی کوتاه بر تکامل آنها:…
آگهی متنی در همه صفحات
دکتر فارمو / شیشه اتومبیل / نرم افزار حسابداری / خرید سیلوسایبین / هوش مصنوعی / قیمت وازلین ساج / مقاله بازار / شیشه اتومبیل / قیمت ایمپلنت دندان با بیمه /سپتیک تانک /بهترین دکتر لیپوماتیک در تهران /بهترین جراح بینی در تهران / آموزش تزریق ژل و بوتاکس / دوره های زیبایی برای مامایی / آموزش مزوتراپی، PRP و PRF /کاشت مو / مجتمع فنی تهران /قیمت روکش دندان /خدمات پرداخت ارزی نوین پرداخت / درمان طب / لیست قیمت تجهیزات پزشکی / دانلود آهنگ / سریال ایرانی کول دانلود / دانلود فیلم دوبله فارسی /داروخانه اینترنتی آرتان /اشتراك دايت /فروشگاه لوازم بهداشتی /داروخانه تینا /لیفت صورت در تهران /فروش‌ دوربین مداربسته هایک ویژن /سرور مجازی ایران /مرکز خدمات پزشکی و پرستاری در منزل درمان نو /توانی نو / ثبت برند /حمل بار دریایی از چین /سایت نوید /پزشک زنان سعادت آباد /کلاه کاسکت / لمینت متحرک دندان /فروشگاه اینترنتی زنبیل /ساعت تبلیغاتی /تجهیزات پزشکی /چاپ لیوان /خرید از آمازون /بهترین سریال های ایرانی /کاشت مو /قیمت ساک پارچه ای /تولید محتوا /دانلود نرم افزار /
37 نظرات
  1. نریمان می گوید

    ممنون استفاده کردیم ، خسته نباشید .

  2. zirpoosh می گوید

    سلام
    خیلی خوبه که از وبلاگ نویسیت کسب در آمد میکنی دکتر جان
    تولد وبت هم مبارک
    راستی پیشنهادم اینه که پستی درباره شرکت های خارجی ارائه دهنده هاست نشرکنی
    این روزا حتی هاست گیتور هم گیر میده به کشورمون و مشکل واقعا حادی داره میشه
    با ارزوی موفقیت:)

    1. علیرضا مجیدی می گوید

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

  3. الهام - روح پرتابل می گوید

    بله کاملاً معلومه ایشون این کاره هستند!
    بسیار لذت بردم از این پست. یک لذت خاص.

  4. مانی می گوید

    اول از همه تبریک می‌گم بابت قالب جدید.

    به نظرم خیلی حرفه‌ای و تمیز کار شده. نحوه چینش مطالب هم خیلی مناسبه. یه کار درجه یک که امیدوارم الگوی خوبی برای بقیه قرار بگیره.

  5. behnam می گوید

    خیلی خوبه مبارک باشه.
    فقط اون لوگوی بالای صفحه چندان خوش منظر نیست. از نظر من البته!

  6. مسعود می گوید

    خیلی جالبه ! من حدود یک ماهی بود که به وبلاگ سر نزده بودم و مطالب رو فقط از طریق گودر دنبال می کردم ! با دیدن این پست توی گودر ، مجبور شدم بیام و قالب جدید رو ببینم !
    خیلی قشنگ و جذاب شده ! موفق باشید

  7. مسعود می گوید

    در مورد فونت ها هم بگم که من اولین سایتی که دیدم از قابلیت Font-face استفاده کنه وبلاگ رضا معلمی (کاوشگر) بود و منم توی وبلاگ خودم از این قابلیت استفاده کرده بودم ! (پس اولین نبودید)

    1. امیرعباس می گوید

      مسعود جان قابلیت font-face خیلی وقته که در مرورگر های جدید پشتیبانی میشه. منظور این بود که ما فونت ها با فرمت هایی به صفحه اضافه کردیم که در مرورگر های IE هم به درستی نمایش داده بشه. ظاهرا در قالب سایت شما و آقای معلمی دیگه از قابلیت پیوست فونت به صفحه استفاده نمیشه (شاید به علت تغییر قالب) ولی من هم با قاطعیت نگفتم که این طرح اولین طرحی هست که از این تکنیک استفاده کرده. به عنوان مثال سایت آقای پورعبادی http://pourebadi.ir/?p=191 این تکنیک رو استفاده کرده که اتفاقاً داخل IE هم کار می کنه منتها ما برای پیوست فونت از متد smile پاول آریش استفاده کردیم http://paulirish.com/2009/bulletproof-font-face-implementation-syntax/ ظاهرا مرورگر IE فونت های ttf رو با اینکه نمی تونه نمایش بده ولی دانلود می کنه. به این شکل مرورگر های IE هر دو فرمت فونت رو دانلود می کنن که خوب با توجه به سایز فونت که 60 کیلوبایت هست این مقدار قابل توجه میشه. اگر از متد smile استفاده بشه دیگه مرورگر IE فونت ttf رو دانلود نمی کنه 😉

  8. حسن می گوید

    ممنون و خسته نباشین

  9. خواب بزرگ می گوید

    البته ما چون از فید استفاده می‌کنیم متوجه نشده بودیم تا الان:)
    قالبتان خوش‌خوان و کاربردی است اما لوگوی تازه بد خوانده می‌شود. مثلن خوانده می‌شود پشک یا پوشاک. تا حضرات رقصنده‌ای نیافته‌اند در لوگو دست به کار شوید!

  10. رضا می گوید

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

    1. علیرضا مجیدی می گوید

      لوگوی وبلاگ را راستش به یک شرکت دیگه سفارش دادم و کار طراح نیست. قسمت پذیرش آگهی خودمونی‌تر می‌شه ولی خوب لازمه برای جبران هزینه‌ها!

  11. موسوی می گوید

    خانه‎ی نو پر نور!

  12. misssdandelion می گوید

    خیلی ممنون از توضیحات

  13. saeed می گوید

    مشکلی که خیلی توی دید است٬ پیدا کردن آخرین مطالبتان است (اگر از فید استفاده نکنیم). البته در یک نظر دیگر گفته اید که باکس ۱۰ پست آخر درست خواهد شد.(به امید درست شدنش)

    من زبان های برنامه نویسی بلد نیستم و در مورد طراحی هم چیزی نمی دانم. اما در جایی خوانده بودم زیر خط برای کلمات فارسی مناسب نیست.(شاید اشتباه بوده ولی خب….)

    1. امیرعباس می گوید

      سعید جان اون بخش آخرین مطالب به زودی به جای بخش دوستان گوگلی در زیر صفحه اضافه میشه.
      در مورد زیر خط برای لینک ها :
      از دید usability توصیه میشه که حتماً برای لینک ها زیر خط قرار بدید چون هم تشخیص متن از لینک راحت تر میشه و هم اینکه اگر کسی مشکل ضعف دید و کوررنگی داشته باشه می تونه لینک رو از متن عادی تشخیص بده. البته از اونجایی که زبان فارسی بر خلاف انگلیسی میان خط نوشته میشه و اغلب ، قسمتی از حروف فارسی زیر خط متن قرار میگیرند، معمولا زیر خط ها مزاحمت ایجاد می کنه و این زیر خط اغلب مماس متن قرار میگیره و حتی روی نقطه ها رو هم می پوشونه. ما برای حل مشکل از قابلیت text-decoration در CSS استفاده نکردیم و به جایش از padding و border-bottom استفاده کردیم. در این حالت دیگه زیر خط به متن نمی چسبه و باعث ناخوانایی متن نمیشه. الان زیر خط های لینک ها در این سایت رو با سایت های دیگه مقایسه کنید متوجه منظورم میشید 😉

  14. ع.ل.ي.ر.ض.ا می گوید

    دکتر جان سلام. در مورد فونتهات من از طریق فایرفاکس و آی ای فونت تیترها رو کودک می بینم ولی از آخرین ورژن کروم که استفاده میکنم فونت تیترها رو آریال می بینم . در حالیکه انتظار داشتم کروم همه چیز رو طبیعی نشون بده

    1. علیرضا مجیدی می گوید

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

  15. عرفان می گوید

    لینکدونی گودری حذف شد؟

    1. علیرضا مجیدی می گوید

      بله! متأسفانه این لینکدونی بیش از حد صفحه را سنگین می‌کرد.

  16. احمد - وبلاگ رسانه می گوید

    سلام
    یک توضیح در مورد “به نظر می‌رسد که سایت یک پزشک اولین سایت فارسی باشد که از این تکنیک استفاده کرده و حتی در مرورگر های IE نیز فونت ها به درستی نمایش داده می شود.” صرفن جهت اطلاع می‌خواستم بدم:

    من قبلن یعنی حدود یکی دو ماه پیش این قابلیت رو توی چند سایت فارسی دیدم. یکی از اونها که الان خاطرم هست سایت فارسی‌تل هست که داره روی فارسی‌سازی اندروید کار میکنه.
    http://farsitel.com

    1. امیرعباس می گوید

      دوست عزیز در کامنت های قبلی توضیح دادم
      قابلیت font-face مدت هاست که توسط مرورگر های جدید پشتیبانی میشه منتها به کار گیری صحیح این شیوه که استفاده از اون رو توی مرورگر های IE هم امکان پذیر می کنه خیلی کم در وب فارسی استفاده شده. شیوه پیاده سازی صحیحش که باعث میشه مرورگر های IE فونت های اضافی دانلود نکنند رو تنها روی همین سایت می بینید و در جای دیگه استفاده نشده (البته به طور قطع نمی تونم بگم چون همه سایت های فارسی رو چک نکردم)

  17. میخ طویله می گوید

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

  18. zv می گوید

    محشر بود
    سلام
    خیلی این توضیحاتی که می دید به آدم می چسبه
    بازم از این کارها بکنید

  19. سهند می گوید

    خیلی بهتر شد دکتر…خسته نباشی
    یه سایت قوی شایسته یه قالب وزین بود

  20. احمد می گوید

    قالب خیلی زیباست تقربا تو بین سایت های ایرانی تکه

  21. احمد می گوید

    سلام و خسته نبشید گرم به شما
    آقای دکتر خیلی خوب می شد اگر قالب قبلیتون را برای دانلود عموم می گذاشتید

  22. یک مهندس می گوید

    بسیار عالی و دقیق و حرفه ای و منظم و با کیفیت و خواننده مدار و با کلاس و جذاب و آرام و دوستانه.

  23. یک مهندس می گوید

    اما باز هم توی لوگوی سایتتون “1 پزشک” چیزی از پزشکی دیده نمی شه، هنوز فکر می کنم جای اون گوشی پزشکی خالیه.

  24. آرش زاد می گوید

    تبریک می گم، هم به شما و هم به امیر عباس برای این طرح به روز…

  25. دانیال کشانی می گوید

    دکتر جان. من به عنوان طراح وب واقعا کار رو تحسین می کنم و کار خوبی از آب در اومده.
    اما این گزاره که یک پزشک اولین سایتی ه که از
    @font-face
    استفاده می کنه باید بگم که مدتها قبل در رادیو http://radiokoocheh.com/
    برای تیترها از میترا استفاده کرده ام و شاید پیش از این هم کسی این کار را کرده باشد.
    اما بی تردید کار شما و صفحه شما برای منی که lazyload ، Jquery
    و… دغدغه های هر روزه ام هستند کاری درجه یک است و کمی هم حسودیم می شود وقتی می بینم کس دیگری هم غیر از من برایش تمامی اینها مهمند!!
    در هر صورت هر چند دیر اما مبارک باشد.

  26. دانیال کشانی می گوید

    در این حال بگذارید پزش را هم بدهم که همین حالا
    YSlow (V2
    به رادیو کوچه گرید بی می دهد و
    به صفحه اول یک پزشک گرید سی!!
    اما در هر صورت کار عالی درست کرده اید.

    1. امیرعباس می گوید

      دانیال عزیز من تو کامنت های قبلی برای دو عزیز دیگر هم توضیح دادم. قابلیت پیوست فونت از نسخه 3.5 به فایرفاکس اضافه شده و الان ماه هاست که این قابلیت در دسترسه. ما فقط این فونت ها رو طوری در صفحه به کار گرفتیم که:
      1- برای کاربران IE هم قابل استفاده باشه و اونها هم صفحه رو با فونت مورد نظر ببینن
      2- IE به خاطر یه مشکل هر دو نسخه فونت رو دانلود می کنه ولی ما با یه هک کاری کردیم که فقط فونت مخصوص به خودش رو دانلود کنه

      در مورد رتبه سایت در Yslow یه نکته باید بگم اینه که هنوز اپتیمایز کردن طرح برای داشتن پرفرمنس بالا هنوز کامل نشده. با حذف ETAG ها و اضافه کردن expire header ها ، جی زیپ کردن صفحه و حذف فضاهای خالی بین تگ های اچ تی ام ال و دستورات CSS به احتمال خیلی زیاد حجم صفحه حداقل 70 کیلوبایت کمتر میشه و رتبه سایت در yslow اگر به A نرسه ولی قطعا به B میرسه 😉

  27. هومن می گوید

    فونت تیتر مطالب در Google Chrome 6.0.472.51 همان arial‌ و در IE9، کودک است!

    1. Tiko می گوید

      دقیقاً همینطوره! هک کاری نمیخواد که! من خودم otf استفاده کردم همه جا هم درست نمایش میده. در ضمن فونت های زیبایی رو انتخاب نکردید. همون arial چه جورایی بهتر هم هست.

  28. احمد احمدی می گوید

    سلام
    اینکه فرمودید کاربران دایل-آپ از سرعت 45 کیلوبیت به معنای حدودا 6کیلوبات است ولی اگه واقعا حقیقت رو بخوایم این سرعت 16 کیلوبیت یعنی 2 کیلوبایت در ثانیه است!!!!
    با توجه به قطعی های طولانی اینترنت ( وصل بودن به اینترنت و خاموش بودن چراغ های شبکه ) و Time-out شدن صفحات سایت ها , و هزینه های کلان اون , و … در ساعات کارت های اینترنت ( شاتل,کرج نت,امیدان,… کارتی به اسم 30 ساعته میفروشند ولی 12 ساعت اینترنت دارد , البته با جایزه قطعی های اون که عرض کردم!) در اصل در ایران اینترنتی وجود نداره!!!!
    حالا مزیت الکترونیکی شدن کارها در ایران چیه ؟؟؟ الله اعلم …
    ——–
    پست هم خیلی عالی بود – مطالب کاربردی و خوبی داشت .
    تشکر ….

ارسال یک پاسخ

آدرس ایمیل شما منتشر نخواهد شد.

••4 5