הדרך הנפוצה לעצב דפי אינטרנט היא בעזרת טבלאות. טבלאות מאפשרות חפוש פעולה גדול וניצול טוב של המרחב בדף. מבנה בסיסי של טבלה נראה כך:

1 2 3 4 5 6 7 8 9 10 11 12 13

<table border="1"> <tr>     <th>תא ראשון</th>     <th>תא שני</th> </tr> <tr>     <td>שורה ראשונה, תא ראשון</td>     <td>שורה ראשונה, תא שני</td> <tr>     <td>שורה שניה, תא ראשון</td>     <td>שורה שניה, תא שני</td> </tr> </table>

וככה זה נראה בדף:

כותרת

תא ראשון	תא שני
שורה ראשונה, תא ראשון	שורה ראשונה, תא שני
שורה שניה, תא ראשון	שורה שניה, תא שני

התג <table> יוצר את הטבלה.
התג <caption> יוצר כותרת לטבלה.
התג <tr> יוצר שורה בטבלה.
התג <td> יוצר תא בתוך השורה.
התג <th> יוצר כותרת לעמודה. הוא מאוד דומה לתג <td>, רק שבו הטקסט מודגש ומיושר למרכז.

שימו לב שמספר התאים בשורות חייב להתאים, אחרת זה יראה ככה:

שורה ראשונה, תא ראשון	שורה ראשונה, תא שני
שורה שניה, תא ראשון

כמו כן, אסור להשאיר תאים ריקים בתוך טבלה, זה יצור את אותו האפקט בדיוק. במידה ויש צורך להשאיר תא שאין בו טקסט,יש להשתמש באלמנט &nbsp; האלמנט הזה יוצר תו רווח, ויגרום לטבלה להראות בסדר. שימו לב שרווח רגיל לא יעשה את זה.

מאפייני התג <table> הם:

border קובע את עובי הגבול של הטבלה, ומקבל ערך בפיקסלים.
bordercolor קובע את צבע הגבול של הטבלה, מקבל ערכים בשמות צבעים או בפורמט RGB.
bordercolordark קובע את הצבע הכהה של הגבול, מקבל ערכים בשמות צבעים או בפורמט RGB.
bordercolorlight קובע את הצבע הבהיר של הגבול, מקבל ערכים בשמות צבעים או בפורמט RGB.
bgcolor קובע את צבע הרקע של הטבלה, מקבל ערכים בשמות צבעים או בפורמט RGB.
background קובע תמונה שתשמש כרקע לטבלה, מקבל, כמובן, נתיב לתמונה.
align קובע את מיקום הטבלה על המסך, מקבל אחד מהערכים left, center או right.
width קובע את רוחב הטבלה. מקבל ערכים בפיקסלים או באחוזים מרוחב הדף.
height קובע את גובה הטבלה. מקבל ערכים בפיקסלים.
cellpadding קובע רווח בין תוכן התא לגבול התא, מקבל ערכים בפיקסלים.
cellspacing קובע רווח בין התאים, מקבל ערכים בפיקסלים.

מאפייני התג <tr> הם:

align קובע את מיקום הטקסט בתוך השורה, מקבל אחד מהערכים left, center או right.
bgcolor קובע את צבע הרקע של השורה.
bordercolor קובע את צבע הגבול של השורה.
bordercolordark קובע את הצבע הכהה של גבול השורה.
bordercolorlight קובע את הצבע הבהיר של גבול השורה.
height קובע את גובה השורה.
valign קובע את המיקום האנכי של טקסט בשורה, מקבל אחד מהערכים top, middle, bottom או baseline.

מאפייני התג <td> הם:

background קובע תמונת רקע לתא, מקבל נתיב של תמונה, כמובן.
align קובע את מיקום הטקסט בתוך התא, מקבל אחד מהערכים left, center או right.
bgcolor קובע את צבע הגבול של התא.
bordercolor קובע את צבע הגבול של התא.
bordercolordark קובע את הצבע הכהה של גבול התא.
bordercolorlight קובע את הצבע הבהיר של גבול התא.
width קובע את רוחב התא, מקבל ערכים בפיקסלים.
height קובע את גובה התא, מקבל ערכים בפיקסלים.
valign קובע את המיקום האנכי של טקסט בתא, מקבל אחד מהערכים top, middle, bottom או baseline.
nowrap כשהמאפיין הזה מצוין, השורות בתא לעולם לא "ישברו" מחוסר מקום, אלא יפתח פס גלילה אופקי. המאפיין nowrap לא מקבל שום ערך, אלא מספיק שהוא מצויין בתג.
colspan מקבל מספר תאים לרוחב הטבלה, שהתא הנוכחי יתפוס.
rowspan מקבל מספר תאים לגובה הטבלה, שהתא הנוכחי יתפוס.

בעזרת המאפיינים colspan ו rowspan, ניתן ליצור טבלאות מתוחכמות יותר. טבלה כזאת, לדוגמא, אפשרית רק בעזרת colspan:

שורה ראשונה, תא ראשון	שורה ראשונה, תא שני
שורה שניה, התא היחיד.

ככה נראה הקוד של הטבלה הזאת:

1 2 3 4 5 6 7 8 9

<table border="1"> <tr>     <td>שורה ראשונה, תא ראשון</td>     <td>שורה ראשונה, תא שני</td> </tr> <tr>     <td colspan="2" align="center">שורה שניה, התא היחיד</td> </tr> </table>