Pages

Thursday, November 11, 2010

Step 1: HTML

Web Development এর জন্য HTML হল Basic. তাই একজন ওয়েব ডেভলপারকে অবশ্যই HTML সম্পর্ক্যে বিস্তারিত Knowledge থাকা প্রয়োজন। ওয়েব ডেভলপমেন্টে প্রাথমিক তাদের জন্য আমার ক্ষুদ্র প্রচেষ্টা। আশা করি উপকৃত হবেন। নিম্নে HTML সম্পর্কে আলোচনা করা হলো...

HTML= Hyper Text Markup Language
মূলত Browser Software সমূহ Server Language(PHP, ASP) ইত্যাদি বুঝেনা।তাই Browser কে কাঙ্খিত operation বুঝাবার জন্য HTML এর Tag ব্যবহার করা হয় এবং Browser HTML Tag কে User এর ভাষায় রূপান্তর করে।
এবার আসা যাক Tag কি?
Tag কে আমরা Command ও বলতে পারি. যেমন:
tag এর মাধ্যমে সাইটের title প্রদর্শন করা হয়। <br /> <br />Tag কি ভাবে লেখা হয় এবং এর syntax কি? <br />প্রতিটি tag <> মাধ্যমে শুরু হবে এবঙ </h> এর মাধ্যমে শেষ হবে। <br />Syntax: <br /><tag_name> </tag_name> <br />Example: <br />title প্রদর্শনের জন্য নিম্নের tag ব্যবহার করা হয় <br /><title>Bangladesh <br />এখানে Bangladesh লেখাটি টাইটেল হিসেবে দেখা যাবে। <br /> <br /> <span style="color: rgb(0, 102, 0);">চলবে...</span> <div style='clear: both;'></div> </div> <div class='post-footer'> <div class='post-footer-line post-footer-line-1'><span class='post-author vcard'> Posted by <span class='fn'>Mehedi Hasan Nahid</span> </span> <span class='post-timestamp'> at <a class='timestamp-link' href='https://phpload.blogspot.com/2010/11/step-1-html.html' rel='bookmark' title='permanent link'><abbr class='published' title='2010-11-11T12:31:00-08:00'>12:31 PM</abbr></a> </span> <span class='post-comment-link'> </span> <span class='post-icons'> <span class='item-action'> <a href='https://www.blogger.com/email-post/3486605525712937806/2640693600634862610' title='Email Post'> <img alt='' class='icon-action' height='13' src='http://img1.blogblog.com/img/icon18_email.gif' width='18'/> </a> </span> <span class='item-control blog-admin pid-1617890573'> <a href='https://www.blogger.com/post-edit.g?blogID=3486605525712937806&postID=2640693600634862610&from=pencil' title='Edit Post'> <img alt='' class='icon-action' height='18' src='https://resources.blogblog.com/img/icon18_edit_allbkg.gif' width='18'/> </a> </span> </span> </div> <div class='post-footer-line post-footer-line-2'><span class='post-labels'> </span> </div> <div class='post-footer-line post-footer-line-3'></div> </div> </div> <div class='comments' id='comments'> <a name='comments'></a> <h4> 0 comments: </h4> <div class='pid-1617890573' id='Blog1_comments-block-wrapper'> <dl class='avatar-comment-indent' id='comments-block'> </dl> </div> <p class='comment-footer'> <div class='comment-form'> <a name='comment-form'></a> <h4 id='comment-post-message'>Post a Comment</h4> <p> </p> <a href='https://www.blogger.com/comment/frame/3486605525712937806?po=2640693600634862610&hl=en&saa=85391&origin=https://phpload.blogspot.com' id='comment-editor-src'></a> <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'></iframe> <!--Can't find substitution for tag [post.friendConnectJs]--> <script src='https://www.blogger.com/static/v1/jsbin/2830521187-comment_from_post_iframe.js' type='text/javascript'></script> <script type='text/javascript'> BLOG_CMT_createIframe('https://www.blogger.com/rpc_relay.html', '0'); </script> </div> </p> <div id='backlinks-container'> <div id='Blog1_backlinks-container'> </div> </div> </div> </div> </div></div> <!--Can't find substitution for tag [adEnd]--> </div> <div class='blog-pager' id='blog-pager'> <span id='blog-pager-older-link'> <a class='blog-pager-older-link' href='https://phpload.blogspot.com/2010/11/web-development-with-php.html' id='Blog1_blog-pager-older-link' title='Older Post'>Older Post</a> </span> <a class='home-link' href='https://phpload.blogspot.com/'>Home</a> </div> <div class='clear'></div> <div class='post-feeds'> <div class='feed-links'> Subscribe to: <a class='feed-link' href='https://phpload.blogspot.com/feeds/2640693600634862610/comments/default' target='_blank' type='application/atom+xml'>Post Comments (Atom)</a> </div> </div> </div></div> </div> <div id='sidebar-wrapper'> <div class='sidebar section' id='sidebar'><div class='widget BlogSearch' data-version='1' id='BlogSearch1'> <h2 class='title'>Search This Blog</h2> <div class='widget-content'> <div id='BlogSearch1_form'> <form action='https://phpload.blogspot.com/search' class='gsc-search-box' target='_top'> <table cellpadding='0' cellspacing='0' class='gsc-search-box'> <tbody> <tr> <td class='gsc-input'> <input autocomplete='off' class='gsc-input' name='q' size='10' title='search' type='text' value=''/> </td> <td class='gsc-search-button'> <input class='gsc-search-button' title='search' type='submit' value='Search'/> </td> </tr> </tbody> </table> </form> </div> </div> <div class='clear'></div> </div><div class='widget Attribution' data-version='1' id='Attribution1'> <div class='widget-content' style='text-align: center;'> virtuous arts corp. Powered by <a href='https://www.blogger.com' target='_blank'>Blogger</a>. </div> <div class='clear'></div> </div></div> <div id='2columns'> <div class='col-left'> <div class='sidebar section' id='sidebar2'><div class='widget BlogList' data-version='1' id='BlogList1'> <h2 class='title'>My Blog List</h2> <div class='widget-content'> <div class='blog-list-container' id='BlogList1_container'> <ul id='BlogList1_blogs'> </ul> <div class='clear'></div> </div> </div> </div><div class='widget Label' data-version='1' id='Label1'> <h2>Labels</h2> <div class='widget-content list-label-widget-content'> <ul> <li> <a dir='ltr' href='https://phpload.blogspot.com/search/label/html'>html</a> <span dir='ltr'>(1)</span> </li> <li> <a dir='ltr' href='https://phpload.blogspot.com/search/label/internet'>internet</a> <span dir='ltr'>(1)</span> </li> <li> <a dir='ltr' href='https://phpload.blogspot.com/search/label/php'>php</a> <span dir='ltr'>(1)</span> </li> <li> <a dir='ltr' href='https://phpload.blogspot.com/search/label/site'>site</a> <span dir='ltr'>(1)</span> </li> <li> <a dir='ltr' href='https://phpload.blogspot.com/search/label/web'>web</a> <span dir='ltr'>(1)</span> </li> </ul> <div class='clear'></div> </div> </div></div> </div> <div class='col-right'> <div class='sidebar section' id='sidebar3'><div class='widget BlogArchive' data-version='1' id='BlogArchive1'> <h2>Blog Archive</h2> <div class='widget-content'> <div id='ArchiveList'> <div id='BlogArchive1_ArchiveList'> <ul class='hierarchy'> <li class='archivedate expanded'> <a class='toggle' href='javascript:void(0)'> <span class='zippy toggle-open'> ▼  </span> </a> <a class='post-count-link' href='https://phpload.blogspot.com/2010/'> 2010 </a> <span class='post-count' dir='ltr'>(2)</span> <ul class='hierarchy'> <li class='archivedate expanded'> <a class='toggle' href='javascript:void(0)'> <span class='zippy toggle-open'> ▼  </span> </a> <a class='post-count-link' href='https://phpload.blogspot.com/2010/11/'> November </a> <span class='post-count' dir='ltr'>(2)</span> <ul class='posts'> <li><a href='https://phpload.blogspot.com/2010/11/step-1-html.html'>Step 1: HTML</a></li> <li><a href='https://phpload.blogspot.com/2010/11/web-development-with-php.html'>Web Development with PHP</a></li> </ul> </li> </ul> </li> </ul> </div> </div> <div class='clear'></div> </div> </div></div> </div></div> </div> <!-- spacer for skins that want sidebar and main to be the same height--> <div class='clear'> </div> </div> <!-- end content-wrapper --> <div id='footer'> <div class='fleft'> <!-- Remmeber!!! This free Blogger template is licensed under the Creative Commons Attribution 3.0 License. You are required to keep the footer links intact which provides due credit to its Author and Supporters. If you have plan to remove any link, its better for you, not to use the template. [DMCA / Blogger] --> (c) Copyright virtuous arts corp </div> </div> </div></div> <!-- end outer-wrapper --> <script type="text/javascript" src="https://www.blogger.com/static/v1/widgets/654365252-widgets.js"></script> <script type='text/javascript'> window['__wavt'] = 'AAVkm1vqlw8NbyQ9HxIGb665mBQZ:1778701030575';_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x3d3486605525712937806','//phpload.blogspot.com/2010/11/step-1-html.html','3486605525712937806'); _WidgetManager._SetDataContext([{'name': 'blog', 'data': {'blogId': '3486605525712937806', 'title': 'PHP Guru', 'url': 'https://phpload.blogspot.com/2010/11/step-1-html.html', 'canonicalUrl': 'http://phpload.blogspot.com/2010/11/step-1-html.html', 'homepageUrl': 'https://phpload.blogspot.com/', 'searchUrl': 'https://phpload.blogspot.com/search', 'canonicalHomepageUrl': 'http://phpload.blogspot.com/', 'blogspotFaviconUrl': 'https://phpload.blogspot.com/favicon.ico', 'bloggerUrl': 'https://www.blogger.com', 'hasCustomDomain': false, 'httpsEnabled': true, 'enabledCommentProfileImages': true, 'gPlusViewType': 'FILTERED_POSTMOD', 'adultContent': false, 'analyticsAccountNumber': '', 'encoding': 'UTF-8', 'locale': 'en', 'localeUnderscoreDelimited': 'en', 'languageDirection': 'ltr', 'isPrivate': false, 'isMobile': false, 'isMobileRequest': false, 'mobileClass': '', 'isPrivateBlog': false, 'isDynamicViewsAvailable': true, 'feedLinks': '\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22PHP Guru - Atom\x22 href\x3d\x22https://phpload.blogspot.com/feeds/posts/default\x22 /\x3e\n\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/rss+xml\x22 title\x3d\x22PHP Guru - RSS\x22 href\x3d\x22https://phpload.blogspot.com/feeds/posts/default?alt\x3drss\x22 /\x3e\n\x3clink rel\x3d\x22service.post\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22PHP Guru - Atom\x22 href\x3d\x22https://www.blogger.com/feeds/3486605525712937806/posts/default\x22 /\x3e\n\n\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22PHP Guru - Atom\x22 href\x3d\x22https://phpload.blogspot.com/feeds/2640693600634862610/comments/default\x22 /\x3e\n', 'meTag': '', 'adsenseHostId': 'ca-host-pub-1556223355139109', 'adsenseHasAds': false, 'adsenseAutoAds': false, 'boqCommentIframeForm': true, 'loginRedirectParam': '', 'isGoogleEverywhereLinkTooltipEnabled': true, 'view': '', 'dynamicViewsCommentsSrc': '//www.blogblog.com/dynamicviews/4224c15c4e7c9321/js/comments.js', 'dynamicViewsScriptSrc': '//www.blogblog.com/dynamicviews/33b0932eec32fe14', 'plusOneApiSrc': 'https://apis.google.com/js/platform.js', 'disableGComments': true, 'interstitialAccepted': false, 'sharing': {'platforms': [{'name': 'Get link', 'key': 'link', 'shareMessage': 'Get link', 'target': ''}, {'name': 'Facebook', 'key': 'facebook', 'shareMessage': 'Share to Facebook', 'target': 'facebook'}, {'name': 'BlogThis!', 'key': 'blogThis', 'shareMessage': 'BlogThis!', 'target': 'blog'}, {'name': 'X', 'key': 'twitter', 'shareMessage': 'Share to X', 'target': 'twitter'}, {'name': 'Pinterest', 'key': 'pinterest', 'shareMessage': 'Share to Pinterest', 'target': 'pinterest'}, {'name': 'Email', 'key': 'email', 'shareMessage': 'Email', 'target': 'email'}], 'disableGooglePlus': true, 'googlePlusShareButtonWidth': 0, 'googlePlusBootstrap': '\x3cscript type\x3d\x22text/javascript\x22\x3ewindow.___gcfg \x3d {\x27lang\x27: \x27en\x27};\x3c/script\x3e'}, 'hasCustomJumpLinkMessage': false, 'jumpLinkMessage': 'Read more', 'pageType': 'item', 'postId': '2640693600634862610', 'pageName': 'Step 1: HTML', 'pageTitle': 'PHP Guru: Step 1: HTML'}}, {'name': 'features', 'data': {}}, {'name': 'messages', 'data': {'edit': 'Edit', 'linkCopiedToClipboard': 'Link copied to clipboard!', 'ok': 'Ok', 'postLink': 'Post Link'}}, {'name': 'template', 'data': {'name': 'custom', 'localizedName': 'Custom', 'isResponsive': false, 'isAlternateRendering': false, 'isCustom': true}}, {'name': 'view', 'data': {'classic': {'name': 'classic', 'url': '?view\x3dclassic'}, 'flipcard': {'name': 'flipcard', 'url': '?view\x3dflipcard'}, 'magazine': {'name': 'magazine', 'url': '?view\x3dmagazine'}, 'mosaic': {'name': 'mosaic', 'url': '?view\x3dmosaic'}, 'sidebar': {'name': 'sidebar', 'url': '?view\x3dsidebar'}, 'snapshot': {'name': 'snapshot', 'url': '?view\x3dsnapshot'}, 'timeslide': {'name': 'timeslide', 'url': '?view\x3dtimeslide'}, 'isMobile': false, 'title': 'Step 1: HTML', 'description': 'Web Development \u098f\u09b0 \u099c\u09a8\u09cd\u09af HTML \u09b9\u09b2 Basic. \u09a4\u09be\u0987 \u098f\u0995\u099c\u09a8 \u0993\u09df\u09c7\u09ac \u09a1\u09c7\u09ad\u09b2\u09aa\u09be\u09b0\u0995\u09c7 \u0985\u09ac\u09b6\u09cd\u09af\u0987 HTML \u09b8\u09ae\u09cd\u09aa\u09b0\u09cd\u0995\u09cd\u09af\u09c7 \u09ac\u09bf\u09b8\u09cd\u09a4\u09be\u09b0\u09bf\u09a4 Knowledge \u09a5\u09be\u0995\u09be \u09aa\u09cd\u09b0\u09df\u09cb\u099c\u09a8\u0964 \u0993\u09df\u09c7\u09ac \u09a1\u09c7\u09ad\u09b2\u09aa\u09ae\u09c7\u09a8\u09cd\u099f\u09c7 \u09aa\u09cd...', 'url': 'https://phpload.blogspot.com/2010/11/step-1-html.html', 'type': 'item', 'isSingleItem': true, 'isMultipleItems': false, 'isError': false, 'isPage': false, 'isPost': true, 'isHomepage': false, 'isArchive': false, 'isLabelSearch': false, 'postId': 2640693600634862610}}]); _WidgetManager._RegisterWidget('_NavbarView', new _WidgetInfo('Navbar1', 'navbar', document.getElementById('Navbar1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_PageListView', new _WidgetInfo('PageList1', 'crosscol', document.getElementById('PageList1'), {'title': 'Pages', 'links': [{'isCurrentPage': false, 'href': 'https://phpload.blogspot.com/', 'title': 'Home'}], 'mobile': false, 'showPlaceholder': true, 'hasCurrentPage': false}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HeaderView', new _WidgetInfo('Header1', 'header', document.getElementById('Header1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_BlogView', new _WidgetInfo('Blog1', 'main', document.getElementById('Blog1'), {'cmtInteractionsEnabled': false, 'lightboxEnabled': true, 'lightboxModuleUrl': 'https://www.blogger.com/static/v1/jsbin/1053750561-lbx.js', 'lightboxCssUrl': 'https://www.blogger.com/static/v1/v-css/828616780-lightbox_bundle.css'}, 'displayModeFull')); _WidgetManager._RegisterWidget('_BlogSearchView', new _WidgetInfo('BlogSearch1', 'sidebar', document.getElementById('BlogSearch1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_AttributionView', new _WidgetInfo('Attribution1', 'sidebar', document.getElementById('Attribution1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_BlogListView', new _WidgetInfo('BlogList1', 'sidebar2', document.getElementById('BlogList1'), {'numItemsToShow': 0, 'totalItems': 0}, 'displayModeFull')); _WidgetManager._RegisterWidget('_LabelView', new _WidgetInfo('Label1', 'sidebar2', document.getElementById('Label1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_BlogArchiveView', new _WidgetInfo('BlogArchive1', 'sidebar3', document.getElementById('BlogArchive1'), {'languageDirection': 'ltr', 'loadingMessage': 'Loading\x26hellip;'}, 'displayModeFull')); </script> </body> </html>