طراحی صفحه اول سایت با html از فرصت هایی است که شما را با ما آشنا کرده است ، بله شما از این طریق با ما آشنا شدید تا برای داشتن یک سفر درآمد زا در اینترنت آماده شوید. شاید تابحال این اتفاق برای شما افتاده باشه که رقیبتان در این اوضاع اقتصادی تلفن کاری اش زنگ خور به شدت زیادی دارد و شما در ذهنتان به این فکر فرو بروید که چرا کسب و کار شما که دقیقا هم صنف با او است چنین وضعیتی ندارد. ما برای شما این معما را حل خواهیم کرد شما با داشتن یک وب سایت حرفه ای و سئو کردن آن میتوانید در سطح اینترنت به قدری معروف شوید که پس از آن هر کاربری که نام فیلد شغلی شما یا کلماتی که معرف شغل شما هستند را در اینترنت و علی الخصوص در سایت گوگل جستجو کرد وب سایت شما جزو نمایش های برتر سایت گوگل قرار بگیرد و مشتری برای گرفتن خدمات و یا خرید محصول با کلیک بر روی سایت تان با شما ارتباط بگیرد.
شرکت سیماگر یک شرکت معتبر و باسابقه موفق در این زمینه است و با یک تماس و مشاوره آگاهانه شما را به حضور در اینترنت ترغیب خواهد کرد.
مدیر ارشد فن‌آوری اطلاعات و بنیان‌گذار شرکت فیوتک، با تجاربی در زمینه مدیریت، برنامه نویسی سمت سرور و امنیت سایبری در این مقاله سعی داریم تا یک آشنایی اولیه با برنامه نویسی صفحات وب، HTML پیدا کنیم و یک صفحه وب ساده بسازیم این مقاله در واقع ادامه مبحث یک وبسایت چگونه کار می‌کند است.
قبلا با ساز و کار کلی برنامه‌نویسی وب آشنا شدیم و حالا باید یک نگاه دقیق‌تر به مرحله اول برنامه نویسی وب، یعنی همان HTML داشته باشیم.
(توجه داشته باشید هدف این مقاله صرفا یک آشنایی اولیه است نه آموزش کامل HTML) زبان HTML یک زبان نشانه گذاری (markup language) است که برای ساختن صفحات وب ایجاد شده است.
اساسا زبان‌های نشانه گذاری نازل‌ترین زبان‌های برنامه‌نویسی هستند و بسیار ساده و ابتدایی عمل میکنند.
برای همین یادگیری آن‌ها عموما نیاز به ۵ دقیقه زمان برای فهم ساختار آن و یک دیکشنری برای ترجمه آن دارد! بگذارید یک مثال از خودم بزنم.
من از دوران مدرسه با دروسی مثل تاریخ و جغرافی و اجتماعی و … مشکل داشتم.
چون هیچ منطق خاصی نداشت، فقط نیاز به حفظ کردن داشت و من همیشه فکر می‌کردم هر موقع نیاز به این دانش‌ها داشتم فقط کافی بود به مرجع آن مراجعه می‌کردم.
اما در عین حال ریاضی و هندسه و … را دوست داشتم چون حس می‌کردم دارم با یک منطق زیبا آشنا می‌شوم با کلی معمای هیجان انگیز که با حل آن‌ها حس پیشرفت داشتم! اگر مثل من فکر می‌کنید کلا این بخش از برنامه‌نویسی برای شما کمی سخت خواهد بود چون در واقع HTML از نظر من همان تاریخ و جغرافی دنیای وب است! خیلی دور شدیم از بحث! گفتیم markup language ها خیلی ساده‌اند! یعنی فقط باید با یک نشانه بگوییم چه چیزی می‌خواهیم بگوییم.
مثال زیر را ببینید: ما یک چیزی را به زبان نشانه‌گذاری نوشتیم! وقتی کلی از این چیز‌ها کنار هم قرار بگیرند می‌شوند یک برنامه به زبان نشانه گذاری.
در کد بالا من گفتم یک قسمتی دارم به نام WellCome که محتوایی دارد شامل «سلام خواننده گرامی سایت! خوش‌آمدی به سایت من!».
با علامت <> به سیستم می‌فهمانم که این یک تگ است.
همچنین همانطور که یک تگ باز می‌شود باید بسته هم بشود.
با <WellCome> در مثال فوق تگ آغاز و با </WellCome> این تگ بسته شد.
تنها فرق بین باز و بسته شدن تگ صرفا اضافه شدن بک اسلش “/” به ابتدای تگ پایانی است.
طبیعتا وقتی می‌خواهیم این نشانه‌گذاری‌ها برای مرورگر‌ها (browser) قابل ترجمه باشند به آن ظاهری که مد نظر ماست، باید از تگ‌های استاندارد و از پیش تعیین شده استفاده کنیم.
مثلا در تگ WellCome یک تگ استاندارد نیست و من از خودم خلق کردم.
چند تگ استاندارد را با هم مرور کنیم: در ابتدای هر سند HTML یا همان فایل‌هایی با پسوند .
html باید از تگ <!DOCTYPE html> استفاده کنم.
در واقع با این تگ من دارم اعلام می‌کنم سند من از آخرین نسخه HTML که همان HTML5 هست استفاده می‌کند.
برخی از تگ‌ها نیازی به بسته شدن ندارند.
مثل همین تگ که فقط باز شد.
بعد از آن تگ <html> را باز کردیم و در انتها بستیم.
کل تگ‌های ما باید در بین این تگ قرار بگیرد و به نوعی می‌توان گفت همه تگ‌ها بچه‌ها و نوادگان <html> تگ هستند.
تگ <html> به دو قسمت head و body تقسیم می‌شود.
پس با تگ های <body> و <head> این دو قسمت را ایجاد می‌کنیم.
در تگ <head> عموما تنظیمات سند HTML وارد می‌شود.
مانند عنوان صفحه، نوع کاراکترها، کلمات کلیدی و … اما در تگ <body> تمام آنچه می‌خواهیم در صفحه نمایش داده شود را وارد می‌کنیم.
مثلا در اینجا ما در قسمت head گفتم نوع کاراکترها از جنس UTF-8 است.
این نوع کاراکتر تمام کاراکترها را شامل می‌شود.
چون ما از زبان فارسی استفاده می‌کنیم حتما باید این تنظیم رو انجام دهیم در غیر این صورت در مشاهده خروجی کار به مشکل می‌خوریم.
این اتفاق با افزودن تگ افتاد.
این تگ هم مثل تگ <!DOCTYPE html> نیازی به بسته شدن ندارد.
(پیشنهاد می‌کنم یک‌بار نوع کاراکترها را تعیین نکنید و خروجی کار را مشاهده کنید.
)گفتیم در قسمت body هر آنچه می‌خواهیم نمایش بدهیم را وارد می‌کنیم.
من از تگ <h1> برای ایجاد یک تیتر استفاده کردم و داخل آن تیتر دلخواهم را قرار دادم.
بعد از آن از تگ <p> برای ساخت یک پاراگراف استفاده کردم و متن دلخواهم را در آن قرار دادم.
خوب حالا می‌خواهیم یک فایل HTML ایجاد کنیم و از آن استفاده کنیم.
کافی است یک فایل متنی (فایلی با پسوند .
txt) ایجاد و تگ‌ها را داخل آن قرار دهیم.
در انتها فرمت فایل که .
txt بود را به .
html تغییر دهیم.
من در اینجا اسم فایل را index.
html ثبت کردم.
به همین راحتی شما اولین صفحه وب خودتون رو ایجاد کردید! دیدیم که ساخت اولین صفحه وب به آسانی پشت سر گذاشته شد! حالا وقت آن رسیده که محتوایی را که با HTML در صفحه قرار دادیم بوسیله CSS زیباتر به نمایش بگذاریم.
در مقاله بعدی قصد داریم در خصوص CSS اطلاعاتی کسب کنیم.
وبلاگ شخصی علیرضا ریاحی مدیر ارشد فن‌آوری اطلاعات و بنیان‌گذار شرکت فیوتک، با تجاربی در زمینه مدیریت، برنامه نویسی سمت سرور و امنیت سایبری وبلاگ شخصی علیرضا ریاحی با ثبت نام در سیماگر به آرشیو بزرگی از مقالات مرتبط با این موضوع دسترسی خواهید داشت مطلبی دیگر از این انتشارات مطلبی دیگر از این انتشارات افزایش بازدید بر اساس علاقه‌مندی‌های شما
شرکت سیماگر یک شرکت معتبر نرم افزاری در زمینه تولید نرم افزار، طراحی سایت ، سئو سایت ، نرم افزار های حرفه ای تحت وب توزیع شده، برندینگ و تبلیغات ، بازاریابی از جمله دیجیتال مارکتینگ میباشد که نشان از توان عملیاتی این شرکت در ارائه خدمات میباشد. ما در تلاش هستیم تا با توجه به وضعیت اقتصادی و معیشتی که امروزه مردم کشور عزیزمان ایران با آن دست و پنجه نرم میکنند با ارائه کار با کیفیت و قیمت مناسب باعث رضایت مندی مشتریان عزیزمان شویم و به عنوان مسئولیت اجتماعی خودمان سهمی در رونق کسب و کار های کشورمان داشته باشیم.
جهت مشاوره و استعلام قیمت میتوانید از طریق شماره تلفن های زیر به صورت مستقیم با ما در ارتباط باشید
