زيادة الإنتاجية في إستخدام الحاسوب
الهدف: إيجاد وسيلة لزيادة الإنتاجية أثناء إستخدامي لجهاز الحاسب بحيث أستطيع معرفة الوقت الذي أمضيه في عمل وظائف محددة كمشاهدة عرض تقديمي، إستخدام البريد الإلكتروني ومتابعة الشبكات الإجتماعية.
المطلوب: خدمة ويب مجانية تتيح لي تحقيق هذا الهدف دون تدخل مباشر مني وتوفر لي رسوم بيانية وإحصائيات واضحة عن الوقت الذي أمضيه وتعمل على جميع أنظمة التشغيل التي أستخدمها – ماك وويندوز – مع دعم للبروكسي بحكم أني أعمل معظم الوقت داخل الجامعة.
النتيجة: Rescue Time تطبيق ويب يوفر خدمة مجانية محدودة المميزات بحيث يقوم بجمع معلومات عن نشاطاتك على الحاسوب بتطبيق صغير جداً ويقوم بإرسالها للويب وتحليلها وإظهار النتائج لك بطريقة مناسبة حسب الأيام، الأسابيع، الشهور والسنة.
كمية الإحصائيات والتفاصيل مذهلة وتستطيع منها الحكم على وقتك الذي تمضيه وتستطيع أن تقرر مدى حاجتك لتغير بعض عاداتك الحاسوبية 
الطريقة المثلى لتحويل صفحات الويب
كنت أبحث اليوم عن طريقة مثالية لتحويل صفحات الويب فكما تلاحظون فإني أستخدم الرابط http://emad.daghreri.com لمدونتي وليس http://daghreri.com وكنت أستخدم فيما سبق كود HTML للتحويل لكن تفاجأت بأنها أسوأ طريقة لفعل ذلك.
<meta http-equiv="REFRESH" content="1;url=http://emad.daghreri.com">
حيث كنت أضع هذا الكود في الصفحة الرئيسية index.html وستقوم الصفحة بتحويل المستخدمين إلى الرابط المراد.
الطريقة التي تعرفت عليها تسمى “The 301 Redirect” وهي بكل بساطة آلية للتحويل من صفحة إلى أخرى. فلو إفترضنا بأنك قمت بتحويل الصفحة المسماة news.html إلى صفحة جديدة news.php وتريد آلية أمنة تضمن لك وصول المسنخدمين ومحركات البحث إلى الصفحة الجديدة فعليك باستخدام The 301 Redirect فهي تقوم بتحويل المستخدم من دون مشاكل وتقول لمحركات البحث “مرحباً، هذه الصفحة تم نقلها وهذا هو الرابط الجديد!” وكل أصحاب المواقع يرغبون بذلك بالطبع
فيما يلي الوسائل التي تستطيع استخدامها لـ The 301 Redirect:
باستخدام htaccess:
قم بإنشاء ملف جديد في المجلد الرئيسي “root” وقم بتسميته “.htaccess”
قم بتحرير الملف وضع فيه الكود التالي مع مراعاة عدم إضافة “http://www” في الجزء الأول ومع تكرار السطر لكل ملف ترغب بالتحويل منه للرابط الجديد.
Redirect 301 /anyfolder/page.html http://www.example.com/new.html
باستخدام ColdFusion:
بكل بساطة قم بإضافة الكود التالي للصفحة ColdFusion المراد التحويل منها:
<cfheader statuscode="301" statustext="Moved permanently"> <cfheader name="Location" value="http://www.new.com/page.cf">
باستخدام PHP:
قم بإضافة الكود للصفحة أو للسكريبت المراد التحويل منه:
<? header( "HTTP/1.1 301 Moved Permanently" ); header( "Status: 301 Moved Permanently" ); header( "Location: http://www.new.com/page.php" ); exit(0); ?>
باستخدام ASP:
قم بإضافة الكود للصفحة أو للسكريبت المراد التحويل منه:
<%@ Language=VBScript %> <% Response.Status="301 Moved Permanently" Response.AddHeader "Location", "http://www.new-url.com/" %>
باستخدام JSP/JAVA:
قم بإضافة الكود للصفحة أو للسكريبت المراد التحويل منه:
<% response.setStatus(301); response.setHeader( "Location", "http://www.new.com/" ); response.setHeader( "Connection", "close" ); %>
باستخدام CGI/PERL:
قم بإضافة الكود للسكريبت المراد التحويل منه:
1.
$q = new CGI;
print $q->redirect(" http://www.new.com/ ");
باستخدام Ruby/Ruby على Rails:
قم بإضافة الكود للسكريبت المراد التحويل منه:
head :moved_permanently, :location => "http://www.new.com/
هذه خلاصة نتيجة بحثي وأتمنى للجميع خاصة أصحاب المواقع الإستفادة القصوى وزيادة حب محركات البحث لهم
سيرة ذاتية من صفحة واحدة للويب بالعربية والإنجليزية
لقد انتهيت من عمل النسخة العربية للسيرة الذاتية والذي يعتمد على النسخة الإنجليزية من مدونة CSS-TRICKS وهذا رابط تحميل النسخة الإنجليزية وأخر للمعاينة.
بالنسبة للنسخة العربية فتستطيع معاينتها من هنا. وهذا هو رابط التحميل.
كل ما قمت به في النسخة العربية هو تعديل كود CSS وذلك بتغير اتجاه النصوص وتغير بعض القيم لكي تعرض المحتويات بالشكل المطلوب.
كود CSS للنسخة الإنجليزية.
* { margin: 0; padding: 0; }
body { font: 16px Helvetica, Sans-Serif; line-height: 24px; background: url(images/noise.jpg); }
.clear { clear: both; }
#page-wrap { width: 800px; margin: 40px auto 60px; }
#pic { float: right; margin: -30px 0 0 0; }
h1 { margin: 0 0 16px 0; padding: 0 0 16px 0; font-size: 42px; font-weight: bold; letter-spacing: -2px; border-bottom: 1px solid #999; }
h2 { font-size: 20px; margin: 0 0 6px 0; position: relative; }
h2 span { position: absolute; bottom: 0; right: 0; font-style: italic; font-family: Georgia, Serif; font-size: 16px; color: #999; font-weight: normal; }
p { margin: 0 0 16px 0; }
a { color: #999; text-decoration: none; border-bottom: 1px dotted #999; }
a:hover { border-bottom-style: solid; color: black; }
ul { margin: 0 0 32px 17px; }
#objective { width: 500px; float: left; }
#objective p { font-family: Georgia, Serif; font-style: italic; color: #666; }
dt { font-style: italic; font-weight: bold; font-size: 18px; text-align: right; padding: 0 26px 0 0; width: 150px; float: left; height: 100px; border-right: 1px solid #999; }
dd { width: 600px; float: right; }
dd.clear { float: none; margin: 0; height: 15px; }
كود CSS للنسخة العربية.
* { margin: 0; padding: 0; }
body { font: 16px Verdana, Helvetica, Arial, sans-serif; line-height: 24px; background: url(noise.jpg);text-align: right; direction: rtl; }
.clear { clear: both; }
#page-wrap { width: 800px; margin: 40px auto 60px; }
#pic { float: left; margin: -30px 0 0 0; }
h1 { margin: 0 0 16px 0; padding: 0 0 16px 0; font-size: 42px; font-weight: bold; border-bottom: 1px solid #999; }
h2 { font-size: 20px; margin: 0 0 6px 0; position: ; }
h2 span { position: relative; bottom: 0; right: 10px; font-style: italic; font-family: Georgia, Serif; font-size: 16px; color: #999; font-weight: normal; }
p { margin: 0 0 16px 0; }
a { color: #999; text-decoration: none; border-bottom: 1px dotted #999; }
a:hover { border-bottom-style: solid; color: black; }
ul { margin: 0 17px 32px 0; }
#objective { width: 500px; float: left; }
#objective p { font-family: Verdana, Helvetica, Arial, sans-serif; font-style: italic; color: #666; }
dt { font-style: italic; font-weight: bold; font-size: 18px; text-align: left; padding: 0 0 0 20px; width: 100px; float: right; height: 100px; border-left: 1px solid #999; }
dd { width: 600px; float: right; padding: 0 20px 0 0; }
dd.clear { float: none; margin: 0; height: 15px; }
كود HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ar-sa" lang="ar-sa">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>سيرة ذاتية من صفحة واحدة</title>
<style type="text/css">
* { margin: 0; padding: 0; }
body { font: 16px Verdana, Helvetica, Arial, sans-serif; line-height: 24px; background: url(noise.jpg);text-align: right; direction: rtl; }
.clear { clear: both; }
#page-wrap { width: 800px; margin: 40px auto 60px; }
#pic { float: left; margin: -30px 0 0 0; }
h1 { margin: 0 0 16px 0; padding: 0 0 16px 0; font-size: 42px; font-weight: bold; border-bottom: 1px solid #999; }
h2 { font-size: 20px; margin: 0 0 6px 0; position: ; }
h2 span { position: relative; bottom: 0; right: 10px; font-style: italic; font-family: Georgia, Serif; font-size: 16px; color: #999; font-weight: normal; }
p { margin: 0 0 16px 0; }
a { color: #999; text-decoration: none; border-bottom: 1px dotted #999; }
a:hover { border-bottom-style: solid; color: black; }
ul { margin: 0 17px 32px 0; }
#objective { width: 500px; float: left; }
#objective p { font-family: Verdana, Helvetica, Arial, sans-serif; font-style: italic; color: #666; }
dt { font-style: italic; font-weight: bold; font-size: 18px; text-align: left; padding: 0 0 0 20px; width: 100px; float: right; height: 100px; border-left: 1px solid #999; }
dd { width: 600px; float: right; padding: 0 20px 0 0; }
dd.clear { float: none; margin: 0; height: 15px; }
</style>
</head>
<body>
<div id="page-wrap">
<img src="cthulu.png" alt="Photo of Cthulu" id="pic" />
<div id="contact-info" class="vcard">
<!-- Microformats! -->
<h1 class="fn">اسمك هنا!</h1>
<p>
جوال: <span class="tel">0561234567</span><br />
البريد الإلكتروني: <a class="email" href="mailto:someone@somewhere.com">someone@somewhere.com</a>
</p>
</div>
<div id="objective">
<p>
هذا نموذج لسيرة ذاتية. تقوم هنا بكتابة بعض الجمل التي تعبر عنك! لم يخطر ببالي شئ
استطيع الكتابة عنه هنا لكن تستطيع الإجتهاد وكتابة ماتريد مع مراعاة أنك تقوم بكتابة سيرة ذاتية
وليست قصة حياتك! هذا نموذج لسيرة ذاتية. تقوم هنا بكتابة بعض الجمل التي تعبر عنك! لم يخطر ببالي شئ
استطيع الكتابة عنه هنا لكن تستطيع الإجتهاد وكتابة ماتريد مع مراعاة أنك تقوم بكتابة سيرة ذاتية
وليست قصة حياتك!
</p>
</div>
<div class="clear"></div>
<dl>
<dd class="clear"></dd>
<dt>التعليم</dt>
<dd>
<h2>جامعة الملك فهد للبترول والمعادن</h2>
<p><strong>التخصص:</strong> هندسة برمجيات<br />
<strong>المعدل:</strong> 4.0/4.0</p>
</dd>
<dd class="clear"></dd>
<dt>المهارات</dt>
<dd>
<h2>المهارات المكتبية</h2>
<p>مدير مكتب، منسق أحداث، منسق سفر، ترتيب وتصنيف الملفات</p>
<h2>برامج الحاسوب</h2>
<p>حزمة برامج مايكروسوفت المكتبية، حزمة برامج أبل المكتبية، مجموعة أدوبي للتصميم</p>
</dd>
<dd class="clear"></dd>
<dt>الخبرات</dt>
<dd>
<h2>الجامعة المحلية <span>مساعد إداري، السعودية من 2007 إلى 2009 </span></h2>
<ul>
<li>الوصف الأول للعمل الجيد الذي كنت فيه</li>
<li>الوصف الثاني للعمل الجيد الذي كنت فيه</li>
<li>الوصف الثالث للعمل الجيد الذي كنت فيه</li>
</ul>
<h2>الجامعة الخارجية <span>مدير مكتب، الإمارات من 2005 إلى 2007</span></h2>
<ul>
<li>الوصف الأول للعمل الجيد الذي كنت فيه</li>
<li>الوصف الثاني للعمل الجيد الذي كنت فيه</li>
<li>الوصف الثالث للعمل الجيد الذي كنت فيه</li>
</ul>
</dd>
<dd class="clear"></dd>
<dt>الهوايات</dt>
<dd>الغوص، القفز من الجسور، تسلق الجبال</dd>
<dd class="clear"></dd>
<dt>مراجع</dt>
<dd>منوفرة عند الطلب</dd>
<dd class="clear"></dd>
</dl>
<div class="clear"></div>
</div>
</body>
</html>
سيرة ذاتية من صفحة واحدة للويب
قام Chris Coyier الكاتب في مدونة CSS-TRICKS بعمل سيرة ذاتية رائعة على هيئة صفحة ويب. أعجبتني وأحببت مشاركتكم. سأقوم بعمل نسخة عربية غداً وسأضعها هنا بإذن الله. هذه رابط للمعاينة وآخر للتحميل.
خلاصات المدونة