画像を使用しないHTMLキャプチャ

テーブルキャプチャHTML

このテストは、通常のHTMLテーブルに基づいています。 原則は次のとおりです。

• 1.文字の色のリストが設定されます-テーブルのセル
• 2.背景の色のリストが設定されています-テーブルのセル

このようなテーブルの解析は、テキストとセルの色をいつでも変更したり、表示されている文字の数を変更したりできるため、非常に困難です。
ユーザーが入力したデータは、「INPUT」要素の非表示フィールドを介して他の多くのキャプチャで実装されているのではなく、セッション変数を介して送信されます


まず、データベースにテーブルを作成します


セミコロンで区切られた各数字は、文字の背景を持つ影付きの正方形（テーブルセル）の座標です。

コードを取得するクラス

<?php class class_get_robot_code { var $amount_letter;//  var $general_keycode; function view_letter($code,$letter_size,$td_size,$sdvig) { $arr_bgcolor_letter = array("#07078F","#01354F","#000000","#013E7A","#0C0C42","#013737","#1E0636","#1C1C34","#353546"); $arr_bgcolor = array("#D3D3FF","#BBBBBB","#D5DEEF","#BAC2D3","#80C5E7","#B9AEAE","#C9ECEC","#9DBAD7","#EFD5E8","#E1E7CB"); $arr_yx = explode(";",$code); $arr_y = array(); $arr_x = array(); $size_of_arr_xy = sizeof($arr_yx); for($n=0;$n<$size_of_arr_xy;$n++) { $arr_y[$n]=substr($arr_yx[$n],0,1); $arr_x[$n]=substr($arr_yx[$n],1,1)+$sdvig; } ?> <table border="0" cellpadding="0" cellspacing="0"> <?php for($i=1;$i<=5*$letter_size;$i++) { ?> <tr> <td></td> <?php for($j=1;$j<=5*$letter_size;$j++) { $n_color = rand(0,sizeof($arr_bgcolor)-1); $bgcolor = $arr_bgcolor[$n_color]; for($n=0;$n<$size_of_arr_xy;$n++) { if(($i==$arr_y[$n]) && ($j==$arr_x[$n])) { $n_color = rand(0,sizeof($arr_bgcolor_letter)-1); $bgcolor = $arr_bgcolor_letter[$n_color]; } } ?> <td bgcolor="<?php echo $bgcolor;?>" width="3" height="3"></td> <?php } ?> <td></td> </tr> <?php } ?> </table> <?php } function get_get_robot_code() { $general_keycode=""; //          //          $db = new db_mysql(); $db->trashdb_sql(); $db->connect(); $query_string="select symbol,code from antirobot"; $result=$db->query($query_string); //         $amount_rec = $db->num_rows($result); $arr_symbols=array(); if($amount_rec>0) { for($j=1;$j<=$amount_rec;$j++) { $main_arr = $db->fetch_array($result); $arr_symbols[$j-1]= array($main_arr["symbol"],$main_arr["code"]); } } $size_of_main_arr = sizeof($arr_symbols); ?> <table border="0" cellpadding="0" cellspacing="0"> <tr> <?php for($j=1;$j<=$this->amount_letter;$j++) { ?> <td> <?php $random_letter = rand(0,$size_of_main_arr-1); $arr_letter = $arr_symbols[$random_letter]; $this->general_keycode.=$arr_letter[0]; $letter_size = rand(1,1); $td_size = rand(3,3); $sdvig=0; $this->view_letter($arr_letter[1],$letter_size,$td_size,$sdvig); ?> </td> <?php } ?> </tr> </table> <?php } } ?> 

呼び出しにはコードを使用します

 session_start(); //      captcha $class_get_robot_code->amount_letter=6; $class_get_robot_code->get_get_robot_code(); $_SESSION['answer_key'] = $class_get_robot_code->general_keycode; session_commit(); 

このコードは、ajax経由で呼び出すことができます。

このデザインをサイトで使用した
www.trashjob.ru

ワードプレスで使用するための適応オプションもあります。 このために、3つのファイルを作成しました。

• comments.php-コメント中のスパムから保護するためのファイル
• html-captcha.php-captcha設定フォームファイル
• html-captcha.classes.php-captchaクラスファイル

comments.php

 <code> <?php /****** HTML Captcha Spam Protection Plugin ******/ if (function_exists('hc_spam_protection')) { $hc_opt = get_option('plugin_htmlcaptcha'); ?> <p> <table> <tr><td> <input type="text" aria-required="true" tabindex="6" size="22" value="ANTISPAN (Required)" name="<?php echo $hc_opt['hc_opt_fieldname_useranswer'];?>" id="<?php echo $hc_opt['hc_opt_fieldname_useranswer'];?>" onfocus="if(this.value=='ANTISPAN (Required)') this.value='';" onblur="if(this.value=='') this.value='ANTISPAN (Required)';" style="background:none repeat scroll 0 0 #F3FBFF; border:1px solid #CEE0E4; font-family:Helvetica,Arial,sans-serif; font-size:13px; padding:7px 5px;"/> </td> <td style="padding-bottom: 5px;"> <small>     . (  )</small> <? hc_spam_protection();?> </td></tr> </table> </p> <?php } // if function_exists... ?> 

html-captcha.php

 <?php /* Plugin Name: html Captcha Plugin URI: http://www.fishbeer.ru/htmlCaptcha Description: Captcha html. Version: 1.0 Author: Njabulo Jahra Author URI: http://www.trashjob.ru $hc_info['install_dir'] = ABSPATH . 'wp-content/plugins'; if ( basename(dirname(__FILE__)) != 'plugins' ) $hc_info['install_dir'] .= '/' . basename(dirname(__FILE__)); # Include the class and create object if ( !class_exists('htmlCaptcha') ) include_once($hc_info['install_dir'] . '/html-captcha.classes.php'); $hc_Obj = new htmlCaptcha; # Get settings $hc_opt = get_option('plugin_htmlcaptcha'); function hc_spam_protection() { global $hc_Obj,$hc_opt, $user_ID; // Set class options if(isset($user_ID)) { //echo $user_ID; $hc_Obj->amount_letter = $hc_opt['hc_opt_amount_letter_register']; } else { $hc_Obj->amount_letter = $hc_opt['hc_opt_amount_letter']; } $hc_Obj->letter_color = $hc_opt['hc_opt_color_letter']; $hc_Obj->bg_letter_color = $hc_opt['hc_opt_bgcolor_letter']; //echo $hc_opt['hc_opt_amount_letter']; $hc_Obj->get_get_robot_code(); //$_POST['answer_key']=$hc_Obj->general_keycode; $_SESSION['answer_key']=$hc_Obj->general_keycode; //echo $hc_Obj->dump_array($_SESSION); //echo $hc_opt['hc_opt_msg_no_answer']; return true; } /******************************************************************************* * Input validation. ******************************************************************************/ function hc_check_input($comment_data) { global $user_ID, $hc_opt; if ( ( $comment_data['comment_type'] == '' ) ) { // Do not check if the user is registered & do not check trackbacks/pingbacks // Get value user has entered $value_entered = $_POST[$hc_opt['hc_opt_fieldname_useranswer'] ]; //session_start(); if(isset($_SESSION['answer_key'])) { if ($value_entered==$_SESSION['answer_key']) { $result=''; } else { $result = 'Wrong answer'; unset($_SESSION['answer_key']); } } else { $result = 'No answer'; } //echo "result".$result; // Get input validation result //$result = $hc_Obj->InputValidation($actual_result, $value_entered); // DIE if there was an error. Apply filter for security reasons (strip JS code, etc.) //echo $hc_opt['hc_opt_msg_no_answer']; switch ($result) { case 'No answer': hc_aux_die( apply_filters('pre_comment_content', stripslashes($hc_opt['hc_opt_msg_no_answer'])) ); break; case 'Wrong answer': hc_aux_die( apply_filters('pre_comment_content', stripslashes($hc_opt['hc_opt_msg_wrong_answer'])) ); break; } } return $comment_data; } /******************************************************************************* * Apply plugin ******************************************************************************/ add_filter('preprocess_comment', 'hc_check_input', 0); $hc_db_version = "1.0"; $page_title = " HTML Captcha"; function hc_deinstall () { global $wpdb; $table_name = $wpdb->prefix . "antibot_codes"; $sql = "DROP TABLE " . $table_name; $results = $wpdb->query( $sql ); } function hc_install () { global $wpdb; global $hc_db_version; $table_name = $wpdb->prefix . "antibot_codes"; if($wpdb->get_var("show tables like '$table_name'") != $table_name) { $sql = "CREATE TABLE " . $table_name . " ( id int(2) NOT NULL AUTO_INCREMENT, symbol char(1) NOT NULL DEFAULT '', code char(50) NOT NULL DEFAULT '', PRIMARY KEY (`id`) ) DEFAULT CHARSET=utf8 AUTO_INCREMENT=22;"; require_once(ABSPATH . 'wp-admin/includes/upgrade.php'); dbDelta($sql); $insert = " INSERT INTO " . $table_name ." (`id`, `symbol`, `code`) VALUES (1, 'B', '11;12;13;21;24;31;32;33;41;44;51;52;53;54'), (2, 'A', '11;12;13;14;21;24;31;34;41;42;43;44;51;54'), (3, 'T', '11;12;13;22;32;42;52'), (7, 'L', '11;21;31;41;44;51;52;53;54;'), (5, '1', '13;22;23;33;43;52;53;54'), (6, '4', '11;13;21;23;31;32;33;34;43;53'), (8, 'H', '11;14;21;24;31;32;33;34;41;44;51;54'), (9, '8', '11;12;13;14;21;24;31;32;33;34;41;44;51;52;53;54'), (10, 'P', '11;12;13;14;21;24;31;32;33;34;41;51'), (11, 'C', '11;12;13;14;21;24;31;41;44;51;52;53;54'), (12, '9', '11;12;13;14;21;24;31;32;33;34;44;51;52;53;54'), (13, '2', '11;12;13;14;21;24;33;34;42;51;52;53;54'), (14, 'F', '11;12;13;14;21;31;32;33;41;51'), (15, 'K', '11;14;21;23;31;32;41;43;51;54'), (16, 'E', '11;12;13;14;21;31;32;33;41;51;52;53;54'), (17, 'G', '11;12;13;14;21;31;33;34;41;44;51;52;53;54'), (18, 'R', '11;12;13;14;21;24;31;32;33;34;41;43;51;54'), (21, 'J', '12;13;14;24;34;41;44;52;53'); "; $results = $wpdb->query( $insert ); add_option("jal_db_version", $hc_db_version); } } function hc_add_options_to_admin() { if (function_exists('add_options_page')) { add_options_page('HTML Captcha', 'HTML Captcha', 8, basename(__FILE__), 'hc_options_subpanel'); } } // This will add the new item, 'Math Comment Spam', to the Options menu. function hc_options_subpanel() { $tmp_noanswer = '<p align="center"> <strong>:</strong>      . </p>'; $tmp_wronganswer = '<p align="center"> <strong>:</strong>    ,     . </p>'; $optionarray_def = array( 'hc_opt_amount_letter' => 5, 'hc_opt_amount_letter_register' => 2, 'hc_opt_color_letter' => '#07078F,#01354F,#000000,#013E7A,#0C0C42,#013737,#1E0636,#1C1C34,#353546', 'hc_opt_bgcolor_letter' => '#D3D3FF,#BBBBBB,#D5DEEF,#BAC2D3,#80C5E7,#B9AEAE,#C9ECEC,#9DBAD7,#EFD5E8,#E1E7CB', 'hc_opt_msg_no_answer' => $tmp_noanswer, 'hc_opt_msg_wrong_answer' => $tmp_wronganswer, 'hc_opt_fieldname_useranswer' => 'hc_value' ); add_option('plugin_htmlcaptcha', $optionarray_def, 'HTML Captcha Plugin Options'); /* Check form submission and update options if no error occurred */ if (isset($_POST['submit']) ) { ### SECURING FORMS ### /* if ( function_exists('current_user_can') && !current_user_can('manage_options') ) die(__('Cheatin' uh?')); check_admin_referer( $mcsp_nonce );*/ ### SECURING FORMS ### $optionarray_update = array ( 'hc_opt_amount_letter' => $_POST['hc_opt_amount_letter'], 'hc_opt_amount_letter_register' => $_POST['hc_opt_amount_letter_register'], 'hc_opt_color_letter' => $_POST['hc_opt_color_letter'], 'hc_opt_bgcolor_letter' => $_POST['hc_opt_bgcolor_letter'], 'hc_opt_msg_no_answer' => $_POST['hc_opt_msg_no_answer'], 'hc_opt_msg_wrong_answer' => $_POST['hc_opt_msg_wrong_answer'], 'hc_opt_fieldname_useranswer' => $_POST['hc_opt_fieldname_useranswer'] ); update_option('plugin_htmlcaptcha', $optionarray_update); } $optionarray_def = get_option('plugin_htmlcaptcha'); ?> <!-- ##############################   ################### --> <div class="wrap"> <form name="hc_options_form" method="post" action="<?php echo $_SERVER['PHP_SELF'] . '?page=' . basename(__FILE__); ?>&updated=true"> <fieldset class="options"> <p style="margin-left: 5px; color: #555; font-size: .85em;"> <label for="hc_opt_amount_letter">   :</label> <input name="hc_opt_amount_letter" type="text" id="hc_opt_amount_letter" value="<?php echo $optionarray_def['hc_opt_amount_letter']; ?>" size="2" /> <br /> <label for="hc_opt_amount_letter_register">   :</label> <input name="hc_opt_amount_letter_register" type="text" id="hc_opt_amount_letter_register" value="<?php echo $optionarray_def['hc_opt_amount_letter_register']; ?>" size="2" /> <br /> <label for="hc_opt_color_letter">   :</label> <br /><input name="hc_opt_color_letter" type="text" id="hc_opt_color_letter" value="<?php echo $optionarray_def['hc_opt_color_letter']; ?>" size="100" /> <br /> <label for="hc_opt_bgcolor_letter">     :</label> <br /><input name="hc_opt_bgcolor_letter" type="text" id="hc_opt_bgcolor_letter" value="<?php echo $optionarray_def['hc_opt_bgcolor_letter']; ?>" size="100" /> </p> </fieldset> <!-- ****************** Field Names ****************** --> <fieldset class="options"> <p style="margin-left:5px; color: #555; font-size: .85em;"> <label for="hc_opt_fieldname_useranswer">  :</label> <br /><input name="hc_opt_fieldname_useranswer" type="text" id="hc_opt_fieldname_useranswer" value="<?php echo $optionarray_def['hc_opt_fieldname_useranswer']; ?>" size="30" /> </p> </fieldset> <!-- ****************** Error Messages ****************** --> <fieldset class="options"> <!-- No Answer --> <p style="margin-left: 5px; color: #555; font-size: .85em;"> ,      : </p> <textarea style="margin-left: 5px" name="hc_opt_msg_no_answer" id="hc_opt_msg_no_answer" cols="100%" rows="3"><?php echo htmlspecialchars(stripslashes($optionarray_def['hc_opt_msg_no_answer'])); ?></textarea> <!-- Wrong Answer --> <p style="margin-left: 5px; color: #555; font-size: .85em;"> ,   ,     : </p> <textarea style="margin-left: 5px" name="hc_opt_msg_wrong_answer" id="hc_opt_msg_wrong_answer" cols="100%" rows="3"><?php echo htmlspecialchars(stripslashes($optionarray_def['hc_opt_msg_wrong_answer'])); ?></textarea> </fieldset> <div class="submit"> <input type="submit" name="submit" value="<?php _e(' ') ?> »" /> </div> </form> </div> <? } function hc_aux_die($message) { if ( function_exists('wp_die') ) { wp_die($message); } else { die($message); } } register_activation_hook(__FILE__,'hc_install'); register_deactivation_hook(__FILE__,'hc_deinstall'); add_action('admin_menu', 'hc_add_options_to_admin'); ?> 

html-captcha.classes.php

 <?php class htmlCaptcha { var $amount_letter;//  var $general_keycode;//    var $letter_color;//  var $bg_letter_color;//   function dump_array($array) { if(is_array($array)) { $size = count($array); $string = ""; if($size) {$count=0; $string.="{"; foreach($array as $var => $value) {$string.="$var=$value"; if($count++<($size-1)) {$string.=", ";}} $string.="}";} return $string; } else { return $array; } } function view_letter($code,$letter_size,$td_size,$sdvig) { $arr_bgcolor_letter = explode(',',$this->letter_color); $arr_bgcolor = explode(',',$this->bg_letter_color); //$arr_bgcolor_letter = array("#07078F","#01354F","#000000","#013E7A","#0C0C42","#013737","#1E0636","#1C1C34","#353546"); //$arr_bgcolor = array("#D3D3FF","#BBBBBB","#D5DEEF","#BAC2D3","#80C5E7","#B9AEAE","#C9ECEC","#9DBAD7","#EFD5E8","#E1E7CB"); $arr_yx = explode(";",$code); $arr_y = array(); $arr_x = array(); $size_of_arr_xy = sizeof($arr_yx); for($n=0;$n<$size_of_arr_xy;$n++) { $arr_y[$n]=substr($arr_yx[$n],0,1); $arr_x[$n]=substr($arr_yx[$n],1,1)+$sdvig; } ?> <table border="0" cellpadding="0" cellspacing="0"> <?php for($i=1;$i<=5*$letter_size;$i++) { ?> <tr> <td></td> <?php for($j=1;$j<=5*$letter_size;$j++) { $n_color = rand(0,sizeof($arr_bgcolor)-1); $bgcolor = $arr_bgcolor[$n_color]; for($n=0;$n<$size_of_arr_xy;$n++) { if(($i==$arr_y[$n]) && ($j==$arr_x[$n])) { $n_color = rand(0,sizeof($arr_bgcolor_letter)-1); $bgcolor = $arr_bgcolor_letter[$n_color]; } } ?> <td bgcolor="<?php echo $bgcolor;?>" width="3" height="3"></td> <?php } ?> <td></td> </tr> <?php } ?> </table> <?php } function get_get_robot_code() { global $wpdb; //echo $this->amount_letter; $table_name = $wpdb->prefix . "antibot_codes"; $general_keycode=""; //$db = new db_mysql(); //$db->trashdb_sql(); $db->connect(); $query_string="select symbol,code from " . $table_name; $result=$wpdb->get_results($query_string,'ARRAY_A'); //echo $this->dump_array($result)."<br>"; $amount_rec = $wpdb->num_rows; //echo $amount_rec; $arr_symbols=array(); if($amount_rec>0) { $j=-1; foreach($result as $main_arr) { $j++; //echo "main_arr: ".$this->dump_array($main_arr)."<br>"; //echo $j; $arr_symbols[$j] = array($main_arr["symbol"],$main_arr["code"]); } } //echo "arr_symbols: ".$this->dump_array($arr_symbols)."<br>"; $size_of_main_arr = sizeof($arr_symbols); //echo "size".$size_of_main_arr; ?> <table border="0" cellpadding="0" cellspacing="0"> <tr> <?php for($j=1;$j<=$this->amount_letter;$j++) { ?> <td> <?php $random_letter = rand(0,$size_of_main_arr-1); $arr_letter = $arr_symbols[$random_letter]; $this->general_keycode.=$arr_letter[0]; $letter_size = rand(1,1); $td_size = rand(3,3); $sdvig=0; $this->view_letter($arr_letter[1],$letter_size,$td_size,$sdvig); ?> </td> <?php } //echo $this->general_keycode; ?> </tr> </table> <?php } } ?> 

wordpressのプラグイン設定は次のようになります。


html-captchaをインストールする

• 1. html-Captchaフォルダーをアーカイブからサイトのプラグインディレクトリにコピーします（例：wp-content / plugins）
• 2. WordPress管理パネルのプラグインインストールページから、プラグインをアクティブにします
• 3.プラグイン設定ページに移動し、必要なパラメーターを設定します（デフォルトでは既に設定されています。不明な場合はタッチしないでください）。
• 4.アーカイブからcomments.phpファイルを開き、そこに記述されているすべてのコードをクリップボードにコピーします。
• 5.コピーしたコードをテンプレートのcomments.phpファイルのSUBMITボタンが割り当てられている場所（「送信」）に貼り付けます
• 6.ルートwordpressフォルダーにあるwp-config.phpファイルの最初にコードを貼り付けます

これは、生成後にページで取得されたCaptchaコードです。

 <table border="0" cellpadding="0" cellspacing="0"> <tbody> <tr> <td> <table border="0" cellpadding="0" cellspacing="0"> <tbody> <tr> <td></td> <td bgcolor="#0C0C42" width="3" height="3"></td> <td bgcolor="#BAC2D3" width="3" height="3"></td> <td bgcolor="#1C1C34" width="3" height="3"></td> <td bgcolor="#E1E7CB" width="3" height="3"></td> <td bgcolor="#EFD5E8" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#0C0C42" width="3" height="3"></td> <td bgcolor="#9DBAD7" width="3" height="3"></td> <td bgcolor="#0C0C42" width="3" height="3"></td> <td bgcolor="#9DBAD7" width="3" height="3"></td> <td bgcolor="#80C5E7" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#07078F" width="3" height="3"></td> <td bgcolor="#353546" width="3" height="3"></td> <td bgcolor="#353546" width="3" height="3"></td> <td bgcolor="#1E0636" width="3" height="3"></td> <td bgcolor="#C9ECEC" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#B9AEAE" width="3" height="3"></td> <td bgcolor="#C9ECEC" width="3" height="3"></td> <td bgcolor="#07078F" width="3" height="3"></td> <td bgcolor="#BBBBBB" width="3" height="3"></td> <td bgcolor="#C9ECEC" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#80C5E7" width="3" height="3"></td> <td bgcolor="#B9AEAE" width="3" height="3"></td> <td bgcolor="#353546" width="3" height="3"></td> <td bgcolor="#EFD5E8" width="3" height="3"></td> <td bgcolor="#D3D3FF" width="3" height="3"></td> <td></td> </tr> </tbody> </table> </td> <td> <table border="0" cellpadding="0" cellspacing="0"> <tbody> <tr> <td></td> <td bgcolor="#013E7A" width="3" height="3"></td> <td bgcolor="#C9ECEC" width="3" height="3"></td> <td bgcolor="#D3D3FF" width="3" height="3"></td> <td bgcolor="#013E7A" width="3" height="3"></td> <td bgcolor="#B9AEAE" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#013E7A" width="3" height="3"></td> <td bgcolor="#E1E7CB" width="3" height="3"></td> <td bgcolor="#000000" width="3" height="3"></td> <td bgcolor="#E1E7CB" width="3" height="3"></td> <td bgcolor="#80C5E7" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#013737" width="3" height="3"></td> <td bgcolor="#1E0636" width="3" height="3"></td> <td bgcolor="#E1E7CB" width="3" height="3"></td> <td bgcolor="#BBBBBB" width="3" height="3"></td> <td bgcolor="#EFD5E8" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#0C0C42" width="3" height="3"></td> <td bgcolor="#BAC2D3" width="3" height="3"></td> <td bgcolor="#0C0C42" width="3" height="3"></td> <td bgcolor="#D5DEEF" width="3" height="3"></td> <td bgcolor="#D3D3FF" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#07078F" width="3" height="3"></td> <td bgcolor="#EFD5E8" width="3" height="3"></td> <td bgcolor="#EFD5E8" width="3" height="3"></td> <td bgcolor="#0C0C42" width="3" height="3"></td> <td bgcolor="#EFD5E8" width="3" height="3"></td> <td></td> </tr> </tbody> </table> </td> <td> <table border="0" cellpadding="0" cellspacing="0"> <tbody> <tr> <td></td> <td bgcolor="#000000" width="3" height="3"></td> <td bgcolor="#BAC2D3" width="3" height="3"></td> <td bgcolor="#0C0C42" width="3" height="3"></td> <td bgcolor="#D5DEEF" width="3" height="3"></td> <td bgcolor="#C9ECEC" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#1C1C34" width="3" height="3"></td> <td bgcolor="#C9ECEC" width="3" height="3"></td> <td bgcolor="#1C1C34" width="3" height="3"></td> <td bgcolor="#9DBAD7" width="3" height="3"></td> <td bgcolor="#D3D3FF" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#000000" width="3" height="3"></td> <td bgcolor="#013E7A" width="3" height="3"></td> <td bgcolor="#013737" width="3" height="3"></td> <td bgcolor="#353546" width="3" height="3"></td> <td bgcolor="#9DBAD7" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#BAC2D3" width="3" height="3"></td> <td bgcolor="#9DBAD7" width="3" height="3"></td> <td bgcolor="#1C1C34" width="3" height="3"></td> <td bgcolor="#C9ECEC" width="3" height="3"></td> <td bgcolor="#80C5E7" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#C9ECEC" width="3" height="3"></td> <td bgcolor="#D3D3FF" width="3" height="3"></td> <td bgcolor="#353546" width="3" height="3"></td> <td bgcolor="#BAC2D3" width="3" height="3"></td> <td bgcolor="#E1E7CB" width="3" height="3"></td> <td></td> </tr> </tbody> </table> </td> <td> <table border="0" cellpadding="0" cellspacing="0"> <tbody> <tr> <td></td> <td bgcolor="#013E7A" width="3" height="3"></td> <td bgcolor="#01354F" width="3" height="3"></td> <td bgcolor="#07078F" width="3" height="3"></td> <td bgcolor="#013737" width="3" height="3"></td> <td bgcolor="#BAC2D3" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#07078F" width="3" height="3"></td> <td bgcolor="#D3D3FF" width="3" height="3"></td> <td bgcolor="#D5DEEF" width="3" height="3"></td> <td bgcolor="#07078F" width="3" height="3"></td> <td bgcolor="#E1E7CB" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#1C1C34" width="3" height="3"></td> <td bgcolor="#013737" width="3" height="3"></td> <td bgcolor="#013737" width="3" height="3"></td> <td bgcolor="#0C0C42" width="3" height="3"></td> <td bgcolor="#80C5E7" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#1C1C34" width="3" height="3"></td> <td bgcolor="#BAC2D3" width="3" height="3"></td> <td bgcolor="#C9ECEC" width="3" height="3"></td> <td bgcolor="#BAC2D3" width="3" height="3"></td> <td bgcolor="#EFD5E8" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#1C1C34" width="3" height="3"></td> <td bgcolor="#D3D3FF" width="3" height="3"></td> <td bgcolor="#EFD5E8" width="3" height="3"></td> <td bgcolor="#D3D3FF" width="3" height="3"></td> <td bgcolor="#D3D3FF" width="3" height="3"></td> <td></td> </tr> </tbody> </table> </td> <td> <table border="0" cellpadding="0" cellspacing="0"> <tbody> <tr> <td></td> <td bgcolor="#1E0636" width="3" height="3"></td> <td bgcolor="#353546" width="3" height="3"></td> <td bgcolor="#0C0C42" width="3" height="3"></td> <td bgcolor="#353546" width="3" height="3"></td> <td bgcolor="#BAC2D3" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#013737" width="3" height="3"></td> <td bgcolor="#9DBAD7" width="3" height="3"></td> <td bgcolor="#EFD5E8" width="3" height="3"></td> <td bgcolor="#000000" width="3" height="3"></td> <td bgcolor="#D5DEEF" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#07078F" width="3" height="3"></td> <td bgcolor="#B9AEAE" width="3" height="3"></td> <td bgcolor="#9DBAD7" width="3" height="3"></td> <td bgcolor="#013E7A" width="3" height="3"></td> <td bgcolor="#BAC2D3" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#0C0C42" width="3" height="3"></td> <td bgcolor="#000000" width="3" height="3"></td> <td bgcolor="#000000" width="3" height="3"></td> <td bgcolor="#353546" width="3" height="3"></td> <td bgcolor="#D3D3FF" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#013E7A" width="3" height="3"></td> <td bgcolor="#D3D3FF" width="3" height="3"></td> <td bgcolor="#9DBAD7" width="3" height="3"></td> <td bgcolor="#07078F" width="3" height="3"></td> <td bgcolor="#9DBAD7" width="3" height="3"></td> <td></td> </tr> </tbody> </table> </td> <td> <table border="0" cellpadding="0" cellspacing="0"> <tbody> <tr> <td></td> <td bgcolor="#353546" width="3" height="3"></td> <td bgcolor="#BBBBBB" width="3" height="3"></td> <td bgcolor="#01354F" width="3" height="3"></td> <td bgcolor="#D5DEEF" width="3" height="3"></td> <td bgcolor="#BAC2D3" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#353546" width="3" height="3"></td> <td bgcolor="#EFD5E8" width="3" height="3"></td> <td bgcolor="#013E7A" width="3" height="3"></td> <td bgcolor="#D3D3FF" width="3" height="3"></td> <td bgcolor="#C9ECEC" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#000000" width="3" height="3"></td> <td bgcolor="#353546" width="3" height="3"></td> <td bgcolor="#01354F" width="3" height="3"></td> <td bgcolor="#1E0636" width="3" height="3"></td> <td bgcolor="#B9AEAE" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#E1E7CB" width="3" height="3"></td> <td bgcolor="#B9AEAE" width="3" height="3"></td> <td bgcolor="#07078F" width="3" height="3"></td> <td bgcolor="#BAC2D3" width="3" height="3"></td> <td bgcolor="#EFD5E8" width="3" height="3"></td> <td></td> </tr> <tr> <td></td> <td bgcolor="#BBBBBB" width="3" height="3"></td> <td bgcolor="#C9ECEC" width="3" height="3"></td> <td bgcolor="#01354F" width="3" height="3"></td> <td bgcolor="#EFD5E8" width="3" height="3"></td> <td bgcolor="#D5DEEF" width="3" height="3"></td> <td></td> </tr> </tbody> </table> </td> </tr> </tbody> </table> 

何らかの形で最適化することが可能かもしれません。
ワードプレスの既製のプラグインはこちらです： html-captcha
それを使用します。

PS。 建設的なコメントは興味深い。 habrのCaptchaは3回目からパスできました。 ;）