Web Technology Web Design Web Programming PHP Wordpress
web design Category
เป็นที่ทราบกันดีว่าถ้าคุณนำข้อมูลใส่เข้าไปบนอินเทอร์เน็ตนั่นก็หมายความว่าคุณยอมรับ
ที่จะเผยแพร่ข้อมูลนั้นต่อสาธารณ เพียงแค่ใช้ ชื่อหรืออีเมล ของบุคคลที่คุณต้องการสืบค้น
เสิร์ชด้วยกูเกิลคุณก็จะพบกับข้อมูลมากมาย
วิธีที่จะช่วยให้เว็บไซท์ หรือ บางเพจของเว็บไม่ให้ถูกค้นเจอด้วย search engine
1.ใส่ robots meta tag ในเพจที่ไม่ต้องการให้ search engine เก็บข้อมูลไปทำ index
<META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW">
addthis_url = ‘http%3A%2F%2Fcallmebird.com%2Fweblog%2Fprevent-robots-googlebot’;
addthis_title = ‘%E0%B8%9B%E0%B9%89%E0%B8%AD%E0%B8%87%E0%B8%81%E0%B8%B1%E0%B8%99+robots+%E0%B8%A1%E0%B8%B2%E0%B9%80%E0%B8%81%E0%B9%87%E0%B8%9A%E0%B8%82%E0%B9%89%E0%B8%AD%E0%B8%A1%E0%B8%B9%E0%B8%A5′;
addthis_pub = ‘callmebird’;
การสร้าง element เพื่อบรรจุข้อความในเว็บบ่อยครั้งที่เรา
ไม่สามารถคาดการณ์ได้ล่วงหน้าว่าข้อความจะมีความยาวเท่าไหร่
ถ้าหากใช้ height กำหนดความสูงให้กับ element ก็จะเกิดปัญหา
เมื่อข้อความใน element นั้นยาวเกินกว่าที่ element นั้นจะบรรจุไว้ได้
ส่งผลกระทบต่อ element อื่น ๆ ในหน้าเว็บ เพราะความสูงยังคงเท่าเดิม
ไม่ได้ขยายไปพร้อม ๆ กับตัวอักษรที่ล้นออกไป ทำให้เกิดปัญหา
ข้อความซ้อนทับกัน
addthis_url = ‘http%3A%2F%2Fcallmebird.com%2Fweblog%2Fcss-min-height-cross-browser’;
addthis_title = ‘CSS+min-height+%E0%B9%81%E0%B8%9A%E0%B8%9A+cross-browser’;
addthis_pub = ‘callmebird’;
- 4 Comments
- Tags: css, webdesign
Using an image as a link
By: Bird on: Jul 21,2008 In: web design<a href="http://www.pageresource.com">
<img src="xxx.jpg" border="0" alt="" />
</a>
ที่มา : http://www.pageresource.com/html/image3.htm
addthis_url = ‘http%3A%2F%2Fcallmebird.com%2Fweblog%2Fusing-image-as-link’;
addthis_title = ‘Using+an+image+as+a+link’;
addthis_pub = ‘callmebird’;
- 0 Comments
- Tags: image, Link
Lorem Ipsum คือไรหว่า
By: Bird on: Jul 16,2008 In: web designเคยสงสัยหรือป่าว เวลาตัด template เว็บ มันจะมีข้อความตัวอย่างมาแบบนี้
“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla [...]
- 5 Comments
- Tags: ipsum, lorem, webdesign
ทำ div ให้เป็น link
By: Bird on: Jul 15,2008 In: web designตัวอย่างคำสั่งที่ทำให้ <div> สามารถกลายเป็น link ได้ อีกทั้งเมื่อเอาเมาส์ไปโอเวอร์ก็ให้ cursor เป็นรูปมือ มีดังนี้
<div style="cursor: pointer; cursor: hand;" onclick="window.location = ‘/process/enterprise/training/change_index.shtml’;">
BlahBlah</div>
เพียงแค่นี้ ไม่ว่าจะเป็น div หรือ อะไรก็ตามก็สามารถเป็น link ได้หมด
addthis_url = ‘http%3A%2F%2Fcallmebird.com%2Fweblog%2Fdiv-to-link-with-hand’;
addthis_title = ‘%E0%B8%97%E0%B8%B3+div+%E0%B9%83%E0%B8%AB%E0%B9%89%E0%B9%80%E0%B8%9B%E0%B9%87%E0%B8%99+link’;
addthis_pub = ‘callmebird’;
- 3 Comments
- Tags: css, div, hand, Link
CSS Frameworks
By: Bird on: Jun 26,2008 In: web designframework คือ
ชุดเครื่องมือ ไลบรารี่ แนวทางในการเขียนแอปพริเคชั่น ช่วยลดการเขียนโคดที่ต้องเขียนบ่อย ๆ ให้อยู่ในรูปแบบที่พร้อมในการใช้งานได้ พูดง่าย ๆ คือ โคดที่ต้องมีในทุก ๆ โปรเจ็คหรือโคดพื้นฐานทั่วไป เราไม่ต้องเสียเวลาเขียนขึ้นใหม่ หน้าที่ของเราคือเขียนโคดที่จะทำให้แอปพลิเคชั่นบรรลุวัตถุประสงค์
CSS framework คือ
ชุดของไฟล์ css ที่ได้จัดเตรียมการจัดรูปแบบพื้นฐาน รูปแบบฟอร์ม grid เลย์เอาท์ ไว้ให้ใช้ โดยเราไม่จำเป็นต้องเขียนโคดซ้ำ ๆ เช่น เรามีงานออกแบบเว็บไซท์ 10 โปรเจ็ค ทุกโปรเจ็คจะต้องมีบางสิ่งที่คล้ายกัน ไอ้สิ่งที่คล้ายกันนี้เราก็ไม่จำเป็นต้องเขียนซ้ำแล้วซ้ำอีก
addthis_url = ‘http%3A%2F%2Fcallmebird.com%2Fweblog%2Fcss-frameworks’;
addthis_title = ‘CSS+Frameworks’;
addthis_pub = ‘callmebird’;
- 3 Comments
- Tags: css, framework
สร้าง Tableless Layout ด้วย div และ stylesheet
By: Bird on: Jun 6,2008 In: web designการออกแบบเว็บในยุคก่อน(ปัจจุบันก็ยังใช้กันอยู่)จะใช้ <table> ในการวางเลเอาท์ ดังตัวอย่างต่อไปนี้
<html>
<head>
<title> my website </title>
<meta name="keywords" content="joe bloggs’ website, site, pages,">
<meta name="author" content="joe bloggs">
<link href="stylesheet.css" rel="stylesheet" type="text/css">
</head>
<body>
<table id="main">
<tr><td>
<img src="images/bla.gif" align="left" alt="layout image 1"><br />
</td></tr>
<tr><td>
<h1>Welcome to my website</h1>
<p>This is my wonderful website with funky content and groovy images!</p>
</td></tr>
</table>
</body>
</html>
addthis_url = ‘http%3A%2F%2Fcallmebird.com%2Fweblog%2Fcreate-tableless-layout’;
addthis_title = ‘%E0%B8%AA%E0%B8%A3%E0%B9%89%E0%B8%B2%E0%B8%87+Tableless+Layout+%E0%B8%94%E0%B9%89%E0%B8%A7%E0%B8%A2+div+%E0%B9%81%E0%B8%A5%E0%B8%B0+stylesheet’;
addthis_pub [...]
About this blog
callmebird is Bird's weblog. Bird is blogger who spend life for programming and web technology. This weblog provide web technology article for anyone who love web programming and web design.
Flickr PhotoStream
Recent Comments